beauticode-dsh 1.0.13 → 1.0.14

package/client.js

@@ -7,9 +7,10 @@
   const clientId =
     globalThis.crypto?.randomUUID?.() ||
     `bc-${Date.now().toString(36)}-${Math.random().toString(36).slice(2)}`;
-  const desiredModes = { fish: false, muted: true, tone: "auto" };
-  let activePayload = null;
-  let playbackBlocked = false;
+  const desiredModes = { fish: false, muted: true, tone: "auto" };
+  let activePayload = null;
+  let renderPhase = "idle";
+  let playbackBlocked = false;
   const systemDarkMedia = globalThis.matchMedia?.("(prefers-color-scheme: dark)") ?? null;
   let themeSyncQueued = false;
 
@@ -160,8 +161,11 @@ html[data-bc-fish="true"] #root{opacity:0!important;visibility:hidden!important;
     };
   }
 
-  async function acknowledgeRender(payload, ok, visible, error = null) {
-    await postAck({
+  async function acknowledgeRender(payload, ok, visible, error = null) {
+    if (activePayload === payload) {
+      renderPhase = ok ? "ready" : "failed";
+    }
+    await postAck({
       kind: "render",
       generation: payload.generation,
       media: payload.media,
@@ -329,9 +333,10 @@ html[data-bc-fish="true"] #root{opacity:0!important;visibility:hidden!important;
     globalThis.BeauticodeAtmosphere?.setWindowMode?.(on ? "on" : "closed");
   }
 
-  async function applyBackground(payload) {
-    if (!Number.isSafeInteger(payload?.generation)) return;
-    activePayload = payload;
+  async function applyBackground(payload) {
+    if (!Number.isSafeInteger(payload?.generation)) return;
+    activePayload = payload;
+    renderPhase = "pending";
     document.documentElement.dataset.bcGeneration = String(payload.generation);
     syncGallery(payload);
     if (payload.media === "clear") {
@@ -417,9 +422,9 @@ html[data-bc-fish="true"] #root{opacity:0!important;visibility:hidden!important;
       } catch {
         playbackBlocked = desiredModes.muted === false;
       }
-      if (activePayload?.media === "video") {
-        await acknowledgeRender(activePayload, video.readyState >= 2 && !video.paused, true);
-      }
+      if (activePayload?.media === "video" && renderPhase === "ready") {
+        await acknowledgeRender(activePayload, true, true);
+      }
     } else {
       playbackBlocked = false;
     }
@@ -441,8 +446,15 @@ html[data-bc-fish="true"] #root{opacity:0!important;visibility:hidden!important;
 
   setInterval(() => {
     const video = activeVideo();
-    if (activePayload?.media === "video" && video instanceof HTMLVideoElement) {
-      void acknowledgeRender(activePayload, video.readyState >= 2 && !video.paused, true);
-    }
+    if (
+      activePayload?.media === "video" &&
+      renderPhase === "ready" &&
+      video instanceof HTMLVideoElement
+    ) {
+      // A heartbeat is observational, not a second render verdict. Playback can
+      // briefly pause while Chromium changes modes or refills an 8K buffer; do
+      // not downgrade an already-rendered generation or fail a pending one.
+      void acknowledgeRender(activePayload, true, true);
+    }
   }, 1_000);
 })();

package/console.js

@@ -16,44 +16,48 @@
 #beauticode-console.rail .bc-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
 #beauticode-console .bc-icon{flex:none;display:block}
 #beauticode-console .bc-label{white-space:nowrap;overflow:hidden}
-#beauticode-console-pop{position:fixed;z-index:2000;box-sizing:border-box;width:220px;padding:10px;border:1px solid rgba(255,255,255,.08);border-radius:16px;background:#2c323c;color:#e8eaed;box-shadow:var(--dsw-shadow-lv2,0 8px 24px rgba(0,0,0,.28));font:inherit;font-size:13px}
-#beauticode-console-pop *{box-sizing:border-box;font-family:inherit}
-body:not([data-ds-dark-theme]) #beauticode-console-pop{background:#fff;color:#1b1f24;border-color:rgba(0,0,0,.08)}
-#beauticode-console-pop .bc-status{color:var(--dsw-alias-label-secondary,#9aa3ad);font-size:12px;line-height:18px;margin:0 0 8px}
-#beauticode-console-pop .bc-row{display:flex;gap:6px;margin:0 0 6px}
-#beauticode-console-pop .bc-btn,#beauticode-console-pop .bc-theme-toggle{cursor:pointer;flex:1;min-width:0;height:32px;padding:0 8px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(255,255,255,.06);color:inherit;font-size:13px;line-height:20px}
-body:not([data-ds-dark-theme]) #beauticode-console-pop .bc-btn,
-body:not([data-ds-dark-theme]) #beauticode-console-pop .bc-theme-toggle{border-color:rgba(0,0,0,.08);background:#f4f6f8}
-#beauticode-console-pop .bc-btn:hover,#beauticode-console-pop .bc-theme-toggle:hover{background:rgba(255,255,255,.12)}
-body:not([data-ds-dark-theme]) #beauticode-console-pop .bc-btn:hover,
-body:not([data-ds-dark-theme]) #beauticode-console-pop .bc-theme-toggle:hover{background:#eceff3}
-#beauticode-console-pop .bc-btn:disabled,#beauticode-console-pop .bc-theme-toggle:disabled,#beauticode-console-pop .bc-theme-item:disabled{opacity:.45;cursor:default}
-#beauticode-console-pop .bc-btn.on{background:rgba(255,255,255,.16)}
-#beauticode-console-pop .bc-theme-toggle{width:100%;text-align:left}
-#beauticode-console-pop .bc-theme-list{margin:6px 0 0;max-height:160px;overflow:auto;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:#232830;padding:4px}
-body:not([data-ds-dark-theme]) #beauticode-console-pop .bc-theme-list{border-color:rgba(0,0,0,.08);background:#f4f6f8}
-#beauticode-console-pop .bc-theme-row{display:flex;gap:4px;align-items:center}
-#beauticode-console-pop .bc-theme-item{cursor:pointer;display:block;flex:1;min-width:0;height:32px;padding:0 8px;border:none;border-radius:8px;background:transparent;color:inherit;font-size:13px;line-height:32px;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
-#beauticode-console-pop .bc-theme-item:hover{background:rgba(255,255,255,.08)}
-body:not([data-ds-dark-theme]) #beauticode-console-pop .bc-theme-item:hover{background:rgba(0,0,0,.06)}
-#beauticode-console-pop .bc-source{margin-left:6px;font-size:11px;opacity:.62}
-#beauticode-console-pop .bc-theme-del{cursor:pointer;flex:none;width:32px;height:32px;padding:0;border:none;border-radius:8px;background:transparent;color:inherit;font-size:12px;opacity:.72}
-#beauticode-console-pop .bc-theme-del:hover{background:rgba(255,255,255,.08);opacity:1}
-body:not([data-ds-dark-theme]) #beauticode-console-pop .bc-theme-del:hover{background:rgba(0,0,0,.06)}
-#beauticode-console-pop .bc-msg{color:var(--dsw-alias-label-secondary,#9aa3ad);font-size:12px;line-height:16px;margin:6px 0 0;max-height:3.2em;overflow:hidden}
+#beauticode-console-pop{position:fixed;z-index:2000;box-sizing:border-box;width:256px;padding:0 14px 12px;border:1px solid rgba(23,26,29,.24);border-top:4px solid #252a30;border-radius:2px;background:#ece9e2;color:#202327;box-shadow:0 16px 36px rgba(0,0,0,.34);font:inherit;font-size:13px}
+#beauticode-console-pop *{box-sizing:border-box;font-family:inherit}
+body:not([data-ds-dark-theme]) #beauticode-console-pop{background:#f3f0e9;color:#202327;border-color:rgba(23,26,29,.22)}
+#beauticode-console-pop .bc-head{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;padding:12px 0 10px;border-bottom:1px solid #b9b6af}
+#beauticode-console-pop .bc-title{margin:0;font:650 16px/20px Georgia,"Songti SC","STSong",serif;letter-spacing:.02em}
+#beauticode-console-pop .bc-status{min-width:0;max-width:142px;color:#686d71;font:10px/15px ui-monospace,"Cascadia Mono",monospace;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+#beauticode-console-pop .bc-import{cursor:pointer;display:grid;grid-template-columns:34px minmax(0,1fr) 18px;align-items:center;width:100%;min-height:49px;padding:0;border:0;border-bottom:1px solid #c8c5be;background:transparent;color:inherit;text-align:left}
+#beauticode-console-pop .bc-import:hover{background:rgba(32,35,39,.05)}
+#beauticode-console-pop .bc-index{color:#74787b;font:10px ui-monospace,"Cascadia Mono",monospace}
+#beauticode-console-pop .bc-import-copy{min-width:0}
+#beauticode-console-pop .bc-import strong{display:block;font-size:13px;line-height:17px;font-weight:650}
+#beauticode-console-pop .bc-import small{display:block;color:#717579;font-size:10px;line-height:14px}
+#beauticode-console-pop .bc-arrow{font-size:16px;text-align:right}
+#beauticode-console-pop .bc-controls{display:flex;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid #c8c5be}
+#beauticode-console-pop .bc-link{cursor:pointer;height:auto;padding:0;border:0;background:transparent;color:#595e62;font-size:11px;line-height:18px;text-decoration:underline;text-underline-offset:3px}
+#beauticode-console-pop .bc-link:hover{color:#171a1d}
+#beauticode-console-pop .bc-theme-toggle{cursor:pointer;display:flex;align-items:center;justify-content:space-between;width:100%;height:31px;padding:8px 0 4px;border:0;background:transparent;color:#686d71;font:10px ui-monospace,"Cascadia Mono",monospace;letter-spacing:.08em;text-align:left}
+#beauticode-console-pop .bc-theme-list{max-height:150px;overflow:auto;scrollbar-width:thin}
+#beauticode-console-pop .bc-theme-row{display:flex;align-items:center;min-width:0;border-bottom:1px dotted #bbb8b1}
+#beauticode-console-pop .bc-theme-row:last-child{border-bottom:0}
+#beauticode-console-pop .bc-theme-item{cursor:pointer;display:flex;align-items:center;flex:1;min-width:0;height:31px;padding:0;border:0;background:transparent;color:inherit;font-size:12px;line-height:31px;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+#beauticode-console-pop .bc-theme-item::before{content:"";flex:none;width:16px;font-size:9px}
+#beauticode-console-pop .bc-theme-item[aria-current="true"]{font-weight:650}
+#beauticode-console-pop .bc-theme-item[aria-current="true"]::before{content:"●"}
+#beauticode-console-pop .bc-theme-item:hover{background:rgba(32,35,39,.05)}
+#beauticode-console-pop .bc-source{margin-left:auto;padding-left:6px;color:#777b7e;font:9px ui-monospace,"Cascadia Mono",monospace}
+#beauticode-console-pop .bc-theme-del{cursor:pointer;flex:none;width:22px;height:28px;padding:0;border:0;background:transparent;color:#777b7e;font-size:15px;line-height:28px;opacity:.66}
+#beauticode-console-pop .bc-theme-del:hover{color:#802f2f;opacity:1}
+#beauticode-console-pop .bc-btn:disabled,#beauticode-console-pop .bc-theme-toggle:disabled,#beauticode-console-pop .bc-theme-item:disabled,#beauticode-console-pop .bc-theme-del:disabled{opacity:.38;cursor:default}
+#beauticode-console-pop[data-busy="true"] .bc-head::before{content:"";width:5px;height:5px;margin:0 0 6px;background:#6d7f8c;animation:bc-pulse .9s steps(2,end) infinite}
+#beauticode-console-pop .bc-msg{margin:9px 0 0;color:#656a6e;font-size:11px;line-height:16px;max-height:3.2em;overflow:hidden}
+@keyframes bc-pulse{50%{opacity:.25}}
 #beauticode-console-file{display:none !important}
 #beauticode-name-dialog{position:fixed;inset:0;z-index:3000;display:grid;place-items:center;padding:24px;background:rgba(0,0,0,.42);font:inherit}
-#beauticode-name-dialog .bc-name-card{display:flex;flex-direction:column;gap:10px;width:min(380px,calc(100vw - 48px));padding:18px;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:#2c323c;color:#e8eaed;box-shadow:0 18px 60px rgba(0,0,0,.35)}
-#beauticode-name-dialog .bc-name-title{margin:0;font-size:15px;font-weight:600}
-#beauticode-name-dialog .bc-name-file,#beauticode-name-dialog .bc-name-note,#beauticode-name-dialog .bc-name-error{margin:0;color:#aeb7c3;font-size:12px;line-height:18px;overflow-wrap:anywhere}
-#beauticode-name-dialog .bc-name-error{color:#ff9a9a}
-#beauticode-name-dialog input{height:36px;padding:0 10px;border:1px solid rgba(255,255,255,.14);border-radius:10px;background:rgba(255,255,255,.08);color:inherit;font:inherit;font-size:13px}
+#beauticode-name-dialog .bc-name-card{display:flex;flex-direction:column;gap:10px;width:min(380px,calc(100vw - 48px));padding:20px;border:1px solid #aaa69e;border-top:4px solid #252a30;border-radius:2px;background:#ece9e2;color:#202327;box-shadow:0 18px 60px rgba(0,0,0,.35)}
+#beauticode-name-dialog .bc-name-title{margin:0;font:650 17px Georgia,"Songti SC","STSong",serif}
+#beauticode-name-dialog .bc-name-file,#beauticode-name-dialog .bc-name-note,#beauticode-name-dialog .bc-name-error{margin:0;color:#666b6f;font-size:12px;line-height:18px;overflow-wrap:anywhere}
+#beauticode-name-dialog .bc-name-error{color:#8d3030}
+#beauticode-name-dialog input{height:38px;padding:0 10px;border:1px solid #a8a49c;border-radius:0;background:#f7f4ed;color:inherit;font:inherit;font-size:13px}
 #beauticode-name-dialog .bc-name-actions{display:flex;justify-content:flex-end;gap:8px}
-#beauticode-name-dialog button{cursor:pointer;height:34px;padding:0 13px;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:rgba(255,255,255,.08);color:inherit;font:inherit}
-#beauticode-name-dialog button[data-name="confirm"]{background:#4f7cff;border-color:#4f7cff;color:#fff}
-body:not([data-ds-dark-theme]) #beauticode-name-dialog .bc-name-card{background:#fff;color:#1b1f24;border-color:rgba(0,0,0,.1)}
-body:not([data-ds-dark-theme]) #beauticode-name-dialog input,body:not([data-ds-dark-theme]) #beauticode-name-dialog button{border-color:rgba(0,0,0,.12);background:#f4f6f8}
-body:not([data-ds-dark-theme]) #beauticode-name-dialog button[data-name="confirm"]{background:#315efb;border-color:#315efb;color:#fff}
+#beauticode-name-dialog button{cursor:pointer;height:34px;padding:0 13px;border:1px solid #8d8a84;border-radius:0;background:transparent;color:inherit;font:inherit}
+#beauticode-name-dialog button[data-name="confirm"]{background:#252a30;border-color:#252a30;color:#f7f4ed}
 `;
   document.head.append(style);
 
@@ -69,24 +73,20 @@ body:not([data-ds-dark-theme]) #beauticode-name-dialog button[data-name="confirm
     '<span class="bc-label">背景</span></button>';
 
   const pop = document.createElement("div");
-  pop.id = "beauticode-console-pop";
-  pop.hidden = true;
-  pop.innerHTML =
-    '<p class="bc-status">未就绪</p>' +
-    '<div class="bc-row">' +
-    '<button type="button" class="bc-btn" data-act="image">图片</button>' +
-    '<button type="button" class="bc-btn" data-act="video">视频</button>' +
-    "</div>" +
-    '<div class="bc-row">' +
-    '<button type="button" class="bc-btn" data-act="clear">清除</button>' +
-    '<button type="button" class="bc-btn" data-act="sound">声音</button>' +
-    "</div>" +
-    '<div class="bc-row">' +
-    '<button type="button" class="bc-btn" data-act="gallery">皮肤中心</button>' +
-    "</div>" +
-    '<div class="bc-themes" hidden>' +
-    '<button type="button" class="bc-theme-toggle" aria-expanded="false">已保存主题</button>' +
-    '<div class="bc-theme-list" hidden></div>' +
+  pop.id = "beauticode-console-pop";
+  pop.hidden = true;
+  pop.innerHTML =
+    '<header class="bc-head"><h2 class="bc-title">背景清单</h2><span class="bc-status">未就绪</span></header>' +
+    '<button type="button" class="bc-btn bc-import" data-act="image"><span class="bc-index">01</span><span class="bc-import-copy"><strong>导入图片</strong><small>直接引用本地文件</small></span><span class="bc-arrow">→</span></button>' +
+    '<button type="button" class="bc-btn bc-import" data-act="video"><span class="bc-index">02</span><span class="bc-import-copy"><strong>导入视频</strong><small>MP4 · 零复制播放</small></span><span class="bc-arrow">→</span></button>' +
+    '<div class="bc-controls">' +
+    '<button type="button" class="bc-btn bc-link" data-act="sound">声音已关</button>' +
+    '<button type="button" class="bc-btn bc-link" data-act="clear">清除背景</button>' +
+    '<button type="button" class="bc-btn bc-link" data-act="gallery">打开皮肤中心</button>' +
+    "</div>" +
+    '<div class="bc-themes" hidden>' +
+    '<button type="button" class="bc-theme-toggle" aria-expanded="true"><span>SAVED / 00</span><span>−</span></button>' +
+    '<div class="bc-theme-list" hidden></div>' +
     "</div>" +
     '<p class="bc-msg" hidden></p>';
 
@@ -103,9 +103,10 @@ body:not([data-ds-dark-theme]) #beauticode-name-dialog button[data-name="confirm
   const themeToggle = pop.querySelector(".bc-theme-toggle");
   const themeList = pop.querySelector(".bc-theme-list");
   const msgEl = pop.querySelector(".bc-msg");
-  let busy = false;
-  let muted = true;
-  let currentThemeId = "";
+  let busy = false;
+  let muted = true;
+  let currentThemeId = "";
+  let themesExpanded = true;
 
   function findSettingsTrigger() {
     const buttons = [...document.querySelectorAll('button[aria-haspopup="dialog"]')];
@@ -176,17 +177,22 @@ body:not([data-ds-dark-theme]) #beauticode-name-dialog button[data-name="confirm
         : data.sourceMode === "managed"
           ? "托管副本"
           : "";
-    statusEl.textContent = sourceLabel ? `${label} · ${sourceLabel}` : label;
-    if (typeof data.themeId === "string" && data.themeId) {
-      currentThemeId = data.themeId;
-    } else if (data.atmosphere === "gallery") {
-      currentThemeId = "builtin-gallery";
-    }
-    muted = data.muted !== false;
-    soundBtn.classList.toggle("on", !muted);
-    soundBtn.textContent = muted ? "声音" : "声音开";
-    const themes = Array.isArray(data.themes) ? data.themes : [];
-    if (themes.length === 0) {
+    if (typeof data.themeId === "string" && data.themeId) {
+      currentThemeId = data.themeId;
+    } else if (data.atmosphere === "gallery") {
+      currentThemeId = "builtin-gallery";
+    } else {
+      currentThemeId = "";
+    }
+    muted = data.muted !== false;
+    soundBtn.classList.toggle("on", !muted);
+    soundBtn.textContent = muted ? "声音已关" : "声音已开";
+    const themes = Array.isArray(data.themes) ? data.themes : [];
+    const selected = themes.find((theme) => theme.id === currentThemeId);
+    const currentLabel = selected?.name || label;
+    const compactSource = sourceLabel === "本地引用" ? "本地" : sourceLabel === "托管副本" ? "托管" : "已应用";
+    statusEl.textContent = `${currentLabel} / ${compactSource}`;
+    if (themes.length === 0) {
       themesBox.hidden = true;
       themeList.innerHTML = "";
       themeList.hidden = true;
@@ -196,17 +202,19 @@ body:not([data-ds-dark-theme]) #beauticode-name-dialog button[data-name="confirm
     themesBox.hidden = false;
     themeList.innerHTML = themes
       .map((theme) => {
-        const del =
-          theme.bundled === true
-            ? ""
-            : `<button type="button" class="bc-theme-del" data-theme-delete="${escapeAttr(theme.id)}" data-theme-name="${escapeAttr(theme.name)}" aria-label="删除 ${escapeAttr(theme.name)}">删</button>`;
+        const del =
+          theme.bundled === true
+            ? ""
+            : `<button type="button" class="bc-theme-del" data-theme-delete="${escapeAttr(theme.id)}" data-theme-name="${escapeAttr(theme.name)}" aria-label="删除 ${escapeAttr(theme.name)}">×</button>`;
         const source =
           theme.sourceMode === "local" ? "本地" : theme.bundled ? "内置" : "托管";
-        return `<div class="bc-theme-row"><button type="button" class="bc-theme-item" data-theme-id="${escapeAttr(theme.id)}">${escapeText(theme.name)}<span class="bc-source">${source}</span></button>${del}</div>`;
-      })
-      .join("");
-    const selected = themes.find((theme) => theme.id === currentThemeId);
-    themeToggle.textContent = selected ? selected.name : "已保存主题";
+        const current = theme.id === currentThemeId ? ' aria-current="true"' : "";
+        return `<div class="bc-theme-row"><button type="button" class="bc-theme-item" data-theme-id="${escapeAttr(theme.id)}"${current}><span>${escapeText(theme.name)}</span><span class="bc-source">${source}</span></button>${del}</div>`;
+      })
+      .join("");
+    themeToggle.innerHTML = `<span>SAVED / ${String(themes.length).padStart(2, "0")}</span><span>${themesExpanded ? "−" : "+"}</span>`;
+    themeList.hidden = !themesExpanded;
+    themeToggle.setAttribute("aria-expanded", themesExpanded ? "true" : "false");
   }
 
   function escapeText(value) {
@@ -220,21 +228,36 @@ body:not([data-ds-dark-theme]) #beauticode-name-dialog button[data-name="confirm
     return escapeText(value).replaceAll('"', "&quot;");
   }
 
-  async function request(path, init) {
-    const response = await fetch(path, {
-      ...init,
-      headers: {
-        ...(init?.headers || {}),
-      },
-    });
-    const body = await response.json().catch(() => null);
-    if (!response.ok || body?.ok === false) {
-      const error = new Error(body?.error || `请求失败（${response.status}）`);
-      error.status = response.status;
-      error.code = body?.code || "";
+  async function request(path, init, options = {}) {
+    const timeoutMs = options.timeoutMs === 0 ? 0 : options.timeoutMs || 45_000;
+    const controller = timeoutMs > 0 ? new AbortController() : null;
+    const timer = controller
+      ? setTimeout(() => controller.abort(new Error("background_request_timeout")), timeoutMs)
+      : null;
+    try {
+      const response = await fetch(path, {
+        ...init,
+        ...(controller ? { signal: controller.signal } : {}),
+        headers: {
+          ...(init?.headers || {}),
+        },
+      });
+      const body = await response.json().catch(() => null);
+      if (!response.ok || body?.ok === false) {
+        const error = new Error(body?.error || `请求失败（${response.status}）`);
+        error.status = response.status;
+        error.code = body?.code || "";
+        throw error;
+      }
+      return body;
+    } catch (error) {
+      if (controller?.signal.aborted) {
+        throw new Error("背景操作超时，控件已恢复。原背景保持不变，请重试。");
+      }
       throw error;
-    }
-    return body;
+    } finally {
+      if (timer) clearTimeout(timer);
+    }
   }
 
   async function refresh() {
@@ -248,9 +271,10 @@ body:not([data-ds-dark-theme]) #beauticode-name-dialog button[data-name="confirm
   async function run(task) {
     if (busy) return;
     busy = true;
+    pop.dataset.busy = "true";
     let afterRun = null;
-    for (const button of pop.querySelectorAll(".bc-btn, .bc-theme-toggle, .bc-theme-item, .bc-theme-del")) button.disabled = true;
-    showMessage("");
+    for (const button of pop.querySelectorAll(".bc-btn, .bc-theme-toggle, .bc-theme-item, .bc-theme-del")) button.disabled = true;
+    showMessage("正在处理，请稍候…");
     try {
       const result = await task();
       if (typeof result?.afterRun === "function") afterRun = result.afterRun;
@@ -265,12 +289,15 @@ body:not([data-ds-dark-theme]) #beauticode-name-dialog button[data-name="confirm
         const totalMs = Number(result.importTimings?.applyAndSaveMs ?? result.timings?.totalMs);
         const duration = Number.isFinite(totalMs) ? `${Math.round(totalMs)} ms` : "";
         showMessage([result.message, source, duration].filter(Boolean).join(" · "));
+      } else {
+        showMessage("");
       }
       await refresh();
     } catch (error) {
       showMessage(error instanceof Error ? error.message : String(error));
     } finally {
       busy = false;
+      delete pop.dataset.busy;
       for (const button of pop.querySelectorAll(".bc-btn, .bc-theme-toggle, .bc-theme-item, .bc-theme-del")) button.disabled = false;
     }
     if (afterRun) queueMicrotask(afterRun);
@@ -351,11 +378,17 @@ body:not([data-ds-dark-theme]) #beauticode-name-dialog button[data-name="confirm
   async function pickAndImport(kind) {
     let picked;
     try {
-      picked = await request("/__beauticode/ui/pick", {
-        method: "POST",
-        headers: { "content-type": "application/json" },
-        body: JSON.stringify({ kind }),
-      });
+      picked = await request(
+        "/__beauticode/ui/pick",
+        {
+          method: "POST",
+          headers: { "content-type": "application/json" },
+          body: JSON.stringify({ kind }),
+        },
+        // The user controls how long the native dialog stays open. Import and
+        // theme switching still use the bounded request timeout above.
+        { timeoutMs: 0 },
+      );
     } catch (error) {
       if (error?.code !== "native_picker_unavailable") throw error;
       return {
@@ -399,9 +432,12 @@ body:not([data-ds-dark-theme]) #beauticode-name-dialog button[data-name="confirm
     }
     showMessage("皮肤中心脚本尚未加载。");
   });
-  pop.querySelector('[data-act="clear"]').addEventListener("click", () => {
-    currentThemeId = "";
-    void run(() => request("/__beauticode/ui/clear", { method: "POST" }));
+  pop.querySelector('[data-act="clear"]').addEventListener("click", () => {
+    void run(async () => {
+      const result = await request("/__beauticode/ui/clear", { method: "POST" });
+      currentThemeId = "";
+      return result;
+    });
   });
   soundBtn.addEventListener("click", () => {
     void run(() =>
@@ -412,11 +448,12 @@ body:not([data-ds-dark-theme]) #beauticode-name-dialog button[data-name="confirm
       }),
     );
   });
-  themeToggle.addEventListener("click", (event) => {
-    event.stopPropagation();
-    const open = themeList.hidden;
-    themeList.hidden = !open;
-    themeToggle.setAttribute("aria-expanded", open ? "true" : "false");
+  themeToggle.addEventListener("click", (event) => {
+    event.stopPropagation();
+    themesExpanded = !themesExpanded;
+    themeList.hidden = !themesExpanded;
+    themeToggle.querySelector("span:last-child").textContent = themesExpanded ? "−" : "+";
+    themeToggle.setAttribute("aria-expanded", themesExpanded ? "true" : "false");
   });
   themeList.addEventListener("click", (event) => {
     const del = event.target.closest("[data-theme-delete]");
@@ -426,31 +463,34 @@ body:not([data-ds-dark-theme]) #beauticode-name-dialog button[data-name="confirm
       const name = del.getAttribute("data-theme-name") || "主题";
       if (!id) return;
       if (!window.confirm(`确定删除主题「${name}」？`)) return;
-      if (currentThemeId === id) currentThemeId = "";
-      void run(() =>
-        request("/__beauticode/ui/theme/delete", {
-          method: "POST",
-          headers: { "content-type": "application/json" },
-          body: JSON.stringify({ id }),
-        }),
-      );
-      return;
-    }
-    const item = event.target.closest("[data-theme-id]");
-    if (!item) return;
-    currentThemeId = item.getAttribute("data-theme-id") || "";
-    themeList.hidden = true;
-    themeToggle.setAttribute("aria-expanded", "false");
-    globalThis.BeauticodeAtmosphere?.setWindowMode?.(
-      currentThemeId === "builtin-gallery" ? "on" : "closed",
-    );
-    void run(() =>
-      request("/__beauticode/ui/theme/use", {
-        method: "POST",
-        headers: { "content-type": "application/json" },
-        body: JSON.stringify({ id: currentThemeId }),
-      }),
-    );
+      void run(async () => {
+        const result = await request("/__beauticode/ui/theme/delete", {
+          method: "POST",
+          headers: { "content-type": "application/json" },
+          body: JSON.stringify({ id }),
+        });
+        if (currentThemeId === id) currentThemeId = "";
+        return result;
+      });
+      return;
+    }
+    const item = event.target.closest("[data-theme-id]");
+    if (!item) return;
+    const targetThemeId = item.getAttribute("data-theme-id") || "";
+    themeList.hidden = true;
+    themeToggle.setAttribute("aria-expanded", "false");
+    void run(async () => {
+      const result = await request("/__beauticode/ui/theme/use", {
+        method: "POST",
+        headers: { "content-type": "application/json" },
+        body: JSON.stringify({ id: targetThemeId }),
+      });
+      currentThemeId = targetThemeId;
+      globalThis.BeauticodeAtmosphere?.setWindowMode?.(
+        currentThemeId === "builtin-gallery" ? "on" : "closed",
+      );
+      return result;
+    });
   });
   fileInput.addEventListener("change", () => {
     const file = fileInput.files?.[0];

package/index.mjs

@@ -168,7 +168,11 @@ function publicStatus(current, modes, clients, clientStates) {
   const playback =
     activeAcks.find((ack) => ack.ok === true && ack.playback?.hasVideo === true)
       ?.playback ?? null;
-  const failedAcks = activeAcks.filter((ack) => ack.ok !== true);
+  // Only an explicit renderer error is terminal. Older clients may send a
+  // transient ok:false heartbeat while a large video is still warming up.
+  const failedAcks = activeAcks.filter(
+    (ack) => ack.ok === false && typeof ack.error === "string" && ack.error,
+  );
   return {
     ok: true,
     connectedClients: clients.size,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "beauticode-dsh",
-  "version": "1.0.13",
+  "version": "1.0.14",
   "description": "Cordis plugin: image/video backgrounds for DeepSeek Harness web.",
   "type": "module",
   "main": "./index.mjs",

package/vendor/adapter-dsh/bridge.js

@@ -119,11 +119,14 @@ export class DshHostApplier {
                         details: { ...last },
                     };
                 }
-                if (currentMatches && last.failedClients > 0 && last.readyClients === 0) {
+                if (currentMatches &&
+                    last.failedClients > 0 &&
+                    last.readyClients === 0 &&
+                    typeof last.lastRenderError === "string" &&
+                    last.lastRenderError) {
                     return {
                         status: "fail",
-                        reason: last.lastRenderError ||
-                            "DeepSeek Harness client failed to render the background.",
+                        reason: last.lastRenderError,
                         details: { ...last },
                     };
                 }

package/vendor/core/media-server.js

@@ -2,6 +2,7 @@ import http from "node:http";
 import fs from "node:fs/promises";
 import path from "node:path";
 import { createHash, randomUUID } from "node:crypto";
+import { pipeline } from "node:stream/promises";
 import { DEFAULT_TRUSTED_ORIGINS, IMAGE_EXTENSIONS, MAX_IMAGE_BYTES, MAX_VIDEO_BYTES, MEDIA_TOKEN_HEADER, MEDIA_TOKEN_HEADER_CANON, TRUSTED_ORIGIN_PREFIXES, VIDEO_EXTENSION, VIDEO_MIME, } from "./constants.js";
 import { validateImageFile, validateVideoFile, } from "./media-validation.js";
 function parseRange(value, size) {
@@ -71,6 +72,8 @@ export class LoopbackMediaHub {
     maxVideoBytes;
     server = null;
     sockets = new Set();
+    transferControllers = new Set();
+    transfers = new Set();
     assets = new Map();
     closed = false;
     port = 0;
@@ -211,6 +214,9 @@ export class LoopbackMediaHub {
         this.closed = true;
         this.assets.clear();
         await this.listenPromise?.catch(() => { });
+        for (const controller of this.transferControllers)
+            controller.abort();
+        await Promise.allSettled([...this.transfers]);
         await this.closeServerOnly();
     }
     toHandle(rec) {
@@ -262,6 +268,44 @@ export class LoopbackMediaHub {
             setTimeout(resolve, 500).unref?.();
         });
     }
+    async pipeOpenedFile(opened, request, response, range) {
+        const controller = new AbortController();
+        const abort = () => controller.abort();
+        const abortIfIncomplete = () => {
+            if (!response.writableFinished)
+                controller.abort();
+        };
+        request.once("aborted", abort);
+        response.once("close", abortIfIncomplete);
+        this.transferControllers.add(controller);
+        const transfer = (async () => {
+            try {
+                const stream = opened.createReadStream({
+                    start: range.start,
+                    ...(range.end == null ? {} : { end: range.end }),
+                    // The hub owns the FileHandle lifecycle. This guarantees a close on
+                    // normal completion, browser Range cancellation, and hub shutdown.
+                    autoClose: false,
+                });
+                if (request.aborted || response.destroyed || this.closed)
+                    controller.abort();
+                await pipeline(stream, response, { signal: controller.signal });
+            }
+            finally {
+                request.removeListener("aborted", abort);
+                response.removeListener("close", abortIfIncomplete);
+                this.transferControllers.delete(controller);
+                await opened.close().catch(() => { });
+            }
+        })();
+        this.transfers.add(transfer);
+        try {
+            await transfer;
+        }
+        finally {
+            this.transfers.delete(transfer);
+        }
+    }
     async handle(request, response) {
         const originHeader = request.headers.origin;
         const origin = typeof originHeader === "string" ? originHeader : undefined;
@@ -397,11 +441,9 @@ export class LoopbackMediaHub {
                     opened = null;
                     return;
                 }
-                const stream = opened.createReadStream({ start: 0, autoClose: true });
+                const streamingHandle = opened;
                 opened = null;
-                stream
-                    .on("error", () => response.destroy())
-                    .pipe(response);
+                await this.pipeOpenedFile(streamingHandle, request, response, { start: 0 });
                 return;
             }
             headers["Content-Range"] =
@@ -414,15 +456,12 @@ export class LoopbackMediaHub {
                 opened = null;
                 return;
             }
-            const stream = opened.createReadStream({
+            const streamingHandle = opened;
+            opened = null;
+            await this.pipeOpenedFile(streamingHandle, request, response, {
                 start: range.start,
                 end: range.end,
-                autoClose: true,
             });
-            opened = null;
-            stream
-                .on("error", () => response.destroy())
-                .pipe(response);
         }
         catch {
             await opened?.close().catch(() => { });