Changeset e056e56 in Klonkt

Timestamp:

06/20/2026 04:31:01 AM (3 months ago)

Author:

roboburr <roboburr@…>

Branches:

main

Children:

8d43aa1

Parents:

71e8fa5

Message:

fix(player): YT album via queue expansion (reliable playback)

loadPlaylist did not start reliably. Now a YT album expands into our own
queue of individual YT tracks (playYouTubeList) — each via loadVideoById
(proven) and next/prev/ended via our queue. busters audio-player.js?v=25,
embed-player.js?v=14.

Co-Authored-By: Claude <noreply@…>

Location:

src

Files:

• assets/js/audio-player.js (modified) (1 diff)
• assets/js/embed-player.js (modified) (1 diff)
• views/shell.ejs (modified) (1 diff)

src/assets/js/audio-player.js

@@ -968 +968 @@
   }
 
+  // Speel een YouTube-AFSPEELLIJST af door 'm te expanderen naar onze eigen queue
+  // van losse YouTube-tracks (elk via loadVideoById = bewezen betrouwbaar; next/
+  // prev/ended lopen via onze queue). items = [{yt,title,cover,postUrl}, …].
+  function playYouTubeList(items, startIndex) {
+    if (!Array.isArray(items) || !items.length) return;
+    setQueue(items.map((it) => ({
+      yt: it.yt,
+      title: it.title || 'YouTube',
+      artist: it.artist || '',
+      cover: it.cover || '',
+      postUrl: it.postUrl || '',
+    })), startIndex || 0);
+  }
+
   window.pcmsAudioPlayer = {
-    setQueue, play, pause, next, prev, close, openSheet, closeSheet, playYouTube,
+    setQueue, play, pause, next, prev, close, openSheet, closeSheet, playYouTube, playYouTubeList,
     isPlaying: () => isPlaying,
     currentTrack: () => queue[currentIndex] || null,

src/assets/js/embed-player.js

@@ -464 +464 @@
 
     function playAt(i) {
-      if (!(window.pcmsAudioPlayer && window.pcmsAudioPlayer.playYouTube)) return;
-      const tt = (olEl.querySelector(`[data-yt-index="${i}"] .pat-title`) || {}).textContent || '';
-      window.pcmsAudioPlayer.playYouTube({ list: listId, index: i, title: tt, cover: thumb(ids[i]), postUrl: location.pathname + location.search });
+      if (!(window.pcmsAudioPlayer && window.pcmsAudioPlayer.playYouTubeList)) return;
+      // Expandeer naar losse YT-tracks (betrouwbaarder dan loadPlaylist).
+      const items = ids.map((id, j) => ({
+        yt: id,
+        title: (olEl.querySelector(`[data-yt-index="${j}"] .pat-title`) || {}).textContent || ('Track ' + (j + 1)),
+        cover: thumb(id),
+        postUrl: location.pathname + location.search,
+      }));
+      window.pcmsAudioPlayer.playYouTubeList(items, i);
     }
     coverBtn.addEventListener('click', () => playAt(0));

src/views/shell.ejs

@@ -300 +300 @@
      ?v=N — cache-buster: bump bij elke audio-player.js wijziging zodat
      Cloudflare (max-age=1y) niet de oude versie blijft serveren. -->
-<script src="/assets/js/audio-player.js?v=24"></script>
+<script src="/assets/js/audio-player.js?v=25"></script>
 <!-- Eigen custom media-embeds (YouTube/SoundCloud/Spotify) via de echte
      player-API's + gedeelde mutual-exclusion registry met de site-speler. -->
-<script src="/assets/js/embed-player.js?v=13" defer></script>
+<script src="/assets/js/embed-player.js?v=14" defer></script>
 <% if (site && site.enable_audio_player && audioTracks && audioTracks.length > 0) { %>
   <script>window.PCMS_SITE_TRACKS = <%- JSON.stringify(audioTracks) %>;</script>