@combeenation/3d-viewer 6.5.0 → 7.0.0-beta1

package/src/api/classes/viewer.ts

@@ -3,6 +3,7 @@ import { sceneSetup } from '../internal/sceneSetup';
 import { AnimationManager } from '../manager/animationManager';
 import { GltfExportManager } from '../manager/gltfExportManager';
 import { SceneManager } from '../manager/sceneManager';
+import { TagManager } from '../manager/tagManager';
 import { VariantInstanceManager } from '../manager/variantInstanceManager';
 import { SpecStorage } from '../store/specStorage';
 import { backgroundDomeName, envHelperMetadataName } from '../util/babylonHelper';
@@ -14,7 +15,6 @@ import { AnimationInterface } from './animationInterface';
 import { Event } from './event';
 import { EventBroadcaster } from './eventBroadcaster';
 import { Parameter } from './parameter';
-import { Variant } from './variant';
 import { VariantInstance } from './variantInstance';
 import { ArcRotateCamera } from '@babylonjs/core/Cameras/arcRotateCamera';
 import { PickingInfo } from '@babylonjs/core/Collisions/pickingInfo';
@@ -52,18 +52,22 @@ export class Viewer extends EventBroadcaster {
 
   protected _sceneManager: SceneManager | null = null;
 
+  protected _tagManager: TagManager | null = null;
+
   protected _gltfExportManager: GltfExportManager | null = null;
 
   protected _variantInstances: VariantInstanceManager | null = null;
 
-  // default value is `true` ATM for compatibility reasons
+  // default value is `false` ATM for compatibility reasons
   // in the future material cloning should be the edge case
-  protected _cloneMaterialsOnMutation: boolean = true;
+  protected _cloneMaterialsOnMutation: boolean = false;
 
   protected _isRenderLoopPaused: boolean = false;
 
   protected _inspectorLoaded: boolean = false;
 
+  protected _nodeNamingStrategyHandler: NodeNamingStrategyHandler | null = null;
+
   static version = buildInfo.version;
 
   // these are constants for calculating the camera settings, depending on the bounding box size of the meshes to zoom
@@ -132,6 +136,24 @@ export class Viewer extends EventBroadcaster {
    */
   public constructor(public readonly canvas: HTMLCanvasElement, protected structureJson: string | StructureJson) {
     super();
+    this._tagManager = new TagManager(this);
+    this._nodeNamingStrategyHandler = (node, payload) => {
+      const suffix: string[] = [];
+      if (payload.variant.elements.length > 0) {
+        const nodeElements = payload.variant.elements.filter(
+          e => e.nodesFlat.filter(n => n.metadata?.cloneSource?.id === node.id).length > 0
+        );
+        if (nodeElements.length > 0) {
+          suffix.push(payload.variantParameterizable.name);
+        }
+      }
+      const variantInstances = this.variantInstances.allWithVariantName(payload.variant.name);
+      if (variantInstances.length > 0) {
+        suffix.push(payload.variantInstance.name);
+      }
+      const originalName = node.metadata?.originalName || node.name;
+      return [originalName, ...suffix.filter(s => !!s)].join('.');
+    };
   }
 
   /**
@@ -201,6 +223,13 @@ export class Viewer extends EventBroadcaster {
     return this._animationManager;
   }
 
+  get tagManager(): TagManager {
+    if (!this._tagManager) {
+      throw new Error(`There is no tagManager instance.`);
+    }
+    return this._tagManager;
+  }
+
   /**
    * Gets the `cloneMaterialsOnMutation` flag, as defined in the spec
    */
@@ -208,6 +237,26 @@ export class Viewer extends EventBroadcaster {
     return this._cloneMaterialsOnMutation;
   }
 
+  /**
+   * Gets the strategy handler for naming cloned nodes.
+   */
+  get nodeNamingStrategyHandler(): NodeNamingStrategyHandler {
+    if (!this._nodeNamingStrategyHandler) {
+      throw new Error(`The NodeNamingStrategyHandler has not been registered yet.`);
+    }
+    return this._nodeNamingStrategyHandler;
+  }
+
+  /**
+   * Sets the strategy handler for naming cloned nodes.
+   */
+  set nodeNamingStrategyHandler(value: NodeNamingStrategyHandler) {
+    if (!value || typeof value !== 'function') {
+      throw new Error(`The NodeNamingStrategyHandler is not a callable function.`);
+    }
+    this._nodeNamingStrategyHandler = value;
+  }
+
   /**
    * Starts the application. This will
    * * load the given "index" JSON file
@@ -220,9 +269,8 @@ export class Viewer extends EventBroadcaster {
    * @emits {@link Event.BOOTSTRAP_START}
    * @emits {@link Event.BOOTSTRAP_END}
    */
-  public async bootstrap(): Promise<Viewer> {
+  public async bootstrap(tagManagerParameterValues?: TagManagerParameterValue[]): Promise<Viewer> {
     this.broadcastEvent(Event.BOOTSTRAP_START, this);
-
     let indexJson;
     if (isString(this.structureJson)) {
       indexJson = await loadJson<StructureJson>(this.structureJson);
@@ -234,19 +282,16 @@ export class Viewer extends EventBroadcaster {
     }
     // fill spec store
     SpecStorage.createFromSpec(indexJson);
-
+    // init custom loader plugin
     this.initCbnBabylonLoaderPlugin();
-
     // load scene
     if (isString(indexJson.scene)) {
       const sceneJson = await loadJson<SceneJson>(indexJson.scene);
       indexJson.scene = sceneJson;
     }
     this._scene = await this.initScene();
-
     // create instance manager
-    const rootVariant = await Variant.create('_', indexJson, this);
-    this._variantInstances = await VariantInstanceManager.create(rootVariant);
+    this._variantInstances = await VariantInstanceManager.create(this);
     // create optional default instances
     if (indexJson.setup) {
       if (isString(indexJson.setup)) {
@@ -255,13 +300,17 @@ export class Viewer extends EventBroadcaster {
       }
       await this.createVariantInstances();
     }
+    this.broadcastEvent(Event.VARIANT_INSTANCES_READY, this);
     // create gltf export manager
     this._gltfExportManager = await GltfExportManager.create(this);
     // resize handler
     window.addEventListener('resize', debounce(this.resize.bind(this), 100));
     // wait until scene is completely ready
     await this.scene.whenReadyAsync();
-
+    // set tag manager values
+    if (tagManagerParameterValues) {
+      await this.tagManager.setParameterValues(tagManagerParameterValues);
+    }
     // event broadcasting
     this.broadcastEvent(Event.BOOTSTRAP_END, this);
     // render loop
@@ -495,7 +544,7 @@ export class Viewer extends EventBroadcaster {
       activeCamera.pinchPrecision = Viewer._autofocusConstants.pinchPrecision / radius;
     }
 
-    const radiusFactor = settings?.radiusFactor ?? 1;
+    const radiusFactor = settings?.radiusFactor ?? 1.5;
     const alpha = (settings?.alpha ?? -90) * (Math.PI / 180);
     const beta = (settings?.beta ?? 90) * (Math.PI / 180);
 
@@ -648,6 +697,8 @@ export class Viewer extends EventBroadcaster {
     if (sceneJson.cloneMaterialsOnMutation !== undefined) {
       this._cloneMaterialsOnMutation = sceneJson.cloneMaterialsOnMutation;
     }
+    // register observers for tag manager
+    this.tagManager.registerNewTransformNodeObservers(scene);
     this.broadcastEvent(Event.SCENE_PROCESSING_END, scene);
     return scene;
   }

package/src/api/classes/viewerLight.ts

@@ -106,7 +106,7 @@ export class ViewerLight extends VariantParameterizable {
    */
   protected addParameterObservers(): ViewerLight {
     this._parameterObservers.set(Parameter.VISIBLE, [
-      async (light: ViewerLight, oldValue: ParameterValue, newValue: ParameterValue) => {
+      async (light: ViewerLight, oldValue: Undefinable<ParameterValue>, newValue: ParameterValue) => {
         let visible;
         try {
           visible = Parameter.parseBoolean(newValue);
@@ -121,12 +121,12 @@ export class ViewerLight extends VariantParameterizable {
       },
     ]);
     this._parameterObservers.set(Parameter.INTENSITY, [
-      async (light: ViewerLight, oldValue: ParameterValue, newValue: ParameterValue) => {
+      async (light: ViewerLight, oldValue: Undefinable<ParameterValue>, newValue: ParameterValue) => {
         set(light.light, 'intensity', Parameter.parseNumber(newValue));
       },
     ]);
     this._parameterObservers.set(Parameter.SCALING, [
-      async (light: ViewerLight, oldValue: ParameterValue, newValue: ParameterValue) => {
+      async (light: ViewerLight, oldValue: Undefinable<ParameterValue>, newValue: ParameterValue) => {
         // we have to deal just with root nodes here due to relative impacts in a node tree
         const rootNode = getRootNode(light.light);
         if (rootNode instanceof TransformNode) {
@@ -139,7 +139,7 @@ export class ViewerLight extends VariantParameterizable {
       },
     ]);
     this._parameterObservers.set(Parameter.POSITION, [
-      async (light: ViewerLight, oldValue: ParameterValue, newValue: ParameterValue) => {
+      async (light: ViewerLight, oldValue: Undefinable<ParameterValue>, newValue: ParameterValue) => {
         // we have to deal just with root nodes here due to relative impacts in a node tree
         const rootNode = getRootNode(light.light);
         if (rootNode instanceof TransformNode) {
@@ -152,7 +152,7 @@ export class ViewerLight extends VariantParameterizable {
       },
     ]);
     this._parameterObservers.set(Parameter.ROTATION, [
-      async (light: ViewerLight, oldValue: ParameterValue, newValue: ParameterValue) => {
+      async (light: ViewerLight, oldValue: Undefinable<ParameterValue>, newValue: ParameterValue) => {
         // we have to deal just with root nodes here due to relative impacts in a node tree
         const rootNode = getRootNode(light.light);
         if (rootNode instanceof TransformNode) {
@@ -165,7 +165,7 @@ export class ViewerLight extends VariantParameterizable {
       },
     ]);
     this._parameterObservers.set(Parameter.DIRECTION, [
-      async (light: ViewerLight, oldValue: ParameterValue, newValue: ParameterValue) => {
+      async (light: ViewerLight, oldValue: Undefinable<ParameterValue>, newValue: ParameterValue) => {
         if (
           (light.light instanceof ShadowLight && !(light.light instanceof PointLight)) ||
           light.light instanceof HemisphericLight
@@ -175,26 +175,26 @@ export class ViewerLight extends VariantParameterizable {
       },
     ]);
     this._parameterObservers.set(Parameter.ANGLE, [
-      async (light: ViewerLight, oldValue: ParameterValue, newValue: ParameterValue) => {
+      async (light: ViewerLight, oldValue: Undefinable<ParameterValue>, newValue: ParameterValue) => {
         if (light.light.getClassName() === 'SpotLight') {
           set(light.light, 'angle', Parameter.parseNumber(newValue));
         }
       },
     ]);
     this._parameterObservers.set(Parameter.EXPONENT, [
-      async (light: ViewerLight, oldValue: ParameterValue, newValue: ParameterValue) => {
+      async (light: ViewerLight, oldValue: Undefinable<ParameterValue>, newValue: ParameterValue) => {
         if (light.light.getClassName() === 'SpotLight') {
           set(light.light, 'exponent', Parameter.parseNumber(newValue));
         }
       },
     ]);
     this._parameterObservers.set(Parameter.DIFFUSE, [
-      async (light: ViewerLight, oldValue: ParameterValue, newValue: ParameterValue) => {
+      async (light: ViewerLight, oldValue: Undefinable<ParameterValue>, newValue: ParameterValue) => {
         set(light.light, 'diffuse', Parameter.parseColor(newValue));
       },
     ]);
     this._parameterObservers.set(Parameter.SPECULAR, [
-      async (light: ViewerLight, oldValue: ParameterValue, newValue: ParameterValue) => {
+      async (light: ViewerLight, oldValue: Undefinable<ParameterValue>, newValue: ParameterValue) => {
         set(light.light, 'specular', Parameter.parseColor(newValue));
       },
     ]);

package/src/api/manager/animationManager.ts

@@ -2,7 +2,7 @@ import { AnimationInterface } from '../classes/animationInterface';
 import { PlacementAnimation } from '../classes/placementAnimation';
 import { Animation as BabylonAnimation } from '@babylonjs/core/Animations/animation';
 import { ArcRotateCamera } from '@babylonjs/core/Cameras/arcRotateCamera';
-import { Scene as BabylonScene, Scene } from '@babylonjs/core/scene';
+import { Scene as BabylonScene } from '@babylonjs/core/scene';
 import { Nullable } from '@babylonjs/core/types';
 //import { CustomEase } from 'gsap/CustomEase';
 //import { ExpoScaleEase, RoughEase, SlowMo } from 'gsap/EasePack';
@@ -16,7 +16,7 @@ export class AnimationManager {
   /**
    * Constructor.
    */
-  protected constructor(protected scene: Scene) {}
+  protected constructor(protected scene: BabylonScene) {}
 
   /**
    * Creates an {@link AnimationManager} based on given BabylonJS scene.

package/src/api/manager/sceneManager.ts

@@ -93,7 +93,11 @@ export class SceneManager extends ParameterObservable {
   }
 
   protected addParameterObservers(): SceneManager {
-    const handleEnvParamChange = (manager: SceneManager, oldValue: ParameterValue, newValue: ParameterValue) => {
+    const handleEnvParamChange = (
+      manager: SceneManager,
+      oldValue: Undefinable<ParameterValue>,
+      newValue: ParameterValue
+    ) => {
       const params = {
         color: manager.parameters[Parameter.ENVIRONMENT_COLOR],
         intensity: manager.parameters[Parameter.ENVIRONMENT_INTENSITY],