@combeenation/3d-viewer 9.2.1-alpha1 → 10.0.0-alpha3

package/src/api/manager/gltfExportManager.ts

@@ -1,306 +1,312 @@
-import { bakeGeometryOfAllMeshes } from '..//util/geometryHelper';
-import { Viewer } from '../classes/viewer';
-import { injectMetadata } from '../util/babylonHelper';
-import { isNodeIncludedInExclusionList } from '../util/structureHelper';
-import { Engine } from '@babylonjs/core/Engines/engine';
-import { EngineStore } from '@babylonjs/core/Engines/engineStore';
-import { SceneLoader } from '@babylonjs/core/Loading/sceneLoader';
-import { PBRMaterial } from '@babylonjs/core/Materials/PBR/pbrMaterial';
-import { Color3 } from '@babylonjs/core/Maths/math.color';
-import { AbstractMesh } from '@babylonjs/core/Meshes/abstractMesh';
-import { TransformNode } from '@babylonjs/core/Meshes/transformNode';
-import { SceneSerializer } from '@babylonjs/core/Misc/sceneSerializer';
-import { Scene } from '@babylonjs/core/scene';
-import { GLTF2Export, IExportOptions } from '@babylonjs/serializers/glTF/2.0';
-import { has, merge } from 'lodash-es';
-
-type MetadataMap = { [key: string]: any };
-export class GltfExportManager {
-  protected static readonly _CLONED_FROM_MAT_METADATA_PROPERTY = 'clonedFrom';
-  public static readonly NAME_BEFORE_EXPORT_METADATA_PROPERTY = 'nameBeforeExport';
-
-  /**
-   * Constructor.
-   */
-  protected constructor(protected viewer: Viewer) {}
-
-  /**
-   * Creates an {@link GltfExportManager}.
-   */
-  public static async create(viewer: Viewer): Promise<GltfExportManager> {
-    return new GltfExportManager(viewer);
-  }
-
-  /**
-   * Exports selected nodes to a file.
-   * @param filename optional name of the exported .GLB file.
-   * @param exportOptions export options to be merged with default options.\
-   *                      `exportOptions.exchangeRefractionMaterials` and `exportOptions.limitTextureSize`
-   *                      default to `true` if not given.
-   * @param optimizeForAR adjusts the exported GLB so that known AR issues get fixed automatically
-   * @param excluded optional list of geometry (meshes, elements, variants, variantInstances) to be excluded from export
-   */
-  public async exportGlb(
-    filename = 'glb-export.glb',
-    { exchangeRefractionMaterials = true, limitTextureSize = true, ...exportOptions }: IExportOptionsExtended = {},
-    optimizeForAR: boolean = false,
-    excluded?: ExcludedGeometryList
-  ): Promise<File | undefined> {
-    const { scene, sceneCopied } = await this.exportPreProcess(
-      exchangeRefractionMaterials,
-      limitTextureSize,
-      optimizeForAR
-    );
-    const glbData = await GLTF2Export.GLBAsync(scene, 'dummy', this.gltfExportOptions(exportOptions, excluded));
-    this.exportPostProcess(scene, sceneCopied);
-
-    const resBlob = glbData.glTFFiles['dummy.glb'];
-    // check if result is valid, according to the typings this could also be a string
-    if (resBlob instanceof Blob) {
-      if (!filename.endsWith('.glb')) {
-        filename += '.glb';
-      }
-      return new File([resBlob], filename);
-    } else {
-      // result was not a valid blob
-      return undefined;
-    }
-  }
-
-  /**
-   * Exports selected nodes to GLTF. This may result in more than one file, since textures are exported separately.
-   * @param filename name of the main (text-based) .GLTF file referring to separate texture files.
-   * @param exportOptions export options to be merged with default options.\
-   *                      `exportOptions.exchangeRefractionMaterials` and `exportOptions.limitTextureSize`
-   *                      default to `true` if not given.
-   * @param optimizeForAR adjusts the exported GLB so that known AR issues get fixed automatically
-   * @param excluded optional list of geometry (meshes, elements, variants, variantInstances) to be excluded from export
-   */
-  public async exportGltfToFile(
-    filename: string,
-    { exchangeRefractionMaterials = true, limitTextureSize = true, ...exportOptions }: IExportOptionsExtended = {},
-    optimizeForAR: boolean = false,
-    excluded?: ExcludedGeometryList
-  ) {
-    const { scene, sceneCopied } = await this.exportPreProcess(
-      exchangeRefractionMaterials,
-      limitTextureSize,
-      optimizeForAR
-    );
-    const gltf = await GLTF2Export.GLTFAsync(scene, filename, this.gltfExportOptions(exportOptions, excluded));
-    gltf.downloadFiles();
-    this.exportPostProcess(scene, sceneCopied);
-  }
-
-  /**
-   * Exports selected nodes to GLB. This results in one binary file.
-   * @param filename name of the .GLB file.
-   * @param exportOptions export options to be merged with default options.\
-   *                      `exportOptions.exchangeRefractionMaterials` and `exportOptions.limitTextureSize`
-   *                      default to `true` if not given.
-   * @param optimizeForAR adjusts the exported GLB so that known AR issues get fixed automatically
-   * @param excluded optional list of geometry (meshes, elements, variants, variantInstances) to be excluded from export
-   */
-  public async exportGlbToFile(
-    filename: string,
-    { exchangeRefractionMaterials = true, limitTextureSize = true, ...exportOptions }: IExportOptionsExtended = {},
-    optimizeForAR: boolean = false,
-    excluded?: ExcludedGeometryList
-  ) {
-    const { scene, sceneCopied } = await this.exportPreProcess(
-      exchangeRefractionMaterials,
-      limitTextureSize,
-      optimizeForAR
-    );
-    const glb = await GLTF2Export.GLBAsync(scene, filename, this.gltfExportOptions(exportOptions, excluded));
-    glb.downloadFiles();
-    this.exportPostProcess(scene, sceneCopied);
-  }
-
-  /**
-   * Gets predefined {@link IExportOptions } merged with given ones.
-   */
-  protected gltfExportOptions(mergeWithOptions: IExportOptions = {}, excluded?: ExcludedGeometryList): IExportOptions {
-    const defaultOptions: IExportOptions = {
-      shouldExportNode: function (node: any) {
-        if (!node.isEnabled()) {
-          return false;
-        }
-        if ((node.name as string).startsWith(Viewer.BOUNDING_BOX_NAME)) {
-          return false;
-        }
-        if (excluded && node instanceof TransformNode && isNodeIncludedInExclusionList(node, excluded)) {
-          return false;
-        }
-        return true;
-      },
-    };
-    return merge({}, defaultOptions, mergeWithOptions);
-  }
-
-  /**
-   * Stuff to be done before exporting to GLTF
-   *
-   * @returns Either the original scene if no adjustments have been made or a copied scene (which can be disposed after
-   * the export) if adjustments have been made
-   */
-  protected async exportPreProcess(
-    exchangeRefractionMaterials: boolean,
-    limitTextureSize: boolean,
-    optimizeForAR: boolean
-  ): Promise<{ scene: Scene; sceneCopied: boolean }> {
-    if (!exchangeRefractionMaterials && !optimizeForAR && !limitTextureSize) {
-      // no need to copy the scene if no adjustments have to be made
-      return { scene: this.viewer.scene, sceneCopied: false };
-    }
-
-    // copy the scene for the GLB export improvements, so that the original viewer scene remains untouched
-    const copiedScene = await this.copyViewerScene(limitTextureSize);
-
-    if (exchangeRefractionMaterials) {
-      this.exchangeRefractionMaterials(copiedScene);
-    }
-
-    if (optimizeForAR) {
-      this.setUniqueMeshNames(copiedScene);
-      // get rid of negative scalings and morph targets, since iOS can't handle it in the QuickLook app
-      bakeGeometryOfAllMeshes(copiedScene);
-    }
-
-    return { scene: copiedScene, sceneCopied: true };
-  }
-
-  /**
-   * Create a copy of the viewer scene, which can be further processed and optimized for the GLB export.
-   * There is no "scene.clone" function, therefore the scene is serialized and loaded again to achieve this result.
-   */
-  protected async copyViewerScene(limitTextureSize: boolean): Promise<Scene> {
-    // required by the scene serializer
-    await import(/* webpackChunkName: "physicsenginecomponent" */ '@babylonjs/core/Physics/physicsEngineComponent');
-
-    // copy scene function uses scene serializer, which can't handle "complex" data like classes, function or recursive
-    // data structures in metadata
-    // it basically does a `JSON.stringify` on the metadata
-    // therefore the metadata has to be removed from the nodes before the copy process
-    const metadataArr = this.extractMetadataOfAllNodes();
-
-    // serialize the scene
-    const serializedScene = await SceneSerializer.SerializeAsync(this.viewer.scene);
-
-    // set the cropped metadata back to the viewer scene nodes
-    this.restoreMetadataOfAllNodes(metadataArr);
-
-    // load the scene into an invisible "dummy" canvas
-    const dummyCanvas = document.createElement('canvas');
-    const engine = new Engine(dummyCanvas);
-
-    if (limitTextureSize) {
-      // according to some tests iOS devices break when exporting a scene with textures above 1024
-      // this only affects the scene clone for the export
-      engine.getCaps().maxTextureSize = 1024;
-    }
-
-    // overwritting _LastCreatedScene to fix issue: https://combeenation.youtrack.cloud/issue/CB-8972
-    // In short: dummy scene erroneously interacts with original viewer scene
-    // setting viewer scene as fallback again (`_LastCreatedScene`) resolves that issue
-    const curLastScene = EngineStore._LastCreatedScene;
-    const newScene = new Scene(engine);
-    EngineStore._LastCreatedScene = curLastScene;
-
-    SceneLoader.ShowLoadingScreen = false;
-    await SceneLoader.AppendAsync('', 'data:' + JSON.stringify(serializedScene), newScene, undefined, '.babylon');
-
-    return newScene;
-  }
-
-  /**
-   * Stuff to be done after the GLTF export
-   */
-  protected exportPostProcess(scene: Scene, disposeScene: boolean) {
-    if (disposeScene) {
-      // copied scene for GLB export is not needed anymore, therefore it can be removed
-      scene.getEngine().dispose();
-    }
-  }
-
-  /**
-   * Remove all node metadata and return them in a map
-   */
-  protected extractMetadataOfAllNodes(): MetadataMap {
-    return this.viewer.scene.getNodes().reduce((accMetadataObj, curNode) => {
-      const metadata = curNode.metadata;
-      delete curNode.metadata;
-      return { ...accMetadataObj, [curNode.uniqueId.toString()]: metadata };
-    }, {});
-  }
-
-  /**
-   * Restore node metadata from previously cropped metadata map
-   */
-  protected restoreMetadataOfAllNodes(metadataMap: MetadataMap) {
-    this.viewer.scene.getNodes().forEach(node => {
-      const metadata = metadataMap[node.uniqueId.toString()];
-      if (metadata) {
-        node.metadata = metadata;
-      }
-    });
-  }
-
-  /**
-   * Materials with refraction set are not exported properly.
-   * Exchange all such (relevant) materials with a more export-friendly version
-   */
-  protected exchangeRefractionMaterials(scene: Scene) {
-    for (const n of scene.getNodes()) {
-      if (!(n instanceof AbstractMesh)) continue;
-      if (!(n.material instanceof PBRMaterial)) continue;
-      if (!(n.material as PBRMaterial).subSurface.isRefractionEnabled) continue;
-      if ((n.material as PBRMaterial).transparencyMode !== PBRMaterial.PBRMATERIAL_OPAQUE) continue;
-      // if we're here, we have a node holding a material with set refraction whose transparencyMode is set to
-      // PBRMATERIAL_OPAQUE
-      n.material = this.createRefractionMaterialReplacement(n.material);
-    }
-  }
-
-  /**
-   * Create an export-friendly replacement material for a material using refraction.
-   * @param mat Material to be replaced
-   */
-  protected createRefractionMaterialReplacement(mat: PBRMaterial): PBRMaterial {
-    // if we're dealing with a clone already, return it instead of cloning
-    if (this.isMaterialClonedForExport(mat)) return mat;
-
-    // change material according to https://www.notion.so/combeenation/Glas-materials-don-t-look-glasy-after-export-d5fda2c6515e4420a8772744d3e6b460
-    const clonedMaterial = mat.clone(mat.name); // clone material. clone uses same name
-    clonedMaterial.metadata = { ...mat.metadata, [GltfExportManager._CLONED_FROM_MAT_METADATA_PROPERTY]: mat.uniqueId }; // create shallow copy of metadata on clone. see https://forum.babylonjs.com/t/the-metadata-of-the-mesh-cloned-by-the-instantiatemodelstoscene-method-is-a-shallow-copy/21563
-    clonedMaterial.refractionTexture = null;
-    clonedMaterial.metallicReflectanceTexture = null; // is this the correct one for metallic roughness?
-    clonedMaterial.alpha = 0.7;
-    clonedMaterial.albedoColor = new Color3(0.3, 0.3, 0.3);
-    clonedMaterial.transparencyMode = PBRMaterial.PBRMATERIAL_ALPHABLEND;
-    clonedMaterial.metallic = 0.65;
-    clonedMaterial.roughness = 0.15;
-
-    return clonedMaterial;
-  }
-
-  /**
-   * Inspect if a material was temporarily cloned for GLB export
-   * @param mat Material to be inspected
-   */
-  protected isMaterialClonedForExport(mat: PBRMaterial): boolean {
-    return has(mat.metadata, GltfExportManager._CLONED_FROM_MAT_METADATA_PROPERTY);
-  }
-
-  /**
-   * Set unique mesh names for GLB export.
-   * Duplicate names lead to problems in AR on iOS devices.
-   */
-  protected setUniqueMeshNames(scene: Scene): void {
-    const allNodes = scene.getNodes().filter(node => node instanceof TransformNode) as TransformNode[];
-    allNodes.forEach(currMesh => {
-      injectMetadata(currMesh, { [GltfExportManager.NAME_BEFORE_EXPORT_METADATA_PROPERTY]: currMesh.name }, false);
-      currMesh.name = `${currMesh.name}_${currMesh.uniqueId}`;
-    });
-  }
-}
+import { bakeGeometryOfAllMeshes } from '..//util/geometryHelper';
+import { Viewer } from '../classes/viewer';
+import { injectMetadata } from '../util/babylonHelper';
+import { isNodeIncludedInExclusionList } from '../util/structureHelper';
+import { Engine } from '@babylonjs/core/Engines/engine';
+import { EngineStore } from '@babylonjs/core/Engines/engineStore';
+import { SceneLoader } from '@babylonjs/core/Loading/sceneLoader';
+import { PBRMaterial } from '@babylonjs/core/Materials/PBR/pbrMaterial';
+import { Color3 } from '@babylonjs/core/Maths/math.color';
+import { AbstractMesh } from '@babylonjs/core/Meshes/abstractMesh';
+import { TransformNode } from '@babylonjs/core/Meshes/transformNode';
+import { SceneSerializer } from '@babylonjs/core/Misc/sceneSerializer';
+import { Scene } from '@babylonjs/core/scene';
+import { GLTF2Export, IExportOptions } from '@babylonjs/serializers/glTF/2.0';
+import { has, merge } from 'lodash-es';
+
+type MetadataMap = { [key: string]: any };
+export class GltfExportManager {
+  protected static readonly _CLONED_FROM_MAT_METADATA_PROPERTY = 'clonedFrom';
+  public static readonly NAME_BEFORE_EXPORT_METADATA_PROPERTY = 'nameBeforeExport';
+
+  /**
+   * Constructor.
+   */
+  protected constructor(protected viewer: Viewer) {}
+
+  /**
+   * Creates an {@link GltfExportManager}.
+   */
+  public static async create(viewer: Viewer): Promise<GltfExportManager> {
+    return new GltfExportManager(viewer);
+  }
+
+  /**
+   * Exports selected nodes to a file.
+   * @param filename optional name of the exported .GLB file.
+   * @param exportOptions export options to be merged with default options.\
+   *                      `exportOptions.exchangeRefractionMaterials` and `exportOptions.limitTextureSize`
+   *                      default to `true` if not given.
+   * @param optimizeForAR adjusts the exported GLB so that known AR issues get fixed automatically
+   * @param excluded optional list of geometry (meshes, elements, variants, variantInstances) to be excluded from export
+   */
+  public async exportGlb(
+    filename = 'glb-export.glb',
+    { exchangeRefractionMaterials = true, limitTextureSize = true, ...exportOptions }: IExportOptionsExtended = {},
+    optimizeForAR: boolean = false,
+    excluded?: ExcludedGeometryList
+  ): Promise<File | undefined> {
+    const { scene, sceneCopied } = await this.exportPreProcess(
+      exchangeRefractionMaterials,
+      limitTextureSize,
+      optimizeForAR
+    );
+    const glbData = await GLTF2Export.GLBAsync(scene, 'dummy', this.gltfExportOptions(exportOptions, excluded));
+    this.exportPostProcess(scene, sceneCopied);
+
+    const resBlob = glbData.glTFFiles['dummy.glb'];
+    // check if result is valid, according to the typings this could also be a string
+    if (resBlob instanceof Blob) {
+      if (!filename.endsWith('.glb')) {
+        filename += '.glb';
+      }
+      return new File([resBlob], filename);
+    } else {
+      // result was not a valid blob
+      return undefined;
+    }
+  }
+
+  /**
+   * Exports selected nodes to GLTF. This may result in more than one file, since textures are exported separately.
+   * @param filename name of the main (text-based) .GLTF file referring to separate texture files.
+   * @param exportOptions export options to be merged with default options.\
+   *                      `exportOptions.exchangeRefractionMaterials` and `exportOptions.limitTextureSize`
+   *                      default to `true` if not given.
+   * @param optimizeForAR adjusts the exported GLB so that known AR issues get fixed automatically
+   * @param excluded optional list of geometry (meshes, elements, variants, variantInstances) to be excluded from export
+   */
+  public async exportGltfToFile(
+    filename: string,
+    { exchangeRefractionMaterials = true, limitTextureSize = true, ...exportOptions }: IExportOptionsExtended = {},
+    optimizeForAR: boolean = false,
+    excluded?: ExcludedGeometryList
+  ) {
+    const { scene, sceneCopied } = await this.exportPreProcess(
+      exchangeRefractionMaterials,
+      limitTextureSize,
+      optimizeForAR
+    );
+    const gltf = await GLTF2Export.GLTFAsync(scene, filename, this.gltfExportOptions(exportOptions, excluded));
+    gltf.downloadFiles();
+    this.exportPostProcess(scene, sceneCopied);
+  }
+
+  /**
+   * Exports selected nodes to GLB. This results in one binary file.
+   * @param filename name of the .GLB file.
+   * @param exportOptions export options to be merged with default options.\
+   *                      `exportOptions.exchangeRefractionMaterials` and `exportOptions.limitTextureSize`
+   *                      default to `true` if not given.
+   * @param optimizeForAR adjusts the exported GLB so that known AR issues get fixed automatically
+   * @param excluded optional list of geometry (meshes, elements, variants, variantInstances) to be excluded from export
+   */
+  public async exportGlbToFile(
+    filename: string,
+    { exchangeRefractionMaterials = true, limitTextureSize = true, ...exportOptions }: IExportOptionsExtended = {},
+    optimizeForAR: boolean = false,
+    excluded?: ExcludedGeometryList
+  ) {
+    const { scene, sceneCopied } = await this.exportPreProcess(
+      exchangeRefractionMaterials,
+      limitTextureSize,
+      optimizeForAR
+    );
+    const glb = await GLTF2Export.GLBAsync(scene, filename, this.gltfExportOptions(exportOptions, excluded));
+    glb.downloadFiles();
+    this.exportPostProcess(scene, sceneCopied);
+  }
+
+  /**
+   * Gets predefined {@link IExportOptions } merged with given ones.
+   */
+  protected gltfExportOptions(mergeWithOptions: IExportOptions = {}, excluded?: ExcludedGeometryList): IExportOptions {
+    const defaultOptions: IExportOptions = {
+      shouldExportNode: function (node: any) {
+        if (!node.isEnabled()) {
+          return false;
+        }
+        if ((node.name as string).startsWith(Viewer.BOUNDING_BOX_NAME)) {
+          return false;
+        }
+        if (excluded && node instanceof TransformNode && isNodeIncludedInExclusionList(node, excluded)) {
+          return false;
+        }
+        return true;
+      },
+    };
+    return merge({}, defaultOptions, mergeWithOptions);
+  }
+
+  /**
+   * Stuff to be done before exporting to GLTF
+   *
+   * @returns Either the original scene if no adjustments have been made or a copied scene (which can be disposed after
+   * the export) if adjustments have been made
+   */
+  protected async exportPreProcess(
+    exchangeRefractionMaterials: boolean,
+    limitTextureSize: boolean,
+    optimizeForAR: boolean
+  ): Promise<{ scene: Scene; sceneCopied: boolean }> {
+    if (!exchangeRefractionMaterials && !optimizeForAR && !limitTextureSize) {
+      // no need to copy the scene if no adjustments have to be made
+      return { scene: this.viewer.scene, sceneCopied: false };
+    }
+
+    // copy the scene for the GLB export improvements, so that the original viewer scene remains untouched
+    const copiedScene = await this.copyViewerScene(limitTextureSize);
+
+    if (exchangeRefractionMaterials) {
+      this.exchangeRefractionMaterials(copiedScene);
+    }
+
+    if (optimizeForAR) {
+      this.setUniqueMeshNames(copiedScene);
+      // get rid of negative scalings and morph targets, since iOS can't handle it in the QuickLook app
+      bakeGeometryOfAllMeshes(copiedScene);
+      // certain devices can't load models with skeletons, just remove them since animations are not supported in the AR
+      // scene anyway
+      while (copiedScene.skeletons.length) {
+        const skeleton = copiedScene.skeletons.pop();
+        skeleton!.dispose();
+      }
+    }
+
+    return { scene: copiedScene, sceneCopied: true };
+  }
+
+  /**
+   * Create a copy of the viewer scene, which can be further processed and optimized for the GLB export.
+   * There is no "scene.clone" function, therefore the scene is serialized and loaded again to achieve this result.
+   */
+  protected async copyViewerScene(limitTextureSize: boolean): Promise<Scene> {
+    // required by the scene serializer
+    await import(/* webpackChunkName: "physicsenginecomponent" */ '@babylonjs/core/Physics/physicsEngineComponent');
+
+    // copy scene function uses scene serializer, which can't handle "complex" data like classes, function or recursive
+    // data structures in metadata
+    // it basically does a `JSON.stringify` on the metadata
+    // therefore the metadata has to be removed from the nodes before the copy process
+    const metadataArr = this.extractMetadataOfAllNodes();
+
+    // serialize the scene
+    const serializedScene = await SceneSerializer.SerializeAsync(this.viewer.scene);
+
+    // set the cropped metadata back to the viewer scene nodes
+    this.restoreMetadataOfAllNodes(metadataArr);
+
+    // load the scene into an invisible "dummy" canvas
+    const dummyCanvas = document.createElement('canvas');
+    const engine = new Engine(dummyCanvas);
+
+    if (limitTextureSize) {
+      // according to some tests iOS devices break when exporting a scene with textures above 1024
+      // this only affects the scene clone for the export
+      engine.getCaps().maxTextureSize = 1024;
+    }
+
+    // overwritting _LastCreatedScene to fix issue: https://combeenation.youtrack.cloud/issue/CB-8972
+    // In short: dummy scene erroneously interacts with original viewer scene
+    // setting viewer scene as fallback again (`_LastCreatedScene`) resolves that issue
+    const curLastScene = EngineStore._LastCreatedScene;
+    const newScene = new Scene(engine);
+    EngineStore._LastCreatedScene = curLastScene;
+
+    SceneLoader.ShowLoadingScreen = false;
+    await SceneLoader.AppendAsync('', 'data:' + JSON.stringify(serializedScene), newScene, undefined, '.babylon');
+
+    return newScene;
+  }
+
+  /**
+   * Stuff to be done after the GLTF export
+   */
+  protected exportPostProcess(scene: Scene, disposeScene: boolean) {
+    if (disposeScene) {
+      // copied scene for GLB export is not needed anymore, therefore it can be removed
+      scene.getEngine().dispose();
+    }
+  }
+
+  /**
+   * Remove all node metadata and return them in a map
+   */
+  protected extractMetadataOfAllNodes(): MetadataMap {
+    return this.viewer.scene.getNodes().reduce((accMetadataObj, curNode) => {
+      const metadata = curNode.metadata;
+      delete curNode.metadata;
+      return { ...accMetadataObj, [curNode.uniqueId.toString()]: metadata };
+    }, {});
+  }
+
+  /**
+   * Restore node metadata from previously cropped metadata map
+   */
+  protected restoreMetadataOfAllNodes(metadataMap: MetadataMap) {
+    this.viewer.scene.getNodes().forEach(node => {
+      const metadata = metadataMap[node.uniqueId.toString()];
+      if (metadata) {
+        node.metadata = metadata;
+      }
+    });
+  }
+
+  /**
+   * Materials with refraction set are not exported properly.
+   * Exchange all such (relevant) materials with a more export-friendly version
+   */
+  protected exchangeRefractionMaterials(scene: Scene) {
+    for (const n of scene.getNodes()) {
+      if (!(n instanceof AbstractMesh)) continue;
+      if (!(n.material instanceof PBRMaterial)) continue;
+      if (!(n.material as PBRMaterial).subSurface.isRefractionEnabled) continue;
+      if ((n.material as PBRMaterial).transparencyMode !== PBRMaterial.PBRMATERIAL_OPAQUE) continue;
+      // if we're here, we have a node holding a material with set refraction whose transparencyMode is set to
+      // PBRMATERIAL_OPAQUE
+      n.material = this.createRefractionMaterialReplacement(n.material);
+    }
+  }
+
+  /**
+   * Create an export-friendly replacement material for a material using refraction.
+   * @param mat Material to be replaced
+   */
+  protected createRefractionMaterialReplacement(mat: PBRMaterial): PBRMaterial {
+    // if we're dealing with a clone already, return it instead of cloning
+    if (this.isMaterialClonedForExport(mat)) return mat;
+
+    // change material according to https://www.notion.so/combeenation/Glas-materials-don-t-look-glasy-after-export-d5fda2c6515e4420a8772744d3e6b460
+    const clonedMaterial = mat.clone(mat.name); // clone material. clone uses same name
+    clonedMaterial.metadata = { ...mat.metadata, [GltfExportManager._CLONED_FROM_MAT_METADATA_PROPERTY]: mat.uniqueId }; // create shallow copy of metadata on clone. see https://forum.babylonjs.com/t/the-metadata-of-the-mesh-cloned-by-the-instantiatemodelstoscene-method-is-a-shallow-copy/21563
+    clonedMaterial.refractionTexture = null;
+    clonedMaterial.metallicReflectanceTexture = null; // is this the correct one for metallic roughness?
+    clonedMaterial.alpha = 0.7;
+    clonedMaterial.albedoColor = new Color3(0.3, 0.3, 0.3);
+    clonedMaterial.transparencyMode = PBRMaterial.PBRMATERIAL_ALPHABLEND;
+    clonedMaterial.metallic = 0.65;
+    clonedMaterial.roughness = 0.15;
+
+    return clonedMaterial;
+  }
+
+  /**
+   * Inspect if a material was temporarily cloned for GLB export
+   * @param mat Material to be inspected
+   */
+  protected isMaterialClonedForExport(mat: PBRMaterial): boolean {
+    return has(mat.metadata, GltfExportManager._CLONED_FROM_MAT_METADATA_PROPERTY);
+  }
+
+  /**
+   * Set unique mesh names for GLB export.
+   * Duplicate names lead to problems in AR on iOS devices.
+   */
+  protected setUniqueMeshNames(scene: Scene): void {
+    const allNodes = scene.getNodes().filter(node => node instanceof TransformNode) as TransformNode[];
+    allNodes.forEach(currMesh => {
+      injectMetadata(currMesh, { [GltfExportManager.NAME_BEFORE_EXPORT_METADATA_PROPERTY]: currMesh.name }, false);
+      currMesh.name = `${currMesh.name}_${currMesh.uniqueId}`;
+    });
+  }
+}