@inweb/viewer-three 26.10.6 → 26.12.0

package/src/Viewer/loaders/DynamicGltfLoader/DynamicModelImpl.ts

@@ -22,6 +22,7 @@
 ///////////////////////////////////////////////////////////////////////////////
 
 import { Box3, Object3D } from "three";
+import { IInfo, Info } from "@inweb/viewer-core";
 
 import { ModelImpl } from "../../models/ModelImpl";
 import { DynamicGltfLoader } from "./DynamicGltfLoader.js";
@@ -30,7 +31,30 @@ import { DynamicGltfLoader } from "./DynamicGltfLoader.js";
 
 export class DynamicModelImpl extends ModelImpl {
   public gltfLoader: DynamicGltfLoader;
-  public modelId: number;
+
+  override getInfo(): IInfo {
+    const stats = this.gltfLoader.getStats();
+
+    const info = new Info();
+
+    info.scene.objects = stats.scene.beforeOptimization.objects;
+    info.scene.triangles = stats.scene.beforeOptimization.triangles;
+    info.scene.lines = stats.scene.beforeOptimization.lines;
+    info.scene.edges = stats.scene.beforeOptimization.edges;
+
+    info.optimizedScene.objects = stats.scene.afterOptimization.objects;
+    info.optimizedScene.triangles = stats.scene.afterOptimization.triangles;
+    info.optimizedScene.lines = stats.scene.afterOptimization.lines;
+    info.optimizedScene.edges = stats.scene.afterOptimization.edges;
+
+    info.memory.geometries = stats.memory.geometries.count;
+    info.memory.geometryBytes = stats.memory.geometries.bytes;
+    info.memory.textures = stats.memory.textures.count;
+    info.memory.materials = stats.memory.materials.count;
+    info.memory.totalEstimatedGpuBytes = stats.memory.totalEstimatedGpuBytes;
+
+    return info;
+  }
 
   override getExtents(target: Box3): Box3 {
     return target.union(this.gltfLoader.getTotalGeometryExtent());
@@ -53,35 +77,46 @@ export class DynamicModelImpl extends ModelImpl {
   }
 
   override getObjectsByHandles(handles: string | string[]): Object3D[] {
-    const handlesSet = new Set(handles);
+    const ownHandles = this.getOwnHandles(handles);
+    if (ownHandles.length === 0) return [];
+
+    const handlesSet = new Set(ownHandles);
+
     const objects = [];
     handlesSet.forEach((handle) => {
-      const handle2 = `${this.modelId}_${handle}`; // <- props fix: Dynamic Loader uses handle with structure ID prefix
-      const handles = this.gltfLoader.handleToObjects.get(handle2) || [];
-      objects.push(...Array.from(handles));
+      objects.push(...this.gltfLoader.getObjectsByHandle(handle));
     });
+
     return objects;
   }
 
   override getHandlesByObjects(objects: Object3D | Object3D[]): string[] {
-    const handles = super.getHandlesByObjects(objects);
-    return handles.map((x) => x.split("_").pop()); // <- props fix: remove structure ID prefix by the Dynamic Loader
+    const ownObjects = this.getOwnObjects(objects);
+    if (ownObjects.length === 0) return [];
+
+    const handleSet = new Set<string>();
+    ownObjects.forEach((object) => {
+      const handle = object.userData.handle;
+      if (handle) handleSet.add(handle);
+    });
+
+    return Array.from(handleSet);
   }
 
   override hideObjects(objects: Object3D | Object3D[]): this {
-    const handles = super.getHandlesByObjects(objects);
+    const handles = this.getHandlesByObjects(objects);
     this.gltfLoader.hideObjects(handles);
     return this;
   }
 
   override isolateObjects(objects: Object3D | Object3D[]): this {
-    const handles = super.getHandlesByObjects(objects);
+    const handles = this.getHandlesByObjects(objects);
     this.gltfLoader.isolateObjects(new Set(handles));
     return this;
   }
 
   override showObjects(objects: Object3D | Object3D[]): this {
-    const handles = super.getHandlesByObjects(objects);
+    const handles = this.getHandlesByObjects(objects);
     this.gltfLoader.showObjects(handles);
     return this;
   }

package/src/Viewer/loaders/DynamicGltfLoader/GltfStructure.js

@@ -58,12 +58,17 @@ export class GltfStructure {
     this.materials = new Map();
     this.textureCache = new Map();
     this.materialCache = new Map();
+    this.uri = "";
+    this._nextObjectId = 0;
+    this.loadingAborted = false;
+    this.criticalError = null;
   }
 
   async initialize(loader) {
     this.json = await this.loadController.loadJson();
     this.baseUrl = await this.loadController.baseUrl();
     this.loader = loader;
+    this.uri = this.json.buffers[0].uri || "";
   }
 
   clear() {
@@ -82,6 +87,8 @@ export class GltfStructure {
 
     this.activeChunkLoads = 0;
     this.chunkQueue = [];
+    this.loadingAborted = false;
+    this.criticalError = null;
   }
 
   getJson() {
@@ -90,6 +97,10 @@ export class GltfStructure {
 
   scheduleRequest(request) {
     return new Promise((resolve, reject) => {
+      if (this.loadingAborted) {
+        reject(this.criticalError || new Error("Structure loading has been aborted due to critical error"));
+        return;
+      }
       this.pendingRequests.push({
         ...request,
         _resolve: resolve,
@@ -98,6 +109,52 @@ export class GltfStructure {
     });
   }
 
+  isCriticalHttpError(error) {
+    if (!error) return false;
+
+    const status = error.status || error.statusCode || error.code;
+
+    if (typeof status === "number") {
+      return status >= 400 && status < 600;
+    }
+
+    if (error.message) {
+      const match = error.message.match(/HTTP\s+(\d{3})/i);
+      if (match) {
+        const code = parseInt(match[1], 10);
+        return code >= 400 && code < 600;
+      }
+    }
+
+    return false;
+  }
+
+  abortLoading(error) {
+    if (this.loadingAborted) {
+      return;
+    }
+
+    this.loadingAborted = true;
+    this.criticalError = error;
+
+    const requests = [...this.pendingRequests];
+    this.pendingRequests = [];
+
+    for (const req of requests) {
+      if (req._reject) {
+        req._reject(error);
+      }
+    }
+
+    console.error(
+      `❌ Critical error for structure "${this.id}". All further loading aborted.`,
+      `\n   Error: ${error.message || error}`,
+      `\n   Rejected ${requests.length} pending chunk requests.`
+    );
+
+    throw error;
+  }
+
   async flushBufferRequests() {
     if (!this.pendingRequests || this.pendingRequests.length === 0) return;
     const requests = [...this.pendingRequests];
@@ -162,11 +219,18 @@ export class GltfStructure {
     }
 
     const promises = finalRanges.map(async (range, index) => {
+      if (this.loadingAborted) {
+        for (const req of range.requests) {
+          req._reject(this.criticalError || new Error("Structure loading aborted"));
+        }
+        return;
+      }
+
       await this.loader.waitForChunkSlot();
 
       try {
         const length = range.end - range.start;
-        const buffer = await this.loadController.loadBinaryData([{ offset: range.start, length }]);
+        const buffer = await this.loadController.loadBinaryData([{ offset: range.start, length }], this.uri);
 
         for (const req of range.requests) {
           const relOffset = req.offset - range.start;
@@ -180,7 +244,12 @@ export class GltfStructure {
         for (const req of range.requests) {
           req._reject(error);
         }
-        console.warn(`Failed to load chunk ${index + 1}/${finalRanges.length} (${range.start}-${range.end}):`, error);
+
+        if (this.isCriticalHttpError(error)) {
+          this.abortLoading(error);
+        } else {
+          console.warn(`Failed to load chunk ${index + 1}/${finalRanges.length} (${range.start}-${range.end}):`, error);
+        }
       } finally {
         this.loader.releaseChunkSlot();
       }

package/src/Viewer/loaders/GLTFBinaryExtension.ts

@@ -0,0 +1,91 @@
+///////////////////////////////////////////////////////////////////////////////
+// Copyright (C) 2002-2025, Open Design Alliance (the "Alliance").
+// All rights reserved.
+//
+// This software and its documentation and related materials are owned by
+// the Alliance. The software may only be incorporated into application
+// programs owned by members of the Alliance, subject to a signed
+// Membership Agreement and Supplemental Software License Agreement with the
+// Alliance. The structure and organization of this software are the valuable
+// trade secrets of the Alliance and its suppliers. The software is also
+// protected by copyright law and international treaty provisions. Application
+// programs incorporating this software must include the following statement
+// with their copyright notices:
+//
+//   This application incorporates Open Design Alliance software pursuant to a
+//   license agreement with Open Design Alliance.
+//   Open Design Alliance Copyright (C) 2002-2025 by Open Design Alliance.
+//   All rights reserved.
+//
+// By use of this software, its documentation or related materials, you
+// acknowledge and accept the above terms.
+///////////////////////////////////////////////////////////////////////////////
+
+// ===================== AI-CODE-FILE ======================
+// Source: Claude Sonnet 4.5
+// Date: 2025-28-10
+// Reviewer: roman.mochalov@opendesign.com
+// Issue: CLOUD-5933
+// Notes: Originally AI-generated, modified manually
+// =========================================================
+
+const BINARY_EXTENSION_HEADER_MAGIC = "glTF";
+const BINARY_EXTENSION_HEADER_LENGTH = 12;
+const BINARY_EXTENSION_CHUNK_TYPES = { JSON: 0x4e4f534a, BIN: 0x004e4042 };
+
+export class GLTFBinaryExtension {
+  public content: string;
+  public body: ArrayBuffer;
+
+  constructor(data: ArrayBuffer) {
+    const headerView = new DataView(data, 0, BINARY_EXTENSION_HEADER_LENGTH);
+    const textDecoder = new TextDecoder();
+
+    const magic = textDecoder.decode(new Uint8Array(data.slice(0, 4)));
+
+    if (magic !== BINARY_EXTENSION_HEADER_MAGIC) {
+      this.content = textDecoder.decode(data);
+      return;
+    }
+
+    const header = {
+      magic,
+      version: headerView.getUint32(4, true),
+      length: headerView.getUint32(8, true),
+    };
+
+    if (header.magic !== BINARY_EXTENSION_HEADER_MAGIC) {
+      throw new Error("Unsupported glTF-Binary header.");
+    }
+
+    if (header.version < 2.0) {
+      throw new Error("Legacy binary file detected.");
+    }
+
+    const chunkContentsLength = header.length - BINARY_EXTENSION_HEADER_LENGTH;
+    const chunkView = new DataView(data, BINARY_EXTENSION_HEADER_LENGTH);
+    let chunkIndex = 0;
+
+    while (chunkIndex < chunkContentsLength) {
+      const chunkLength = chunkView.getUint32(chunkIndex, true);
+      chunkIndex += 4;
+
+      const chunkType = chunkView.getUint32(chunkIndex, true);
+      chunkIndex += 4;
+
+      if (chunkType === BINARY_EXTENSION_CHUNK_TYPES.JSON) {
+        const contentArray = new Uint8Array(data, BINARY_EXTENSION_HEADER_LENGTH + chunkIndex, chunkLength);
+        this.content = textDecoder.decode(contentArray);
+      } else if (chunkType === BINARY_EXTENSION_CHUNK_TYPES.BIN) {
+        const byteOffset = BINARY_EXTENSION_HEADER_LENGTH + chunkIndex;
+        this.body = data.slice(byteOffset, byteOffset + chunkLength);
+      }
+
+      chunkIndex += chunkLength;
+    }
+
+    if (typeof this.content === "undefined") {
+      throw new Error("JSON content not found.");
+    }
+  }
+}

package/src/Viewer/loaders/GLTFCloudDynamicLoader.ts

@@ -22,27 +22,28 @@
 ///////////////////////////////////////////////////////////////////////////////
 
 import { Group } from "three";
-import { ILoader, LoadParams } from "@inweb/viewer-core";
+import { Loader, LoadParams } from "@inweb/viewer-core";
 
 import { Viewer } from "../Viewer";
 import { DynamicModelImpl } from "./DynamicGltfLoader/DynamicModelImpl";
 import { DynamicGltfLoader } from "./DynamicGltfLoader/DynamicGltfLoader.js";
 import { GltfStructure } from "./DynamicGltfLoader/GltfStructure.js";
 
-export class GLTFCloudDynamicLoader implements ILoader {
+export class GLTFCloudDynamicLoader extends Loader {
   public viewer: Viewer;
   public gltfLoader: DynamicGltfLoader;
   public requestId = 0;
 
   constructor(viewer: Viewer) {
+    super();
     this.viewer = viewer;
   }
 
-  dispose() {
+  override dispose() {
     if (this.gltfLoader) this.gltfLoader.clear();
   }
 
-  isSupport(file: any): boolean {
+  override isSupport(file: any): boolean {
     return (
       typeof file === "object" &&
       typeof file.database === "string" &&
@@ -52,7 +53,7 @@ export class GLTFCloudDynamicLoader implements ILoader {
     );
   }
 
-  async load(model: any, format?: string, params?: LoadParams): Promise<this> {
+  override async load(model: any, format?: string, params: LoadParams = {}): Promise<this> {
     const scene = new Group();
 
     this.gltfLoader = new DynamicGltfLoader(this.viewer.camera, scene, this.viewer.renderer);
@@ -60,13 +61,11 @@ export class GLTFCloudDynamicLoader implements ILoader {
     this.gltfLoader.setVisibleEdges(this.viewer.options.edgeModel);
     // this.gltfLoader.setMaxConcurrentChunks(this.viewer.options.maxConcurrentChunks);
 
-    this.gltfLoader.addEventListener("databasechunk", (data) => {
-      const modelImpl = new DynamicModelImpl(scene);
-      modelImpl.loader = this;
-      modelImpl.viewer = this.viewer;
-      modelImpl.gltfLoader = this.gltfLoader;
-      modelImpl.modelId = model.id;
+    const modelImpl = new DynamicModelImpl(scene);
+    modelImpl.id = model.file.id;
+    modelImpl.gltfLoader = this.gltfLoader;
 
+    this.gltfLoader.addEventListener("databasechunk", (data) => {
       this.viewer.scene.add(scene);
       this.viewer.models.push(modelImpl);
 
@@ -77,11 +76,6 @@ export class GLTFCloudDynamicLoader implements ILoader {
       this.viewer.emitEvent({ type: "databasechunk", data: scene, file: model.file, model });
     });
 
-    this.gltfLoader.addEventListener("geometryprogress", (data) => {
-      const progress = data.loaded / data.total;
-      this.viewer.emitEvent({ type: "geometryprogress", data: progress, file: model.file, model });
-    });
-
     this.gltfLoader.addEventListener("geometryerror", (data) => {
       this.viewer.emitEvent({ type: "geometryerror", data, file: model.file, model });
     });
@@ -93,7 +87,7 @@ export class GLTFCloudDynamicLoader implements ILoader {
     const loadController = {
       loadJson: async () => {
         const progress = (progress: number) => {
-          this.viewer.emitEvent({ type: "geometryprogress", data: progress, file: model });
+          this.viewer.emitEvent({ type: "geometryprogress", data: progress, file: model.file, model });
         };
 
         const arrayBuffer = await model.downloadResource(
@@ -127,7 +121,7 @@ export class GLTFCloudDynamicLoader implements ILoader {
       baseUrl: () => Promise.resolve(`${model.httpClient.serverUrl}${model.path}/`),
     };
 
-    const structure = new GltfStructure(model.id, loadController);
+    const structure = new GltfStructure(modelImpl.id, loadController);
 
     await this.gltfLoader.loadStructure(structure);
     await this.gltfLoader.loadNodes();
@@ -135,7 +129,7 @@ export class GLTFCloudDynamicLoader implements ILoader {
     return this;
   }
 
-  cancel() {
+  override cancel() {
     if (this.gltfLoader) this.gltfLoader.abortLoading();
   }
 }

package/src/Viewer/loaders/GLTFFileDynamicLoader.ts

@@ -0,0 +1,145 @@
+///////////////////////////////////////////////////////////////////////////////
+// Copyright (C) 2002-2025, Open Design Alliance (the "Alliance").
+// All rights reserved.
+//
+// This software and its documentation and related materials are owned by
+// the Alliance. The software may only be incorporated into application
+// programs owned by members of the Alliance, subject to a signed
+// Membership Agreement and Supplemental Software License Agreement with the
+// Alliance. The structure and organization of this software are the valuable
+// trade secrets of the Alliance and its suppliers. The software is also
+// protected by copyright law and international treaty provisions. Application
+// programs incorporating this software must include the following statement
+// with their copyright notices:
+//
+//   This application incorporates Open Design Alliance software pursuant to a
+//   license agreement with Open Design Alliance.
+//   Open Design Alliance Copyright (C) 2002-2025 by Open Design Alliance.
+//   All rights reserved.
+//
+// By use of this software, its documentation or related materials, you
+// acknowledge and accept the above terms.
+///////////////////////////////////////////////////////////////////////////////
+
+import { FileLoader, Group, LoaderUtils } from "three";
+import { Loader } from "@inweb/viewer-core";
+
+import { Viewer } from "../Viewer";
+import { DynamicModelImpl } from "./DynamicGltfLoader/DynamicModelImpl";
+import { DynamicGltfLoader } from "./DynamicGltfLoader/DynamicGltfLoader.js";
+import { GltfStructure } from "./DynamicGltfLoader/GltfStructure.js";
+import { GLTFLoadingManager, GLTFLoadParams } from "./GLTFLoadingManager";
+import { GLTFBinaryExtension } from "./GLTFBinaryExtension";
+import { RangesLoader } from "./RangesLoader";
+
+export class GLTFFileDynamicLoader extends Loader {
+  public viewer: Viewer;
+  private gltfLoader: DynamicGltfLoader;
+  private manager: GLTFLoadingManager;
+  private gltf: any;
+  private bin: ArrayBuffer;
+
+  constructor(viewer: Viewer) {
+    super();
+    this.viewer = viewer;
+  }
+
+  override dispose() {
+    if (this.gltfLoader) this.gltfLoader.clear();
+    if (this.manager) this.manager.dispose();
+  }
+
+  override isSupport(file: any, format?: string): boolean {
+    return (
+      (typeof file === "string" || file instanceof globalThis.File || file instanceof ArrayBuffer) &&
+      /(gltf|glb)$/i.test(format)
+    );
+  }
+
+  override async load(file: any, format?: string, params?: GLTFLoadParams): Promise<this> {
+    this.manager = new GLTFLoadingManager(file, params);
+
+    const scene = new Group();
+
+    this.gltfLoader = new DynamicGltfLoader(this.viewer.camera, scene, this.viewer.renderer);
+    this.gltfLoader.memoryLimit = this.viewer.options.memoryLimit;
+    this.gltfLoader.visibleEdges = this.viewer.options.edgeModel;
+
+    const modelImpl = new DynamicModelImpl(scene);
+    modelImpl.id = params.modelId || this.extractFileName(file);
+    modelImpl.gltfLoader = this.gltfLoader;
+
+    this.gltfLoader.addEventListener("databasechunk", () => {
+      this.viewer.scene.add(scene);
+      this.viewer.models.push(modelImpl);
+
+      this.viewer.syncOptions();
+      this.viewer.syncOverlay();
+      this.viewer.update();
+
+      this.viewer.emitEvent({ type: "databasechunk", data: scene, file });
+    });
+
+    this.gltfLoader.addEventListener("geometryerror", (data) => {
+      this.viewer.emitEvent({ type: "geometryerror", data, file });
+    });
+
+    this.gltfLoader.addEventListener("update", (data) => {
+      this.viewer.update();
+    });
+
+    const loadController = {
+      loadJson: async () => {
+        const loader = new FileLoader(this.manager);
+        loader.setPath(this.manager.path);
+        loader.setRequestHeader((params.requestHeader as any) || {});
+        loader.setWithCredentials(params.withCredentials || loader.withCredentials);
+        loader.setResponseType("arraybuffer");
+
+        const progress = (event: ProgressEvent) => {
+          const { lengthComputable, loaded, total } = event;
+          const progress = lengthComputable ? loaded / total : 1;
+          this.viewer.emitEvent({ type: "geometryprogress", data: progress, file });
+        };
+
+        const data = await loader.loadAsync(this.manager.fileURL, progress);
+
+        const extension = new GLTFBinaryExtension(data as ArrayBuffer);
+        this.gltf = JSON.parse(extension.content);
+        this.bin = extension.body;
+
+        return this.gltf;
+      },
+
+      loadBinaryData: (ranges, uri = "") => {
+        const loader = new RangesLoader();
+        loader.setRequestHeader((params.requestHeader as any) || {});
+        loader.setWithCredentials(params.withCredentials || false);
+        loader.setAbortSignal(this.gltfLoader.abortController.signal);
+
+        if (this.bin) return loader.extractRanges(this.bin, ranges);
+
+        const path = this.manager.path || this.manager.resourcePath;
+        const url = LoaderUtils.resolveURL(uri, path);
+
+        return loader.load(this.manager.resolveURL(url), ranges);
+      },
+
+      baseUrl: () => {
+        const path = this.manager.path || this.manager.resourcePath;
+        return Promise.resolve(path);
+      },
+    };
+
+    const structure = new GltfStructure(modelImpl.id, loadController);
+
+    await this.gltfLoader.loadStructure(structure);
+    await this.gltfLoader.loadNodes();
+
+    return this;
+  }
+
+  override cancel() {
+    if (this.gltfLoader) this.gltfLoader.abortLoading();
+  }
+}

package/src/Viewer/loaders/GLTFLoadingManager.ts

@@ -21,16 +21,17 @@
 // acknowledge and accept the above terms.
 ///////////////////////////////////////////////////////////////////////////////
 
+import { LoadParams } from "@inweb/viewer-core";
 import { LoadingManager, LoaderUtils } from "three";
 
 export type GLTFFileSource = string | globalThis.File | ArrayBuffer;
 
-export type GLTFLoadParams = {
+export type GLTFLoadParams = LoadParams & {
+  requestHeader?: HeadersInit;
+  withCredentials?: boolean;
   path?: string;
   externalFiles?: Map<string, GLTFFileSource>;
   crossOrigin?: string;
-  requestHeader?: HeadersInit;
-  withCredentials?: boolean;
 };
 
 export class GLTFLoadingManager extends LoadingManager {
@@ -72,6 +73,6 @@ export class GLTFLoadingManager extends LoadingManager {
   }
 
   dispose() {
-    this.dataURLs.forEach(URL.revokeObjectURL);
+    this.dataURLs.forEach((dataURL) => URL.revokeObjectURL(dataURL));
   }
 }