dsh-music-player 0.6.2 → 0.6.4

package/README.md

@@ -12,7 +12,7 @@ DeepSeek Harness 本地音乐/小说播放插件。
 
 - 本地音频流式播放（HTTP Range），刷新后断点续播
 - 顺序播放、单曲循环、乱序播放三种模式
-- 实时 8 段频谱可视化（真实 FFT 频段，解码时离线计算、跟随播放位置）
+- 实时 12 段频谱可视化（真实 FFT 频段：浏览器支持时走 `captureStream()`+`AnalyserNode` **只读旁路**实时采样、t=0 即响应——它不重定向媒体元素输出，因此绝不会让播放静音；若该环境报 Chromium 的 `getTopURL` 媒体管线错误、取不到音轨，则回退到解码时离线预计算的包络，跟随播放位置）。实时柱高把各频段的 bin 归到对数频段取峰值、按分析器 dB 量程归一化（标准做法），柱高由**绝对响度**驱动（安静时柱自然低），并用一条**固定、与响度无关的频率加权**抹平音乐天然的 1/f 低频倾斜——低频几根不再常年钉在高位，同时安静片段也保持低柱；离线回退包络与实时共用同一条加权，切到回退时观感一致）
 - **实时歌词/字幕**：本地音频自动匹配同名 `.lrc` 逐行显示；**本地没有同名 `.lrc` 时自动在线兜底**（QQ 音乐官方歌词 → LRCLIB 免费同步歌词，结果按曲目缓存避免重复请求）；在线 QQ 歌曲自动取官方歌词（外语歌带逐句翻译「原文 ／ 翻译」）；AI 讲书时显示当前朗读句子（逐句滚动）。歌词/字幕显示在播放条频谱之后、时长之前，仅在闲置（控件组折叠）时展示，鼠标进入操作时自动收起；**AI 讲书还有一条「已读字符/全书字符」的全书进度细线**（按已读字数实时计算，不依赖合成时长，切块不回退，操作时再显示「N%」）
 - 播放时申请屏幕唤醒锁，防止听歌时熄屏/休眠（支持 Wake Lock 的浏览器，如 Chrome/Edge）
 - 播放列表面板可自由拖动，右下角可拖拽调整大小，位置与尺寸跨刷新记忆

package/lib/client.js

@@ -4,12 +4,15 @@
  * composer dock and a floating player panel (track list / modes / volume /
  * spectrum) that also holds the music-directory setting in-panel.
  *
- * Audio is a native <audio> element. A real FFT spectrum (8 log-spaced bands)
- * is computed offline from the decoded track (per 50ms window) and drawn on a
- * canvas rAF loop as a smooth equalizer that follows the current playback
- * position. Play mode and volume persist across reloads via the Host's prefs
- * endpoint (/dsh-music/prefs — no browser storage); the current track +
- * position are restored without autoplay (a tap on ▶ resumes).
+ * Audio is a native <audio> element. A real FFT spectrum (8 log-spaced bands) is
+ * drawn on a canvas rAF loop: the primary source is a live captureStream()+AnalyserNode
+ * tap of the playing element — a read-only tap that NEVER reroutes the media element's
+ * output, so it can't mute the player (createMediaElementSource, which does reroute, is
+ * avoided because it goes silent whenever its AudioContext/graph isn't running and this
+ * Chromium throws a "getTopURL" TypeError). Falls back to a per-50ms FFT envelope
+ * computed offline from the decoded track. Play mode and volume persist across reloads
+ * via the Host's prefs endpoint (/dsh-music/prefs — no browser storage); the current
+ * track + position are restored without autoplay (a tap on ▶ resumes).
  * Host communication is plain HTTP to the /dsh-music/(manifest|intent|set-root|id)
  * routes.
  */
@@ -405,7 +408,7 @@ window.__ModuleLoader__.load({
     }).then((r) => r.json());
 
     // ---- engine + shared store (React re-renders on set) ----
-    const VIZ_BARS = 8; // spectrum bars (log-spaced real FFT bands)
+    const VIZ_BARS = 12; // spectrum bars (log-spaced real FFT bands)
     const PEAK_DECAY = 0.012; // peak-cap fall per frame (~1.3s, visible 渐落 trail)
     const audio = new Audio();
     audio.preload = 'auto';
@@ -445,6 +448,10 @@ window.__ModuleLoader__.load({
           if (p && p.catch) p.catch(() => {});
         }
       } catch { /* unlock is best-effort */ }
