# Drag and Drop Playlist Reordering Implementation

## Task
Add drag-and-drop functionality to reorder videos in a playlist when editing

## Steps Completed

1. [x] Add SortableJS library to the project (via CDN in the view)
2. [x] Update playlist show.blade.php to add drag-and-drop functionality
3. [x] Add CSS styles for drag-and-drop visual feedback
4. [x] Implement playlist sidebar when playing from playlist (no up-next recommendations)

## Implementation Complete ✅

### Backend (Already existed - no changes needed)
- Route: `PUT /playlists/{playlist}/reorder` - accepts `video_ids` array
- Controller: `PlaylistController::reorder()` - calls `playlist->reorderVideos()`
- Model: `Playlist::reorderVideos()` - updates position for each video

### Frontend Changes Made (Playlist Show Page)
- Added SortableJS via CDN in `show.blade.php`
- Added drag handles (grip icon) to each video item for users who can edit
- Added CSS styles for drag-and-drop visual feedback (ghost, chosen, drag classes)
- Added JavaScript to initialize Sortable on the video list container
- On `onEnd` event, collects new order and sends AJAX to reorder endpoint
- Position numbers update visually after reorder

### Video Player Page Changes (Sidebar)
- Updated VideoController to detect playlist context from `?playlist=` parameter
- Updated all video type views (generic, music, match, show) to show playlist videos in sidebar when viewing from playlist
- Shows playlist name and video count in sidebar header
- Shows position numbers on each video thumbnail
- Links preserve the playlist parameter for continuous playback
- Shows "Edit Playlist" button for playlist owners