feat: add puzzle residence configuration and reflection progress logic

- Introduced `puzzleResidences.ts` to define puzzle residence configurations including properties like display name, position, and puzzle availability.
- Added `reflectionProgress.ts` to manage badge unlocking logic based on place completion, including functions to determine unlocked badges and video sources for scenes.
This commit is contained in:
zhongyidian committed 2026-04-27 11:49:30 +08:00
1 parent e0fa47d21a
commit f5f36f75b5
153 files changed
+3846 -2352

No files matched your search

+27 -7
View File
@@ -9,10 +9,12 @@ import {
SingleChoiceQuizPanel,
LetterToMaozedong,
EndingOverlay,
Narration,
} from '@/components'
import { getBackgroundImage, getPublicPath, getStaticImage } from '@/lib/utils'
import { GuideSteps, GuideStepsItem } from '@/components'
import { BasketQuizPanel, DragQuizPanel, SuccessAlert } from '@/components/layout'
import { usePuzzleAnimation } from '@/contexts/PuzzleAnimationContext'
const starName = 'maozedong'
@@ -20,6 +22,9 @@ const MaozedongInternalization = () => {
const navigate = useNavigate()
const { moduleName } = useParams<{ moduleName: string }>()
// 获取碎片动画触发方法
const { triggerPuzzleAnimation } = usePuzzleAnimation()
// 进页面:先播“引入视频” -> 引入对话(图1) -> 主视频(视频11)
const [showIntroVideo, setShowIntroVideo] = useState(true)
const [introQuizVisible, setIntroQuizVisible] = useState(false)
@@ -39,6 +44,7 @@ const MaozedongInternalization = () => {
// 写信、寄信动画与完成提示
const [showLetter, setShowLetter] = useState(false)
const [showCompleted, setShowCompleted] = useState(false)
const [showTransition, setShowTransition] = useState(false)
const videoRef = useRef<VideoRef>(null)
@@ -105,7 +111,7 @@ const MaozedongInternalization = () => {
},
{
id: 'quiz-3',
time: 60 * 4 + 31,
time: 60 * 4 + 32,
title: '',
prompt: '请将你认为符合新时代践行“群众路线”思想的做法拖入篮子吧!',
correct: ['A', 'C', 'D'],
@@ -138,7 +144,7 @@ const MaozedongInternalization = () => {
},
{
id: 'quiz-4',
time: 60 * 6 + 58,
time: 60 * 6 + 59,
title: '',
prompt: '请将你认为符合新时代践行“独立自主”思想的做法拖入篮子吧!',
correct: ['B', 'C', 'D'],
@@ -174,7 +180,7 @@ const MaozedongInternalization = () => {
},
{
id: 'quiz-5',
time: 60 * 7 + 15,
time: 60 * 7 + 16,
title: '',
prompt: '毛泽东思想活的灵魂包括',
correct: ['实事求是', '群众路线', '独立自主'],
@@ -237,6 +243,7 @@ const MaozedongInternalization = () => {
if (isCorrect) {
setActiveSuccess(q.id)
triggerPuzzleAnimation(16)
setResumeCallback(() => resume)
}
return
@@ -281,6 +288,7 @@ const MaozedongInternalization = () => {
if (isCorrect) {
setActiveSuccess(q.id)
if (q.id === 'quiz-2') triggerPuzzleAnimation(15)
setResumeCallback(() => resume)
}
}
@@ -358,6 +366,7 @@ const MaozedongInternalization = () => {
dragQuizFeedbackTypes,
dragQuizValues,
resumeCallback,
triggerPuzzleAnimation,
])
if (!moduleName) return null
@@ -374,13 +383,24 @@ const MaozedongInternalization = () => {
onClick={() => navigate(`/${moduleName}/${starName}/home`)}
/>
{/* 过渡语 */}
<Narration
visible={showTransition}
onClose={() => {
setShowTransition(false)
setIntroDialogVisible(true)
}}
text="毛泽东思想是一个完整的科学思想体系,它的活的灵魂的三个基本方面——实事求是、群众路线、独立自主,是贯穿于毛泽东思想各个组成部分的立场、观点、方法,这三个方面在新时代被赋予了更加丰富的内涵和实践形式,成为习近平新时代中国特色社会主义思想的方法论基础和行动指南。"
animationSpeed={200}
/>
{/* 引入视频:进入页面自动播放(暂用其他视频代替) */}
{showIntroVideo && (
<Video
src={getPublicPath('video/maozedong/mzd_10.mp4')}
className="h-full w-full z-20"
playsInline
controls
showSkipButton
autoPlay
onEnded={() => {
setShowIntroVideo(false)
@@ -392,7 +412,7 @@ const MaozedongInternalization = () => {
<SingleChoiceQuizPanel
visible={introQuizVisible}
zIndex={10001}
title="【单选】毛泽东思想被确立为中国共产党的指导思想是在哪次会议上( )。"
title="【单选】毛泽东思想被确立为中国共产党的指导思想是在哪次会议上?"
options={[
{ value: 'A', label: 'A.中共一大' },
{ value: 'B', label: 'B.遵义会议' },
@@ -421,7 +441,7 @@ const MaozedongInternalization = () => {
content="1945年,中共七大正式将毛泽东思想确立为党的指导思想并写入党章。"
onContinue={() => {
setIntroQuizSuccessVisible(false)
setIntroDialogVisible(true)
setShowTransition(true)
}}
/>
@@ -491,7 +511,7 @@ const MaozedongInternalization = () => {
animationSpeed={200}
onContinue={() => {
setShowCompleted(false)
navigate(`/${moduleName}/${starName}/home`)
navigate('/menu')
}}
/>
</div>