+      // The live-spectrum analyser rides its own AudioContext; resume it too so
+      // the bars react on the very first frame after the gesture that unlocks
+      // autoplay (books + online QQ) rather than staying silent.
+      resumeVizCtx();
     }
 
     const store = {
@@ -1136,7 +1143,12 @@ window.__ModuleLoader__.load({
       return decodeCtx;
     }
     function trimCache() { while (envCache.size > 24) envCache.delete(envCache.keys().next().value); }
+    let envXHR = null; // the in-flight offline-envelope download (aborted once live actually works)
     function loadEnvelope(id, url, isPrefetch) {
+      // Skip only if the live analyser is CONFIRMED to be producing signal for the
+      // current track (vizLiveOK) — then the offline full-file envelope isn't needed.
+      // Otherwise keep it as the reliable fallback for when the live tap yields silence.
+      if (vizLiveOK) return;
       const cached = envCache.get(id);
       const isCurrent = () => store.currentId === id;
       if (cached !== undefined) { if (isCurrent()) { trackEnv = cached; set({ vizState: 'ok' }); } return; }
@@ -1144,11 +1156,15 @@ window.__ModuleLoader__.load({
       if (isCurrent()) { trackEnv = null; set({ vizState: 'loading' }); }
       try {
         const xhr = new XMLHttpRequest();
+        envXHR = xhr;
         xhr.open('GET', url, true);
         xhr.responseType = 'arraybuffer';
+        const clearXHR = () => { if (envXHR === xhr) envXHR = null; };
         xhr.onload = () => {
           // 注意：真实品质不在这里读（这里要等整首音频下载完才 onload，无损歌几十 MB
           // 会拖慢几秒）。由 startQQPlayback 里的 loadQQQuality 用轻量 HEAD 立即读取。
+          clearXHR();
+          if (vizLiveOK) return; // live is already driving the bars — don't need this
           const ac = ensureDecodeCtx();
           if (ac === null || xhr.response === null) return;
           ac.decodeAudioData(xhr.response).then((buf) => {
@@ -1157,10 +1173,12 @@ window.__ModuleLoader__.load({
             const env = { bands: spec.bands, dt: spec.dt, n: spec.n, duration: buf.duration };
             envCache.set(id, env);
             trimCache();
-            if (!isPrefetch && reqId === envReqId && isCurrent()) { trackEnv = env; set({ vizState: 'ok' }); }
+            if (!isPrefetch && reqId === envReqId && isCurrent()) {
+              trackEnv = env; set({ vizState: 'ok' });
+            }
           }).catch(() => { if (!isPrefetch && isCurrent()) set({ vizState: 'unavailable' }); });
         };
-        xhr.onerror = () => { if (!isPrefetch && isCurrent()) set({ vizState: 'unavailable' }); };
+        xhr.onerror = () => { clearXHR(); if (!isPrefetch && isCurrent()) set({ vizState: 'unavailable' }); };
         xhr.send();
       } catch { if (!isPrefetch && isCurrent()) set({ vizState: 'unavailable' }); }
     }
@@ -1241,17 +1259,17 @@ window.__ModuleLoader__.load({
       return accentObserver;
     }
 
-    // ---- real spectrum: offline FFT per window, decoded together with the track ----
+    // ---- real spectrum: offline FFT per window (FALLBACK spectrum source) ----
     // A real FFT spectrum (VIZ_BARS log-spaced frequency bands) computed from the
     // decoded PCM at decode time and stored as a compact per-window band series.
-    // The bars follow audio.currentTime through those precomputed bands, so they
-    // react to the song's actual frequency content in real time.
+    // The bars follow audio.currentTime through those precomputed bands.
     //
-    // Deliberately NOT a live Web Audio AnalyserNode: routing the media element
-    // through createMediaElementSource breaks this environment's Chromium media
-    // pipeline (an internal "getTopURL" TypeError) and can mute the player. The
-    // offline decode already runs for every track (local + online), so this costs
-    // nothing extra and cannot touch the audio output path.
+    // This is the FALLBACK: the primary spectrum comes from the live
+    // captureStream()+AnalyserNode tap above (real-time, no full-track download).
+    // The offline decode is kept as a safety net for when the browser's
+    // media pipeline refuses the Web Audio source (the internal "getTopURL" TypeError
+    // this Chromium throws) — in that case we must not route the element, and the
+    // offline envelope is the only available source.
     const FFT_SIZE = 2048;      // samples per FFT window (~46ms @44.1kHz)
     const SPEC_WINDOW = 0.05;   // one band snapshot per 50ms
     // Radix-2 in-place iterative FFT (re/im are Float32Arrays of equal power-of-2 length).
@@ -1283,6 +1301,28 @@ window.__ModuleLoader__.load({
     }
     // Per-window log-band magnitudes for a decoded mono channel, normalized 0..1
     // with a sqrt perceptual curve so quiet passages stay visible.
+    // Fixed per-band frequency-weighting gain (0..1, top band = 1), shared by BOTH the live
+    // analyser and the offline FFT envelope so the look is uniform whichever path drives the
+    // bars. A raw frequency read is an ABSOLUTE dB magnitude, and music's natural 1/f
+    // (bass-heavy) tilt maps the low bands near the top while the high bands sit low. This
+    // FIXED, level-independent weighting flattens the SHAPE while ABSOLUTE loudness still
+    // drives each bar — a quiet passage stays low (no per-band auto-gain, which would inflate a
+    // quiet band to full). gain[b] = (center_b / center_top) ^ ALPHA. With ALPHA=0.12 the low
+    // band is attenuated to ~0.53 while the top band keeps 1.0 — enough to counter the typical
+    // bass-heavy envelope without inverting the spectrum or pinning the highs.
+    const VIZ_TILT_ALPHA = 0.12;
+    function bandTiltGain(sampleRate) {
+      const g = new Float32Array(VIZ_BARS);
+      const maxF = Math.min((sampleRate || 48000) / 2, 18000);
+      const ratio = maxF / 40;
+      let cTop = 0;
+      for (let b = 0; b < VIZ_BARS; b++) cTop = 40 * Math.pow(ratio, (b + 0.5) / VIZ_BARS);
+      for (let b = 0; b < VIZ_BARS; b++) {
+        const c = 40 * Math.pow(ratio, (b + 0.5) / VIZ_BARS);
+        g[b] = cTop > 0 ? Math.pow(c / cTop, VIZ_TILT_ALPHA) : 1;
+      }
+      return g;
+    }
     function computeSpectrum(ch, sampleRate) {
       const dt = SPEC_WINDOW;
       const n = Math.max(1, Math.ceil(ch.length / sampleRate / dt));
@@ -1320,22 +1360,152 @@ window.__ModuleLoader__.load({
         }
       }
       if (gmax > 0) {
-        for (let i = 0; i < bands.length; i++) bands[i] = Math.min(1, Math.sqrt(bands[i] / gmax));
+        // Apply the same fixed frequency weighting as the live analyser, so the offline FFT
+        // envelope (fallback) shows the same flattened shape instead of a bass-heavy blob.
+        const g = bandTiltGain(sampleRate);
+        for (let i = 0; i < bands.length; i++) {
+          bands[i] = Math.min(1, Math.sqrt(bands[i] / gmax) * g[i % VIZ_BARS]);
+        }
       }
       return { bands, dt, n };
     }
+    // ---- live real-time analyser (BEST-EFFORT tap; NEVER reroutes audio) ----
+    // captureStream() is a read-only TAP of the playing <audio>: it does NOT redirect
+    // the element's output (unlike createMediaElementSource, which routes it into the
+    // Web Audio graph and goes SILENT whenever that graph/context isn't running — which
+    // is exactly what killed the audio after switching a few tracks). So this can never
+    // mute the player: worst case the analyser reads silence and we fall back to the
+    // offline FFT envelope below.
+    //
+    // It's created only once the element has a real src (startPlay / the play event) so
+    // the captured MediaStream carries an audio track. If this browser's media pipeline
+    // still refuses a track (the getTopURL bug), vizLive stays false and we use the
+    // offline envelope.
+    let vizCtx = null;
+    let vizAnalyser = null;
+    let vizFreq = null;
+    let vizLive = false;
+    let vizLiveOK = false;      // live analyser has produced real signal for the CURRENT track
+    let vizSetupState = 0;      // 0 = not tried; 1 = live active; 2 = permanently unavailable
+    const vizBands = new Float32Array(VIZ_BARS);
+    // Cached per-band frequency-weighting gain for the live analyser; shared code is
+    // bandTiltGain(sampleRate) in the spectrum section. Recomputing is needed only when the
+    // AudioContext sample rate changes (a new tap), so it's reset in setupLiveViz.
+    let vizTiltGain = null;
+    function liveTiltGain() {
+      if (vizTiltGain !== null) return vizTiltGain;
+      const sr = (vizCtx && vizCtx.sampleRate) || 48000;
+      vizTiltGain = bandTiltGain(sr);
+      return vizTiltGain;
+    }
+    function resumeVizCtx() {
+      try {
+        if (vizCtx !== null && vizCtx.state === 'suspended') {
+          const p = vizCtx.resume();
+          if (p && typeof p.catch === 'function') p.catch(() => {});
+        }
+      } catch (e) { /* best-effort */ }
+    }
+    function setupLiveViz() {
+      if (vizLive) return true;
+      if (vizSetupState === 2) return false;
+      // Web Audio capability checks.
+      const Ctor = window.AudioContext || window.webkitAudioContext;
+      const hasCapture = typeof audio.captureStream === 'function';
+      if (!hasCapture) { vizSetupState = 2; return false; }
+      if (Ctor === undefined) { vizSetupState = 2; return false; }
+      // IMPORTANT: calling captureStream() before the element has any data returns a
+      // MediaStream with NO audio track — and because a media element returns the SAME
+      // cached stream on every captureStream() call, that 0-track stream sticks forever.
+      // So only capture once the element is actually playing (readyState >= 3);
+      // otherwise retry from the 'playing' event.
+      if (audio.readyState < 3) return false;
+      try {
+        const stream = audio.captureStream();
+        let tracks = [];
+        if (stream && typeof stream.getAudioTracks === 'function') { try { tracks = stream.getAudioTracks(); } catch (e) { tracks = []; } }
+        if (!stream || typeof stream.getAudioTracks !== 'function') { vizSetupState = 2; return false; }
+        if (tracks.length === 0) return false; // no audio track -> rely on the offline envelope
+        vizCtx = new Ctor();
+        const srcNode = vizCtx.createMediaStreamSource(stream);
+        vizAnalyser = vizCtx.createAnalyser();
+        vizAnalyser.fftSize = 2048;
+        // Bar HEIGHT is governed by the dB range below. This matches the audioMotion-analyzer
+        // default (min:-85, max:-25) so the display scale is consistent with that mature
+        // implementation. The temporal smoothing keeps the bars crisp and "follow the hand":
+        // low value => the analyser tracks the instantaneous FFT so the bars snap to the music
+        // (with only our own rise/fall smoothing in drawViz on top).
+        vizAnalyser.smoothingTimeConstant = 0.3;
+        vizAnalyser.minDecibels = -85;
+        vizAnalyser.maxDecibels = -25;
+        vizFreq = new Uint8Array(vizAnalyser.frequencyBinCount);
+        srcNode.connect(vizAnalyser); // analysis tap only — do NOT route to destination
+        vizLive = true;
+        vizSetupState = 1;
+        // A fresh tap = a fresh song: drop the live-confirmed flag so a silent new tap can fall
+        // back to the offline envelope, and recompute the frequency weighting for the new context.
+        vizLiveOK = false;
+        vizTiltGain = null;
+        resumeVizCtx();
+        return true;
+      } catch (e) {
+        if (vizCtx !== null) { try { vizCtx.close(); } catch (e2) {} }
+        vizCtx = null; vizAnalyser = null; vizFreq = null; vizLive = false; vizSetupState = 2;
+        return false;
+      }
+    }
+    function closeLiveViz() {
+      if (vizCtx !== null) { try { vizCtx.close(); } catch (e) {} }
+      vizCtx = null; vizAnalyser = null; vizFreq = null; vizLive = false; vizSetupState = 0;
+    }
+    // Map AnalyserNode's per-bin byte data (dB→0..255) into the VIZ_BARS
+    // log-spaced bands, matching the offline computeSpectrum band edges. Marks
+    // vizLiveOK once the tap actually yields signal, and then drops the redundant
+    // offline full-file envelope download.
+    function analyseLiveBands() {
+      if (!vizLive || vizAnalyser === null) return false;
+      vizAnalyser.getByteFrequencyData(vizFreq);
+      const binHz = vizCtx.sampleRate / vizAnalyser.fftSize;
+      const maxF = Math.min(binHz * vizFreq.length, 18000);
+      const ratio = maxF / 40;
+      const g = liveTiltGain();
+      let any = false;
+      for (let b = 0; b < VIZ_BARS; b++) {
+        const e0 = 40 * Math.pow(ratio, b / VIZ_BARS);
+        const e1 = 40 * Math.pow(ratio, (b + 1) / VIZ_BARS);
+        const b0 = Math.max(0, Math.floor(e0 / binHz));
+        const b1 = Math.min(vizFreq.length, Math.max(b0 + 1, Math.ceil(e1 / binHz)));
+        let m = 0;
+        for (let k = b0; k < b1; k++) { const v = vizFreq[k]; if (v > m) m = v; }
+        const raw = m / 255; // byte ∈ dB range → 0..1 (the standard AnalyserNode normalization)
+        // Absolute loudness drives this bar (so a quiet passage stays low), but a fixed
+        // frequency weighting flattens the bass-heavy shape so the low bands aren't pinned at
+        // the top during loud music. See liveTiltGain().
+        vizBands[b] = Math.min(1, raw * g[b]);
+        if (m > 4) any = true; // above the (minDecibels floor) silence => real signal
+      }
+      if (any && !vizLiveOK) {
+        vizLiveOK = true;
+        // Live is confirmed driving the bars — the offline full-file download is
+        // unneeded; cancel it to save bandwidth.
+        if (envXHR !== null) { try { envXHR.abort(); } catch (e) {} envXHR = null; }
+      }
+      return true;
+    }
     function drawBars(canvas, useCaps) {
       const c = canvas.getContext('2d');
       const w = canvas.width; const h = canvas.height;
       c.clearRect(0, 0, w, h);
       const gap = 2;
-      const bw = (w - gap * (VIZ_BARS - 1)) / VIZ_BARS;
+      const bw = 3; // fixed 3px bar width (12 bars fit the 60px bar without crowding)
+      // Center the group of bars within the canvas.
+      const x0 = Math.max(0, Math.round((w - (bw * VIZ_BARS + gap * (VIZ_BARS - 1))) / 2));
       const color = currentAccent();
       // 峰值帽用亮度自适应色（暗主题→提亮、浅主题→压暗），任何主题下都与柱体区分。
       const capColor = capColorFor(color);
       for (let i = 0; i < VIZ_BARS; i++) {
         const bh = Math.max(2, Math.round(smoothCur[i] * (h - 2)));
-        const x = Math.round(i * (bw + gap));
+        const x = x0 + i * (bw + gap);
         c.fillStyle = color;
         c.fillRect(x, h - 1 - bh, Math.max(1, Math.floor(bw)), bh);
         if (useCaps && smoothPeak[i] > smoothCur[i] + 0.03) {
@@ -1346,19 +1516,30 @@ window.__ModuleLoader__.load({
       }
     }
     function drawViz() {
-      if (store.playing && trackEnv !== null) {
-        const envIdx = (audio.currentTime || 0) / trackEnv.dt;
-        const base = Math.max(0, Math.min(trackEnv.n - 1, Math.floor(envIdx)));
-        const off = base * VIZ_BARS;
-        for (let i = 0; i < VIZ_BARS; i++) {
-          // blend the current window with the previous for smoother motion
-          const cur = trackEnv.bands[off + i];
-          const prev = base > 0 ? trackEnv.bands[off - VIZ_BARS + i] : 0;
-          targetBuf[i] = cur * 0.6 + prev * 0.4;
+      if (store.playing) {
+        // Always probe the live tap (so vizLiveOK gets set the moment it yields signal),
+        // but only DRIVE the bars with it once it's actually producing signal. The offline
+        // FFT envelope is the reliable fallback for when the tap is silent.
+        // Priority: live (confirmed signal) > offline envelope > idle breathing.
+        if (vizLive && vizAnalyser !== null) {
+          analyseLiveBands();
+        }
+        if (vizLive && vizLiveOK) {
+          for (let i = 0; i < VIZ_BARS; i++) targetBuf[i] = vizBands[i];
+        } else if (trackEnv !== null) {
+          const envIdx = (audio.currentTime || 0) / trackEnv.dt;
+          const base = Math.max(0, Math.min(trackEnv.n - 1, Math.floor(envIdx)));
+          const off = base * VIZ_BARS;
+          for (let i = 0; i < VIZ_BARS; i++) {
+            // blend the current window with the previous for smoother motion
+            const cur = trackEnv.bands[off + i];
+            const prev = base > 0 ? trackEnv.bands[off - VIZ_BARS + i] : 0;
+            targetBuf[i] = cur * 0.6 + prev * 0.4;
+          }
+        } else {
+          const now = Date.now();
+          for (let i = 0; i < VIZ_BARS; i++) targetBuf[i] = 0.12 + 0.05 * Math.sin(now / 240 + i * 0.9);
         }
-      } else if (store.playing) {
-        const now = Date.now();
-        for (let i = 0; i < VIZ_BARS; i++) targetBuf[i] = 0.12 + 0.05 * Math.sin(now / 240 + i * 0.9);
       } else {
         for (let i = 0; i < VIZ_BARS; i++) targetBuf[i] = 0;
       }
@@ -1463,9 +1644,20 @@ window.__ModuleLoader__.load({
       lastPlayStartTs = Date.now();
       restoredMusicPos = null;
       bookRestorePos = -1;
+      // A fresh track gets a fresh live tap: the captureStream tap is tied to the
+      // media pipeline of the src it was created on, so switching songs must tear it
+      // down and let the 'playing' event re-capture for the NEW src (otherwise the tap
+      // reads the old song's silence and we'd wrongly fall back to offline).
+      closeLiveViz();
       audio.src = track.url;
       audio.load();
-      set({ currentId: id, currentName: track.name, currentArtists: track.artists || [], pendingId: null, pendingName: null, error: null, tocOpen: false, currentSection: '', qqFaved: false, currentQuality: (track && track.quality) || '', bookProgress: 0 });
+      // (Re)attempt the live spectrum tap now that a real src is loaded — the captured
+      // MediaStream only carries an audio track once the element has a source.
+      setupLiveViz();
+      // A fresh track always starts from 0 (audio.src/load resets currentTime) —
+      // reset the readout so a stale restored position (from the previous song)
+      // never lingers on the bar before the first timeupdate.
+      set({ currentId: id, currentName: track.name, currentArtists: track.artists || [], pendingId: null, pendingName: null, error: null, tocOpen: false, currentSection: '', qqFaved: false, currentQuality: (track && track.quality) || '', bookProgress: 0, position: 0, duration: 0 });
       syncShufflePos();
       loadEnvelope(id, track.url);
       loadLyricForTrack(id);
@@ -1729,6 +1921,10 @@ window.__ModuleLoader__.load({
       if (bookFromRef + 1 < bookTotal) {
         // 进入新块：每个块各拥有一次自动重试的机会。
         bookAutoRetried = false;
+        // 恢复定位钉只属于「被恢复的那一块」：切到下一块必须丢弃，否则下一块的
+        // 音频会被 seek 回上一块的恢复位置（跳到末尾即刻结束 → 卡住/无声音/字幕不动）。
+        bookRestorePos = -1;
+        restoredMusicPos = null;
         const endedDur = Number.isFinite(audio.duration) ? audio.duration : (audio.currentTime || 0);
         if (Number.isFinite(endedDur)) bookBaseTime += endedDur;
         playBookFrom(id, bookFromRef + 1, true);
@@ -1983,8 +2179,13 @@ window.__ModuleLoader__.load({
         // start until then) — anchored on top of the book-wide clock.
         if (bookRestorePos >= 0 && String(store.currentId).startsWith('book:')) {
           const ct = audio.currentTime || 0;
-          if (ct > bookRestorePos + 1) {
-            bookRestorePos = -1; // real playback advanced past the spot
+          // 释放条件：真实播放已明显越过恢复点，或恢复点已超出本块的实际时长
+          // （块可能被重新合成得更短——此时继续 pin 会反复 seek 到块末尾并即刻
+          // 结束，表现为卡住/无声音/字幕不动）。超出时放弃该恢复点、从块头正常播。
+          const pastSpot = ct > bookRestorePos + 1;
+          const pastEnd = Number.isFinite(audio.duration) && audio.duration > 0 && bookRestorePos >= audio.duration;
+          if (pastSpot || pastEnd) {
+            bookRestorePos = -1; // real playback advanced past the spot / spot unreachable
           } else {
             if (store.playing && ct < bookRestorePos - 0.5) {
               try { audio.currentTime = bookRestorePos; } catch (e) {}
@@ -2030,7 +2231,7 @@ window.__ModuleLoader__.load({
           set({ duration: (bookTimeBase() + audio.duration) });
         }
       };
-      const onPlay = () => { qqErrorSkipCount = 0; set({ playing: true, error: null }); acquireWakeLock(); };
+      const onPlay = () => { qqErrorSkipCount = 0; set({ playing: true, error: null }); acquireWakeLock(); setupLiveViz(); resumeVizCtx(); };
       const onPause = () => { set({ playing: false }); savePlayback(); releaseWakeLock(); };
       const onEnded = () => {
         // A novel plays chunk-by-chunk: when a chunk ends, auto-advance to the
@@ -2099,6 +2300,10 @@ window.__ModuleLoader__.load({
       audio.addEventListener('pause', onPause);
       audio.addEventListener('ended', onEnded);
       audio.addEventListener('error', onError);
+      // captureStream() only carries an audio track once the element is actually
+      // playing (readyState >= 3); 'play' can fire before there is data, so retry here.
+      const onPlaying = () => { setupLiveViz(); resumeVizCtx(); };
+      audio.addEventListener('playing', onPlaying);
       return () => {
         audio.pause();
         audio.removeEventListener('timeupdate', onTime);
@@ -2106,6 +2311,7 @@ window.__ModuleLoader__.load({
         audio.removeEventListener('play', onPlay);
         audio.removeEventListener('pause', onPause);
         audio.removeEventListener('ended', onEnded);
+        audio.removeEventListener('playing', onPlaying);
         audio.removeEventListener('error', onError);
       };
     }
@@ -2407,7 +2613,7 @@ window.__ModuleLoader__.load({
     // 播放控制图标（上一首/播放/暂停/下一首/停止）：用 SVG 替代 ⏮▶⏸⏭⏹ 文本字形。
     // 这些 Unicode 符号（尤其 ⏸ 常以 emoji 呈现）宽高/基线不一致，点击切换会让按钮
     // 大小与位置偏移；统一用同尺寸 viewBox=24 的 SVG，保证按钮恒定尺寸、图标精确居中。
-    const iconSvg = (path, w = 14) => (props) => React.createElement('svg', { className: props.className || '', width: w, height: w, viewBox: '0 0 24 24', fill: 'currentColor', 'aria-hidden': true },
+    const iconSvg = (path, w = 16) => (props) => React.createElement('svg', { className: props.className || '', width: w, height: w, viewBox: '0 0 24 24', fill: 'currentColor', 'aria-hidden': true },
       React.createElement('path', { d: path }));
     const PlayIcon = iconSvg('M8 5v14l11-7z');
     const PauseIcon = iconSvg('M6 19h4V5H6v14zm8-14v14h4V5h-4z');
@@ -2544,12 +2750,14 @@ window.__ModuleLoader__.load({
       const showHint = s.pendingName !== null && s.currentId === null;
       const panelCls = 'dsh-music-mode-trigger' + (s.panelOpen ? ' active' : '');
       let vizBadge = null;
-      // 频谱不可用提示仅对本地/讲书曲目有效（重试能重新拉取独立音频源）。
+      // 频谱不可用提示仅对本地/讲书曲目有效（重试能重新拉取独立音频源）。当实时
+      // AnalyserNode 频谱已生效（vizLive）时，离线包偶发失败无关紧要，
+      // 不显示该徽标误导用户——真实频谱由实时路径提供。
       // 在线 QQ 曲目与音频走同一代理流：频谱解码失败几乎必然意味着整段流
       // 播放失败，此时由音频 error 展示真实原因（如「音频加载或解码失败」），
       // 这里不再误导性地显示「频谱不可用，点击重试」。
       const isQQTrack = s.currentId !== null && String(s.currentId).startsWith('qq:');
-      if (hasTrack && s.vizState === 'unavailable' && !isQQTrack) {
+      if (hasTrack && s.vizState === 'unavailable' && !isQQTrack && !vizLive) {
         vizBadge = React.createElement('button', {
           className: 'dsh-music-bar-warn',
           title: '频谱不可用，点击重试',
@@ -2601,7 +2809,7 @@ window.__ModuleLoader__.load({
         title: faved ? '取消收藏（从「我最喜欢」移除）' : '收藏到「我最喜欢」',
         onClick: toggleFav,
       }, React.createElement('svg', {
-        viewBox: '0 0 24 24', width: 14, height: 14,
+        viewBox: '0 0 24 24', width: 16, height: 16,
         fill: faved ? 'currentColor' : 'none', stroke: 'currentColor', strokeWidth: 2, 'aria-hidden': true,
       }, React.createElement('path', { d: 'M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z' }))) : null;
       const showBarBtns = () => { if (hoverTimerRef.current !== null) { clearTimeout(hoverTimerRef.current); hoverTimerRef.current = null; } setBarHover(true); };
@@ -2634,7 +2842,7 @@ window.__ModuleLoader__.load({
           hasTrack
             ? React.createElement('span', { className: 'dsh-music-bar-name', title: displayName + (artistText ? ' - ' + artistText : '') + (chapterEl ? ' - ' + s.currentSection : '') }, note, ' ', displayName, artistEl, sourceBadge, localQualityBadge, chapterEl, afterName)
             : React.createElement('span', { className: 'dsh-music-bar-idle' }, note, ' DSH音乐播放器'),
-          !isBook && hasTrack && s.playing ? React.createElement('canvas', { className: 'dsh-music-viz', width: 46, height: 20, ref: (el) => { barCanvasNode = el; } }) : null,
+          !isBook && hasTrack && s.playing ? React.createElement('canvas', { className: 'dsh-music-viz', width: 60, height: 20, ref: (el) => { barCanvasNode = el; } }) : null,
           vizBadge,
           // 歌词/字幕：位于频谱之后、时长之前；仅"非使用态"（控件组已折叠、播放条
           // 半透明）显示——正在操作时收起，不给滑入的按钮组让路。
@@ -2852,9 +3060,17 @@ window.__ModuleLoader__.load({
       const id = String(song.songmid || song.id);
       const url = '/dsh-music/qq/play/' + id;
       const q = (Array.isArray(queue) && queue.length > 0) ? queue.slice() : [song];
+      // 换到一首「新」的在线曲目：必须清除刷新恢复的定位钉，否则 onTime 会把这条
+      // 新流 seek 回上一首的保存进度（换歌从旧进度开始）。startQQPlayback 只在点/
+      // 切到新曲目时被调用（同曲目在面板上走 togglePlay 续播），因此这里无条件清除。
+      restoredMusicPos = null;
+      bookRestorePos = -1;
+      // Fresh live tap per track (see startPlay): re-capture for the NEW src.
+      closeLiveViz();
       audio.src = url;
       audio.load();
-      set({ currentId: 'qq:' + id, currentName: song.title, currentArtists: (song.artists || []), scope: { kind: 'qq' }, qqQueue: q, qqSource: sourceLabel || (q.length > 1 ? '在线' : ''), error: null, qqFaved: false, currentQuality: '' });
+      setupLiveViz();
+      set({ currentId: 'qq:' + id, currentName: song.title, currentArtists: (song.artists || []), scope: { kind: 'qq' }, qqQueue: q, qqSource: sourceLabel || (q.length > 1 ? '在线' : ''), error: null, qqFaved: false, currentQuality: '', position: 0, duration: 0 });
       loadEnvelope('qq:' + id, url);
       loadQQQuality(id, url);
       loadQQLyric('qq:' + id, id);
@@ -4288,13 +4504,20 @@ window.__ModuleLoader__.load({
         attachAudioElements();
         const unbind = bindAudio();
         startRaf();
+        // The live analyser is a captureStream() TAP — created only once a real src is
+        // loaded (startPlay/onPlay), NOT up front, because a stream captured before any
+        // src exists can carry no audio track. We deliberately avoid createMediaElementSource
+        // here: it re-routes the element's output into the Web Audio graph and goes
+        // SILENT whenever that graph/context isn't running (which is what broke audio
+        // after switching tracks). The tap can never mute the player; if the tap can't
+        // provide audio (the getTopURL bug) we fall back to the offline FFT envelope.
         const accentWatch = watchAccent();
         // Browsers auto-release a wake lock when the page is hidden; re-acquire
         // on return if playback is still running, and drop it on hide so we
         // don't hold it while the tab is backgrounded.
         const onVis = () => {
           if (document.hidden) releaseWakeLock();
-          else acquireWakeLock();
+          else { acquireWakeLock(); resumeVizCtx(); }
         };
         // On refresh/unload, stop the media element cleanly BEFORE the document
         // is torn down — otherwise Chromium's media pipeline can race the
@@ -4308,10 +4531,30 @@ window.__ModuleLoader__.load({
           void flushServerPrefs();
         };
         document.addEventListener('visibilitychange', onVis);
+        // Resume the analyser's AudioContext on any user gesture so it's already
+        // running when a track starts. setupLiveViz() creates the tap once a real src
+        // is loaded (startPlay/onPlay); the context just needs to be running for the
+        // bars to move.
+        const onFirstGesture = () => { resumeVizCtx(); };
+        window.addEventListener('pointerdown', onFirstGesture);
+        window.addEventListener('keydown', onFirstGesture, true);
         window.addEventListener('pagehide', onPageHide);
+        // This Chromium's media pipeline throws a benign internal "getTopURL" TypeError
+        // as an UNHANDLED promise rejection while a media element is routed through
+        // Web Audio (needed for the live spectrum) with our proxied stream. It does NOT
+        // affect playback or the analyser — but it spams the console. Suppress exactly
+        // that benign case; leave every other rejection untouched.
+        const onUnhandled = (ev) => {
+          const r = ev && ev.reason;
+          if (r && /getTopURL/.test(String((r && r.message) || r))) ev.preventDefault();
+        };
+        window.addEventListener('unhandledrejection', onUnhandled);
         return () => {
+          window.removeEventListener('unhandledrejection', onUnhandled);
           window.removeEventListener('pagehide', onPageHide);
-          document.removeEventListener('visibilitychange', onVis); stopRaf(); unbind(); closeDecodeCtx(); releaseWakeLock();
+          window.removeEventListener('pointerdown', onFirstGesture);
+          window.removeEventListener('keydown', onFirstGesture, true);
+          document.removeEventListener('visibilitychange', onVis); stopRaf(); unbind(); closeDecodeCtx(); closeLiveViz(); releaseWakeLock();
           if (accentWatch !== null) accentWatch.disconnect();
           accentObserver = null;
         };
@@ -4364,9 +4607,14 @@ window.__ModuleLoader__.load({
           }
           const track = resolvePlayable(intent.id);
           if (track !== null) {
+            // 换到一首「新」的曲目：清除刷新恢复的定位钉，避免 onTime 把新曲目 seek
+            // 回上一首的保存进度（换歌从旧进度开始）。play 意图=从头开始（续播走
+            // togglePlay / resume 意图），因此这里无条件清除。
+            restoredMusicPos = null;
+            bookRestorePos = -1;
             audio.src = track.url;
             audio.load();
-            set({ currentId: intent.id, currentName: track.name, currentArtists: track.artists || [], error: null, scope: { kind: 'library' } });
+            set({ currentId: intent.id, currentName: track.name, currentArtists: track.artists || [], error: null, scope: { kind: 'library' }, position: 0, duration: 0 });
             loadEnvelope(intent.id, track.url);
             prefetchNext();
             savePlayback();
@@ -4419,7 +4667,7 @@ window.__ModuleLoader__.load({
       '.dsh-music-bar-idle { color: var(--dsw-alias-label-primary, #e6e6e6); font-weight: 500; display: inline-flex; align-items: center; }\n' +
       '.dsh-music-bar-name { max-width: 36%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-flex; align-items: center; min-width: 0; }\n' +
       '.dsh-music-note { color: var(--dsh-music-accent, #2f9e6e); flex: none; margin-right: 4px; }\n' +
-      '.dsh-music-viz { flex: none; width: 46px; height: 20px; }\n' +
+      '.dsh-music-viz { flex: none; width: 60px; height: 20px; }\n' +
       // 歌词/字幕：夹在频谱与时长之间，吃掉剩余宽度，文本在可用空间内水平居中，
       // 超长省略号截断。仅非使用态渲染（元素随 .dsh-music-bar.dimmed 半透明，符合
       // 后台静默观感）。出现时延迟 0.3s（与控件组滑出的 0.3s 过渡对齐）再淡入，
@@ -4428,9 +4676,9 @@ window.__ModuleLoader__.load({
       '.dsh-music-bar-lyric { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: center; color: var(--dsw-alias-label-primary, #e6e6e6); font-size: 14px; animation: dsh-music-lyric-in 0.3s ease 0.3s backwards; }\n' +
       '@keyframes dsh-music-lyric-in { from { opacity: 0; } to { opacity: 1; } }\n' +
       '.dsh-music-bar-warn { background: transparent; border: none; color: var(--dsw-alias-state-warn-primary, #d9a441); font-size: 12px; cursor: pointer; padding: 0; white-space: nowrap; }\n' +
-      '.dsh-music-bar-btn { display: inline-flex; align-items: center; justify-content: center; flex: none; height: 20px; background: transparent; border: none; color: var(--dsw-alias-label-secondary, #8a8f98); cursor: pointer; font-size: 13px; line-height: 1; padding: 0 4px; border-radius: 4px; }\n' +
-      '.dsh-music-bar-btn:hover { color: var(--dsw-alias-brand-primary, #4f8cff); }\n' +
-      '.dsh-music-bar-btn.active { color: var(--dsw-alias-brand-primary, #4f8cff); }\n' +
+      '.dsh-music-bar-btn { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 24px; height: 24px; border-radius: 50%; border: 1px solid var(--dsw-alias-border-l1, rgba(128,128,128,0.25)); background: var(--dsw-alias-bg-layer-2, rgba(255,255,255,0.05)); color: var(--dsh-music-accent, #2f9e6e); cursor: pointer; font-size: 13px; line-height: 1; padding: 0; }\n' +
+      '.dsh-music-bar-btn:hover { color: var(--dsh-music-accent-fg, #fff); background: var(--dsh-music-accent, #2f9e6e); }\n' +
+      '.dsh-music-bar-btn.active { color: var(--dsh-music-accent, #2f9e6e); }\n' +
       '.dsh-music-bar-vol { position: relative; flex: none; display: inline-flex; align-self: center; }\n' +
       '.dsh-music-bar-vol-pop { position: absolute; bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%); display: flex; align-items: center; justify-content: center; width: 36px; height: 108px; box-sizing: border-box; background: var(--dsw-alias-bg-overlay, #1e1f22); border: 1px solid var(--dsw-alias-border-l2, rgba(128,128,128,0.35)); border-radius: 8px; box-shadow: 0 8px 20px rgba(0,0,0,0.3); z-index: 60; }\n' +
       // 讲书时音量弹层加宽，容纳 AI 声音选择 + 音量条。
@@ -4462,7 +4710,7 @@ window.__ModuleLoader__.load({
       '@keyframes dsh-music-spin { to { transform: rotate(360deg); } }\n' +
       '.dsh-music-bar-berr { margin-left: 8px; color: var(--dsw-alias-state-error-primary, #e5534b); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 220px; display: inline-flex; align-items: center; gap: 4px; }\n' +
       '.dsh-music-bar-berr-text { overflow: hidden; text-overflow: ellipsis; }\n' +
-      '.dsh-music-bar-btn.retry { color: var(--dsw-alias-state-error-primary, #e5534b); border: 1px solid var(--dsw-alias-border-l1, rgba(128,128,128,0.3)); border-radius: 6px; padding: 0 6px; height: 18px; flex: none; }\n' +
+      '.dsh-music-bar-btn.retry { width: auto; color: var(--dsw-alias-state-error-primary, #e5534b); border: 1px solid var(--dsw-alias-border-l1, rgba(128,128,128,0.3)); border-radius: 6px; padding: 0 6px; height: 18px; flex: none; }\n' +
       '.dsh-music-bar-btn.retry:hover { background: var(--dsw-alias-state-error-primary, #e5534b); color: #fff; }\n' +
       '.dsh-music-bar .dsh-music-mode-trigger { width: 24px; height: 24px; }\n' +
       '.dsh-music-bar .dsh-music-mode-trigger svg { flex: none; }\n' +
@@ -4681,7 +4929,9 @@ window.__ModuleLoader__.load({
       '.dsh-music-panel-toast.err { background: var(--dsw-alias-state-error-primary, #e5534b); }\n' +
       '@keyframes dsh-music-toast-in { from { opacity: 0; transform: translate(-50%, -50%) scale(0.94); } to { opacity: 1; transform: translate(-50%, -50%) scale(1); } }\n' +
       '.dsh-music-bar-btn.fav { color: var(--dsw-alias-label-secondary, #8a8f98); }\n' +
-      '.dsh-music-bar-btn.fav.on { color: var(--dsh-music-accent, #2f9e6e); }\n';
+      '.dsh-music-bar-btn.fav:hover { color: var(--dsh-music-accent-fg, #fff); }\n' +
+      '.dsh-music-bar-btn.fav.on { color: var(--dsh-music-accent, #2f9e6e); }\n' +
+      '.dsh-music-bar-btn.fav.on:hover { color: var(--dsh-music-accent-fg, #fff); }\n';
 
     return module.exports;
   },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-music-player",
-  "version": "0.6.2",
+  "version": "0.6.4",
   "description": "DeepSeek Harness 本地音乐 + AI 讲书插件：Host 扫描音乐目录并以 HTTP 流式提供音频、解析 .txt 小说结构并经 MiMo TTS 合成朗读，浏览器侧提供播放条/播放面板/章节目录跳转/多声音选择/实时频谱，并注册 music_play 模型工具",
   "type": "module",
   "main": "lib/index.js",