@combeenation/3d-viewer 12.4.1 → 12.4.3

package/src/api/util/sceneLoaderHelper.ts

@@ -1,247 +1,247 @@
-import { Event, emitter } from '../classes/event';
-import { applyMaterial, getOrCreateMaterial, injectMetadata } from './babylonHelper';
-import { sleep } from './resourceHelper';
-import { ISceneLoaderPlugin } from '@babylonjs/core/Loading/sceneLoader';
-import { Material } from '@babylonjs/core/Materials/material';
-import { InstancedMesh } from '@babylonjs/core/Meshes/instancedMesh';
-import { Observer } from '@babylonjs/core/Misc/observable';
-import { Tags } from '@babylonjs/core/Misc/tags';
-import { AssetContainer } from '@babylonjs/core/assetContainer';
-//! overload DOM API Node due to name-clash with BJS
-import { Node as BjsNode } from '@babylonjs/core/node';
-import { Scene } from '@babylonjs/core/scene';
-import { Nullable } from '@babylonjs/core/types';
-import { isArray, isString } from 'lodash-es';
-import has from 'lodash-es/has';
-
-// map for keeping track of active "node enable" observers
-const enableObserverMap: {
-  [concerningNodeId: string]: { currNodeId: string; observer: Nullable<Observer<boolean>> }[];
-} = {};
-
-export const missingMaterialMetadataName = 'missingMaterial';
-export const parsedMaterialIdMetadataName = 'parsedMaterialId';
-
-/**
- * Create and return a custom loader plugin to be registered with SceneLoader, that allows
- * us to run our own code against the input data before using the standard procedure to
- * import.
- * @param previousLoaderPlugin the actual loader that's executed after manipulating the input data
- * @returns Custom loader plugin to be registered with SceneLoader.RegisterPlugin()
- */
-export const getCustomCbnBabylonLoaderPlugin = function (previousLoaderPlugin: ISceneLoaderPlugin): ISceneLoaderPlugin {
-  const customLoader: ISceneLoaderPlugin = {
-    name: 'cbnCustomBabylonLoader',
-    extensions: '.babylon',
-    importMesh: previousLoaderPlugin.importMesh,
-    load: previousLoaderPlugin.load,
-    loadAssetContainer: function (scene, data, rootUrl, onError) {
-      //* 1) --- manipulate ORIGINAL data
-      const dataParsed = JSON.parse(data);
-      //* 2) --- call default (non-custom) loading method
-      const importedContainer = previousLoaderPlugin.loadAssetContainer(scene, data, rootUrl);
-      //* 3) --- manipulate IMPORTED data
-      addMissingMaterialMetadata(dataParsed, importedContainer);
-      reconstructTagsForInstancedMeshes(dataParsed, importedContainer);
-      //* 4) --- return imported data
-      return importedContainer;
-    },
-  };
-  return customLoader;
-};
-
-/**
- * Return an observer to be applied to meshes in order to post-load missing materials
- * upon set enabled/visible.
- *
- * @param concerningMesh Mesh to look for missing materials on, and create/apply to (when found).
- * @returns observer
- */
-export const getMaterialPostLoadObserver = function (concerningMesh: Mesh) {
-  return async () => {
-    const scene = concerningMesh.getScene();
-
-    // can't check `isEnabled` immediatly, since the enabled state of parents and childs is not synced yet
-    // postpone one cycle to ensure a correct parent-child enable relation
-    await sleep(0);
-
-    const hasBeenEnabled = concerningMesh.isEnabled(true);
-    const materialMissing = has(concerningMesh.metadata, missingMaterialMetadataName);
-    if (!hasBeenEnabled || !materialMissing) return;
-    // get id of missing material
-    const missingMatId = concerningMesh.metadata[missingMaterialMetadataName];
-    // get material and apply it on the concerning mesh after all textures have been loaded
-    const material = await getOrCreateMaterial(concerningMesh.getScene(), missingMatId);
-    applyMaterial(material, concerningMesh).then(() =>
-      emitter.emit(Event.MESH_MATERIAL_APPLIED, concerningMesh, material)
-    );
-    // since the material is there now, we do not need the related metadata tag anymore
-    delete concerningMesh.metadata[missingMaterialMetadataName];
-
-    // remove all "enable" observers that were assigned to the concerning mesh
-    // the mesh got visible and therefore the observers are not needed anymore
-    enableObserverMap[concerningMesh.id]?.forEach(entry => {
-      const currNode = scene.getMeshById(entry.currNodeId);
-      currNode?.onEnabledStateChangedObservable.remove(entry.observer);
-    });
-    // also remove from the local observer map
-    delete enableObserverMap[concerningMesh.id];
-  };
-};
-
-type InstanceData = {
-  name: string;
-  tags?: string;
-};
-
-function _isMeshInstanceData(data: any): data is InstanceData {
-  const hasName = isString(data.name);
-  const hasValidTags = !data.tags || isString(data.tags);
-  return hasName && hasValidTags;
-}
-
-type MeshData = {
-  name: string;
-  materialId?: string;
-  instances?: unknown[];
-};
-
-function _isMeshData(data: any): data is MeshData {
-  const hasName = isString(data.name);
-  const hasValidMaterialId = !data.materialId || isString(data.materialId);
-
-  return hasName && hasValidMaterialId;
-}
-
-type DataWithMeshes = { meshes: unknown[] };
-
-function _isDataWithMeshes(data: any): data is DataWithMeshes {
-  return data && isArray(data.meshes);
-}
-
-/**
- * Internal function that compares the original meshes on a .babylon file with what was loaded,
- * and tags missing materials with respective metadata on respective meshes.
- * @param dataParsed original data
- * @param container  loaded data
- */
-export const addMissingMaterialMetadata = function (dataParsed: unknown, container: AssetContainer) {
-  if (!_isDataWithMeshes(dataParsed)) return;
-
-  const validatedMeshes = dataParsed.meshes.filter(_isMeshData);
-
-  container.meshes.forEach(importedMesh => {
-    const parsedMesh = validatedMeshes.find(mesh => mesh.name === importedMesh.name);
-
-    // save original material id of the imported babylon or GLB file
-    injectMetadata(importedMesh, { [parsedMaterialIdMetadataName]: parsedMesh?.materialId }, false);
-
-    const materialOnImportedMesh = importedMesh.material?.id;
-    const materialOnOriginalMesh = parsedMesh?.materialId;
-
-    if (materialOnOriginalMesh && materialOnImportedMesh !== materialOnOriginalMesh) {
-      window.Cbn?.Assets.assertMaterialExists(materialOnOriginalMesh);
-      injectMetadata(importedMesh, { [missingMaterialMetadataName]: materialOnOriginalMesh }, false);
-    }
-  });
-};
-
-/**
- * Help function for manipulating tags of instances meshes after parsing.
- * Per default babylon attaches the tags of the source mesh to the instance, **but only** if no tags are set for the
- * instanced mesh. If the instanced mesh has dedicated tags set, the ones from the source mesh are **not** copied over.
- * In this case it's not possible to have tags on the source mesh but not on the instance, which is a problem with our
- * tagging system in the viewer and the Combeenation asset editor as well.
- * This function rejects the default tag import algorithm and just copies the tags of the original parsed node without
- * any parent synchronization.
- *
- * @param dataParsed original data
- * @param container  loaded data
- */
-export const reconstructTagsForInstancedMeshes = function (dataParsed: unknown, container: AssetContainer) {
-  if (!_isDataWithMeshes(dataParsed)) return;
-
-  const validatedMeshes = dataParsed.meshes.filter(_isMeshData);
-
-  container.meshes.forEach(importedMesh => {
-    if (importedMesh instanceof InstancedMesh) {
-      // remove all tags from the imported mesh if there are some, since these tags are probably coming from the
-      // source mesh, if no tags are set there is no need for further operation though
-      const importedTags = Tags.GetTags(importedMesh);
-      if (importedTags) {
-        Tags.RemoveTagsFrom(importedMesh, importedTags);
-
-        // get tags of parsed instanced mesh and set them on the imported instanced mesh
-        const parsedSourceMesh = validatedMeshes.find(mesh => mesh.name === importedMesh.sourceMesh.name);
-        const validatedSourceMeshInstances = parsedSourceMesh?.instances?.filter(_isMeshInstanceData);
-        const parsedInstancedMesh = validatedSourceMeshInstances?.find(mesh => mesh.name === importedMesh.name);
-        const parsedTags = parsedInstancedMesh?.tags;
-        if (parsedTags) {
-          Tags.AddTagsTo(importedMesh, parsedTags);
-        }
-      }
-    }
-  });
-};
-
-/**
- * Adds an "onEnabledStateChanged" observer to the given mesh and all its parents:
- * The added observer (`getMaterialPostLoadObserver`) handles creation of missing materials once the given node is
- * enabled.
- */
-export const addMissingMaterialObserver = function (node: BjsNode) {
-  // set the concerning node, i.e. the node the observer should check for missing material.
-  // for instanced meshes, we want the sourcemesh here.
-  const concerningNode = node instanceof InstancedMesh ? node.sourceMesh : (node as Mesh);
-
-  // observer is pointless if concerning node has no missing material
-  if (!has(concerningNode.metadata, missingMaterialMetadataName)) return;
-
-  // for each of our AbstractMeshes, set an observer on the AbstractMesh itself and all of its parents.
-  let currNode: Nullable<BjsNode> = node;
-  while (currNode) {
-    const callback = getMaterialPostLoadObserver(concerningNode);
-    const observer = currNode.onEnabledStateChangedObservable.add(callback);
-
-    // store the observer in a local map to keep track of the active "enable" observers
-    // observers will be removed when the concerning node gets enabled
-    if (!enableObserverMap[concerningNode.id]) {
-      enableObserverMap[concerningNode.id] = [];
-    }
-    enableObserverMap[concerningNode.id].push({ currNodeId: currNode.id, observer });
-
-    currNode = currNode.parent;
-  }
-};
-
-export const removeMissingMaterialObserver = function (node: BjsNode) {
-  // set the concerning node, i.e. the node the observer should check for missing material.
-  // for instanced meshes, we want the sourcemesh here.
-  const concerningNode = node instanceof InstancedMesh ? node.sourceMesh : (node as Mesh);
-  let currNode: Nullable<BjsNode> = node;
-  while (currNode) {
-    enableObserverMap[concerningNode.id]?.forEach(entry => {
-      if (entry.currNodeId === currNode?.id) {
-        currNode.onEnabledStateChangedObservable.remove(entry.observer);
-      }
-    });
-    currNode = currNode.parent;
-  }
-  delete enableObserverMap[concerningNode.id];
-};
-
-/**
- * Look up the provided materials (see library import) and create and return one if found.
- *
- * @param materialId Babylon.js material-id. E.g. 'concrete".
- * @param scene Babylon.js scene
- * @returns PBRMaterial | null
- */
-export const createMaterialFromCbnAssets = async function (materialId: string, scene: Scene): Promise<Material | null> {
-  const materialDefinition = await window.Cbn?.Assets.getMaterial(materialId);
-  // The generic `Material.Parse` actually returns a more specific material like `BABYLON.StandardMaterial`,
-  // `BABYLON.PBRMaterial` or stuff like `BABYLON.PBRMetallicRoughnessMaterial` etc. based on the given `customType`
-  // within the material JSON definition
-  const material = materialDefinition && Material.Parse(materialDefinition, scene, '');
-  return material || null;
-};
+import { Event, emitter } from '../classes/event';
+import { applyMaterial, getOrCreateMaterial, injectMetadata } from './babylonHelper';
+import { sleep } from './resourceHelper';
+import { ISceneLoaderPlugin } from '@babylonjs/core/Loading/sceneLoader';
+import { Material } from '@babylonjs/core/Materials/material';
+import { InstancedMesh } from '@babylonjs/core/Meshes/instancedMesh';
+import { Observer } from '@babylonjs/core/Misc/observable';
+import { Tags } from '@babylonjs/core/Misc/tags';
+import { AssetContainer } from '@babylonjs/core/assetContainer';
+//! overload DOM API Node due to name-clash with BJS
+import { Node as BjsNode } from '@babylonjs/core/node';
+import { Scene } from '@babylonjs/core/scene';
+import { Nullable } from '@babylonjs/core/types';
+import { isArray, isString } from 'lodash-es';
+import has from 'lodash-es/has';
+
+// map for keeping track of active "node enable" observers
+const enableObserverMap: {
+  [concerningNodeId: string]: { currNodeId: string; observer: Nullable<Observer<boolean>> }[];
+} = {};
+
+export const missingMaterialMetadataName = 'missingMaterial';
+export const parsedMaterialIdMetadataName = 'parsedMaterialId';
+
+/**
+ * Create and return a custom loader plugin to be registered with SceneLoader, that allows
+ * us to run our own code against the input data before using the standard procedure to
+ * import.
+ * @param previousLoaderPlugin the actual loader that's executed after manipulating the input data
+ * @returns Custom loader plugin to be registered with SceneLoader.RegisterPlugin()
+ */
+export const getCustomCbnBabylonLoaderPlugin = function (previousLoaderPlugin: ISceneLoaderPlugin): ISceneLoaderPlugin {
+  const customLoader: ISceneLoaderPlugin = {
+    name: 'cbnCustomBabylonLoader',
+    extensions: '.babylon',
+    importMesh: previousLoaderPlugin.importMesh,
+    load: previousLoaderPlugin.load,
+    loadAssetContainer: function (scene, data, rootUrl, onError) {
+      //* 1) --- manipulate ORIGINAL data
+      const dataParsed = JSON.parse(data);
+      //* 2) --- call default (non-custom) loading method
+      const importedContainer = previousLoaderPlugin.loadAssetContainer(scene, data, rootUrl);
+      //* 3) --- manipulate IMPORTED data
+      addMissingMaterialMetadata(dataParsed, importedContainer);
+      reconstructTagsForInstancedMeshes(dataParsed, importedContainer);
+      //* 4) --- return imported data
+      return importedContainer;
+    },
+  };
+  return customLoader;
+};
+
+/**
+ * Return an observer to be applied to meshes in order to post-load missing materials
+ * upon set enabled/visible.
+ *
+ * @param concerningMesh Mesh to look for missing materials on, and create/apply to (when found).
+ * @returns observer
+ */
+export const getMaterialPostLoadObserver = function (concerningMesh: Mesh) {
+  return async () => {
+    const scene = concerningMesh.getScene();
+
+    // can't check `isEnabled` immediatly, since the enabled state of parents and childs is not synced yet
+    // postpone one cycle to ensure a correct parent-child enable relation
+    await sleep(0);
+
+    const hasBeenEnabled = concerningMesh.isEnabled(true);
+    const materialMissing = has(concerningMesh.metadata, missingMaterialMetadataName);
+    if (!hasBeenEnabled || !materialMissing) return;
+    // get id of missing material
+    const missingMatId = concerningMesh.metadata[missingMaterialMetadataName];
+    // get material and apply it on the concerning mesh after all textures have been loaded
+    const material = await getOrCreateMaterial(concerningMesh.getScene(), missingMatId);
+    applyMaterial(material, concerningMesh).then(() =>
+      emitter.emit(Event.MESH_MATERIAL_APPLIED, concerningMesh, material)
+    );
+    // since the material is there now, we do not need the related metadata tag anymore
+    delete concerningMesh.metadata[missingMaterialMetadataName];
+
+    // remove all "enable" observers that were assigned to the concerning mesh
+    // the mesh got visible and therefore the observers are not needed anymore
+    enableObserverMap[concerningMesh.id]?.forEach(entry => {
+      const currNode = scene.getMeshById(entry.currNodeId);
+      currNode?.onEnabledStateChangedObservable.remove(entry.observer);
+    });
+    // also remove from the local observer map
+    delete enableObserverMap[concerningMesh.id];
+  };
+};
+
+type InstanceData = {
+  name: string;
+  tags?: string;
+};
+
+function _isMeshInstanceData(data: any): data is InstanceData {
+  const hasName = isString(data.name);
+  const hasValidTags = !data.tags || isString(data.tags);
+  return hasName && hasValidTags;
+}
+
+type MeshData = {
+  name: string;
+  materialId?: string;
+  instances?: unknown[];
+};
+
+function _isMeshData(data: any): data is MeshData {
+  const hasName = isString(data.name);
+  const hasValidMaterialId = !data.materialId || isString(data.materialId);
+
+  return hasName && hasValidMaterialId;
+}
+
+type DataWithMeshes = { meshes: unknown[] };
+
+function _isDataWithMeshes(data: any): data is DataWithMeshes {
+  return data && isArray(data.meshes);
+}
+
+/**
+ * Internal function that compares the original meshes on a .babylon file with what was loaded,
+ * and tags missing materials with respective metadata on respective meshes.
+ * @param dataParsed original data
+ * @param container  loaded data
+ */
+export const addMissingMaterialMetadata = function (dataParsed: unknown, container: AssetContainer) {
+  if (!_isDataWithMeshes(dataParsed)) return;
+
+  const validatedMeshes = dataParsed.meshes.filter(_isMeshData);
+
+  container.meshes.forEach(importedMesh => {
+    const parsedMesh = validatedMeshes.find(mesh => mesh.name === importedMesh.name);
+
+    // save original material id of the imported babylon or GLB file
+    injectMetadata(importedMesh, { [parsedMaterialIdMetadataName]: parsedMesh?.materialId }, false);
+
+    const materialOnImportedMesh = importedMesh.material?.id;
+    const materialOnOriginalMesh = parsedMesh?.materialId;
+
+    if (materialOnOriginalMesh && materialOnImportedMesh !== materialOnOriginalMesh) {
+      window.Cbn?.Assets.assertMaterialExists(materialOnOriginalMesh);
+      injectMetadata(importedMesh, { [missingMaterialMetadataName]: materialOnOriginalMesh }, false);
+    }
+  });
+};
+
+/**
+ * Help function for manipulating tags of instances meshes after parsing.
+ * Per default babylon attaches the tags of the source mesh to the instance, **but only** if no tags are set for the
+ * instanced mesh. If the instanced mesh has dedicated tags set, the ones from the source mesh are **not** copied over.
+ * In this case it's not possible to have tags on the source mesh but not on the instance, which is a problem with our
+ * tagging system in the viewer and the Combeenation asset editor as well.
+ * This function rejects the default tag import algorithm and just copies the tags of the original parsed node without
+ * any parent synchronization.
+ *
+ * @param dataParsed original data
+ * @param container  loaded data
+ */
+export const reconstructTagsForInstancedMeshes = function (dataParsed: unknown, container: AssetContainer) {
+  if (!_isDataWithMeshes(dataParsed)) return;
+
+  const validatedMeshes = dataParsed.meshes.filter(_isMeshData);
+
+  container.meshes.forEach(importedMesh => {
+    if (importedMesh instanceof InstancedMesh) {
+      // remove all tags from the imported mesh if there are some, since these tags are probably coming from the
+      // source mesh, if no tags are set there is no need for further operation though
+      const importedTags = Tags.GetTags(importedMesh);
+      if (importedTags) {
+        Tags.RemoveTagsFrom(importedMesh, importedTags);
+
+        // get tags of parsed instanced mesh and set them on the imported instanced mesh
+        const parsedSourceMesh = validatedMeshes.find(mesh => mesh.name === importedMesh.sourceMesh.name);
+        const validatedSourceMeshInstances = parsedSourceMesh?.instances?.filter(_isMeshInstanceData);
+        const parsedInstancedMesh = validatedSourceMeshInstances?.find(mesh => mesh.name === importedMesh.name);
+        const parsedTags = parsedInstancedMesh?.tags;
+        if (parsedTags) {
+          Tags.AddTagsTo(importedMesh, parsedTags);
+        }
+      }
+    }
+  });
+};
+
+/**
+ * Adds an "onEnabledStateChanged" observer to the given mesh and all its parents:
+ * The added observer (`getMaterialPostLoadObserver`) handles creation of missing materials once the given node is
+ * enabled.
+ */
+export const addMissingMaterialObserver = function (node: BjsNode) {
+  // set the concerning node, i.e. the node the observer should check for missing material.
+  // for instanced meshes, we want the sourcemesh here.
+  const concerningNode = node instanceof InstancedMesh ? node.sourceMesh : (node as Mesh);
+
+  // observer is pointless if concerning node has no missing material
+  if (!has(concerningNode.metadata, missingMaterialMetadataName)) return;
+
+  // for each of our AbstractMeshes, set an observer on the AbstractMesh itself and all of its parents.
+  let currNode: Nullable<BjsNode> = node;
+  while (currNode) {
+    const callback = getMaterialPostLoadObserver(concerningNode);
+    const observer = currNode.onEnabledStateChangedObservable.add(callback);
+
+    // store the observer in a local map to keep track of the active "enable" observers
+    // observers will be removed when the concerning node gets enabled
+    if (!enableObserverMap[concerningNode.id]) {
+      enableObserverMap[concerningNode.id] = [];
+    }
+    enableObserverMap[concerningNode.id].push({ currNodeId: currNode.id, observer });
+
+    currNode = currNode.parent;
+  }
+};
+
+export const removeMissingMaterialObserver = function (node: BjsNode) {
+  // set the concerning node, i.e. the node the observer should check for missing material.
+  // for instanced meshes, we want the sourcemesh here.
+  const concerningNode = node instanceof InstancedMesh ? node.sourceMesh : (node as Mesh);
+  let currNode: Nullable<BjsNode> = node;
+  while (currNode) {
+    enableObserverMap[concerningNode.id]?.forEach(entry => {
+      if (entry.currNodeId === currNode?.id) {
+        currNode.onEnabledStateChangedObservable.remove(entry.observer);
+      }
+    });
+    currNode = currNode.parent;
+  }
+  delete enableObserverMap[concerningNode.id];
+};
+
+/**
+ * Look up the provided materials (see library import) and create and return one if found.
+ *
+ * @param materialId Babylon.js material-id. E.g. 'concrete".
+ * @param scene Babylon.js scene
+ * @returns PBRMaterial | null
+ */
+export const createMaterialFromCbnAssets = async function (materialId: string, scene: Scene): Promise<Material | null> {
+  const materialDefinition = await window.Cbn?.Assets.getMaterial(materialId);
+  // The generic `Material.Parse` actually returns a more specific material like `BABYLON.StandardMaterial`,
+  // `BABYLON.PBRMaterial` or stuff like `BABYLON.PBRMetallicRoughnessMaterial` etc. based on the given `customType`
+  // within the material JSON definition
+  const material = materialDefinition && Material.Parse(materialDefinition, scene, '');
+  return material || null;
+};

