@configura/babylon-view 2.0.0-alpha.8 → 2.0.0

package/dist/nodes/CfgDeferredMeshNode.js

@@ -1,378 +1,378 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-import { Matrix } from "@babylonjs/core/Maths/math.vector.js";
-import { InspectableType } from "@babylonjs/core/Misc/iInspectable.js";
-import { logMtrlSourceWithMetaDataToConsole } from "@configura/web-api";
-import { SymBox } from "@configura/web-core/dist/cm/format/cmsym/components/SymBox.js";
-import { SymGfxMode } from "@configura/web-core/dist/cm/format/cmsym/components/SymComponent.js";
-import { SymMesh } from "@configura/web-core/dist/cm/format/cmsym/components/SymMesh.js";
-import { SymPlane } from "@configura/web-core/dist/cm/format/cmsym/components/SymPlane.js";
-import { SymReps } from "@configura/web-core/dist/cm/format/cmsym/components/SymReps.js";
-import { SymSphere } from "@configura/web-core/dist/cm/format/cmsym/components/SymSphere.js";
-import { DetailMask } from "@configura/web-core/dist/cm/geometry/DetailMask.js";
-import { LogObservable } from "@configura/web-utilities";
-import { CfgGeometry } from "../geometry/CfgGeometry.js";
-import { CfgMesh } from "../geometry/CfgMesh.js";
-import { splitIndexComplete, splitIndexQuick } from "../geometry/geoSplitter.js";
-import { toStretchedPoint } from "../geometry/stretch/CfgStretchData.js";
-import { gMaterialToCfgMaterial, mtrlSourceToCfgMaterial, } from "../material/material.js";
-import { CfgBoundingBox } from "../utilities/CfgBoundingBox.js";
-import { aTriMeshBox, aTriMeshPlane, aTriMeshSphere } from "../utilities/utilities3D.js";
-import { GeometryCacheEntry } from "../view/RenderEnv.js";
-import { CfgTransformNode } from "./CfgTransformNode.js";
-const QUICK_SPLIT_INDEX_SIZE_LIMIT = 20000;
-const COMPLETE_SPLIT_INDEX_SIZE_LIMIT = 5000;
-const COMPLETE_SPLIT_FINAL_GROUPS_COUNT_LIMIT = 20;
-const COMPLETE_SPLIT_PROGRESS_GROUPS_COUNT_LIMIT = 100;
-var SplitGeoStatus;
-(function (SplitGeoStatus) {
-    SplitGeoStatus["Idle"] = "Idle";
-    SplitGeoStatus["Splitting"] = "Splitting";
-    SplitGeoStatus["Unapplied"] = "Unapplied";
-    SplitGeoStatus["Done"] = "Done";
-})(SplitGeoStatus || (SplitGeoStatus = {}));
-function getDetailMask(symNode) {
-    const symReps = symNode.symReps();
-    if (!(symReps instanceof SymReps)) {
-        return;
-    }
-    if (symReps._details === undefined) {
-        return;
-    }
-    const lod = symReps._details.get(SymGfxMode.x3D);
-    if (!(lod instanceof DetailMask)) {
-        return;
-    }
-    return lod;
-}
-function symComponentToGeometry(logger, renderEnvironment, component, stretchDatas, uvMapper) {
-    var _a;
-    return __awaiter(this, void 0, void 0, function* () {
-        const identifierObject = {
-            component,
-            stretchDatasHash: stretchDatas.reduce((acc, stretchData) => acc + stretchData.hash, 0),
-            uvMapperHash: (_a = uvMapper === null || uvMapper === void 0 ? void 0 : uvMapper.env) === null || _a === void 0 ? void 0 : _a.hash,
-        };
-        return renderEnvironment.geometryCache.get(identifierObject, () => {
-            let mesh = undefined;
-            if (component instanceof SymMesh) {
-                mesh = component.mesh(logger, renderEnvironment.symMeshEnv);
-            }
-            else if (component instanceof SymSphere) {
-                mesh = aTriMeshSphere(component.radius, component.center, component.segments);
-            }
-            else if (component instanceof SymBox) {
-                mesh = aTriMeshBox(component.p0, component.p1);
-            }
-            else if (component instanceof SymPlane) {
-                mesh = aTriMeshPlane(component.vector, component.distance, 1);
-            }
-            if (mesh === undefined) {
-                logger.error("SymComponent did not return a mesh", component);
-                return Promise.resolve(undefined);
-            }
-            return Promise.resolve(new GeometryCacheEntry(CfgGeometry.fromATriMeshF(logger, "(Geo) " + component.id, mesh, renderEnvironment.scene, stretchDatas, uvMapper), mesh.doubleSided, mesh.lowerLeftTextureOrigin));
-        });
-    });
-}
-export class CfgDeferredMeshNode extends CfgTransformNode {
-    constructor(renderEnvironment, cfgProductNodeParent, name, lod, _gMaterial, _meshDoubleSided, _lowerLeftTextureOrigin, _geo, _stretchDatas) {
-        super(renderEnvironment, name);
-        this.cfgProductNodeParent = cfgProductNodeParent;
-        this.lod = lod;
-        this._gMaterial = _gMaterial;
-        this._meshDoubleSided = _meshDoubleSided;
-        this._lowerLeftTextureOrigin = _lowerLeftTextureOrigin;
-        this._geo = _geo;
-        this._stretchDatas = _stretchDatas;
-        this._materialIsDirty = false;
-        this._mtrlSourceWithMetaData = null;
-        this._splitGeoStatus = SplitGeoStatus.Idle;
-        this.logger = new LogObservable();
-        this.applyMaterial = () => {
-            if (this._material === undefined ||
-                (!this._materialIsDirty && this._splitGeoStatus !== SplitGeoStatus.Unapplied)) {
-                return;
-            }
-            this._materialIsDirty = false;
-            if (this._splitGeoStatus === SplitGeoStatus.Unapplied) {
-                this._splitGeoStatus = SplitGeoStatus.Done;
-            }
-            let geos = [this._geo];
-            let labelSuffix = this.name;
-            if (this._splitGeos !== undefined) {
-                geos = this._splitGeos;
-                labelSuffix += " (geo split)";
-            }
-            let doubleSided = false;
-            let backToFront = false;
-            const flipTexture = !this._lowerLeftTextureOrigin;
-            if (this._meshDoubleSided || this._material.isDoubleSided()) {
-                // Double sided can be set both by the mesh and the material, but only the material
-                // controls it during rendering. Ensure we are using a material that is double sided.
-                doubleSided = true;
-                if (this._material.isTransparent) {
-                    // Mesh will render double sided with possible transparent parts, this is tricky.
-                    //
-                    // Since we don't depth sort all triangles in the mesh relative to the camera (which
-                    // is not doable in the general case) we need to employ a trick to make sure the
-                    // inside of the object gets rendered before the outside skin.
-                    //
-                    // Otherwise, semi-transparent pixels in the outer skin would fully occlude pixels
-                    // from the inside of the object if they happen to be rendered first. That means
-                    // that sometimes your would not see the inside of the object through the "holes"
-                    // in it.
-                    //
-                    // A good workaround for correctly made objects (where "correct" is mostly related
-                    // to the normals) is to render the mesh twice, first the back sides ("inside"),
-                    // then the front sides ("outside") of the triangles. Babylon.js has such a feature
-                    // built in called separateCullingPass (or "back then front" below).
-                    backToFront = true;
-                }
-            }
-            const material = this._material.getPBRMaterial(doubleSided, backToFront, flipTexture);
-            this.clear(true);
-            for (const geo of geos) {
-                const mesh = new CfgMesh(labelSuffix, this._renderEnvironment, this.cfgProductNodeParent, geo, material);
-                this.add(mesh);
-            }
-        };
-        this.isAllMeshMaterialsReady = () => this.getChildMeshes().reduce((a, m) => a && (m.material === null || m.material.isReady(m)), true);
-        this.startSplitGeo = (force = false) => __awaiter(this, void 0, void 0, function* () {
-            if (!force && this._splitGeoStatus !== SplitGeoStatus.Idle) {
-                return;
-            }
-            this._splitGeoStatus = SplitGeoStatus.Splitting;
-            const geo = this._geo;
-            const indexCount = geo.getTotalIndices();
-            if (!force && QUICK_SPLIT_INDEX_SIZE_LIMIT < indexCount) {
-                return;
-            }
-            const splitStart = performance.now();
-            const doCompleteSplit = indexCount < COMPLETE_SPLIT_INDEX_SIZE_LIMIT || force;
-            let groups;
-            if (doCompleteSplit) {
-                groups = splitIndexComplete(this.logger, geo, {
-                    maxFinalGroups: force
-                        ? Number.POSITIVE_INFINITY
-                        : COMPLETE_SPLIT_FINAL_GROUPS_COUNT_LIMIT,
-                    maxProgressGroups: force
-                        ? Number.POSITIVE_INFINITY
-                        : COMPLETE_SPLIT_PROGRESS_GROUPS_COUNT_LIMIT,
-                    acceptCoordinateMatch: true,
-                });
-            }
-            else {
-                groups = splitIndexQuick(this.logger, geo);
-            }
-            if (groups === undefined || groups.length === 1) {
-                this._splitGeoStatus = SplitGeoStatus.Done;
-                return;
-            }
-            const splitEnd = performance.now();
-            this._splitGeos = groups.map((group) => geo.cloneWithSubset(group));
-            const repackEnd = performance.now();
-            this._splitGeoStatus = SplitGeoStatus.Unapplied;
-            this.logger.info(`${doCompleteSplit ? "Complete" : "Quick"}-split`, `of ${indexCount / 3} triangles into ${groups.length} disjoint groups took ${(splitEnd - splitStart).toFixed(1)} ms, repack took ${(repackEnd - splitEnd).toFixed(1)} ms.`);
-            // If material is dirty someone else is responsible for calling applyMaterial
-            // at a later point
-            if (!this._materialIsDirty) {
-                this.applyMaterial();
-            }
-        });
-        this._dummyMaterial = renderEnvironment.dummyMaterial;
-        this.resetMaterial();
-    }
-    static makeCfgDeferredMesh(logger, renderEnvironment, cfgProductNodeParent, detailLevel, symNode, gMaterial, stretchDatas) {
-        var _a, _b, _c;
-        return __awaiter(this, void 0, void 0, function* () {
-            const lod = getDetailMask(symNode);
-            if (lod === undefined || !lod.includes(detailLevel)) {
-                return;
-            }
-            const component = (_c = (_b = (_a = symNode.symMesh()) !== null && _a !== void 0 ? _a : symNode.symSphere()) !== null && _b !== void 0 ? _b : symNode.symBox()) !== null && _c !== void 0 ? _c : symNode.symPlane();
-            if (component === undefined) {
-                return;
-            }
-            const entry = yield symComponentToGeometry(logger, renderEnvironment, component, stretchDatas, symNode.symUVMapper(true).mapper);
-            if (entry === undefined) {
-                return undefined;
-            }
-            const geo = entry.geometry;
-            if (geo === undefined) {
-                return undefined;
-            }
-            return new this(renderEnvironment, cfgProductNodeParent, "(Deferred Mesh) " + symNode.id, lod, gMaterial, entry.doubleSided, entry.lowerLeftTextureOrigin, geo, stretchDatas);
-        });
-    }
-    get cfgClassName() {
-        return "CfgDeferredMeshNode";
-    }
-    resetMaterial() {
-        this._material = this._dummyMaterial;
-        this._materialMetaData = undefined;
-        this._materialIsDirty = true;
-        this.applyMaterial();
-    }
-    get originalMatrix() {
-        return Matrix.Identity();
-    }
-    setMaterialAndLoad(mtrlWithMetaData, animatorCoordinator) {
-        return __awaiter(this, void 0, void 0, function* () {
-            if (this._materialLoadedPromise !== undefined &&
-                mtrlWithMetaData !== undefined &&
-                this._mtrlSourceWithMetaData !== undefined &&
-                this._mtrlSourceWithMetaData !== null &&
-                mtrlWithMetaData.mtrl.isSame(this._mtrlSourceWithMetaData.mtrl)) {
-                return this._materialLoadedPromise;
-            }
-            this._mtrlSourceWithMetaData = mtrlWithMetaData;
-            this._materialLoadedPromise = this.loadMaterial();
-            if (animatorCoordinator !== undefined && mtrlWithMetaData !== undefined) {
-                const c = animatorCoordinator.coordinator;
-                yield c.prepareForMaterialChange.bind(c)(this, animatorCoordinator.isNewProduct);
-            }
-            return this._materialLoadedPromise;
-        });
-    }
-    loadMaterial() {
-        return __awaiter(this, void 0, void 0, function* () {
-            let material;
-            const meta = {
-                logger: this.logger,
-                sourcePath: ["loadMaterial"],
-            };
-            if (this._mtrlSourceWithMetaData === null) {
-                // null === has not yet been set
-                return;
-            }
-            try {
-                if (this._mtrlSourceWithMetaData !== undefined) {
-                    material = yield mtrlSourceToCfgMaterial(meta, this._mtrlSourceWithMetaData, this._renderEnvironment);
-                    if (material === undefined) {
-                        this.logger.error("Failed to load material from mtrlSource");
-                    }
-                }
-                else if (this._gMaterial !== undefined && this._gMaterial.gm !== undefined) {
-                    meta.sourcePath.push("embedded");
-                    material = yield gMaterialToCfgMaterial(meta, this._renderEnvironment, this._gMaterial.gm);
-                    if (material === undefined) {
-                        this.logger.error("Failed to load material from fallback gMaterial");
-                    }
-                }
-            }
-            catch (e) {
-                this._renderEnvironment.notifyError("Failed to load material. Will show default material.");
-                this.logger.errorFromCaught(e);
-            }
-            if (material === undefined) {
-                this.logger.warn("No material, not even fallback-material");
-            }
-            this._material = material;
-            this._materialMetaData = meta;
-            this._materialIsDirty = true;
-            if (material && material.isTransparent) {
-                // Let this not block
-                void this.startSplitGeo();
-            }
-        });
-    }
-    get boundingBox() {
-        const stretchDatas = this._stretchDatas;
-        const stretchReferenceLengthsByMeasureParamCode = this.cfgProductNodeParent.product.configuration._internal
-            .stretchReferenceLengthsByMeasureParamCode;
-        return this.getChildMeshes().reduce((a, m) => {
-            const bb = m.getBoundingInfo().boundingBox;
-            const cfgBb = new CfgBoundingBox(bb.minimum, bb.maximum);
-            cfgBb.corners
-                .map((c) => toStretchedPoint(c, stretchDatas, stretchReferenceLengthsByMeasureParamCode))
-                .forEach((c) => {
-                a.expandWithPoint(c);
-            });
-            return a;
-        }, new CfgBoundingBox());
-    }
-    getChildCfgMeshes() {
-        return this.getChildMeshes().filter((f) => f instanceof CfgMesh);
-    }
-    refreshStretch() {
-        this.getChildCfgMeshes().map((childMesh) => childMesh.refreshStretch());
-    }
-    addInspectorProperties() {
-        super.addInspectorProperties();
-        this.addInspectableCustomProperty({
-            label: "Available lod levels",
-            propertyName: "_inspectorLodLevels",
-            type: InspectableType.String,
-        });
-        this.addInspectableCustomProperty({
-            label: "Mtrl Source path",
-            propertyName: "_inspectorSourcePath",
-            type: InspectableType.String,
-        });
-        this.addInspectableCustomProperty({
-            label: "log mtrlSourceWithMetaData",
-            propertyName: "_inspectorLogMtrlSourceWithMetaData",
-            type: InspectableType.Checkbox,
-        });
-        this.addInspectableCustomProperty({
-            label: "log GMaterial",
-            propertyName: "_inspectorLogGMaterial",
-            type: InspectableType.Checkbox,
-        });
-        this.addInspectableCustomProperty({
-            label: "log MultiGMaterial",
-            propertyName: "_inspectorLogMultiGMaterial",
-            type: InspectableType.Checkbox,
-        });
-    }
-    get _inspectorLodLevels() {
-        return Array.from(this.lod.detailSet().values()).join(", ");
-    }
-    get _inspectorSourcePath() {
-        if (this._materialMetaData === undefined) {
-            return "-";
-        }
-        return this._materialMetaData.sourcePath.join(" ");
-    }
-    get _inspectorLogMtrlSourceWithMetaData() {
-        return this._mtrlSourceWithMetaData === undefined || this._mtrlSourceWithMetaData === null;
-    }
-    set _inspectorLogMtrlSourceWithMetaData(x) {
-        if (this._mtrlSourceWithMetaData === undefined || this._mtrlSourceWithMetaData === null) {
-            return;
-        }
-        logMtrlSourceWithMetaDataToConsole(this._mtrlSourceWithMetaData);
-    }
-    get _inspectorLogGMaterial() {
-        var _a;
-        return ((_a = this._materialMetaData) === null || _a === void 0 ? void 0 : _a.gMaterial) === undefined;
-    }
-    set _inspectorLogGMaterial(x) {
-        var _a;
-        const m = (_a = this._materialMetaData) === null || _a === void 0 ? void 0 : _a.gMaterial;
-        if (m === undefined) {
-            return;
-        }
-        console.log(m);
-    }
-    get _inspectorLogMultiGMaterial() {
-        var _a;
-        return ((_a = this._materialMetaData) === null || _a === void 0 ? void 0 : _a.multiGMaterial) === undefined;
-    }
-    set _inspectorLogMultiGMaterial(x) {
-        var _a;
-        const m = (_a = this._materialMetaData) === null || _a === void 0 ? void 0 : _a.multiGMaterial;
-        if (m === undefined) {
-            return;
-        }
-        console.log(m);
-    }
-}
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { Matrix } from "@babylonjs/core/Maths/math.vector.js";
+import { InspectableType } from "@babylonjs/core/Misc/iInspectable.js";
+import { logMtrlSourceWithMetaDataToConsole } from "@configura/web-api";
+import { SymBox } from "@configura/web-core/dist/cm/format/cmsym/components/SymBox.js";
+import { SymGfxMode } from "@configura/web-core/dist/cm/format/cmsym/components/SymComponent.js";
+import { SymMesh } from "@configura/web-core/dist/cm/format/cmsym/components/SymMesh.js";
+import { SymPlane } from "@configura/web-core/dist/cm/format/cmsym/components/SymPlane.js";
+import { SymReps } from "@configura/web-core/dist/cm/format/cmsym/components/SymReps.js";
+import { SymSphere } from "@configura/web-core/dist/cm/format/cmsym/components/SymSphere.js";
+import { DetailMask } from "@configura/web-core/dist/cm/geometry/DetailMask.js";
+import { LogObservable } from "@configura/web-utilities";
+import { CfgGeometry } from "../geometry/CfgGeometry.js";
+import { CfgMesh } from "../geometry/CfgMesh.js";
+import { splitIndexComplete, splitIndexQuick } from "../geometry/geoSplitter.js";
+import { toStretchedPoint } from "../geometry/stretch/CfgStretchData.js";
+import { gMaterialToCfgMaterial, mtrlSourceToCfgMaterial, } from "../material/material.js";
+import { CfgBoundingBox } from "../utilities/CfgBoundingBox.js";
+import { aTriMeshBox, aTriMeshPlane, aTriMeshSphere } from "../utilities/utilities3D.js";
+import { GeometryCacheEntry } from "../view/RenderEnv.js";
+import { CfgTransformNode } from "./CfgTransformNode.js";
+const QUICK_SPLIT_INDEX_SIZE_LIMIT = 20000;
+const COMPLETE_SPLIT_INDEX_SIZE_LIMIT = 5000;
+const COMPLETE_SPLIT_FINAL_GROUPS_COUNT_LIMIT = 20;
+const COMPLETE_SPLIT_PROGRESS_GROUPS_COUNT_LIMIT = 100;
+var SplitGeoStatus;
+(function (SplitGeoStatus) {
+    SplitGeoStatus["Idle"] = "Idle";
+    SplitGeoStatus["Splitting"] = "Splitting";
+    SplitGeoStatus["Unapplied"] = "Unapplied";
+    SplitGeoStatus["Done"] = "Done";
+})(SplitGeoStatus || (SplitGeoStatus = {}));
+function getDetailMask(symNode) {
+    const symReps = symNode.symReps();
+    if (!(symReps instanceof SymReps)) {
+        return;
+    }
+    if (symReps._details === undefined) {
+        return;
+    }
+    const lod = symReps._details.get(SymGfxMode.x3D);
+    if (!(lod instanceof DetailMask)) {
+        return;
+    }
+    return lod;
+}
+function symComponentToGeometry(logger, renderEnvironment, component, stretchDatas, uvMapper) {
+    var _a;
+    return __awaiter(this, void 0, void 0, function* () {
+        const identifierObject = {
+            component,
+            stretchDatasHash: stretchDatas.reduce((acc, stretchData) => acc + stretchData.hash, 0),
+            uvMapperHash: (_a = uvMapper === null || uvMapper === void 0 ? void 0 : uvMapper.env) === null || _a === void 0 ? void 0 : _a.hash,
+        };
+        return renderEnvironment.geometryCache.get(identifierObject, () => {
+            let mesh = undefined;
+            if (component instanceof SymMesh) {
+                mesh = component.mesh(logger, renderEnvironment.symMeshEnv);
+            }
+            else if (component instanceof SymSphere) {
+                mesh = aTriMeshSphere(component.radius, component.center, component.segments);
+            }
+            else if (component instanceof SymBox) {
+                mesh = aTriMeshBox(component.p0, component.p1);
+            }
+            else if (component instanceof SymPlane) {
+                mesh = aTriMeshPlane(component.vector, component.distance, 1);
+            }
+            if (mesh === undefined) {
+                logger.error("SymComponent did not return a mesh", component);
+                return Promise.resolve(undefined);
+            }
+            return Promise.resolve(new GeometryCacheEntry(CfgGeometry.fromATriMeshF(logger, "(Geo) " + component.id, mesh, renderEnvironment.scene, stretchDatas, uvMapper), mesh.doubleSided, mesh.lowerLeftTextureOrigin));
+        });
+    });
+}
+export class CfgDeferredMeshNode extends CfgTransformNode {
+    constructor(renderEnvironment, cfgProductNodeParent, name, lod, _gMaterial, _meshDoubleSided, _lowerLeftTextureOrigin, _geo, _stretchDatas) {
+        super(renderEnvironment, name);
+        this.cfgProductNodeParent = cfgProductNodeParent;
+        this.lod = lod;
+        this._gMaterial = _gMaterial;
+        this._meshDoubleSided = _meshDoubleSided;
+        this._lowerLeftTextureOrigin = _lowerLeftTextureOrigin;
+        this._geo = _geo;
+        this._stretchDatas = _stretchDatas;
+        this._materialIsDirty = false;
+        this._mtrlSourceWithMetaData = null;
+        this._splitGeoStatus = SplitGeoStatus.Idle;
+        this.logger = new LogObservable();
+        this.applyMaterial = () => {
+            if (this._material === undefined ||
+                (!this._materialIsDirty && this._splitGeoStatus !== SplitGeoStatus.Unapplied)) {
+                return;
+            }
+            this._materialIsDirty = false;
+            if (this._splitGeoStatus === SplitGeoStatus.Unapplied) {
+                this._splitGeoStatus = SplitGeoStatus.Done;
+            }
+            let geos = [this._geo];
+            let labelSuffix = this.name;
+            if (this._splitGeos !== undefined) {
+                geos = this._splitGeos;
+                labelSuffix += " (geo split)";
+            }
+            let doubleSided = false;
+            let backToFront = false;
+            const flipTexture = !this._lowerLeftTextureOrigin;
+            if (this._meshDoubleSided || this._material.isDoubleSided()) {
+                // Double sided can be set both by the mesh and the material, but only the material
+                // controls it during rendering. Ensure we are using a material that is double sided.
+                doubleSided = true;
+                if (this._material.isTransparent) {
+                    // Mesh will render double sided with possible transparent parts, this is tricky.
+                    //
+                    // Since we don't depth sort all triangles in the mesh relative to the camera (which
+                    // is not doable in the general case) we need to employ a trick to make sure the
+                    // inside of the object gets rendered before the outside skin.
+                    //
+                    // Otherwise, semi-transparent pixels in the outer skin would fully occlude pixels
+                    // from the inside of the object if they happen to be rendered first. That means
+                    // that sometimes your would not see the inside of the object through the "holes"
+                    // in it.
+                    //
+                    // A good workaround for correctly made objects (where "correct" is mostly related
+                    // to the normals) is to render the mesh twice, first the back sides ("inside"),
+                    // then the front sides ("outside") of the triangles. Babylon.js has such a feature
+                    // built in called separateCullingPass (or "back then front" below).
+                    backToFront = true;
+                }
+            }
+            const material = this._material.getPBRMaterial(doubleSided, backToFront, flipTexture);
+            this.clear(true);
+            for (const geo of geos) {
+                const mesh = new CfgMesh(labelSuffix, this._renderEnvironment, this.cfgProductNodeParent, geo, material);
+                this.add(mesh);
+            }
+        };
+        this.isAllMeshMaterialsReady = () => this.getChildMeshes().reduce((a, m) => a && (m.material === null || m.material.isReady(m)), true);
+        this.startSplitGeo = (force = false) => __awaiter(this, void 0, void 0, function* () {
+            if (!force && this._splitGeoStatus !== SplitGeoStatus.Idle) {
+                return;
+            }
+            this._splitGeoStatus = SplitGeoStatus.Splitting;
+            const geo = this._geo;
+            const indexCount = geo.getTotalIndices();
+            if (!force && QUICK_SPLIT_INDEX_SIZE_LIMIT < indexCount) {
+                return;
+            }
+            const splitStart = performance.now();
+            const doCompleteSplit = indexCount < COMPLETE_SPLIT_INDEX_SIZE_LIMIT || force;
+            let groups;
+            if (doCompleteSplit) {
+                groups = splitIndexComplete(this.logger, geo, {
+                    maxFinalGroups: force
+                        ? Number.POSITIVE_INFINITY
+                        : COMPLETE_SPLIT_FINAL_GROUPS_COUNT_LIMIT,
+                    maxProgressGroups: force
+                        ? Number.POSITIVE_INFINITY
+                        : COMPLETE_SPLIT_PROGRESS_GROUPS_COUNT_LIMIT,
+                    acceptCoordinateMatch: true,
+                });
+            }
+            else {
+                groups = splitIndexQuick(this.logger, geo);
+            }
+            if (groups === undefined || groups.length === 1) {
+                this._splitGeoStatus = SplitGeoStatus.Done;
+                return;
+            }
+            const splitEnd = performance.now();
+            this._splitGeos = groups.map((group) => geo.cloneWithSubset(group));
+            const repackEnd = performance.now();
+            this._splitGeoStatus = SplitGeoStatus.Unapplied;
+            this.logger.info(`${doCompleteSplit ? "Complete" : "Quick"}-split`, `of ${indexCount / 3} triangles into ${groups.length} disjoint groups took ${(splitEnd - splitStart).toFixed(1)} ms, repack took ${(repackEnd - splitEnd).toFixed(1)} ms.`);
+            // If material is dirty someone else is responsible for calling applyMaterial
+            // at a later point
+            if (!this._materialIsDirty) {
+                this.applyMaterial();
+            }
+        });
+        this._dummyMaterial = renderEnvironment.dummyMaterial;
+        this.resetMaterial();
+    }
+    static makeCfgDeferredMesh(logger, renderEnvironment, cfgProductNodeParent, detailLevel, symNode, gMaterial, stretchDatas) {
+        var _a, _b, _c;
+        return __awaiter(this, void 0, void 0, function* () {
+            const lod = getDetailMask(symNode);
+            if (lod === undefined || !lod.includes(detailLevel)) {
+                return;
+            }
+            const component = (_c = (_b = (_a = symNode.symMesh()) !== null && _a !== void 0 ? _a : symNode.symSphere()) !== null && _b !== void 0 ? _b : symNode.symBox()) !== null && _c !== void 0 ? _c : symNode.symPlane();
+            if (component === undefined) {
+                return;
+            }
+            const entry = yield symComponentToGeometry(logger, renderEnvironment, component, stretchDatas, symNode.symUVMapper(true).mapper);
+            if (entry === undefined) {
+                return undefined;
+            }
+            const geo = entry.geometry;
+            if (geo === undefined) {
+                return undefined;
+            }
+            return new this(renderEnvironment, cfgProductNodeParent, "(Deferred Mesh) " + symNode.id, lod, gMaterial, entry.doubleSided, entry.lowerLeftTextureOrigin, geo, stretchDatas);
+        });
+    }
+    get cfgClassName() {
+        return "CfgDeferredMeshNode";
+    }
+    resetMaterial() {
+        this._material = this._dummyMaterial;
+        this._materialMetaData = undefined;
+        this._materialIsDirty = true;
+        this.applyMaterial();
+    }
+    get originalMatrix() {
+        return Matrix.Identity();
+    }
+    setMaterialAndLoad(mtrlWithMetaData, animatorCoordinator) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (this._materialLoadedPromise !== undefined &&
+                mtrlWithMetaData !== undefined &&
+                this._mtrlSourceWithMetaData !== undefined &&
+                this._mtrlSourceWithMetaData !== null &&
+                mtrlWithMetaData.mtrl.isSame(this._mtrlSourceWithMetaData.mtrl)) {
+                return this._materialLoadedPromise;
+            }
+            this._mtrlSourceWithMetaData = mtrlWithMetaData;
+            this._materialLoadedPromise = this.loadMaterial();
+            if (animatorCoordinator !== undefined && mtrlWithMetaData !== undefined) {
+                const c = animatorCoordinator.coordinator;
+                yield c.prepareForMaterialChange.bind(c)(this, animatorCoordinator.isNewProduct);
+            }
+            return this._materialLoadedPromise;
+        });
+    }
+    loadMaterial() {
+        return __awaiter(this, void 0, void 0, function* () {
+            let material;
+            const meta = {
+                logger: this.logger,
+                sourcePath: ["loadMaterial"],
+            };
+            if (this._mtrlSourceWithMetaData === null) {
+                // null === has not yet been set
+                return;
+            }
+            try {
+                if (this._mtrlSourceWithMetaData !== undefined) {
+                    material = yield mtrlSourceToCfgMaterial(meta, this._mtrlSourceWithMetaData, this._renderEnvironment);
+                    if (material === undefined) {
+                        this.logger.error("Failed to load material from mtrlSource");
+                    }
+                }
+                else if (this._gMaterial !== undefined && this._gMaterial.gm !== undefined) {
+                    meta.sourcePath.push("embedded");
+                    material = yield gMaterialToCfgMaterial(meta, this._renderEnvironment, this._gMaterial.gm);
+                    if (material === undefined) {
+                        this.logger.error("Failed to load material from fallback gMaterial");
+                    }
+                }
+            }
+            catch (e) {
+                this._renderEnvironment.notifyError("Failed to load material. Will show default material.");
+                this.logger.errorFromCaught(e);
+            }
+            if (material === undefined) {
+                this.logger.warn("No material, not even fallback-material");
+            }
+            this._material = material;
+            this._materialMetaData = meta;
+            this._materialIsDirty = true;
+            if (material && material.isTransparent) {
+                // Let this not block
+                void this.startSplitGeo();
+            }
+        });
+    }
+    get boundingBox() {
+        const stretchDatas = this._stretchDatas;
+        const stretchReferenceLengthsByMeasureParamCode = this.cfgProductNodeParent.product.configuration._internal
+            .stretchReferenceLengthsByMeasureParamCode;
+        return this.getChildMeshes().reduce((a, m) => {
+            const bb = m.getBoundingInfo().boundingBox;
+            const cfgBb = new CfgBoundingBox(bb.minimum, bb.maximum);
+            cfgBb.corners
+                .map((c) => toStretchedPoint(c, stretchDatas, stretchReferenceLengthsByMeasureParamCode))
+                .forEach((c) => {
+                a.expandWithPoint(c);
+            });
+            return a;
+        }, new CfgBoundingBox());
+    }
+    getChildCfgMeshes() {
+        return this.getChildMeshes().filter((f) => f instanceof CfgMesh);
+    }
+    refreshStretch() {
+        this.getChildCfgMeshes().map((childMesh) => childMesh.refreshStretch());
+    }
+    addInspectorProperties() {
+        super.addInspectorProperties();
+        this.addInspectableCustomProperty({
+            label: "Available lod levels",
+            propertyName: "_inspectorLodLevels",
+            type: InspectableType.String,
+        });
+        this.addInspectableCustomProperty({
+            label: "Mtrl Source path",
+            propertyName: "_inspectorSourcePath",
+            type: InspectableType.String,
+        });
+        this.addInspectableCustomProperty({
+            label: "log mtrlSourceWithMetaData",
+            propertyName: "_inspectorLogMtrlSourceWithMetaData",
+            type: InspectableType.Checkbox,
+        });
+        this.addInspectableCustomProperty({
+            label: "log GMaterial",
+            propertyName: "_inspectorLogGMaterial",
+            type: InspectableType.Checkbox,
+        });
+        this.addInspectableCustomProperty({
+            label: "log MultiGMaterial",
+            propertyName: "_inspectorLogMultiGMaterial",
+            type: InspectableType.Checkbox,
+        });
+    }
+    get _inspectorLodLevels() {
+        return Array.from(this.lod.detailSet().values()).join(", ");
+    }
+    get _inspectorSourcePath() {
+        if (this._materialMetaData === undefined) {
+            return "-";
+        }
+        return this._materialMetaData.sourcePath.join(" ");
+    }
+    get _inspectorLogMtrlSourceWithMetaData() {
+        return this._mtrlSourceWithMetaData === undefined || this._mtrlSourceWithMetaData === null;
+    }
+    set _inspectorLogMtrlSourceWithMetaData(x) {
+        if (this._mtrlSourceWithMetaData === undefined || this._mtrlSourceWithMetaData === null) {
+            return;
+        }
+        logMtrlSourceWithMetaDataToConsole(this._mtrlSourceWithMetaData);
+    }
+    get _inspectorLogGMaterial() {
+        var _a;
+        return ((_a = this._materialMetaData) === null || _a === void 0 ? void 0 : _a.gMaterial) === undefined;
+    }
+    set _inspectorLogGMaterial(x) {
+        var _a;
+        const m = (_a = this._materialMetaData) === null || _a === void 0 ? void 0 : _a.gMaterial;
+        if (m === undefined) {
+            return;
+        }
+        console.log(m);
+    }
+    get _inspectorLogMultiGMaterial() {
+        var _a;
+        return ((_a = this._materialMetaData) === null || _a === void 0 ? void 0 : _a.multiGMaterial) === undefined;
+    }
+    set _inspectorLogMultiGMaterial(x) {
+        var _a;
+        const m = (_a = this._materialMetaData) === null || _a === void 0 ? void 0 : _a.multiGMaterial;
+        if (m === undefined) {
+            return;
+        }
+        console.log(m);
+    }
+}