@yuuichi/openlist-assets 4.2.6-ym.3 → 4.2.6-ym.4

package/dist/brand/music-player.js

@@ -1,571 +1,164 @@
 /* =============================================================================
- * Yuuichi 资源站 · 悬浮背景音乐播放器
+ * Yuuichi 资源站 · 背景音乐（与 blog.yuuichi.me / www.yuuichi.me 统一的 bgm-dock）
  * -----------------------------------------------------------------------------
- * 想换歌单，只需要修改下面 MUSIC_CONFIG 里的 id / 链接即可，然后重新部署：
- *   1) 网易云歌单：打开歌单复制地址里的 id 数字
- *      例 https://music.163.com/#/playlist?id=18475904830 -> id 填 "18475904830"
- *      网易云使用内置 APlayer 内核（支持音量调节 / 封面 / 歌词 / 列表循环）
- *   2) Spotify 歌单：复制歌单链接
- *      例 https://open.spotify.com/playlist/3bePpYfOLDwFtVVs6cqwyh -> id 填 "3bePpYfOLDwFtVVs6cqwyh"
- *      Spotify 为官方嵌入播放器，其桌面端自身右下角带音量条（浏览器跨域限制，外部无法代为控制）
- * 每个平台可填多个歌单（顶部可切换）；不用的平台把列表留空 [] 即可。
- * 网易云歌单由本站同源接口 /api/music/netease 实时拉取网易云官方数据（自动反映你在网易云的增删）；
- * 每首歌的直链 / 封面 / 歌词由 metingApi 按 id 实时解析（公益服务，失效可换其它 Meting 兼容地址）。
- * 改完保存，在 openlist 目录执行：
- *   node scripts/sync-branding.mjs
- *   pnpm exec wrangler deploy
+ * 统一播放器：左下角圆形按钮（半吸附边缘 / 可拖动 / 可缩放），点击展开面板，
+ * 内置 Spotify 官方嵌入 + 网易云（Meting/APlayer，含封面/歌词/列表循环/倍速）。
+ *
+ * 想换歌单，修改下面 MUSIC_CONFIG 的 id，然后：
+ *   node scripts/sync-branding.mjs && pnpm exec wrangler deploy
+ * 也可以在 OpenList 管理台设置项 music_config 在线覆盖（无需重新部署）。
+ *
+ * 资源站资源全部同源托管在 /brand/bgm/ 下；网易云歌单/直链/歌词走本站
+ * /api/music/meting（Worker 服务端代理网易云），浏览器不直接访问 workers.dev。
  * ============================================================================= */
 (function () {
   "use strict";
 
+  var ASSET_BASE = "/brand/bgm";
+  var METING_API = "/api/music/meting?server=:server&type=:type&id=:id&r=:r";
+
   var MUSIC_CONFIG = {
-    netease: [
-      { id: "18475904830", name: "网易云歌单" }
-    ],
-    spotify: [
-      { id: "3bePpYfOLDwFtVVs6cqwyh", name: "Spotify 歌单" }
-    ],
-    defaultTab: "netease", // "netease" 或 "spotify"
-    autoplay: false,       // 网易云是否自动播放（多数浏览器会拦截，建议 false）
-    fabHint: "音乐"
+    netease: [{ id: "18475904830", name: "网易云" }],
+    spotify: [{ id: "3bePpYfOLDwFtVVs6cqwyh", name: "Spotify" }],
+    defaultTab: "spotify", // "spotify" 或 "netease"
+    autoplay: false,
+    theme: "#0ea5e9",
+    volume: 0.6,
+    order: "list" // list / random
   };
 
-  // 管理台（OpenList 设置项 music_config）可在线覆盖歌单/开关，无需重新部署。
-  // Worker 会在本脚本前注入 window.__YUUICHI_MUSIC_CONFIG_OVERLAY__。
+  // 管理台 music_config 在线覆盖
   try {
     var __ov = window.__YUUICHI_MUSIC_CONFIG_OVERLAY__;
     if (__ov && typeof __ov === "object") {
       ["netease", "spotify"].forEach(function (k) {
         if (Array.isArray(__ov[k])) MUSIC_CONFIG[k] = __ov[k];
       });
-      ["defaultTab", "fabHint"].forEach(function (k) {
+      ["defaultTab", "theme", "order"].forEach(function (k) {
         if (typeof __ov[k] === "string" && __ov[k]) MUSIC_CONFIG[k] = __ov[k];
       });
-      if (typeof __ov.autoplay === "boolean") MUSIC_CONFIG.autoplay = __ov.autoplay;
+      ["autoplay"].forEach(function (k) {
+        if (typeof __ov[k] === "boolean") MUSIC_CONFIG[k] = __ov[k];
+      });
+      if (typeof __ov.volume === "number") MUSIC_CONFIG.volume = __ov.volume;
     }
   } catch (e) {}
 
-  function init() {
-    if (window.__yuuichiMusicInited) return;
-    window.__yuuichiMusicInited = true;
-
-    var platforms = [];
-    if (MUSIC_CONFIG.netease.length) platforms.push({ key: "netease", label: "网易云", items: MUSIC_CONFIG.netease });
-    if (MUSIC_CONFIG.spotify.length) platforms.push({ key: "spotify", label: "Spotify", items: MUSIC_CONFIG.spotify });
-    if (!platforms.length) return;
-
-    var host = document.createElement("div");
-    host.id = "yuuichi-music-root";
-    host.style.cssText = "all:initial;position:fixed;z-index:2147483000;";
-    var shadow = host.attachShadow ? host.attachShadow({ mode: "open" }) : host;
-    document.body.appendChild(host);
-
-    /* ---------------- 样式 ---------------- */
-    // APlayer 厂商 CSS（12KB）改为首次真正打开歌单时才注入，避免首屏多一个请求
-    var vendorLinkLoaded = false;
-    function ensureVendorCss() {
-      if (vendorLinkLoaded) return;
-      vendorLinkLoaded = true;
-      var vendorLink = document.createElement("link");
-      vendorLink.rel = "stylesheet";
-      vendorLink.href = "/brand/vendor/APlayer.min.css";
-      shadow.appendChild(vendorLink);
-    }
-
-    var style = document.createElement("style");
-    style.textContent = [
-      ":host, * { box-sizing:border-box; -webkit-tap-highlight-color:transparent; }",
-      ":host { --ym-txt:#0f172a; --ym-sub:#475569; --ym-card:rgba(255,255,255,.92); --ym-line:rgba(14,165,233,.28); --ym-soft:rgba(14,165,233,.12); }",
-      ":host([data-dark]) { --ym-txt:#e2e8f0; --ym-sub:#94a3b8; --ym-card:rgba(15,23,42,.92); --ym-line:rgba(56,189,248,.32); --ym-soft:rgba(56,189,248,.16); }",
-      ".wrap { position:fixed; left:0; top:0; font-family:system-ui,-apple-system,'Segoe UI','Microsoft YaHei',sans-serif; }",
-      ".fab { position:fixed; left:18px; bottom:18px; width:54px; height:54px; border-radius:50%;",
-      "  border:none; cursor:pointer; color:#fff; display:flex; align-items:center; justify-content:center;",
-      "  background:linear-gradient(135deg,#38bdf8,#0284c7); box-shadow:0 8px 24px rgba(2,132,199,.45);",
-      "  transform:translateX(-58%); transition:transform .22s cubic-bezier(.2,.8,.2,1), box-shadow .18s ease; padding:0; }",
-      ".wrap:hover .fab, .fab:focus-visible, .fab.peek { transform:translateX(0); }",
-      ".fab:hover { box-shadow:0 12px 30px rgba(2,132,199,.55); }",
-      ".fab:active { transform:scale(.94); }",
-      ".fab svg { width:26px; height:26px; }",
-      ".panel { position:fixed; left:18px; bottom:84px; width:360px; height:560px; max-width:calc(100vw - 24px);",
-      "  background:var(--ym-card); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);",
-      "  border:1px solid var(--ym-line); border-radius:18px; overflow:hidden; display:none;",
-      "  flex-direction:column; box-shadow:0 20px 60px rgba(2,8,23,.35); color:var(--ym-txt); }",
-      ".panel.open { display:flex; }",
-      ".bar { display:flex; align-items:center; gap:6px; padding:8px 10px; cursor:move; user-select:none;",
-      "  background:linear-gradient(135deg,rgba(56,189,248,.18),rgba(2,132,199,.10)); border-bottom:1px solid var(--ym-line); flex:0 0 auto; }",
-      ".tab { border:1px solid var(--ym-line); background:transparent; color:var(--ym-txt);",
-      "  border-radius:999px; padding:4px 12px; font-size:12px; cursor:pointer; }",
-      ".tab.active { background:linear-gradient(135deg,#38bdf8,#0284c7); color:#fff; border-color:transparent; }",
-      ".sel { flex:1; min-width:0; border:1px solid var(--ym-line); background:transparent;",
-      "  color:var(--ym-txt); border-radius:8px; font-size:12px; padding:4px 6px; outline:none; }",
-      ".sel option { color:#0f172a; }",
-      ".close { border:none; background:transparent; color:var(--ym-txt); font-size:18px; line-height:1; cursor:pointer; padding:2px 7px; border-radius:8px; }",
-      ".close:hover { background:var(--ym-soft); }",
-      ".refresh { display:none; border:none; background:transparent; color:var(--ym-txt); cursor:pointer; padding:2px 6px; border-radius:8px; align-items:center; }",
-      ".refresh.show { display:inline-flex; }",
-      ".refresh:hover { background:var(--ym-soft); }",
-      ".refresh svg { width:16px; height:16px; }",
-      ".refresh.spin svg { animation:ym-rspin .8s linear infinite; }",
-      "@keyframes ym-rspin { to { transform:rotate(360deg); } }",
-      ".ctrl { display:none; align-items:center; gap:6px; padding:5px 10px; flex:0 0 auto;",
-      "  border-bottom:1px solid var(--ym-line); }",
-      ".ctrl.show { display:flex; }",
-      ".cbtn { border:1px solid var(--ym-line); background:transparent; color:var(--ym-txt); cursor:pointer;",
-      "  border-radius:999px; font-size:12px; line-height:1; padding:4px 10px; display:inline-flex; align-items:center; gap:5px; }",
-      ".cbtn:hover { background:var(--ym-soft); }",
-      ".cbtn svg { width:14px; height:14px; }",
-      ".stages { flex:1; min-height:0; position:relative; }",
-      ".stage { position:absolute; inset:0; display:none; }",
-      ".stage.active { display:block; }",
-      ".stage iframe { width:100%; height:100%; border:0; display:block; background:#fff; }",
-      ".ap-wrap { position:absolute; inset:0; overflow:auto; }",
-      ".status { position:absolute; inset:0; display:flex; flex-direction:column; gap:10px; align-items:center; justify-content:center; text-align:center; color:var(--ym-sub); font-size:13px; padding:24px; }",
-      ".status button { border:none; cursor:pointer; color:#fff; background:linear-gradient(135deg,#38bdf8,#0284c7); border-radius:999px; padding:6px 18px; font-size:13px; }",
-      ".resizer { position:absolute; right:0; bottom:0; width:22px; height:22px; cursor:nwse-resize; z-index:5; }",
-      ".resizer::after { content:''; position:absolute; right:5px; bottom:5px; width:10px; height:10px;",
-      "  border-right:2px solid var(--ym-line); border-bottom:2px solid var(--ym-line); }",
-      /* APlayer 皮肤适配（透明、贴合面板、青蓝主题） */
-      ".aplayer { width:100%; margin:0; background:transparent !important; box-shadow:none !important; border-radius:0; color:var(--ym-txt); }",
-      ".aplayer .aplayer-info { border-top:1px solid var(--ym-line); }",
-      ".aplayer .aplayer-title, .aplayer .aplayer-list ol li .aplayer-list-index, .aplayer .aplayer-time { color:var(--ym-sub); }",
-      ".aplayer .aplayer-list ol li { border-top:1px solid var(--ym-line); }",
-      ".aplayer .aplayer-list ol li.aplayer-list-light { background:var(--ym-soft); }",
-      ".aplayer .aplayer-list ol li:hover { background:var(--ym-soft); }",
-      ".aplayer .aplayer-list ol li .aplayer-list-author { color:var(--ym-sub); }",
-      ".aplayer .aplayer-lrc { text-shadow:0 1px 4px rgba(0,0,0,.35); }",
-      ".aplayer .aplayer-lrc p.aplayer-lrc-current { color:#38bdf8; }",
-      ".aplayer .aplayer-miniswitcher { background:var(--ym-soft); }",
-      ":host([data-dark]) .aplayer svg, :host([data-dark]) .aplayer .aplayer-icon { filter:invert(1) hue-rotate(180deg); }",
-      "@media (max-width:600px) {",
-      "  .fab { left:14px; bottom:14px; width:50px; height:50px; }",
-      "  .panel { left:12px !important; bottom:76px !important; width:calc(100vw - 24px) !important; height:min(76vh,600px) !important; }",
-      "  .resizer { display:none; }",
-      "}"
-    ].join("\n");
-    shadow.appendChild(style);
-
-    /* ---------------- DOM 骨架 ---------------- */
-    var wrap = document.createElement("div");
-    wrap.className = "wrap";
-    shadow.appendChild(wrap);
-
-    var fab = document.createElement("button");
-    fab.className = "fab";
-    fab.title = MUSIC_CONFIG.fabHint || "音乐";
-    fab.setAttribute("aria-label", "音乐播放器");
-    fab.innerHTML =
-      '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">' +
-      '<path d="M9 18V5l10-2v13"></path><circle cx="6" cy="18" r="3"></circle><circle cx="16" cy="16" r="3"></circle></svg>';
-    wrap.appendChild(fab);
-
-    var panel = document.createElement("div");
-    panel.className = "panel";
-    panel.innerHTML =
-      '<div class="bar"></div>' +
-      '<div class="ctrl">' +
-        '<button class="cbtn js-speed" type="button" title="播放倍速"><span class="speed-label">1.0x</span></button>' +
-        '<button class="cbtn js-order" type="button" title="播放顺序"></button>' +
-      '</div>' +
-      '<div class="stages"></div>' +
-      '<div class="resizer"></div>';
-    wrap.appendChild(panel);
-
-    var bar = panel.querySelector(".bar");
-    var stages = panel.querySelector(".stages");
-    var ctrlBar = panel.querySelector(".ctrl");
-    var speedBtn = panel.querySelector(".js-speed");
-    var speedLabel = panel.querySelector(".speed-label");
-    var orderBtn = panel.querySelector(".js-order");
-
-    var tabBtns = {};
-    platforms.forEach(function (p) {
-      var b = document.createElement("button");
-      b.className = "tab";
-      b.textContent = p.label;
-      b.dataset.key = p.key;
-      b.addEventListener("click", function () { selectTab(p.key); });
-      bar.appendChild(b);
-      tabBtns[p.key] = b;
-    });
-
-    var sel = document.createElement("select");
-    sel.className = "sel";
-    bar.appendChild(sel);
-
-    var refreshBtn = document.createElement("button");
-    refreshBtn.className = "refresh";
-    refreshBtn.title = "重新拉取最新歌单";
-    refreshBtn.setAttribute("aria-label", "刷新歌单");
-    refreshBtn.innerHTML =
-      '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">' +
-      '<path d="M21 12a9 9 0 1 1-2.64-6.36"></path><polyline points="21 3 21 9 15 9"></polyline></svg>';
-    refreshBtn.addEventListener("click", function () {
-      if (state.tab === "netease") {
-        refreshBtn.classList.add("spin");
-        setupNetease(true).finally(function () { refreshBtn.classList.remove("spin"); });
-      }
+  /* 收起态关键 CSS（与博客 #bgm-dock-critical 保持一致），内联防止展开前闪烁 */
+  var CRITICAL_CSS =
+    ".bgm-dock{--bgm-accent:" + (MUSIC_CONFIG.theme || "#0ea5e9") + ";" +
+    "position:fixed;left:16px;bottom:16px;z-index:99999;width:52px;max-width:calc(100vw - 24px);" +
+    "font-size:13px;line-height:1.4;color:#222;}" +
+    ".bgm-dock.is-open{width:320px;max-width:calc(100vw - 24px);}" +
+    ".bgm-dock__fab{position:relative;width:52px;height:52px;border:0;border-radius:50%;" +
+    "background:var(--bgm-accent);color:#fff;font-size:20px;cursor:pointer;" +
+    "box-shadow:0 8px 22px rgba(0,0,0,.28);display:inline-flex;align-items:center;justify-content:center;touch-action:none;}" +
+    ".bgm-dock__fab.is-dragging{cursor:grabbing;opacity:.92;}" +
+    ".bgm-dock:not(.is-open) .bgm-dock__fab{--bgm-peek:18px;transition:transform .28s cubic-bezier(.22,.61,.36,1);will-change:transform;}" +
+    // 收起态半吸附到屏幕边缘：默认只露出一小截（半圆即可 hover），鼠标移上 /
+    // 键盘聚焦 / 拖拽 / 已全露 时整个滑回屏幕内，保证桌面鼠标始终点得到。
+    // 触摸设备点一下全露、再点展开（见 bgm-dock.js 的 is-revealed 逻辑）。
+    ".bgm-dock:not(.is-open) .bgm-dock__fab.is-peek-left{transform:translateX(calc(var(--bgm-peek) - 100%));}" +
+    ".bgm-dock:not(.is-open) .bgm-dock__fab.is-peek-right{transform:translateX(calc(100% - var(--bgm-peek)));}" +
+    ".bgm-dock:not(.is-open) .bgm-dock__fab:hover," +
+    ".bgm-dock:not(.is-open) .bgm-dock__fab:focus-visible," +
+    ".bgm-dock:not(.is-open) .bgm-dock__fab.is-revealed," +
+    ".bgm-dock:not(.is-open) .bgm-dock__fab.is-dragging{transform:none;}" +
+    // 触摸（无 hover）首次点按仅全露：未全露时不要因 hover 规则干扰（触摸无 hover，
+    // 该媒体查询下默认半藏即可）。
+    "@media (hover:none),(pointer:coarse){" +
+    ".bgm-dock:not(.is-open) .bgm-dock__fab.is-peek-left{transform:translateX(calc(var(--bgm-peek) - 100%));}" +
+    ".bgm-dock:not(.is-open) .bgm-dock__fab.is-peek-right{transform:translateX(calc(100% - var(--bgm-peek)));}}" +
+    ".bgm-dock__fab svg{width:22px;height:22px;fill:currentColor;display:block;}" +
+    ".bgm-dock__fab-bar{position:absolute;right:9px;top:9px;width:9px;height:9px;border-radius:50%;" +
+    "background:#2ecc71;border:2px solid #fff;opacity:0;}" +
+    ".bgm-dock.is-playing .bgm-dock__fab-bar{opacity:1;}" +
+    ".bgm-dock__panel{display:none;}" +
+    ".bgm-dock.is-open .bgm-dock__panel{display:flex;}" +
+    ".bgm-dock.is-open .bgm-dock__fab{display:none;}" +
+    ".bgm-dock__overlay{position:fixed;inset:0;z-index:999999;cursor:grabbing;user-select:none;}" +
+    "@media (max-width:768px){.bgm-dock{left:14px;bottom:14px;width:52px;}" +
+    ".bgm-dock.is-open{width:auto;left:0;right:0;bottom:0;max-width:none;}}";
+
+  function buildSources() {
+    var sources = [];
+    var i = 0;
+    (MUSIC_CONFIG.spotify || []).forEach(function (s) {
+      if (!s || !s.id) return;
+      sources.push({
+        name: s.name || "Spotify",
+        type: "spotify",
+        resourceType: "playlist",
+        id: String(s.id),
+        key: "spotify-" + i++
+      });
     });
-    bar.appendChild(refreshBtn);
-
-    var closeBtn = document.createElement("button");
-    closeBtn.className = "close";
-    closeBtn.innerHTML = "&times;";
-    closeBtn.addEventListener("click", close);
-    bar.appendChild(closeBtn);
-
-    /* 每个平台一个常驻 stage（切换/收起只隐藏，不销毁，播放不中断、不重载） */
-    var stageEl = {};
-    platforms.forEach(function (p) {
-      var d = document.createElement("div");
-      d.className = "stage";
-      d.dataset.key = p.key;
-      stages.appendChild(d);
-      stageEl[p.key] = d;
+    (MUSIC_CONFIG.netease || []).forEach(function (s) {
+      if (!s || !s.id) return;
+      sources.push({
+        name: s.name || "网易云",
+        type: "netease",
+        resourceType: "playlist",
+        id: String(s.id),
+        key: "netease-" + i++
+      });
     });
+    // 默认源标记
+    var wantDefault = MUSIC_CONFIG.defaultTab === "netease" ? "netease" : "spotify";
+    var def = sources.filter(function (s) { return s.type === wantDefault; })[0] || sources[0];
+    if (def) def.default = true;
+    return sources;
+  }
 
-    var state = {
-      tab: MUSIC_CONFIG.defaultTab,
-      idx: {},
-      ready: {},   // 该平台当前 stage 是否已初始化
-      ap: null,    // 网易云 APlayer 实例
-      tracks: null,
-      loading: false
+  function init() {
+    if (window.__yuuichiBgmInited) return;
+    if (document.getElementById("bgm-dock")) return;
+    window.__yuuichiBgmInited = true;
+
+    var sources = buildSources();
+    if (!sources.length) return;
+
+    var styleEl = document.createElement("style");
+    styleEl.id = "bgm-dock-critical";
+    styleEl.textContent = CRITICAL_CSS;
+    document.head.appendChild(styleEl);
+
+    var dock = document.createElement("div");
+    dock.id = "bgm-dock";
+    dock.className = "bgm-dock";
+    dock.setAttribute(
+      "data-bgm",
+      JSON.stringify({
+        sources: sources,
+        autoplay: MUSIC_CONFIG.autoplay === true,
+        order: MUSIC_CONFIG.order === "random" ? "random" : "list",
+        volume: typeof MUSIC_CONFIG.volume === "number" ? MUSIC_CONFIG.volume : 0.6,
+        theme: MUSIC_CONFIG.theme || "#0ea5e9",
+        assetBase: ASSET_BASE,
+        metingApi: METING_API
+      })
+    );
+    document.body.appendChild(dock);
+
+    // 收起态只依赖内联 CRITICAL_CSS，主脚本 bgm-dock.js（~28KB）推迟到浏览器
+    // 空闲 / load 后再拉，避免与首屏 JS、目录列表、背景图争抢带宽与主线程。
+    var s = document.createElement("script");
+    s.src = ASSET_BASE + "/js/bgm-dock.js";
+    s.defer = true;
+    s.onerror = function () {
+      // 加载失败时至少保证按钮还能看到，避免完全无反应
+      try { dock.style.display = "none"; } catch (e) {}
     };
-    platforms.forEach(function (p) { state.idx[p.key] = 0; state.ready[p.key] = false; });
-    if (!tabBtns[state.tab]) state.tab = platforms[0].key;
-
-    var SPEEDS = [1, 1.25, 1.5, 2, 0.75];
-    var speedIdx = 0;
-    var ORDER_MODES = [
-      { loop: "all",   order: "list",   label: "列表循环", icon: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="17 1 21 5 17 9"></polyline><path d="M3 11V9a4 4 0 0 1 4-4h14"></path><polyline points="7 23 3 19 7 15"></polyline><path d="M21 13v2a4 4 0 0 1-4 4H3"></path></svg>' },
-      { loop: "one",   order: "list",   label: "单曲循环", icon: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 2l4 4-4 4"></path><path d="M3 11v-1a4 4 0 0 1 4-4h14"></path><path d="M7 22l-4-4 4-4"></path><path d="M21 13v1a4 4 0 0 1-4 4H3"></path><text x="12" y="15" text-anchor="middle" font-size="9" fill="currentColor" stroke="none">1</text></svg>' },
-      { loop: "none",  order: "random", label: "随机播放", icon: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="16 3 21 3 21 8"></polyline><line x1="4" y1="20" x2="21" y2="3"></line><polyline points="21 16 21 21 16 21"></polyline><line x1="15" y1="15" x2="21" y2="21"></line><line x1="4" y1="4" x2="9" y2="9"></line></svg>' },
-      { loop: "all",   order: "list",   label: "全部循环", icon: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 2l4 4-4 4"></path><path d="M3 11v-1a4 4 0 0 1 4-4h14"></path><path d="M7 22l-4-4 4-4"></path><path d="M21 13v1a4 4 0 0 1-4 4H3"></path></svg>' }
-    ];
-    var orderIdx = 0;
-    try {
-      var sv = parseFloat(localStorage.getItem("ym-speed"));
-      var si = SPEEDS.indexOf(sv);
-      if (si >= 0) speedIdx = si;
-      var oi = parseInt(localStorage.getItem("ym-order"), 10);
-      if (!isNaN(oi) && ORDER_MODES[oi]) orderIdx = oi;
-    } catch (e) {}
-
-    function applySpeed() {
-      var rate = SPEEDS[speedIdx];
-      speedLabel.textContent = (rate % 1 === 0 ? rate.toFixed(1) : String(rate)) + "x";
-      try {
-        if (state.ap && state.ap.audio) state.ap.audio.playbackRate = rate;
-        localStorage.setItem("ym-speed", String(rate));
-      } catch (e) {}
-    }
-
-    function applyOrder() {
-      var mode = ORDER_MODES[orderIdx];
-      orderBtn.innerHTML = mode.icon + '<span class="order-label">' + mode.label + '</span>';
-      orderBtn.title = "播放顺序：" + mode.label;
-      try {
-        if (state.ap && state.ap.options) {
-          state.ap.options.loop = mode.loop;
-          state.ap.options.order = mode.order;
-        }
-        localStorage.setItem("ym-order", String(orderIdx));
-      } catch (e) {}
-    }
-
-    speedBtn.addEventListener("click", function () {
-      speedIdx = (speedIdx + 1) % SPEEDS.length;
-      applySpeed();
-    });
-    orderBtn.addEventListener("click", function () {
-      orderIdx = (orderIdx + 1) % ORDER_MODES.length;
-      applyOrder();
-    });
-    applySpeed();
-    applyOrder();
-
-    function currentPlatform() {
-      for (var i = 0; i < platforms.length; i++) if (platforms[i].key === state.tab) return platforms[i];
-      return platforms[0];
-    }
-
-    function loadScriptOnce(attr, src) {
-      return new Promise(function (resolve, reject) {
-        var existing = document.querySelector("script[" + attr + "]");
-        if (existing) {
-          if (existing.dataset.loaded === "1") return resolve();
-          existing.addEventListener("load", function () { resolve(); });
-          existing.addEventListener("error", reject);
-          return;
-        }
-        var s = document.createElement("script");
-        s.async = true;
-        s.setAttribute(attr, "1");
-        s.onload = function () { s.dataset.loaded = "1"; resolve(); };
-        s.onerror = reject;
-        s.src = src;
-        document.head.appendChild(s);
-      });
-    }
-
-    function loadScript(src) {
-      return loadScriptOnce("data-ym-aplayer", src);
-    }
-
-    /* 实时同源接口：Worker 服务端优先走自建 Meting、失败回退网易云官方，无 CORS */
-    function fetchWithTimeout(url, ms) {
-      var ctrl = ("AbortController" in window) ? new AbortController() : null;
-      var timer = ctrl ? setTimeout(function () { ctrl.abort(); }, ms) : null;
-      return fetch(url, { cache: "no-store", signal: ctrl ? ctrl.signal : undefined })
-        .finally(function () { if (timer) clearTimeout(timer); });
-    }
-
-    async function fetchPlaylist(item, force) {
-      var url = "/api/music/netease?id=" + encodeURIComponent(item.id) + (force ? "&refresh=1" : "");
-      var res = await fetchWithTimeout(url, 15000);
-      var j = await res.json();
-      if (!j || j.code !== 200 || !Array.isArray(j.data && j.data.songs) || !j.data.songs.length) {
-        throw new Error("empty");
-      }
-      return j.data.songs;
-    }
-
-    function statusEl(el, msg, withRetry) {
-      el.innerHTML = "";
-      var d = document.createElement("div");
-      d.className = "status";
-      var span = document.createElement("span");
-      span.textContent = msg;
-      d.appendChild(span);
-      if (withRetry) {
-        var btn = document.createElement("button");
-        btn.textContent = "重试";
-        btn.addEventListener("click", function () { setupNetease(true); });
-        d.appendChild(btn);
-      }
-      el.appendChild(d);
-    }
-
-    async function setupNetease(force) {
-      var el = stageEl.netease;
-      if (state.ready.netease && !force) return;
-      if (state.loading) return;
-      state.loading = true;
-      statusEl(el, "正在加载网易云歌单…", false);
-      try {
-        var item = MUSIC_CONFIG.netease[state.idx.netease || 0];
-        var list = await fetchPlaylist(item, !!force);
-        state.tracks = list;
-
-        if (state.ap) { try { state.ap.destroy(); } catch (e) {} state.ap = null; }
-        el.innerHTML = '<div class="ap-wrap"></div>';
-        ensureVendorCss();
-        await loadScript("/brand/vendor/APlayer.min.js");
-
-        var mode = ORDER_MODES[orderIdx];
-        var ap = new window.APlayer({
-          container: el.querySelector(".ap-wrap"),
-          fixed: false,
-          mini: false,
-          autoplay: !!MUSIC_CONFIG.autoplay,
-          theme: "#0ea5e9",
-          loop: mode.loop,
-          order: mode.order,
-          listMaxHeight: "999px",
-          lrcType: list[0].lrc ? 3 : 0,
-          audio: list.map(function (t) {
-            return { name: t.name, artist: t.artist, url: t.url, cover: t.pic, lrc: t.lrc, theme: "#0ea5e9" };
-          })
-        });
-        state.ap = ap;
-        var audio = ap.audio;
-        if (audio) {
-          audio.playbackRate = SPEEDS[speedIdx];
-          audio.addEventListener("play", function () { audio.playbackRate = SPEEDS[speedIdx]; });
-        }
-        state.ready.netease = true;
-      } catch (e) {
-        statusEl(el, "网易云歌单加载失败（解析服务可能暂时不可用）", true);
-      } finally {
-        state.loading = false;
-      }
-    }
-
-    function spotifySrc(item) {
-      var dark = document.body.classList.contains("hope-ui-dark");
-      return "https://open.spotify.com/embed/playlist/" + encodeURIComponent(item.id) +
-        "?utm_source=generator&theme=" + (dark ? "0" : "1");
-    }
-
-    function setupSpotify(force) {
-      var el = stageEl.spotify;
-      if (state.ready.spotify && !force) return;
-      var item = MUSIC_CONFIG.spotify[state.idx.spotify || 0];
-      el.innerHTML = "";
-      var ifr = document.createElement("iframe");
-      ifr.loading = "lazy";
-      ifr.allow = "autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture";
-      ifr.referrerPolicy = "no-referrer";
-      ifr.src = spotifySrc(item);
-      el.appendChild(ifr);
-      state.ready.spotify = true;
-    }
-
-    function fillSelect(p) {
-      sel.innerHTML = "";
-      if (p.items.length <= 1) { sel.style.display = "none"; return; }
-      sel.style.display = "";
-      p.items.forEach(function (it, i) {
-        var o = document.createElement("option");
-        o.value = String(i);
-        o.textContent = it.name || ("歌单 " + (i + 1));
-        sel.appendChild(o);
+    var load = function () { document.body.appendChild(s); };
+    if (document.readyState === "complete") {
+      var ric = window.requestIdleCallback || function (cb) { return setTimeout(cb, 200); };
+      ric(load, { timeout: 2500 });
+    } else {
+      window.addEventListener("load", function () {
+        var ric = window.requestIdleCallback || function (cb) { return setTimeout(cb, 300); };
+        ric(load, { timeout: 3000 });
       });
-      sel.value = String(state.idx[p.key] || 0);
-    }
-
-    function activateStages(key) {
-      Object.keys(stageEl).forEach(function (k) {
-        stageEl[k].classList.toggle("active", k === key);
-      });
-      ctrlBar.classList.toggle("show", key === "netease");
-      refreshBtn.classList.toggle("show", key === "netease");
-    }
-
-    function selectTab(key) {
-      state.tab = key;
-      Object.keys(tabBtns).forEach(function (k) { tabBtns[k].classList.toggle("active", k === key); });
-      var p = currentPlatform();
-      fillSelect(p);
-      activateStages(key);
-      if (key === "netease") setupNetease(false);
-      else setupSpotify(false);
-      try { localStorage.setItem("ym-tab", key); } catch (e) {}
-    }
-
-    sel.addEventListener("change", function () {
-      var key = state.tab;
-      state.idx[key] = parseInt(sel.value, 10) || 0;
-      if (key === "netease") setupNetease(true);
-      else setupSpotify(true);
-    });
-
-    function open() {
-      panel.classList.add("open");
-      var key = state.tab;
-      Object.keys(tabBtns).forEach(function (k) { tabBtns[k].classList.toggle("active", k === key); });
-      fillSelect(currentPlatform());
-      activateStages(key);
-      if (key === "netease") setupNetease(true);
-      else setupSpotify(false);
-      try { localStorage.setItem("ym-open", "1"); } catch (e) {}
-    }
-    function close() {
-      panel.classList.remove("open");
-      fab.classList.remove("peek");
-      state.ready.netease = false;
-      try { localStorage.setItem("ym-open", "0"); } catch (e) {}
-    }
-    fab.addEventListener("click", function (ev) {
-      // 第一次点击在半露出吸附态时只负责全露出，不立刻打开面板；再次点击才打开。
-      if (!panel.classList.contains("open") && !fab.classList.contains("peek")) {
-        fab.classList.add("peek");
-        ev.stopPropagation();
-        return;
-      }
-      fab.classList.remove("peek");
-      panel.classList.contains("open") ? close() : open();
-    });
-    // 触屏没有 hover：点 FAB 之外恢复半露出；面板打开时不收起，避免遮挡交互。
-    document.addEventListener("pointerdown", function (ev) {
-      if (panel.classList.contains("open")) return;
-      if (wrap.contains(ev.target)) return;
-      fab.classList.remove("peek");
-    }, true);
-
-    /* 记忆位置/尺寸/上次标签 */
-    try {
-      var savedRect = JSON.parse(localStorage.getItem("ym-rect") || "null");
-      if (savedRect && savedRect.w && savedRect.h && !window.matchMedia("(max-width:600px)").matches) {
-        panel.style.left = savedRect.x + "px";
-        panel.style.top = savedRect.y + "px";
-        panel.style.bottom = "auto";
-        panel.style.width = savedRect.w + "px";
-        panel.style.height = savedRect.h + "px";
-      }
-      var savedTab = localStorage.getItem("ym-tab");
-      if (savedTab && tabBtns[savedTab]) state.tab = savedTab;
-    } catch (e) {}
-
-    function isMobile() { return window.matchMedia("(max-width:600px)").matches; }
-    function saveRect() {
-      if (isMobile()) return;
-      var r = panel.getBoundingClientRect();
-      try { localStorage.setItem("ym-rect", JSON.stringify({ x: r.left, y: r.top, w: r.width, h: r.height })); } catch (e) {}
-    }
-
-    /* 拖动 */
-    var drag = null;
-    function startDrag(ev) {
-      if (ev.target.closest(".tab,.close,.sel")) return;
-      var pt = ev.touches ? ev.touches[0] : ev;
-      var r = panel.getBoundingClientRect();
-      drag = { x: pt.clientX, y: pt.clientY, left: r.left, top: r.top };
-      panel.style.left = r.left + "px";
-      panel.style.top = r.top + "px";
-      panel.style.bottom = "auto";
-      ev.preventDefault();
-    }
-    function moveDrag(ev) {
-      if (!drag) return;
-      var pt = ev.touches ? ev.touches[0] : ev;
-      var nx = drag.left + (pt.clientX - drag.x);
-      var ny = drag.top + (pt.clientY - drag.y);
-      var r = panel.getBoundingClientRect();
-      nx = Math.max(0, Math.min(window.innerWidth - r.width, nx));
-      ny = Math.max(0, Math.min(window.innerHeight - 60, ny));
-      panel.style.left = nx + "px";
-      panel.style.top = ny + "px";
-    }
-    function endDrag() { if (drag) { drag = null; saveRect(); } }
-    bar.addEventListener("mousedown", startDrag);
-    window.addEventListener("mousemove", moveDrag);
-    window.addEventListener("mouseup", endDrag);
-    bar.addEventListener("touchstart", startDrag, { passive: false });
-    window.addEventListener("touchmove", moveDrag, { passive: false });
-    window.addEventListener("touchend", endDrag);
-
-    /* 缩放（桌面） */
-    var resizer = panel.querySelector(".resizer");
-    var rsz = null;
-    resizer.addEventListener("mousedown", function (ev) {
-      var r = panel.getBoundingClientRect();
-      rsz = { x: ev.clientX, y: ev.clientY, w: r.width, h: r.height, left: r.left, top: r.top };
-      panel.style.left = r.left + "px";
-      panel.style.top = r.top + "px";
-      panel.style.bottom = "auto";
-      ev.preventDefault();
-      ev.stopPropagation();
-    });
-    window.addEventListener("mousemove", function (ev) {
-      if (!rsz) return;
-      var w = Math.max(300, rsz.w + (ev.clientX - rsz.x));
-      var h = Math.max(360, rsz.h + (ev.clientY - rsz.y));
-      w = Math.min(w, window.innerWidth - rsz.left - 8);
-      panel.style.width = w + "px";
-      panel.style.height = h + "px";
-    });
-    window.addEventListener("mouseup", function () { if (rsz) { rsz = null; saveRect(); } });
-
-    /* 明暗主题：同步宿主属性；Spotify 已初始化时重建一次（仅换主题，曲目由其自身续播） */
-    function syncDark() {
-      var dark = document.body.classList.contains("hope-ui-dark");
-      if (dark) host.setAttribute("data-dark", "");
-      else host.removeAttribute("data-dark");
     }
-    syncDark();
-    var mo = new MutationObserver(syncDark);
-    mo.observe(document.body, { attributes: true, attributeFilter: ["class"] });
   }
 
   if (document.readyState === "loading") document.addEventListener("DOMContentLoaded", init);