dsh-capyreporter 0.1.2 → 0.1.5

package/README.md

@@ -1,5 +1,7 @@
 # 🐾 CapyReporter — the capybara that reports for you
 
+English | [简体中文](README.zh.md)
+
 **An always-on-top capybara task reporter for the DeepSeek Harness Web UI.**
 
 CapyReporter is a tiny transparent window that floats above **every** app and tab of your desktop — not just inside the page — and quietly narrates what your deepseek harness agent is doing, one step at a time, so you can focus on your other work and never miss the moment a task finishes.
@@ -43,7 +45,7 @@ Restart `dsh web` (or just refresh the page). Requires DSH web 0.1.0-rc.6 or new
 | Mouse wheel over her | Resize |
 | Single click the bubble | Expand / collapse the step log |
 | Double-click the bubble | Dismiss until the next update |
-| Left-click the capybara | Return to DeepSeek Harness |
+| Double-click the capybara | Return to DeepSeek Harness (single click does nothing — it fires too easily) |
 | Right-click the capybara | Menu: Restore bubble · Open DSH · Hide desktop pet |
 
 ## 🎨 Art & licensing

package/README.zh.md

@@ -1,60 +1,55 @@
-# 🐾 CapyReporter — 替你盯梢的水豚小报
+# CapyReporter 🦫
 
-**一个永远置顶的 「水豚小报」：为 DeepSeek Harness Web UI 实时播报任务进度的桌面宠物。**
+[English](README.md) | 简体中文
 
-CapyReporter 是一个小小的透明窗口，悬浮在**你桌面上的每一个应用与标签页之上**——不止于网页内部。它会在 agent 工作的每一个关键节点轻声播报，让你安心处理手头的事，绝不错过任务完成的瞬间。
+一只常驻桌面的水豚，替你盯着 DeepSeek Harness 里跑着的任务。
 
-## 🦫 亮点
+它是个透明小窗口，永远浮在所有应用之上——切到浏览器也好、写代码也好、打游戏也好，它都在。Agent 每跑一步（调工具、写回复、进新阶段），气泡就更新一行；任务跑完了，"✅ 任务完成"会一直挂在屏幕上等你回来，点一下水豚就直接跳回 DSH。
 
-- **真正的全局置顶。** 透明、无边框、除水豚本体外点击穿透。用记事本、看视频、玩游戏、写代码——她就静静浮在那里，大小字都看得清。Windows 上由 Electron 桌面窗口实现，未安装 Electron 时自动回落到页面内悬浮。
-- **播报运行轨迹。** 每到一个检查点，气泡就更新一行：`🔧 工具调用`、`💭 思考中…`、`🧭 调度/干预`、`🚀 工作流阶段`、`⚠️ 报错与重试`——实时看着你的 agent「思考」。
-- **智能气泡，不挡视线。**
-  - *紧凑模式*：标题 + 最新状态一行。
-  - *单击展开*：滚动查看本次运行的步骤历史。
-  - *双击隐藏*：水豚安静下来，直到下一条更新。
-  - *右键 → 恢复气泡*：随时找回小报。
-- **认得到项目的名字。** 气泡直接显示运行所属的**工作区/项目名**（与左侧边栏一致）。多会话并行时，你一眼就知道是谁在汇报。
-- **离开时也不错过完成。** `✅ 任务完成 — <项目名>` 会一直留在置顶窗口上，点击水豚一键回到 DeepSeek Harness；还可选桌面通知。
-- **完全可自定义。** 在 **设置 → 🐾 CapyReporter** 上传任意透明 PNG 换掉形象；在水豚身上滚动鼠标滚轮即可调整大小。设置里也能一键开启/关闭、卸载插件。
-- **持久且本地优先。** 偏好（形象、大小、位置）存于 `$DSH_HOME/capyreporter.json`；无云、无账号、无遥测。
+## 能干什么
 
