# Vocab Ninja 词汇忍者
> 一个可直接打开运行的 HTML 词汇切字母小游戏。无需构建、无需后端，双击 `index.html` 即可游玩。
语言切换：**中文** | [English](README.en.md)
## 项目简介
Vocab Ninja 是一个类似切水果手感的英语词汇练习游戏。玩家需要根据屏幕上缺失字母的单词和提示，切中飞出的正确字母球来得分。项目采用纯静态实现，适合课堂互动、单词复习、英语启蒙和本地离线演示。
## 功能特性
- 单人模式与双人对战模式
- 30 / 60 / 90 秒游戏时长
- 慢速、普通、快速三档速度
- 可调节字母球弹出高度和三档速度强度
- 中英文界面切换，并保存语言偏好
- 教师模式：本地创建、管理自定义词库
- 本地存储词库与游戏调参，无需服务器
- 卡通忍者 PNG 角色素材
- 单文件 HTML 游戏主体，打开即可玩
## 项目截图
### 主菜单
### 游戏画面
### 游戏调参
## 快速运行
### 方式一：直接打开
在文件管理器中双击打开：
```text
index.html
推荐浏览器：
- Chrome
- Edge
- Safari
- Firefox
方式二：使用本地静态服务
如果你希望通过局域网访问，可以在项目目录执行：
python3 -m http.server 8080
然后浏览器访问：
http://localhost:8080/
同一局域网设备可访问：
http://你的电脑IP:8080/
部署说明
本项目是纯静态站点，只需要把以下文件放到任意静态 Web 服务目录即可：
index.html
assets/
screenshots/
README.md
README.en.md
部署到 Nginx
示例：
server {
listen 80;
server_name vocab-ninja.example.com;
root /var/www/vocab-ninja;
index index.html;
location / {
try_files $uri $uri/ /index.html;
}
}
将项目文件复制到：
/var/www/vocab-ninja
然后重载 Nginx：
sudo nginx -t
sudo systemctl reload nginx
部署到 GitHub Pages
- 进入 GitHub 仓库 Settings。
- 打开 Pages。
- Source 选择 Deploy from a branch。
- Branch 选择 main，目录选择 /root。
- 保存后等待 GitHub Pages 构建完成。
部署到 GitLab Pages
可以新增 .gitlab-ci.yml：
pages:
stage: deploy
script:
- mkdir -p public
- cp -r index.html assets screenshots README.md README.en.md public/
artifacts:
paths:
- public
only:
- main
提交后 GitLab CI 会将项目发布为 Pages 静态站点。
使用说明
开始游戏
- 选择词库。
- 选择游戏时间。
- 选择速度档位。
- 点击「单人模式」或「双人模式」。
- 根据提示切中正确的字母球。
双人模式
- 左半屏为玩家 1。
- 右半屏为玩家 2。
- 各自只切自己半屏的字母球。
教师模式
教师模式支持创建本地词库。格式如下：
LION : King of the jungle
TIGER : Large striped cat
BEAR - Loves honey
支持 :、-、, 作为单词与提示的分隔符。词库保存在浏览器本地存储中。
游戏调参
「游戏调参」中可以设置：
- 弹出高度：控制字母球飞出的高度。
- 慢速档：控制慢速模式的整体强度。
- 普通档：控制普通模式的整体强度。
- 快速档：控制快速模式的整体强度。
调参会保存到浏览器本地存储中。
项目结构
vocab-ninja/
├── index.html
├── README.md
├── README.en.md
├── assets/
│ ├── ninja-hero.png
│ ├── ninja-slice.png
│ └── ninja-teacher.png
└── screenshots/
├── menu.png
├── game.png
└── tuning.png
技术说明
- 原生 HTML / CSS / JavaScript
- Canvas 绘制游戏画面
- Web Audio API 生成游戏音效
- LocalStorage 保存词库、语言和调参
- PNG 透明素材作为界面角色与装饰
浏览器兼容性
建议使用现代浏览器。移动端浏览器也可运行，但更推荐横屏或较大屏幕体验。
许可证
当前项目未指定开源许可证。如需公开复用或商业分发，请先补充许可证文件。
