dsh-claude-workbench 0.1.1 → 0.1.2

package/README.en.md

@@ -1,11 +1,14 @@
 # dsh-claude-workbench
 
-A Claude-flavoured workbench enhancement for the **DeepSeek Harness (DSH)** Web GUI — one plugin, four features:
+[![npm version](https://img.shields.io/npm/v/dsh-claude-workbench.svg)](https://www.npmjs.com/package/dsh-claude-workbench) [![license](https://img.shields.io/badge/license-MIT-blue.svg)](LICENSE)
+
+A Claude-flavoured workbench enhancement for the **DeepSeek Harness (DSH)** Web GUI — one plugin, five features:
 
 1. **Claude skin** — warm cream canvas, warm stone surfaces and clay accents; serif **Crimson Pro** prose / **DM Sans** UI (fonts inlined, works offline), complete light/dark/system support.
 2. **Split view** — the “◫ Split view” pill at the bottom-right splits the window into 2–3 full DSH panes, each with its own session view (the same idea as Claude’s Split view).
 3. **Side chat** — select text in a conversation → right-click → **“在旁聊中提问”**; a docked right-hand panel boots a fork of the current session with the selection quoted in the composer. Closing archives the fork.
 4. **Quick appearance switch** — a theme button at the top-right of the session header toggles follow-system / light / dark (same as Settings → General → Appearance, persisted).
+5. **Completion chime** — a short, crisp chime when a turn finishes (like OpenCode’s completion sound); toggle it in the appearance menu and the choice is remembered.
 
 ![Claude skin (light)](preview/light.png)
 ![Split view](preview/panes-2col.png)

package/README.md

@@ -1,11 +1,14 @@
 # dsh-claude-workbench
 
-给 **DeepSeek Harness（DSH）Web GUI** 的 Claude 风格工作台增强包 —— 一个插件，四件事：
+[![npm version](https://img.shields.io/npm/v/dsh-claude-workbench.svg)](https://www.npmjs.com/package/dsh-claude-workbench) [![license](https://img.shields.io/badge/license-MIT-blue.svg)](LICENSE)
+
+给 **DeepSeek Harness（DSH）Web GUI** 的 Claude 风格工作台增强包 —— 一个插件，五件事：
 
 1. **Claude 皮肤**：暖米白画布 + 暖石灰 + 陶土色，正文/标题用衬线 **Crimson Pro**、界面用 **DM Sans**（字体已内联，离线可用），浅色/深色/跟随系统都完整适配；
 2. **Split view（并排会话）**：右下角「◫ Split view」→ 把窗口切成 **2 栏或 3 栏**，每栏是一个完整 DSH 界面，可各自打开/切换不同会话（对应 Claude 里的 Split view）；
 3. **旁聊（side chat）**：在对话里**选中文字 → 右键 → 「在旁聊中提问」**，右侧 dock 出当前会话的 fork（继承上下文），选中的内容以引用形式预填进输入框；关闭时自动归档该 fork；
-4. **外观快切**：右上角主题按钮，一键在 **跟随系统 / 浅色 / 深色** 之间切换（与「设置 → 通用 → 外观」等价、持久化）。
+4. **外观快切**：右上角主题按钮，一键在 **跟随系统 / 浅色 / 深色** 之间切换（与「设置 → 通用 → 外观」等价、持久化）；
+5. **完成提示音**：一轮对话结束时播放一声清脆提示音（类似 OpenCode 的完成提醒），可在右上角外观菜单里开关，设置会记住。
 
 ![Claude 皮肤（浅色）](preview/light.png)
 ![Split view](preview/panes-2col.png)
@@ -41,7 +44,8 @@ dsh plugin --profile web add github:<owner>/dsh-claude-workbench
 
 - **Split view**：点右下角「◫ Split view」→ 默认 2 栏；顶部可切 2/3 栏、退出；每栏像平常一样点左侧会话列表即可显示不同对话。
 - **旁聊**：选中对话内容 → 右键 →「◧ 在旁聊中提问」；面板左缘可拖动调宽；「在主对话打开」把 fork 提为主对话；关闭自动归档 fork。
-- **外观**：会话 header 右上角按钮（右侧栏展开按钮左边），点开选 跟随系统/浅色/深色。
+- **外观**：会话 header 右上角按钮（右侧栏展开按钮左边），点开选 跟随系统/浅色/深色；菜单里还有「完成提示音」开关。
+- **完成提示音**：默认开启；对话完成（运行中 → 空闲）时响一声；子代理会话不响。
 
 ## 兼容性
 

package/lib/client.js

@@ -103,6 +103,7 @@ window.__ModuleLoader__.load({
       '#dsh-theme-menu button svg{width:14px;height:14px;flex:none;color:var(--dsw-alias-label-secondary,#666)}',
       '#dsh-theme-menu .dsh-theme-check{width:14px;height:14px;flex:none;margin-left:auto;color:var(--dsw-alias-state-business-primary,#c6613f);visibility:hidden}',
       '#dsh-theme-menu button[data-active="1"] .dsh-theme-check{visibility:visible}',
+      '#dsh-theme-menu .dsh-theme-sep{height:1px;margin:4px 6px;background:var(--dsw-alias-border-l2,#0001)}',
       '#dsh-sidechat-menu{position:fixed;z-index:2147483002;display:none;min-width:196px;padding:4px;border-radius:10px;background:var(--dsw-menu-surface-fill,#fff);border:.5px solid var(--dsw-alias-border-l3,#0002);box-shadow:0 8px 24px #00000022,0 2px 6px #00000012;backdrop-filter:blur(20px);font-family:var(--dsw-font-family,system-ui)}',
       '#dsh-sidechat-menu button{display:flex;align-items:center;gap:8px;width:100%;height:30px;padding:0 9px;border:0;border-radius:6px;background:transparent;color:var(--dsw-alias-label-primary,#111);font:500 12px/1 var(--dsw-font-family,system-ui);cursor:pointer;text-align:left}',
       '#dsh-sidechat-menu button:hover{background:var(--dsw-alias-interactive-bg-hover,#00000012)}',
@@ -554,6 +555,9 @@ window.__ModuleLoader__.load({
         '<svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"><path d="M13.4 9.6A5.9 5.9 0 0 1 6.4 2.6 6 6 0 1 0 13.4 9.6Z"/></svg>'
     };
 
+    var SOUND_ICON =
+      '<svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 11V7a4 4 0 0 1 8 0v4l1.2 1.6H2.8L4 11Z"/><path d="M6.2 13.2a1.9 1.9 0 0 0 3.6 0"/></svg>';
+
     var themeButton = document.createElement("button");
     themeButton.id = "dsh-theme-toggle";
     themeButton.type = "button";
@@ -566,7 +570,9 @@ window.__ModuleLoader__.load({
     themeMenu.innerHTML =
       '<button type="button" data-pref="system"><span class="dsh-theme-icon"></span><span>跟随系统</span><span class="dsh-theme-check">✓</span></button>' +
       '<button type="button" data-pref="light"><span class="dsh-theme-icon"></span><span>浅色</span><span class="dsh-theme-check">✓</span></button>' +
-      '<button type="button" data-pref="dark"><span class="dsh-theme-icon"></span><span>深色</span><span class="dsh-theme-check">✓</span></button>';
+      '<button type="button" data-pref="dark"><span class="dsh-theme-icon"></span><span>深色</span><span class="dsh-theme-check">✓</span></button>' +
+      '<div class="dsh-theme-sep"></div>' +
+      '<button type="button" data-sound="1"><span class="dsh-theme-icon">' + SOUND_ICON + '</span><span>完成提示音</span><span class="dsh-theme-check">✓</span></button>';
     document.body.appendChild(themeMenu);
     var themeMenuItems = Array.prototype.slice.call(themeMenu.querySelectorAll("button[data-pref]"));
     themeMenuItems.forEach(function (button) {
@@ -574,6 +580,133 @@ window.__ModuleLoader__.load({
       if (icon !== null) icon.innerHTML = THEME_ICONS[button.getAttribute("data-pref")] || "";
     });
 
+    // ------------------------------------------ completion sound (turn finished)
+    var CHIME_KEY = "dsh-workbench.completion-sound";
+    var chimeEnabled = true;
+    try { if (localStorage.getItem(CHIME_KEY) === "0") chimeEnabled = false; } catch (error) { /* ignore */ }
+    var chimeLog = [];
+    var chimeAttachAttempts = 0;
+    var chimeUnsubscribe = null;
+    var chimeAudioContext = null;
+    var chimeLastPlayedAt = 0;
+    var chimePreviousRunning = new Map();
+    var soundButton = themeMenu.querySelector("button[data-sound]");
+
+    function ensureChimeAudio() {
+      try {
+        var AudioCtor = window.AudioContext || window.webkitAudioContext;
+        if (AudioCtor === undefined) return null;
+        if (chimeAudioContext === null) chimeAudioContext = new AudioCtor();
+        if (chimeAudioContext.state === "suspended" && typeof chimeAudioContext.resume === "function") {
+          chimeAudioContext.resume().catch(function () { /* waits for the next user gesture */ });
+        }
+        return chimeAudioContext;
+      } catch (error) {
+        return null;
+      }
+    }
+
+    function playCompletionChime() {
+      chimeLog.push(Date.now());
+      if (chimeLog.length > 50) chimeLog.shift();
+      if (!chimeEnabled) return;
+      var audio = ensureChimeAudio();
+      if (audio === null) return;
+      try {
+        var start = audio.currentTime + 0.01;
+        function tone(frequency, offset, duration, peak, type) {
+          var oscillator = audio.createOscillator();
+          var gain = audio.createGain();
+          oscillator.type = type === undefined ? "sine" : type;
+          oscillator.frequency.value = frequency;
+          gain.gain.setValueAtTime(0.0001, start + offset);
+          gain.gain.exponentialRampToValueAtTime(peak, start + offset + 0.006);
+          gain.gain.exponentialRampToValueAtTime(0.0001, start + offset + duration);
+          oscillator.connect(gain);
+          gain.connect(audio.destination);
+          oscillator.start(start + offset);
+          oscillator.stop(start + offset + duration + 0.03);
+        }
+        tone(1046.5, 0, 0.34, 0.13, "sine");
+        tone(1567.98, 0.07, 0.3, 0.09, "sine");
+        tone(3135.96, 0.07, 0.14, 0.02, "sine");
+      } catch (error) {
+        /* audio is best effort */
+      }
+    }
+
+    function triggerCompletionChime() {
+      var now = Date.now();
+      if (now - chimeLastPlayedAt < 750) return;
+      chimeLastPlayedAt = now;
+      playCompletionChime();
+    }
+
+    function isSubagentChimeSession(sessionId) {
+      try {
+        var sessions = getService("sessions");
+        if (sessions === undefined || sessions.list === undefined || sessions.list.getSnapshot === undefined) return false;
+        var row = (sessions.list.getSnapshot().byId || {})[sessionId];
+        return row !== undefined && row !== null && row.subagent !== undefined && row.subagent !== null;
+      } catch (error) {
+        return false;
+      }
+    }
+
+    function onSessionRunningChanged(sessionId, running) {
+      var value = chimePreviousRunning.get(sessionId) === true;
+      chimePreviousRunning.set(sessionId, running);
+      if (!value || running) return;
+      if (isSubagentChimeSession(sessionId)) return;
+      triggerCompletionChime();
+    }
+
+    function installCompletionChime() {
+      var uiSession = getService("uiSession");
+      var status = uiSession === undefined || uiSession === null ? undefined : uiSession.sessionStatus;
+      if (status === undefined || status === null || typeof status.subscribe !== "function") {
+        chimeAttachAttempts += 1;
+        if (chimeAttachAttempts < 100) setTimeout(installCompletionChime, 300);
+        return;
+      }
+      try {
+        var initial = status.getSnapshot();
+        initial.forEach(function (value, id) {
+          chimePreviousRunning.set(id, value !== undefined && value !== null && value.running === true);
+        });
+        chimeUnsubscribe = status.subscribe(function (snapshot) {
+          try {
+            snapshot.forEach(function (value, id) {
+              onSessionRunningChanged(id, value !== undefined && value !== null && value.running === true);
+            });
+          } catch (error) {
+            /* ignore */
+          }
+        });
+      } catch (error) {
+        console.error("[claude-workbench] completion sound subscription failed", error);
+      }
+    }
+
+    function toggleCompletionSound() {
+      chimeEnabled = !chimeEnabled;
+      try { localStorage.setItem(CHIME_KEY, chimeEnabled ? "1" : "0"); } catch (error) { /* ignore */ }
+      if (chimeEnabled) {
+        ensureChimeAudio();
+        if (soundButton !== null) soundButton.setAttribute("data-active", "1");
+        playCompletionChime();
+      }
+      refreshThemeButton();
+    }
+
+    function unlockChimeAudio() {
+      ensureChimeAudio();
+    }
+
+    document.addEventListener("pointerdown", unlockChimeAudio, true);
+    document.addEventListener("keydown", unlockChimeAudio, true);
+    installCompletionChime();
+
     function themeService() {
       return getService("theme");
     }
@@ -604,6 +737,10 @@ window.__ModuleLoader__.load({
       themeMenuItems.forEach(function (button) {
         button.setAttribute("data-active", button.getAttribute("data-pref") === preference ? "1" : "0");
       });
+      if (soundButton !== null) {
+        soundButton.setAttribute("data-active", chimeEnabled ? "1" : "0");
+        soundButton.title = chimeEnabled ? "完成提示音：开（点击关闭）" : "完成提示音：关（点击开启）";
+      }
     }
 
     function closeThemeMenu() {
@@ -631,6 +768,10 @@ window.__ModuleLoader__.load({
     themeMenu.addEventListener("click", function (event) {
       var target = event.target;
       if (!(target instanceof Element)) return;
+      if (target.closest("button[data-sound]") !== null) {
+        toggleCompletionSound();
+        return;
+      }
       var button = target.closest("button[data-pref]");
       if (button === null) return;
       var preference = button.getAttribute("data-pref");
@@ -689,6 +830,12 @@ window.__ModuleLoader__.load({
     try {
       globalThis.__dshPanesTeardown = function () {
         try { clearInterval(themeMountTimer); } catch (error) { /* ignore */ }
+        try { if (typeof chimeUnsubscribe === "function") chimeUnsubscribe(); } catch (error) { /* ignore */ }
+        chimeUnsubscribe = null;
+        document.removeEventListener("pointerdown", unlockChimeAudio, true);
+        document.removeEventListener("keydown", unlockChimeAudio, true);
+        try { if (chimeAudioContext !== null && typeof chimeAudioContext.close === "function") chimeAudioContext.close(); } catch (error) { /* ignore */ }
+        chimeAudioContext = null;
         closeThemeMenu();
         if (themeButton.parentElement !== null) themeButton.remove();
         themeMenu.remove();
@@ -720,7 +867,16 @@ window.__ModuleLoader__.load({
         archiveSession: function (id) {
           var workspaceService = getService("uiWorkspace");
           return workspaceService.archiveSession(id);
-        }
+        },
+        playChime: playCompletionChime,
+        chimeInfo: function () {
+          return {
+            enabled: chimeEnabled,
+            attached: typeof chimeUnsubscribe === "function",
+            log: chimeLog.slice()
+          };
+        },
+        toggleChime: toggleCompletionSound
       };
     } catch (error) {
       /* debug hook is optional */

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "dsh-claude-workbench",
-  "version": "0.1.1",
-  "description": "Claude-inspired workbench for the DeepSeek Harness Web GUI: warm editorial skin (Crimson Pro/DM Sans), split view with 2-3 side-by-side conversations, selection-based side chat, and a top-right light/dark switch.",
+  "version": "0.1.2",
+  "description": "Claude-inspired workbench for the DeepSeek Harness Web GUI: warm editorial skin (Crimson Pro/DM Sans), split view with 2-3 side-by-side conversations, selection-based side chat, a top-right light/dark switch, and a completion chime when a turn finishes.",
   "type": "module",
   "main": "lib/index.js",
   "exports": {
@@ -30,7 +30,10 @@
     "split-view",
     "splitview",
     "side-by-side",
-    "claude-style"
+    "claude-style",
+    "notification",
+    "chime",
+    "completion-sound"
   ],
   "license": "MIT",
   "dsh": {