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

package/build/index.js

@@ -985,6 +985,8 @@
         case "changeHiddenFrom":
           this.handleChangeHiddenFrom(message);
           break;
+        case "changeVisibleTo":
+          break;
         case "childrenRemoved":
           this.handleChildrenRemoved(message);
           break;
@@ -2315,13 +2317,20 @@
       }
       return lerpHSL(previousValue, elementValue, ratio);
     }
-    getFloatValueForTime(windowTime, elementValueSetTime, elementValue, previousValue) {
-      const from = previousValue;
+    getFloatValueForTime(windowTime, elementValueSetTime, elementValue, previousValue, isDegrees) {
+      let from = previousValue;
       const to = elementValue;
       const ratio = this.getLerpRatio(windowTime, elementValueSetTime);
       if (ratio >= 1) {
         return to;
       }
+      if (isDegrees) {
+        if (to - from > 180) {
+          from += 360;
+        } else if (from - to > 180) {
+          from -= 360;
+        }
+      }
       return from + (to - from) * ratio;
     }
     getLerpRatio(windowTime, elementValueSetTime) {
@@ -2379,6 +2388,9 @@
     }
   }
   function isColorAttribute(attributeState) {
+    return attributeState.type === 2;
+  }
+  function isDegreesAttribute(attributeState) {
     return attributeState.type === 1;
   }
   function isNumberAttribute(attributeState) {
@@ -2537,7 +2549,7 @@
         let stale = null;
         const state = this.stateByAttribute[key];
         for (const animation of state.animationsInOrder) {
-          const [newValue, active] = state.attributeState.type === 1 ? animation.getColorValueForTime(documentTime) : animation.getFloatValueForTime(documentTime);
+          const [newValue, active] = state.attributeState.type === 2 ? animation.getColorValueForTime(documentTime) : animation.getFloatValueForTime(documentTime);
           if (active === 0) {
             updateIfChangedValue(state, newValue);
             stale = null;
@@ -2573,6 +2585,17 @@
                   config.previousValue
                 )
               );
+            } else if (isDegreesAttribute(config)) {
+              updateIfChangedValue(
+                state,
+                lerp2.getFloatValueForTime(
+                  this.element.getWindowTime(),
+                  config.elementValueSetTime,
+                  config.elementValue,
+                  config.previousValue,
+                  true
+                )
+              );
             } else if (isNumberAttribute(config)) {
               updateIfChangedValue(
                 state,
@@ -2580,7 +2603,8 @@
                   this.element.getWindowTime(),
                   config.elementValueSetTime,
                   config.elementValue,
-                  config.previousValue
+                  config.previousValue,
+                  false
                 )
               );
             }
@@ -3592,7 +3616,7 @@
           }
         ],
         rx: [
-          0,
+          1,
           0,
           (newValue) => {
             var _a2;
@@ -3602,7 +3626,7 @@
           }
         ],
         ry: [
-          0,
+          1,
           0,
           (newValue) => {
             var _a2;
@@ -3612,7 +3636,7 @@
           }
         ],
         rz: [
-          0,
+          1,
           0,
           (newValue) => {
             var _a2;
@@ -4474,7 +4498,7 @@
       };
       this.cubeAnimatedAttributeHelper = new AnimatedAttributeHelper(this, {
         color: [
-          1,
+          2,
           defaultCubeColor,
           (newValue) => {
             var _a2;
@@ -4653,7 +4677,7 @@
       };
       this.cylinderAnimatedAttributeHelper = new AnimatedAttributeHelper(this, {
         color: [
-          1,
+          2,
           defaultCylinderColor,
           (newValue) => {
             var _a2;
@@ -6024,7 +6048,7 @@
       this.collideableHelper = new CollideableHelper(this);
       this.labelAnimatedAttributeHelper = new AnimatedAttributeHelper(this, {
         color: [
-          1,
+          2,
           defaultLabelColor,
           (newValue) => {
             var _a2;
@@ -6033,7 +6057,7 @@
           }
         ],
         "font-color": [
-          1,
+          2,
           defaultFontColor,
           (newValue) => {
             var _a2;
@@ -6236,7 +6260,7 @@
       super();
       this.lightAnimatedAttributeHelper = new AnimatedAttributeHelper(this, {
         color: [
-          1,
+          2,
           defaultLightColor,
           (newValue) => {
             var _a2;
@@ -6509,7 +6533,7 @@
       };
       this.planeAnimatedAttributeHelper = new AnimatedAttributeHelper(this, {
         color: [
-          1,
+          2,
           defaultPlaneColor,
           (newValue) => {
             var _a2;
@@ -7091,7 +7115,7 @@
       };
       this.sphereAnimatedAttributeHelper = new AnimatedAttributeHelper(this, {
         color: [
-          1,
+          2,
           defaultSphereColor,
           (newValue) => {
             var _a2;
@@ -97231,10 +97255,13 @@ void main() {
       this.mesh.castShadow = castShadows;
     }
     setOpacity(opacity) {
-      const needsUpdate = this.material.transparent === (opacity === 1);
-      this.material.transparent = opacity !== 1;
-      this.material.needsUpdate = needsUpdate;
+      const shouldBeTransparent = opacity !== 1 || this.loadedImageHasTransparency;
+      const needsUpdate = this.material.transparent !== shouldBeTransparent;
+      this.material.transparent = shouldBeTransparent;
       this.material.opacity = opacity;
+      if (needsUpdate) {
+        this.material.needsUpdate = true;
+      }
     }
     setEmissive() {
       this.updateMaterialEmissiveIntensity();
@@ -97327,15 +97354,9 @@ void main() {
       if (!this.material) {
         return;
       }
-      if (this.loadedImageHasTransparency) {
-        this.material.alphaMap = new CanvasTexture(this.loadedImage);
-        this.material.alphaTest = 0.01;
-      } else {
-        this.material.alphaMap = null;
-        this.material.alphaTest = 0;
-      }
-      this.material.transparent = this.image.props.opacity !== 1 || this.loadedImageHasTransparency;
       this.material.map = new CanvasTexture(this.loadedImage);
+      this.material.transparent = this.image.props.opacity !== 1 || this.loadedImageHasTransparency;
+      this.material.alphaTest = 0.01;
       this.material.needsUpdate = true;
       this.updateMaterialEmissiveIntensity();
       this.updateWidthAndHeight();