DeepSeek Harness (DSH) 的 better-sidebar 默认不渲染音频文件,文档中常将其列为「已知二进制、无渲染器」。dsh-plugin-better-sidebar-plugin-audio 通过向 better-sidebar 注册文件预览器,并内置支持 HTTP Range 的媒体路由,解决了这个问题。它能让任意大小的音频文件在右侧栏直接播放、查看波形、拖动进度以及分析频谱。
功能¶
插件主要包含以下能力:
- 波形绘制
- 两层结构:淡色峰值带(垫底)与深色 RMS 主体(压顶),使用不同透明度的同色相,避免同色糊块或碎点。
- 交互:支持点击/拖动定位、滚轮以指针为中心缩放、
Alt+拖动平移、双击适配全曲。
- 全曲频谱图
- 基于 STFT(1024 点 FFT、Hann 窗、Mel 轴、无插值)。
- 与波形共用时间轴,缩放和平移时细节会随视窗重算,而非简单拉伸。
- 实时频谱
- 播放时通过 FFT(2048 点、对数轴)生成数据。
- 提供柱状、折线、瀑布三种风格,或关闭。
- 播放控制
- 支持播放/暂停/停止/重播、音量调节、静音。
- 倍速范围:0.25x 至 3x。
- 循环与选区
- 循环:关闭/整曲/选区 A-B 循环(按
L切换)。 - 选区:按
Shift+拖动框选,实时显示区间时长及峰值/RMS dBFS。
- 循环:关闭/整曲/选区 A-B 循环(按
- 大文件支持
- 利用 HTTP Range 实现流式播放,不整包解码。
- 自动解码约 176KB/s,超过 30 分钟的文件仅流式播放。
- 声道与降级
- 声道切换:混合/左/右/独立包络。
- 降级处理:浏览器解码失败时提示、Web Audio 不可用时停用频谱。
安装¶
使用以下命令安装插件。该插件依赖 Node.js >= 20。
dsh plugin --profile web add "github:huanlinoto/dsh-plugin-better-sidebar-plugin-audio"
安装后需要重启 dsh web 并在浏览器进行硬刷新(Ctrl+Shift+R)才能生效。
使用¶
- 在 DSH 的文件树中找到任意音频文件(支持 mp3/wav/flac/ogg/m4a/aac/wma/opus)。
- 点击文件即可在右侧栏加载播放器。
- 使用快捷键控制播放:
- 空格:播放/暂停。
- ← / →:跳转 ±5s(按住
Shift为 ±1s)。 - Home / End:跳至首尾。
- M:静音。
- L:切换 A-B 循环模式。
注意事项¶
- 界面特性:界面文字不可选中,读数行高度固定,画布填满主区域。
- 配色跟随:颜色通过探针元素解析
var()链,确保在不同皮肤下正确显示。波形两层颜色必须不同。 - 缓存问题:安装新插件后务必进行硬刷新,否则可能看不到新功能。
- 依赖:依赖预构建的
lib/库,通过 GitHub 安装即开箱即用。
总结¶
该插件为 DSH 环境补齐了音频预览能力,利用流式技术解决了大文件播放问题,并通过精细的波形和频谱算法提升了开发调试的体验。