Doro 橘子酱皮肤 Baizhuojielan/dsh-doro

dsh-doro · Doro 橘子酱

面向 DeepSeek Harness WebGUI 的 Doro 主题皮肤插件（粉丝向，个人/非商用）。

| 亮色 | 暗色 |
| light | dark |

这是什么

一套纯展示层皮肤插件：全屏背景、左右下角立绘（自动贴合侧栏与窗口宽度、不挡聊天文字）、粉橙主题色、自定义 favicon。可热切换、不注入服务、不发 Cordis 事件、不触达模型请求。

Doro 是 NIKKE（Shift Up）的版权角色。本仓库是粉丝向非商用作品，素材为 AI 生成 + 自整理的粉丝图，发布行为由仓库所有者自行负责。

安装（装进 dsh web profile）

方式一：git 仓库（推荐）
dsh plugin --profile web add github:/dsh-doro

方式二：本地开发
git clone dsh-doro
cd dsh-doro
pnpm install
pnpm build # 产出 lib/index.js + lib/client.js
dsh plugin --profile web add

然后重启 dsh web 生效；之后切换皮肤走配置热重载（见下）。

激活 / 切换皮肤

编辑两个 patch 层（home 层覆盖 profile 层）：

- ~/.dsh/cordis.patch.yml
- ~/.dsh/profiles/web/cordis.patch.yml

- id: ui-skin-doro
disabled: false
- id: ui-skin-maid-atelier
disabled: true
- id: ui-skin-orca-link
disabled: true

patch 里没列出的皮肤默认启用，所以同一时间必须显式停用其余每一套。保存即热重载，刷新页面即可。

任务完成提示音

每次 agent 完成一轮回复（工作中指示消失）会自动播放提示音：

- 默认：无音效文件时播放 WebAudio 合成的两连音（A5→E6）。
- 默认音效：Doro 吟唱"Doro doro doro"（经典 meme 曲 DORODORA ODORO，裁取 2.2s 片段），取自 Voicemod Tuna 音效板 用户上传的粉丝 meme 音频，非商用粉丝用途。
- 自定义音效：把你的音效文件命名为 chime.mp3（也支持 wav/ogg/m4a）放进 assets/，然后：
node scripts/build-art.mjs # 内嵌 assets/chime.* → DORO_CHIME
pnpm build

重启 dsh web 生效。建议音效 ≤1MB、时长 1~2 秒。
- 静音：浏览器控制台执行 localStorage['dsh-doro:chime-muted'] = '1'，恢复设 '0'。

实现：监听会话的"工作中"指示（role="status" + "Deep diving" 文本）从挂载到消失的边沿；音频在首次点击/按键时预热（浏览器自动播放策略），之后可靠触发。

替换素材

1. 把你的 Doro 图（PNG，带透明通道最佳）丢进 assets/。
2. 调整 scripts/build-art.mjs 里的角色映射（哪张做背景、左/右立绘、favicon）。
3. 重新生成并构建：
node scripts/build-art.mjs # 重生成 src/client/doro-art.generated.ts（ffmpeg → WebP data URI）
pnpm build

4. 重启 dsh web 生效。

素材槽位：

| 常量 | 用途 |
| DORO_BACKDROP | 全屏背景（建议宽幅构图，低透明度 + 渐变遮罩保证可读性） |
| DORO_CHAR_LEFT | 左下角立绘（宽度受限贴合留白区、自动避开侧栏；窄窗口自动隐藏，不挡聊天文字） |
| DORO_CHAR_RIGHT | 右下角立绘（同上；窗口 <1400px 自动隐藏） |
| DORO_MASCOT | 预留槽位：当前默认不渲染（曾经底部居中的吉祥物会压住 hero 提示文字，已移除）。想用回它需要同时改 src/client/index.ts 与 CSS |
| DORO_FAVICON | 浏览器标签图标（从吉祥物图中心裁剪生成） |

立绘尺寸调节：改 src/client/doro.style.ts 里 [data-doro-character='left'] / 'right' 的 width: clamp(...) 与媒体查询断点即可（方图按宽度×宽度渲染）。

想加更多装饰层（侧栏挂件、标题栏装饰等）：仿照 maid-atelier 在 apply() 里追加 data-skin-chrome 舞台层（position: fixed; inset: 0; z-index: 0/1; pointer-events: none; contain: strict）。

构建

pnpm install
pnpm build

产物契约与官方皮肤一致：lib/client.js 是闭包工厂
（window.__ModuleLoader__.load({ id, factory })），平台模块走加载器模块表。
lib/ 已随仓库分发（预构建），克隆后可直接安装使用，无需本地构建。

致谢

- 皮肤架构（bundle 形状、客户端生命周期、patch 分层）参考 dsh-deep-whale 与 dsh-web-ui 皮肤系列。
- 角色形象版权归 NIKKE（Shift Up）所有；本仓库为粉丝向非商用二创。

许可

CC BY-NC-SA 4.0（署名-非商业性使用-相同方式共享）。详见 LICENSE。