@needle-tools/gltf-progressive 2.1.6 → 3.0.0-rc.f23cbbb

package/lib/extension.js

@@ -1,80 +1,15 @@
 import { BufferGeometry, Mesh, Texture, TextureLoader } from "three";
 import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader.js";
 import { addDracoAndKTX2Loaders } from "./loaders.js";
-import { getParam, resolveUrl } from "./utils.internal.js";
+import { resolveUrl } from "./utils.internal.js";
 import { getRaycastMesh, registerRaycastMesh } from "./utils.js";
 // All of this has to be removed
 // import { getRaycastMesh, setRaycastMesh } from "../../engine_physics.js";
 // import { PromiseAllWithErrors, resolveUrl } from "../../engine_utils.js";
 import { plugins } from "./plugins/plugin.js";
+import { debug } from "./lods.debug.js";
 export const EXTENSION_NAME = "NEEDLE_progressive";
-const debug = getParam("debugprogressive");
 const $progressiveTextureExtension = Symbol("needle-progressive-texture");
-const debug_toggle_maps = new Map();
-const debug_materials = new Set();
-if (debug) {
-    let currentDebugLodLevel = -1;
-    let maxLevel = 2;
-    let wireframe = false;
-    function debugToggleProgressive() {
-        currentDebugLodLevel += 1;
-        console.log("Toggle LOD level", currentDebugLodLevel, debug_toggle_maps);
-        debug_toggle_maps.forEach((arr, obj) => {
-            for (const key of arr.keys) {
-                const cur = obj[key];
-                // if it's null or undefined we skip it
-                if (cur == null) {
-                    continue;
-                }
-                if (cur.isBufferGeometry === true) {
-                    const info = NEEDLE_progressive.getMeshLODInformation(cur);
-                    const level = !info ? 0 : Math.min(currentDebugLodLevel, info.lods.length);
-                    obj["DEBUG:LOD"] = level;
-                    // NEEDLE_progressive.assignMeshLOD(obj as Mesh, level);
-                    if (info)
-                        maxLevel = Math.max(maxLevel, info.lods.length - 1);
-                }
-                else if (obj.isMaterial === true) {
-                    obj["DEBUG:LOD"] = currentDebugLodLevel;
-                    // NEEDLE_progressive.assignTextureLOD(obj as Material, currentDebugLodLevel);
-                }
-            }
-        });
-        if (currentDebugLodLevel >= maxLevel) {
-            currentDebugLodLevel = -1;
-        }
-    }
-    window.addEventListener("keyup", evt => {
-        if (evt.key === "p")
-            debugToggleProgressive();
-        if (evt.key === "w") {
-            wireframe = !wireframe;
-            if (debug_materials) {
-                debug_materials.forEach(mat => {
-                    // we don't want to change the skybox material
-                    if (mat.name == "BackgroundCubeMaterial")
-                        return;
-                    if (mat["glyphMap"] != undefined)
-                        return;
-                    if ("wireframe" in mat) {
-                        mat.wireframe = wireframe;
-                    }
-                });
-            }
-        }
-    });
-}
-function registerDebug(obj, key, sourceId) {
-    if (!debug)
-        return;
-    if (!debug_toggle_maps.has(obj)) {
-        debug_toggle_maps.set(obj, { keys: [], sourceId });
-    }
-    const existing = debug_toggle_maps.get(obj);
-    if (existing?.keys?.includes(key) == false) {
-        existing.keys.push(key);
-    }
-}
 /**
  * The NEEDLE_progressive extension for the GLTFLoader is responsible for loading progressive LODs for meshes and textures.
  * This extension can be used to load different resolutions of a mesh or texture at runtime (e.g. for LODs or progressive textures).
@@ -95,13 +30,19 @@ export class NEEDLE_progressive {
     get name() {
         return EXTENSION_NAME;
     }
-    static getMeshLODInformation(geo) {
+    static getMeshLODExtension(geo) {
         const info = this.getAssignedLODInformation(geo);
         if (info?.key) {
             return this.lodInfos.get(info.key);
         }
         return null;
     }
+    static getPrimitiveIndex(geo) {
+        const index = this.getAssignedLODInformation(geo)?.index;
+        if (index === undefined || index === null)
+            return -1;
+        return index;
+    }
     static getMaterialMinMaxLODsCount(material, minmax) {
         const self = this;
         // we can cache this material min max data because it wont change at runtime
@@ -261,8 +202,6 @@ export class NEEDLE_progressive {
                         // if (debug == "verbose") console.log("Progressive Mesh " + mesh.name + " loaded", currentGeometry, "→", geo, "\n", mesh)
                         if (isGeometry) {
                             mesh.geometry = geo;
-                            if (debug)
-                                registerDebug(mesh, "geometry", lodinfo.url);
                         }
                         else if (debug) {
                             console.error("Invalid LOD geometry", geo);
@@ -311,8 +250,6 @@ export class NEEDLE_progressive {
             const material = materialOrTexture;
             const promises = [];
             const slots = new Array();
-            if (debug)
-                debug_materials.add(material);
             // Handle custom shaders / uniforms progressive textures. This includes support for VRM shaders
             if (material.uniforms && (material.isRawShaderMaterial || material.isShaderMaterial === true)) {
                 // iterate uniforms of custom shaders
@@ -391,13 +328,6 @@ export class NEEDLE_progressive {
                         }
                         material[slot] = tex;
                     }
-                    if (debug && slot && material) {
-                        const lodinfo = this.getAssignedLODInformation(current);
-                        if (lodinfo)
-                            registerDebug(material, slot, lodinfo.url);
-                        else
-                            console.warn("No LOD info for texture", current);
-                    }
                     // check if the old texture is still used by other objects
                     // if not we dispose it...
                     // this could also be handled elsewhere and not be done immediately
@@ -440,7 +370,7 @@ export class NEEDLE_progressive {
         return this.parser.getDependency("mesh", meshIndex).then(mesh => {
             this._isLoadingMesh = false;
             if (mesh) {
-                NEEDLE_progressive.registerMesh(this.url, ext.guid, mesh, ext.lods?.length, undefined, ext);
+                NEEDLE_progressive.registerMesh(this.url, ext.guid, mesh, ext.lods?.length, 0, ext);
             }
             return mesh;
         });
@@ -522,7 +452,7 @@ export class NEEDLE_progressive {
         if (tex.source)
             tex.source[$progressiveTextureExtension] = ext;
         const LODKEY = ext.guid;
-        NEEDLE_progressive.assignLODInformation(url, tex, LODKEY, level, index, undefined);
+        NEEDLE_progressive.assignLODInformation(url, tex, LODKEY, level, index);
         NEEDLE_progressive.lodInfos.set(LODKEY, ext);
         NEEDLE_progressive.lowresCache.set(LODKEY, tex);
     };
@@ -530,8 +460,6 @@ export class NEEDLE_progressive {
      * Register a mesh with LOD information
      */
     static registerMesh = (url, key, mesh, level, index, ext) => {
-        if (debug)
-            console.log("> Progressive: register mesh", index, mesh.name, ext, mesh.uuid, mesh);
         const geometry = mesh.geometry;
         if (!geometry) {
             if (debug)
@@ -540,7 +468,9 @@ export class NEEDLE_progressive {
         }
         if (!geometry.userData)
             geometry.userData = {};
-        NEEDLE_progressive.assignLODInformation(url, geometry, key, level, index, ext.density);
+        if (debug)
+            console.log("> Progressive: register mesh " + mesh.name, { index, uuid: mesh.uuid }, ext, mesh);
+        NEEDLE_progressive.assignLODInformation(url, geometry, key, level, index);
         NEEDLE_progressive.lodInfos.set(key, ext);
         let existing = NEEDLE_progressive.lowresCache.get(key);
         if (existing)
@@ -695,7 +625,7 @@ export class NEEDLE_progressive {
                         if (found) {
                             let tex = await parser.getDependency("texture", index);
                             if (tex) {
-                                NEEDLE_progressive.assignLODInformation(LOD.url, tex, LODKEY, level, undefined, undefined);
+                                NEEDLE_progressive.assignLODInformation(LOD.url, tex, LODKEY, level, undefined);
                             }
                             if (debugverbose)
                                 console.log("change \"" + current.name + "\" → \"" + tex.name + "\"", lod_url, index, tex, KEY);
@@ -733,7 +663,7 @@ export class NEEDLE_progressive {
                                 console.log(`Loaded Mesh \"${mesh.name}\"`, lod_url, index, mesh, KEY);
                             if (mesh.isMesh === true) {
                                 const geo = mesh.geometry;
-                                NEEDLE_progressive.assignLODInformation(LOD.url, geo, LODKEY, level, undefined, meshExt.density);
+                                NEEDLE_progressive.assignLODInformation(LOD.url, geo, LODKEY, level, 0);
                                 return resolve(geo);
                             }
                             else {
@@ -742,7 +672,7 @@ export class NEEDLE_progressive {
                                     const child = mesh.children[i];
                                     if (child.isMesh === true) {
                                         const geo = child.geometry;
-                                        NEEDLE_progressive.assignLODInformation(LOD.url, geo, LODKEY, level, i, meshExt.density);
+                                        NEEDLE_progressive.assignLODInformation(LOD.url, geo, LODKEY, level, i);
                                         geometries.push(geo);
                                     }
                                 }
@@ -786,12 +716,12 @@ export class NEEDLE_progressive {
         }
         return null;
     }
-    static assignLODInformation(url, res, key, level, index, density) {
+    static assignLODInformation(url, res, key, level, index) {
         if (!res)
             return;
         if (!res.userData)
             res.userData = {};
-        const info = new LODInformation(url, key, level, index, density);
+        const info = new LODInformation(url, key, level, index);
         res.userData.LODS = info;
     }
     static getAssignedLODInformation(res) {
@@ -848,16 +778,12 @@ class LODInformation {
     level;
     /** For multi objects (e.g. a group of meshes) this is the index of the object */
     index;
-    /** the mesh density */
-    density;
-    constructor(url, key, level, index, density) {
+    constructor(url, key, level, index) {
         this.url = url;
         this.key = key;
         this.level = level;
         if (index != undefined)
             this.index = index;
-        if (density != undefined)
-            this.density = density;
     }
 }
 ;

package/lib/lods.debug.d.ts

@@ -0,0 +1,4 @@
+import { Material } from "three";
+export declare const debug: string | boolean;
+export declare let debug_OverrideLodLevel: number;
+export declare function applyDebugSettings(material: Material | Array<Material>): void;

package/lib/lods.debug.js

@@ -0,0 +1,41 @@
+import { getParam } from "./utils.internal.js";
+export const debug = getParam("debugprogressive");
+let debug_RenderWireframe;
+export let debug_OverrideLodLevel = -1; // -1 is automatic
+if (debug) {
+    let maxLevel = 6;
+    function debugToggleProgressive() {
+        debug_OverrideLodLevel += 1;
+        if (debug_OverrideLodLevel >= maxLevel) {
+            debug_OverrideLodLevel = -1;
+        }
+        console.log(`Toggle LOD level [${debug_OverrideLodLevel}]`);
+    }
+    window.addEventListener("keyup", evt => {
+        if (evt.key === "p")
+            debugToggleProgressive();
+        if (evt.key === "w") {
+            debug_RenderWireframe = !debug_RenderWireframe;
+            console.log(`Toggle wireframe [${debug_RenderWireframe}]`);
+        }
+        const pressedNumber = parseInt(evt.key);
+        if (!isNaN(pressedNumber) && pressedNumber >= 0) {
+            debug_OverrideLodLevel = pressedNumber;
+            console.log(`Set LOD level to [${debug_OverrideLodLevel}]`);
+        }
+    });
+}
+export function applyDebugSettings(material) {
+    if (!debug)
+        return;
+    if (Array.isArray(material)) {
+        for (const mat of material) {
+            applyDebugSettings(mat);
+        }
+    }
+    else if (material) {
+        if ("wireframe" in material) {
+            material.wireframe = debug_RenderWireframe === true;
+        }
+    }
+}

package/lib/lods_manager.d.ts

@@ -43,9 +43,14 @@ declare type LODChangedEventListener = (args: {
  */
 export declare class LODsManager {
     #private;
-    /** Assign a function to draw debug lines for the LODs. This function will be called with the start and end position of the line and the color of the line when the `debugprogressive` query parameter is set.
+    /**
+     * Assign a function to draw debug lines for the LODs. This function will be called with the start and end position of the line and the color of the line when the `debugprogressive` query parameter is set.
      */
     static debugDrawLine?: (a: Vector3, b: Vector3, color: number) => void;
+    /**
+     * Force override the LOD level for all objects in the scene
+     */
+    static overrideGlobalLodLevel?: number;
     /** @internal */
     static getObjectLODState(object: Object3D): LOD_state | undefined;
     static addPlugin(plugin: NEEDLE_progressive_plugin): void;

package/lib/lods_manager.js

@@ -4,6 +4,7 @@ import { createLoaders } from "./loaders.js";
 import { getParam, isMobileDevice } from "./utils.internal.js";
 import { plugins } from "./plugins/plugin.js";
 import { getRaycastMesh } from "./utils.js";
+import { applyDebugSettings, debug, debug_OverrideLodLevel } from "./lods.debug.js";
 const debugProgressiveLoading = getParam("debugprogressive");
 const suppressProgressiveLoading = getParam("noprogressive");
 const $lodsManager = Symbol("Needle:LODSManager");
@@ -40,9 +41,14 @@ const levels = { mesh_lod: -1, texture_lod: -1 };
  * ```
  */
 export class LODsManager {
-    /** Assign a function to draw debug lines for the LODs. This function will be called with the start and end position of the line and the color of the line when the `debugprogressive` query parameter is set.
+    /**
+     * Assign a function to draw debug lines for the LODs. This function will be called with the start and end position of the line and the color of the line when the `debugprogressive` query parameter is set.
      */
     static debugDrawLine;
+    /**
+     * Force override the LOD level for all objects in the scene
+     */
+    static overrideGlobalLodLevel;
     /** @internal */
     static getObjectLODState(object) {
         return object[$lodstate];
@@ -305,17 +311,26 @@ export class LODsManager {
         for (const plugin of plugins) {
             plugin.onBeforeUpdateLOD?.(this.renderer, scene, camera, object);
         }
-        this.calculateLodLevel(camera, object, state, desiredDensity, levels);
-        levels.mesh_lod = Math.round(levels.mesh_lod);
-        levels.texture_lod = Math.round(levels.texture_lod);
+        const debugLodLevel = LODsManager.overrideGlobalLodLevel !== undefined ? LODsManager.overrideGlobalLodLevel : debug_OverrideLodLevel;
+        if (debugLodLevel >= 0) {
+            levels.mesh_lod = debugLodLevel;
+            levels.texture_lod = debugLodLevel;
+        }
+        else {
+            this.calculateLodLevel(camera, object, state, desiredDensity, levels);
+            levels.mesh_lod = Math.round(levels.mesh_lod);
+            levels.texture_lod = Math.round(levels.texture_lod);
+        }
         // we currently only support auto LOD changes for meshes
         if (levels.mesh_lod >= 0) {
             this.loadProgressiveMeshes(object, levels.mesh_lod);
         }
         // TODO: we currently can not switch texture lods because we need better caching for the textures internally (see copySettings in progressive + NE-4431)
-        let textureLOD = levels.texture_lod;
-        if (object.material && textureLOD >= 0) {
-            this.loadProgressiveTextures(object.material, textureLOD);
+        if (object.material && levels.texture_lod >= 0) {
+            this.loadProgressiveTextures(object.material, levels.texture_lod);
+        }
+        if (debug && object.material && !object["isGizmo"]) {
+            applyDebugSettings(object.material);
         }
         for (const plugin of plugins) {
             plugin.onAfterUpdatedLOD?.(this.renderer, scene, camera, object, levels);
@@ -435,8 +450,8 @@ export class LODsManager {
             return mesh["DEBUG:LOD"];
         }
         // The mesh info contains also the density for all available LOD level so we can use this for selecting which level to show
-        const mesh_lods_info = NEEDLE_progressive.getMeshLODInformation(mesh.geometry);
-        const mesh_lods = mesh_lods_info?.lods;
+        const mesh_lods = NEEDLE_progressive.getMeshLODExtension(mesh.geometry)?.lods;
+        const primitive_index = NEEDLE_progressive.getPrimitiveIndex(mesh.geometry);
         const has_mesh_lods = mesh_lods && mesh_lods.length > 0;
         const texture_lods_minmax = NEEDLE_progressive.getMaterialMinMaxLODsCount(mesh.material);
         const has_texture_lods = texture_lods_minmax?.min_count != Infinity && texture_lods_minmax.min_count > 0 && texture_lods_minmax.max_count > 0;
@@ -590,7 +605,8 @@ export class LODsManager {
             // const framerate = this.context.time.smoothedFps;
             if (mesh_lods && state.lastScreenCoverage > 0) {
                 for (let l = 0; l < mesh_lods.length; l++) {
-                    const densityForThisLevel = mesh_lods[l].density;
+                    const lod = mesh_lods[l];
+                    const densityForThisLevel = lod.densities?.[primitive_index] || lod.density || .00001;
                     const resultingDensity = densityForThisLevel / state.lastScreenCoverage;
                     if (resultingDensity < desiredDensity) {
                         expectedLevel = l;

package/lib/plugins/plugin.d.ts

@@ -1,5 +1,5 @@
 import { WebGLRenderer, Scene, Camera, Mesh } from 'three';
-import { NEEDLE_progressive_mesh_model } from '../extension.js';
+import { NEEDLE_ext_progressive_mesh } from '../extension.js';
 /**
  * This interface is used to define a plugin for the progressive extension. It can be registered using the `registerPlugin` function.
  */
@@ -12,7 +12,7 @@ export interface NEEDLE_progressive_plugin {
         texture_lod: number;
     }): void;
     /** Called when a new mesh is registered */
-    onRegisteredNewMesh?(mesh: Mesh, ext: NEEDLE_progressive_mesh_model): void;
+    onRegisteredNewMesh?(mesh: Mesh, ext: NEEDLE_ext_progressive_mesh): void;
     /** Called before the LOD mesh is fetched */
     onBeforeGetLODMesh?(mesh: Mesh, level: number): void;
 }

package/lib/version.js

@@ -1,4 +1,4 @@
 // replaced at build time
-export const version = "2.1.6";
+export const version = "3.0.0-alpha";
 globalThis["GLTF_PROGRESSIVE_VERSION"] = version;
 console.debug(`[gltf-progressive] version ${version || "-"}`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@needle-tools/gltf-progressive",
-  "version": "2.1.6",
+  "version": "3.0.0-rc.f23cbbb",
   "description": "three.js support for loading glTF or GLB files that contain progressive loading data",
   "homepage": "https://needle.tools",
   "author": {
@@ -72,4 +72,4 @@
     "vite": "<= 4.3.9"
   },
   "types": "./lib/index.d.ts"
-}
+}