-## 📦 安装
+- **真的全局置顶**：基于 Electron 的透明窗口，浮在所有应用之上。透明部分点击穿透，不挡下面的操作；只有点在水豚身上才算点到它。没装 Electron 也不影响，会自动退回页面内悬浮，气泡功能一样不少。
+- **逐步播报**：工具调用、模型输出、steering、workflow 阶段、报错重试——每到一个节点，气泡换一行，像看轨迹时间线一样看着 agent 干活。
+- **气泡不吵**：默认只显示最新一条状态；单击展开完整的步骤历史（带滚动条，按时间排序）；双击先藏起来，有新动静会自己冒出来；右键菜单里随时能找回。
+- **认项目**：气泡标题直接用任务所属的工作区名字（和左侧边栏一致）。多会话并行的时候，一眼就知道是谁在汇报。
+- **摸鱼友好**：切去干别的，任务完成了水豚会在置顶窗口上提醒你，桌面通知也可以开。
+- **形象随你换**：设置里上传任意透明 PNG 就能换角色；在水豚身上滚动滚轮缩放；偏好本地保存在 `$DSH_HOME/capyreporter.json`，重启不丢。
 
-**插件市场**（上架后）：*设置 → 插件市场 → 搜索「capy」→ 安装 → 刷新页面*。
+## 安装
 
