lido-player 0.0.2-alpha-31 → 0.0.2-alpha-33
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/cjs/index.cjs.js +1 -1
- package/dist/cjs/lido-avatar_18.cjs.entry.js +14 -4
- package/dist/cjs/{utils-8016d4a2.js → utils-07b2249f.js} +17 -5
- package/dist/collection/components/home/lido-home.js +11 -1
- package/dist/collection/components/trace/lido-trace.css +1 -1
- package/dist/collection/components/trace/lido-trace.js +2 -2
- package/dist/collection/stories/Templates/RocketGame/rocketGame.stories.js +10 -10
- package/dist/collection/stories/Templates/grid/grid.stories.js +48 -48
- package/dist/collection/stories/Templates/writeLetter/writeLetter.stories.js +1 -1
- package/dist/collection/stories/Templates/writeWord/writeWord.stories.js +1 -1
- package/dist/collection/utils/utils.js +0 -1
- package/dist/collection/utils/utilsHandlers/clickHandler.js +10 -3
- package/dist/collection/utils/utilsHandlers/floatHandler.js +6 -1
- package/dist/components/index.js +1 -1
- package/dist/components/lido-avatar.js +1 -1
- package/dist/components/lido-cell.js +1 -1
- package/dist/components/lido-col.js +1 -1
- package/dist/components/lido-container.js +1 -1
- package/dist/components/lido-flash-card.js +1 -1
- package/dist/components/lido-float.js +1 -1
- package/dist/components/lido-home.js +1 -1
- package/dist/components/lido-image.js +1 -1
- package/dist/components/lido-keyboard.js +1 -1
- package/dist/components/lido-pos.js +1 -1
- package/dist/components/lido-random.js +1 -1
- package/dist/components/lido-root.js +18 -18
- package/dist/components/lido-row.js +1 -1
- package/dist/components/lido-shape.js +1 -1
- package/dist/components/lido-slide-fill.js +1 -1
- package/dist/components/lido-text.js +1 -1
- package/dist/components/lido-trace.js +1 -1
- package/dist/components/lido-wrap.js +1 -1
- package/dist/components/{p-3011bd07.js → p-4f726fb5.js} +1 -1
- package/dist/components/{p-6c8823fb.js → p-66a06c78.js} +1 -1
- package/dist/components/{p-9644d545.js → p-6a7d604b.js} +1 -1
- package/dist/components/{p-1ba1ba7e.js → p-6cb00626.js} +1 -1
- package/dist/components/{p-473deb9a.js → p-72d16bea.js} +1 -1
- package/dist/components/{p-b793e8a1.js → p-7a22083e.js} +1 -1
- package/dist/components/{p-db0126ad.js → p-891ef62d.js} +17 -6
- package/dist/components/{p-a8c66621.js → p-963af660.js} +1 -1
- package/dist/components/{p-6eb82786.js → p-9cb1af1a.js} +1 -1
- package/dist/components/{p-e7736cbe.js → p-a9e29b2f.js} +1 -1
- package/dist/components/{p-84b90bd5.js → p-ac57a4e2.js} +4 -4
- package/dist/components/{p-f08b200e.js → p-affc10b9.js} +1 -1
- package/dist/components/{p-47fb86ae.js → p-b8a8822b.js} +1 -1
- package/dist/components/{p-42bdc6cc.js → p-cbba1f37.js} +2 -2
- package/dist/components/{p-e5ce940e.js → p-d00f3288.js} +1 -1
- package/dist/components/{p-5f3ebc1b.js → p-dd8aa1c2.js} +27 -17
- package/dist/components/{p-01e57228.js → p-effc1618.js} +1 -1
- package/dist/components/{p-17348182.js → p-fb18186b.js} +1 -1
- package/dist/esm/index.js +1 -1
- package/dist/esm/lido-avatar_18.entry.js +14 -4
- package/dist/esm/{utils-438c94f7.js → utils-f0e0b5c8.js} +17 -6
- package/dist/lido-player/index.esm.js +1 -1
- package/dist/lido-player/lido-player.esm.js +1 -1
- package/dist/lido-player/p-169fbe16.entry.js +1 -0
- package/dist/lido-player/{p-767fa5fb.js → p-918b6138.js} +1 -1
- package/package.json +1 -1
- package/dist/lido-player/p-15613ed8.entry.js +0 -1
package/dist/cjs/index.cjs.js
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
const index = require('./index-fe562525.js');
|
|
6
|
-
const utils = require('./utils-
|
|
6
|
+
const utils = require('./utils-07b2249f.js');
|
|
7
7
|
|
|
8
8
|
var rive = {exports: {}};
|
|
9
9
|
|
|
@@ -7116,6 +7116,7 @@ const LidoHome = class {
|
|
|
7116
7116
|
if (index != undefined && index < this.containers.length) {
|
|
7117
7117
|
// Move to the next container
|
|
7118
7118
|
this.currentContainerIndex = index;
|
|
7119
|
+
console.log("container index ; ", this.currentContainerIndex);
|
|
7119
7120
|
// window.dispatchEvent(new CustomEvent('activityChange', { detail: { index: this.currentContainerIndex } }));
|
|
7120
7121
|
utils.dispatchActivityChangeEvent(this.currentContainerIndex);
|
|
7121
7122
|
}
|
|
@@ -7128,6 +7129,7 @@ const LidoHome = class {
|
|
|
7128
7129
|
else if (this.currentContainerIndex >= this.containers.length - 1) {
|
|
7129
7130
|
// const event = new CustomEvent('gameCompleted');
|
|
7130
7131
|
// window.dispatchEvent(event);
|
|
7132
|
+
localStorage.removeItem(utils.ActivityScoreKey);
|
|
7131
7133
|
utils.dispatchGameCompletedEvent();
|
|
7132
7134
|
this.currentContainerIndex = null;
|
|
7133
7135
|
}
|
|
@@ -7180,6 +7182,8 @@ const LidoHome = class {
|
|
|
7180
7182
|
if (alertElement) {
|
|
7181
7183
|
if (comment === 'exit') {
|
|
7182
7184
|
utils.dispatchGameExitEvent();
|
|
7185
|
+
utils.AudioPlayer.getI().stop();
|
|
7186
|
+
localStorage.removeItem(utils.ActivityScoreKey);
|
|
7183
7187
|
utils.clearLocalStorage();
|
|
7184
7188
|
alertElement.remove();
|
|
7185
7189
|
}
|
|
@@ -7214,6 +7218,10 @@ const LidoHome = class {
|
|
|
7214
7218
|
next: this.nextButtonUrl || utils.nextUrl,
|
|
7215
7219
|
speak: this.speakerButtonUrl || utils.speakUrl,
|
|
7216
7220
|
};
|
|
7221
|
+
if (this.currentContainerIndex === 0) {
|
|
7222
|
+
localStorage.removeItem(utils.ActivityScoreKey);
|
|
7223
|
+
utils.clearLocalStorage();
|
|
7224
|
+
}
|
|
7217
7225
|
// Listen for 'NextContainerKey' event to transition between containers
|
|
7218
7226
|
window.addEventListener(utils.NextContainerKey, () => {
|
|
7219
7227
|
this.NextContainerKey();
|
|
@@ -7228,6 +7236,8 @@ const LidoHome = class {
|
|
|
7228
7236
|
this.parseXMLData(this.xmlData);
|
|
7229
7237
|
// Remove stored values in localStorage when the page is about to be unloaded
|
|
7230
7238
|
window.addEventListener('beforeunload', () => {
|
|
7239
|
+
utils.AudioPlayer.getI().stop();
|
|
7240
|
+
localStorage.removeItem(utils.ActivityScoreKey);
|
|
7231
7241
|
utils.clearLocalStorage();
|
|
7232
7242
|
});
|
|
7233
7243
|
}
|
|
@@ -11114,7 +11124,7 @@ const LidoText = class {
|
|
|
11114
11124
|
};
|
|
11115
11125
|
LidoText.style = LidoTextStyle0;
|
|
11116
11126
|
|
|
11117
|
-
const lidoTraceCss = ":host{display:block;position:relative}#lido-svgContainer{display:flex;justify-content:center;align-items:center;overflow:hidden}svg{width:100%;height:100%;max-height:calc(100vh - 50px);touch-action:none}#lido-draggableCircle{cursor:pointer;fill:#
|
|
11127
|
+
const lidoTraceCss = ":host{display:block;position:relative}#lido-svgContainer{display:flex;justify-content:center;align-items:center;overflow:hidden}svg{width:100%;height:100%;max-height:calc(100vh - 50px);touch-action:none}#lido-draggableCircle{cursor:pointer;fill:#CF1565;transition:fill 0.2s, r 0.2s}.lido-blindTracing{stroke:none !important}.lido-blindFreeTrace{stroke:none !important}.lido-hovered{cursor:grab;fill:darkred}#lido-controls{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-between;padding:10px;background-color:#f0f0f0;border-top:1px solid #ccc}button{padding:10px;font-size:16px}@media (max-width: 600px){button{padding:8px;font-size:14px}}.lido-trace-path-green{}.lido-flow-indicator{stroke:blue;stroke-width:2;stroke-dasharray:6, 6;fill:none}.lido-trace{height:700px;width:700px;z-index:1;justify-items:center;align-content:center}.trace-animate{animation:trace-bounce 0.5s}@keyframes trace-bounce{0%{transform:scale(1)}30%{transform:scale(1.05)}60%{transform:scale(0.95)}100%{transform:scale(1)}}";
|
|
11118
11128
|
const LidoTraceStyle0 = lidoTraceCss;
|
|
11119
11129
|
|
|
11120
11130
|
const LidoTrace = class {
|
|
@@ -11441,7 +11451,7 @@ const LidoTrace = class {
|
|
|
11441
11451
|
circle.setAttribute('cx', firstPathStart.x.toString());
|
|
11442
11452
|
circle.setAttribute('cy', firstPathStart.y.toString());
|
|
11443
11453
|
circle.setAttribute('r', `calc(${strokeWidth || 10} / 3)`); // Radius of the draggable circle
|
|
11444
|
-
circle.setAttribute('fill', '#
|
|
11454
|
+
circle.setAttribute('fill', '#CF1565'); // fill the color for the circle
|
|
11445
11455
|
(_a = state.svg) === null || _a === void 0 ? void 0 : _a.appendChild(circle);
|
|
11446
11456
|
state.circle = circle;
|
|
11447
11457
|
this.resetIdleTimer(state); // ← start idle timer once the SVG is ready
|
|
@@ -11804,7 +11814,7 @@ const LidoTrace = class {
|
|
|
11804
11814
|
};
|
|
11805
11815
|
}
|
|
11806
11816
|
render() {
|
|
11807
|
-
return (index.h(index.Host, { key: '
|
|
11817
|
+
return (index.h(index.Host, { key: 'b3e4e80fb1fa3d1e83ff30aa6258c83c379cb9d4', class: "lido-trace", id: this.id, onCorrect: this.onCorrect, onInCorrect: this.onInCorrect, style: this.style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, tabindex: this.tabIndex }, index.h("div", { key: 'a0c74bd35eba5de7afa4c4d600cc031e169a01d3', style: this.style, id: "lido-svgContainer" })));
|
|
11808
11818
|
}
|
|
11809
11819
|
static get assetsDirs() { return ["svg", "images"]; }
|
|
11810
11820
|
get el() { return index.getElement(this); }
|
|
@@ -2961,16 +2961,23 @@ function onTouchListenerForOnTouch(element) {
|
|
|
2961
2961
|
setDraggingDisabled(false);
|
|
2962
2962
|
};
|
|
2963
2963
|
const onPointerDown = (event) => {
|
|
2964
|
-
event.stopPropagation();
|
|
2964
|
+
event.stopPropagation();
|
|
2965
2965
|
onholdTriggered = false;
|
|
2966
|
-
onholdTimer = setTimeout(
|
|
2966
|
+
onholdTimer = setTimeout(() => {
|
|
2967
|
+
playAudio();
|
|
2968
|
+
}, onholdTime);
|
|
2967
2969
|
};
|
|
2968
2970
|
const onPointerUp = async (event) => {
|
|
2969
|
-
event.stopPropagation();
|
|
2970
2971
|
clearTimeout(onholdTimer);
|
|
2971
2972
|
if (!onholdTriggered && onTouch) {
|
|
2972
2973
|
await executeActions(onTouch, element);
|
|
2973
2974
|
}
|
|
2975
|
+
else if (!onTouch) {
|
|
2976
|
+
if (['category', 'option'].includes(element.getAttribute('type') || '')) {
|
|
2977
|
+
element.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }));
|
|
2978
|
+
}
|
|
2979
|
+
}
|
|
2980
|
+
setDraggingDisabled(false);
|
|
2974
2981
|
};
|
|
2975
2982
|
const onPointerLeave = () => {
|
|
2976
2983
|
clearTimeout(onholdTimer);
|
|
@@ -67818,11 +67825,15 @@ async function handleElementClick(element) {
|
|
|
67818
67825
|
if (res) {
|
|
67819
67826
|
const onCorrect = container['onCorrect'];
|
|
67820
67827
|
await executeActions(onCorrect, container);
|
|
67821
|
-
|
|
67828
|
+
let fillValue = JSON.parse(fillElement['fill']);
|
|
67822
67829
|
if (fillValue === 100 && !fillCompleted) {
|
|
67823
67830
|
fillCompleted = true;
|
|
67831
|
+
container.style.pointerEvents = 'none';
|
|
67824
67832
|
triggerNextContainer();
|
|
67825
67833
|
}
|
|
67834
|
+
else {
|
|
67835
|
+
fillCompleted = false;
|
|
67836
|
+
}
|
|
67826
67837
|
}
|
|
67827
67838
|
else {
|
|
67828
67839
|
const onInCorrect = container['onInCorrect'];
|
|
@@ -67836,6 +67847,7 @@ function handleFloatElementPosition(element) {
|
|
|
67836
67847
|
console.error(`No container found with id: lido-container`);
|
|
67837
67848
|
return;
|
|
67838
67849
|
}
|
|
67850
|
+
stopHighlightForSpeakingElement(element);
|
|
67839
67851
|
const floatContainer = container.querySelector('.lido-float');
|
|
67840
67852
|
if (!floatContainer)
|
|
67841
67853
|
return;
|
|
@@ -68676,7 +68688,6 @@ const attachSpeakIcon = async (element) => {
|
|
|
68676
68688
|
element.appendChild(speakIconElement);
|
|
68677
68689
|
};
|
|
68678
68690
|
const clearLocalStorage = () => {
|
|
68679
|
-
AudioPlayer.getI().stop();
|
|
68680
68691
|
localStorage.removeItem(DragSelectedMapKey);
|
|
68681
68692
|
localStorage.removeItem(DragMapKey);
|
|
68682
68693
|
localStorage.removeItem(SelectedValuesKey);
|
|
@@ -68762,6 +68773,7 @@ function getCancelBtnPopup() {
|
|
|
68762
68773
|
return cancelBtnPopupState;
|
|
68763
68774
|
}
|
|
68764
68775
|
|
|
68776
|
+
exports.ActivityScoreKey = ActivityScoreKey;
|
|
68765
68777
|
exports.AudioPlayer = AudioPlayer;
|
|
68766
68778
|
exports.LidoContainer = LidoContainer;
|
|
68767
68779
|
exports.NextContainerKey = NextContainerKey;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { h, Host } from "@stencil/core";
|
|
2
|
-
import { NextContainerKey, PrevContainerKey, LidoContainer, exitUrl, prevUrl, nextUrl, speakUrl, } from "../../utils/constants";
|
|
2
|
+
import { NextContainerKey, PrevContainerKey, LidoContainer, exitUrl, prevUrl, nextUrl, speakUrl, ActivityScoreKey, } from "../../utils/constants";
|
|
3
3
|
import { dispatchActivityChangeEvent, dispatchGameCompletedEvent, dispatchGameExitEvent } from "../../utils/customEvents";
|
|
4
4
|
import { clearLocalStorage, calculateScale, getCancelBtnPopup, setCancelBtnPopup, executeActions, triggerPrevcontainer } from "../../utils/utils";
|
|
5
5
|
import { AudioPlayer } from "../../utils/audioPlayer";
|
|
@@ -25,6 +25,7 @@ export class LidoHome {
|
|
|
25
25
|
if (index != undefined && index < this.containers.length) {
|
|
26
26
|
// Move to the next container
|
|
27
27
|
this.currentContainerIndex = index;
|
|
28
|
+
console.log("container index ; ", this.currentContainerIndex);
|
|
28
29
|
// window.dispatchEvent(new CustomEvent('activityChange', { detail: { index: this.currentContainerIndex } }));
|
|
29
30
|
dispatchActivityChangeEvent(this.currentContainerIndex);
|
|
30
31
|
}
|
|
@@ -37,6 +38,7 @@ export class LidoHome {
|
|
|
37
38
|
else if (this.currentContainerIndex >= this.containers.length - 1) {
|
|
38
39
|
// const event = new CustomEvent('gameCompleted');
|
|
39
40
|
// window.dispatchEvent(event);
|
|
41
|
+
localStorage.removeItem(ActivityScoreKey);
|
|
40
42
|
dispatchGameCompletedEvent();
|
|
41
43
|
this.currentContainerIndex = null;
|
|
42
44
|
}
|
|
@@ -89,6 +91,8 @@ export class LidoHome {
|
|
|
89
91
|
if (alertElement) {
|
|
90
92
|
if (comment === 'exit') {
|
|
91
93
|
dispatchGameExitEvent();
|
|
94
|
+
AudioPlayer.getI().stop();
|
|
95
|
+
localStorage.removeItem(ActivityScoreKey);
|
|
92
96
|
clearLocalStorage();
|
|
93
97
|
alertElement.remove();
|
|
94
98
|
}
|
|
@@ -123,6 +127,10 @@ export class LidoHome {
|
|
|
123
127
|
next: this.nextButtonUrl || nextUrl,
|
|
124
128
|
speak: this.speakerButtonUrl || speakUrl,
|
|
125
129
|
};
|
|
130
|
+
if (this.currentContainerIndex === 0) {
|
|
131
|
+
localStorage.removeItem(ActivityScoreKey);
|
|
132
|
+
clearLocalStorage();
|
|
133
|
+
}
|
|
126
134
|
// Listen for 'NextContainerKey' event to transition between containers
|
|
127
135
|
window.addEventListener(NextContainerKey, () => {
|
|
128
136
|
this.NextContainerKey();
|
|
@@ -137,6 +145,8 @@ export class LidoHome {
|
|
|
137
145
|
this.parseXMLData(this.xmlData);
|
|
138
146
|
// Remove stored values in localStorage when the page is about to be unloaded
|
|
139
147
|
window.addEventListener('beforeunload', () => {
|
|
148
|
+
AudioPlayer.getI().stop();
|
|
149
|
+
localStorage.removeItem(ActivityScoreKey);
|
|
140
150
|
clearLocalStorage();
|
|
141
151
|
});
|
|
142
152
|
}
|
|
@@ -325,7 +325,7 @@ export class LidoTrace {
|
|
|
325
325
|
circle.setAttribute('cx', firstPathStart.x.toString());
|
|
326
326
|
circle.setAttribute('cy', firstPathStart.y.toString());
|
|
327
327
|
circle.setAttribute('r', `calc(${strokeWidth || 10} / 3)`); // Radius of the draggable circle
|
|
328
|
-
circle.setAttribute('fill', '#
|
|
328
|
+
circle.setAttribute('fill', '#CF1565'); // fill the color for the circle
|
|
329
329
|
(_a = state.svg) === null || _a === void 0 ? void 0 : _a.appendChild(circle);
|
|
330
330
|
state.circle = circle;
|
|
331
331
|
this.resetIdleTimer(state); // ← start idle timer once the SVG is ready
|
|
@@ -688,7 +688,7 @@ export class LidoTrace {
|
|
|
688
688
|
};
|
|
689
689
|
}
|
|
690
690
|
render() {
|
|
691
|
-
return (h(Host, { key: '
|
|
691
|
+
return (h(Host, { key: 'b3e4e80fb1fa3d1e83ff30aa6258c83c379cb9d4', class: "lido-trace", id: this.id, onCorrect: this.onCorrect, onInCorrect: this.onInCorrect, style: this.style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, tabindex: this.tabIndex }, h("div", { key: 'a0c74bd35eba5de7afa4c4d600cc031e169a01d3', style: this.style, id: "lido-svgContainer" })));
|
|
692
692
|
}
|
|
693
693
|
static get is() { return "lido-trace"; }
|
|
694
694
|
static get originalStyleUrls() {
|
|
@@ -68,13 +68,13 @@ function getContainerXml(args) {
|
|
|
68
68
|
// ✅ Wing positioning based on DROP elements
|
|
69
69
|
const dropCount = args.correct.length;
|
|
70
70
|
// wing dynamic positions
|
|
71
|
-
const wingXLandscape =
|
|
72
|
-
const wingXPortrait =
|
|
71
|
+
const wingXLandscape = 46 + dropCount * 4;
|
|
72
|
+
const wingXPortrait = (dropCount <= 3 ? 52 + dropCount * 4 : 56 + dropCount * 4);
|
|
73
73
|
// create drop elements
|
|
74
74
|
const dropElements = args.correct.map((letter, index) => {
|
|
75
|
-
const marginleft = index === 0 ? -
|
|
75
|
+
const marginleft = index === 0 ? -60 : 0;
|
|
76
76
|
return `
|
|
77
|
-
<lido-image value="${letter}" string="${letter}" is-slice="true" onEntry="this.padding='0px'; this.margin-left='${marginleft}px'; this.margin-top='
|
|
77
|
+
<lido-image value="${letter}" string="${letter}" is-slice="true" onEntry="this.padding='0px'; this.margin-left='${marginleft}px'; this.margin-top='8px';" bg-color="transparent" id="drop-image${index + 1}" disable-edit="true" type="drop" tab-index="${9 + index}" visible="true" src="${args.dropImage}" height="landscape.150px, portrait.150px" width="landscape.150px, portrait.125px">
|
|
78
78
|
</lido-image>
|
|
79
79
|
`;
|
|
80
80
|
}).join('');
|
|
@@ -106,20 +106,20 @@ function getContainerXml(args) {
|
|
|
106
106
|
</lido-text>
|
|
107
107
|
</lido-cell>
|
|
108
108
|
|
|
109
|
-
<lido-cell
|
|
110
|
-
<lido-image bg-color="transparent" height="landscape.
|
|
109
|
+
<lido-cell layout="row" onEntry="this.position='absolute'; this.justify-content='center'; this.align-items='center';" y="landscape.20%, portrait.40%" tab-index="7" id="fullRrocket" bg-color="transparent" height="landscape.445px, portrait.275px" width="100%" visible="true">
|
|
110
|
+
<lido-image bg-color="transparent" height="landscape.160px, portrait.160px" id="rockethead_bg_wordnote" tab-index="8" width="landscape.350px, portrait.350px" disable-edit="true" visible="true" src="https://media.githubusercontent.com/media/chimple/bahama/refs/heads/master/assets/games/rocket/textures/rockethead_bg_wordnote.png" margin="landscape.0px 0px 0px 0px, portrait.0">
|
|
111
111
|
</lido-image>
|
|
112
112
|
|
|
113
113
|
${dropElements}
|
|
114
114
|
|
|
115
|
-
<lido-image onEntry="this.position='absolute'; this.padding='0px';" height="225px" width="27%" x="landscape.${wingXLandscape}%, portrait.${wingXPortrait}%" y="landscape
|
|
115
|
+
<lido-image onEntry="this.position='absolute'; this.padding='0px';" height="225px" width="27%" x="landscape.${wingXLandscape}%, portrait.${wingXPortrait}%" y="landscape.0%, portrait.-24%" tab-index="12" bg-color="transparent" id="wings-image1" disable-edit="true" visible="true" src="https://media.githubusercontent.com/media/chimple/bahama/refs/heads/master/assets/games/rocket/textures/rockethandle_bg_wordnote.png" margin="0">
|
|
116
116
|
</lido-image>
|
|
117
|
-
<lido-image onEntry="this.position='absolute'; this.padding='0px';" height="225px" width="27%" x="landscape.${wingXLandscape}%, portrait.${wingXPortrait}%" y="landscape.
|
|
117
|
+
<lido-image onEntry="this.position='absolute'; this.padding='0px';" height="225px" width="27%" x="landscape.${wingXLandscape}%, portrait.${wingXPortrait}%" y="landscape.51%, portrait.45%" tab-index="13" bg-color="transparent" id="wings-image2" disable-edit="true" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/RocketAssets/Fullalphabet/rockethandle_bg_wordnote%201.png" margin="0">
|
|
118
118
|
</lido-image>
|
|
119
119
|
|
|
120
|
-
<lido-image height="landscape.200px, portrait.
|
|
120
|
+
<lido-image height="landscape.200px, portrait.200px" width="landscape.6%, portrait.6%" onEntry="this.zIndex='9';" bg-color="transparent" id="rocket-end" disable-edit="true" tab-index="14" margin="landscape.0px -2% 0px -35px, portrait.0px -2% 0px -35px" src="https://media.githubusercontent.com/media/chimple/bahama/refs/heads/master/assets/games/rocket/textures/rocketend_bg_wordnote.png">
|
|
121
121
|
</lido-image>
|
|
122
|
-
<lido-image onEntry="this.padding='0px';" height="220px" width="
|
|
122
|
+
<lido-image onEntry="this.padding='0px';" height="220px" width="15%" tab-index="15" bg-color="transparent" disable-edit="true" id="fire_image1" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/RocketAssets/Fullalphabet/Fire.png">
|
|
123
123
|
</lido-image>
|
|
124
124
|
</lido-cell>
|
|
125
125
|
|
|
@@ -34,113 +34,113 @@ function getContainerXml(args) {
|
|
|
34
34
|
<lido-container id="lido-container" value="mainContainer1" drop-action="move" objective="${args.correct1},${args.correct2},${args.correct3},${args.correct4},${args.correct5},${args.correct6},${args.correct7},${args.correct8},${args.correct9}" height="100%" width="100%" bg-color="transparent" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/Underwater.png" visible="true" onCorrect="lido-avatar.avatarAnimate='Success'; this.sleep='2000';" onEntry="this.justifyContent='space-around'; this.overflow='hidden';" onInCorrect="lido-avatar.avatarAnimate='Fail'; this.sleep='2000';" show-check="false" is-continue-on-correct="true" after-drop="false" is-allow-only-correct="true">
|
|
35
35
|
|
|
36
36
|
<!-- Chimple Avatar -->
|
|
37
|
-
<lido-cell layout="pos" id="pos1" disable-edit="true" value="pos2" height="305px" width="227px" x="landscape.1274px, portrait.541px" y="landscape.
|
|
38
|
-
<lido-avatar id="lido-avatar" disable-edit="true" visible="true" height="
|
|
37
|
+
<lido-cell layout="pos" id="pos1" disable-edit="true" value="pos2" height="305px" width="227px" x="landscape.1274px, portrait.541px" y="landscape.0, portrait.1274px" aria-hidden="true" z="1" bg-color="transparent" visible="true" onEntry="this.animation='rightToPlace 2.5s linear';">
|
|
38
|
+
<lido-avatar id="lido-avatar" disable-edit="true" visible="true" height="100%" width="100%" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/temp2/chimplecharacter.riv" alt-text="{chimpleCharacterRive}">
|
|
39
39
|
</lido-avatar>
|
|
40
40
|
</lido-cell>
|
|
41
41
|
|
|
42
42
|
<!-- drop container -->
|
|
43
|
-
<lido-cell layout="col" visible="true" width="landscape.
|
|
44
|
-
<lido-image src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/ground.png" is-slice="true" disable-edit="true" visible="true" width="
|
|
43
|
+
<lido-cell layout="col" visible="true" width="landscape.100%, portrait.96%" height="landscape.100%, portrait.57%" bg-color="transparent">
|
|
44
|
+
<lido-image src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/ground.png" is-slice="true" disable-edit="true" visible="true" width="100%" height="83%" imageSlice="30 fill" flexible-width="false" value="dropContainer" z="0">
|
|
45
45
|
<lido-cell layout="landscape.row, portrait.col" bg-color="transparent" visible="true" width="100%" height="100%">
|
|
46
46
|
<!-- child drops -->
|
|
47
47
|
<lido-cell layout="col" bg-color="transparent" visible="true" width="100%" height="100%">
|
|
48
|
-
<lido-cell layout="row" visible="true" width="
|
|
48
|
+
<lido-cell layout="row" visible="true" width="80%" height="100%" bg-color="transparent" x="0px" y="0px" margin="landscape.0px 0px 0px 17%, portrait.0px 0px 0px 25%" z="1">
|
|
49
49
|
|
|
50
|
-
<lido-image is-slice="true" id="option1" value="op" audio="" tab-index="1" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/grass_question_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.25%, portrait.22%" height="landscape.70%, portrait.75%" font-size="
|
|
51
|
-
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="100px" height="100px" string="op" font-color="black" font-family="'Baloo 2', serif" font-size="
|
|
50
|
+
<lido-image is-slice="true" id="option1" value="op" audio="" tab-index="1" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/grass_question_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.25%, portrait.22%" height="landscape.70%, portrait.75%" font-size="50px" z="0">
|
|
51
|
+
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="100px" height="100px" string="op" font-color="black" font-family="'Baloo 2', serif" font-size="50px" z="0">
|
|
52
52
|
</lido-text>
|
|
53
53
|
</lido-image>
|
|
54
|
-
<lido-image is-slice="true" id="option2" value="ug" audio="" tab-index="2" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/grass_question_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.25%, portrait.22%" height="landscape.70%, portrait.75%" font-size="
|
|
55
|
-
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="100px" height="100px" string="ug" font-color="black" font-family="'Baloo 2', serif" font-size="
|
|
54
|
+
<lido-image is-slice="true" id="option2" value="ug" audio="" tab-index="2" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/grass_question_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.25%, portrait.22%" height="landscape.70%, portrait.75%" font-size="50px" z="0">
|
|
55
|
+
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="100px" height="100px" string="ug" font-color="black" font-family="'Baloo 2', serif" font-size="50px" z="0">
|
|
56
56
|
</lido-text>
|
|
57
57
|
</lido-image>
|
|
58
|
-
<lido-image is-slice="true" id="option3" value="ad" audio="" tab-index="3" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/grass_question_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.25%, portrait.22%" height="landscape.70%, portrait.75%" font-size="
|
|
59
|
-
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="100px" height="100px" string="ad" font-color="black" font-family="'Baloo 2', serif" font-size="
|
|
58
|
+
<lido-image is-slice="true" id="option3" value="ad" audio="" tab-index="3" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/grass_question_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.25%, portrait.22%" height="landscape.70%, portrait.75%" font-size="50px" z="0">
|
|
59
|
+
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="100px" height="100px" string="ad" font-color="black" font-family="'Baloo 2', serif" font-size="50px" z="0">
|
|
60
60
|
</lido-text>
|
|
61
61
|
</lido-image>
|
|
62
62
|
|
|
63
63
|
|
|
64
64
|
</lido-cell>
|
|
65
|
-
<lido-cell layout="row" visible="true" width="
|
|
66
|
-
<lido-image is-slice="true" tab-index="4" id="option4" audio="" value="basket" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/grass_question_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.20%, portrait.18%" height="landscape.70%, portrait.75%" font-size="
|
|
67
|
-
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="100px" height="100px" string="ch" font-color="black" font-family="'Baloo 2', serif" font-size="
|
|
65
|
+
<lido-cell layout="row" visible="true" width="96%" height="100%" bg-color="transparent" gap="20px">
|
|
66
|
+
<lido-image is-slice="true" tab-index="4" id="option4" audio="" value="basket" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/grass_question_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.20%, portrait.18%" height="landscape.70%, portrait.75%" font-size="50px" z="0">
|
|
67
|
+
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="100px" height="100px" string="ch" font-color="black" font-family="'Baloo 2', serif" font-size="50px" z="0">
|
|
68
68
|
</lido-text>
|
|
69
69
|
</lido-image>
|
|
70
|
-
<lido-image id="option5" is-slice="true" value="${args.correct1}" tab-index="5" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/mud_drop_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.
|
|
70
|
+
<lido-image id="option5" is-slice="true" value="${args.correct1}" tab-index="5" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/mud_drop_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.355px, portrait.15%" height="landscape.67%, portrait.70%" font-size="50px" z="0" type="drop">
|
|
71
71
|
</lido-image>
|
|
72
|
-
<lido-image id="option6" is-slice="true" value="${args.correct2}" tab-index="6" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/mud_drop_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.
|
|
72
|
+
<lido-image id="option6" is-slice="true" value="${args.correct2}" tab-index="6" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/mud_drop_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.355px, portrait.15%" height="landscape.67%, portrait.70%" font-size="50px" z="0" type="drop">
|
|
73
73
|
</lido-image>
|
|
74
|
-
<lido-image id="option7" is-slice="true" value="${args.correct3}" tab-index="7" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/mud_drop_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.
|
|
74
|
+
<lido-image id="option7" is-slice="true" value="${args.correct3}" tab-index="7" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/mud_drop_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.355px, portrait.15%" height="landscape.67%, portrait.70%" font-size="50px" z="0" type="drop">
|
|
75
75
|
</lido-image>
|
|
76
76
|
|
|
77
77
|
|
|
78
78
|
</lido-cell>
|
|
79
|
-
<lido-cell layout="row" visible="true" width="
|
|
80
|
-
<lido-image is-slice="true" id="option8" value="basket" audio="" tab-index="8" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/grass_question_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.20%, portrait.18%" height="landscape.70%, portrait.75%" font-size="
|
|
81
|
-
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="100px" height="100px" string="d" font-color="black" font-family="'Baloo 2', serif" font-size="
|
|
79
|
+
<lido-cell layout="row" visible="true" width="96%" height="100%" bg-color="transparent" gap="20px">
|
|
80
|
+
<lido-image is-slice="true" id="option8" value="basket" audio="" tab-index="8" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/grass_question_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.20%, portrait.18%" height="landscape.70%, portrait.75%" font-size="50px" z="0">
|
|
81
|
+
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="100px" height="100px" string="d" font-color="black" font-family="'Baloo 2', serif" font-size="50px" z="0">
|
|
82
82
|
</lido-text>
|
|
83
83
|
</lido-image>
|
|
84
|
-
<lido-image id="option9" is-slice="true" value="${args.correct4}" tab-index="9" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/mud_drop_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.
|
|
84
|
+
<lido-image id="option9" is-slice="true" value="${args.correct4}" tab-index="9" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/mud_drop_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.355px, portrait.15%" height="landscape.67%, portrait.70%" font-size="50px" z="0" type="drop">
|
|
85
85
|
</lido-image>
|
|
86
|
-
<lido-image id="option10" is-slice="true" value="${args.correct5}" tab-index="10" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/mud_drop_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.
|
|
86
|
+
<lido-image id="option10" is-slice="true" value="${args.correct5}" tab-index="10" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/mud_drop_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.355px, portrait.15%" height="landscape.67%, portrait.70%" font-size="50px" z="0" type="drop">
|
|
87
87
|
</lido-image>
|
|
88
|
-
<lido-image id="option11" is-slice="true" value="${args.correct6}" tab-index="11" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/mud_drop_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.
|
|
88
|
+
<lido-image id="option11" is-slice="true" value="${args.correct6}" tab-index="11" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/mud_drop_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.355px, portrait.15%" height="landscape.67%, portrait.70%" font-size="50px" z="0" type="drop">
|
|
89
89
|
</lido-image>
|
|
90
90
|
</lido-cell>
|
|
91
|
-
<lido-cell layout="row" visible="true" width="
|
|
92
|
-
<lido-image is-slice="true" id="option12" value="basket" audio="" tab-index="12" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/grass_question_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.20%, portrait.18%" height="landscape.70%, portrait.75%" font-size="
|
|
93
|
-
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="100px" height="100px" string="m" font-color="black" font-family="'Baloo 2', serif" font-size="
|
|
91
|
+
<lido-cell layout="row" visible="true" width="96%" height="100%" bg-color="transparent" gap="20px">
|
|
92
|
+
<lido-image is-slice="true" id="option12" value="basket" audio="" tab-index="12" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/grass_question_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.20%, portrait.18%" height="landscape.70%, portrait.75%" font-size="50px" z="0">
|
|
93
|
+
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="100px" height="100px" string="m" font-color="black" font-family="'Baloo 2', serif" font-size="50px" z="0">
|
|
94
94
|
</lido-text>
|
|
95
95
|
</lido-image>
|
|
96
|
-
<lido-image id="option13" is-slice="true" value="${args.correct7}" visible="true" tab-index="13" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/mud_drop_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.
|
|
96
|
+
<lido-image id="option13" is-slice="true" value="${args.correct7}" visible="true" tab-index="13" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/mud_drop_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.355px, portrait.15%" height="landscape.67%, portrait.70%" font-size="50px" z="0" type="drop">
|
|
97
97
|
</lido-image>
|
|
98
|
-
<lido-image id="option14" is-slice="true" value="${args.correct8}" visible="true" tab-index="14" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/mud_drop_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.
|
|
98
|
+
<lido-image id="option14" is-slice="true" value="${args.correct8}" visible="true" tab-index="14" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/mud_drop_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.355px, portrait.15%" height="landscape.67%, portrait.70%" font-size="50px" z="0" type="drop">
|
|
99
99
|
</lido-image>
|
|
100
|
-
<lido-image id="option15" is-slice="true" value="${args.correct9}" visible="true" tab-index="15" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/mud_drop_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.
|
|
100
|
+
<lido-image id="option15" is-slice="true" value="${args.correct9}" visible="true" tab-index="15" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/mud_drop_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.355px, portrait.15%" height="landscape.67%, portrait.70%" font-size="50px" z="0" type="drop">
|
|
101
101
|
</lido-image>
|
|
102
102
|
</lido-cell>
|
|
103
103
|
|
|
104
104
|
</lido-cell>
|
|
105
105
|
<!-- drag container -->
|
|
106
|
-
<lido-cell layout="landscape.col, portrait.row" visible="true" width="landscape.25%, portrait.75%" height="landscape.100%, portrait.30%" bg-color="transparent" x="0px" y="0px" margin="landscape.
|
|
107
|
-
<lido-image tab-index="16" is-slice="true" type="drag" audio="" id="option16" value="${args.option1}" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/blue_alphabet_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.
|
|
108
|
-
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="landscape.100px, portrait.120px" height="landscape.120px, portrait.100px" string="${args.option1}" font-color="black" font-family="'Baloo 2', serif" font-size="
|
|
106
|
+
<lido-cell layout="landscape.col, portrait.row" visible="true" width="landscape.25%, portrait.75%" height="landscape.100%, portrait.30%" bg-color="transparent" x="0px" y="0px" margin="landscape.23% 0px 0px 0px, portrait.0px 0px 0px 37%" z="1" onEntry="this.justifyContent='unset';">
|
|
107
|
+
<lido-image tab-index="16" is-slice="true" type="drag" audio="" id="option16" value="${args.option1}" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/blue_alphabet_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.300px, portrait.120px" height="landscape.120px, portrait.120px" font-size="50px" z="0" margin="landscape.0px 0px 90px 0px, portrait.0px 82px 0px 0px">
|
|
108
|
+
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="landscape.100px, portrait.120px" height="landscape.120px, portrait.100px" string="${args.option1}" font-color="black" font-family="'Baloo 2', serif" font-size="50px" z="0" onTouch="this.speak='true';">
|
|
109
109
|
</lido-text>
|
|
110
110
|
</lido-image>
|
|
111
|
-
<lido-image tab-index="17" is-slice="true" type="drag" audio="" id="option17" value="${args.option2}" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/blue_alphabet_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.
|
|
112
|
-
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="landscape.100px, portrait.120px" height="landscape.120px, portrait.100px" string="${args.option2}" font-color="black" font-family="'Baloo 2', serif" font-size="
|
|
111
|
+
<lido-image tab-index="17" is-slice="true" type="drag" audio="" id="option17" value="${args.option2}" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/blue_alphabet_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.300px, portrait.120px" height="landscape.120px, portrait.120px" font-size="50px" z="0" margin="landscape.0px 0px 90px 0px, portrait.0px 82px 0px 0px">
|
|
112
|
+
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="landscape.100px, portrait.120px" height="landscape.120px, portrait.100px" string="${args.option2}" font-color="black" font-family="'Baloo 2', serif" font-size="50px" z="0" onTouch="this.speak='true';">
|
|
113
113
|
</lido-text>
|
|
114
114
|
</lido-image>
|
|
115
|
-
<lido-image tab-index="18" is-slice="true" type="drag" audio="" id="option18" value="${args.option3}" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/blue_alphabet_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.
|
|
116
|
-
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="landscape.100px, portrait.120px" height="landscape.120px, portrait.100px" string="${args.option3}" font-color="black" font-family="'Baloo 2', serif" font-size="
|
|
115
|
+
<lido-image tab-index="18" is-slice="true" type="drag" audio="" id="option18" value="${args.option3}" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/blue_alphabet_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.300px, portrait.120px" height="landscape.120px, portrait.120px" font-size="50px" z="0" margin="landscape.0px 0px 90px 0px, portrait.0px 82px 0px 0px">
|
|
116
|
+
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="landscape.100px, portrait.120px" height="landscape.120px, portrait.100px" string="${args.option3}" font-color="black" font-family="'Baloo 2', serif" font-size="50px" z="0" onTouch="this.speak='true';">
|
|
117
117
|
</lido-text>
|
|
118
118
|
</lido-image>
|
|
119
119
|
|
|
120
120
|
<!--hidden drags -->
|
|
121
|
-
<lido-image is-slice="true" type="drag" tab-index="19" audio="" id="option19" value="${args.option4}" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/blue_alphabet_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.
|
|
122
|
-
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="landscape.100px, portrait.120px" height="landscape.120px, portrait.100px" string="${args.option4}" font-color="black" font-family="'Baloo 2', serif" font-size="
|
|
121
|
+
<lido-image is-slice="true" type="drag" tab-index="19" audio="" id="option19" value="${args.option4}" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/blue_alphabet_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.300px, portrait.120px" height="landscape.120px, portrait.120px" font-size="50px" z="0" margin="landscape.0px 0px 90px 0px, portrait.0px 82px 0px 0px">
|
|
122
|
+
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="landscape.100px, portrait.120px" height="landscape.120px, portrait.100px" string="${args.option4}" font-color="black" font-family="'Baloo 2', serif" font-size="50px" z="0" onTouch="this.speak='true';">
|
|
123
123
|
</lido-text>
|
|
124
124
|
</lido-image>
|
|
125
|
-
<lido-image is-slice="true" type="drag" tab-index="20" audio="" id="option20" value="${args.option5}" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/blue_alphabet_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.
|
|
126
|
-
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="landscape.100px, portrait.120px" height="landscape.120px, portrait.100px" string="${args.option5}" font-color="black" font-family="'Baloo 2', serif" font-size="
|
|
125
|
+
<lido-image is-slice="true" type="drag" tab-index="20" audio="" id="option20" value="${args.option5}" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/blue_alphabet_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.300px, portrait.120px" height="landscape.120px, portrait.120px" font-size="50px" z="0" margin="landscape.0px 0px 90px 0px, portrait.0px 82px 0px 0px">
|
|
126
|
+
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="landscape.100px, portrait.120px" height="landscape.120px, portrait.100px" string="${args.option5}" font-color="black" font-family="'Baloo 2', serif" font-size="50px" z="0" onTouch="this.speak='true';">
|
|
127
127
|
</lido-text>
|
|
128
128
|
</lido-image>
|
|
129
|
-
<lido-image is-slice="true" type="drag" tab-index="21" audio="" id="option21" value="${args.option6}" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/blue_alphabet_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.
|
|
130
|
-
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="landscape.100px, portrait.120px" height="landscape.120px, portrait.100px" string="${args.option6}" font-color="black" font-family="'Baloo 2', serif" font-size="
|
|
129
|
+
<lido-image is-slice="true" type="drag" tab-index="21" audio="" id="option21" value="${args.option6}" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/blue_alphabet_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.300px, portrait.120px" height="landscape.120px, portrait.120px" font-size="50px" z="0" margin="landscape.0px 0px 90px 0px, portrait.0px 82px 0px 0px">
|
|
130
|
+
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="landscape.100px, portrait.120px" height="landscape.120px, portrait.100px" string="${args.option6}" font-color="black" font-family="'Baloo 2', serif" font-size="50px" z="0" onTouch="this.speak='true';">
|
|
131
131
|
</lido-text>
|
|
132
132
|
</lido-image>
|
|
133
133
|
|
|
134
|
-
<lido-image is-slice="true" type="drag" tab-index="22" audio="" id="option22" value="${args.option7}" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/blue_alphabet_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.
|
|
135
|
-
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="landscape.100px, portrait.120px" height="landscape.120px, portrait.100px" string="${args.option7}" font-color="black" font-family="'Baloo 2', serif" font-size="
|
|
134
|
+
<lido-image is-slice="true" type="drag" tab-index="22" audio="" id="option22" value="${args.option7}" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/blue_alphabet_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.300px, portrait.120px" height="landscape.120px, portrait.120px" font-size="50px" z="0" margin="landscape.0px 0px 90px 0px, portrait.0px 82px 0px 0px">
|
|
135
|
+
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="landscape.100px, portrait.120px" height="landscape.120px, portrait.100px" string="${args.option7}" font-color="black" font-family="'Baloo 2', serif" font-size="50px" z="0" onTouch="this.speak='true';">
|
|
136
136
|
</lido-text>
|
|
137
137
|
</lido-image>
|
|
138
|
-
<lido-image is-slice="true" type="drag" tab-index="23" audio="" id="option23" value="${args.option8}" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/blue_alphabet_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.
|
|
139
|
-
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="landscape.100px, portrait.120px" height="landscape.120px, portrait.100px" string="${args.option8}" font-color="black" font-family="'Baloo 2', serif" font-size="
|
|
138
|
+
<lido-image is-slice="true" type="drag" tab-index="23" audio="" id="option23" value="${args.option8}" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/blue_alphabet_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.300px, portrait.120px" height="landscape.120px, portrait.120px" font-size="50px" z="0" margin="landscape.0px 0px 90px 0px, portrait.0px 82px 0px 0px">
|
|
139
|
+
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="landscape.100px, portrait.120px" height="landscape.120px, portrait.100px" string="${args.option8}" font-color="black" font-family="'Baloo 2', serif" font-size="50px" z="0" onTouch="this.speak='true';">
|
|
140
140
|
</lido-text>
|
|
141
141
|
</lido-image>
|
|
142
|
-
<lido-image is-slice="true" type="drag" tab-index="24" audio="" id="option24" value="${args.option9}" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/blue_alphabet_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.
|
|
143
|
-
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="landscape.100px, portrait.120px" height="landscape.120px, portrait.100px" string="${args.option9}" font-color="black" font-family="'Baloo 2', serif" font-size="
|
|
142
|
+
<lido-image is-slice="true" type="drag" tab-index="24" audio="" id="option24" value="${args.option9}" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/grid/blue_alphabet_wordmatrix.png" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset';" width="landscape.300px, portrait.120px" height="landscape.120px, portrait.120px" font-size="50px" z="0" margin="landscape.0px 0px 90px 0px, portrait.0px 82px 0px 0px">
|
|
143
|
+
<lido-text visible="true" bg-color="transparent" onEntry="this.borderRadius='unset'; this.boxShadow='unset'; this.fontWeight='800';" width="landscape.100px, portrait.120px" height="landscape.120px, portrait.100px" string="${args.option9}" font-color="black" font-family="'Baloo 2', serif" font-size="50px" z="0" onTouch="this.speak='true';">
|
|
144
144
|
</lido-text>
|
|
145
145
|
</lido-image>
|
|
146
146
|
|
|
@@ -63,7 +63,7 @@ function getContainerXml(args) {
|
|
|
63
63
|
<lido-cell layout="col" visible="true" width="landscpae.27.5% , portrait.100%" height="landscpae.100% , portrait.27.5%" bg-color="transparent">
|
|
64
64
|
</lido-cell>
|
|
65
65
|
|
|
66
|
-
<lido-cell tab-index="2" layout="col" show-speak-icon="true" audio="" visible="true" width="landscape.725px, portrait.725px" height="landscape.725px, portrait.725px" bg-color="
|
|
66
|
+
<lido-cell tab-index="2" layout="col" show-speak-icon="true" audio="" visible="true" width="landscape.725px, portrait.725px" height="landscape.725px, portrait.725px" bg-color="#0A2C45" onEntry="this.border-radius='6px'; this.flex-shrink='0';">
|
|
67
67
|
<lido-trace id="image2" tab-index="3" value="a" visible="true" svg-source="${traceImage}" onCorrect="" mode="${traceMode}" z="1" x="25px" y="25px" width="landscape.700px,portrait.700px" height="landscape.700px,portrait.700px" onEntry="" alt-text="{backgroundImage}">
|
|
68
68
|
</lido-trace>
|
|
69
69
|
</lido-cell>
|
|
@@ -18,7 +18,7 @@ const meta = {
|
|
|
18
18
|
traceMode: 'showFlow',
|
|
19
19
|
highlightedText: 'bug',
|
|
20
20
|
topDisplayImage: ['https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/trace/questionBg.png'],
|
|
21
|
-
bottomDisplayImage: ['https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/trace/
|
|
21
|
+
bottomDisplayImage: ['https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/trace/tracing%20bg.png'],
|
|
22
22
|
spanType: 'letters',
|
|
23
23
|
}
|
|
24
24
|
};
|
|
@@ -795,7 +795,6 @@ export const attachSpeakIcon = async (element) => {
|
|
|
795
795
|
element.appendChild(speakIconElement);
|
|
796
796
|
};
|
|
797
797
|
export const clearLocalStorage = () => {
|
|
798
|
-
AudioPlayer.getI().stop();
|
|
799
798
|
localStorage.removeItem(DragSelectedMapKey);
|
|
800
799
|
localStorage.removeItem(DragMapKey);
|
|
801
800
|
localStorage.removeItem(SelectedValuesKey);
|
|
@@ -18,16 +18,23 @@ export function onTouchListenerForOnTouch(element) {
|
|
|
18
18
|
setDraggingDisabled(false);
|
|
19
19
|
};
|
|
20
20
|
const onPointerDown = (event) => {
|
|
21
|
-
event.stopPropagation();
|
|
21
|
+
event.stopPropagation();
|
|
22
22
|
onholdTriggered = false;
|
|
23
|
-
onholdTimer = setTimeout(
|
|
23
|
+
onholdTimer = setTimeout(() => {
|
|
24
|
+
playAudio();
|
|
25
|
+
}, onholdTime);
|
|
24
26
|
};
|
|
25
27
|
const onPointerUp = async (event) => {
|
|
26
|
-
event.stopPropagation();
|
|
27
28
|
clearTimeout(onholdTimer);
|
|
28
29
|
if (!onholdTriggered && onTouch) {
|
|
29
30
|
await executeActions(onTouch, element);
|
|
30
31
|
}
|
|
32
|
+
else if (!onTouch) {
|
|
33
|
+
if (['category', 'option'].includes(element.getAttribute('type') || '')) {
|
|
34
|
+
element.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }));
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
setDraggingDisabled(false);
|
|
31
38
|
};
|
|
32
39
|
const onPointerLeave = () => {
|
|
33
40
|
clearTimeout(onholdTimer);
|