feat: fullscreen composable, roadmap update, and future plans doc

This commit is contained in:
2026-06-09 10:47:14 +08:00
parent 4bfdfbc27d
commit 655b9a23d0
4 changed files with 113 additions and 11 deletions

View File

@@ -423,17 +423,15 @@ GainNode 的 ramp 目标值 = `Math.min(bgmVolume, bgmDuckLevel × bgmVolume)`
| Stingers | 短乐句事件音(发现线索的"叮"、惊悚弦乐刺音) |
| BGM 弧线 | 一条 BGM 覆盖多个连续场景而不被切换打断 |
### P7 全屏模式 — 沉浸式浏览器体验(待实现)
### P7 全屏模式 — 沉浸式浏览器体验 ✅ 已完成 2026-06-08
目标:一键进入全屏播放模式,播放中自动隐藏 UI选项/菜单等浮层除外),提供 F11 级别的沉浸感。
**实现清单:**
- [ ] `src/composables/useFullscreen.ts` — Fullscreen API 封装(`element.requestFullscreen()`ESC 退出监听)
- [ ] `src/App.vue` — 全屏按钮(工具栏或浮动按钮);播放中隐藏非关键 UI 元素
- [ ] 指针空闲隐藏:鼠标 3 秒不动自动隐藏光标(`pointer-events: none` 过渡
- [ ] 全屏下选项面板仍可见z-index 高于视频层)
- [ ] 验证F11 等效全屏、ESC 退出、播放中 UI 自动隐藏/鼠标移动恢复
- [x] `src/composables/useFullscreen.ts` — Fullscreen API 封装(`toggle` + `isFullscreen` + `fullscreenchange` 监听)
- [x] `src/App.vue`右上角全屏按钮,与"菜单"按钮并排;`fullscreenchange` 同步图标状态
- [x] `FUTURE.md` — 远期扩展笔记Pointer Lock、自动全屏、UI 自动隐藏、移动端适配等
### P8 章节选择 — 通关后可跳转(待实现)