From 6b67989007906151b373e5b108d8bba7d25d5c6c Mon Sep 17 00:00:00 2001 From: cocos02 Date: Mon, 8 Jun 2026 14:01:58 +0800 Subject: [PATCH] feat: engine improvements, new scenes, videos, subtitles, hotspot component and docs update --- ROADMAP.md | 64 +++++++++++------- engine/core/Engine.ts | 69 ++++++++++++++++++- engine/types.ts | 22 ++++++- public/images/investigation_scene.jpg | Bin 0 -> 14658 bytes public/scenes/demo.json | 91 +++++++++++++++++++++++++- public/subtitles/investigation.vtt | 4 ++ public/videos/alone_ending.mp4 | Bin 18337 -> 15559 bytes public/videos/continue_ending.mp4 | Bin 17374 -> 15347 bytes public/videos/corridor.mp4 | Bin 0 -> 24510 bytes public/videos/intro.mp4 | Bin 14337 -> 30493 bytes public/videos/left_door.mp4 | Bin 14247 -> 20879 bytes public/videos/qte_fail.mp4 | Bin 12805 -> 15366 bytes public/videos/qte_success.mp4 | Bin 17920 -> 15165 bytes public/videos/right_door.mp4 | Bin 8179 -> 20664 bytes public/videos/stay.mp4 | Bin 14962 -> 19496 bytes public/videos/trust_ending.mp4 | Bin 11876 -> 15913 bytes src/App.vue | 11 +++- src/components/HotspotLayer.vue | 85 ++++++++++++++++++++++++ src/composables/useGameEngine.ts | 25 ++++++- src/stores/gameStore.ts | 18 ++++- 20 files changed, 354 insertions(+), 35 deletions(-) create mode 100644 public/images/investigation_scene.jpg create mode 100644 public/subtitles/investigation.vtt create mode 100644 public/videos/corridor.mp4 create mode 100644 src/components/HotspotLayer.vue diff --git a/ROADMAP.md b/ROADMAP.md index 4280e8e..92230f3 100644 --- a/ROADMAP.md +++ b/ROADMAP.md @@ -179,61 +179,75 @@ interface SaveData { - [x] `vite.config.ts` — 多页面构建(main + editor) - [x] 验证:编辑器能产出合法 JSON,引擎能正确加载并运行 -### P4 图片热点 — 点击图片触发分支(待实现) +### P4 视频/图片热点 — 点击画面区域触发分支 ✅ 已完成 2026-06-08 -目标:场景支持静态图片替代视频,图上定义可点击热区,点击不同位置触发不同分支 +目标:在视频或图片上定义可点击热区(Hotspot),玩家点击画面不同位置触发不同分支。 +热区既可覆盖在静态图片上(调查/解谜场景),也可覆盖在播放中的视频上(根据时间轴淡入淡出)。 + +**视频热点 vs 图片热点(架构统一,差异仅两点):** + +| | 图片热点 | 视频热点 | +|------|----------|----------| +| 底层内容 | `` 元素 | `