Fix playlist controls: add to type-specific views (music, generic, match)

Controls were only added to show.blade.php, but music/generic/match videos
render their own complete layouts with their own sidebars. Added the
pl-controls-bar to all three type views and the global CSS to app.blade.php.

- music: full standalone JS with shuffle/loop/autoplay + _plOnTrackEnd hook
- generic/match: syncs with video-player's existing ytpShuffleRow/ytpAutoplayRow toggles
- audio-player: ended handler now calls window._plOnTrackEnd if defined
- video-player: exposes window._ytpNav.next/prev for sidebar prev/next buttons

Co-Authored-By: Claude Sonnet 4.6 <[email protected]>
This commit is contained in:
ghassanandClaude Sonnet 4.6 committed 2026-05-16 11:45:33 +03:00
1 parent 05db0e128a
commit 99f71c54e5
6 files changed
+217 -4

No files matched your search

+33
View File
@@ -789,6 +789,39 @@
border-color: #ef4444 !important;
box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.2);
}
/* ── Playlist controls bar (sidebar, all video types) ── */
.pl-controls-bar {
display: flex;
align-items: center;
gap: 4px;
margin-bottom: 10px;
padding: 6px 8px;
background: var(--bg-secondary);
border-radius: 8px;
border: 1px solid var(--border-color);
flex-shrink: 0;
}
.pl-ctrl-btn {
display: flex;
align-items: center;
gap: 5px;
background: none;
border: none;
color: var(--text-secondary);
cursor: pointer;
padding: 5px 8px;
border-radius: 6px;
font-size: 15px;
transition: color .15s, background .15s;
white-space: nowrap;
}
.pl-ctrl-btn:hover:not(:disabled) { color: var(--text-primary); background: rgba(255,255,255,.07); }
.pl-ctrl-btn:disabled { opacity: .35; cursor: default; }
.pl-ctrl-btn.pl-ctrl-active { color: var(--brand-red); }
.pl-ctrl-divider { width: 1px; height: 18px; background: var(--border-color); margin: 0 2px; flex-shrink: 0; }
.pl-ctrl-autoplay { margin-left: auto; }
.pl-autoplay-label { font-size: 12px; font-weight: 500; }
</style>
@yield('extra_styles')