@cuemath/leap 2.8.62-aa1 → 2.8.62-rj-1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/features/chapters/lpar-chapter/block-section/sheet-item/rewards-n-actions/student-actions/student-actions.js +46 -45
- package/dist/features/chapters/lpar-chapter/block-section/sheet-item/rewards-n-actions/student-actions/student-actions.js.map +1 -1
- package/dist/features/chapters/lpar-chapter/block-section/sheet-item/rewards-n-actions/teacher-actions/teacher-actions.js +26 -25
- package/dist/features/chapters/lpar-chapter/block-section/sheet-item/rewards-n-actions/teacher-actions/teacher-actions.js.map +1 -1
- package/dist/features/circle-games/game-launcher/comps/carousel/carousel.js +51 -49
- package/dist/features/circle-games/game-launcher/comps/carousel/carousel.js.map +1 -1
- package/dist/features/circle-games/game-launcher/game-launcher.js +87 -90
- package/dist/features/circle-games/game-launcher/game-launcher.js.map +1 -1
- package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.js +83 -82
- package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.js.map +1 -1
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.js +117 -116
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.js.map +1 -1
- package/dist/features/circle-games/games/web-view/web-view-types.js.map +1 -1
- package/dist/features/circle-games/games/web-view/web-view.js +53 -47
- package/dist/features/circle-games/games/web-view/web-view.js.map +1 -1
- package/dist/features/cue-canvas/cue-canvas-provider.js +8 -9
- package/dist/features/cue-canvas/cue-canvas-provider.js.map +1 -1
- package/dist/features/journey/hooks/use-get-eligible-journeys-via-route.js +7 -4
- package/dist/features/journey/hooks/use-get-eligible-journeys-via-route.js.map +1 -1
- package/dist/features/journey/use-journey/journey-context-provider.js +73 -69
- package/dist/features/journey/use-journey/journey-context-provider.js.map +1 -1
- package/dist/features/sheets/lessons-list/lesson-item/lesson-item-cta-info.js +60 -59
- package/dist/features/sheets/lessons-list/lesson-item/lesson-item-cta-info.js.map +1 -1
- package/dist/features/sheets/resources-list/resource-item/resource-item.js +90 -89
- package/dist/features/sheets/resources-list/resource-item/resource-item.js.map +1 -1
- package/dist/features/sheets/sheets-list/sheet-item/reward-n-actions/student-actions/student-actions.js +61 -60
- package/dist/features/sheets/sheets-list/sheet-item/reward-n-actions/student-actions/student-actions.js.map +1 -1
- package/dist/features/sheets/sheets-list/sheet-item/reward-n-actions/teacher-actions/teacher-actions.js +64 -63
- package/dist/features/sheets/sheets-list/sheet-item/reward-n-actions/teacher-actions/teacher-actions.js.map +1 -1
- package/dist/features/sheets/utils/is-v3-worksheet.js +14 -4
- package/dist/features/sheets/utils/is-v3-worksheet.js.map +1 -1
- package/dist/features/ui/section-list/section-list.js +12 -12
- package/dist/features/ui/section-list/section-list.js.map +1 -1
- package/dist/index.d.ts +14 -13
- package/dist/index.js +75 -74
- package/package.json +2 -4
- package/dist/library/polypad.js +0 -24965
- package/dist/library/polypad.js.map +0 -1
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"use-game-launcher-journey.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.tsx"],"sourcesContent":["import type { ICoachmarkProps } from '../../../../journey/use-journey/journey-context-types';\nimport type { IArrowTooltipProps } from '../../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { INudgeProps } from '../../../../ui/nudge/nudge-types';\nimport type { TColorNames } from '../../../../ui/types';\nimport type { ISegmentedGameCardRefs } from '../../comps/segmented-game-card/segmented-game-card-types';\nimport type {\n IProject,\n Puzzle,\n} from '../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport type { IUseGameLauncherJourneyProps } from './use-game-launcher-journey-types';\n\nimport { useCallback, useEffect, useMemo, useRef } from 'react';\n\nimport CaratRightIcon from '../../../../../assets/line-icons/icons/carat-right';\nimport { PLATFORM_EVENTS_STUDENT as AnalyticsLabel } from '../../../../analytics-events/platform-events-student';\nimport { JOURNEY_ID_STUDENT } from '../../../../journey/journey-id/journey-id-student';\nimport { IndicatorType } from '../../../../journey/use-journey/constants';\nimport { useJourney } from '../../../../journey/use-journey/use-journey';\nimport IconButton from '../../../../ui/buttons/icon-button/icon-button';\nimport { useUIContext } from '../../../../ui/context/context';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport Text from '../../../../ui/text/text';\nimport { CIRCLE_ONBOARDING_ANALYTICS_STEPS as ActionEvent } from '../../../enum/circle-onboarding-steps';\nimport { ProjectType } from '../../../games/web-view/enums';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport { SegmentedGameCard } from '../../comps/segmented-game-card/segmented-game-card';\nimport { GAME_LAUNCHER_ANALYTICS_EVENTS } from '../../game-launcher-analytics-events';\nimport {\n GO_TO_NEXT_SLIDE_AFTER_MS,\n SHOW_LABEL_HIGHLIGHT_AFTER_MS,\n SHOW_NUDGE_AFTER_MS,\n SLIDE_TO_LESSON_MS,\n} from './constants';\n\nexport const useGameLauncherJourney = ({\n carouselRefs,\n onSegmentClick,\n onJourneyComplete,\n}: IUseGameLauncherJourneyProps) => {\n const journeyId = JOURNEY_ID_STUDENT.CIRCLE_ACTIVITIES_INTRO_JOURNEY;\n\n const gameRefs = useRef<ISegmentedGameCardRefs>(null);\n const puzzleRefs = useRef<ISegmentedGameCardRefs>(null);\n const lessonRefs = useRef<ISegmentedGameCardRefs>(null);\n const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n const { playButtonSound } = useCircleSounds();\n const { nextCoachmark, setJourney, endJourney } = useJourney();\n const { onEvent: trackAnalytics } = useUIContext();\n\n const trackEventViewed = useCallback(\n (step: ActionEvent) => {\n trackAnalytics(AnalyticsLabel.ONBOARDING_STEP_VIEWED, {\n step,\n });\n },\n [trackAnalytics],\n );\n const trackEventCompleted = useCallback(\n (step: ActionEvent) => {\n trackAnalytics(AnalyticsLabel.ONBOARDING_STEP_COMPLETED, {\n step,\n });\n },\n [trackAnalytics],\n );\n\n const goToNextCard = useCallback(\n (\n analyticsLabelViewed: ActionEvent,\n refOfNextSlide: ISegmentedGameCardRefs,\n color: TColorNames,\n isFirstSlide: boolean = false,\n ) => {\n if (!isFirstSlide) {\n playButtonSound();\n carouselRefs.current?.goToIndex(carouselRefs.current?.currentIndex + 1);\n nextCoachmark(journeyId, false, GO_TO_NEXT_SLIDE_AFTER_MS);\n }\n\n trackEventViewed(analyticsLabelViewed);\n\n const animateLabelTimer = setTimeout(() => {\n clearTimeout(animateLabelTimer);\n refOfNextSlide.startLabelAnimation(color);\n }, SHOW_LABEL_HIGHLIGHT_AFTER_MS);\n\n timerRefs.current.push(animateLabelTimer); // Store to cleanup later\n\n nextCoachmark(journeyId, true, SHOW_NUDGE_AFTER_MS);\n },\n [carouselRefs, journeyId, nextCoachmark, playButtonSound, trackEventViewed],\n );\n\n const handleEndJourney = useCallback(\n (puzzlesData: Puzzle) => {\n onSegmentClick(puzzlesData, ProjectType.PUZZLE);\n trackEventCompleted(ActionEvent.PUZZLE_ACTIVITY);\n endJourney(journeyId);\n onJourneyComplete(journeyId);\n },\n [endJourney, journeyId, onJourneyComplete, onSegmentClick, trackEventCompleted],\n );\n\n const startJourney = useCallback(\n (puzzlesData: IProject<Puzzle>, isLessonAvailable: boolean) => {\n // If element refs are not available return, this is just for type safety\n if (\n !carouselRefs?.current?.nextBtnRef.current ||\n !puzzleRefs?.current?.segmentedCardWrapperRef.current ||\n !gameRefs?.current?.labelRef.current ||\n !puzzleRefs?.current?.labelRef.current ||\n !puzzlesData\n ) {\n return;\n }\n\n const lessonLabelDims = lessonRefs.current?.labelRef?.current?.getBoundingClientRect() || {\n height: 0,\n width: 0,\n };\n const gameLabelDims = gameRefs.current?.labelRef?.current?.getBoundingClientRect() || {\n height: 0,\n width: 0,\n };\n const puzzleLabelDims = puzzleRefs.current?.labelRef?.current?.getBoundingClientRect() || {\n height: 0,\n width: 0,\n };\n\n const launcherDims =\n puzzleRefs.current?.segmentedCardWrapperRef?.current?.getBoundingClientRect() || {\n height: 0,\n width: 0,\n };\n\n let lessonSteps: ICoachmarkProps[] = [];\n\n if (isLessonAvailable && lessonRefs.current) {\n lessonSteps = [\n {\n originalElementToHighlightRef: lessonRefs.current.labelRef,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <></>,\n indicator: {\n position: 'right',\n backgroundColor: 'BLUE_4',\n width: 264,\n tooltipItem: (\n <FlexView>\n <Text $renderAs=\"ab2-bold\">\n Get faster & stay ahead in school. Practice 3 new skills everyday.\n </Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: lessonLabelDims.width + 50,\n tooltipYCoOrdinates: lessonLabelDims.height / 2,\n } as IArrowTooltipProps,\n },\n {\n originalElementToHighlightRef: carouselRefs.current?.nextBtnRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n elementToHighlight: (\n <IconButton\n renderAs=\"secondary\"\n Icon={CaratRightIcon}\n onClick={() =>\n goToNextCard(\n ActionEvent.GAMES_ACTIVITY,\n gameRefs.current as ISegmentedGameCardRefs,\n 'ORANGE_4',\n )\n }\n analyticsLabel={GAME_LAUNCHER_ANALYTICS_EVENTS.JOURNEY_NEXT_ACTIVITY}\n />\n ),\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n Click to proceed\n </Text>\n ),\n nudgePointerX: 0,\n nudgePointerY: 0,\n } as INudgeProps,\n },\n ];\n }\n\n const gameSteps: ICoachmarkProps[] = [\n {\n originalElementToHighlightRef: gameRefs.current.labelRef,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <></>,\n indicator: {\n position: 'right',\n backgroundColor: 'ORANGE_4',\n width: 264,\n tooltipItem: (\n <FlexView>\n <Text $renderAs=\"ab2-bold\">\n Train to think deeper & plan ahead. Play 3 new games everyday.\n </Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: gameLabelDims.width + 50,\n tooltipYCoOrdinates: gameLabelDims.height / 2,\n } as IArrowTooltipProps,\n },\n {\n originalElementToHighlightRef: carouselRefs.current.nextBtnRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n elementToHighlight: (\n <IconButton\n renderAs=\"secondary\"\n Icon={CaratRightIcon}\n onClick={() =>\n goToNextCard(\n ActionEvent.PUZZLE_ACTIVITY,\n puzzleRefs.current as ISegmentedGameCardRefs,\n 'PURPLE_4',\n )\n }\n analyticsLabel={GAME_LAUNCHER_ANALYTICS_EVENTS.JOURNEY_NEXT_ACTIVITY}\n />\n ),\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n Click to proceed\n </Text>\n ),\n nudgePointerX: 0,\n nudgePointerY: 0,\n } as INudgeProps,\n },\n ];\n\n const puzzleSteps: ICoachmarkProps[] = [\n {\n originalElementToHighlightRef: puzzleRefs.current.labelRef,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <></>,\n indicator: {\n position: 'right',\n backgroundColor: 'PURPLE_4',\n width: 264,\n tooltipItem: (\n <FlexView>\n <Text $renderAs=\"ab2-bold\">\n Think in new ways & stay sharp. Solve 3 new puzzles everyday.\n </Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: puzzleLabelDims.width + 50,\n tooltipYCoOrdinates: puzzleLabelDims.height / 2,\n } as IArrowTooltipProps,\n },\n {\n originalElementToHighlightRef: puzzleRefs.current.segmentedCardWrapperRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n elementToHighlight: (\n <SegmentedGameCard\n label={''} // This is intentionally left blank to avoid showing the label\n value={puzzlesData.data.filter(puzzle => puzzle.solved).length}\n maxValue={puzzlesData.data.length}\n initialValue={puzzlesData.initialProgressValue}\n data={puzzlesData.data.map(puzzle => ({\n card: puzzle.cardLottie,\n name: '', // We dont want to show the name of the puzzle in onboarding\n isCompleted: puzzle.solved,\n onPress: () => handleEndJourney(puzzle),\n }))}\n />\n ),\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n Click to solve a puzzle\n </Text>\n ),\n nudgePointerX: launcherDims.width * 0.6,\n nudgePointerY: launcherDims.height * 0.4,\n } as INudgeProps,\n },\n ];\n\n setJourney(journeyId, [...lessonSteps, ...gameSteps, ...puzzleSteps]);\n\n carouselRefs.current?.goToIndex(0); // Always start from 0th Index no matter what the current index is\n\n const delayBeforeStart = setTimeout(() => {\n clearTimeout(delayBeforeStart);\n nextCoachmark(journeyId);\n }, SLIDE_TO_LESSON_MS);\n\n timerRefs.current.push(delayBeforeStart); // Store to cleanup later\n\n if (isLessonAvailable && lessonRefs.current) {\n goToNextCard(ActionEvent.SKILL_ACTIVITY, lessonRefs.current, 'BLUE_4', true);\n } else {\n goToNextCard(ActionEvent.GAMES_ACTIVITY, gameRefs.current, 'ORANGE_4', true);\n }\n },\n [carouselRefs, setJourney, journeyId, goToNextCard, handleEndJourney, nextCoachmark],\n );\n\n const data = useMemo(\n () => ({\n gameRefs,\n puzzleRefs,\n lessonRefs,\n startJourney,\n }),\n [startJourney],\n );\n\n // Cleanup on unmount\n useEffect(() => {\n return () => {\n timerRefs.current.forEach(timer => clearTimeout(timer));\n timerRefs.current = [];\n };\n }, [carouselRefs]);\n\n return data;\n};\n"],"names":["useGameLauncherJourney","carouselRefs","onSegmentClick","onJourneyComplete","journeyId","JOURNEY_ID_STUDENT","gameRefs","useRef","puzzleRefs","lessonRefs","timerRefs","playButtonSound","useCircleSounds","nextCoachmark","setJourney","endJourney","useJourney","trackAnalytics","useUIContext","trackEventViewed","useCallback","step","AnalyticsLabel","trackEventCompleted","goToNextCard","analyticsLabelViewed","refOfNextSlide","color","isFirstSlide","_b","_a","GO_TO_NEXT_SLIDE_AFTER_MS","animateLabelTimer","SHOW_LABEL_HIGHLIGHT_AFTER_MS","SHOW_NUDGE_AFTER_MS","handleEndJourney","puzzlesData","ProjectType","ActionEvent","startJourney","isLessonAvailable","_c","_d","lessonLabelDims","_g","_f","_e","gameLabelDims","_j","_i","_h","puzzleLabelDims","_m","_l","_k","launcherDims","_p","_o","_n","lessonSteps","IndicatorType","jsx","Fragment","FlexView","Text","_q","IconButton","CaratRightIcon","GAME_LAUNCHER_ANALYTICS_EVENTS","gameSteps","puzzleSteps","SegmentedGameCard","puzzle","_r","delayBeforeStart","SLIDE_TO_LESSON_MS","data","useMemo","useEffect","timer"],"mappings":"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"}
|
1
|
+
{"version":3,"file":"use-game-launcher-journey.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.tsx"],"sourcesContent":["import type { TJourneyId } from '../../../../journey/journey-id/journey-id-types';\nimport type { ICoachmarkProps } from '../../../../journey/use-journey/journey-context-types';\nimport type { IArrowTooltipProps } from '../../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { INudgeProps } from '../../../../ui/nudge/nudge-types';\nimport type { TColorNames } from '../../../../ui/types';\nimport type { ISegmentedGameCardRefs } from '../../comps/segmented-game-card/segmented-game-card-types';\nimport type {\n IProject,\n Puzzle,\n} from '../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport type { IUseGameLauncherJourneyProps } from './use-game-launcher-journey-types';\n\nimport { useCallback, useEffect, useMemo, useRef } from 'react';\n\nimport CaratRightIcon from '../../../../../assets/line-icons/icons/carat-right';\nimport { PLATFORM_EVENTS_STUDENT as AnalyticsLabel } from '../../../../analytics-events/platform-events-student';\nimport { IndicatorType } from '../../../../journey/use-journey/constants';\nimport { useJourney } from '../../../../journey/use-journey/use-journey';\nimport IconButton from '../../../../ui/buttons/icon-button/icon-button';\nimport { useUIContext } from '../../../../ui/context/context';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport Text from '../../../../ui/text/text';\nimport { CIRCLE_ONBOARDING_ANALYTICS_STEPS as ActionEvent } from '../../../enum/circle-onboarding-steps';\nimport { ProjectType } from '../../../games/web-view/enums';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport { SegmentedGameCard } from '../../comps/segmented-game-card/segmented-game-card';\nimport { GAME_LAUNCHER_ANALYTICS_EVENTS } from '../../game-launcher-analytics-events';\nimport {\n GO_TO_NEXT_SLIDE_AFTER_MS,\n SHOW_LABEL_HIGHLIGHT_AFTER_MS,\n SHOW_NUDGE_AFTER_MS,\n SLIDE_TO_LESSON_MS,\n} from './constants';\n\nexport const useGameLauncherJourney = ({\n carouselRefs,\n onSegmentClick,\n}: IUseGameLauncherJourneyProps) => {\n const gameRefs = useRef<ISegmentedGameCardRefs>(null);\n const puzzleRefs = useRef<ISegmentedGameCardRefs>(null);\n const lessonRefs = useRef<ISegmentedGameCardRefs>(null);\n const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n const isJourneyInProgress = useRef(false);\n\n const { playButtonSound } = useCircleSounds();\n const { nextCoachmark, setJourney, endJourney } = useJourney();\n const { onEvent: trackAnalytics } = useUIContext();\n\n const trackEventViewed = useCallback(\n (step: ActionEvent) => {\n trackAnalytics(AnalyticsLabel.ONBOARDING_STEP_VIEWED, {\n step,\n });\n },\n [trackAnalytics],\n );\n const trackEventCompleted = useCallback(\n (step: ActionEvent) => {\n trackAnalytics(AnalyticsLabel.ONBOARDING_STEP_COMPLETED, {\n step,\n });\n },\n [trackAnalytics],\n );\n\n const goToNextCard = useCallback(\n (\n analyticsLabelViewed: ActionEvent,\n refOfNextSlide: ISegmentedGameCardRefs,\n color: TColorNames,\n journeyId: TJourneyId,\n isFirstSlide: boolean = false,\n ) => {\n if (!isFirstSlide) {\n playButtonSound();\n carouselRefs.current?.goToIndex(carouselRefs.current?.currentIndex + 1);\n nextCoachmark(journeyId, false, GO_TO_NEXT_SLIDE_AFTER_MS);\n }\n\n trackEventViewed(analyticsLabelViewed);\n\n const animateLabelTimer = setTimeout(() => {\n clearTimeout(animateLabelTimer);\n refOfNextSlide.startLabelAnimation(color);\n }, SHOW_LABEL_HIGHLIGHT_AFTER_MS);\n\n timerRefs.current.push(animateLabelTimer); // Store to cleanup later\n\n nextCoachmark(journeyId, true, SHOW_NUDGE_AFTER_MS);\n },\n [carouselRefs, nextCoachmark, playButtonSound, trackEventViewed],\n );\n\n const handleEndJourney = useCallback(\n (puzzlesData: Puzzle, journeyId: TJourneyId) => {\n onSegmentClick(puzzlesData, ProjectType.PUZZLE);\n trackEventCompleted(ActionEvent.PUZZLE_ACTIVITY);\n endJourney(journeyId);\n },\n [endJourney, onSegmentClick, trackEventCompleted],\n );\n\n const startJourney = useCallback(\n (puzzlesData: IProject<Puzzle>, isLessonAvailable: boolean, journeyId: TJourneyId) => {\n if (isJourneyInProgress.current) {\n return;\n }\n\n // If element refs are not available return, this is just for type safety\n if (\n !carouselRefs?.current?.nextBtnRef.current ||\n !puzzleRefs?.current?.segmentedCardWrapperRef.current ||\n !gameRefs?.current?.labelRef.current ||\n !puzzleRefs?.current?.labelRef.current ||\n !puzzlesData\n ) {\n return;\n }\n\n isJourneyInProgress.current = true;\n const lessonLabelDims = lessonRefs.current?.labelRef?.current?.getBoundingClientRect() || {\n height: 0,\n width: 0,\n };\n const gameLabelDims = gameRefs.current?.labelRef?.current?.getBoundingClientRect() || {\n height: 0,\n width: 0,\n };\n const puzzleLabelDims = puzzleRefs.current?.labelRef?.current?.getBoundingClientRect() || {\n height: 0,\n width: 0,\n };\n\n const launcherDims =\n puzzleRefs.current?.segmentedCardWrapperRef?.current?.getBoundingClientRect() || {\n height: 0,\n width: 0,\n };\n\n let lessonSteps: ICoachmarkProps[] = [];\n\n if (isLessonAvailable && lessonRefs.current) {\n lessonSteps = [\n {\n originalElementToHighlightRef: lessonRefs.current.labelRef,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <></>,\n indicator: {\n position: 'right',\n backgroundColor: 'BLUE_4',\n width: 264,\n tooltipItem: (\n <FlexView>\n <Text $renderAs=\"ab2-bold\">\n Get faster & stay ahead in school. Practice 3 new skills everyday.\n </Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: lessonLabelDims.width + 50,\n tooltipYCoOrdinates: lessonLabelDims.height / 2,\n } as IArrowTooltipProps,\n },\n {\n originalElementToHighlightRef: carouselRefs.current?.nextBtnRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n elementToHighlight: (\n <IconButton\n renderAs=\"secondary\"\n Icon={CaratRightIcon}\n onClick={() =>\n goToNextCard(\n ActionEvent.GAMES_ACTIVITY,\n gameRefs.current as ISegmentedGameCardRefs,\n 'ORANGE_4',\n journeyId,\n )\n }\n analyticsLabel={GAME_LAUNCHER_ANALYTICS_EVENTS.JOURNEY_NEXT_ACTIVITY}\n />\n ),\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n Click to proceed\n </Text>\n ),\n nudgePointerX: 0,\n nudgePointerY: 0,\n } as INudgeProps,\n },\n ];\n }\n\n const gameSteps: ICoachmarkProps[] = [\n {\n originalElementToHighlightRef: gameRefs.current.labelRef,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <></>,\n indicator: {\n position: 'right',\n backgroundColor: 'ORANGE_4',\n width: 264,\n tooltipItem: (\n <FlexView>\n <Text $renderAs=\"ab2-bold\">\n Train to think deeper & plan ahead. Play 3 new games everyday.\n </Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: gameLabelDims.width + 50,\n tooltipYCoOrdinates: gameLabelDims.height / 2,\n } as IArrowTooltipProps,\n },\n {\n originalElementToHighlightRef: carouselRefs.current.nextBtnRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n elementToHighlight: (\n <IconButton\n renderAs=\"secondary\"\n Icon={CaratRightIcon}\n onClick={() =>\n goToNextCard(\n ActionEvent.PUZZLE_ACTIVITY,\n puzzleRefs.current as ISegmentedGameCardRefs,\n 'PURPLE_4',\n journeyId,\n )\n }\n analyticsLabel={GAME_LAUNCHER_ANALYTICS_EVENTS.JOURNEY_NEXT_ACTIVITY}\n />\n ),\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n Click to proceed\n </Text>\n ),\n nudgePointerX: 0,\n nudgePointerY: 0,\n } as INudgeProps,\n },\n ];\n\n const puzzleSteps: ICoachmarkProps[] = [\n {\n originalElementToHighlightRef: puzzleRefs.current.labelRef,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <></>,\n indicator: {\n position: 'right',\n backgroundColor: 'PURPLE_4',\n width: 264,\n tooltipItem: (\n <FlexView>\n <Text $renderAs=\"ab2-bold\">\n Think in new ways & stay sharp. Solve 3 new puzzles everyday.\n </Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: puzzleLabelDims.width + 50,\n tooltipYCoOrdinates: puzzleLabelDims.height / 2,\n } as IArrowTooltipProps,\n },\n {\n originalElementToHighlightRef: puzzleRefs.current.segmentedCardWrapperRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n elementToHighlight: (\n <SegmentedGameCard\n label={''} // This is intentionally left blank to avoid showing the label\n value={puzzlesData.data.filter(puzzle => puzzle.solved).length}\n maxValue={puzzlesData.data.length}\n initialValue={puzzlesData.initialProgressValue}\n data={puzzlesData.data.map(puzzle => ({\n card: puzzle.cardLottie,\n name: '', // We dont want to show the name of the puzzle in onboarding\n isCompleted: puzzle.solved,\n onPress: () => handleEndJourney(puzzle, journeyId),\n }))}\n />\n ),\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n Click to solve a puzzle\n </Text>\n ),\n nudgePointerX: launcherDims.width * 0.6,\n nudgePointerY: launcherDims.height * 0.4,\n } as INudgeProps,\n },\n ];\n\n setJourney(journeyId, [...lessonSteps, ...gameSteps, ...puzzleSteps]);\n\n carouselRefs.current?.goToIndex(0); // Always start from 0th Index no matter what the current index is\n\n const delayBeforeStart = setTimeout(() => {\n clearTimeout(delayBeforeStart);\n nextCoachmark(journeyId);\n }, SLIDE_TO_LESSON_MS);\n\n timerRefs.current.push(delayBeforeStart); // Store to cleanup later\n\n if (isLessonAvailable && lessonRefs.current) {\n goToNextCard(ActionEvent.SKILL_ACTIVITY, lessonRefs.current, 'BLUE_4', journeyId, true);\n } else {\n goToNextCard(ActionEvent.GAMES_ACTIVITY, gameRefs.current, 'ORANGE_4', journeyId, true);\n }\n },\n [carouselRefs, handleEndJourney, goToNextCard, nextCoachmark, setJourney],\n );\n\n const data = useMemo(\n () => ({\n gameRefs,\n puzzleRefs,\n lessonRefs,\n startJourney,\n }),\n [startJourney],\n );\n\n // Cleanup on unmount\n useEffect(() => {\n return () => {\n timerRefs.current.forEach(timer => clearTimeout(timer));\n timerRefs.current = [];\n isJourneyInProgress.current = false;\n };\n }, [carouselRefs]);\n\n return data;\n};\n"],"names":["useGameLauncherJourney","carouselRefs","onSegmentClick","gameRefs","useRef","puzzleRefs","lessonRefs","timerRefs","isJourneyInProgress","playButtonSound","useCircleSounds","nextCoachmark","setJourney","endJourney","useJourney","trackAnalytics","useUIContext","trackEventViewed","useCallback","step","AnalyticsLabel","trackEventCompleted","goToNextCard","analyticsLabelViewed","refOfNextSlide","color","journeyId","isFirstSlide","_b","_a","GO_TO_NEXT_SLIDE_AFTER_MS","animateLabelTimer","SHOW_LABEL_HIGHLIGHT_AFTER_MS","SHOW_NUDGE_AFTER_MS","handleEndJourney","puzzlesData","ProjectType","ActionEvent","startJourney","isLessonAvailable","_c","_d","lessonLabelDims","_g","_f","_e","gameLabelDims","_j","_i","_h","puzzleLabelDims","_m","_l","_k","launcherDims","_p","_o","_n","lessonSteps","IndicatorType","jsx","Fragment","FlexView","Text","_q","IconButton","CaratRightIcon","GAME_LAUNCHER_ANALYTICS_EVENTS","gameSteps","puzzleSteps","SegmentedGameCard","puzzle","_r","delayBeforeStart","SLIDE_TO_LESSON_MS","data","useMemo","useEffect","timer"],"mappings":"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"}
|
@@ -1,120 +1,121 @@
|
|
1
|
-
import { jsx as r, Fragment as
|
2
|
-
import { useRef as
|
3
|
-
import
|
4
|
-
import { PLATFORM_EVENTS_STUDENT as
|
5
|
-
import { JOURNEY_ID_STUDENT as
|
6
|
-
import { IndicatorType as
|
7
|
-
import { useJourney as
|
8
|
-
import
|
9
|
-
import { useUIContext as
|
10
|
-
import
|
1
|
+
import { jsx as r, Fragment as R } from "react/jsx-runtime";
|
2
|
+
import { useRef as A, useCallback as C, useEffect as $ } from "react";
|
3
|
+
import x from "../../../../../assets/line-icons/icons/carat-right.js";
|
4
|
+
import { PLATFORM_EVENTS_STUDENT as W } from "../../../../analytics-events/platform-events-student.js";
|
5
|
+
import { JOURNEY_ID_STUDENT as J } from "../../../../journey/journey-id/journey-id-student.js";
|
6
|
+
import { IndicatorType as s } from "../../../../journey/use-journey/constants.js";
|
7
|
+
import { useJourney as w } from "../../../../journey/use-journey/use-journey.js";
|
8
|
+
import F from "../../../../ui/buttons/icon-button/icon-button.js";
|
9
|
+
import { useUIContext as V } from "../../../../ui/context/context.js";
|
10
|
+
import N from "../../../../ui/layout/flex-view.js";
|
11
11
|
import m from "../../../../ui/text/text.js";
|
12
|
-
import { CIRCLE_ONBOARDING_ANALYTICS_STEPS as
|
13
|
-
import { useCircleSounds as
|
14
|
-
import { TablesCard as
|
15
|
-
import { GAME_LAUNCHER_ANALYTICS_EVENTS as
|
16
|
-
import { SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS as
|
17
|
-
import { Indicator as
|
18
|
-
const
|
19
|
-
carouselRefs:
|
20
|
-
onTableSegmentClick:
|
21
|
-
onJourneyComplete: S
|
12
|
+
import { CIRCLE_ONBOARDING_ANALYTICS_STEPS as Y } from "../../../enum/circle-onboarding-steps.js";
|
13
|
+
import { useCircleSounds as X } from "../../../hooks/use-circle-sounds/use-circle-sounds.js";
|
14
|
+
import { TablesCard as k } from "../../comps/tables-card/tables-card.js";
|
15
|
+
import { GAME_LAUNCHER_ANALYTICS_EVENTS as K } from "../../game-launcher-analytics-events.js";
|
16
|
+
import { SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS as j, SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS as Z, START_ANIMATING_CLONED_ELEM as B, TABLE_CARD_INDEX as U, GO_TO_TABLE_LAUNCHER_DURATION_MS as q, SHOW_CLICK_TABLE_NUDGE_AFTER_MS as z, PUZZLE_CARD_INDEX as Q, SHOW_INITIAL_COACHMARK_AFTER_MS as G, LESSON_CARD_INDEX as ee, SHOW_INITIAL_TOOLTIP_AFTER_MS as te } from "./constants.js";
|
17
|
+
import { Indicator as re } from "./use-table-launcher-journey-styled.js";
|
18
|
+
const Ae = ({
|
19
|
+
carouselRefs: c,
|
20
|
+
onTableSegmentClick: S
|
22
21
|
}) => {
|
23
|
-
const
|
24
|
-
(
|
25
|
-
var
|
26
|
-
|
27
|
-
step:
|
28
|
-
}), (
|
22
|
+
const t = J.CIRCLE_TABLES_INTRO_JOURNEY, e = A(null), p = A(null), L = A(!1), T = A([]), { playButtonSound: P } = X(), { nextCoachmark: i, setJourney: I, addCoachmark: d, endJourney: y } = w(), { onEvent: _ } = V(), b = C(
|
23
|
+
(o) => {
|
24
|
+
var l, n;
|
25
|
+
o && S(o), _(W.ONBOARDING_STEP_COMPLETED, {
|
26
|
+
step: Y.TABLES
|
27
|
+
}), (l = e == null ? void 0 : e.current) == null || l.setLabelVisiblity(!0), (n = e == null ? void 0 : e.current) == null || n.stopLabelAnimation(), y(t);
|
29
28
|
},
|
30
|
-
[
|
31
|
-
),
|
32
|
-
(
|
29
|
+
[y, t, S, _]
|
30
|
+
), H = C(
|
31
|
+
(o, l) => {
|
33
32
|
var g, E, h;
|
34
|
-
if (!((g =
|
33
|
+
if (!((g = e.current) != null && g.segmentedCardWrapperRef.current) || !((E = e.current) != null && E.labelRef.current))
|
35
34
|
return;
|
36
|
-
const
|
37
|
-
|
38
|
-
originalElementToHighlightRef:
|
35
|
+
const n = e.current.labelRef.current.getBoundingClientRect(), u = (h = e.current) == null ? void 0 : h.segmentedCardWrapperRef.current.getBoundingClientRect();
|
36
|
+
d(t, {
|
37
|
+
originalElementToHighlightRef: e.current.segmentedCardWrapperRef,
|
39
38
|
isActive: !1,
|
40
|
-
type:
|
39
|
+
type: s.TOOLTIP,
|
41
40
|
elementToHighlight: /* @__PURE__ */ r(
|
42
|
-
|
41
|
+
k,
|
43
42
|
{
|
44
43
|
ref: p,
|
45
|
-
defaultTable:
|
46
|
-
label:
|
47
|
-
data:
|
48
|
-
onPress:
|
49
|
-
onGoBackFromTableLevel:
|
44
|
+
defaultTable: l,
|
45
|
+
label: o.label,
|
46
|
+
data: o.data,
|
47
|
+
onPress: b,
|
48
|
+
onGoBackFromTableLevel: b
|
50
49
|
}
|
51
50
|
),
|
52
51
|
indicator: {
|
53
52
|
position: "left",
|
54
53
|
backgroundColor: "YELLOW_4",
|
55
54
|
width: 236,
|
56
|
-
tooltipItem: /* @__PURE__ */ r(
|
55
|
+
tooltipItem: /* @__PURE__ */ r(N, { children: /* @__PURE__ */ r(m, { $renderAs: "ab2-bold", children: "Each table has 3 levels—clear them and earn 3 stars!" }) }),
|
57
56
|
tooltipXCoOrdinates: 0,
|
58
|
-
tooltipYCoOrdinates:
|
57
|
+
tooltipYCoOrdinates: n.height * 0.35
|
59
58
|
}
|
60
|
-
}),
|
61
|
-
originalElementToHighlightRef:
|
59
|
+
}), d(t, {
|
60
|
+
originalElementToHighlightRef: e.current.segmentedCardWrapperRef,
|
62
61
|
isActive: !1,
|
63
|
-
type:
|
62
|
+
type: s.NUDGE,
|
64
63
|
indicator: {
|
65
64
|
nudge: "click",
|
66
65
|
content: /* @__PURE__ */ r(m, { $renderAs: "ab1", $color: "WHITE", children: "Pick a level" }),
|
67
|
-
nudgePointerX:
|
68
|
-
nudgePointerY:
|
66
|
+
nudgePointerX: u.width / 2 + 50,
|
67
|
+
nudgePointerY: u.height * 0.4
|
69
68
|
},
|
70
|
-
elementToHighlight: /* @__PURE__ */ r(
|
71
|
-
}),
|
72
|
-
const
|
73
|
-
var
|
74
|
-
clearTimeout(
|
75
|
-
},
|
76
|
-
T.current.push(
|
69
|
+
elementToHighlight: /* @__PURE__ */ r(R, {})
|
70
|
+
}), i(t, !1, j), i(t, !0, Z);
|
71
|
+
const a = setTimeout(() => {
|
72
|
+
var f;
|
73
|
+
clearTimeout(a), (f = p.current) == null || f.startLabelAnimation("YELLOW_4");
|
74
|
+
}, B);
|
75
|
+
T.current.push(a);
|
77
76
|
},
|
78
|
-
[
|
79
|
-
),
|
80
|
-
|
81
|
-
|
82
|
-
step: v.TABLES
|
77
|
+
[d, b, t, i]
|
78
|
+
), O = C(() => {
|
79
|
+
P(), c.current.goToIndex(U), i(t, !1, q), _(W.ONBOARDING_STEP_VIEWED, {
|
80
|
+
step: Y.TABLES
|
83
81
|
});
|
84
|
-
const
|
85
|
-
var
|
86
|
-
clearTimeout(
|
87
|
-
},
|
88
|
-
T.current.push(
|
89
|
-
const
|
90
|
-
var
|
91
|
-
clearTimeout(
|
92
|
-
},
|
93
|
-
T.current.push(
|
94
|
-
}, [
|
95
|
-
(
|
96
|
-
var h,
|
97
|
-
|
98
|
-
if (!((D = t.current) != null && D.segmentedCardWrapperRef.current) || !((W = t.current) != null && W.labelRef.current) || !o || !(i != null && i.current) || !s || !s.current)
|
82
|
+
const o = setTimeout(() => {
|
83
|
+
var n;
|
84
|
+
clearTimeout(o), (n = e.current) == null || n.setLabelVisiblity(!1), i(t, !0);
|
85
|
+
}, z);
|
86
|
+
T.current.push(o);
|
87
|
+
const l = setTimeout(() => {
|
88
|
+
var n;
|
89
|
+
clearTimeout(l), (n = p.current) == null || n.startLabelAnimation("YELLOW_4");
|
90
|
+
}, B);
|
91
|
+
T.current.push(l);
|
92
|
+
}, [c, t, i, P, _]), v = C(
|
93
|
+
(o, l = !1) => {
|
94
|
+
var h, f, D;
|
95
|
+
if (L.current)
|
99
96
|
return;
|
100
|
-
const
|
101
|
-
|
97
|
+
const n = c.current.indicatorRefs, u = c.current.nextBtnRef, a = n == null ? void 0 : n[U];
|
98
|
+
if (!((h = e.current) != null && h.segmentedCardWrapperRef.current) || !((f = e.current) != null && f.labelRef.current) || !n || !(u != null && u.current) || !a || !a.current)
|
99
|
+
return;
|
100
|
+
L.current = !0;
|
101
|
+
const g = e.current.labelRef.current.getBoundingClientRect(), E = (D = e.current) == null ? void 0 : D.segmentedCardWrapperRef.current.getBoundingClientRect();
|
102
|
+
l ? (I(t, [
|
102
103
|
{
|
103
|
-
originalElementToHighlightRef:
|
104
|
+
originalElementToHighlightRef: a,
|
104
105
|
isActive: !1,
|
105
|
-
type:
|
106
|
-
elementToHighlight: /* @__PURE__ */ r(
|
106
|
+
type: s.TOOLTIP,
|
107
|
+
elementToHighlight: /* @__PURE__ */ r(re, { $isActive: !1 }),
|
107
108
|
indicator: {
|
108
109
|
position: "bottom",
|
109
110
|
backgroundColor: "YELLOW_4",
|
110
111
|
width: 52,
|
111
112
|
tooltipItem: /* @__PURE__ */ r(
|
112
|
-
|
113
|
+
N,
|
113
114
|
{
|
114
115
|
$position: "absolute",
|
115
116
|
$flexDirection: "row",
|
116
117
|
style: { top: 6, left: 8, cursor: "pointer" },
|
117
|
-
onClick:
|
118
|
+
onClick: O,
|
118
119
|
children: /* @__PURE__ */ r(m, { $renderAs: "ab2-bold", children: "NEW" })
|
119
120
|
}
|
120
121
|
),
|
@@ -123,21 +124,21 @@ const Oe = ({
|
|
123
124
|
}
|
124
125
|
},
|
125
126
|
{
|
126
|
-
originalElementToHighlightRef:
|
127
|
+
originalElementToHighlightRef: a,
|
127
128
|
isActive: !1,
|
128
|
-
type:
|
129
|
+
type: s.NUDGE,
|
129
130
|
indicator: {
|
130
131
|
nudge: "click",
|
131
132
|
content: "",
|
132
133
|
nudgePointerY: 20
|
133
134
|
},
|
134
|
-
elementToHighlight: /* @__PURE__ */ r(
|
135
|
+
elementToHighlight: /* @__PURE__ */ r(R, {})
|
135
136
|
}
|
136
|
-
]),
|
137
|
+
]), c.current.goToIndex(ee), i(t, !1, G), i(t, !0, te)) : (I(t, [
|
137
138
|
{
|
138
|
-
originalElementToHighlightRef:
|
139
|
+
originalElementToHighlightRef: c.current.nextBtnRef,
|
139
140
|
isActive: !1,
|
140
|
-
type:
|
141
|
+
type: s.NUDGE,
|
141
142
|
indicator: {
|
142
143
|
nudge: "click",
|
143
144
|
content: /* @__PURE__ */ r(m, { $renderAs: "ab1", $color: "WHITE", children: "Click to proceed" }),
|
@@ -145,32 +146,32 @@ const Oe = ({
|
|
145
146
|
nudgePointerY: 0
|
146
147
|
},
|
147
148
|
elementToHighlight: /* @__PURE__ */ r(
|
148
|
-
|
149
|
+
F,
|
149
150
|
{
|
150
151
|
renderAs: "secondary",
|
151
|
-
Icon:
|
152
|
-
onClick:
|
153
|
-
analyticsLabel:
|
152
|
+
Icon: x,
|
153
|
+
onClick: O,
|
154
|
+
analyticsLabel: K.JOURNEY_NEXT_ACTIVITY
|
154
155
|
}
|
155
156
|
)
|
156
157
|
}
|
157
|
-
]),
|
158
|
-
originalElementToHighlightRef:
|
158
|
+
]), c.current.goToIndex(Q), i(t, !1, G)), d(t, {
|
159
|
+
originalElementToHighlightRef: e.current.labelRef,
|
159
160
|
isActive: !1,
|
160
|
-
type:
|
161
|
-
elementToHighlight: /* @__PURE__ */ r(
|
161
|
+
type: s.TOOLTIP,
|
162
|
+
elementToHighlight: /* @__PURE__ */ r(R, {}),
|
162
163
|
indicator: {
|
163
164
|
position: "right",
|
164
165
|
backgroundColor: "YELLOW_4",
|
165
166
|
width: 264,
|
166
|
-
tooltipItem: /* @__PURE__ */ r(
|
167
|
+
tooltipItem: /* @__PURE__ */ r(N, { children: /* @__PURE__ */ r(m, { $renderAs: "ab2-bold", children: "Get faster at multiplication! Practice everyday and become a Tables champ." }) }),
|
167
168
|
tooltipXCoOrdinates: g.width + 50,
|
168
169
|
tooltipYCoOrdinates: g.height / 2
|
169
170
|
}
|
170
|
-
}),
|
171
|
-
originalElementToHighlightRef:
|
171
|
+
}), d(t, {
|
172
|
+
originalElementToHighlightRef: e.current.segmentedCardWrapperRef,
|
172
173
|
isActive: !1,
|
173
|
-
type:
|
174
|
+
type: s.NUDGE,
|
174
175
|
indicator: {
|
175
176
|
nudge: "click",
|
176
177
|
content: /* @__PURE__ */ r(m, { $renderAs: "ab1", $color: "WHITE", children: "Pick a table to start" }),
|
@@ -178,36 +179,36 @@ const Oe = ({
|
|
178
179
|
nudgePointerY: E.height / 2
|
179
180
|
},
|
180
181
|
elementToHighlight: /* @__PURE__ */ r(
|
181
|
-
|
182
|
+
k,
|
182
183
|
{
|
183
184
|
ref: p,
|
184
|
-
label:
|
185
|
-
data:
|
185
|
+
label: o.label,
|
186
|
+
data: o.data,
|
186
187
|
onPress: () => {
|
187
188
|
},
|
188
|
-
onPressTableSegment: (
|
189
|
+
onPressTableSegment: (M) => H(o, M)
|
189
190
|
}
|
190
191
|
)
|
191
192
|
});
|
192
193
|
},
|
193
194
|
[
|
194
|
-
|
195
|
-
|
196
|
-
|
197
|
-
|
198
|
-
|
199
|
-
|
200
|
-
|
195
|
+
d,
|
196
|
+
c,
|
197
|
+
O,
|
198
|
+
H,
|
199
|
+
t,
|
200
|
+
i,
|
201
|
+
I
|
201
202
|
]
|
202
203
|
);
|
203
|
-
return
|
204
|
-
T.current.forEach((
|
205
|
-
}, [
|
206
|
-
tableRef:
|
207
|
-
startJourney:
|
204
|
+
return $(() => () => {
|
205
|
+
T.current.forEach((o) => clearTimeout(o)), T.current = [], L.current = !1;
|
206
|
+
}, [t]), {
|
207
|
+
tableRef: e,
|
208
|
+
startJourney: v
|
208
209
|
};
|
209
210
|
};
|
210
211
|
export {
|
211
|
-
|
212
|
+
Ae as useTableLauncherJourney
|
212
213
|
};
|
213
214
|
//# sourceMappingURL=use-table-launcher-journey.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"use-table-launcher-journey.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.tsx"],"sourcesContent":["/* eslint-disable react-native/no-inline-styles */\nimport type { IArrowTooltipProps } from '../../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { INudgeProps } from '../../../../ui/nudge/nudge-types';\nimport type { ITableCardRef, ITableDetails } from '../../comps/tables-card/tables-card-types';\nimport type {\n ITableInfo,\n ITables,\n} from '../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport type { IUseTableJourneyProps } from './use-table-launcher-journey-types';\n\nimport { useCallback, useEffect, useRef } from 'react';\n\nimport CaratRightIcon from '../../../../../assets/line-icons/icons/carat-right';\nimport { PLATFORM_EVENTS_STUDENT } from '../../../../analytics-events/platform-events-student';\nimport { JOURNEY_ID_STUDENT } from '../../../../journey/journey-id/journey-id-student';\nimport { IndicatorType } from '../../../../journey/use-journey/constants';\nimport { useJourney } from '../../../../journey/use-journey/use-journey';\nimport IconButton from '../../../../ui/buttons/icon-button/icon-button';\nimport { useUIContext } from '../../../../ui/context/context';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport Text from '../../../../ui/text/text';\nimport { CIRCLE_ONBOARDING_ANALYTICS_STEPS as Action } from '../../../enum/circle-onboarding-steps';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport { TablesCard } from '../../comps/tables-card/tables-card';\nimport { GAME_LAUNCHER_ANALYTICS_EVENTS } from '../../game-launcher-analytics-events';\nimport {\n LESSON_CARD_INDEX,\n PUZZLE_CARD_INDEX,\n SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS,\n SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS,\n TABLE_CARD_INDEX,\n} from './constants';\nimport {\n GO_TO_TABLE_LAUNCHER_DURATION_MS,\n SHOW_CLICK_TABLE_NUDGE_AFTER_MS,\n SHOW_INITIAL_COACHMARK_AFTER_MS,\n SHOW_INITIAL_TOOLTIP_AFTER_MS,\n START_ANIMATING_CLONED_ELEM,\n} from './constants';\nimport * as S from './use-table-launcher-journey-styled';\n\nexport const useTableLauncherJourney = ({\n carouselRefs,\n onTableSegmentClick,\n onJourneyComplete,\n}: IUseTableJourneyProps) => {\n const journeyId = JOURNEY_ID_STUDENT.CIRCLE_TABLES_INTRO_JOURNEY;\n\n const originalTableRef = useRef<ITableCardRef>(null);\n const highlightedTableRef = useRef<ITableCardRef>(null);\n\n const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n const { playButtonSound } = useCircleSounds();\n const { nextCoachmark, setJourney, addCoachmark, endJourney } = useJourney();\n const { onEvent: trackAnalytics } = useUIContext();\n\n const handleEndJourney = useCallback(\n (tableDetails?: ITableDetails) => {\n endJourney(journeyId);\n // Only when User clicked on play\n if (tableDetails) {\n onTableSegmentClick(tableDetails);\n }\n trackAnalytics(PLATFORM_EVENTS_STUDENT.ONBOARDING_STEP_COMPLETED, {\n step: Action.TABLES,\n });\n\n // Reset original table card ref label\n originalTableRef?.current?.setLabelVisiblity(true);\n originalTableRef?.current?.stopLabelAnimation();\n onJourneyComplete(journeyId);\n },\n [endJourney, journeyId, onJourneyComplete, onTableSegmentClick, trackAnalytics],\n );\n\n const handleTableSegmentClick = useCallback(\n (launcherData: ITables, tableData: ITableInfo) => {\n if (\n !originalTableRef.current?.segmentedCardWrapperRef.current ||\n !originalTableRef.current?.labelRef.current\n ) {\n return;\n }\n\n const segmentedCardDims = originalTableRef.current.labelRef.current.getBoundingClientRect();\n const tableCardDims =\n originalTableRef.current?.segmentedCardWrapperRef.current.getBoundingClientRect();\n\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: (\n <TablesCard\n ref={highlightedTableRef}\n defaultTable={tableData}\n label={launcherData.label}\n data={launcherData.data}\n onPress={handleEndJourney}\n onGoBackFromTableLevel={handleEndJourney}\n />\n ),\n indicator: {\n position: 'left',\n backgroundColor: 'YELLOW_4',\n width: 236,\n tooltipItem: (\n <FlexView>\n <Text $renderAs=\"ab2-bold\">Each table has 3 levels—clear them and earn 3 stars!</Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: 0,\n tooltipYCoOrdinates: segmentedCardDims.height * 0.35,\n } as IArrowTooltipProps,\n });\n\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n Pick a level\n </Text>\n ),\n nudgePointerX: tableCardDims.width / 2 + 50,\n nudgePointerY: tableCardDims.height * 0.4,\n } as INudgeProps,\n elementToHighlight: <></>,\n });\n\n nextCoachmark(journeyId, false, SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS); // Show coachmark => Each table has 3... and Hide the previous two\n nextCoachmark(journeyId, true, SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS); // Show nudge => Pick a level\n\n const startAnimationOnLabelAgain = setTimeout(() => {\n clearTimeout(startAnimationOnLabelAgain);\n highlightedTableRef.current?.startLabelAnimation('YELLOW_4');\n }, START_ANIMATING_CLONED_ELEM);\n\n timerRefs.current.push(startAnimationOnLabelAgain);\n },\n [addCoachmark, handleEndJourney, journeyId, nextCoachmark],\n );\n\n const goToTableLauncher = useCallback(() => {\n playButtonSound();\n carouselRefs.current?.goToIndex(TABLE_CARD_INDEX);\n nextCoachmark(journeyId, false, GO_TO_TABLE_LAUNCHER_DURATION_MS);\n\n trackAnalytics(PLATFORM_EVENTS_STUDENT.ONBOARDING_STEP_VIEWED, {\n step: Action.TABLES,\n });\n\n const showNudge = setTimeout(() => {\n clearTimeout(showNudge);\n originalTableRef.current?.setLabelVisiblity(false);\n nextCoachmark(journeyId, true);\n }, SHOW_CLICK_TABLE_NUDGE_AFTER_MS);\n\n timerRefs.current.push(showNudge);\n\n const animateLabel = setTimeout(() => {\n clearTimeout(animateLabel);\n highlightedTableRef.current?.startLabelAnimation('YELLOW_4');\n }, START_ANIMATING_CLONED_ELEM);\n\n timerRefs.current.push(animateLabel);\n }, [carouselRefs, journeyId, nextCoachmark, playButtonSound, trackAnalytics]);\n\n const startJourney = useCallback(\n (tablesData: ITables, isTutorialOnboardingDone: boolean = false) => {\n const paginationList = carouselRefs.current?.indicatorRefs;\n const carouselNextBtnRef = carouselRefs.current?.nextBtnRef;\n const tablePaginationRef = paginationList?.[TABLE_CARD_INDEX];\n\n if (\n !originalTableRef.current?.segmentedCardWrapperRef.current ||\n !originalTableRef.current?.labelRef.current ||\n !paginationList ||\n !carouselNextBtnRef?.current ||\n !tablePaginationRef ||\n !tablePaginationRef.current\n ) {\n return;\n }\n\n const labelDims = originalTableRef.current.labelRef.current.getBoundingClientRect();\n const tableCardDims =\n originalTableRef.current?.segmentedCardWrapperRef.current.getBoundingClientRect();\n\n // TAKE THE USER TO THE TABLE CARD\n if (!isTutorialOnboardingDone) {\n setJourney(journeyId, [\n {\n originalElementToHighlightRef: carouselRefs.current?.nextBtnRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n Click to proceed\n </Text>\n ),\n nudgePointerX: 0,\n nudgePointerY: 0,\n } as INudgeProps,\n elementToHighlight: (\n <IconButton\n renderAs=\"secondary\"\n Icon={CaratRightIcon}\n onClick={goToTableLauncher}\n analyticsLabel={GAME_LAUNCHER_ANALYTICS_EVENTS.JOURNEY_NEXT_ACTIVITY}\n />\n ),\n },\n ]);\n carouselRefs.current?.goToIndex(PUZZLE_CARD_INDEX);\n nextCoachmark(journeyId, false, SHOW_INITIAL_COACHMARK_AFTER_MS); // Show nudge => Click to proceed\n } else {\n setJourney(journeyId, [\n {\n originalElementToHighlightRef: tablePaginationRef as React.RefObject<HTMLDivElement>,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <S.Indicator $isActive={false} />,\n indicator: {\n position: 'bottom',\n backgroundColor: 'YELLOW_4',\n width: 52,\n tooltipItem: (\n <FlexView\n $position=\"absolute\"\n $flexDirection=\"row\"\n style={{ top: 6, left: 8, cursor: 'pointer' }}\n onClick={goToTableLauncher}\n >\n <Text $renderAs=\"ab2-bold\">NEW</Text>\n </FlexView>\n ),\n tooltipYCoOrdinates: 14, // Need some offset in Y direction from top\n } as IArrowTooltipProps,\n },\n {\n originalElementToHighlightRef: tablePaginationRef as React.RefObject<HTMLDivElement>,\n isActive: false,\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n content: '',\n nudgePointerY: 20,\n } as INudgeProps,\n elementToHighlight: <></>,\n },\n ]);\n carouselRefs.current?.goToIndex(LESSON_CARD_INDEX);\n nextCoachmark(journeyId, false, SHOW_INITIAL_COACHMARK_AFTER_MS); // Show Coachmark => NEW\n nextCoachmark(journeyId, true, SHOW_INITIAL_TOOLTIP_AFTER_MS); // Show Nudge over Coachmark\n }\n\n // SHOW THE USER SELECT A TABLE\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.labelRef,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <></>,\n indicator: {\n position: 'right',\n backgroundColor: 'YELLOW_4',\n width: 264,\n tooltipItem: (\n <FlexView>\n <Text $renderAs=\"ab2-bold\">\n Get faster at multiplication! Practice everyday and become a Tables champ.\n </Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: labelDims.width + 50,\n tooltipYCoOrdinates: labelDims.height / 2,\n } as IArrowTooltipProps,\n });\n\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n {'Pick a table to start'}\n </Text>\n ),\n nudgePointerX: tableCardDims.width / 2 + 50,\n nudgePointerY: tableCardDims.height / 2,\n } as INudgeProps,\n elementToHighlight: (\n <TablesCard\n ref={highlightedTableRef}\n label={tablesData.label}\n data={tablesData.data}\n onPress={() => {}}\n onPressTableSegment={tableInfo => handleTableSegmentClick(tablesData, tableInfo)}\n />\n ),\n });\n },\n [\n addCoachmark,\n carouselRefs,\n goToTableLauncher,\n handleTableSegmentClick,\n journeyId,\n nextCoachmark,\n setJourney,\n ],\n );\n\n // Cleanup on unmount\n useEffect(() => {\n return () => {\n timerRefs.current.forEach(timer => clearTimeout(timer));\n timerRefs.current = [];\n };\n }, [journeyId]);\n\n return {\n tableRef: originalTableRef,\n startJourney,\n };\n};\n"],"names":["useTableLauncherJourney","carouselRefs","onTableSegmentClick","onJourneyComplete","journeyId","JOURNEY_ID_STUDENT","originalTableRef","useRef","highlightedTableRef","timerRefs","playButtonSound","useCircleSounds","nextCoachmark","setJourney","addCoachmark","endJourney","useJourney","trackAnalytics","useUIContext","handleEndJourney","useCallback","tableDetails","PLATFORM_EVENTS_STUDENT","Action","_a","_b","handleTableSegmentClick","launcherData","tableData","segmentedCardDims","tableCardDims","_c","IndicatorType","jsx","TablesCard","FlexView","Text","Fragment","SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS","SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS","startAnimationOnLabelAgain","START_ANIMATING_CLONED_ELEM","goToTableLauncher","TABLE_CARD_INDEX","GO_TO_TABLE_LAUNCHER_DURATION_MS","showNudge","SHOW_CLICK_TABLE_NUDGE_AFTER_MS","animateLabel","startJourney","tablesData","isTutorialOnboardingDone","paginationList","carouselNextBtnRef","tablePaginationRef","_d","labelDims","_e","S.Indicator","_h","LESSON_CARD_INDEX","SHOW_INITIAL_COACHMARK_AFTER_MS","SHOW_INITIAL_TOOLTIP_AFTER_MS","_f","IconButton","CaratRightIcon","GAME_LAUNCHER_ANALYTICS_EVENTS","_g","PUZZLE_CARD_INDEX","tableInfo","useEffect","timer"],"mappings":"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"}
|
1
|
+
{"version":3,"file":"use-table-launcher-journey.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.tsx"],"sourcesContent":["/* eslint-disable react-native/no-inline-styles */\nimport type { IArrowTooltipProps } from '../../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { INudgeProps } from '../../../../ui/nudge/nudge-types';\nimport type { ITableCardRef, ITableDetails } from '../../comps/tables-card/tables-card-types';\nimport type {\n ITableInfo,\n ITables,\n} from '../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport type { IUseTableJourneyProps } from './use-table-launcher-journey-types';\n\nimport { useCallback, useEffect, useRef } from 'react';\n\nimport CaratRightIcon from '../../../../../assets/line-icons/icons/carat-right';\nimport { PLATFORM_EVENTS_STUDENT } from '../../../../analytics-events/platform-events-student';\nimport { JOURNEY_ID_STUDENT } from '../../../../journey/journey-id/journey-id-student';\nimport { IndicatorType } from '../../../../journey/use-journey/constants';\nimport { useJourney } from '../../../../journey/use-journey/use-journey';\nimport IconButton from '../../../../ui/buttons/icon-button/icon-button';\nimport { useUIContext } from '../../../../ui/context/context';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport Text from '../../../../ui/text/text';\nimport { CIRCLE_ONBOARDING_ANALYTICS_STEPS as Action } from '../../../enum/circle-onboarding-steps';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport { TablesCard } from '../../comps/tables-card/tables-card';\nimport { GAME_LAUNCHER_ANALYTICS_EVENTS } from '../../game-launcher-analytics-events';\nimport {\n LESSON_CARD_INDEX,\n PUZZLE_CARD_INDEX,\n SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS,\n SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS,\n TABLE_CARD_INDEX,\n} from './constants';\nimport {\n GO_TO_TABLE_LAUNCHER_DURATION_MS,\n SHOW_CLICK_TABLE_NUDGE_AFTER_MS,\n SHOW_INITIAL_COACHMARK_AFTER_MS,\n SHOW_INITIAL_TOOLTIP_AFTER_MS,\n START_ANIMATING_CLONED_ELEM,\n} from './constants';\nimport * as S from './use-table-launcher-journey-styled';\n\nexport const useTableLauncherJourney = ({\n carouselRefs,\n onTableSegmentClick,\n}: IUseTableJourneyProps) => {\n const journeyId = JOURNEY_ID_STUDENT.CIRCLE_TABLES_INTRO_JOURNEY;\n const originalTableRef = useRef<ITableCardRef>(null);\n const highlightedTableRef = useRef<ITableCardRef>(null);\n const isJourneyInProgress = useRef(false);\n\n const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n const { playButtonSound } = useCircleSounds();\n const { nextCoachmark, setJourney, addCoachmark, endJourney } = useJourney();\n const { onEvent: trackAnalytics } = useUIContext();\n\n const handleEndJourney = useCallback(\n (tableDetails?: ITableDetails) => {\n // Only when User clicked on play\n if (tableDetails) {\n onTableSegmentClick(tableDetails);\n }\n trackAnalytics(PLATFORM_EVENTS_STUDENT.ONBOARDING_STEP_COMPLETED, {\n step: Action.TABLES,\n });\n\n // Reset original table card ref label\n originalTableRef?.current?.setLabelVisiblity(true);\n originalTableRef?.current?.stopLabelAnimation();\n endJourney(journeyId);\n },\n [endJourney, journeyId, onTableSegmentClick, trackAnalytics],\n );\n\n const handleTableSegmentClick = useCallback(\n (launcherData: ITables, tableData: ITableInfo) => {\n if (\n !originalTableRef.current?.segmentedCardWrapperRef.current ||\n !originalTableRef.current?.labelRef.current\n ) {\n return;\n }\n\n const segmentedCardDims = originalTableRef.current.labelRef.current.getBoundingClientRect();\n const tableCardDims =\n originalTableRef.current?.segmentedCardWrapperRef.current.getBoundingClientRect();\n\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: (\n <TablesCard\n ref={highlightedTableRef}\n defaultTable={tableData}\n label={launcherData.label}\n data={launcherData.data}\n onPress={handleEndJourney}\n onGoBackFromTableLevel={handleEndJourney}\n />\n ),\n indicator: {\n position: 'left',\n backgroundColor: 'YELLOW_4',\n width: 236,\n tooltipItem: (\n <FlexView>\n <Text $renderAs=\"ab2-bold\">Each table has 3 levels—clear them and earn 3 stars!</Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: 0,\n tooltipYCoOrdinates: segmentedCardDims.height * 0.35,\n } as IArrowTooltipProps,\n });\n\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n Pick a level\n </Text>\n ),\n nudgePointerX: tableCardDims.width / 2 + 50,\n nudgePointerY: tableCardDims.height * 0.4,\n } as INudgeProps,\n elementToHighlight: <></>,\n });\n\n nextCoachmark(journeyId, false, SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS); // Show coachmark => Each table has 3... and Hide the previous two\n nextCoachmark(journeyId, true, SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS); // Show nudge => Pick a level\n\n const startAnimationOnLabelAgain = setTimeout(() => {\n clearTimeout(startAnimationOnLabelAgain);\n highlightedTableRef.current?.startLabelAnimation('YELLOW_4');\n }, START_ANIMATING_CLONED_ELEM);\n\n timerRefs.current.push(startAnimationOnLabelAgain);\n },\n [addCoachmark, handleEndJourney, journeyId, nextCoachmark],\n );\n\n const goToTableLauncher = useCallback(() => {\n playButtonSound();\n carouselRefs.current.goToIndex(TABLE_CARD_INDEX);\n nextCoachmark(journeyId, false, GO_TO_TABLE_LAUNCHER_DURATION_MS);\n\n trackAnalytics(PLATFORM_EVENTS_STUDENT.ONBOARDING_STEP_VIEWED, {\n step: Action.TABLES,\n });\n\n const showNudge = setTimeout(() => {\n clearTimeout(showNudge);\n originalTableRef.current?.setLabelVisiblity(false);\n nextCoachmark(journeyId, true);\n }, SHOW_CLICK_TABLE_NUDGE_AFTER_MS);\n\n timerRefs.current.push(showNudge);\n\n const animateLabel = setTimeout(() => {\n clearTimeout(animateLabel);\n highlightedTableRef.current?.startLabelAnimation('YELLOW_4');\n }, START_ANIMATING_CLONED_ELEM);\n\n timerRefs.current.push(animateLabel);\n }, [carouselRefs, journeyId, nextCoachmark, playButtonSound, trackAnalytics]);\n\n const startJourney = useCallback(\n (tablesData: ITables, isTutorialOnboardingDone: boolean = false) => {\n if (isJourneyInProgress.current) {\n return;\n }\n\n const paginationList = carouselRefs.current.indicatorRefs;\n const carouselNextBtnRef = carouselRefs.current.nextBtnRef;\n const tablePaginationRef = paginationList?.[TABLE_CARD_INDEX];\n\n if (\n !originalTableRef.current?.segmentedCardWrapperRef.current ||\n !originalTableRef.current?.labelRef.current ||\n !paginationList ||\n !carouselNextBtnRef?.current ||\n !tablePaginationRef ||\n !tablePaginationRef.current\n ) {\n return;\n }\n\n isJourneyInProgress.current = true;\n\n const labelDims = originalTableRef.current.labelRef.current.getBoundingClientRect();\n const tableCardDims =\n originalTableRef.current?.segmentedCardWrapperRef.current.getBoundingClientRect();\n\n // TAKE THE USER TO THE TABLE CARD\n if (!isTutorialOnboardingDone) {\n setJourney(journeyId, [\n {\n originalElementToHighlightRef: carouselRefs.current.nextBtnRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n Click to proceed\n </Text>\n ),\n nudgePointerX: 0,\n nudgePointerY: 0,\n } as INudgeProps,\n elementToHighlight: (\n <IconButton\n renderAs=\"secondary\"\n Icon={CaratRightIcon}\n onClick={goToTableLauncher}\n analyticsLabel={GAME_LAUNCHER_ANALYTICS_EVENTS.JOURNEY_NEXT_ACTIVITY}\n />\n ),\n },\n ]);\n carouselRefs.current.goToIndex(PUZZLE_CARD_INDEX);\n nextCoachmark(journeyId, false, SHOW_INITIAL_COACHMARK_AFTER_MS); // Show nudge => Click to proceed\n } else {\n setJourney(journeyId, [\n {\n originalElementToHighlightRef: tablePaginationRef as React.RefObject<HTMLDivElement>,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <S.Indicator $isActive={false} />,\n indicator: {\n position: 'bottom',\n backgroundColor: 'YELLOW_4',\n width: 52,\n tooltipItem: (\n <FlexView\n $position=\"absolute\"\n $flexDirection=\"row\"\n style={{ top: 6, left: 8, cursor: 'pointer' }}\n onClick={goToTableLauncher}\n >\n <Text $renderAs=\"ab2-bold\">NEW</Text>\n </FlexView>\n ),\n tooltipYCoOrdinates: 14, // Need some offset in Y direction from top\n } as IArrowTooltipProps,\n },\n {\n originalElementToHighlightRef: tablePaginationRef as React.RefObject<HTMLDivElement>,\n isActive: false,\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n content: '',\n nudgePointerY: 20,\n } as INudgeProps,\n elementToHighlight: <></>,\n },\n ]);\n carouselRefs.current.goToIndex(LESSON_CARD_INDEX);\n nextCoachmark(journeyId, false, SHOW_INITIAL_COACHMARK_AFTER_MS); // Show Coachmark => NEW\n nextCoachmark(journeyId, true, SHOW_INITIAL_TOOLTIP_AFTER_MS); // Show Nudge over Coachmark\n }\n\n // SHOW THE USER SELECT A TABLE\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.labelRef,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <></>,\n indicator: {\n position: 'right',\n backgroundColor: 'YELLOW_4',\n width: 264,\n tooltipItem: (\n <FlexView>\n <Text $renderAs=\"ab2-bold\">\n Get faster at multiplication! Practice everyday and become a Tables champ.\n </Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: labelDims.width + 50,\n tooltipYCoOrdinates: labelDims.height / 2,\n } as IArrowTooltipProps,\n });\n\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n {'Pick a table to start'}\n </Text>\n ),\n nudgePointerX: tableCardDims.width / 2 + 50,\n nudgePointerY: tableCardDims.height / 2,\n } as INudgeProps,\n elementToHighlight: (\n <TablesCard\n ref={highlightedTableRef}\n label={tablesData.label}\n data={tablesData.data}\n onPress={() => {}}\n onPressTableSegment={tableInfo => handleTableSegmentClick(tablesData, tableInfo)}\n />\n ),\n });\n },\n [\n addCoachmark,\n carouselRefs,\n goToTableLauncher,\n handleTableSegmentClick,\n journeyId,\n nextCoachmark,\n setJourney,\n ],\n );\n\n // Cleanup on unmount\n useEffect(() => {\n return () => {\n timerRefs.current.forEach(timer => clearTimeout(timer));\n timerRefs.current = [];\n isJourneyInProgress.current = false;\n };\n }, [journeyId]);\n\n return {\n tableRef: originalTableRef,\n startJourney,\n };\n};\n"],"names":["useTableLauncherJourney","carouselRefs","onTableSegmentClick","journeyId","JOURNEY_ID_STUDENT","originalTableRef","useRef","highlightedTableRef","isJourneyInProgress","timerRefs","playButtonSound","useCircleSounds","nextCoachmark","setJourney","addCoachmark","endJourney","useJourney","trackAnalytics","useUIContext","handleEndJourney","useCallback","tableDetails","PLATFORM_EVENTS_STUDENT","Action","_a","_b","handleTableSegmentClick","launcherData","tableData","segmentedCardDims","tableCardDims","_c","IndicatorType","jsx","TablesCard","FlexView","Text","Fragment","SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS","SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS","startAnimationOnLabelAgain","START_ANIMATING_CLONED_ELEM","goToTableLauncher","TABLE_CARD_INDEX","GO_TO_TABLE_LAUNCHER_DURATION_MS","showNudge","SHOW_CLICK_TABLE_NUDGE_AFTER_MS","animateLabel","startJourney","tablesData","isTutorialOnboardingDone","paginationList","carouselNextBtnRef","tablePaginationRef","labelDims","S.Indicator","LESSON_CARD_INDEX","SHOW_INITIAL_COACHMARK_AFTER_MS","SHOW_INITIAL_TOOLTIP_AFTER_MS","IconButton","CaratRightIcon","GAME_LAUNCHER_ANALYTICS_EVENTS","PUZZLE_CARD_INDEX","tableInfo","useEffect","timer"],"mappings":";;;;;;;;;;;;;;;;;AAyCO,MAAMA,KAA0B,CAAC;AAAA,EACtC,cAAAC;AAAA,EACA,qBAAAC;AACF,MAA6B;AAC3B,QAAMC,IAAYC,EAAmB,6BAC/BC,IAAmBC,EAAsB,IAAI,GAC7CC,IAAsBD,EAAsB,IAAI,GAChDE,IAAsBF,EAAO,EAAK,GAElCG,IAAYH,EAAwC,CAAA,CAAE,GAEtD,EAAE,iBAAAI,MAAoBC,KACtB,EAAE,eAAAC,GAAe,YAAAC,GAAY,cAAAC,GAAc,YAAAC,EAAA,IAAeC,KAC1D,EAAE,SAASC,EAAe,IAAIC,EAAa,GAE3CC,IAAmBC;AAAA,IACvB,CAACC,MAAiC;;AAEhC,MAAIA,KACFnB,EAAoBmB,CAAY,GAElCJ,EAAeK,EAAwB,2BAA2B;AAAA,QAChE,MAAMC,EAAO;AAAA,MAAA,CACd,IAGiBC,IAAAnB,KAAA,gBAAAA,EAAA,YAAA,QAAAmB,EAAS,kBAAkB,MAC7CC,IAAApB,KAAA,gBAAAA,EAAkB,YAAlB,QAAAoB,EAA2B,sBAC3BV,EAAWZ,CAAS;AAAA,IACtB;AAAA,IACA,CAACY,GAAYZ,GAAWD,GAAqBe,CAAc;AAAA,EAAA,GAGvDS,IAA0BN;AAAA,IAC9B,CAACO,GAAuBC,MAA0B;;AAE9C,UAAA,GAACJ,IAAAnB,EAAiB,YAAjB,QAAAmB,EAA0B,wBAAwB,YACnD,GAACC,IAAApB,EAAiB,YAAjB,QAAAoB,EAA0B,SAAS;AAEpC;AAGF,YAAMI,IAAoBxB,EAAiB,QAAQ,SAAS,QAAQ,yBAC9DyB,KACJC,IAAA1B,EAAiB,YAAjB,gBAAA0B,EAA0B,wBAAwB,QAAQ;AAE5D,MAAAjB,EAAaX,GAAW;AAAA,QACtB,+BAA+BE,EAAiB,QAAQ;AAAA,QACxD,UAAU;AAAA,QACV,MAAM2B,EAAc;AAAA,QACpB,oBACE,gBAAAC;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,KAAK3B;AAAA,YACL,cAAcqB;AAAA,YACd,OAAOD,EAAa;AAAA,YACpB,MAAMA,EAAa;AAAA,YACnB,SAASR;AAAA,YACT,wBAAwBA;AAAA,UAAA;AAAA,QAC1B;AAAA,QAEF,WAAW;AAAA,UACT,UAAU;AAAA,UACV,iBAAiB;AAAA,UACjB,OAAO;AAAA,UACP,+BACGgB,GACC,EAAA,UAAA,gBAAAF,EAACG,KAAK,WAAU,YAAW,kEAAoD,EACjF,CAAA;AAAA,UAEF,qBAAqB;AAAA,UACrB,qBAAqBP,EAAkB,SAAS;AAAA,QAClD;AAAA,MAAA,CACD,GAEDf,EAAaX,GAAW;AAAA,QACtB,+BAA+BE,EAAiB,QAAQ;AAAA,QACxD,UAAU;AAAA,QACV,MAAM2B,EAAc;AAAA,QACpB,WAAW;AAAA,UACT,OAAO;AAAA,UACP,SACG,gBAAAC,EAAAG,GAAA,EAAK,WAAU,OAAM,QAAO,SAAQ,UAErC,gBAAA;AAAA,UAEF,eAAeN,EAAc,QAAQ,IAAI;AAAA,UACzC,eAAeA,EAAc,SAAS;AAAA,QACxC;AAAA,QACA,oBAAsB,gBAAAG,EAAAI,GAAA,EAAA;AAAA,MAAA,CACvB,GAEazB,EAAAT,GAAW,IAAOmC,CAAkC,GACpD1B,EAAAT,GAAW,IAAMoC,CAAgC;AAEzD,YAAAC,IAA6B,WAAW,MAAM;;AAClD,qBAAaA,CAA0B,IACnBhB,IAAAjB,EAAA,YAAA,QAAAiB,EAAS,oBAAoB;AAAA,SAChDiB,CAA2B;AAEpB,MAAAhC,EAAA,QAAQ,KAAK+B,CAA0B;AAAA,IACnD;AAAA,IACA,CAAC1B,GAAcK,GAAkBhB,GAAWS,CAAa;AAAA,EAAA,GAGrD8B,IAAoBtB,EAAY,MAAM;AAC1B,IAAAV,KACHT,EAAA,QAAQ,UAAU0C,CAAgB,GACjC/B,EAAAT,GAAW,IAAOyC,CAAgC,GAEhE3B,EAAeK,EAAwB,wBAAwB;AAAA,MAC7D,MAAMC,EAAO;AAAA,IAAA,CACd;AAEK,UAAAsB,IAAY,WAAW,MAAM;;AACjC,mBAAaA,CAAS,IACLrB,IAAAnB,EAAA,YAAA,QAAAmB,EAAS,kBAAkB,KAC5CZ,EAAcT,GAAW,EAAI;AAAA,OAC5B2C,CAA+B;AAExB,IAAArC,EAAA,QAAQ,KAAKoC,CAAS;AAE1B,UAAAE,IAAe,WAAW,MAAM;;AACpC,mBAAaA,CAAY,IACLvB,IAAAjB,EAAA,YAAA,QAAAiB,EAAS,oBAAoB;AAAA,OAChDiB,CAA2B;AAEpB,IAAAhC,EAAA,QAAQ,KAAKsC,CAAY;AAAA,EAAA,GAClC,CAAC9C,GAAcE,GAAWS,GAAeF,GAAiBO,CAAc,CAAC,GAEtE+B,IAAe5B;AAAA,IACnB,CAAC6B,GAAqBC,IAAoC,OAAU;;AAClE,UAAI1C,EAAoB;AACtB;AAGI,YAAA2C,IAAiBlD,EAAa,QAAQ,eACtCmD,IAAqBnD,EAAa,QAAQ,YAC1CoD,IAAqBF,KAAA,gBAAAA,EAAiBR;AAE5C,UACE,GAACnB,IAAAnB,EAAiB,YAAjB,QAAAmB,EAA0B,wBAAwB,YACnD,GAACC,IAAApB,EAAiB,YAAjB,QAAAoB,EAA0B,SAAS,YACpC,CAAC0B,KACD,EAACC,KAAA,QAAAA,EAAoB,YACrB,CAACC,KACD,CAACA,EAAmB;AAEpB;AAGF,MAAA7C,EAAoB,UAAU;AAE9B,YAAM8C,IAAYjD,EAAiB,QAAQ,SAAS,QAAQ,yBACtDyB,KACJC,IAAA1B,EAAiB,YAAjB,gBAAA0B,EAA0B,wBAAwB,QAAQ;AAG5D,MAAKmB,KA6BHrC,EAAWV,GAAW;AAAA,QACpB;AAAA,UACE,+BAA+BkD;AAAA,UAC/B,UAAU;AAAA,UACV,MAAMrB,EAAc;AAAA,UACpB,oBAAqB,gBAAAC,EAAAsB,IAAA,EAAY,WAAW,GAAO,CAAA;AAAA,UACnD,WAAW;AAAA,YACT,UAAU;AAAA,YACV,iBAAiB;AAAA,YACjB,OAAO;AAAA,YACP,aACE,gBAAAtB;AAAA,cAACE;AAAA,cAAA;AAAA,gBACC,WAAU;AAAA,gBACV,gBAAe;AAAA,gBACf,OAAO,EAAE,KAAK,GAAG,MAAM,GAAG,QAAQ,UAAU;AAAA,gBAC5C,SAASO;AAAA,gBAET,UAAC,gBAAAT,EAAAG,GAAA,EAAK,WAAU,YAAW,UAAG,OAAA;AAAA,cAAA;AAAA,YAChC;AAAA,YAEF,qBAAqB;AAAA;AAAA,UACvB;AAAA,QACF;AAAA,QACA;AAAA,UACE,+BAA+BiB;AAAA,UAC/B,UAAU;AAAA,UACV,MAAMrB,EAAc;AAAA,UACpB,WAAW;AAAA,YACT,OAAO;AAAA,YACP,SAAS;AAAA,YACT,eAAe;AAAA,UACjB;AAAA,UACA,oBAAsB,gBAAAC,EAAAI,GAAA,EAAA;AAAA,QACxB;AAAA,MAAA,CACD,GACYpC,EAAA,QAAQ,UAAUuD,EAAiB,GAClC5C,EAAAT,GAAW,IAAOsD,CAA+B,GACjD7C,EAAAT,GAAW,IAAMuD,EAA6B,MAjE5D7C,EAAWV,GAAW;AAAA,QACpB;AAAA,UACE,+BAA+BF,EAAa,QAAQ;AAAA,UACpD,UAAU;AAAA,UACV,MAAM+B,EAAc;AAAA,UACpB,WAAW;AAAA,YACT,OAAO;AAAA,YACP,SACG,gBAAAC,EAAAG,GAAA,EAAK,WAAU,OAAM,QAAO,SAAQ,UAErC,oBAAA;AAAA,YAEF,eAAe;AAAA,YACf,eAAe;AAAA,UACjB;AAAA,UACA,oBACE,gBAAAH;AAAA,YAAC0B;AAAA,YAAA;AAAA,cACC,UAAS;AAAA,cACT,MAAMC;AAAA,cACN,SAASlB;AAAA,cACT,gBAAgBmB,EAA+B;AAAA,YAAA;AAAA,UACjD;AAAA,QAEJ;AAAA,MAAA,CACD,GACY5D,EAAA,QAAQ,UAAU6D,CAAiB,GAClClD,EAAAT,GAAW,IAAOsD,CAA+B,IA2CjE3C,EAAaX,GAAW;AAAA,QACtB,+BAA+BE,EAAiB,QAAQ;AAAA,QACxD,UAAU;AAAA,QACV,MAAM2B,EAAc;AAAA,QACpB,oBAAsB,gBAAAC,EAAAI,GAAA,EAAA;AAAA,QACtB,WAAW;AAAA,UACT,UAAU;AAAA,UACV,iBAAiB;AAAA,UACjB,OAAO;AAAA,UACP,+BACGF,GACC,EAAA,UAAA,gBAAAF,EAACG,KAAK,WAAU,YAAW,wFAE3B,EACF,CAAA;AAAA,UAEF,qBAAqBkB,EAAU,QAAQ;AAAA,UACvC,qBAAqBA,EAAU,SAAS;AAAA,QAC1C;AAAA,MAAA,CACD,GAEDxC,EAAaX,GAAW;AAAA,QACtB,+BAA+BE,EAAiB,QAAQ;AAAA,QACxD,UAAU;AAAA,QACV,MAAM2B,EAAc;AAAA,QACpB,WAAW;AAAA,UACT,OAAO;AAAA,UACP,SACG,gBAAAC,EAAAG,GAAA,EAAK,WAAU,OAAM,QAAO,SAC1B,UACH,yBAAA;AAAA,UAEF,eAAeN,EAAc,QAAQ,IAAI;AAAA,UACzC,eAAeA,EAAc,SAAS;AAAA,QACxC;AAAA,QACA,oBACE,gBAAAG;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,KAAK3B;AAAA,YACL,OAAO0C,EAAW;AAAA,YAClB,MAAMA,EAAW;AAAA,YACjB,SAAS,MAAM;AAAA,YAAC;AAAA,YAChB,qBAAqB,CAAAc,MAAarC,EAAwBuB,GAAYc,CAAS;AAAA,UAAA;AAAA,QACjF;AAAA,MAAA,CAEH;AAAA,IACH;AAAA,IACA;AAAA,MACEjD;AAAA,MACAb;AAAA,MACAyC;AAAA,MACAhB;AAAA,MACAvB;AAAA,MACAS;AAAA,MACAC;AAAA,IACF;AAAA,EAAA;AAIF,SAAAmD,EAAU,MACD,MAAM;AACX,IAAAvD,EAAU,QAAQ,QAAQ,CAASwD,MAAA,aAAaA,CAAK,CAAC,GACtDxD,EAAU,UAAU,IACpBD,EAAoB,UAAU;AAAA,EAAA,GAE/B,CAACL,CAAS,CAAC,GAEP;AAAA,IACL,UAAUE;AAAA,IACV,cAAA2C;AAAA,EAAA;AAEJ;"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"web-view-types.js","sources":["../../../../../src/features/circle-games/games/web-view/web-view-types.ts"],"sourcesContent":["import type { IAvatarLayer } from '../../../ui/avatar/avatar-types';\nimport type { TUserTypes } from '../../../ui/types';\nimport type { WebViewEvent, ProjectOutcome, ProjectType } from './enums';\nimport type { WEBVIEW_ANALYTICS_EVENTS } from './web-view-analytics-events';\nimport type { IframeHTMLAttributes } from 'react';\n\nexport interface IPlayer {\n id: string;\n username: string;\n grade?: string;\n avatar?: IAvatarLayer[] | null;\n playerType: TUserTypes;\n countryCode: string;\n
|
1
|
+
{"version":3,"file":"web-view-types.js","sources":["../../../../../src/features/circle-games/games/web-view/web-view-types.ts"],"sourcesContent":["import type { IAvatarLayer } from '../../../ui/avatar/avatar-types';\nimport type { TUserTypes } from '../../../ui/types';\nimport type { WebViewEvent, ProjectOutcome, ProjectType } from './enums';\nimport type { WEBVIEW_ANALYTICS_EVENTS } from './web-view-analytics-events';\nimport type { IframeHTMLAttributes } from 'react';\n\nexport interface IPlayer {\n id: string;\n username: string;\n grade?: string;\n avatar?: IAvatarLayer[] | null;\n playerType: TUserTypes;\n countryCode: string;\n}\n\ninterface ISyncableWebGameProps {\n joinByRoomId?: string;\n enableSync?: boolean; // applicable for all except multiplayer games and tables\n}\n\ninterface IBaseWebGameProps {\n projectId: string;\n variant: string;\n projectType: ProjectType;\n enableCloseButton?: boolean;\n}\n\nexport interface IMultiplayerWebGameProps extends IBaseWebGameProps, ISyncableWebGameProps {\n enablePlayerTurnIndicators?: boolean;\n}\n\nexport interface IPuzzleWebGameProps extends IBaseWebGameProps, ISyncableWebGameProps {\n question: string;\n askHintPermission?: boolean;\n}\n\nexport interface ILessonWebGameProps extends IBaseWebGameProps, ISyncableWebGameProps {\n miniGameIdentifier: string;\n sessionId: string;\n targetQuestions: number;\n}\n\nexport interface ITableWebGameProps extends IBaseWebGameProps {\n tableNumber: number;\n infiniteModeHighScore?: number;\n}\n\nexport interface IVibrationPattern {\n pattern: number[] | number;\n}\n\nexport enum IStatsToAwardErrorCode {\n DEFAULT = 'default',\n SUCCESS = 'success',\n FAIL = 'fail',\n}\n\nexport interface IPlayerStats {\n points: number;\n accuracy: number;\n timeSpent: number;\n streakDays: number;\n streakStatusToday: 'pending' | 'completed';\n errorCode: IStatsToAwardErrorCode;\n outcome: ProjectOutcome;\n value: string;\n starEligibleTime?: number;\n starEligibleAccuracy?: number;\n starRewarded?: boolean;\n}\n\nexport interface IInfoMessage {\n message: string;\n position: 'top' | 'bottom';\n}\n\nexport interface ITrackEvent {\n eventName: typeof WEBVIEW_ANALYTICS_EVENTS;\n properties: Record<string, unknown>;\n}\n\nexport interface IWebViewProps extends IframeHTMLAttributes<HTMLIFrameElement> {\n baseUrl: string;\n projectDetails:\n | IMultiplayerWebGameProps\n | IPuzzleWebGameProps\n | ILessonWebGameProps\n | ITableWebGameProps;\n parentDomain: string;\n playerDetails: IPlayer;\n onBack?: () => void;\n onGameLoad?: () => void;\n onGamePlayFinish?: (playerStats: IPlayerStats) => void;\n handleInfoMessage?: (infoMessage: IInfoMessage) => void;\n}\n\nexport interface IMessageProps {\n event: `${WebViewEvent}`;\n payload: IVibrationPattern | IPlayerStats | IInfoMessage | null;\n}\n"],"names":["IStatsToAwardErrorCode"],"mappings":"AAmDY,IAAAA,sBAAAA,OACVA,EAAA,UAAU,WACVA,EAAA,UAAU,WACVA,EAAA,OAAO,QAHGA,IAAAA,KAAA,CAAA,CAAA;"}
|