好感度显示器

一个可以添加到手机主屏幕的好感度计，动画风格，数据只保存在本机。

在线使用 → fumonull.github.io/haogan

---

灵感来自《齐木楠雄的灾难》里的好感度计：红色爱心机身、金色描线、液晶数码管和两根小球天线。

功能

• 心形好感度计：0–100 分，金线以内的液体随分数升降。颜色从冷蓝渐变到正红，分数越高水波越活泼、气泡越多。
• 背景随心情变化：低分时是阴沉的漫画竖线，中间是网点，高分出现泡泡、闪光、爱心，接近满分时有放射光线。
• 加减分：单击 ±1，长按连续加减。每次操作有水花、心跳、天线摆动。
• 记录：列出每次加减的时间与分值，连续同向操作会合并为一条；左滑删除，分数自动撤回。
• 音效：用 Web Audio 实时合成，可在设置里关闭。
• 浅色 / 深色、离线可用、无需账号。

安装到手机

1. 手机用浏览器打开 https://fumonull.github.io/haogan/
2. iPhone：Safari → 分享 → 添加到主屏幕；Android：Chrome → 菜单 → 添加到主屏幕 / 安装应用
3. 从主屏幕图标打开，设定初始好感度

• 先添加到主屏幕再开始使用：iPhone 上主屏幕 App 与 Safari 的数据互不相通。
• 数据只存在这台手机上（localStorage），不会上传到任何地方；删除主屏幕图标会同时清除数据。

本地运行

纯静态网页，无依赖、无需构建：

python3 -m http.server 8000

然后打开 http://localhost:8000。

自己部署

把整个仓库放到任意静态托管即可（需要 HTTPS 才能离线使用）。本仓库用 GitHub Pages：Fork 后在 Settings → Pages 选择 main 分支根目录。

文件

文件	作用
index.html	页面结构
style.css	样式（浅色 / 深色，背景随好感度变化）
meter.js	心形好感度计的绘制（Canvas 2D：机身、液晶数码管、天线、液体）
sound.js	音效（Web Audio 实时合成，无音频文件）
app.js	加减分、记录、设置
sw.js	离线缓存（更新后下次打开生效）
manifest.webmanifest、icons/	主屏幕图标与名称

许可证

MIT

本项目为同人灵感作品，所有图形与音效均为原创绘制 / 合成，与《齐木楠雄的灾难》原作及其版权方无关。