lido-player 0.0.2-alpha-75 → 0.0.2-alpha-76

package/dist/cjs/{index-DeCNGGv1.js → index-BeLWDohk.js}

@@ -392,7 +392,8 @@ function enableDraggingWithScaling(element) {
         console.error(`Container with ID "container" not found.`);
         return;
     }
-    // if(container.getAttribute("canplay") === "false")return;
+    if (container.getAttribute("canplay") === "false")
+        return;
     handlingElementFlexibleWidth(element, 'drag');
     const onStart = (event) => {
         var _a, _b;
@@ -1062,9 +1063,9 @@ function handleDropElement(element) {
     updateDropBorder(element);
 }
 async function onClickDropOrDragElement(element, type) {
-    AudioPlayer.getI().stop();
-    document.getElementById(LidoContainer);
-    // if(container.getAttribute('canplay') === 'false') return;
+    const container = document.getElementById(LidoContainer);
+    if (container.getAttribute('canplay') === 'false')
+        return;
     // Remove the highlight class from elements matching the selector
     const highlightedElements = document.querySelectorAll(`[type='${type}']`);
     highlightedElements.forEach(el => {
@@ -1697,9 +1698,8 @@ function enableReorderDrag(element) {
     let startX = 0;
     let startY = 0;
     const container = document.getElementById(LidoContainer);
-    if (!container)
+    if (!container || container.getAttribute("canplay") === "false")
         return;
-    // if(!container || container.getAttribute("canplay") === "false") return;
     Array.from(element.children).forEach(child => {
         child.style.pointerEvents = 'none';
     });
@@ -1885,7 +1885,8 @@ function enableReorderDrag(element) {
     };
     const onClickElement = (element) => {
         const container = document.getElementById(LidoContainer);
-        // if(container.getAttribute('canplay') === 'false')return;
+        if (container.getAttribute('canplay') === 'false')
+            return;
         if (elementType === 'option') {
             const categoryArr = container.querySelectorAll('[type="category"]');
             let category = Array.from(categoryArr).find(el => el.parentElement.className.includes('highlight-element'));
@@ -1958,9 +1959,7 @@ function enableReorderDrag(element) {
     };
     element.style.cursor = 'move';
     element.classList.add('drag-element');
-    // element.addEventListener('pointerdown', onStart);
-    element.addEventListener('mousedown', onStart);
-    element.addEventListener('touchstart', onStart, { passive: false });
+    element.addEventListener('pointerdown', onStart);
 }
 const resetElementStyles = (el) => {
     el.style.opacity = '';
@@ -2160,7 +2159,9 @@ function slidingWithScaling(element) {
         console.error(`Parent element not found.`);
         return;
     }
-    document.getElementById(LidoContainer);
+    const container = document.getElementById(LidoContainer);
+    if (container.getAttribute('canplay') === 'false')
+        return;
     const onStart = (event) => {
         removeHighlight(element);
         isDragging = true;
@@ -3584,7 +3585,8 @@ function onTouchListenerForOnTouch(element) {
 function addClickListenerForClickType(element) {
     handlingElementFlexibleWidth(element, 'click');
     const container = document.getElementById(LidoContainer);
-    // if(container.getAttribute('canplay') === 'false')return;
+    if (container.getAttribute('canplay') === 'false')
+        return;
     element.style.cursor = 'pointer';
     if (!element) {
         console.error('No element provided.');
@@ -72161,7 +72163,8 @@ const executeActions = async (actionsString, thisElement, element) => {
                 }
                 case 'nextBtn': {
                     const container = document.getElementById(LidoContainer);
-                    // if(container.getAttribute('canplay') === 'false')return;
+                    if (container.getAttribute('canplay') === 'false')
+                        return;
                     if (container.getAttribute('is-continue-on-correct') !== 'true') {
                         targetElement.style.pointerEvents = 'none';
                         AudioPlayer.getI().stop();
@@ -73199,14 +73202,14 @@ const animateBoxCells = async (element, value) => {
         await new Promise(resolve => setTimeout(resolve, 600)); // Adjust delay as needed
         cell.classList.remove('lido-box-highlight');
     }
-    // checkout parent cell first then pick the first text child inside cell
+    // checkout parent cell first then pick the second text child inside cell
     const parentCell = document.getElementById(LidoContainer);
     if (!parentCell)
         return;
-    const firstTextChild = parentCell.querySelector('lido-text');
-    if (firstTextChild) {
+    const instructionText = parentCell.children[2];
+    if (instructionText) {
         // play the text child inside parent cell
-        await AudioPlayer.getI().play(firstTextChild);
+        await AudioPlayer.getI().play(instructionText);
     }
     // Now select each box cell's text child and play them one by one
     for (const box of boxCells) {
@@ -73247,9 +73250,9 @@ const SumTogetherAnimation = async (element, value) => {
     if (!value)
         return;
     // Expecting structure: [_, TopRow, questionRow, optionRow, ...]
-    const TopRow = Array.from(element.children)[2];
-    const questionRow = Array.from(element.children)[3];
-    const optionRow = Array.from(element.children)[4];
+    const TopRow = Array.from(element.children)[3];
+    const questionRow = Array.from(element.children)[4];
+    const optionRow = Array.from(element.children)[5];
     if (!TopRow || !questionRow || !optionRow)
         return;
     const topRowChildren = Array.from(TopRow.children);

package/dist/cjs/index.cjs.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-DeCNGGv1.js');
+var index = require('./index-BeLWDohk.js');
 require('./index-BrME-8br.js');
 
 

package/dist/cjs/lido-avatar_22.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var index = require('./index-BrME-8br.js');
-var index$1 = require('./index-DeCNGGv1.js');
+var index$1 = require('./index-BeLWDohk.js');
 
 var rive$1 = {exports: {}};
 
@@ -8580,7 +8580,7 @@ const LidoCalculator = class {
             return;
         if (this.objective && this.objective != '' && !this.objective.includes(',')) {
             console.log("hi iscorrect verified");
-            isCorrect = userInput === this.objective;
+            isCorrect = Number(userInput) === Number(this.objective);
         }
         // --- Multiple Objectives ---
         else if (this.objective && this.objective.includes(',')) {
@@ -8653,7 +8653,7 @@ const LidoCalculator = class {
     }
     render() {
         const numbers = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '←', '0', 'OK'];
-        return (index.h(index.Host, { key: '595c92e80baed8e1709c51302aa427d672b3a9e0', onEntry: this.onEntry, id: "lidoCalculator", style: { width: this.width, height: this.height, backgroundColor: this.bgColor, left: this.x, top: this.y } }, index.h("lido-cell", { key: '4a2966a46fd008d66fedeb5f44e0ee2c5e8c083a', visible: "true", height: "94px", width: "60px" }, index.h("lido-text", { key: '35e38f7412be8489b668ba0aab927b7ba3d98f29', visible: "true", id: "lido-calculator-penIcon", type: "click", height: "80px", x: "176%", width: "89px", onEntry: "this.position='relative';", class: "top-icon" }, index.h("img", { key: '926def912022a30a27f5419d98348beb84fc1a42', src: this.penIcon, alt: "pen", style: { width: '100%', height: '100%' } }))), index.h("div", { key: '41a69c7aa7d1dfbeea19b1a1ef095b97d2c953ba', class: "lido-calculator-displayParent" }, index.h("div", { key: '047dfc84e8b02739a982287f82b1df2b7f552dcd', class: "lido-calculator-display" }, this.displayValue)), index.h("div", { key: '41cd91f2c9aa40f6adcf6b0318e07e394bc3b38e', class: "lido-calculator-buttons" }, numbers.map((num, i) => (index.h("lido-text", { id: `btn-${i}`, string: num, visible: "true", type: "click", class: {
+        return (index.h(index.Host, { key: '29f91af1bedaa8be605cdf82fddf74b5622eff6e', onEntry: this.onEntry, id: "lidoCalculator", style: { width: this.width, height: this.height, backgroundColor: this.bgColor, left: this.x, top: this.y } }, index.h("lido-cell", { key: '1ac0f61986e688603db21b2eb1bb52bbcabca1ca', visible: "true", height: "94px", width: "60px" }, index.h("lido-text", { key: '3bdacbcb2ea2f371b11a2ed05eb271e0a75c5e09', visible: "true", id: "lido-calculator-penIcon", type: "click", height: "80px", x: "176%", width: "89px", onEntry: "this.position='relative';", class: "top-icon" }, index.h("img", { key: '5f7bb3c09bccdb21c2bda00ae99234409bad7eda', src: this.penIcon, alt: "pen", style: { width: '100%', height: '100%' } }))), index.h("div", { key: '0891cd4b5929861d264c29684ef260f61e65004b', class: "lido-calculator-displayParent" }, index.h("div", { key: 'ac5861ca1a9ebaee9eb7d729f8d2b88933b733d5', class: "lido-calculator-display" }, this.displayValue)), index.h("div", { key: 'f80c85a89462fd96630a4bf8a304284e4546fe72', class: "lido-calculator-buttons" }, numbers.map((num, i) => (index.h("lido-text", { id: `btn-${i}`, string: num, visible: "true", type: "click", class: {
                 'lido-calculator-btn-special': num === '←' || num === 'OK',
                 'lido-calculator-btn-default': num !== '←' && num !== 'OK'
             }, onClick: () => this.handleClick(num) }))))));

package/dist/collection/components/calculator/lido-calculator.js

@@ -67,7 +67,7 @@ export class LidoCalculator {
             return;
         if (this.objective && this.objective != '' && !this.objective.includes(',')) {
             console.log("hi iscorrect verified");
-            isCorrect = userInput === this.objective;
+            isCorrect = Number(userInput) === Number(this.objective);
         }
         // --- Multiple Objectives ---
         else if (this.objective && this.objective.includes(',')) {
@@ -143,7 +143,7 @@ export class LidoCalculator {
     }
     render() {
         const numbers = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '←', '0', 'OK'];
-        return (h(Host, { key: '595c92e80baed8e1709c51302aa427d672b3a9e0', onEntry: this.onEntry, id: "lidoCalculator", style: { width: this.width, height: this.height, backgroundColor: this.bgColor, left: this.x, top: this.y } }, h("lido-cell", { key: '4a2966a46fd008d66fedeb5f44e0ee2c5e8c083a', visible: "true", height: "94px", width: "60px" }, h("lido-text", { key: '35e38f7412be8489b668ba0aab927b7ba3d98f29', visible: "true", id: "lido-calculator-penIcon", type: "click", height: "80px", x: "176%", width: "89px", onEntry: "this.position='relative';", class: "top-icon" }, h("img", { key: '926def912022a30a27f5419d98348beb84fc1a42', src: this.penIcon, alt: "pen", style: { width: '100%', height: '100%' } }))), h("div", { key: '41a69c7aa7d1dfbeea19b1a1ef095b97d2c953ba', class: "lido-calculator-displayParent" }, h("div", { key: '047dfc84e8b02739a982287f82b1df2b7f552dcd', class: "lido-calculator-display" }, this.displayValue)), h("div", { key: '41cd91f2c9aa40f6adcf6b0318e07e394bc3b38e', class: "lido-calculator-buttons" }, numbers.map((num, i) => (h("lido-text", { id: `btn-${i}`, string: num, visible: "true", type: "click", class: {
+        return (h(Host, { key: '29f91af1bedaa8be605cdf82fddf74b5622eff6e', onEntry: this.onEntry, id: "lidoCalculator", style: { width: this.width, height: this.height, backgroundColor: this.bgColor, left: this.x, top: this.y } }, h("lido-cell", { key: '1ac0f61986e688603db21b2eb1bb52bbcabca1ca', visible: "true", height: "94px", width: "60px" }, h("lido-text", { key: '3bdacbcb2ea2f371b11a2ed05eb271e0a75c5e09', visible: "true", id: "lido-calculator-penIcon", type: "click", height: "80px", x: "176%", width: "89px", onEntry: "this.position='relative';", class: "top-icon" }, h("img", { key: '5f7bb3c09bccdb21c2bda00ae99234409bad7eda', src: this.penIcon, alt: "pen", style: { width: '100%', height: '100%' } }))), h("div", { key: '0891cd4b5929861d264c29684ef260f61e65004b', class: "lido-calculator-displayParent" }, h("div", { key: 'ac5861ca1a9ebaee9eb7d729f8d2b88933b733d5', class: "lido-calculator-display" }, this.displayValue)), h("div", { key: 'f80c85a89462fd96630a4bf8a304284e4546fe72', class: "lido-calculator-buttons" }, numbers.map((num, i) => (h("lido-text", { id: `btn-${i}`, string: num, visible: "true", type: "click", class: {
                 'lido-calculator-btn-special': num === '←' || num === 'OK',
                 'lido-calculator-btn-default': num !== '←' && num !== 'OK'
             }, onClick: () => this.handleClick(num) }))))));

package/dist/collection/utils/utils.js

@@ -185,7 +185,8 @@ export const executeActions = async (actionsString, thisElement, element) => {
                 }
                 case 'nextBtn': {
                     const container = document.getElementById(LidoContainer);
-                    // if(container.getAttribute('canplay') === 'false')return;
+                    if (container.getAttribute('canplay') === 'false')
+                        return;
                     if (container.getAttribute('is-continue-on-correct') !== 'true') {
                         targetElement.style.pointerEvents = 'none';
                         AudioPlayer.getI().stop();
@@ -1225,14 +1226,14 @@ export const animateBoxCells = async (element, value) => {
         await new Promise(resolve => setTimeout(resolve, 600)); // Adjust delay as needed
         cell.classList.remove('lido-box-highlight');
     }
-    // checkout parent cell first then pick the first text child inside cell
+    // checkout parent cell first then pick the second text child inside cell
     const parentCell = document.getElementById(LidoContainer);
     if (!parentCell)
         return;
-    const firstTextChild = parentCell.querySelector('lido-text');
-    if (firstTextChild) {
+    const instructionText = parentCell.children[2];
+    if (instructionText) {
         // play the text child inside parent cell
-        await AudioPlayer.getI().play(firstTextChild);
+        await AudioPlayer.getI().play(instructionText);
     }
     // Now select each box cell's text child and play them one by one
     for (const box of boxCells) {
@@ -1273,9 +1274,9 @@ export const SumTogetherAnimation = async (element, value) => {
     if (!value)
         return;
     // Expecting structure: [_, TopRow, questionRow, optionRow, ...]
-    const TopRow = Array.from(element.children)[2];
-    const questionRow = Array.from(element.children)[3];
-    const optionRow = Array.from(element.children)[4];
+    const TopRow = Array.from(element.children)[3];
+    const questionRow = Array.from(element.children)[4];
+    const optionRow = Array.from(element.children)[5];
     if (!TopRow || !questionRow || !optionRow)
         return;
     const topRowChildren = Array.from(TopRow.children);

package/dist/collection/utils/utilsHandlers/clickHandler.js

@@ -58,7 +58,8 @@ export function onTouchListenerForOnTouch(element) {
 export function addClickListenerForClickType(element) {
     handlingElementFlexibleWidth(element, 'click');
     const container = document.getElementById(LidoContainer);
-    // if(container.getAttribute('canplay') === 'false')return;
+    if (container.getAttribute('canplay') === 'false')
+        return;
     element.style.cursor = 'pointer';
     if (!element) {
         console.error('No element provided.');

package/dist/collection/utils/utilsHandlers/dragDropHandler.js

@@ -65,7 +65,8 @@ export function enableDraggingWithScaling(element) {
         console.error(`Container with ID "container" not found.`);
         return;
     }
-    // if(container.getAttribute("canplay") === "false")return;
+    if (container.getAttribute("canplay") === "false")
+        return;
     handlingElementFlexibleWidth(element, 'drag');
     let verticalDistance;
     let horizontalDistance;
@@ -745,9 +746,9 @@ export function handleDropElement(element) {
     updateDropBorder(element);
 }
 export async function onClickDropOrDragElement(element, type) {
-    AudioPlayer.getI().stop();
     const container = document.getElementById(LidoContainer);
-    // if(container.getAttribute('canplay') === 'false') return;
+    if (container.getAttribute('canplay') === 'false')
+        return;
     // Remove the highlight class from elements matching the selector
     const highlightedElements = document.querySelectorAll(`[type='${type}']`);
     highlightedElements.forEach(el => {

package/dist/collection/utils/utilsHandlers/slideHandler.js

@@ -76,7 +76,8 @@ export function slidingWithScaling(element) {
         return;
     }
     const container = document.getElementById(LidoContainer);
-    // if(container.getAttribute('canplay') === 'false')return;
+    if (container.getAttribute('canplay') === 'false')
+        return;
     let verticalDistance;
     let horizontalDistance;
     const onStart = (event) => {

package/dist/collection/utils/utilsHandlers/sortHandler.js

@@ -41,9 +41,8 @@ export function enableReorderDrag(element) {
     let startX = 0;
     let startY = 0;
     const container = document.getElementById(LidoContainer);
-    if (!container)
+    if (!container || container.getAttribute("canplay") === "false")
         return;
-    // if(!container || container.getAttribute("canplay") === "false") return;
     Array.from(element.children).forEach(child => {
         child.style.pointerEvents = 'none';
     });
@@ -229,7 +228,8 @@ export function enableReorderDrag(element) {
     };
     const onClickElement = (element) => {
         const container = document.getElementById(LidoContainer);
-        // if(container.getAttribute('canplay') === 'false')return;
+        if (container.getAttribute('canplay') === 'false')
+            return;
         if (elementType === 'option') {
             const categoryArr = container.querySelectorAll('[type="category"]');
             let category = Array.from(categoryArr).find(el => el.parentElement.className.includes('highlight-element'));
@@ -302,9 +302,7 @@ export function enableReorderDrag(element) {
     };
     element.style.cursor = 'move';
     element.classList.add('drag-element');
-    // element.addEventListener('pointerdown', onStart);
-    element.addEventListener('mousedown', onStart);
-    element.addEventListener('touchstart', onStart, { passive: false });
+    element.addEventListener('pointerdown', onStart);
 }
 const resetElementStyles = (el) => {
     el.style.opacity = '';