-**命令行：**
+推荐先装 [dsh-market](https://github.com/dsh-market/dsh-market#readme)，然后在 设置 → 插件市场 里搜 "capy" 一键安装。
+
+命令行也行：
 
 ```sh
 dsh plugin --profile web add dsh-capyreporter
 ```
 
-然后重启 `dsh web`（或直接刷新页面）。需要 DSH web 0.1.0-rc.6 或更新版本。
+装完重启 `dsh web`（或者直接刷新页面）。需要 dsh web 0.1.0-rc.6 以上。
+
+## 关于置顶窗口
 
-**为置顶窗口准备的 Electron（可选，推荐）：**
+页面内的水豚只有切回 DSH 才看得到，想要"切走也在"，得靠一个真正的置顶窗口，这块用的是 Electron：
 
-- 若 Electron 已存在于 `%USERPROFILE%\.dsh\electron\electron.exe`（或 `DSH_PET_ELECTRON_PATH` 指向的任意路径），桌面窗口开箱即用；
-- 没有的话，CapyReporter 仍会在 **页面内** 工作——一个悬浮在 DeepSeek Harness 页面上的透明水豚，气泡功能一个不少。
+- `%USERPROFILE%\.dsh\electron\electron.exe` 已经存在的话（或者用 `DSH_PET_ELECTRON_PATH` 指定路径），重启后置顶窗口会自动出现；
+- 没有也不影响，水豚会以页面内悬浮的形式工作，功能一个不少。
 
-## 🎛 操作一览
+## 操作一览
 
 | 操作 | 效果 |
 | --- | --- |
-| 拖动水豚 | 移动（窗口跟随） |
+| 拖动水豚 | 挪位置（窗口跟着走，甩多快都跟得上） |
 | 在水豚上滚轮 | 缩放 |
 | 单击气泡 | 展开 / 收起步骤日志 |
-| 双击气泡 | 隐藏，直到下一条更新 |
-| 左键点击水豚 | 回到 DeepSeek Harness |
-| 右键点击水豚 | 菜单：恢复气泡 · 打开 DSH · 隐藏桌面宠物 |
-
-## 🎨 美术与许可
-
-- 内置默认水豚形象，可随时在设置中用你自己的透明 PNG 替换。
-- MIT 许可；默认水豚形象刻意设计为「可替换」，换图无任何限制。
+| 双击气泡 | 先藏起来，有新动静再冒出来 |
+| 双击水豚 | 回到 DeepSeek Harness（单击不做事，太容易误触了） |
+| 右键水豚 | 菜单：恢复气泡 · 打开 DSH · 隐藏桌面宠物 |
 
-## 🌍 贡献与反馈
+## 已知限制
 
-欢迎提 Issue 与 PR。*本插件为社区作品——请只安装你信任的来源。*
+- 置顶窗口依赖本机已安装的 Electron，目前不会自动下载（后面版本打算支持）。
+- 个别独占全屏的程序（比如某些游戏）会盖住置顶窗口，这是系统层面的限制，绕不过去。
 
----
+## License
 
-为 DeepSeek Harness 社区而作 🧡
+[MIT](LICENSE)

package/lib/index.js

@@ -491,4 +491,5 @@ function apply(ctx) {
   if (state.enabled && state.desktopEnabled) startHelper()
 }
 
-export { apply, inject, name }
+// Pure helpers are exported for unit tests (node --test test/).
+export { apply, inject, name, asText, titleOf, extractEventText, tailPreview, stepLineOf }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-capyreporter",
-  "version": "0.1.2",
+  "version": "0.1.5",
   "description": "CapyReporter — an always-on-top capybara task reporter for the DeepSeek Harness Web UI. A transparent floating pet that narrates each trajectory step in a speech bubble, tells you which project is reporting, alerts you when a task completes while you are away, and lets you upload your own pet art.",
   "keywords": [
     "dsh",
@@ -43,6 +43,7 @@
     "LICENSE"
   ],
   "scripts": {
+    "test": "node --test \"test/*.test.mjs\"",
     "verify": "node scripts/verify.mjs",
     "prepack": "node scripts/check-bom.mjs"
   },

package/runtime/electron-helper/index.html

@@ -23,8 +23,8 @@
       #bubble {
         position: absolute;
         /* JS pins this just above the pet image on every size change;
-           the default covers the unscaled 182px pet. */
-        bottom: 190px;
+           the default covers the unscaled 132px-wide pet. */
+        bottom: 143px;
         left: 50%;
         transform: translateX(-50%);
         min-width: 90px;
@@ -103,8 +103,10 @@
         bottom: 0;
         left: 50%;
         transform: translateX(-50%);
-        height: 182px;
-        width: auto;
+        /* width is the base metric (132 * scale), the same as the in-page pet;
+           JS keeps it in sync and height follows the image aspect ratio */
+        width: 132px;
+        height: auto;
         pointer-events: auto;
         cursor: grab;
         touch-action: none;

package/runtime/electron-helper/main.js

@@ -19,10 +19,20 @@ app.disableHardwareAcceleration();
 
 let win = null;
 let topmostTimer = null;
+let dragTimer = null;
+let dragState = null;
 const baseUrl = process.env.DSH_CAPYREP_BASE_URL || 'http://127.0.0.1:3080';
 const W = 220;
 const H = 250;
 
+function stopDrag() {
+  if (dragTimer) {
+    clearInterval(dragTimer);
+    dragTimer = null;
+  }
+  dragState = null;
+}
+
 function reassertTopmost() {
   if (!win || win.isDestroyed()) return;
   try {
@@ -72,6 +82,7 @@ function createWindow() {
   win.on('blur', () => reassertTopmost());
   win.on('closed', () => {
     win = null;
+    stopDrag();
     if (topmostTimer) {
       clearInterval(topmostTimer);
       topmostTimer = null;
@@ -110,6 +121,10 @@ app.whenReady().then(() => {
     const ch = Math.round(Number(size && size.h) || 0);
     if (cw < 80 || ch < 80 || cw > 4000 || ch > 4000) return;
     const b = w.getBounds();
+    // Same size → nothing to do. Re-issuing setBounds with identical values is
+    // not a no-op under fractional display scaling: every DIP↔physical round
+    // trip can round the position a pixel further (the "pet sinks" bug).
+    if (b.width === cw && b.height === ch) return;
     const area = screen.getPrimaryDisplay().workArea;
     const width = Math.min(cw, area.width);
     const height = Math.min(ch, area.height);
@@ -122,16 +137,37 @@ app.whenReady().then(() => {
     reassertTopmost();
   });
 
-  ipcMain.on('homura:move', (event, p) => {
+  // ---- dragging ----------------------------------------------------------
+  // The drag loop lives here and reads the OS cursor position
+  // (screen.getCursorScreenPoint) instead of renderer pointer coordinates.
+  // A window that moves under the cursor feeds its own movement back into the
+  // next pointer coordinate the renderer sees, which makes the pet drift away
+  // from the cursor; the OS cursor position cannot be affected by our window.
+  ipcMain.on('homura:drag-start', (event) => {
     const w = BrowserWindow.fromWebContents(event.sender);
     if (!w || w.isDestroyed()) return;
-    const x = Number(p && p.x);
-    const y = Number(p && p.y);
-    if (Number.isFinite(x) && Number.isFinite(y)) w.setPosition(Math.round(x), Math.round(y), false);
+    const c = screen.getCursorScreenPoint();
+    const b = w.getBounds();
+    dragState = { win: w, cx: c.x, cy: c.y, wx: b.x, wy: b.y };
+    if (dragTimer) clearInterval(dragTimer);
+    dragTimer = setInterval(() => {
+      if (!dragState) return stopDrag();
+      const win = dragState.win;
+      if (!win || win.isDestroyed()) return stopDrag();
+      const p = screen.getCursorScreenPoint();
+      const area = screen.getDisplayNearestPoint(p).workArea;
+      const x = Math.min(Math.max(area.x, dragState.wx + (p.x - dragState.cx)), area.x + Math.max(0, area.width - 60));
+      const y = Math.min(Math.max(area.y, dragState.wy + (p.y - dragState.cy)), area.y + Math.max(0, area.height - 60));
+      const cur = win.getBounds();
+      if (cur.x !== x || cur.y !== y) win.setPosition(x, y, false);
+    }, 16);
   });
+
+  ipcMain.on('homura:drag-end', () => stopDrag());
 });
 
 app.on('window-all-closed', () => {
+  stopDrag();
   if (topmostTimer) {
     clearInterval(topmostTimer);
     topmostTimer = null;

package/runtime/electron-helper/preload.js

@@ -8,8 +8,14 @@ contextBridge.exposeInMainWorld('petBridge', {
   openSite(url) {
     ipcRenderer.send('homura:open-site', url);
   },
-  move(x, y) {
-    ipcRenderer.send('homura:move', { x, y });
+  // Dragging is owned by the main process: it tracks the OS cursor position and
+  // moves the window itself, so a moving window can never feed back into the
+  // coordinates the renderer sees.
+  dragStart() {
+    ipcRenderer.send('homura:drag-start');
+  },
+  dragEnd() {
+    ipcRenderer.send('homura:drag-end');
   },
   resize(size) {
     ipcRenderer.send('homura:resize', size);

package/runtime/electron-helper/renderer.js

@@ -1,5 +1,5 @@
 // renderer for the always-on-top CapyReporter window. Fetches image + activity from the
-// DSH host over HTTP; drags to move; left-click opens DSH; right-click shows a menu.
+// DSH host over HTTP; drags to move; double-click opens DSH; right-click shows a menu.
 //
 // Bubble UX: compact by default (headline + latest status line); single click
 // expands into a scrollable step log; double click dismisses; the right-click
@@ -51,18 +51,26 @@
   }
 
   // Pet size: a uniform multiplier owned by the host config (shared with the
-  // in-page pet and the Settings slider). Plain wheel over the window resizes;
-  // the image keeps its aspect ratio, the bubble is re-pinned just above it.
+  // in-page pet and the Settings slider). Plain wheel over the window resizes.
+  // The base metric is the WIDTH (132 * scale) — the same base the in-page pet
+  // uses — so the pet is exactly the same size in both modes; height follows the
+  // image's aspect ratio.
   // refit() fits the window around BOTH the pet and the bubble, so the bubble
   // can report a fuller status (expanded step log) without the window blowing up.
-  const BASE_IMG_H = 182;
+  const BASE_IMG_W = 132;
   let scale = 1;
+  // Only resize when the size actually changed: re-issuing an identical resize
+  // every tick makes Windows' fractional-DPI bounds round-trip walk the window
+  // down the screen a pixel at a time.
+  const lastFit = { w: 0, h: 0 };
   function refit() {
-    const imgH = Math.round(BASE_IMG_H * scale);
-    img.style.height = imgH + 'px';
+    const imgW = Math.max(40, Math.round(BASE_IMG_W * scale));
+    img.style.width = imgW + 'px';
+    img.style.height = 'auto';
+    const aspect = img.naturalWidth && img.naturalHeight ? img.naturalWidth / img.naturalHeight : 0.9;
+    const imgH = Math.round(imgW / aspect);
     bubble.style.bottom = (imgH + 8) + 'px';
-    const aspect = img.naturalWidth && img.naturalHeight ? img.naturalWidth / img.naturalHeight : 0.65;
-    let w = Math.max(150, Math.round(220 * scale), Math.round(imgH * aspect) + 24);
+    let w = Math.max(150, imgW + 24);
     let h = Math.max(120, imgH + Math.max(Math.round(72 * scale), 96));
     if (bubble.style.display !== 'none' && bubble.scrollWidth > 0) {
       const bw = Math.min(Math.ceil(bubble.scrollWidth) + 28, 1060); // bubble is capped at 1000px; grow the window with it
@@ -71,7 +79,12 @@
       w = Math.max(w, bw);
       h = Math.max(h, imgH + 12 + bh);
     }
-    window.petBridge.resize({ w: Math.round(w), h: Math.round(h) });
+    w = Math.round(w);
+    h = Math.round(h);
+    if (w === lastFit.w && h === lastFit.h) return;
+    lastFit.w = w;
+    lastFit.h = h;
+    window.petBridge.resize({ w: w, h: h });
   }
   img.addEventListener('load', () => refit());
   window.addEventListener('wheel', (e) => {
@@ -202,28 +215,29 @@
     hideBubble();
   });
 
-  // drag — pointer capture keeps the move stream alive even when the cursor
-  // outruns the small window, and we hold the window interactive for the whole
-  // drag (a mouseleave during a fast drag would otherwise flip it click-through
-  // mid-drag and drop the trail).
-  let drag = null;
+  // drag — the main process owns the motion: it follows the OS cursor position
+  // (screen.getCursorScreenPoint), which cannot be perturbed by our own window
+  // moving. The renderer only opens/closes the drag and keeps the window
+  // interactive for its whole duration (pointer capture guarantees we still get
+  // the pointerup even if the cursor leaves the window).
+  let drag = false;
   img.addEventListener('pointerdown', (e) => {
     if (e.button !== 0) return;
     try { img.setPointerCapture(e.pointerId); } catch (err) {}
-    drag = { sx: e.screenX, sy: e.screenY, wx: window.screenX, wy: window.screenY };
+    drag = true;
     window.petBridge.setInteractive(true);
+    window.petBridge.dragStart();
     e.preventDefault();
   });
-  window.addEventListener('pointermove', (e) => {
-    if (drag) window.petBridge.move(drag.wx + (e.screenX - drag.sx), drag.wy + (e.screenY - drag.sy));
-  });
   const endDrag = () => {
     if (!drag) return;
-    drag = null;
+    drag = false;
+    window.petBridge.dragEnd();
     window.petBridge.setInteractive(true); // pointer is still over the pet when a drag ends
   };
   window.addEventListener('pointerup', endDrag);
   window.addEventListener('pointercancel', endDrag);
+  window.addEventListener('blur', endDrag); // alt-tab mid-drag must not leave the pet glued to the cursor
 
   // hover -> interactive (so clicks work); leave -> click-through (never mid-drag)
   root.addEventListener('mouseenter', () => window.petBridge.setInteractive(true));
@@ -231,8 +245,9 @@
     if (!drag) window.petBridge.setInteractive(false);
   });
 
-  // left-click (not a drag) -> open DSH in default browser
-  img.addEventListener('click', () => window.petBridge.openSite(base));
+  // double-click (not a drag) -> return to DeepSeek Harness. A single click must
+  // stay inert: it fires on every stray click and on drags that barely move.
+  img.addEventListener('dblclick', () => window.petBridge.openSite(base));
 
   // right-click menu
   img.addEventListener('contextmenu', (e) => {