@cuemath/leap 2.8.36-tables-beta-hg1 → 2.8.36-tables-beta-rj0
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/assets/line-icons/icons/carat-left.js +26 -0
- package/dist/assets/line-icons/icons/carat-left.js.map +1 -0
- package/dist/assets/line-icons/icons/carat-right.js +26 -0
- package/dist/assets/line-icons/icons/carat-right.js.map +1 -0
- package/dist/features/circle-games/enum/circle-onboarding-steps.js +1 -1
- package/dist/features/circle-games/enum/circle-onboarding-steps.js.map +1 -1
- package/dist/features/circle-games/game-launcher/comps/card-container/card-container.js +20 -11
- package/dist/features/circle-games/game-launcher/comps/card-container/card-container.js.map +1 -1
- package/dist/features/circle-games/game-launcher/comps/carousel/carousel.js +53 -47
- package/dist/features/circle-games/game-launcher/comps/carousel/carousel.js.map +1 -1
- package/dist/features/circle-games/game-launcher/comps/tables-card/tables-card.js +152 -123
- package/dist/features/circle-games/game-launcher/comps/tables-card/tables-card.js.map +1 -1
- package/dist/features/circle-games/game-launcher/dal/use-get-circle-home-details-dal/use-get-circle-home-details-dal.js +12 -11
- package/dist/features/circle-games/game-launcher/dal/use-get-circle-home-details-dal/use-get-circle-home-details-dal.js.map +1 -1
- package/dist/features/circle-games/game-launcher/game-launcher.js +79 -69
- 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/constants.js +9 -0
- package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/constants.js.map +1 -0
- package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.js +217 -0
- package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.js.map +1 -0
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/constants.js +6 -0
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/constants.js.map +1 -0
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey-styled.js +13 -0
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey-styled.js.map +1 -0
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.js +205 -0
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.js.map +1 -0
- package/dist/features/journey/journey-id/journey-id-student.js +1 -1
- package/dist/features/journey/journey-id/journey-id-student.js.map +1 -1
- package/dist/index.d.ts +8 -4
- package/package.json +1 -1
- package/dist/features/circle-games/game-launcher/use-game-launcher-journey/constants.js +0 -7
- package/dist/features/circle-games/game-launcher/use-game-launcher-journey/constants.js.map +0 -1
- package/dist/features/circle-games/game-launcher/use-game-launcher-journey/use-game-launcher-journey.js +0 -213
- package/dist/features/circle-games/game-launcher/use-game-launcher-journey/use-game-launcher-journey.js.map +0 -1
@@ -0,0 +1,205 @@
|
|
1
|
+
import { jsx as r, Fragment as L } from "react/jsx-runtime";
|
2
|
+
import { useRef as R, useCallback as b } 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 G } from "../../../../journey/journey-id/journey-id-student.js";
|
6
|
+
import { IndicatorType as d } from "../../../../journey/use-journey/constants.js";
|
7
|
+
import { useJourney as w } from "../../../../journey/use-journey/use-journey.js";
|
8
|
+
import J from "../../../../ui/buttons/icon-button/icon-button.js";
|
9
|
+
import { useUIContext as X } from "../../../../ui/context/context.js";
|
10
|
+
import I from "../../../../ui/layout/flex-view.js";
|
11
|
+
import u from "../../../../ui/text/text.js";
|
12
|
+
import { CIRCLE_ONBOARDING_ANALYTICS_STEPS as S } from "../../../enum/circle-onboarding-steps.js";
|
13
|
+
import { useCircleSounds as V } from "../../../hooks/use-circle-sounds/use-circle-sounds.js";
|
14
|
+
import { TablesCard as B } from "../../comps/tables-card/tables-card.js";
|
15
|
+
import { GAME_LAUNCHER_ANALYTICS_EVENTS as F } from "../../game-launcher-analytics-events.js";
|
16
|
+
import { TABLE_CARD_INDEX as v, PUZZLE_CARD_INDEX as M } from "./constants.js";
|
17
|
+
import { Indicator as j } from "./use-table-launcher-journey-styled.js";
|
18
|
+
const me = ({
|
19
|
+
carouselRefs: s,
|
20
|
+
onTableSegmentClick: O,
|
21
|
+
onJourneyComplete: _
|
22
|
+
}) => {
|
23
|
+
const e = G.CIRCLE_TABLES_INTRO_JOURNEY, t = R(null), p = R(null), N = R(!1), { playButtonSound: P } = V(), { nextCoachmark: i, setJourney: y, addCoachmark: c } = w(), { onEvent: T } = X(), C = b(
|
24
|
+
(o) => {
|
25
|
+
var l, a;
|
26
|
+
o && O(o), T(W.ONBOARDING_STEP_COMPLETED, {
|
27
|
+
step: S.TABLES
|
28
|
+
}), (l = t == null ? void 0 : t.current) == null || l.setLabelVisiblity(!0), (a = t == null ? void 0 : t.current) == null || a.stopLabelAnimation(), _(e), i(e, !1);
|
29
|
+
},
|
30
|
+
[e, i, _, O, T]
|
31
|
+
), H = b(
|
32
|
+
(o, l) => {
|
33
|
+
var m, g, h;
|
34
|
+
if (!((m = t.current) != null && m.segmentedCardWrapperRef.current) || !((g = t.current) != null && g.labelRef.current))
|
35
|
+
return;
|
36
|
+
const a = t.current.labelRef.current.getBoundingClientRect(), n = (h = t.current) == null ? void 0 : h.segmentedCardWrapperRef.current.getBoundingClientRect();
|
37
|
+
c(e, {
|
38
|
+
originalElementToHighlightRef: t.current.segmentedCardWrapperRef,
|
39
|
+
isActive: !1,
|
40
|
+
type: d.TOOLTIP,
|
41
|
+
elementToHighlight: /* @__PURE__ */ r(
|
42
|
+
B,
|
43
|
+
{
|
44
|
+
ref: p,
|
45
|
+
defaultTable: l,
|
46
|
+
label: o.label,
|
47
|
+
data: o.data,
|
48
|
+
onPress: C,
|
49
|
+
onGoBackFromTableLevel: C
|
50
|
+
}
|
51
|
+
),
|
52
|
+
indicator: {
|
53
|
+
position: "left",
|
54
|
+
backgroundColor: "YELLOW_4",
|
55
|
+
width: 236,
|
56
|
+
tooltipItem: /* @__PURE__ */ r(I, { children: /* @__PURE__ */ r(u, { $renderAs: "ab2-bold", children: "Each table has 3 levels—clear them and earn 3 stars!" }) }),
|
57
|
+
tooltipXCoOrdinates: 0,
|
58
|
+
tooltipYCoOrdinates: a.height * 0.35
|
59
|
+
}
|
60
|
+
}), c(e, {
|
61
|
+
originalElementToHighlightRef: t.current.segmentedCardWrapperRef,
|
62
|
+
isActive: !1,
|
63
|
+
type: d.NUDGE,
|
64
|
+
indicator: {
|
65
|
+
nudge: "click",
|
66
|
+
content: /* @__PURE__ */ r(u, { $renderAs: "ab1", $color: "WHITE", children: "Pick a level" }),
|
67
|
+
nudgePointerX: n.width / 2 + 50,
|
68
|
+
nudgePointerY: n.height * 0.4
|
69
|
+
},
|
70
|
+
elementToHighlight: /* @__PURE__ */ r(L, {})
|
71
|
+
}), i(e, !1, 100), i(e, !0, 2e3);
|
72
|
+
const E = setTimeout(() => {
|
73
|
+
var f;
|
74
|
+
clearTimeout(E), (f = p.current) == null || f.startLabelAnimation("YELLOW_4");
|
75
|
+
}, 3e3);
|
76
|
+
},
|
77
|
+
[c, C, e, i]
|
78
|
+
), A = b(() => {
|
79
|
+
var a;
|
80
|
+
P(), (a = s.current) == null || a.goToIndex(v), i(e, !1, 1e3), T(W.ONBOARDING_STEP_VIEWED, {
|
81
|
+
step: S.TABLES
|
82
|
+
});
|
83
|
+
const o = setTimeout(() => {
|
84
|
+
var n;
|
85
|
+
clearTimeout(o), (n = t.current) == null || n.setLabelVisiblity(!1), i(e, !0);
|
86
|
+
}, 3e3), l = setTimeout(() => {
|
87
|
+
var n;
|
88
|
+
clearTimeout(l), (n = p.current) == null || n.startLabelAnimation("YELLOW_4");
|
89
|
+
}, 3100);
|
90
|
+
}, [s, e, i, P, T]), U = b(
|
91
|
+
(o) => {
|
92
|
+
var g, h, f, Y, k, D;
|
93
|
+
if (N.current)
|
94
|
+
return;
|
95
|
+
const l = (g = s.current) == null ? void 0 : g.indicatorRefs, a = (h = s.current) == null ? void 0 : h.nextBtnRef, n = l == null ? void 0 : l[v];
|
96
|
+
if (!((f = t.current) != null && f.segmentedCardWrapperRef.current) || !((Y = t.current) != null && Y.labelRef.current) || !l || !(a != null && a.current) || !n || !n.current)
|
97
|
+
return;
|
98
|
+
N.current = !0;
|
99
|
+
const E = t.current.labelRef.current.getBoundingClientRect(), m = (k = t.current) == null ? void 0 : k.segmentedCardWrapperRef.current.getBoundingClientRect();
|
100
|
+
y(e, []), s.current.currentIndex === M ? (c(e, {
|
101
|
+
originalElementToHighlightRef: (D = s.current) == null ? void 0 : D.nextBtnRef,
|
102
|
+
isActive: !1,
|
103
|
+
type: d.NUDGE,
|
104
|
+
indicator: {
|
105
|
+
nudge: "click",
|
106
|
+
content: /* @__PURE__ */ r(u, { $renderAs: "ab1", $color: "WHITE", children: "Click to proceed" }),
|
107
|
+
nudgePointerX: 0,
|
108
|
+
nudgePointerY: 0
|
109
|
+
},
|
110
|
+
elementToHighlight: /* @__PURE__ */ r(
|
111
|
+
J,
|
112
|
+
{
|
113
|
+
renderAs: "secondary",
|
114
|
+
Icon: x,
|
115
|
+
onClick: A,
|
116
|
+
analyticsLabel: F.JOURNEY_NEXT_ACTIVITY
|
117
|
+
}
|
118
|
+
)
|
119
|
+
}), i(e, !1, 500)) : (c(e, {
|
120
|
+
originalElementToHighlightRef: n,
|
121
|
+
isActive: !1,
|
122
|
+
type: d.TOOLTIP,
|
123
|
+
elementToHighlight: /* @__PURE__ */ r(j, { $isActive: !1 }),
|
124
|
+
indicator: {
|
125
|
+
position: "bottom",
|
126
|
+
backgroundColor: "YELLOW_4",
|
127
|
+
width: 52,
|
128
|
+
tooltipItem: /* @__PURE__ */ r(
|
129
|
+
I,
|
130
|
+
{
|
131
|
+
$position: "absolute",
|
132
|
+
$flexDirection: "row",
|
133
|
+
style: { top: 6, left: 8, cursor: "pointer" },
|
134
|
+
onClick: A,
|
135
|
+
children: /* @__PURE__ */ r(u, { $renderAs: "ab2-bold", children: "NEW" })
|
136
|
+
}
|
137
|
+
),
|
138
|
+
tooltipYCoOrdinates: 14
|
139
|
+
// Need some offset in Y direction from top
|
140
|
+
}
|
141
|
+
}), c(e, {
|
142
|
+
originalElementToHighlightRef: n,
|
143
|
+
isActive: !1,
|
144
|
+
type: d.NUDGE,
|
145
|
+
indicator: {
|
146
|
+
nudge: "click",
|
147
|
+
content: "",
|
148
|
+
nudgePointerY: 20
|
149
|
+
},
|
150
|
+
elementToHighlight: /* @__PURE__ */ r(L, {})
|
151
|
+
}), i(e, !1, 500), i(e, !0, 1500)), c(e, {
|
152
|
+
originalElementToHighlightRef: t.current.labelRef,
|
153
|
+
isActive: !1,
|
154
|
+
type: d.TOOLTIP,
|
155
|
+
elementToHighlight: /* @__PURE__ */ r(L, {}),
|
156
|
+
indicator: {
|
157
|
+
position: "right",
|
158
|
+
backgroundColor: "YELLOW_4",
|
159
|
+
width: 264,
|
160
|
+
tooltipItem: /* @__PURE__ */ r(I, { children: /* @__PURE__ */ r(u, { $renderAs: "ab2-bold", children: "Get faster at multiplication! Practice everyday and become a Tables champ." }) }),
|
161
|
+
tooltipXCoOrdinates: E.width + 50,
|
162
|
+
tooltipYCoOrdinates: E.height / 2
|
163
|
+
}
|
164
|
+
}), c(e, {
|
165
|
+
originalElementToHighlightRef: t.current.segmentedCardWrapperRef,
|
166
|
+
isActive: !1,
|
167
|
+
type: d.NUDGE,
|
168
|
+
indicator: {
|
169
|
+
nudge: "click",
|
170
|
+
content: /* @__PURE__ */ r(u, { $renderAs: "ab1", $color: "WHITE", children: "Pick a table to start" }),
|
171
|
+
nudgePointerX: m.width / 2 + 50,
|
172
|
+
nudgePointerY: m.height / 2
|
173
|
+
},
|
174
|
+
elementToHighlight: /* @__PURE__ */ r(
|
175
|
+
B,
|
176
|
+
{
|
177
|
+
ref: p,
|
178
|
+
label: o.label,
|
179
|
+
data: o.data,
|
180
|
+
onPress: () => {
|
181
|
+
},
|
182
|
+
onPressTableSegment: ($) => H(o, $)
|
183
|
+
}
|
184
|
+
)
|
185
|
+
});
|
186
|
+
},
|
187
|
+
[
|
188
|
+
c,
|
189
|
+
s,
|
190
|
+
A,
|
191
|
+
H,
|
192
|
+
e,
|
193
|
+
i,
|
194
|
+
y
|
195
|
+
]
|
196
|
+
);
|
197
|
+
return {
|
198
|
+
tableRef: t,
|
199
|
+
startJourney: U
|
200
|
+
};
|
201
|
+
};
|
202
|
+
export {
|
203
|
+
me as useTableLauncherJourney
|
204
|
+
};
|
205
|
+
//# sourceMappingURL=use-table-launcher-journey.js.map
|
@@ -0,0 +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, 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 { PUZZLE_CARD_INDEX, TABLE_CARD_INDEX } 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 const originalTableRef = useRef<ITableCardRef>(null);\n const highlightedTableRef = useRef<ITableCardRef>(null);\n const isJourneyInProgress = useRef(false);\n\n const { playButtonSound } = useCircleSounds();\n const { nextCoachmark, setJourney, addCoachmark } = useJourney();\n const { onEvent: trackAnalytics } = useUIContext();\n\n const endJourney = 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 onJourneyComplete(journeyId);\n nextCoachmark(journeyId, false);\n },\n [journeyId, nextCoachmark, 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={endJourney}\n onGoBackFromTableLevel={endJourney}\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, 100); // Show coachmark => Each table has 3... and Hide the previous two\n nextCoachmark(journeyId, true, 2000); // Show nudge => Pick a level\n\n const startAnimationOnLabelAgain = setTimeout(() => {\n clearTimeout(startAnimationOnLabelAgain);\n highlightedTableRef.current?.startLabelAnimation('YELLOW_4');\n }, 3000);\n },\n [addCoachmark, endJourney, journeyId, nextCoachmark],\n );\n\n const goToTableLauncher = useCallback(() => {\n playButtonSound();\n carouselRefs.current?.goToIndex(TABLE_CARD_INDEX);\n nextCoachmark(journeyId, false, 1000);\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 }, 3000);\n\n const animateLabel = setTimeout(() => {\n clearTimeout(animateLabel);\n highlightedTableRef.current?.startLabelAnimation('YELLOW_4');\n }, 3100);\n }, [carouselRefs, journeyId, nextCoachmark, playButtonSound, trackAnalytics]);\n\n const startJourney = useCallback(\n (tablesData: ITables) => {\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 setJourney(journeyId, []);\n\n // TAKE THE USER TO THE TABLE CARD\n if (carouselRefs.current.currentIndex === PUZZLE_CARD_INDEX) {\n addCoachmark(journeyId, {\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 nextCoachmark(journeyId, false, 500); // Show nudge => Click to proceed\n } else {\n addCoachmark(journeyId, {\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 addCoachmark(journeyId, {\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 nextCoachmark(journeyId, false, 500); // Show Coachmark => NEW\n nextCoachmark(journeyId, true, 1500); // 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 return {\n tableRef: originalTableRef,\n startJourney,\n };\n};\n"],"names":["useTableLauncherJourney","carouselRefs","onTableSegmentClick","onJourneyComplete","journeyId","JOURNEY_ID_STUDENT","originalTableRef","useRef","highlightedTableRef","isJourneyInProgress","playButtonSound","useCircleSounds","nextCoachmark","setJourney","addCoachmark","useJourney","trackAnalytics","useUIContext","endJourney","useCallback","tableDetails","PLATFORM_EVENTS_STUDENT","Action","_a","_b","handleTableSegmentClick","launcherData","tableData","segmentedCardDims","tableCardDims","_c","IndicatorType","jsx","TablesCard","FlexView","Text","Fragment","startAnimationOnLabelAgain","goToTableLauncher","TABLE_CARD_INDEX","showNudge","animateLabel","startJourney","tablesData","paginationList","carouselNextBtnRef","tablePaginationRef","_d","labelDims","_e","PUZZLE_CARD_INDEX","_f","IconButton","CaratRightIcon","GAME_LAUNCHER_ANALYTICS_EVENTS","S.Indicator","tableInfo"],"mappings":"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"}
|
@@ -1,4 +1,4 @@
|
|
1
|
-
var E = /* @__PURE__ */ ((R) => (R.CIRCLE_ACTIVITIES_INTRO_JOURNEY = "CIRCLE_ACTIVITIES_INTRO_JOURNEY", R.CIRCLE_LEADERBOARD_INTRO_JOURNEY = "CIRCLE_LEADERBOARD_INTRO_JOURNEY", R.CIRCLE_POINTS_REWARD_JOURNEY = "CIRCLE_POINTS_REWARD_JOURNEY", R.CIRCLE_STREAK_UPDATE_JOURNEY = "CIRCLE_STREAK_UPDATE_JOURNEY", R.CIRCLE_TUTORIAL_JOURNEY = "CIRCLE_TUTORIAL_JOURNEY", R))(E || {});
|
1
|
+
var E = /* @__PURE__ */ ((R) => (R.CIRCLE_ACTIVITIES_INTRO_JOURNEY = "CIRCLE_ACTIVITIES_INTRO_JOURNEY", R.CIRCLE_LEADERBOARD_INTRO_JOURNEY = "CIRCLE_LEADERBOARD_INTRO_JOURNEY", R.CIRCLE_POINTS_REWARD_JOURNEY = "CIRCLE_POINTS_REWARD_JOURNEY", R.CIRCLE_STREAK_UPDATE_JOURNEY = "CIRCLE_STREAK_UPDATE_JOURNEY", R.CIRCLE_TUTORIAL_JOURNEY = "CIRCLE_TUTORIAL_JOURNEY", R.CIRCLE_TABLES_INTRO_JOURNEY = "CIRCLE_TABLES_INTRO_JOURNEY", R))(E || {});
|
2
2
|
export {
|
3
3
|
E as JOURNEY_ID_STUDENT
|
4
4
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"journey-id-student.js","sources":["../../../../src/features/journey/journey-id/journey-id-student.ts"],"sourcesContent":["export enum JOURNEY_ID_STUDENT {\n CIRCLE_ACTIVITIES_INTRO_JOURNEY = 'CIRCLE_ACTIVITIES_INTRO_JOURNEY',\n CIRCLE_LEADERBOARD_INTRO_JOURNEY = 'CIRCLE_LEADERBOARD_INTRO_JOURNEY',\n CIRCLE_POINTS_REWARD_JOURNEY = 'CIRCLE_POINTS_REWARD_JOURNEY',\n CIRCLE_STREAK_UPDATE_JOURNEY = 'CIRCLE_STREAK_UPDATE_JOURNEY',\n CIRCLE_TUTORIAL_JOURNEY = 'CIRCLE_TUTORIAL_JOURNEY',\n}\n"],"names":["JOURNEY_ID_STUDENT"],"mappings":"AAAY,IAAAA,sBAAAA,OACVA,EAAA,kCAAkC,mCAClCA,EAAA,mCAAmC,oCACnCA,EAAA,+BAA+B,gCAC/BA,EAAA,+BAA+B,gCAC/BA,EAAA,0BAA0B,
|
1
|
+
{"version":3,"file":"journey-id-student.js","sources":["../../../../src/features/journey/journey-id/journey-id-student.ts"],"sourcesContent":["export enum JOURNEY_ID_STUDENT {\n CIRCLE_ACTIVITIES_INTRO_JOURNEY = 'CIRCLE_ACTIVITIES_INTRO_JOURNEY',\n CIRCLE_LEADERBOARD_INTRO_JOURNEY = 'CIRCLE_LEADERBOARD_INTRO_JOURNEY',\n CIRCLE_POINTS_REWARD_JOURNEY = 'CIRCLE_POINTS_REWARD_JOURNEY',\n CIRCLE_STREAK_UPDATE_JOURNEY = 'CIRCLE_STREAK_UPDATE_JOURNEY',\n CIRCLE_TUTORIAL_JOURNEY = 'CIRCLE_TUTORIAL_JOURNEY',\n CIRCLE_TABLES_INTRO_JOURNEY = 'CIRCLE_TABLES_INTRO_JOURNEY',\n}\n"],"names":["JOURNEY_ID_STUDENT"],"mappings":"AAAY,IAAAA,sBAAAA,OACVA,EAAA,kCAAkC,mCAClCA,EAAA,mCAAmC,oCACnCA,EAAA,+BAA+B,gCAC/BA,EAAA,+BAA+B,gCAC/BA,EAAA,0BAA0B,2BAC1BA,EAAA,8BAA8B,+BANpBA,IAAAA,KAAA,CAAA,CAAA;"}
|
package/dist/index.d.ts
CHANGED
@@ -173,7 +173,8 @@ export declare enum CIRCLE_ONBOARDING_ANALYTICS_STEPS {
|
|
173
173
|
TUTORIAL = "tutorial",
|
174
174
|
POINTS = "points",
|
175
175
|
STREAK = "streak",
|
176
|
-
LEADERBOARD = "leaderboard"
|
176
|
+
LEADERBOARD = "leaderboard",
|
177
|
+
TABLES = "tables"
|
177
178
|
}
|
178
179
|
|
179
180
|
export declare enum CircleSoundKey {
|
@@ -880,6 +881,7 @@ declare interface ICoachMarkCompletion {
|
|
880
881
|
CIRCLE_POINTS_REWARD_JOURNEY: boolean;
|
881
882
|
CIRCLE_STREAK_UPDATE_JOURNEY: boolean;
|
882
883
|
CIRCLE_TUTORIAL_JOURNEY: boolean;
|
884
|
+
CIRCLE_TABLES_INTRO_JOURNEY: boolean;
|
883
885
|
}
|
884
886
|
|
885
887
|
export declare interface ICoachmarkProgress {
|
@@ -888,6 +890,7 @@ export declare interface ICoachmarkProgress {
|
|
888
890
|
CIRCLE_POINTS_REWARD_JOURNEY: boolean;
|
889
891
|
CIRCLE_STREAK_UPDATE_JOURNEY: boolean;
|
890
892
|
CIRCLE_TUTORIAL_JOURNEY: boolean;
|
893
|
+
CIRCLE_TABLES_INTRO_JOURNEY: boolean;
|
891
894
|
}
|
892
895
|
|
893
896
|
/**
|
@@ -2157,7 +2160,7 @@ export declare interface IProject<T> {
|
|
2157
2160
|
initialProgressValue?: number;
|
2158
2161
|
}
|
2159
2162
|
|
2160
|
-
declare interface IProjectData extends IProjects {
|
2163
|
+
export declare interface IProjectData extends IProjects {
|
2161
2164
|
tables?: ITablesData;
|
2162
2165
|
}
|
2163
2166
|
|
@@ -2627,7 +2630,7 @@ declare interface ITables_2 {
|
|
2627
2630
|
infinite_mode_high_score: number;
|
2628
2631
|
}
|
2629
2632
|
|
2630
|
-
declare interface ITablesData extends ITables {
|
2633
|
+
export declare interface ITablesData extends ITables {
|
2631
2634
|
openModesOfTable?: {
|
2632
2635
|
tableNumber: number;
|
2633
2636
|
rewardStars?: TTableMode[];
|
@@ -3309,7 +3312,8 @@ export declare enum JOURNEY_ID_STUDENT {
|
|
3309
3312
|
CIRCLE_LEADERBOARD_INTRO_JOURNEY = "CIRCLE_LEADERBOARD_INTRO_JOURNEY",
|
3310
3313
|
CIRCLE_POINTS_REWARD_JOURNEY = "CIRCLE_POINTS_REWARD_JOURNEY",
|
3311
3314
|
CIRCLE_STREAK_UPDATE_JOURNEY = "CIRCLE_STREAK_UPDATE_JOURNEY",
|
3312
|
-
CIRCLE_TUTORIAL_JOURNEY = "CIRCLE_TUTORIAL_JOURNEY"
|
3315
|
+
CIRCLE_TUTORIAL_JOURNEY = "CIRCLE_TUTORIAL_JOURNEY",
|
3316
|
+
CIRCLE_TABLES_INTRO_JOURNEY = "CIRCLE_TABLES_INTRO_JOURNEY"
|
3313
3317
|
}
|
3314
3318
|
|
3315
3319
|
export declare const JourneyProvider: FC<{
|
package/package.json
CHANGED
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"constants.js","sources":["../../../../../src/features/circle-games/game-launcher/use-game-launcher-journey/constants.ts"],"sourcesContent":["export const GO_TO_NEXT_SLIDE_AFTER_MS = 500;\nexport const SHOW_LABEL_HIGHLIGHT_AFTER_MS = 1500;\nexport const SHOW_NUDGE_AFTER_MS = 3000;\nexport const FIRST_COACHMARK_AFTER_MS = 200;\n"],"names":["GO_TO_NEXT_SLIDE_AFTER_MS","SHOW_LABEL_HIGHLIGHT_AFTER_MS","SHOW_NUDGE_AFTER_MS"],"mappings":"AAAO,MAAMA,IAA4B,KAC5BC,IAAgC,MAChCC,IAAsB;"}
|
@@ -1,213 +0,0 @@
|
|
1
|
-
import { jsx as e, Fragment as R } from "react/jsx-runtime";
|
2
|
-
import { useRef as u, useCallback as T, useMemo as ne } from "react";
|
3
|
-
import Q from "../../../../assets/line-icons/icons/next.js";
|
4
|
-
import { PLATFORM_EVENTS_STUDENT as j } from "../../../analytics-events/platform-events-student.js";
|
5
|
-
import { IndicatorType as s } from "../../../journey/use-journey/constants.js";
|
6
|
-
import { useJourney as ie } from "../../../journey/use-journey/use-journey.js";
|
7
|
-
import z from "../../../ui/buttons/icon-button/icon-button.js";
|
8
|
-
import { useUIContext as oe } from "../../../ui/context/context.js";
|
9
|
-
import I from "../../../ui/layout/flex-view.js";
|
10
|
-
import d from "../../../ui/text/text.js";
|
11
|
-
import { CIRCLE_ONBOARDING_ANALYTICS_STEPS as E } from "../../enum/circle-onboarding-steps.js";
|
12
|
-
import { useCircleSounds as le } from "../../hooks/use-circle-sounds/use-circle-sounds.js";
|
13
|
-
import { SegmentedGameCard as ce } from "../comps/segmented-game-card/segmented-game-card.js";
|
14
|
-
import { GAME_LAUNCHER_ANALYTICS_EVENTS as ee } from "../game-launcher-analytics-events.js";
|
15
|
-
import { GO_TO_NEXT_SLIDE_AFTER_MS as ae, SHOW_LABEL_HIGHLIGHT_AFTER_MS as se, SHOW_NUDGE_AFTER_MS as de } from "./constants.js";
|
16
|
-
import { ProjectType as he } from "../../games/web-view/enums/project-type-enum.js";
|
17
|
-
const Se = ({
|
18
|
-
onSegmentClick: L,
|
19
|
-
setCarouselIndex: O,
|
20
|
-
onJourneyComplete: b
|
21
|
-
}) => {
|
22
|
-
const c = u(null), i = u(null), r = u(null), a = u(null), C = u(!1), { playButtonSound: P } = le(), { nextCoachmark: o, setJourney: N } = ie(), { onEvent: f } = oe(), S = T(
|
23
|
-
(t) => {
|
24
|
-
f(j.ONBOARDING_STEP_VIEWED, {
|
25
|
-
step: t
|
26
|
-
});
|
27
|
-
},
|
28
|
-
[f]
|
29
|
-
), y = T(
|
30
|
-
(t) => {
|
31
|
-
f(j.ONBOARDING_STEP_COMPLETED, {
|
32
|
-
step: t
|
33
|
-
});
|
34
|
-
},
|
35
|
-
[f]
|
36
|
-
), h = T(
|
37
|
-
(t, l, n, g, p = !1) => {
|
38
|
-
p || (P(), O((_) => _ + 1), o(g, !1, ae)), S(t);
|
39
|
-
const A = setTimeout(() => {
|
40
|
-
clearTimeout(A), l.startLabelAnimation(n);
|
41
|
-
}, se);
|
42
|
-
o(g, !0, de);
|
43
|
-
},
|
44
|
-
[o, P, O, S]
|
45
|
-
), H = T(
|
46
|
-
(t, l) => {
|
47
|
-
L(t, he.PUZZLE), y(E.PUZZLE_ACTIVITY), o(l), b(l);
|
48
|
-
},
|
49
|
-
[o, b, L, y]
|
50
|
-
), G = T(
|
51
|
-
(t, l, n) => {
|
52
|
-
var w, Y, v, U, V, B, D, x, M, W, X, $, J, F, Z, K, q;
|
53
|
-
if (C.current || !((w = c == null ? void 0 : c.current) != null && w.nextBtnRef.current) || !((Y = r == null ? void 0 : r.current) != null && Y.segmentedCardWrapperRef.current) || !((v = i == null ? void 0 : i.current) != null && v.labelRef.current) || !((U = r == null ? void 0 : r.current) != null && U.labelRef.current) || !t)
|
54
|
-
return;
|
55
|
-
C.current = !0;
|
56
|
-
const g = ((D = (B = (V = a.current) == null ? void 0 : V.labelRef) == null ? void 0 : B.current) == null ? void 0 : D.getBoundingClientRect()) || {
|
57
|
-
height: 0,
|
58
|
-
width: 0
|
59
|
-
}, p = ((W = (M = (x = i.current) == null ? void 0 : x.labelRef) == null ? void 0 : M.current) == null ? void 0 : W.getBoundingClientRect()) || {
|
60
|
-
height: 0,
|
61
|
-
width: 0
|
62
|
-
}, A = ((J = ($ = (X = r.current) == null ? void 0 : X.labelRef) == null ? void 0 : $.current) == null ? void 0 : J.getBoundingClientRect()) || {
|
63
|
-
height: 0,
|
64
|
-
width: 0
|
65
|
-
}, _ = ((K = (Z = (F = r.current) == null ? void 0 : F.segmentedCardWrapperRef) == null ? void 0 : Z.current) == null ? void 0 : K.getBoundingClientRect()) || {
|
66
|
-
height: 0,
|
67
|
-
width: 0
|
68
|
-
};
|
69
|
-
let k = [];
|
70
|
-
l && a.current && (k = [
|
71
|
-
{
|
72
|
-
originalElementToHighlightRef: a.current.labelRef,
|
73
|
-
isActive: !1,
|
74
|
-
type: s.TOOLTIP,
|
75
|
-
elementToHighlight: /* @__PURE__ */ e(R, {}),
|
76
|
-
indicator: {
|
77
|
-
position: "right",
|
78
|
-
backgroundColor: "BLUE_4",
|
79
|
-
width: 264,
|
80
|
-
tooltipItem: /* @__PURE__ */ e(I, { children: /* @__PURE__ */ e(d, { $renderAs: "ab2-bold", children: "Get faster & stay ahead in school. Practice 3 new skills everyday." }) }),
|
81
|
-
tooltipXCoOrdinates: g.width + 50,
|
82
|
-
tooltipYCoOrdinates: g.height / 2
|
83
|
-
}
|
84
|
-
},
|
85
|
-
{
|
86
|
-
originalElementToHighlightRef: (q = c.current) == null ? void 0 : q.nextBtnRef,
|
87
|
-
isActive: !1,
|
88
|
-
type: s.NUDGE,
|
89
|
-
elementToHighlight: /* @__PURE__ */ e(
|
90
|
-
z,
|
91
|
-
{
|
92
|
-
renderAs: "secondary",
|
93
|
-
Icon: Q,
|
94
|
-
onClick: () => h(
|
95
|
-
E.GAMES_ACTIVITY,
|
96
|
-
i.current,
|
97
|
-
"ORANGE_4",
|
98
|
-
n
|
99
|
-
),
|
100
|
-
analyticsLabel: ee.JOURNEY_NEXT_ACTIVITY
|
101
|
-
}
|
102
|
-
),
|
103
|
-
indicator: {
|
104
|
-
nudge: "click",
|
105
|
-
content: /* @__PURE__ */ e(d, { $renderAs: "ab1", $color: "WHITE", children: "Click to proceed" }),
|
106
|
-
nudgePointerX: 0,
|
107
|
-
nudgePointerY: 0
|
108
|
-
}
|
109
|
-
}
|
110
|
-
]);
|
111
|
-
const te = [
|
112
|
-
{
|
113
|
-
originalElementToHighlightRef: i.current.labelRef,
|
114
|
-
isActive: !1,
|
115
|
-
type: s.TOOLTIP,
|
116
|
-
elementToHighlight: /* @__PURE__ */ e(R, {}),
|
117
|
-
indicator: {
|
118
|
-
position: "right",
|
119
|
-
backgroundColor: "ORANGE_4",
|
120
|
-
width: 264,
|
121
|
-
tooltipItem: /* @__PURE__ */ e(I, { children: /* @__PURE__ */ e(d, { $renderAs: "ab2-bold", children: "Train to think deeper & plan ahead. Play 3 new games everyday." }) }),
|
122
|
-
tooltipXCoOrdinates: p.width + 50,
|
123
|
-
tooltipYCoOrdinates: p.height / 2
|
124
|
-
}
|
125
|
-
},
|
126
|
-
{
|
127
|
-
originalElementToHighlightRef: c.current.nextBtnRef,
|
128
|
-
isActive: !1,
|
129
|
-
type: s.NUDGE,
|
130
|
-
elementToHighlight: /* @__PURE__ */ e(
|
131
|
-
z,
|
132
|
-
{
|
133
|
-
renderAs: "secondary",
|
134
|
-
Icon: Q,
|
135
|
-
onClick: () => h(
|
136
|
-
E.PUZZLE_ACTIVITY,
|
137
|
-
r.current,
|
138
|
-
"PURPLE_4",
|
139
|
-
n
|
140
|
-
),
|
141
|
-
analyticsLabel: ee.JOURNEY_NEXT_ACTIVITY
|
142
|
-
}
|
143
|
-
),
|
144
|
-
indicator: {
|
145
|
-
nudge: "click",
|
146
|
-
content: /* @__PURE__ */ e(d, { $renderAs: "ab1", $color: "WHITE", children: "Click to proceed" }),
|
147
|
-
nudgePointerX: 0,
|
148
|
-
nudgePointerY: 0
|
149
|
-
}
|
150
|
-
}
|
151
|
-
], re = [
|
152
|
-
{
|
153
|
-
originalElementToHighlightRef: r.current.labelRef,
|
154
|
-
isActive: !1,
|
155
|
-
type: s.TOOLTIP,
|
156
|
-
elementToHighlight: /* @__PURE__ */ e(R, {}),
|
157
|
-
indicator: {
|
158
|
-
position: "right",
|
159
|
-
backgroundColor: "PURPLE_4",
|
160
|
-
width: 264,
|
161
|
-
tooltipItem: /* @__PURE__ */ e(I, { children: /* @__PURE__ */ e(d, { $renderAs: "ab2-bold", children: "Think in new ways & stay sharp. Solve 3 new puzzles everyday." }) }),
|
162
|
-
tooltipXCoOrdinates: A.width + 50,
|
163
|
-
tooltipYCoOrdinates: A.height / 2
|
164
|
-
}
|
165
|
-
},
|
166
|
-
{
|
167
|
-
originalElementToHighlightRef: r.current.segmentedCardWrapperRef,
|
168
|
-
isActive: !1,
|
169
|
-
type: s.NUDGE,
|
170
|
-
elementToHighlight: /* @__PURE__ */ e(
|
171
|
-
ce,
|
172
|
-
{
|
173
|
-
label: "",
|
174
|
-
value: t.data.filter((m) => m.solved).length,
|
175
|
-
maxValue: t.data.length,
|
176
|
-
initialValue: t.initialProgressValue,
|
177
|
-
data: t.data.map((m) => ({
|
178
|
-
card: m.cardLottie,
|
179
|
-
name: "",
|
180
|
-
// We dont want to show the name of the puzzle in onboarding
|
181
|
-
isCompleted: m.solved,
|
182
|
-
onPress: () => H(m, n)
|
183
|
-
}))
|
184
|
-
}
|
185
|
-
),
|
186
|
-
indicator: {
|
187
|
-
nudge: "click",
|
188
|
-
content: /* @__PURE__ */ e(d, { $renderAs: "ab1", $color: "WHITE", children: "Click to solve a puzzle" }),
|
189
|
-
nudgePointerX: _.width * 0.6,
|
190
|
-
nudgePointerY: _.height * 0.4
|
191
|
-
}
|
192
|
-
}
|
193
|
-
];
|
194
|
-
N(n, [...k, ...te, ...re]), o(n), l && a.current ? h(E.SKILL_ACTIVITY, a.current, "BLUE_4", n, !0) : h(E.GAMES_ACTIVITY, i.current, "ORANGE_4", n, !0);
|
195
|
-
},
|
196
|
-
[H, h, o, N]
|
197
|
-
);
|
198
|
-
return ne(
|
199
|
-
() => ({
|
200
|
-
gameRefs: i,
|
201
|
-
puzzleRefs: r,
|
202
|
-
lessonRefs: a,
|
203
|
-
carouselNextBtnRef: c,
|
204
|
-
isJourneyInProgress: C,
|
205
|
-
startJourney: G
|
206
|
-
}),
|
207
|
-
[G]
|
208
|
-
);
|
209
|
-
};
|
210
|
-
export {
|
211
|
-
Se as useGameLauncherJourney
|
212
|
-
};
|
213
|
-
//# sourceMappingURL=use-game-launcher-journey.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"use-game-launcher-journey.js","sources":["../../../../../src/features/circle-games/game-launcher/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 { ICarouselRefs } from '../comps/carousel/carousel-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, useMemo, useRef } from 'react';\n\nimport NextIcon from '../../../../assets/line-icons/icons/next';\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} from './constants';\n\nexport const useGameLauncherJourney = ({\n onSegmentClick,\n setCarouselIndex,\n onJourneyComplete,\n}: IUseGameLauncherJourneyProps) => {\n const carouselNextBtnRef = useRef<ICarouselRefs>(null);\n const gameRefs = useRef<ISegmentedGameCardRefs>(null);\n const puzzleRefs = useRef<ISegmentedGameCardRefs>(null);\n const lessonRefs = useRef<ISegmentedGameCardRefs>(null);\n\n const isJourneyInProgress = useRef(false);\n\n const { playButtonSound } = useCircleSounds();\n const { nextCoachmark, setJourney } = 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 setCarouselIndex((prev: number) => prev + 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 nextCoachmark(journeyId, true, SHOW_NUDGE_AFTER_MS);\n },\n [nextCoachmark, playButtonSound, setCarouselIndex, trackEventViewed],\n );\n\n const endJourney = useCallback(\n (puzzlesData: Puzzle, journeyId: TJourneyId) => {\n onSegmentClick(puzzlesData, ProjectType.PUZZLE);\n trackEventCompleted(ActionEvent.PUZZLE_ACTIVITY);\n nextCoachmark(journeyId);\n onJourneyComplete(journeyId);\n },\n [nextCoachmark, onJourneyComplete, 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 !carouselNextBtnRef?.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: carouselNextBtnRef.current?.nextBtnRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n elementToHighlight: (\n <IconButton\n renderAs=\"secondary\"\n Icon={NextIcon}\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: carouselNextBtnRef.current.nextBtnRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n elementToHighlight: (\n <IconButton\n renderAs=\"secondary\"\n Icon={NextIcon}\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: () => endJourney(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 nextCoachmark(journeyId);\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 [endJourney, goToNextCard, nextCoachmark, setJourney],\n );\n\n const data = useMemo(\n () => ({\n gameRefs,\n puzzleRefs,\n lessonRefs,\n carouselNextBtnRef,\n isJourneyInProgress,\n startJourney,\n }),\n [startJourney],\n );\n\n return data;\n};\n"],"names":["useGameLauncherJourney","onSegmentClick","setCarouselIndex","onJourneyComplete","carouselNextBtnRef","useRef","gameRefs","puzzleRefs","lessonRefs","isJourneyInProgress","playButtonSound","useCircleSounds","nextCoachmark","setJourney","useJourney","trackAnalytics","useUIContext","trackEventViewed","useCallback","step","AnalyticsLabel","trackEventCompleted","goToNextCard","analyticsLabelViewed","refOfNextSlide","color","journeyId","isFirstSlide","prev","GO_TO_NEXT_SLIDE_AFTER_MS","animateLabelTimer","SHOW_LABEL_HIGHLIGHT_AFTER_MS","SHOW_NUDGE_AFTER_MS","endJourney","puzzlesData","ProjectType","ActionEvent","startJourney","isLessonAvailable","_a","_b","_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","NextIcon","GAME_LAUNCHER_ANALYTICS_EVENTS","gameSteps","puzzleSteps","SegmentedGameCard","puzzle","useMemo"],"mappings":"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"}
|