dsh-scroll-piano 0.0.0-stage → 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 dsh-piano contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,63 @@
-# Temporary Holding Version
+# dsh-scroll-piano · 滚动钢琴
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+鼠标滑过 DSH 界面**右侧边缘的竖条区域**（聊天区滚动条/把手那一条）时，按鼠标的**纵向位置**发出钢琴音：**越靠上音越高、越靠下音越低**（特雷门琴式）。
+
+## 效果
+
+- 右侧边缘一条细彩色竖条（开启时淡淡发光），鼠标进入该区间即触发。
+- 鼠标纵向移动 = 连续刮奏；竖条上有个白点跟随鼠标位置。
+- 鼠标旁显示当前音名（如 `C4 · 60`）。
+- 左下角一枚 `🎵 滚动钢琴 ON/OFF` 胶囊：点开关切换、右侧滑块调音量（设置存 `localStorage`）。
+- 默认音域 C3–C6（3 个八度），只按半音触发（同音不重复触发）。
+
+## 为什么按坐标而不是抓 DOM
+
+那根滚动条是浏览器**原生滚动条**——不在 DOM 里，且周围容器类名带 hash（`ST7X_W_scrollBody` 这类），抓不到也没法定制。所以插件用全局 `pointermove` + `clientX` 判定「是否落在窗口右侧竖条区间」、`clientY` 映射音高，稳且不依赖任何内部类名。
+
+## 可调参数
+
+代码内 `DEFAULTS`（`lib/client.js`）：
+
+| 键 | 默认 | 说明 |
+|---|---|---|
+| `on` | `true` | 开关 |
+| `volume` | `0.25` | 音量 |
+| `stripWidth` | `30` | 右侧竖条宽度（px） |
+| `lowNote` / `highNote` | `48` / `84` | 音域（MIDI，C3–C6） |
+| `inset` | `56` | 上下留白（px），让最高/最低音够得着 |
+
+## 技术要点
+
+| 项 | 做法 |
+|---|---|
+| 挂载槽位 | `shell.overlay` |
+| 触发 | `document.addEventListener("pointermove")`，`clientX >= innerWidth - stripWidth` 才生效 |
+| 音高 | `midi = highNote - t*(highNote-lowNote)`，`t` 为纵向归一化位置 |
+| 音频 | Web Audio 合成（泛音 + 快速起音 + 指数衰减 + 噪声锤击瞬态 + 低通 + 压缩器） |
+| 客户端形态 | 手写 `window.__ModuleLoader__.load` 零构建 bundle，`platform: web` |
+
+## 安装（本地）
+
+```sh
+NODE=~/.dsh/dsh-runtimes/dsh-primary-runtime/dependencies/node/bin/node
+PNPM=~/.dsh/dsh-runtimes/dsh-primary-runtime/dependencies/pnpm/bin/pnpm.mjs
+# profile/package.json 的 dependencies 加： "dsh-scroll-piano": "link:<本目录>"
+# profile/cordis.patch.yml 加：
+#   - insert:
+#       - id: dsh-scroll-piano
+#         name: dsh-scroll-piano
+cd ~/.dsh/profiles/desktop && "$NODE" "$PNPM" install --no-frozen-lockfile
+```
+
+> 顺序很重要：**先 pnpm install 建软链，再触发 cordis.patch.yml 热载入**，否则 loader 首次 require 找不到包、之后不会自动重试。
+
+## 开发
+
+```sh
+npm test          # node test/bundle-check.mjs
+```
+
+## 说明
+
+- 首次出声需要一次用户手势（点开关或首次滑动即自动解锁 AudioContext）。
+- 与 `dsh-piano`（滑动钢琴键盘）是两个独立插件，可同时装。

package/cordis.patch.yml

@@ -0,0 +1,4 @@
+# dsh-scroll-piano：往插件树里插一行（纯客户端插件，服务器半无配置）。
+- insert:
+    - id: dsh-scroll-piano
+      name: dsh-scroll-piano

package/lib/client.js

