Home Explore Help
Sign In
brwong
/
playlist-extension
Watch 1
Star 0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Branch: master
Branches Tags
playlist-ext...
/
2026-06-08-claude-move-video-between-playlists.md

2026-06-08-claude-move-video-between-playlists.md 2.9 KB
Permalink History Raw

Move Video Between Playlists

Date: 2026-06-08

User Request

I would like the option of moving a video in one playlist to a different playlist (while maintaining the guarantee that a video will be in at most one playlist). what would you recommend to support this action in the UI?

What Was Done

Added a "Move to…" entry to the ⋯ more menu in the playlist detail view (single-playlist view). Clicking it expands an inline sub-list of the other five playlists; selecting one atomically removes the video from the current playlist and appends it to the target.

Files Changed

popup/popup.js

  • Added moveSubmenuOpenFor: null state (tracks which video's move submenu is open by menuId key)
  • Added otherPlaylists: [] state (array of {name, display} objects for the other playlists)
  • Updated updateCurrentPlaylistVideos() to recompute otherPlaylists using formatPlaylistName() for display labels
  • Added async moveVideoToPlaylist(fromPlaylistName, videoIndex, toPlaylistName) — splices video from source array, appends to target, single storage.set call (preserves video object including status)
  • Updated closeAllMenus() and toggleMenu() to reset moveSubmenuOpenFor
  • Added three new binding objects: moveToSubmenuButton (toggle), moveToSubmenu (x-show), moveToPlaylistButton (execute move)

popup/popup.html

  • Added "Move to…" button and collapsible sub-list inside the playlist detail view's ⋯ more menu, after the Remove button
  • Sub-list uses x-for="pl in otherPlaylists" with x-text="pl.display" and data-to-playlist-name="pl.name"

popup/popup.css

  • Added styles for .move-to-playlist-item, .move-to-submenu (separator border), and .move-to-playlist-option (indented, blue text with hover)

Follow-up Request (2026-06-10)

copy the "move" button to the triple-dot menu on the main screen, not just the playlist view screen

Added the same "Move to…" button and submenu to the ⋯ more menu in the main playlists view. Each playlistData object in playlistsForDisplay now carries its own otherPlaylists array (computed in updatePlaylistsForDisplay()), so the x-for="pl in playlistData.otherPlaylists" loop in the main view template has the correct per-playlist options without needing any inline expressions.

Additional files changed: popup/popup.js (updatePlaylistsForDisplay), popup/popup.html (main playlists view more menu)

Design Notes

  • The one-playlist-per-video invariant is maintained because moveVideoToPlaylist splices from the source before appending to the target in a single atomic storage write — no window where the video exists in two playlists
  • Video status (done, timestamp) is preserved on move
  • All Alpine.js bindings are CSP-compliant (property accesses only, no inline expressions)
  • otherPlaylists is pre-computed with formatted display names so x-text="pl.display" needs no method call in the template