dph-endfield-theme

Readme

# DPH Endfield Theme

为 DeepSeek Harness（DSH）Web 界面制作的非官方联动主题。它保留 DSH 原有功能与文案，只改变界面配色、面板结构、交互动效，并在输入框左侧加入会随会话状态切换的角色动画。

> [!IMPORTANT]
> 本项目是非官方同人主题，与 DeepSeek、Hypergryph、Gryphline 及相关权利方无隶属或授权关系。公开分发前请阅读文末的素材说明。

## 界面预览

### 首页

![DPH Endfield Theme 首页预览](docs/images/preview-home.png)

### 会话页

![DPH Endfield Theme 会话页预览](docs/images/preview-conversation.png)

## 角色动画状态

| 待机 | 用户输入中 | 模型思考／执行中 |
|:---:|:---:|:---:|
| ![待机动画](docs/images/state-idle.gif) | ![输入动画](docs/images/state-typing.gif) | ![思考动画](docs/images/state-thinking.gif) |
| 无输入且模型空闲 | 检测到键盘、输入或输入法组合事件 | 检测到模型生成或任务执行状态；页面中还会出现问号动效 |

三种状态均为 24 帧循环动画，角色脚底锚点固定，切换状态时不会改变站位。启用系统“减少动态效果”后，主题会停止非必要动画。

## 主要特性

- 冷黑工业界面与荧光黄色状态信号；
- 切角面板、侧栏状态条、顶部联动栏和响应式布局；
- 首页、会话页、输入框、设置弹窗及常用控件统一主题；
- 待机、输入、思考／执行三套角色动画；
- 自动处理输入框文字层、光标层和高度镜像层，避免文字重影与光标漂移；
- 角色区域在空间不足或设置弹窗打开时自动隐藏；
- 首页右侧提供可伸缩的官网消息抽屉，显示《明日方舟：终末地》官网最新公告、活动与新闻；
- 空工作区侧栏使用开放导轨式状态布局，创建会话或开始搜索后自动隐藏；
- 运行素材由插件自身提供，无需手动复制 PNG 到 DSH 安装目录；
- 只作用于 `web` profile，不修改 DSH 核心包和会话数据。

## 官网消息抽屉

首页右侧的角色立绘预留区已改为消息抽屉。宽屏默认展开，中等宽度默认收起为 52 px 的竖向导轨，低于 1180 px 时自动隐藏；用户可以随时用抽屉按钮展开或收起。展开尺寸为 `clamp(360px, 26vw, 440px)`，高度不超过 660 px，因此不会挤占常规会话内容。