@@ -0,0 +1,297 @@
+/**
+ * dsh-scroll-piano — browser half.
+ *
+ * 鼠标滑过 DSH 界面**右侧边缘的竖条区域**（聊天区滚动条/把手那一条）时，
+ * 按鼠标的**纵向位置**发出钢琴音：越靠上音越高、越靠下音越低（特雷门琴式）。
+ *
+ * 为什么按「窗口右侧竖条 + 坐标」而不是抓某个 DOM 元素：那根滚动条是浏览器
+ * **原生滚动条**（不在 DOM 里，类名还带 hash），抓不到也没法定制；用一个全局
+ * `pointermove` + `clientX` 落到竖条区间、`clientY` 映射音高，最稳。
+ *
+ * 声音沿用 dsh-piano 的 Web Audio 实时合成（泛音 + 快速起音 + 指数衰减 +
+ * 噪声锤击瞬态 + 低通/压缩），零采样、零网络、零依赖。
+ */
+window.__ModuleLoader__.load({
+	id: "dsh-scroll-piano",
+	factory: (require) => {
+		var module = { exports: {} };
+		var exports = module.exports;
+		Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+		const React = require("react");
+		const { useEffect, useRef, useState, useCallback } = React;
+		const h = React.createElement;
+
+		//#region styles
+		const CSS = [
+			".dshscp_pill{box-sizing:border-box;position:fixed;left:132px;bottom:16px;z-index:2147483000;height:32px;display:inline-flex;align-items:center;gap:10px;padding:0 10px;border-radius:16px;background:var(--dsw-alias-bg-elevated,#1f2430);color:var(--dsw-alias-label-primary,#e6e8ee);box-shadow:0 4px 18px rgba(0,0,0,.35);font-size:12px;line-height:16px}",
+			".dshscp_pill button{box-sizing:border-box;border:none;background:transparent;color:inherit;font:inherit;cursor:pointer;padding:0 2px;display:inline-flex;align-items:center;gap:6px}",
+			".dshscp_dot{flex:none;width:8px;height:8px;border-radius:50%;background:var(--dsw-alias-label-tertiary,#6b7280)}",
+			".dshscp_dotOn{background:#35c46a;box-shadow:0 0 6px rgba(53,196,106,.9)}",
+			".dshscp_vol{width:76px;accent-color:var(--dsw-alias-state-business-primary,#5b8def)}",
+			".dshscp_strip{position:fixed;top:0;right:0;width:3px;height:100%;z-index:2147482000;pointer-events:none;background:linear-gradient(180deg,rgba(91,141,239,.85),rgba(160,120,240,.85));opacity:0;transition:opacity .15s ease}",
+			".dshscp_stripOn{opacity:.55}",
+			".dshscp_marker{position:fixed;right:0;width:7px;height:7px;border-radius:50%;z-index:2147482001;pointer-events:none;background:#fff;box-shadow:0 0 8px rgba(160,120,240,.95);opacity:0;transition:opacity .1s ease}",
+			".dshscp_markerOn{opacity:1}",
+			".dshscp_hud{position:fixed;z-index:2147482002;pointer-events:none;padding:2px 7px;border-radius:6px;background:rgba(20,24,32,.92);color:#e6e8ee;font-size:11px;line-height:16px;font-variant-numeric:tabular-nums;opacity:0;transition:opacity .1s ease;white-space:nowrap}",
+			".dshscp_hudOn{opacity:1}"
+		].join("");
+		const tagId = "dsh-scroll-piano/scroll-piano.css";
+		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId) + "]") === null) {
+			const style = document.createElement("style");
+			style.setAttribute("data-plugin-css", tagId);
+			style.textContent = CSS;
+			document.head.appendChild(style);
+		}
+
+		//#region audio engine
+		let _ctx = null;
+		let _out = null;
+		let _noiseBuf = null;
+		function audioCtx() {
+			if (!_ctx) {
+				const AC = window.AudioContext || window.webkitAudioContext;
+				if (!AC) return null;
+				_ctx = new AC();
+			}
+			if (_ctx.state === "suspended") _ctx.resume().catch(() => {});
+			return _ctx;
+		}
+		function midiToFreq(m) {
+			return 440 * Math.pow(2, (m - 69) / 12);
+		}
+		/**
+		 * 共享输出链（只建一次）：总线 → 低通 → 压缩器。
+		 * 所有音共用一个压缩器，滑奏时多音叠加由它统一压住：既防削波，
+		 * 也避免每个音都重建一条 master/lowpass/compressor 链。
+		 */
+		function outputChain(ctx) {
+			if (_out) return _out;
+			const master = ctx.createGain();
+			master.gain.value = 0.85;
+			const lp = ctx.createBiquadFilter();
+			lp.type = "lowpass";
+			lp.frequency.value = 6500;
+			lp.Q.value = 0.3;
+			const comp = ctx.createDynamicsCompressor();
+			comp.threshold.value = -22;
+			comp.knee.value = 24;
+			comp.ratio.value = 12;
+			comp.attack.value = 0.004;
+			comp.release.value = 0.18;
+			master.connect(lp);
+			lp.connect(comp);
+			comp.connect(ctx.destination);
+			_out = master;
+			return master;
+		}
+		/**
+		 * 缓存的锤击噪声缓冲（只建一次）。
+		 * 上一版每个音都新建一个 AudioBuffer，快速滑动时分配抖动会引入杂音。
+		 */
+		function noiseBuffer(ctx) {
+			if (_noiseBuf) return _noiseBuf;
+			const len = Math.max(1, Math.floor(ctx.sampleRate * 0.02));
+			const buf = ctx.createBuffer(1, len, ctx.sampleRate);
+			const data = buf.getChannelData(0);
+			for (let i = 0; i < len; i++) data[i] = (Math.random() * 2 - 1) * Math.pow(1 - i / len, 3);
+			_noiseBuf = buf;
+			return buf;
+		}
+		/**
+		 * 合成一枚「电钢」音：基音 + 3 枚泛音（各带指数衰减）+ 极轻的击弦瞬态。
+		 * 泛音改成更少更柔的正弦、瞬态降到 0.05 倍，叠加时靠共享压缩器兜底。
+		 */
+		function playNote(midi, volume) {
+			if (volume <= 0.01) return;
+			const ctx = audioCtx();
+			if (!ctx) return;
+			const out = outputChain(ctx);
+			const freq = midiToFreq(midi);
+			const now = ctx.currentTime;
+			const v = Math.max(0.02, Math.min(1, volume));
+
+			const partials = [
+				{ r: 1, a: 0.85, d: 2.0, type: "sine" },
+				{ r: 2, a: 0.28, d: 1.1, type: "sine" },
+				{ r: 3, a: 0.11, d: 0.6, type: "sine" },
+				{ r: 4, a: 0.045, d: 0.4, type: "sine" }
+			];
+			for (const p of partials) {
+				const osc = ctx.createOscillator();
+				osc.type = p.type;
+				osc.frequency.value = freq * p.r;
+				osc.detune.value = (Math.random() - 0.5) * 3;
+				const g = ctx.createGain();
+				g.gain.setValueAtTime(0.0001, now);
+				g.gain.linearRampToValueAtTime(p.a * v, now + 0.006);
+				g.gain.exponentialRampToValueAtTime(0.0001, now + p.d);
+				osc.connect(g);
+				g.connect(out);
+				osc.start(now);
+				osc.stop(now + p.d + 0.08);
+			}
+
+			// 极轻的击弦瞬态：只留一点触键质感，不再是明显嘶声
+			const noise = ctx.createBufferSource();
+			noise.buffer = noiseBuffer(ctx);
+			const hp = ctx.createBiquadFilter();
+			hp.type = "highpass";
+			hp.frequency.value = 2500;
+			const ng = ctx.createGain();
+			ng.gain.value = v * 0.05;
+			noise.connect(hp);
+			hp.connect(ng);
+			ng.connect(out);
+			noise.start(now);
+		}
+
+		//#region note naming
+		const NOTE_NAMES = ["C", "C#", "D", "D#", "E", "F", "F#", "G", "G#", "A", "A#", "B"];
+		function noteLabel(midi) {
+			return NOTE_NAMES[((midi % 12) + 12) % 12] + (Math.floor(midi / 12) - 1);
+		}
+
+		//#region settings
+		const LS_KEY = "dsh-scroll-piano:settings";
+		const DEFAULTS = { on: true, volume: 0.25, stripWidth: 30, lowNote: 48, highNote: 84, inset: 56 };
+		function loadSettings() {
+			try {
+				return { ...DEFAULTS, ...(JSON.parse(localStorage.getItem(LS_KEY) || "{}")) };
+			} catch {
+				return { ...DEFAULTS };
+			}
+		}
+		function saveSettings(s) {
+			try { localStorage.setItem(LS_KEY, JSON.stringify(s)); } catch {}
+		}
+
+		//#region component
+		function ScrollPiano() {
+			const [settings, setSettings] = useState(loadSettings);
+			const [label, setLabel] = useState("");
+			const settingsRef = useRef(settings);
+			settingsRef.current = settings;
+			const lastMidiRef = useRef(null);
+			const lastPlayRef = useRef(0);
+			const stripRef = useRef(null);
+			const markerRef = useRef(null);
+			const hudRef = useRef(null);
+
+			const setOn = useCallback((on) => {
+				setSettings((s) => {
+					const next = { ...s, on };
+					saveSettings(next);
+					return next;
+				});
+				if (on) audioCtx();
+			}, []);
+			const setVolume = useCallback((volume) => {
+				setSettings((s) => {
+					const next = { ...s, volume };
+					saveSettings(next);
+					return next;
+				});
+			}, []);
+
+			useEffect(() => {
+				const showMarker = (y) => {
+					const m = markerRef.current;
+					if (m) m.style.top = Math.round(y - 3.5) + "px";
+				};
+				const showHud = (y, text) => {
+					const el = hudRef.current;
+					if (!el) return;
+					el.style.top = Math.round(y - 10) + "px";
+					el.style.right = "16px";
+					el.textContent = text;
+				};
+
+				const onMove = (e) => {
+					const s = settingsRef.current;
+					if (!s.on) return;
+					const W = window.innerWidth;
+					const H = window.innerHeight;
+					if (e.clientX < W - s.stripWidth) {
+						lastMidiRef.current = null;
+						if (markerRef.current) markerRef.current.classList.remove("dshscp_markerOn");
+						if (hudRef.current) hudRef.current.classList.remove("dshscp_hudOn");
+						return;
+					}
+					const span = Math.max(1, H - s.inset * 2);
+					const t = Math.min(1, Math.max(0, (e.clientY - s.inset) / span));
+					// t=0（顶部）→ highNote；t=1（底部）→ lowNote
+					const midi = Math.round(s.highNote - t * (s.highNote - s.lowNote));
+					showMarker(e.clientY);
+					showHud(e.clientY, noteLabel(midi) + "  ·  " + midi);
+					if (markerRef.current) markerRef.current.classList.add("dshscp_markerOn");
+					if (hudRef.current) hudRef.current.classList.add("dshscp_hudOn");
+					if (midi !== lastMidiRef.current) {
+						lastMidiRef.current = midi;
+						// 限速：滑太快时不要瞬间堆几十个音（会糊成一片杂音）
+						const nowMs = performance.now();
+						if (nowMs - lastPlayRef.current >= 24) {
+							lastPlayRef.current = nowMs;
+							playNote(midi, s.volume);
+						}
+						setLabel(noteLabel(midi));
+					}
+				};
+				const onLeave = () => {
+					lastMidiRef.current = null;
+					if (markerRef.current) markerRef.current.classList.remove("dshscp_markerOn");
+					if (hudRef.current) hudRef.current.classList.remove("dshscp_hudOn");
+				};
+				document.addEventListener("pointermove", onMove, { passive: true });
+				document.addEventListener("pointerleave", onLeave);
+				window.addEventListener("blur", onLeave);
+				return () => {
+					document.removeEventListener("pointermove", onMove);
+					document.removeEventListener("pointerleave", onLeave);
+					window.removeEventListener("blur", onLeave);
+				};
+			}, []);
+
+			// 竖条指示 + 位置圆点 + 音符 HUD（纯视觉，不拦事件）
+			return h(React.Fragment, null,
+				h("div", { ref: stripRef, className: "dshscp_strip" + (settings.on ? " dshscp_stripOn" : "") }),
+				h("div", { ref: markerRef, className: "dshscp_marker" }),
+				h("div", { ref: hudRef, className: "dshscp_hud" }),
+				h("div", { className: "dshscp_pill" },
+					h("button", {
+						onClick: () => setOn(!settings.on),
+						title: settings.on ? "关闭滚动钢琴" : "开启滚动钢琴"
+					},
+						h("span", { className: "dshscp_dot" + (settings.on ? " dshscp_dotOn" : "") }),
+						"🎵 滚动钢琴" + (settings.on ? " ON" : " OFF")
+					),
+					h("input", {
+						className: "dshscp_vol",
+						type: "range",
+						min: 0,
+						max: 1,
+						step: 0.05,
+						value: settings.volume,
+						onChange: (e) => setVolume(parseFloat(e.target.value)),
+						title: "音量"
+					}),
+					label ? h("span", { style: { opacity: 0.75, minWidth: "26px" } }, label) : null
+				)
+			);
+		}
+
+		//#region apply
+		const inject = ["slots"];
+		function apply(ctx) {
+			ctx.slots.inject("shell.overlay", () => ctx.slots.register({
+				name: "shell.overlay",
+				id: "dsh-scroll-piano:overlay",
+				order: 110,
+				inject: () => ({})
+			}, ScrollPiano));
+		}
+		exports.apply = apply;
+		exports.inject = inject;
+
+		return module.exports;
+	}
+});

