Changeset 230e446 in Klonkt for src/services/AudioEmbedService.js

Timestamp:

06/20/2026 01:38:16 AM (3 months ago)

Author:

roboburr <roboburr@…>

Branches:

main

Children:

fa08981

Parents:

d188736

Message:

feat(player): mini-player jumps to post AND scrolls to the track (desktop)

Track embed gets id="track-<id>" (anchor) + id in the track JSON. goToPost
now carries the track id: after the htmx swap to the post it scrolls to the
track embed (block:center, smooth) with a brief highlight, instead of
scrolling to the top. Busters: audio-player.js?v=17, style.css?v=16.

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

File:

• src/services/AudioEmbedService.js (modified) (2 diffs)

src/services/AudioEmbedService.js

@@ -248 +248 @@
       if (!t || !t.url) return match;
       const trackJson = JSON.stringify({
+        id,
         url: t.url,
         title: t.title || 'Untitled',
@@ -258 +259 @@
       const dataAttr = trackJson
         .replace(/&/g, '&amp;').replace(/'/g, '&#39;').replace(/</g, '&lt;');
-      return `<div class="post-audio-track" data-pcms-track-url="${urlH}" data-pcms-track='${dataAttr}'>
+      // id="track-<id>" = anker zodat de mini-speler hierheen kan scrollen.
+      return `<div class="post-audio-track" id="track-${id}" data-pcms-track-id="${id}" data-pcms-track-url="${urlH}" data-pcms-track='${dataAttr}'>
   <button type="button" class="pat-play" aria-label="Play ${titleH}">
     <svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M8 4l12 8-12 8z"/></svg>