@mml-io/mml-web-client 0.19.4 → 0.19.6

package/build/index.js

@@ -1722,9 +1722,53 @@
       return false;
     }
   };
+  function parseRGB(value) {
+    value = value.trim();
+    const validStart = value.startsWith("rgb(") || value.startsWith("rgba(");
+    const validEnd = value.endsWith(")");
+    if (!validStart || !validEnd) return null;
+    const content = value.substring(value.indexOf("(") + 1, value.length - 1).split(",");
+    if (content.length < 3 || content.length > 4) return null;
+    if (value.startsWith("rgb(") && content.length !== 3) return null;
+    if (value.startsWith("rgba(") && content.length !== 4) return null;
+    const numbers = content.map((n) => parseFloat(n.trim()));
+    if (numbers.some((n) => isNaN(n))) return null;
+    return {
+      r: Math.min(255, Math.max(0, numbers[0])) / 255,
+      g: Math.min(255, Math.max(0, numbers[1])) / 255,
+      b: Math.min(255, Math.max(0, numbers[2])) / 255,
+      a: numbers.length === 4 ? Math.min(1, Math.max(0, numbers[3])) : void 0
+    };
+  }
+  function parseHSL(value) {
+    value = value.trim();
+    const validStart = value.startsWith("hsl(") || value.startsWith("hsla(");
+    const validEnd = value.endsWith(")");
+    if (!validStart || !validEnd) return null;
+    const content = value.substring(value.indexOf("(") + 1, value.length - 1).split(",");
+    if (content.length < 3 || content.length > 4) return null;
+    if (value.startsWith("hsl(") && content.length !== 3) return null;
+    if (value.startsWith("hsla(") && content.length !== 4) return null;
+    const numbers = content.map((n) => parseFloat(n.trim()));
+    if (numbers.some((n) => isNaN(n))) return null;
+    let [h, s, l] = numbers;
+    h = h / 360;
+    h = h === 0 ? 1e-4 : h === 1 ? 0.9999 : h;
+    s = s / 100;
+    s = s === 0 ? 1e-4 : s === 1 ? 0.9999 : s;
+    l = l / 100;
+    l = l === 0 ? 1e-4 : l === 1 ? 0.9999 : l;
+    const rgb = hslToRGB(h, s, l);
+    return {
+      r: rgb.r,
+      g: rgb.g,
+      b: rgb.b,
+      a: numbers.length === 4 ? Math.min(1, Math.max(0, numbers[3])) : void 0
+    };
+  }
   function parseColorAttribute(value, defaultValue) {
     return parseAttribute(value, defaultValue, (value2) => {
-      const colorNameValues = colors[value2];
+      const colorNameValues = colors[value2.trim()];
       if (colorNameValues) {
         return {
           r: colorNameValues[0],
@@ -1753,75 +1797,16 @@
         }
       }
       if (value2.indexOf("rgb(") === 0) {
-        const rgb = /^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/.exec(value2);
-        if (rgb) {
-          return {
-            r: parseInt(rgb[1], 10) / 255,
-            g: parseInt(rgb[2], 10) / 255,
-            b: parseInt(rgb[3], 10) / 255
-          };
-        }
+        return parseRGB(value2);
       }
       if (value2.indexOf("rgba(") === 0) {
-        const rgba = /^rgba\((\d+),\s*(\d+),\s*(\d+),\s*(\d*\.?\d+)\)$/.exec(value2);
-        if (rgba) {
-          return {
-            r: parseInt(rgba[1], 10) / 255,
-            g: parseInt(rgba[2], 10) / 255,
-            b: parseInt(rgba[3], 10) / 255,
-            a: parseFloat(rgba[4])
-          };
-        }
+        return parseRGB(value2);
       }
       if (value2.indexOf("hsl(") === 0) {
-        const hsl = /^hsl\(\s*(\d+)\s*,\s*(\d+(?:\.\d+)?%)\s*,\s*(\d+(?:\.\d+)?%)\)$/.exec(value2);
-        if (hsl) {
-          let h = parseFloat(hsl[1]) / 360;
-          if (h === 0) {
-            h = 1e-4;
-          } else if (h === 1) {
-            h = 0.9999;
-          }
-          let s = parseFloat(hsl[2]) / 100;
-          if (s === 0) {
-            s = 1e-4;
-          } else if (s === 1) {
-            s = 0.9999;
-          }
-          let l = parseFloat(hsl[3]) / 100;
-          if (l === 0) {
-            l = 1e-4;
-          } else if (l === 1) {
-            l = 0.9999;
-          }
-          return hslToRGB(h, s, l);
-        }
+        return parseHSL(value2);
       }
       if (value2.indexOf("hsla(") === 0) {
-        const hsla = /^hsla\(\s*(\d+(?:\.\d+)?)\s*,\s*(\d+(?:\.\d+)?%)\s*,\s*(\d+(?:\.\d+)?%),\s*(\d+(?:\.\d+)?)\)$/.exec(
-          value2
-        );
-        if (hsla) {
-          let h = parseFloat(hsla[1]) / 360;
-          if (h === 0) {
-            h = 1e-4;
-          } else if (h === 1) {
-            h = 0.9999;
-          }
-          let s = parseFloat(hsla[2]) / 100;
-          if (s === 0) {
-            s = 1e-4;
-          } else if (s === 1) {
-            s = 0.9999;
-          }
-          let l = parseFloat(hsla[3]) / 100;
-          if (l === 0) {
-            l = 1e-4;
-          } else if (l === 1) {
-            l = 0.9999;
-          }
-          return hslToRGB(h, s, l);
-        }
+        return parseHSL(value2);
       }
       return null;
     });
@@ -65087,6 +65072,7 @@ ${DracoWorker.toString()}
         this.updateDebugVisualisation();
       }
       if (!src) {
+        this.latestSrcModelPromise = null;
         this.srcLoadingInstanceManager.abortIfLoading();
         this.socketChildrenByBone.forEach((children) => {
           children.forEach((child) => {
@@ -65098,10 +65084,13 @@ ${DracoWorker.toString()}
         return;
       }
       const contentSrc = this.model.contentSrcToContentAddress(src);
+      this.srcLoadingInstanceManager.start(this.model.getLoadingProgressManager(), contentSrc);
       const srcModelPromise = this.asyncLoadSourceAsset(contentSrc, (loaded, total) => {
+        if (this.latestSrcModelPromise !== srcModelPromise) {
+          return;
+        }
         this.srcLoadingInstanceManager.setProgress(loaded / total);
       });
-      this.srcLoadingInstanceManager.start(this.model.getLoadingProgressManager(), contentSrc);
       this.latestSrcModelPromise = srcModelPromise;
       srcModelPromise.then((asset2) => {
         if (this.latestSrcModelPromise !== srcModelPromise || !this.model.isConnected) {
@@ -65247,6 +65236,8 @@ ${DracoWorker.toString()}
         this.loadedState = null;
       }
       this.clearDebugVisualisation();
+      this.latestSrcModelPromise = null;
+      this.latestAnimPromise = null;
       this.animLoadingInstanceManager.dispose();
       this.srcLoadingInstanceManager.dispose();
     }
@@ -97870,10 +97861,13 @@ void main() {
         this.registeredParentAttachment = null;
       }
       const animSrc = this.model.contentSrcToContentAddress(anim2);
+      this.animLoadingInstanceManager.start(this.model.getLoadingProgressManager(), animSrc);
       const animPromise = this.asyncLoadSourceAsset(animSrc, (loaded, total) => {
+        if (this.latestAnimPromise !== animPromise) {
+          return;
+        }
         this.animLoadingInstanceManager.setProgress(loaded / total);
       });
-      this.animLoadingInstanceManager.start(this.model.getLoadingProgressManager(), animSrc);
       this.latestAnimPromise = animPromise;
       animPromise.then((result) => {
         if (this.latestAnimPromise !== animPromise || !this.model.isConnected) {
@@ -97892,6 +97886,22 @@ void main() {
       });
     }
     setAnimEnabled() {
+      if (this.model.props.animEnabled) {
+        if (this.animState && !this.animState.appliedAnimation) {
+          for (const [attachment] of this.attachments) {
+            this.registerAttachment(attachment);
+          }
+          this.playAnimation(this.animState.currentAnimationClip);
+        }
+      } else if (!this.model.props.animEnabled) {
+        for (const [attachment, animState] of this.attachments) {
+          if (animState) {
+            animState.animationMixer.stopAllAction();
+          }
+          this.attachments.set(attachment, null);
+          this.model.getContainer().add(attachment.getContainer());
+        }
+      }
     }
     setAnimLoop() {
     }
@@ -97916,6 +97926,7 @@ void main() {
         this.updateDebugVisualisation();
       }
       if (!src) {
+        this.latestSrcModelPromise = null;
         this.srcLoadingInstanceManager.abortIfLoading();
         this.socketChildrenByBone.forEach((children) => {
           children.forEach((child) => {
@@ -97927,10 +97938,13 @@ void main() {
         return;
       }
       const contentSrc = this.model.contentSrcToContentAddress(src);
+      this.srcLoadingInstanceManager.start(this.model.getLoadingProgressManager(), contentSrc);
       const srcModelPromise = this.asyncLoadSourceAsset(contentSrc, (loaded, total) => {
+        if (this.latestSrcModelPromise !== srcModelPromise) {
+          return;
+        }
         this.srcLoadingInstanceManager.setProgress(loaded / total);
       });
-      this.srcLoadingInstanceManager.start(this.model.getLoadingProgressManager(), contentSrc);
       this.latestSrcModelPromise = srcModelPromise;
       srcModelPromise.then((result) => {
         if (this.latestSrcModelPromise !== srcModelPromise || !this.model.isConnected) {
@@ -98183,6 +98197,8 @@ void main() {
         this.loadedState = null;
       }
       this.clearDebugVisualisation();
+      this.latestSrcModelPromise = null;
+      this.latestAnimPromise = null;
       this.animLoadingInstanceManager.dispose();
       this.srcLoadingInstanceManager.dispose();
     }