package/src/api/util/stringHelper.ts

@@ -1,30 +1,30 @@
-/**
- * Creates a random uuidv4.
- */
-const uuidv4 = function () {
-  return ([1e7].toString() + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, c => {
-    const cNum = parseInt(c);
-    return (cNum ^ (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (cNum / 4)))).toString(16);
-  });
-};
-
-/**
- * Converts a string from camel case to snake case.
- */
-const camelToSnakeCase = function (str: string): string {
-  return str
-    .replace(/([A-Z])/g, ' $1')
-    .trim()
-    .split(' ')
-    .join('_')
-    .toLowerCase();
-};
-
-/**
- * Replaces all dots from the input string with a desired character ('/' by default)
- */
-const replaceDots = function (str: string, replaceChar = '/'): string {
-  return str.split('.').join(replaceChar);
-};
-
-export { uuidv4, camelToSnakeCase, replaceDots };
+/**
+ * Creates a random uuidv4.
+ */
+const uuidv4 = function () {
+  return ([1e7].toString() + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, c => {
+    const cNum = parseInt(c);
+    return (cNum ^ (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (cNum / 4)))).toString(16);
+  });
+};
+
+/**
+ * Converts a string from camel case to snake case.
+ */
+const camelToSnakeCase = function (str: string): string {
+  return str
+    .replace(/([A-Z])/g, ' $1')
+    .trim()
+    .split(' ')
+    .join('_')
+    .toLowerCase();
+};
+
+/**
+ * Replaces all dots from the input string with a desired character ('/' by default)
+ */
+const replaceDots = function (str: string, replaceChar = '/'): string {
+  return str.split('.').join(replaceChar);
+};
+
+export { uuidv4, camelToSnakeCase, replaceDots };