package/lib/index.js

@@ -0,0 +1,9 @@
+/**
+ * dsh-scroll-piano — host half (browser-only surface).
+ *
+ * 全部功能在浏览器半（`./client`，通过 package.json → `dsh.client` 声明）。
+ * 服务器半不需要任何服务、不新增宿主状态，只需一个空 `apply` 让 Loader 行能挂载。
+ */
+function apply() {}
+
+export { apply };

package/package.json

@@ -1,6 +1,59 @@
 {
   "name": "dsh-scroll-piano",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.1.0",
+  "description": "滚动钢琴：鼠标滑过 DSH 右侧边缘的滚动条竖条时，按纵向位置发出钢琴音（越高音越高，特雷门琴式）。",
+  "type": "module",
+  "license": "MIT",
+  "keywords": [
+    "dsh",
+    "dsh-plugin",
+    "deepseek-harness",
+    "piano",
+    "scrollbar",
+    "theremin",
+    "钢琴",
+    "滚动钢琴"
+  ],
+  "main": "lib/index.js",
+  "exports": {
+    ".": {
+      "default": "./lib/index.js"
+    },
+    "./client": {
+      "default": "./lib/client.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "lib/**/*.js",
+    "cordis.patch.yml",
+    "README.md",
+    "LICENSE"
+  ],
+  "engines": {
+    "node": ">=22",
+    "dsh": ">=0.2.0-rc.1"
+  },
+  "peerDependencies": {
+    "@deepseek-ai/cordis": "^4.0.1"
+  },
+  "dsh": {
+    "bundle": {
+      "patch": "./cordis.patch.yml"
+    },
+    "client": {
+      "inject": [
+        "@deepseek-ai/dsh-client-ui-slots"
+      ],
+      "platform": "web"
+    },
+    "compatibility": {
+      "dshReleases": {
+        "0.2.0-rc.2": "compatible"
+      }
+    }
+  },
+  "scripts": {
+    "test": "node test/bundle-check.mjs"
+  }
 }