mirror of https://gitcode.com/JianFeeeee/HomeAgent.git synced 2026-09-26 04:13:24 +00:00

Files

JianFeeeee 7b7d405463 site: 重做第 3/5 张示意图 + 删冗长文案 + 修中文排版

用户反馈：3/5 页面图片不够精致、动画单调；hero 与架构节两句文案啰嗦；
图 1 那句注释要删。

## ① 删掉两处冗余文案

- 图 1 的 `<p class="dv-note">箭头只进出插件 —— 内核一列都没有</p>`：
  图上已经画出来了（光球只打插件、内核周围无连线），注解是重复
- 架构节副标题的「插件可改写或短路」：与组件表里 `Stage` 那行完全重复
  （那行还更具体，带 1/4/2 的阶段分布）

## ② hero 副标题重写

原文「内核只管编排、记忆与调度，消息 / 文件 / 网络 / 设备一律交给插件。
插件崩了不牵连内核 —— 换掉一个二进制就热重载。」三重堆叠、句子太长。

改短后又发现**两处与源码不符**，一并改准：
- 「热重载」不是崩溃后的行为。崩溃走的是退避重启
  （`scheduleProcRestart`：1s/2s/3s，`AutoRestartEnabled` 默认 true），
  `ReloadOne` 是换二进制那条路径。混成一句等于说错。
- 改为「崩了自己重启，波及不到内核」。

## ③ 图 3（共享内存）：从稀疏线框重画

原图 19 个元素、层次扁平。重画后 53 个元素、三层递进：

- 两个进程做成带玻璃高光的卡片，各标自己的**虚拟地址**（0x7f2a… / 0x55c1…）
- 中间一句桥接：「不同虚拟地址 · 同一物理页」——这才是零拷贝的关键
- 物理页外框呼吸描边 + 极淡填充
- 段内标出 `header`（魔数·版本）与 `arena`，并加**字节刻度**，
  把「一片区域」讲成「有结构的区域」

## ④ 图 5（长任务转投）：填掉大片空白

原图下三分之一完全空着，且「两种出路」只写在文案里、图上没有任何体现。

- 主 agent 加**忙碌进度条**（一直爬不到头，呼应「占住很久」）
- 积压消息由 2 条改 3 条、宽度递减成「一摞」，并逐条被取走
- 右上空白填入**触发条件**，给的是源码实测默认值
  （`defaultOffloadBusyAfter = 5min`、`defaultOffloadMinPending = 3`），
  并注明「默认关闭，需部署方打开」
- 新增回执区：`① 简单 → 直接办完，发回原通道` /
  `② 需主 agent → 回「忙碌中，请稍候」`，并用光点示意回执送达用户

## ⑤ 排版：中文之间夹空格

改文案时实测发现正文里有「实时 渲染」这类中文间空格 —— 源码换行被浏览器
渲染成一个空格。找出真实渲染有空格的位置并修掉（改用 innerText 判定，
textContent 会把 `<em>` 等块边界误判为空格，实测误报了 2 处）。

## 自己踩到并修掉的几个坑

- 「各自的虚拟地址」两句标签被竖向虚线穿过（压字）→ 改为一句居中桥接
- 图 3 标题靠左时被 `x=72` 的写入虚线穿过 → 改居中
- 玻璃高光整块铺满像蒙了层白纱 → 收到上半部、透明度 .3
- 巡行光点框看起来像页内多了一层框 → 去掉，改为外框呼吸
- 内层标题与外层桥接都在说「同一物理页」→ 内层改为描述段布局

## 验证

- 深浅双主题逐图截图核对（图 3、图 5 各两套）
- 动画：图 3 从 5 → 11 个动画元素、图 5 从 8 → 10；元素总数 19→53、17→45
- reduce 下新增的 CSS 动画（physBreathe、dv5-pile、忙碌条）全部停；
  SMIL 仍靠 pauseAnimations，8/8 SVG 已暂停
- 回归：深浅主题 / JS 禁用 / reduce / 390·768·1440 三档，零横向溢出、无控制台错误
- 结构：CSS 括号平衡、HTML 无未闭合标签

2026-09-20 23:37:16 +08:00

assets

feat(site): 深浅双主题 + 动效层，并按用户要求移除立绘

2026-09-19 21:49:59 +08:00

index.html

site: 重做第 3/5 张示意图 + 删冗长文案 + 修中文排版

2026-09-20 23:37:16 +08:00

README.md

feat(site): 文案精简 + 插件可点击 + 版面精致化

2026-09-19 22:24:03 +08:00

README.md

官网（静态站）

单文件、零构建、零依赖的落地页。与仓库 WebUI 的做法一致（原生 HTML/CSS/JS，无打包步骤）。

文件

site/
├── index.html          单文件站点（内联 CSS/JS）
└── assets/
    └── logo.svg        logo（来自 assets/branding/logo-h-he.svg）

资源是复制而非引用上级目录，因此 site/ 可整体拷走独立部署。

本地预览

cd site && python3 -m http.server 8799
# 打开 http://127.0.0.1:8799/

部署

纯静态，任意 web 服务器指向 site/ 即可：

server {
    listen 80;
    server_name your.domain;
    root /path/to/TrueAgent/site;
    index index.html;
    location / { try_files $uri $uri/ =404; }
}

设计说明

