lido-player 0.0.2-alpha-1 → 0.0.2-alpha-2

package/dist/cjs/app-col_12.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-0d28e716.js');
-const utils = require('./utils-8ac0e3b7.js');
+const utils = require('./utils-5eeb6512.js');
 
 const appColCss = ".col{top:var(--y, 0);left:var(--x, 0);height:var(--height, 100%);width:var(--width, 100%);background-color:var(--bgColor, #eeeeee);padding:15px;border-radius:10px;display:flex;justify-content:space-around;flex-direction:column;align-items:center}.col>*{}";
 const AppColStyle0 = appColCss;
@@ -86,6 +86,7 @@ const AppContainer = class {
         this.onIncorrectTouch = undefined;
         this.onEntry = undefined;
         this.canplay = true;
+        this.baseUrl = '';
     }
     /**
      * Scales the container based on the window or screen size, maintaining the aspect ratio.
@@ -133,7 +134,7 @@ const AppContainer = class {
             transform: 'translate(-50%, -50%)', // Centering the container
         };
         console.log('🚀 ~ AppContainer ~ canplay:', this.canplay);
-        return (index.h(index.Host, { key: '3de4da721c5eb3dcdd9b29e01cfcc7968d40a761', id: "container", tabindex: 0, class: "container", objective: this.objective, style: style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, onTouch: this.onTouch, onMatch: this.onMatch, onWrong: this.onWrong, onIncorrectTouch: this.onIncorrectTouch, onCorrectMatch: this.onCorrectMatch, onCorrectTouch: this.onCorrectTouch, onEntry: this.onEntry }, index.h("slot", { key: 'bd4abd0fd97b92a6f942554be26a28d3948f7a5d' })));
+        return (index.h(index.Host, { key: 'b9a426ecbea1635883a1cb841f36e7c1d8e55caa', id: "container", tabindex: 0, class: "container", objective: this.objective, style: style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, onTouch: this.onTouch, onMatch: this.onMatch, onWrong: this.onWrong, onIncorrectTouch: this.onIncorrectTouch, onCorrectMatch: this.onCorrectMatch, onCorrectTouch: this.onCorrectTouch, onEntry: this.onEntry, baseUrl: this.baseUrl }, index.h("slot", { key: '2f55d759f184ebb7f5771f6e6e9c0cc9da4621d8' })));
     }
     get el() { return index.getElement(this); }
 };
@@ -187,6 +188,7 @@ const AppHome = class {
         this.xmlData = undefined;
         this.initialIndex = 0;
         this.canplay = true;
+        this.baseUrl = '';
         this.currentContainerIndex = this.initialIndex;
         this.showCompletionMessage = false;
         this.containers = [];
@@ -263,7 +265,7 @@ const AppHome = class {
             .filter(Boolean);
         // Map XML tags to Stencil components
         const componentMapping = {
-            'app-container': (index.h("app-container", Object.assign({}, props, { canplay: this.canplay }), children)),
+            'app-container': (index.h("app-container", Object.assign({}, props, { canplay: this.canplay, baseUrl: this.baseUrl }), children)),
             'app-col': index.h("app-col", Object.assign({}, props), children),
             'app-trace': index.h("app-trace", Object.assign({}, props), children),
             'app-image': index.h("app-image", Object.assign({}, props), children),
@@ -375,7 +377,7 @@ const AppImage = class {
             alignItems: 'center', // Vertically center the image
             justifyContent: 'center', // Horizontally center the image
         };
-        return (index.h(index.Host, { key: 'bc0557fa586341933b698df56ecc5929b4185a58', type: this.type, tabindex: this.tabIndex, style: style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, value: this.value, audio: this.audio, onTouch: this.onTouch, onMatch: this.onMatch, onWrong: this.onWrong, onCorrectMatch: this.onCorrectMatch, onCorrectTouch: this.onCorrectTouch, onInCorrectTouch: this.onInCorrectTouch, onEntry: this.onEntry }, index.h("img", { key: 'fa5cc8aacf12b26625b4bc68a52f19144bc82f99', class: "image", src: this.src, alt: "", style: style })));
+        return (index.h(index.Host, { key: '34c70a3d120b96080892e45da7d97c01778358e1', type: this.type, tabindex: this.tabIndex, style: style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, value: this.value, audio: this.audio, onTouch: this.onTouch, onMatch: this.onMatch, onWrong: this.onWrong, onCorrectMatch: this.onCorrectMatch, onCorrectTouch: this.onCorrectTouch, onInCorrectTouch: this.onInCorrectTouch, onEntry: this.onEntry }, index.h("img", { key: '9c5f71bf1fbdad17f0f57081e981a712837f6ea4', class: "image", src: utils.convertUrlToRelative(this.src), alt: "", style: style })));
     }
     get el() { return index.getElement(this); }
 };
@@ -499,6 +501,7 @@ const AppRoot = class {
         this.xmlPath = undefined;
         this.initialIndex = 0;
         this.canplay = true;
+        this.baseUrl = '';
         this.xmlData = undefined;
     }
     /**
@@ -506,16 +509,21 @@ const AppRoot = class {
      * It fetches the XML data from the specified path or URL and sets it to the component's state.
      */
     async componentWillLoad() {
+        var _a;
         // Validate the xmlPath prop
-        if (!this.xmlPath) {
-            console.error('XML path is not provided.');
-            return;
-        }
+        // if (!this.xmlPath) {
+        //   console.error('XML path is not provided.');
+        //   return;
+        // }
+        const xmlPath = (_a = this.xmlPath) !== null && _a !== void 0 ? _a : this.baseUrl + '/index.xml';
+        console.log('🚀 ~ AppRoot ~ componentWillLoad ~ this.baseUrl:', this.baseUrl);
+        console.log('🚀 ~ AppRoot ~ componentWillLoad ~ this.xmlPath:', this.xmlPath);
+        console.log('🚀 ~ AppRoot ~ componentWillLoad ~ xmlPath:', xmlPath);
         // Fetch the XML data
         try {
-            const resolvedPath = this.xmlPath.startsWith('http')
-                ? this.xmlPath // Use the provided URL if it's an HTTP/HTTPS link
-                : index.getAssetPath(this.xmlPath); // Otherwise, resolve it as an asset path
+            const resolvedPath = xmlPath.startsWith('http')
+                ? xmlPath // Use the provided URL if it's an HTTP/HTTPS link
+                : index.getAssetPath(xmlPath); // Otherwise, resolve it as an asset path
             const response = await fetch(resolvedPath);
             if (!response.ok) {
                 throw new Error(`Failed to fetch XML data: ${response.statusText}`);
@@ -539,7 +547,7 @@ const AppRoot = class {
             return index.h("div", null, "Error loading XML data. Please check the path or URL.");
         }
         // Once the XML data is loaded, pass it to the `app-home` component
-        return index.h("app-home", { initialIndex: this.initialIndex, canplay: this.canplay, xmlData: this.xmlData });
+        return index.h("app-home", { initialIndex: this.initialIndex, canplay: this.canplay, xmlData: this.xmlData, baseUrl: this.baseUrl });
     }
     static get assetsDirs() { return ["assets"]; }
 };