@combeenation/3d-viewer 21.0.1 → 21.1.0-beta2

package/src/utils/viewer-utils.ts

@@ -1,4 +1,7 @@
 import {
+  Animation,
+  AnimationGroup,
+  Color3,
   FloatArray,
   Geometry,
   Mesh,
@@ -13,6 +16,8 @@ import {
   Viewer,
 } from '../index';
 
+export type AnimatableProperties = 'albedoColor' | 'position' | 'rotation' | 'scaling' | 'influence';
+
 export type BakeGeometrySettings = {
   keepTransformation?: boolean;
 };
@@ -165,6 +170,76 @@ export class ViewerUtils {
       return this.findParentNode(parent, criteria);
     }
   }
+
+  /**
+   * Animates a single property of a target object from its current value to a given target value.\
+   * Supported property types are defined by {@link AnimatableProperties} (i.e. `number`, `Vector3`, `Color3`).
+   *
+   * @param target The object whose property should be animated
+   * @param property The name of the property to animate. Must be a key of `target` whose value type is supported.
+   * @param value The target value the property should reach at the end of the animation.
+   * @param animationName Name given to the internally created animation group.\
+   *                        Use a stable, unique name per animated property so that concurrent calls can be
+   *                        identified (e.g. `"$parameterAnimation.position.MyNode"`).
+   * @param animationTimeMs Duration of the animation in milliseconds.
+   */
+  public async animateProperty<T, K extends Extract<keyof T, AnimatableProperties>>(
+    target: T,
+    property: K,
+    value: T[K],
+    animationName: string,
+    animationTimeMs: number
+  ): Promise<void> {
+    const framesPerSec = 100;
+    // extend if further `AnimatableProperties` with different types are added
+    const dataType =
+      value instanceof Vector3
+        ? Animation.ANIMATIONTYPE_VECTOR3
+        : value instanceof Color3
+        ? Animation.ANIMATIONTYPE_COLOR3
+        : Animation.ANIMATIONTYPE_FLOAT;
+
+    const animationGroup = new AnimationGroup(animationName);
+
+    const animation = new Animation(property, property, framesPerSec, dataType);
+    animation.setKeys([
+      { frame: 0, value: target[property] },
+      { frame: framesPerSec, value: value },
+    ]);
+    animationGroup.addTargetedAnimation(animation, target);
+
+    await this.playAnimationGroupOnce(animationGroup, framesPerSec, Math.max(animationTimeMs, 0));
+  }
+
+  /**
+   * Plays an animation group exactly in a certain duration, then disposes it.
+   *
+   * The animation group is expected to span exactly `framesPerSec` frames (i.e. one "logical second").\
+   * The speed ratio is derived from that assumption: `speedRatio = 1000 / durationMs`.
+   *
+   * Due to this strict convention, the method is marked as @internal and should not be used directly by a consumer.
+   */
+  public playAnimationGroupOnce(
+    animationGroup: AnimationGroup,
+    framesPerSec: number,
+    durationMs: number
+  ): Promise<void> {
+    if (durationMs <= 0) {
+      animationGroup.dispose();
+      return Promise.resolve();
+    }
+
+    // animation is created for 1 second (100 frames), adjust speed ratio according to desired movement time
+    const speedRatio = 1000 / durationMs;
+
+    return new Promise<void>(resolve => {
+      animationGroup.onAnimationGroupEndObservable.addOnce(() => {
+        animationGroup.dispose();
+        resolve();
+      });
+      animationGroup.start(false, speedRatio, 0, framesPerSec);
+    });
+  }
 }
 
 /**

package/src/viewer.ts

@@ -301,6 +301,8 @@ export class Viewer {
     // call would already throw
     this._sceneManager.applyDefaultSettingsToScene();
 
+    this._parameterManager.addBuiltInParameterObservers();
+
     this._debugManager.registerAutofocusStartListener();
 
     engine.runRenderLoop(() => {

package/dist/lib-cjs/internal/animation-helper.d.ts

@@ -1,2 +0,0 @@
-import { AnimationGroup } from '../index';
-export declare function playAnimationGroupOnce(animationGroup: AnimationGroup, framesPerSec: number, durationMs: number): Promise<void>;

package/dist/lib-cjs/internal/animation-helper.js

@@ -1,16 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.playAnimationGroupOnce = void 0;
-function playAnimationGroupOnce(animationGroup, framesPerSec, durationMs) {
-    // animation is created for 1 second (100 frames), adjust speed ratio according to desired movement time
-    const speedRatio = 1000 / durationMs;
-    return new Promise(resolve => {
-        animationGroup.onAnimationGroupEndObservable.addOnce(() => {
-            animationGroup.dispose();
-            resolve();
-        });
-        animationGroup.start(false, speedRatio, 0, framesPerSec);
-    });
-}
-exports.playAnimationGroupOnce = playAnimationGroupOnce;
-//# sourceMappingURL=animation-helper.js.map

package/dist/lib-cjs/internal/animation-helper.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"animation-helper.js","sourceRoot":"","sources":["../../../src/internal/animation-helper.ts"],"names":[],"mappings":";;;AAEA,SAAgB,sBAAsB,CACpC,cAA8B,EAC9B,YAAoB,EACpB,UAAkB;IAElB,wGAAwG;IACxG,MAAM,UAAU,GAAG,IAAI,GAAG,UAAU,CAAC;IAErC,OAAO,IAAI,OAAO,CAAO,OAAO,CAAC,EAAE;QACjC,cAAc,CAAC,6BAA6B,CAAC,OAAO,CAAC,GAAG,EAAE;YACxD,cAAc,CAAC,OAAO,EAAE,CAAC;YACzB,OAAO,EAAE,CAAC;QACZ,CAAC,CAAC,CAAC;QACH,cAAc,CAAC,KAAK,CAAC,KAAK,EAAE,UAAU,EAAE,CAAC,EAAE,YAAY,CAAC,CAAC;IAC3D,CAAC,CAAC,CAAC;AACL,CAAC;AAfD,wDAeC"}

package/src/internal/animation-helper.ts

@@ -1,18 +0,0 @@
-import { AnimationGroup } from '../index';
-
-export function playAnimationGroupOnce(
-  animationGroup: AnimationGroup,
-  framesPerSec: number,
-  durationMs: number
-): Promise<void> {
-  // animation is created for 1 second (100 frames), adjust speed ratio according to desired movement time
-  const speedRatio = 1000 / durationMs;
-
-  return new Promise<void>(resolve => {
-    animationGroup.onAnimationGroupEndObservable.addOnce(() => {
-      animationGroup.dispose();
-      resolve();
-    });
-    animationGroup.start(false, speedRatio, 0, framesPerSec);
-  });
-}