消息来自[《明日方舟：终末地》官网 News](https://endfield.hypergryph.com/news)使用的公开公告接口。Host 端每次只读取 6 条标题、分类、时间、摘要和详情链接，并缓存 5 分钟；浏览器只访问 DSH 自身的同源只读路由。主题不会复制官网图片、注入第三方脚本，也不会把 DSH 会话或输入内容发送到该站点。官网暂时不可访问时，抽屉会显示离线提示，并保留直达官网的链接。

## 安装

### 在 DSH 对话中让助手安装

发布后，普通用户可以先把当前会话权限切换为 **Full Access**，再把下面这段话发送给 DSH：

```text
请访问 https://raw.githubusercontent.com/thjyy/dph-endfield-theme/main/INSTALL.md，先阅读并核对安装说明，
然后为 web profile 安装其中指定的 DPH Endfield Theme。
不要执行说明之外的远程脚本；完成后告诉我验证结果和需要怎样重启 DSH。
```

助手会在得到用户授权后运行透明、可检查的 `dsh plugin` 命令。这里不能完全静默安装：DSH 默认的 `Workspace Write` 权限不能修改用户目录中的 profile，而且正在运行的 DSH Web 必须由用户重启后才会加载新主题。

仓库内为这个流程准备了独立的 [INSTALL.md](INSTALL.md)。也可以让自有域名把 `/INSTALL.md` 指向该文件。

### 使用 CLI 从 GitHub 安装

```sh
dsh plugin --profile web add github:thjyy/dph-endfield-theme
```

更稳妥的做法是锁定一个确认过的提交：

```sh
dsh plugin --profile web add github:thjyy/dph-endfield-theme#<commit-sha>
```

项目包含预构建的浏览器代码，不需要在安装阶段运行构建脚本。安装完成后重新启动 DSH Web：

```sh
dsh web
```

浏览器仍显示旧样式时，使用 `Ctrl + F5` 强制刷新。

### 从本地目录安装

在项目根目录执行：

```sh
dsh plugin --profile web add .
dsh web
```

也可以传入项目的绝对路径：

```sh
dsh plugin --profile web add "D:/path/to/dph-endfield-theme"
```

### 更新与卸载

```sh
# 更新通过 GitHub 或包地址安装的版本
dsh plugin --profile web update dph-endfield-theme

# 卸载主题
dsh plugin --profile web remove dph-endfield-theme
```

更新或卸载后请重新启动 `dsh web`。

## 工作方式

仓库根目录本身是一个可安装的 DSH bundle：

- `cordis.patch.yml` 把主题加入 `web` profile；
- `plugin/lib/client.js` 在浏览器端注入主题样式、页面装饰和状态动画；
- `plugin/lib/index.js` 在 DSH Web 服务中注册只读素材与官网消息代理路由；
- `plugin/assets/mascot-*-sprite24.png` 是运行时使用的三张 24 帧精灵图。

插件不会上传提示词、修改模型配置、写入会话内容或替换 DSH 自带包。

## 项目结构

```text
.
├─ package.json                 # GitHub / 本地安装入口
├─ cordis.patch.yml             # DSH bundle 配置层
├─ plugin/
│  ├─ lib/index.js              # Host：提供运行时 PNG 与只读消息代理
│  ├─ lib/client.js             # Web：主题与交互逻辑
│  ├─ assets/                   # 运行时精灵图与维护源素材
│  └─ scripts/                  # 精灵图构建和串帧校验
├─ docs/images/                 # README 截图与 GIF
└─ scripts/export_readme_gifs.py
```

## 开发与验证

安装依赖不是使用主题的前提；只有重新导出 README 动图时才需要 Python 与 Pillow。

```sh
# 检查浏览器端和 Host 端 JavaScript
node --check plugin/lib/client.js
node --check plugin/lib/index.js

# 校验三张精灵图：尺寸、站位、首尾帧和相邻帧串图
python plugin/scripts/validate_mascot_animation.py \
  plugin/assets/mascot-idle-sprite24.png \
  plugin/assets/mascot-typing-sprite24.png \
  plugin/assets/mascot-thinking-sprite24.png

# 重新生成 README 的三个 GIF
python scripts/export_readme_gifs.py

# 检查最终安装包包含哪些文件
npm pack --dry-run
```

## 兼容性

- 仅支持 DSH Web profile；
- 依赖 DSH 的 bundle 与浏览器 client plugin 机制；
- 主题使用少量 DSH DOM 结构选择器，DSH 发生较大界面重构后可能需要同步更新；
- 窄屏会优先保证会话与输入框空间，自动隐藏角色动画与官网消息抽屉；
- 官网消息需要 Host 能够访问 `web-news.hypergryph.com`，不可访问时不影响 DSH 的其他功能。

## 许可与素材说明

项目代码采用 `LICENSE` 中说明的 MIT License。角色图像、游戏名称、商标及其他第三方视觉素材不包含在 MIT 授权范围内，其权利归各自权利人所有。

如果要公开发布或二次分发，请确认你有权分发仓库中的角色素材；否则请在发布前替换或移除相关 PNG/GIF。详见 [ASSET-NOTICE.md](ASSET-NOTICE.md)。