@cuemath/leap 3.3.25 → 3.3.26-akm-2
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/circle-games/game-launcher/comps/circular-game-card/circular-game-card-styled.js +48 -0
- package/dist/features/circle-games/game-launcher/comps/circular-game-card/circular-game-card-styled.js.map +1 -0
- package/dist/features/circle-games/game-launcher/comps/circular-game-card/circular-game-card.js +72 -0
- package/dist/features/circle-games/game-launcher/comps/circular-game-card/circular-game-card.js.map +1 -0
- package/dist/features/circle-games/game-launcher/comps/circular-game-card/constants.js +7 -0
- package/dist/features/circle-games/game-launcher/comps/circular-game-card/constants.js.map +1 -0
- package/dist/features/circle-games/game-launcher/comps/game-card-content/constants.js +6 -0
- package/dist/features/circle-games/game-launcher/comps/game-card-content/constants.js.map +1 -0
- package/dist/features/circle-games/game-launcher/comps/game-card-content/game-card-content-styled.js +62 -0
- package/dist/features/circle-games/game-launcher/comps/game-card-content/game-card-content-styled.js.map +1 -0
- package/dist/features/circle-games/game-launcher/comps/game-card-content/game-card-content.js +13 -0
- package/dist/features/circle-games/game-launcher/comps/game-card-content/game-card-content.js.map +1 -0
- package/dist/features/circle-games/game-launcher/comps/segmented-game-card/constants.js +2 -7
- package/dist/features/circle-games/game-launcher/comps/segmented-game-card/constants.js.map +1 -1
- package/dist/features/circle-games/game-launcher/dal/use-get-circle-home-details-dal/helper.js +12 -5
- package/dist/features/circle-games/game-launcher/dal/use-get-circle-home-details-dal/helper.js.map +1 -1
- package/dist/features/circle-games/game-launcher/game-launcher-v2.js +159 -0
- package/dist/features/circle-games/game-launcher/game-launcher-v2.js.map +1 -0
- package/dist/index.d.ts +10 -1
- package/dist/index.js +2 -2
- package/package.json +1 -1
- package/dist/features/circle-games/game-launcher/comps/segmented-game-card/segmented-game-card-styled.js +0 -138
- package/dist/features/circle-games/game-launcher/comps/segmented-game-card/segmented-game-card-styled.js.map +0 -1
- package/dist/features/circle-games/game-launcher/comps/segmented-game-card/segmented-game-card.js +0 -105
- package/dist/features/circle-games/game-launcher/comps/segmented-game-card/segmented-game-card.js.map +0 -1
- package/dist/features/circle-games/game-launcher/game-launcher.js +0 -219
- package/dist/features/circle-games/game-launcher/game-launcher.js.map +0 -1
- package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/constants.js +0 -8
- package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/constants.js.map +0 -1
- package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.js +0 -286
- package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.js.map +0 -1
- package/dist/features/circle-games/game-launcher/hooks/use-table-infinite-launcher-journey/constants.js +0 -10
- package/dist/features/circle-games/game-launcher/hooks/use-table-infinite-launcher-journey/constants.js.map +0 -1
- package/dist/features/circle-games/game-launcher/hooks/use-table-infinite-launcher-journey/use-table-infinite-launcher-journey-styled.js +0 -13
- package/dist/features/circle-games/game-launcher/hooks/use-table-infinite-launcher-journey/use-table-infinite-launcher-journey-styled.js.map +0 -1
- package/dist/features/circle-games/game-launcher/hooks/use-table-infinite-launcher-journey/use-table-infinite-launcher-journey.js +0 -137
- package/dist/features/circle-games/game-launcher/hooks/use-table-infinite-launcher-journey/use-table-infinite-launcher-journey.js.map +0 -1
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/constants.js +0 -14
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/constants.js.map +0 -1
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey-styled.js +0 -13
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey-styled.js.map +0 -1
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.js +0 -230
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.js.map +0 -1
|
@@ -1,286 +0,0 @@
|
|
|
1
|
-
import { jsx as t, Fragment as B } from "react/jsx-runtime";
|
|
2
|
-
import { useRef as U, useCallback as h, useMemo as _e, useEffect as Ie } from "react";
|
|
3
|
-
import { useTheme as Ce } from "styled-components";
|
|
4
|
-
import ae from "../../../../../assets/line-icons/icons/carat-right.js";
|
|
5
|
-
import { PLATFORM_EVENTS_STUDENT as de } from "../../../../analytics-events/platform-events-student.js";
|
|
6
|
-
import { JOURNEY_ID_STUDENT as Y } from "../../../../journey/journey-id/journey-id-student.js";
|
|
7
|
-
import { IndicatorType as d } from "../../../../journey/use-journey/constants.js";
|
|
8
|
-
import { useJourney as Ae } from "../../../../journey/use-journey/use-journey.js";
|
|
9
|
-
import Te from "../../../../ui/buttons/icon-button/icon-button.js";
|
|
10
|
-
import { useUIContext as fe } from "../../../../ui/context/context.js";
|
|
11
|
-
import k from "../../../../ui/layout/flex-view.js";
|
|
12
|
-
import T from "../../../../ui/text/text.js";
|
|
13
|
-
import { EDeviceType as Le } from "../../../../ui/theme/constants.js";
|
|
14
|
-
import { CIRCLE_ONBOARDING_ANALYTICS_STEPS as s } from "../../../enum/circle-onboarding-steps.js";
|
|
15
|
-
import { useCircleSounds as Oe } from "../../../hooks/use-circle-sounds/use-circle-sounds.js";
|
|
16
|
-
import { SegmentedGameCard as me } from "../../comps/segmented-game-card/segmented-game-card.js";
|
|
17
|
-
import { GAME_LAUNCHER_ANALYTICS_EVENTS as he } from "../../game-launcher-analytics-events.js";
|
|
18
|
-
import { GO_TO_NEXT_SLIDE_AFTER_MS as Re, SHOW_LABEL_HIGHLIGHT_AFTER_MS as Ne, SHOW_NUDGE_AFTER_MS as se, SLIDE_TO_LESSON_MS as be } from "./constants.js";
|
|
19
|
-
import { ProjectType as ge } from "../../../games/web-view/enums/project-type-enum.js";
|
|
20
|
-
const Fe = ({
|
|
21
|
-
carouselRefs: i,
|
|
22
|
-
onSegmentClick: A,
|
|
23
|
-
onJourneyComplete: f
|
|
24
|
-
}) => {
|
|
25
|
-
const { device: ue } = Ce(), g = ue < Le.TABLET, L = "ab3-bold", O = "ab2-bold", n = U(null), l = U(null), c = U(null), u = U([]), { playButtonSound: w } = Oe(), { nextCoachmark: m, setJourney: V, endJourney: R } = Ae(), { onEvent: N } = fe(), x = h(
|
|
26
|
-
(e) => {
|
|
27
|
-
N(de.ONBOARDING_STEP_VIEWED, {
|
|
28
|
-
step: e
|
|
29
|
-
});
|
|
30
|
-
},
|
|
31
|
-
[N]
|
|
32
|
-
), b = h(
|
|
33
|
-
(e) => {
|
|
34
|
-
N(de.ONBOARDING_STEP_COMPLETED, {
|
|
35
|
-
step: e
|
|
36
|
-
});
|
|
37
|
-
},
|
|
38
|
-
[N]
|
|
39
|
-
), E = h(
|
|
40
|
-
(e, r, a, S = !1, P) => {
|
|
41
|
-
var _, I;
|
|
42
|
-
S || (w(), (I = i.current) == null || I.goToIndex(((_ = i.current) == null ? void 0 : _.currentIndex) + 1), m(P, !1, Re)), x(e);
|
|
43
|
-
const p = setTimeout(() => {
|
|
44
|
-
clearTimeout(p), r.startLabelAnimation(a);
|
|
45
|
-
}, Ne);
|
|
46
|
-
u.current.push(p), m(P, !0, se);
|
|
47
|
-
},
|
|
48
|
-
[i, m, w, x]
|
|
49
|
-
), v = h(
|
|
50
|
-
(e, r) => {
|
|
51
|
-
A(e, ge.PUZZLE), b(s.PUZZLE_ACTIVITY), R(r), f(r);
|
|
52
|
-
},
|
|
53
|
-
[R, f, A, b]
|
|
54
|
-
), y = h(
|
|
55
|
-
(e, r) => {
|
|
56
|
-
A(e, ge.LESSON), b(s.SKILL_ACTIVITY), R(r), f(r);
|
|
57
|
-
},
|
|
58
|
-
[R, f, A, b]
|
|
59
|
-
), M = h(
|
|
60
|
-
(e, r, a) => {
|
|
61
|
-
var D, J, W, X, F, Z, K, q, Q, z, j, ee, te, re, ne, ie, oe, le, ce;
|
|
62
|
-
const S = !!a, P = !!r;
|
|
63
|
-
if (!((D = n == null ? void 0 : n.current) != null && D.segmentedCardWrapperRef.current) || (!((J = i == null ? void 0 : i.current) != null && J.nextBtnRef.current) || !((W = l == null ? void 0 : l.current) != null && W.labelRef.current) || !((X = c == null ? void 0 : c.current) != null && X.labelRef.current) || !r) && e === Y.CIRCLE_ACTIVITIES_INTRO_JOURNEY)
|
|
64
|
-
return;
|
|
65
|
-
const p = ((K = (Z = (F = n.current) == null ? void 0 : F.labelRef) == null ? void 0 : Z.current) == null ? void 0 : K.getBoundingClientRect()) || {
|
|
66
|
-
height: 0,
|
|
67
|
-
width: 0
|
|
68
|
-
}, _ = ((z = (Q = (q = l.current) == null ? void 0 : q.labelRef) == null ? void 0 : Q.current) == null ? void 0 : z.getBoundingClientRect()) || {
|
|
69
|
-
height: 0,
|
|
70
|
-
width: 0
|
|
71
|
-
}, I = ((te = (ee = (j = c.current) == null ? void 0 : j.labelRef) == null ? void 0 : ee.current) == null ? void 0 : te.getBoundingClientRect()) || {
|
|
72
|
-
height: 0,
|
|
73
|
-
width: 0
|
|
74
|
-
}, H = ((ie = (ne = (re = n.current) == null ? void 0 : re.segmentedCardWrapperRef) == null ? void 0 : ne.current) == null ? void 0 : ie.getBoundingClientRect()) || {
|
|
75
|
-
height: 0,
|
|
76
|
-
width: 0
|
|
77
|
-
};
|
|
78
|
-
let G = [];
|
|
79
|
-
if (S && n.current && (G = [
|
|
80
|
-
{
|
|
81
|
-
originalElementToHighlightRef: n.current.labelRef,
|
|
82
|
-
type: d.TOOLTIP,
|
|
83
|
-
elementToHighlight: /* @__PURE__ */ t(B, {}),
|
|
84
|
-
indicator: {
|
|
85
|
-
position: "top",
|
|
86
|
-
backgroundColor: "BLUE_4",
|
|
87
|
-
tooltipItem: /* @__PURE__ */ t(k, { children: /* @__PURE__ */ t(
|
|
88
|
-
T,
|
|
89
|
-
{
|
|
90
|
-
$renderOnMobileAs: L,
|
|
91
|
-
$renderAs: O,
|
|
92
|
-
children: "Get faster & stay ahead in school. Practice 3 new skills everyday."
|
|
93
|
-
}
|
|
94
|
-
) }),
|
|
95
|
-
tooltipXCoOrdinates: p.width / 2,
|
|
96
|
-
tooltipYCoOrdinates: p.height + 10
|
|
97
|
-
}
|
|
98
|
-
},
|
|
99
|
-
e === Y.CIRCLE_ACTIVITIES_INTRO_JOURNEY ? {
|
|
100
|
-
originalElementToHighlightRef: (oe = i.current) == null ? void 0 : oe.nextBtnRef,
|
|
101
|
-
type: d.NUDGE,
|
|
102
|
-
elementToHighlight: /* @__PURE__ */ t(
|
|
103
|
-
Te,
|
|
104
|
-
{
|
|
105
|
-
renderAs: "secondary",
|
|
106
|
-
Icon: ae,
|
|
107
|
-
onClick: () => E(
|
|
108
|
-
s.GAMES_ACTIVITY,
|
|
109
|
-
l.current,
|
|
110
|
-
"ORANGE_4",
|
|
111
|
-
!1,
|
|
112
|
-
e
|
|
113
|
-
),
|
|
114
|
-
analyticsLabel: he.JOURNEY_NEXT_ACTIVITY
|
|
115
|
-
}
|
|
116
|
-
),
|
|
117
|
-
indicator: {
|
|
118
|
-
nudge: "click",
|
|
119
|
-
content: !g && /* @__PURE__ */ t(T, { $renderAs: "ab1", $color: "WHITE", children: "Click to proceed" }),
|
|
120
|
-
nudgePointerX: 0,
|
|
121
|
-
nudgePointerY: 0
|
|
122
|
-
}
|
|
123
|
-
} : {
|
|
124
|
-
originalElementToHighlightRef: n.current.segmentedCardWrapperRef,
|
|
125
|
-
type: d.NUDGE,
|
|
126
|
-
elementToHighlight: /* @__PURE__ */ t(
|
|
127
|
-
me,
|
|
128
|
-
{
|
|
129
|
-
label: "",
|
|
130
|
-
value: a.data.filter((o) => o.status === "completed").length,
|
|
131
|
-
maxValue: a.data.length,
|
|
132
|
-
initialValue: a.initialProgressValue,
|
|
133
|
-
data: a.data.map((o) => ({
|
|
134
|
-
card: o.cardLottie,
|
|
135
|
-
name: "",
|
|
136
|
-
// We dont want to show the name of the puzzle in onboarding
|
|
137
|
-
isCompleted: o.status === "completed",
|
|
138
|
-
onPress: () => y(o, e)
|
|
139
|
-
}))
|
|
140
|
-
}
|
|
141
|
-
),
|
|
142
|
-
indicator: {
|
|
143
|
-
nudge: "click",
|
|
144
|
-
content: !g && /* @__PURE__ */ t(T, { $renderAs: "ab1", $color: "WHITE", children: "Tap here to get started" }),
|
|
145
|
-
nudgePointerX: H.width * 0.6,
|
|
146
|
-
nudgePointerY: H.height * 0.4
|
|
147
|
-
}
|
|
148
|
-
}
|
|
149
|
-
]), e === Y.CIRCLE_ACTIVITIES_INTRO_JOURNEY && l.current && c.current && P) {
|
|
150
|
-
const o = [
|
|
151
|
-
{
|
|
152
|
-
originalElementToHighlightRef: l.current.labelRef,
|
|
153
|
-
type: d.TOOLTIP,
|
|
154
|
-
elementToHighlight: /* @__PURE__ */ t(B, {}),
|
|
155
|
-
indicator: {
|
|
156
|
-
position: "top",
|
|
157
|
-
backgroundColor: "ORANGE_4",
|
|
158
|
-
tooltipItem: /* @__PURE__ */ t(k, { children: /* @__PURE__ */ t(
|
|
159
|
-
T,
|
|
160
|
-
{
|
|
161
|
-
$renderOnMobileAs: L,
|
|
162
|
-
$renderAs: O,
|
|
163
|
-
children: "Train to think deeper & plan ahead. Play 3 new games everyday."
|
|
164
|
-
}
|
|
165
|
-
) }),
|
|
166
|
-
tooltipXCoOrdinates: _.width / 2,
|
|
167
|
-
tooltipYCoOrdinates: _.height + 10
|
|
168
|
-
}
|
|
169
|
-
},
|
|
170
|
-
{
|
|
171
|
-
originalElementToHighlightRef: i.current.nextBtnRef,
|
|
172
|
-
type: d.NUDGE,
|
|
173
|
-
elementToHighlight: /* @__PURE__ */ t(
|
|
174
|
-
Te,
|
|
175
|
-
{
|
|
176
|
-
renderAs: "secondary",
|
|
177
|
-
Icon: ae,
|
|
178
|
-
onClick: () => E(
|
|
179
|
-
s.PUZZLE_ACTIVITY,
|
|
180
|
-
c.current,
|
|
181
|
-
"PURPLE_4",
|
|
182
|
-
!1,
|
|
183
|
-
e
|
|
184
|
-
),
|
|
185
|
-
analyticsLabel: he.JOURNEY_NEXT_ACTIVITY
|
|
186
|
-
}
|
|
187
|
-
),
|
|
188
|
-
indicator: {
|
|
189
|
-
nudge: "click",
|
|
190
|
-
content: !g && /* @__PURE__ */ t(T, { $renderAs: "ab1", $color: "WHITE", children: "Click to proceed" }),
|
|
191
|
-
nudgePointerX: 0,
|
|
192
|
-
nudgePointerY: 0
|
|
193
|
-
}
|
|
194
|
-
}
|
|
195
|
-
], pe = [
|
|
196
|
-
{
|
|
197
|
-
originalElementToHighlightRef: c.current.labelRef,
|
|
198
|
-
type: d.TOOLTIP,
|
|
199
|
-
elementToHighlight: /* @__PURE__ */ t(B, {}),
|
|
200
|
-
indicator: {
|
|
201
|
-
position: "top",
|
|
202
|
-
backgroundColor: "PURPLE_4",
|
|
203
|
-
tooltipItem: /* @__PURE__ */ t(k, { children: /* @__PURE__ */ t(
|
|
204
|
-
T,
|
|
205
|
-
{
|
|
206
|
-
$renderOnMobileAs: L,
|
|
207
|
-
$renderAs: O,
|
|
208
|
-
children: "Think in new ways & stay sharp. Solve 3 new puzzles everyday."
|
|
209
|
-
}
|
|
210
|
-
) }),
|
|
211
|
-
tooltipXCoOrdinates: I.width / 2,
|
|
212
|
-
tooltipYCoOrdinates: I.height + 10
|
|
213
|
-
}
|
|
214
|
-
},
|
|
215
|
-
{
|
|
216
|
-
originalElementToHighlightRef: c.current.segmentedCardWrapperRef,
|
|
217
|
-
type: d.NUDGE,
|
|
218
|
-
elementToHighlight: /* @__PURE__ */ t(
|
|
219
|
-
me,
|
|
220
|
-
{
|
|
221
|
-
label: "",
|
|
222
|
-
value: r.data.filter((C) => C.solved).length,
|
|
223
|
-
maxValue: r.data.length,
|
|
224
|
-
initialValue: r.initialProgressValue,
|
|
225
|
-
data: r.data.map((C) => ({
|
|
226
|
-
card: C.cardLottie,
|
|
227
|
-
name: "",
|
|
228
|
-
// We dont want to show the name of the puzzle in onboarding
|
|
229
|
-
isCompleted: C.solved,
|
|
230
|
-
onPress: () => v(C, e)
|
|
231
|
-
}))
|
|
232
|
-
}
|
|
233
|
-
),
|
|
234
|
-
indicator: {
|
|
235
|
-
nudge: "click",
|
|
236
|
-
content: !g && /* @__PURE__ */ t(T, { $renderAs: "ab1", $color: "WHITE", children: "Click to solve a puzzle" }),
|
|
237
|
-
nudgePointerX: H.width * 0.6,
|
|
238
|
-
nudgePointerY: H.height * 0.4
|
|
239
|
-
}
|
|
240
|
-
}
|
|
241
|
-
];
|
|
242
|
-
V(e, [...G, ...o, ...pe]);
|
|
243
|
-
} else
|
|
244
|
-
V(e, G);
|
|
245
|
-
(le = i.current) == null || le.goToIndex(0);
|
|
246
|
-
const $ = setTimeout(() => {
|
|
247
|
-
clearTimeout($), m(e);
|
|
248
|
-
}, be);
|
|
249
|
-
if (u.current.push($), e === Y.CIRCLE_ACTIVITIES_INTRO_JOURNEY)
|
|
250
|
-
S && n.current ? E(s.SKILL_ACTIVITY, n.current, "BLUE_4", !0, e) : E(s.GAMES_ACTIVITY, l.current, "ORANGE_4", !0, e);
|
|
251
|
-
else {
|
|
252
|
-
(ce = n.current) == null || ce.startLabelAnimation("BLUE_4");
|
|
253
|
-
const o = setTimeout(() => {
|
|
254
|
-
clearTimeout(o), m(e, !0);
|
|
255
|
-
}, se);
|
|
256
|
-
u.current.push(o);
|
|
257
|
-
}
|
|
258
|
-
},
|
|
259
|
-
[
|
|
260
|
-
i,
|
|
261
|
-
L,
|
|
262
|
-
O,
|
|
263
|
-
g,
|
|
264
|
-
V,
|
|
265
|
-
E,
|
|
266
|
-
y,
|
|
267
|
-
v,
|
|
268
|
-
m
|
|
269
|
-
]
|
|
270
|
-
), Ee = _e(
|
|
271
|
-
() => ({
|
|
272
|
-
gameRefs: l,
|
|
273
|
-
lessonRefs: n,
|
|
274
|
-
puzzleRefs: c,
|
|
275
|
-
startJourney: M
|
|
276
|
-
}),
|
|
277
|
-
[M]
|
|
278
|
-
);
|
|
279
|
-
return Ie(() => () => {
|
|
280
|
-
u.current.forEach((e) => clearTimeout(e)), u.current = [];
|
|
281
|
-
}, [i]), Ee;
|
|
282
|
-
};
|
|
283
|
-
export {
|
|
284
|
-
Fe as useGameLauncherJourney
|
|
285
|
-
};
|
|
286
|
-
//# 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/hooks/use-game-launcher-journey/use-game-launcher-journey.tsx"],"sourcesContent":["import type { TCoachmarkJourneyProps } 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 Lesson,\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';\nimport { useTheme } from 'styled-components';\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 { EDeviceType } from '../../../../ui/theme/constants';\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 { device } = useTheme();\n const isMobile = device < EDeviceType.TABLET;\n const tooltipTextRenderAsOnMobile = 'ab3-bold';\n const tooltipTextRenderAs = 'ab2-bold';\n\n const lessonRefs = useRef<ISegmentedGameCardRefs>(null);\n const gameRefs = useRef<ISegmentedGameCardRefs>(null);\n const puzzleRefs = 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 journeyId: JOURNEY_ID_STUDENT,\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 handleEndJourneyForPuzzle = useCallback(\n (puzzlesData: Puzzle, journeyId: JOURNEY_ID_STUDENT) => {\n onSegmentClick(puzzlesData, ProjectType.PUZZLE);\n trackEventCompleted(ActionEvent.PUZZLE_ACTIVITY);\n endJourney(journeyId);\n onJourneyComplete(journeyId);\n },\n [endJourney, onJourneyComplete, onSegmentClick, trackEventCompleted],\n );\n\n const handleEndJourneyForLesson = useCallback(\n (lessonsData: Lesson, journeyId: JOURNEY_ID_STUDENT) => {\n onSegmentClick(lessonsData, ProjectType.LESSON);\n trackEventCompleted(ActionEvent.SKILL_ACTIVITY);\n endJourney(journeyId);\n onJourneyComplete(journeyId);\n },\n [endJourney, onJourneyComplete, onSegmentClick, trackEventCompleted],\n );\n\n const startJourney = useCallback(\n (\n journeyId: JOURNEY_ID_STUDENT,\n puzzlesData?: IProject<Puzzle>,\n lessonsData?: IProject<Lesson>,\n ) => {\n // If element refs are not available return, this is just for type safety\n const isLessonAvailable = !!lessonsData;\n const isPuzzleAvailable = !!puzzlesData;\n\n if (!lessonRefs?.current?.segmentedCardWrapperRef.current) return;\n\n if (\n (!carouselRefs?.current?.nextBtnRef.current ||\n !gameRefs?.current?.labelRef.current ||\n !puzzleRefs?.current?.labelRef.current ||\n !puzzlesData) &&\n journeyId === JOURNEY_ID_STUDENT.CIRCLE_ACTIVITIES_INTRO_JOURNEY\n ) {\n return;\n }\n\n const lessonLabelDims = lessonRefs.current?.labelRef?.current?.getBoundingClientRect() || {\n height: 0,\n width: 0,\n };\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 lessonRefs.current?.segmentedCardWrapperRef?.current?.getBoundingClientRect() || {\n height: 0,\n width: 0,\n };\n\n let lessonSteps: TCoachmarkJourneyProps[] = [];\n\n if (isLessonAvailable && lessonRefs.current) {\n lessonSteps = [\n {\n originalElementToHighlightRef: lessonRefs.current.labelRef,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <></>,\n indicator: {\n position: 'top',\n backgroundColor: 'BLUE_4',\n tooltipItem: (\n <FlexView>\n <Text\n $renderOnMobileAs={tooltipTextRenderAsOnMobile}\n $renderAs={tooltipTextRenderAs}\n >\n Get faster & stay ahead in school. Practice 3 new skills everyday.\n </Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: lessonLabelDims.width / 2,\n tooltipYCoOrdinates: lessonLabelDims.height + 10,\n } as IArrowTooltipProps,\n },\n journeyId === JOURNEY_ID_STUDENT.CIRCLE_ACTIVITIES_INTRO_JOURNEY\n ? {\n originalElementToHighlightRef: carouselRefs.current?.nextBtnRef,\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 false,\n journeyId,\n )\n }\n analyticsLabel={GAME_LAUNCHER_ANALYTICS_EVENTS.JOURNEY_NEXT_ACTIVITY}\n />\n ),\n indicator: {\n nudge: 'click',\n content: !isMobile && (\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 originalElementToHighlightRef: lessonRefs.current.segmentedCardWrapperRef,\n type: IndicatorType.NUDGE,\n elementToHighlight: (\n <SegmentedGameCard\n label={''} // This is intentionally left blank to avoid showing the label\n value={lessonsData.data.filter(lesson => lesson.status === 'completed').length}\n maxValue={lessonsData.data.length}\n initialValue={lessonsData.initialProgressValue}\n data={lessonsData.data.map(lesson => ({\n card: lesson.cardLottie,\n name: '', // We dont want to show the name of the puzzle in onboarding\n isCompleted: lesson.status === 'completed',\n onPress: () => handleEndJourneyForLesson(lesson, journeyId),\n }))}\n />\n ),\n indicator: {\n nudge: 'click',\n content: !isMobile && (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n Tap here to get started\n </Text>\n ),\n nudgePointerX: launcherDims.width * 0.6,\n nudgePointerY: launcherDims.height * 0.4,\n } as INudgeProps,\n },\n ];\n }\n\n if (\n journeyId === JOURNEY_ID_STUDENT.CIRCLE_ACTIVITIES_INTRO_JOURNEY &&\n gameRefs.current &&\n puzzleRefs.current &&\n isPuzzleAvailable\n ) {\n const gameSteps: TCoachmarkJourneyProps[] = [\n {\n originalElementToHighlightRef: gameRefs.current.labelRef,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <></>,\n indicator: {\n position: 'top',\n backgroundColor: 'ORANGE_4',\n tooltipItem: (\n <FlexView>\n <Text\n $renderOnMobileAs={tooltipTextRenderAsOnMobile}\n $renderAs={tooltipTextRenderAs}\n >\n Train to think deeper & plan ahead. Play 3 new games everyday.\n </Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: gameLabelDims.width / 2,\n tooltipYCoOrdinates: gameLabelDims.height + 10,\n } as IArrowTooltipProps,\n },\n {\n originalElementToHighlightRef: carouselRefs.current.nextBtnRef,\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 false,\n journeyId,\n )\n }\n analyticsLabel={GAME_LAUNCHER_ANALYTICS_EVENTS.JOURNEY_NEXT_ACTIVITY}\n />\n ),\n indicator: {\n nudge: 'click',\n content: !isMobile && (\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: TCoachmarkJourneyProps[] = [\n {\n originalElementToHighlightRef: puzzleRefs.current.labelRef,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <></>,\n indicator: {\n position: 'top',\n backgroundColor: 'PURPLE_4',\n tooltipItem: (\n <FlexView>\n <Text\n $renderOnMobileAs={tooltipTextRenderAsOnMobile}\n $renderAs={tooltipTextRenderAs}\n >\n Think in new ways & stay sharp. Solve 3 new puzzles everyday.\n </Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: puzzleLabelDims.width / 2,\n tooltipYCoOrdinates: puzzleLabelDims.height + 10,\n } as IArrowTooltipProps,\n },\n {\n originalElementToHighlightRef: puzzleRefs.current.segmentedCardWrapperRef,\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: () => handleEndJourneyForPuzzle(puzzle, journeyId),\n }))}\n />\n ),\n indicator: {\n nudge: 'click',\n content: !isMobile && (\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 } else {\n setJourney(journeyId, lessonSteps);\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 (journeyId === JOURNEY_ID_STUDENT.CIRCLE_ACTIVITIES_INTRO_JOURNEY) {\n if (isLessonAvailable && lessonRefs.current) {\n goToNextCard(ActionEvent.SKILL_ACTIVITY, lessonRefs.current, 'BLUE_4', true, journeyId);\n } else {\n goToNextCard(ActionEvent.GAMES_ACTIVITY, gameRefs.current!, 'ORANGE_4', true, journeyId);\n }\n } else {\n lessonRefs.current?.startLabelAnimation('BLUE_4');\n const delayBeforeShowingNudge = setTimeout(() => {\n clearTimeout(delayBeforeShowingNudge);\n nextCoachmark(journeyId, true);\n }, SHOW_NUDGE_AFTER_MS);\n\n timerRefs.current.push(delayBeforeShowingNudge); // Store to cleanup later\n }\n },\n [\n carouselRefs,\n tooltipTextRenderAsOnMobile,\n tooltipTextRenderAs,\n isMobile,\n setJourney,\n goToNextCard,\n handleEndJourneyForLesson,\n handleEndJourneyForPuzzle,\n nextCoachmark,\n ],\n );\n\n const data = useMemo(\n () => ({\n gameRefs,\n lessonRefs,\n puzzleRefs,\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","device","useTheme","isMobile","EDeviceType","tooltipTextRenderAsOnMobile","tooltipTextRenderAs","lessonRefs","useRef","gameRefs","puzzleRefs","timerRefs","playButtonSound","useCircleSounds","nextCoachmark","setJourney","endJourney","useJourney","trackAnalytics","useUIContext","trackEventViewed","useCallback","step","AnalyticsLabel","trackEventCompleted","goToNextCard","analyticsLabelViewed","refOfNextSlide","color","isFirstSlide","journeyId","_b","_a","GO_TO_NEXT_SLIDE_AFTER_MS","animateLabelTimer","SHOW_LABEL_HIGHLIGHT_AFTER_MS","SHOW_NUDGE_AFTER_MS","handleEndJourneyForPuzzle","puzzlesData","ProjectType","ActionEvent","handleEndJourneyForLesson","lessonsData","startJourney","isLessonAvailable","isPuzzleAvailable","_c","_d","JOURNEY_ID_STUDENT","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","SegmentedGameCard","lesson","gameSteps","puzzleSteps","puzzle","_r","delayBeforeStart","SLIDE_TO_LESSON_MS","_s","delayBeforeShowingNudge","data","useMemo","useEffect","timer"],"mappings":"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"}
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
const _ = 0, A = 3, T = 500, E = 1500, I = 1e3, O = 3e3;
|
|
2
|
-
export {
|
|
3
|
-
I as GO_TO_TABLE_LAUNCHER_DURATION_MS,
|
|
4
|
-
_ as LESSON_CARD_INDEX,
|
|
5
|
-
O as SHOW_CLICK_TABLE_NUDGE_AFTER_MS,
|
|
6
|
-
T as SHOW_INITIAL_COACHMARK_AFTER_MS,
|
|
7
|
-
E as SHOW_INITIAL_TOOLTIP_AFTER_MS,
|
|
8
|
-
A as TABLE_CARD_INDEX
|
|
9
|
-
};
|
|
10
|
-
//# sourceMappingURL=constants.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"constants.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-table-infinite-launcher-journey/constants.ts"],"sourcesContent":["export const LESSON_CARD_INDEX = 0;\nexport const TABLE_CARD_INDEX = 3;\n\nexport const SHOW_INITIAL_COACHMARK_AFTER_MS = 500;\nexport const SHOW_INITIAL_TOOLTIP_AFTER_MS = 1500;\n\nexport const GO_TO_TABLE_LAUNCHER_DURATION_MS = 1000;\nexport const SHOW_CLICK_TABLE_NUDGE_AFTER_MS = 3000;\n"],"names":["LESSON_CARD_INDEX","TABLE_CARD_INDEX","SHOW_INITIAL_COACHMARK_AFTER_MS","SHOW_INITIAL_TOOLTIP_AFTER_MS","GO_TO_TABLE_LAUNCHER_DURATION_MS","SHOW_CLICK_TABLE_NUDGE_AFTER_MS"],"mappings":"AAAO,MAAMA,IAAoB,GACpBC,IAAmB,GAEnBC,IAAkC,KAClCC,IAAgC,MAEhCC,IAAmC,KACnCC,IAAkC;"}
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import t from "styled-components";
|
|
2
|
-
const i = t.div`
|
|
3
|
-
border: 1px solid ${({ theme: r }) => r.colors.WHITE};
|
|
4
|
-
height: 8px;
|
|
5
|
-
width: 8px;
|
|
6
|
-
border-radius: 100%;
|
|
7
|
-
background: ${({ theme: r, $isActive: o }) => o ? r.colors.WHITE : "transparent"};
|
|
8
|
-
cursor: pointer;
|
|
9
|
-
`;
|
|
10
|
-
export {
|
|
11
|
-
i as Indicator
|
|
12
|
-
};
|
|
13
|
-
//# sourceMappingURL=use-table-infinite-launcher-journey-styled.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"use-table-infinite-launcher-journey-styled.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-table-infinite-launcher-journey/use-table-infinite-launcher-journey-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const Indicator = styled.div<{ $isActive?: boolean }>`\n border: 1px solid ${({ theme }) => theme.colors.WHITE};\n height: 8px;\n width: 8px;\n border-radius: 100%;\n background: ${({ theme, $isActive }) => ($isActive ? theme.colors.WHITE : 'transparent')};\n cursor: pointer;\n`;\n"],"names":["Indicator","styled","theme","$isActive"],"mappings":";AAEO,MAAMA,IAAYC,EAAO;AAAA,sBACV,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA,gBAIvC,CAAC,EAAE,OAAAA,GAAO,WAAAC,QAAiBA,IAAYD,EAAM,OAAO,QAAQ,aAAc;AAAA;AAAA;"}
|
|
@@ -1,137 +0,0 @@
|
|
|
1
|
-
import { jsx as o, Fragment as M } from "react/jsx-runtime";
|
|
2
|
-
import { useRef as Y, useCallback as E, useEffect as w } from "react";
|
|
3
|
-
import { useTheme as G } from "styled-components";
|
|
4
|
-
import { PLATFORM_EVENTS_STUDENT as x } 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 p } from "../../../../journey/use-journey/constants.js";
|
|
7
|
-
import { useJourney as b } from "../../../../journey/use-journey/use-journey.js";
|
|
8
|
-
import { useUIContext as X } from "../../../../ui/context/context.js";
|
|
9
|
-
import P from "../../../../ui/layout/flex-view.js";
|
|
10
|
-
import R from "../../../../ui/text/text.js";
|
|
11
|
-
import { EDeviceType as $ } from "../../../../ui/theme/constants.js";
|
|
12
|
-
import { CIRCLE_ONBOARDING_ANALYTICS_STEPS as W } from "../../../enum/circle-onboarding-steps.js";
|
|
13
|
-
import { useCircleSounds as v } from "../../../hooks/use-circle-sounds/use-circle-sounds.js";
|
|
14
|
-
import { INFINITE_MODE_TEXT as V } from "../../comps/tables-card/constants.js";
|
|
15
|
-
import j from "../../comps/tables-card/infinite-button/infinite-mode-launcher-button.js";
|
|
16
|
-
import { TABLE_CARD_INDEX as l, GO_TO_TABLE_LAUNCHER_DURATION_MS as K, SHOW_CLICK_TABLE_NUDGE_AFTER_MS as k, LESSON_CARD_INDEX as q, SHOW_INITIAL_COACHMARK_AFTER_MS as z, SHOW_INITIAL_TOOLTIP_AFTER_MS as Q } from "./constants.js";
|
|
17
|
-
import { Indicator as Z } from "./use-table-infinite-launcher-journey-styled.js";
|
|
18
|
-
const tt = {
|
|
19
|
-
top: 6,
|
|
20
|
-
left: 8,
|
|
21
|
-
cursor: "pointer"
|
|
22
|
-
}, Nt = ({
|
|
23
|
-
carouselRefs: n,
|
|
24
|
-
originalTableRef: t,
|
|
25
|
-
onTableInfiniteModeClick: O,
|
|
26
|
-
onJourneyComplete: N
|
|
27
|
-
}) => {
|
|
28
|
-
const e = J.CIRCLE_TABLES_INFINTE_JOURNEY, { device: F } = G(), I = F === $.MOBILE ? "ab3-bold" : "ab2-bold", _ = Y([]), { playButtonSound: C } = v(), { nextCoachmark: c, setJourney: T, addCoachmark: h, endJourney: A } = b(), { onEvent: d } = X(), L = E(() => {
|
|
29
|
-
var r;
|
|
30
|
-
A(e), O(), d(x.ONBOARDING_STEP_COMPLETED, {
|
|
31
|
-
step: W.INFINITE_MODE
|
|
32
|
-
}), (r = t == null ? void 0 : t.current) == null || r.stopLabelAnimation(), N(e);
|
|
33
|
-
}, [
|
|
34
|
-
A,
|
|
35
|
-
e,
|
|
36
|
-
N,
|
|
37
|
-
O,
|
|
38
|
-
t,
|
|
39
|
-
d
|
|
40
|
-
]), s = E(
|
|
41
|
-
(r, u) => {
|
|
42
|
-
c(e, !1, r), d(x.ONBOARDING_STEP_VIEWED, {
|
|
43
|
-
step: W.INFINITE_MODE
|
|
44
|
-
});
|
|
45
|
-
const i = setTimeout(() => {
|
|
46
|
-
var m;
|
|
47
|
-
clearTimeout(i), (m = t.current) == null || m.startLabelAnimation("YELLOW_4"), t.current && t.current.labelRef.current && (t.current.labelRef.current.innerText = V), c(e, !0);
|
|
48
|
-
}, u);
|
|
49
|
-
_.current.push(i);
|
|
50
|
-
},
|
|
51
|
-
[e, c, t, d]
|
|
52
|
-
), a = E(() => {
|
|
53
|
-
var r;
|
|
54
|
-
C(), (r = n.current) == null || r.goToIndex(l), s(K, k);
|
|
55
|
-
}, [n, C, s]), U = E(() => {
|
|
56
|
-
var f, g, D, S, y, B, H;
|
|
57
|
-
const r = (f = n.current) == null ? void 0 : f.indicatorRefs, u = (g = n.current) == null ? void 0 : g.nextBtnRef, i = r == null ? void 0 : r[l];
|
|
58
|
-
if (!((D = t.current) != null && D.segmentedCardWrapperRef.current) || !((S = t.current) != null && S.labelRef.current) || !r || !(u != null && u.current) || !i || !i.current)
|
|
59
|
-
return;
|
|
60
|
-
const m = (y = t.current) == null ? void 0 : y.segmentedCardWrapperRef.current.getBoundingClientRect();
|
|
61
|
-
((B = n.current) == null ? void 0 : B.currentIndex) === l ? (T(e, []), s(0, k)) : (T(e, [
|
|
62
|
-
{
|
|
63
|
-
originalElementToHighlightRef: i,
|
|
64
|
-
type: p.TOOLTIP,
|
|
65
|
-
elementToHighlight: /* @__PURE__ */ o(Z, { $isActive: !1 }),
|
|
66
|
-
indicator: {
|
|
67
|
-
position: "bottom",
|
|
68
|
-
backgroundColor: "YELLOW_4",
|
|
69
|
-
width: 52,
|
|
70
|
-
tooltipItem: /* @__PURE__ */ o(
|
|
71
|
-
P,
|
|
72
|
-
{
|
|
73
|
-
$position: "absolute",
|
|
74
|
-
$flexDirection: "row",
|
|
75
|
-
style: tt,
|
|
76
|
-
onClick: a,
|
|
77
|
-
children: /* @__PURE__ */ o(R, { $renderAs: I, children: "NEW" })
|
|
78
|
-
}
|
|
79
|
-
),
|
|
80
|
-
tooltipYCoOrdinates: 14
|
|
81
|
-
// Need some offset in Y direction from top
|
|
82
|
-
}
|
|
83
|
-
},
|
|
84
|
-
{
|
|
85
|
-
originalElementToHighlightRef: i,
|
|
86
|
-
type: p.NUDGE,
|
|
87
|
-
indicator: {
|
|
88
|
-
nudge: "click",
|
|
89
|
-
content: "",
|
|
90
|
-
nudgePointerY: 20
|
|
91
|
-
},
|
|
92
|
-
elementToHighlight: /* @__PURE__ */ o(M, {})
|
|
93
|
-
}
|
|
94
|
-
]), (H = n.current) == null || H.goToIndex(q), c(e, !1, z), c(e, !0, Q)), h(e, {
|
|
95
|
-
originalElementToHighlightRef: t.current.segmentedCardWrapperRef,
|
|
96
|
-
type: p.TOOLTIP,
|
|
97
|
-
elementToHighlight: /* @__PURE__ */ o(M, {}),
|
|
98
|
-
indicator: {
|
|
99
|
-
position: "top",
|
|
100
|
-
backgroundColor: "YELLOW_4",
|
|
101
|
-
width: 260,
|
|
102
|
-
tooltipItem: /* @__PURE__ */ o(P, { children: /* @__PURE__ */ o(R, { $renderAs: I, children: "Challenge yourself in Infinity Mode! Break records and climb the leaderboard." }) }),
|
|
103
|
-
tooltipXCoOrdinates: m.width / 2,
|
|
104
|
-
tooltipYCoOrdinates: -(1 * m.height) / 3
|
|
105
|
-
}
|
|
106
|
-
}), h(e, {
|
|
107
|
-
originalElementToHighlightRef: t.current.infiniteButtonRef,
|
|
108
|
-
type: p.NUDGE,
|
|
109
|
-
indicator: {
|
|
110
|
-
nudge: "click",
|
|
111
|
-
nudgePointerX: 0,
|
|
112
|
-
nudgePointerY: 10
|
|
113
|
-
},
|
|
114
|
-
elementToHighlight: /* @__PURE__ */ o(j, { onClick: L })
|
|
115
|
-
});
|
|
116
|
-
}, [
|
|
117
|
-
h,
|
|
118
|
-
n,
|
|
119
|
-
a,
|
|
120
|
-
L,
|
|
121
|
-
e,
|
|
122
|
-
c,
|
|
123
|
-
t,
|
|
124
|
-
T,
|
|
125
|
-
s,
|
|
126
|
-
I
|
|
127
|
-
]);
|
|
128
|
-
return w(() => () => {
|
|
129
|
-
_.current.forEach((r) => clearTimeout(r)), _.current = [];
|
|
130
|
-
}, [e]), {
|
|
131
|
-
startJourney: U
|
|
132
|
-
};
|
|
133
|
-
};
|
|
134
|
-
export {
|
|
135
|
-
Nt as useTableInfiniteLauncherJourney
|
|
136
|
-
};
|
|
137
|
-
//# sourceMappingURL=use-table-infinite-launcher-journey.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"use-table-infinite-launcher-journey.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-table-infinite-launcher-journey/use-table-infinite-launcher-journey.tsx"],"sourcesContent":["import type { IArrowTooltipProps } from '../../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { INudgeProps } from '../../../../ui/nudge/nudge-types';\nimport type { IUseInfiniteTableJourneyProps } from './use-table-infinite-launcher-journey-types';\n\nimport { useCallback, useEffect, useRef } from 'react';\nimport { useTheme } from 'styled-components';\n\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 { useUIContext } from '../../../../ui/context/context';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport Text from '../../../../ui/text/text';\nimport { EDeviceType } from '../../../../ui/theme/constants';\nimport { CIRCLE_ONBOARDING_ANALYTICS_STEPS as Action } from '../../../enum/circle-onboarding-steps';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport { INFINITE_MODE_TEXT } from '../../comps/tables-card/constants';\nimport InfiniteButtonCard from '../../comps/tables-card/infinite-button/infinite-mode-launcher-button';\nimport { LESSON_CARD_INDEX, TABLE_CARD_INDEX } 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} from './constants';\nimport * as S from './use-table-infinite-launcher-journey-styled';\n\nconst tooltipItemStyle: React.CSSProperties = {\n top: 6,\n left: 8,\n cursor: 'pointer',\n};\n\nexport const useTableInfiniteLauncherJourney = ({\n carouselRefs,\n originalTableRef,\n onTableInfiniteModeClick,\n onJourneyComplete,\n}: IUseInfiniteTableJourneyProps) => {\n const journeyId = JOURNEY_ID_STUDENT.CIRCLE_TABLES_INFINTE_JOURNEY;\n\n const { device } = useTheme();\n const isMobile = device === EDeviceType.MOBILE;\n const tooltipTextRenderAs = isMobile ? 'ab3-bold' : 'ab2-bold';\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 endJourney(journeyId);\n // Only when User clicked on play\n onTableInfiniteModeClick();\n\n trackAnalytics(PLATFORM_EVENTS_STUDENT.ONBOARDING_STEP_COMPLETED, {\n step: Action.INFINITE_MODE,\n });\n // Reset original table card ref label\n originalTableRef?.current?.stopLabelAnimation();\n onJourneyComplete(journeyId);\n }, [\n endJourney,\n journeyId,\n onJourneyComplete,\n onTableInfiniteModeClick,\n originalTableRef,\n trackAnalytics,\n ]);\n\n const showToolTipAndNudge = useCallback(\n (dealyToShowToolTip: number, delayToShowNudge: number) => {\n nextCoachmark(journeyId, false, dealyToShowToolTip);\n\n trackAnalytics(PLATFORM_EVENTS_STUDENT.ONBOARDING_STEP_VIEWED, {\n step: Action.INFINITE_MODE,\n });\n\n const showNudge = setTimeout(() => {\n clearTimeout(showNudge);\n\n originalTableRef.current?.startLabelAnimation('YELLOW_4');\n if (originalTableRef.current && originalTableRef.current.labelRef.current) {\n originalTableRef.current.labelRef.current.innerText = INFINITE_MODE_TEXT;\n }\n nextCoachmark(journeyId, true);\n }, delayToShowNudge);\n\n timerRefs.current.push(showNudge);\n },\n [journeyId, nextCoachmark, originalTableRef, trackAnalytics],\n );\n\n const goToTableLauncher = useCallback(() => {\n playButtonSound();\n carouselRefs.current?.goToIndex(TABLE_CARD_INDEX);\n showToolTipAndNudge(GO_TO_TABLE_LAUNCHER_DURATION_MS, SHOW_CLICK_TABLE_NUDGE_AFTER_MS);\n }, [carouselRefs, playButtonSound, showToolTipAndNudge]);\n\n const startJourney = useCallback(() => {\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 tableCardDims =\n originalTableRef.current?.segmentedCardWrapperRef.current.getBoundingClientRect();\n\n // USER ON TABLE CARD\n if (carouselRefs.current?.currentIndex === TABLE_CARD_INDEX) {\n setJourney(journeyId, []);\n showToolTipAndNudge(0, SHOW_CLICK_TABLE_NUDGE_AFTER_MS);\n } else {\n // USER ON LESSON CARD\n setJourney(journeyId, [\n {\n originalElementToHighlightRef: tablePaginationRef as React.RefObject<HTMLDivElement>,\n\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={tooltipItemStyle}\n onClick={goToTableLauncher}\n >\n <Text $renderAs={tooltipTextRenderAs}>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\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 INFINITE MODE\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <></>,\n indicator: {\n position: 'top',\n backgroundColor: 'YELLOW_4',\n width: 260,\n tooltipItem: (\n <FlexView>\n <Text $renderAs={tooltipTextRenderAs}>\n Challenge yourself in Infinity Mode! Break records and climb the leaderboard.\n </Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: tableCardDims.width / 2,\n tooltipYCoOrdinates: -(1 * tableCardDims.height) / 3,\n } as IArrowTooltipProps,\n });\n\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.infiniteButtonRef,\n\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n nudgePointerX: 0,\n nudgePointerY: 10,\n } as INudgeProps,\n elementToHighlight: <InfiniteButtonCard onClick={handleEndJourney} />,\n });\n }, [\n addCoachmark,\n carouselRefs,\n goToTableLauncher,\n handleEndJourney,\n journeyId,\n nextCoachmark,\n originalTableRef,\n setJourney,\n showToolTipAndNudge,\n tooltipTextRenderAs,\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 startJourney,\n };\n};\n"],"names":["tooltipItemStyle","useTableInfiniteLauncherJourney","carouselRefs","originalTableRef","onTableInfiniteModeClick","onJourneyComplete","journeyId","JOURNEY_ID_STUDENT","device","useTheme","tooltipTextRenderAs","EDeviceType","timerRefs","useRef","playButtonSound","useCircleSounds","nextCoachmark","setJourney","addCoachmark","endJourney","useJourney","trackAnalytics","useUIContext","handleEndJourney","useCallback","PLATFORM_EVENTS_STUDENT","Action","_a","showToolTipAndNudge","dealyToShowToolTip","delayToShowNudge","showNudge","INFINITE_MODE_TEXT","goToTableLauncher","TABLE_CARD_INDEX","GO_TO_TABLE_LAUNCHER_DURATION_MS","SHOW_CLICK_TABLE_NUDGE_AFTER_MS","startJourney","paginationList","carouselNextBtnRef","_b","tablePaginationRef","_c","_d","tableCardDims","_e","_f","IndicatorType","jsx","S.Indicator","FlexView","Text","Fragment","_g","LESSON_CARD_INDEX","SHOW_INITIAL_COACHMARK_AFTER_MS","SHOW_INITIAL_TOOLTIP_AFTER_MS","InfiniteButtonCard","useEffect","timer"],"mappings":"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"}
|
package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/constants.js
DELETED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
const _ = 0, E = 2, A = 3, T = 500, L = 1500, I = 1e3, O = 3e3, S = 3100, N = 100, C = 3e3;
|
|
2
|
-
export {
|
|
3
|
-
I as GO_TO_TABLE_LAUNCHER_DURATION_MS,
|
|
4
|
-
_ as LESSON_CARD_INDEX,
|
|
5
|
-
E as PUZZLE_CARD_INDEX,
|
|
6
|
-
O as SHOW_CLICK_TABLE_NUDGE_AFTER_MS,
|
|
7
|
-
T as SHOW_INITIAL_COACHMARK_AFTER_MS,
|
|
8
|
-
L as SHOW_INITIAL_TOOLTIP_AFTER_MS,
|
|
9
|
-
C as SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS,
|
|
10
|
-
N as SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS,
|
|
11
|
-
S as START_ANIMATING_CLONED_ELEM,
|
|
12
|
-
A as TABLE_CARD_INDEX
|
|
13
|
-
};
|
|
14
|
-
//# sourceMappingURL=constants.js.map
|
package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/constants.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"constants.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-table-launcher-journey/constants.ts"],"sourcesContent":["export const LESSON_CARD_INDEX = 0;\nexport const PUZZLE_CARD_INDEX = 2;\nexport const TABLE_CARD_INDEX = 3;\n\nexport const SHOW_INITIAL_COACHMARK_AFTER_MS = 500;\nexport const SHOW_INITIAL_TOOLTIP_AFTER_MS = 1500;\n\nexport const GO_TO_TABLE_LAUNCHER_DURATION_MS = 1000;\nexport const SHOW_CLICK_TABLE_NUDGE_AFTER_MS = 3000;\nexport const START_ANIMATING_CLONED_ELEM = SHOW_CLICK_TABLE_NUDGE_AFTER_MS + 100;\n\nexport const SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS = 100;\nexport const SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS = 3000;\n"],"names":["LESSON_CARD_INDEX","PUZZLE_CARD_INDEX","TABLE_CARD_INDEX","SHOW_INITIAL_COACHMARK_AFTER_MS","SHOW_INITIAL_TOOLTIP_AFTER_MS","GO_TO_TABLE_LAUNCHER_DURATION_MS","SHOW_CLICK_TABLE_NUDGE_AFTER_MS","START_ANIMATING_CLONED_ELEM","SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS","SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS"],"mappings":"AAAO,MAAMA,IAAoB,GACpBC,IAAoB,GACpBC,IAAmB,GAEnBC,IAAkC,KAClCC,IAAgC,MAEhCC,IAAmC,KACnCC,IAAkC,KAClCC,IAA8B,MAE9BC,IAAqC,KACrCC,IAAmC;"}
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import t from "styled-components";
|
|
2
|
-
const i = t.div`
|
|
3
|
-
border: 1px solid ${({ theme: r }) => r.colors.WHITE};
|
|
4
|
-
height: 8px;
|
|
5
|
-
width: 8px;
|
|
6
|
-
border-radius: 100%;
|
|
7
|
-
background: ${({ theme: r, $isActive: o }) => o ? r.colors.WHITE : "transparent"};
|
|
8
|
-
cursor: pointer;
|
|
9
|
-
`;
|
|
10
|
-
export {
|
|
11
|
-
i as Indicator
|
|
12
|
-
};
|
|
13
|
-
//# sourceMappingURL=use-table-launcher-journey-styled.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"use-table-launcher-journey-styled.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const Indicator = styled.div<{ $isActive?: boolean }>`\n border: 1px solid ${({ theme }) => theme.colors.WHITE};\n height: 8px;\n width: 8px;\n border-radius: 100%;\n background: ${({ theme, $isActive }) => ($isActive ? theme.colors.WHITE : 'transparent')};\n cursor: pointer;\n`;\n"],"names":["Indicator","styled","theme","$isActive"],"mappings":";AAEO,MAAMA,IAAYC,EAAO;AAAA,sBACV,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA,gBAIvC,CAAC,EAAE,OAAAA,GAAO,WAAAC,QAAiBA,IAAYD,EAAM,OAAO,QAAQ,aAAc;AAAA;AAAA;"}
|