配色取自品牌指南：蓝 #3b82f6 / 青 #06b6d4 / 金 #f59e0b，正好对应三层记忆 Context / Document / Graph，因此三层记忆那节直接用了这三色做色条。
不放置立绘。曾试过放看板娘，但原图是白底 + 蓝紫渐变外框的方形图，与页面几乎无法自然衔接（详见下文「为什么最终没有图」）。
淡入动画是渐进增强：内容默认可见，仅当 JS 真的跑起来才加 .js-reveal 接管。早期版本把 opacity:0 写在默认样式里，结果 JS 未执行时整页永久空白（实测 30 个元素里 26 个停在不可见）——现在禁用 JS 也完整可读。
尊重 prefers-reduced-motion；架构图的 <pre> 在窄屏横向滚动，避免整页撑宽。

深浅双主题

跟随系统偏好；导航栏右上角的按钮可手动切换，选择存入 localStorage（键 ha-theme）。

实现要点：

在 <head> 里首绘前就定好 data-theme，避免先渲染深色再跳浅色的闪白。
语义色全部走 CSS 变量（--bg / --text / --border / --code-bg / --hover …）， :root[data-theme="light"] 只覆盖取值，不重复选择器。
品牌三色（蓝/青/金）两主题共用，因为它对应三层记忆，换主题不该换语义。

动效层

效果	位置
四团极光漂移 + 细网格	背景（`position: fixed`, `z-index: -2`）
粒子网络（近邻连线）	`#fx` canvas，密度按视口面积自适应，上限 72
三色滚动进度条	顶部
标题渐变流动	`h1 .grad`
分块上浮入场（错落延迟）	各 section
卡片聚光 + 3D 微倾	`.card` / `.stat`（仅精确指针）
色条自上而下「灌注」	三层记忆
数据流光带下行 + 节点脉冲	架构图
数字滚动到位	统计卡
文字下划线展开	分节标题

三条硬约束（都吃过亏）：

内容默认可读：初始隐藏只在 .js-fx 下生效，而 .js-fx 只有 JS 真跑起来才加。 JS 被禁用或报错时，页面是完整可读的 —— 早期版本把 opacity:0 写在默认样式里，实测 30 个元素里 26 个永久不可见。
尊重 prefers-reduced-motion：此时不加 .js-fx、不启粒子、不画进度条，所有元素直接可见。
装饰不得产生滚动条：canvas 按 documentElement.clientWidth 定尺寸（用 window.innerWidth 会含滚动条宽度，实测多出 15px 撑出横向滚动）； body 再加 overflow-x: clip 兜底。

所有 listener 走 requestAnimationFrame 节流；标签页隐藏时暂停粒子。

为什么最终没有图

试过放看板娘立绘，失败，最后决定不放。过程留在这里，免得下次重复踩：

原图 mascot-xiaozhai.webp 是不透明 WebP（无 alpha），白底 + 蓝紫渐变外框。直接用 = 深色页面上一个刺眼的白色方块；抠图又不可行：

python3 -c "
from PIL import Image
im = Image.open('assets/branding/mascot-xiaozhai.webp')
print(im.mode)  # RGB —— 没有 alpha 通道
"

背景连通域分析显示白底与角色的白裙子、白围裙同色，flood-fill 会顺着轮廓渗进去，让约 42% 的身体变成透明（发丝高光先死）。曾退而求其次做成「圆角卡面 + 发光边框 + 底部渐隐」，视觉上能接受，但本质上是在方形图上盖装饰，而非让图融入页面。

结论：这类素材要么重新出一张带透明通道的图，要么就不放。现在 Hero 是单栏文字，版面反而更稳。

插件卡片

「开箱可用的插件」一节里，每个徽章都是按钮：

点一下展开该插件卡（名称 / 版本 / 用途），再点收起
可同时展开多个
末尾「展开全部 N 个」一次全开

数据来自各插件的 plugin.json，不是手写的：

cd /home/newqqagent/plugins
for d in */; do [ -f "$d/plugin.json" ] && python3 -c "
import json;d=json.load(open('$d/plugin.json'))
print(d.get('name'), d.get('version'), d.get('description','')[:60])"; done

改内容前请核对事实

页面上的数字都是实测值。注意「在跑插件 36」是加载总数 （16 内置 + 20 外部），不是"外部插件数" —— 早期版本写成「36 外部插件」是错的，已更正。改动前建议重新取一遍：

# 在跑插件（以日志里实际 loaded 的为准，比数目录可靠）
grep -h '\[plugin\] loaded:' $(ls -t /home/newqqagent/log/homed_*.log | head -1) \
  | sed 's/.*loaded: //' | sort -u | wc -l

# 工具数（同上，日志里注册后的真实值）
grep -ohE '[0-9]+ tools' $(ls -t /home/newqqagent/log/homed_*.log | head -1) | tail -1

# Go 代码行（排除第三方与鸿蒙工程）
find . -name '*.go' -not -path './.git/*' -not -path './.go/*' \
  -not -path './third_party/*' -not -path './cmd/ohos/*' | xargs cat | wc -l

# LLM 适配器（注意 server.lua 是网关脚本，不是厂商适配器，故为 9）
ls internal/lua/adapters/*.lua | xargs -n1 basename

README.md Unescape Escape

官网（静态站）

文件

本地预览

部署

设计说明

深浅双主题

动效层

为什么最终没有图

插件卡片

改内容前请核对事实

README.md