feat: 添加全局键盘快捷键和更新故居数据,提升用户体验

- 在 main.tsx 中添加全局键盘快捷键功能,允许用户通过 Ctrl+Shift+R 重置所有缓存。
- 更新多个故居的拼图数据,增加黄炎培和鲁迅的相关信息,丰富学习内容。
- 调整 ResidenceLayout 组件以支持新的故居,确保数据一致性。
- 清理不再使用的拼图布局配置文件,提升代码整洁性。
This commit is contained in:
zhongyidian committed 2026-01-28 15:08:28 +08:00
1 parent 8ba36a4a1a
commit a365964f54
155 files changed
+1387 -348

No files matched your search

+21 -12
View File
@@ -14,6 +14,8 @@ import { getBackgroundImage, getStaticImage, getPublicPath } from "@/lib/utils";
import { useNavigate, useParams } from "react-router-dom";
import type { VideoRef } from "@/components/video";
import { useCursorController } from "@/hooks/useCursorController";
import { usePuzzleAnimation } from "@/contexts/PuzzleAnimationContext";
import { useHuangyanpeiStore } from "@/store/huangyanpeiStore";
const starName = "huangyanpei";
@@ -28,8 +30,9 @@ const HuangyanpeiPlace5 = () => {
moduleName: string;
}>();
const { triggerPuzzleAnimation } = usePuzzleAnimation();
const [activeExhibitId, setActiveExhibitId] = useState<1 | 2 | null>(null);
const [visited, setVisited] = useState<Set<number>>(new Set());
const [videoVisible, setVideoVisible] = useState(false);
const videoRef = useRef<VideoRef>(null);
// 光标1的引导对话状态
@@ -43,11 +46,19 @@ const HuangyanpeiPlace5 = () => {
// 成功提示状态
const [showSuccessAlert, setShowSuccessAlert] = useState(false);
// 使用持久化的访问状态
const place = "place5";
const { markExhibitVisited, getVisitedExhibits } = useHuangyanpeiStore();
// 从 store 获取已访问的展品,转换为 Set 用于兼容现有代码
const visitedExhibits = getVisitedExhibits(place);
const visited = new Set(visitedExhibits);
// 光标顺序:1 -> 2(需完成1后解锁2)
const { isEnabled } = useCursorController({
initialEnabled: [1],
dependencies: { 2: [1] },
visited,
visited: visitedExhibits, // 传入数组,而不是 Set
});
const handleOpenExhibit = (index: 1 | 2) => {
@@ -159,13 +170,14 @@ const HuangyanpeiPlace5 = () => {
// : undefined
// }
src={activeExhibitId ? exhibitSrcMap[activeExhibitId] : ""}
onOpen={() => {
if (activeExhibitId === 1) {
triggerPuzzleAnimation(11);
}
}}
onClose={() => {
if (activeExhibitId !== null) {
setVisited((prev) => {
const next = new Set(prev);
next.add(activeExhibitId);
return next;
});
markExhibitVisited(place, activeExhibitId);
}
setActiveExhibitId(null);
}}
@@ -268,11 +280,8 @@ const HuangyanpeiPlace5 = () => {
visible={showSuccessAlert}
onContinue={() => {
setShowSuccessAlert(false);
setVisited((prev) => {
const next = new Set(prev);
next.add(2);
return next;
});
markExhibitVisited(place, 2);
triggerPuzzleAnimation(12);
}}
onClose={() => {
setShowSuccessAlert(false);