@inweb/viewer-three 26.10.6 → 26.11.1

package/lib/Viewer/Viewer.d.ts

@@ -7,7 +7,7 @@ import { SSAARenderPass } from "./postprocessing/SSAARenderPass.js";
 import { OutputPass } from "three/examples/jsm/postprocessing/OutputPass.js";
 import { EventEmitter2 } from "@inweb/eventemitter2";
 import { Assembly, Client, Model, File } from "@inweb/client";
-import { CanvasEventMap, FileSource, IComponent, IDragger, ILoader, IOptions, IViewer, IViewpoint, Options, OptionsEventMap, ViewerEventMap } from "@inweb/viewer-core";
+import { CanvasEventMap, FileSource, IComponent, IDragger, ILoader, IOptions, IViewer, IViewpoint, OptionsEventMap, ViewerEventMap } from "@inweb/viewer-core";
 import { IMarkup, IWorldTransform } from "@inweb/markup";
 import { IModelImpl } from "./models/IModelImpl";
 import { Helpers } from "./scenes/Helpers";
@@ -16,10 +16,12 @@ import { Helpers } from "./scenes/Helpers";
  */
 export declare class Viewer extends EventEmitter2<ViewerEventMap & CanvasEventMap & OptionsEventMap> implements IViewer, IWorldTransform {
     client: Client | undefined;
-    protected _options: Options;
-    private canvaseventlistener;
+    options: IOptions;
     canvas: HTMLCanvasElement | undefined;
     canvasEvents: string[];
+    loaders: ILoader[];
+    models: IModelImpl[];
+    private canvaseventlistener;
     scene: Scene | undefined;
     helpers: Helpers | undefined;
     camera: PerspectiveCamera | OrthographicCamera | undefined;
@@ -31,8 +33,6 @@ export declare class Viewer extends EventEmitter2<ViewerEventMap & CanvasEventMa
     ssaaRenderPass: SSAARenderPass | undefined;
     outputPass: OutputPass | undefined;
     composer: EffectComposer | undefined;
-    loaders: ILoader[];
-    models: IModelImpl[];
     selected: Object3D[];
     extents: Box3;
     target: Vector3;
@@ -47,15 +47,14 @@ export declare class Viewer extends EventEmitter2<ViewerEventMap & CanvasEventMa
      *   the web or from local computer.
      */
     constructor(client?: Client);
-    get options(): IOptions;
-    get draggers(): string[];
-    get components(): string[];
     /**
      * 2D markup core instance used to create markups.
      *
      * @readonly
      */
     get markup(): IMarkup;
+    get draggers(): string[];
+    get components(): string[];
     initialize(canvas: HTMLCanvasElement, onProgress?: (event: ProgressEvent<EventTarget>) => void): Promise<this>;
     dispose(): this;
     isInitialized(): boolean;
@@ -74,18 +73,20 @@ export declare class Viewer extends EventEmitter2<ViewerEventMap & CanvasEventMa
      * exception will be thrown.
      *
      * For files from Open Cloud Server, the default model will be loaded. If there is no default model,
-     * first availiable model will be loaded. If no models are found in the file, an exception will be
+     * the first available model will be loaded. If no models are found in the file, an exception will be
      * thrown.
      *
      * For URLs, the file extension is used to determine the file format. For a `ArrayBuffer` and `Data
-     * URL`, a file format must be specified using `params.format` parameter (see below). If no appropriate
-     * loader is found for the specified format, an exception will be thrown.
+     * URL`, a file format must be specified using `params.format` parameter. If no appropriate loader is
+     * found for the specified format, an exception will be thrown.
      *
      * If there was an active dragger before opening the file, it will be deactivated. After opening the
      * file, you must manually activate the required dragger.
      *
      * Fires:
      *
+     * - {@link CancelEvent | cancel}
+     * - {@link ClearEvent | clear}
      * - {@link OpenEvent | open}
      * - {@link GeometryStartEvent | geometrystart}
      * - {@link GeometryProgressEvent | geometryprogress}
@@ -94,23 +95,26 @@ export declare class Viewer extends EventEmitter2<ViewerEventMap & CanvasEventMa
      * - {@link GeometryEndEvent | geometryend}
      * - {@link GeometryErrorEvent | geometryerror}
      *
-     * @param file - File to load. Can be one of:
+     * @param file - File to load. Can be:
      *
      *   - `File`, `Assembly` or `Model` instance from the Open Cloud Server
-     *   - File `URL` string
+     *   - `URL` string
      *   - {@link https://developer.mozilla.org/docs/Web/HTTP/Basics_of_HTTP/Data_URIs | Data URL} string
      *   - {@link https://developer.mozilla.org/docs/Web/API/File | Web API File} object
      *   - {@link https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer | ArrayBuffer}
      *       object
      *
      * @param params - Loading parameters.
-     * @param params.format - File format string. Required when loading a file as `ArrayBuffer` or `Data
-     *   URL`.
+     * @param params.format - File format. Can be `gltf`, `glb` or format from a plugin. Required when
+     *   loading a file as `ArrayBuffer` or `Data URL`.
      * @param params.mode - File opening mode. Can be one of:
      *
-     *   - `open` - Unloads an open file and opens a new one. This is default mode.
-     *   - `append` - Appends a file to an already open file.
+     *   - `file` - Single file mode. Unloads an open file and opens a new one. This is default mode.
+     *   - `assembly` - Assembly mode. Appends a file to an already open file.
      *
+     * @param params.modelId - Unique model ID in the assembly (multi-model scene). Used as a model prefix
+     *   when selecting objects (see {@link getSelected2}). Must not contain the ":" (colon). Required when
+     *   loading a file as `ArrayBuffer` or `Data URL`.
      * @param params.requestHeader - The
      *   {@link https://developer.mozilla.org/docs/Glossary/Request_header | request header} used in HTTP
      *   request.
@@ -130,6 +134,7 @@ export declare class Viewer extends EventEmitter2<ViewerEventMap & CanvasEventMa
     open(file: FileSource, params?: {
         format?: string;
         mode?: string;
+        modelId?: string;
         requestHeader?: HeadersInit;
         withCredentials?: boolean;
         path?: string;
@@ -150,12 +155,15 @@ export declare class Viewer extends EventEmitter2<ViewerEventMap & CanvasEventMa
     loadGltfFile(file: any, externalFiles: any, params?: any): Promise<this>;
     cancel(): this;
     clear(): this;
+    is3D(): boolean;
     syncOptions(options?: IOptions): void;
     syncOverlay(): void;
     clearOverlay(): void;
     clearSlices(): void;
     getSelected(): string[];
+    getSelected2(): string[];
     setSelected(handles?: string[]): void;
+    setSelected2(handles?: string[]): void;
     clearSelected(): void;
     hideSelected(): void;
     isolateSelected(): void;
@@ -166,7 +174,8 @@ export declare class Viewer extends EventEmitter2<ViewerEventMap & CanvasEventMa
     setActiveDragger(name?: string): IDragger | null;
     resetActiveDragger(): void;
     getComponent(name: string): IComponent;
-    is3D(): boolean;
+    drawViewpoint(viewpoint: IViewpoint): void;
+    createViewpoint(): IViewpoint;
     screenToWorld(position: {
         x: number;
         y: number;
@@ -189,6 +198,4 @@ export declare class Viewer extends EventEmitter2<ViewerEventMap & CanvasEventMa
         z: number;
     };
     executeCommand(id: string, ...args: any[]): any;
-    drawViewpoint(viewpoint: IViewpoint): void;
-    createViewpoint(): IViewpoint;
 }

package/lib/Viewer/commands/GetSelected2.d.ts

@@ -0,0 +1,2 @@
+import type { Viewer } from "../Viewer";
+export declare function getSelected2(viewer: Viewer): string[];

package/lib/Viewer/commands/SelectModel.d.ts

@@ -1,2 +1,2 @@
 import type { Viewer } from "../Viewer";
-export declare function selectModel(viewer: Viewer, handle: string): void;
+export declare function selectModel(viewer: Viewer, id: string): void;

package/lib/Viewer/commands/SetSelected2.d.ts

@@ -0,0 +1,2 @@
+import type { Viewer } from "../Viewer";
+export declare function setSelected2(viewer: Viewer, handles?: string[]): void;

package/lib/Viewer/components/index.d.ts

@@ -6,8 +6,8 @@ import { IComponentsRegistry } from "@inweb/viewer-core";
  *
  * 1. Define a component class implements {@link IComponent}.
  * 2. Define a constructor with a `viewer` parameter and add mouse event listeners for the specified viewer.
- * 3. Define the component logic in the event listeners. For example, listen for the `mousedown` event and
- *    select objects when the left mouse button is pressed.
+ * 3. Define the component logic in the event listeners. For example, listen for the `geometryend` event and
+ *    implement post-processing logic for the model.
  * 4. Override {@link IComponent.dispose} and remove mouse event listeners from the viewer.
  * 5. Register component provider in the components registry by calling the
  *    {@link components.registerComponent}.
@@ -22,15 +22,15 @@ import { IComponentsRegistry } from "@inweb/viewer-core";
  *
  *   constructor(viewer: Viewer) {
  *     this.viewer = viewer;
- *     this.viewer.addEventListener("mousedown", this.onMouseDown);
+ *     this.viewer.addEventListener("geometryend", this.onGeometryEnd);
  *   }
  *
  *   override dispose() {
- *     this.viewer.removeEventListener("mousedown", this.onMouseDown);
+ *     this.viewer.removeEventListener("geometryend", this.onGeometryEnd);
  *   }
  *
- *   onMouseDown = (event: PointerEvent) => {
- *     // place custom logic here
+ *   onGeometryEnd = (event: MouseEvent) => {
+ *     this.viewer.executeCommand("zoomToExtents");
  *   };
  * }
  *

package/lib/Viewer/loaders/DynamicGltfLoader/DynamicModelImpl.d.ts

@@ -3,7 +3,6 @@ import { ModelImpl } from "../../models/ModelImpl";
 import { DynamicGltfLoader } from "./DynamicGltfLoader.js";
 export declare class DynamicModelImpl extends ModelImpl {
     gltfLoader: DynamicGltfLoader;
-    modelId: number;
     getExtents(target: Box3): Box3;
     getObjects(): Object3D[];
     getVisibleObjects(): Object3D[];

package/lib/Viewer/loaders/GLTFBinaryExtension.d.ts

@@ -0,0 +1,5 @@
+export declare class GLTFBinaryExtension {
+    content: string;
+    body: ArrayBuffer;
+    constructor(data: ArrayBuffer);
+}

package/lib/Viewer/loaders/GLTFCloudDynamicLoader.d.ts

@@ -1,7 +1,7 @@
-import { ILoader, LoadParams } from "@inweb/viewer-core";
+import { Loader, LoadParams } from "@inweb/viewer-core";
 import { Viewer } from "../Viewer";
 import { DynamicGltfLoader } from "./DynamicGltfLoader/DynamicGltfLoader.js";
-export declare class GLTFCloudDynamicLoader implements ILoader {
+export declare class GLTFCloudDynamicLoader extends Loader {
     viewer: Viewer;
     gltfLoader: DynamicGltfLoader;
     requestId: number;

package/lib/Viewer/loaders/{GLTFFileLoader.d.ts → GLTFFileDynamicLoader.d.ts}

@@ -1,9 +1,15 @@
 import { Loader } from "@inweb/viewer-core";
 import { Viewer } from "../Viewer";
 import { GLTFLoadParams } from "./GLTFLoadingManager";
-export declare class GLTFFileLoader extends Loader {
+export declare class GLTFFileDynamicLoader extends Loader {
     viewer: Viewer;
+    private gltfLoader;
+    private manager;
+    private gltf;
+    private bin;
     constructor(viewer: Viewer);
+    dispose(): void;
     isSupport(file: any, format?: string): boolean;
     load(file: any, format?: string, params?: GLTFLoadParams): Promise<this>;
+    cancel(): void;
 }

package/lib/Viewer/loaders/GLTFLoadingManager.d.ts

@@ -1,11 +1,12 @@
+import { LoadParams } from "@inweb/viewer-core";
 import { LoadingManager } 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 declare class GLTFLoadingManager extends LoadingManager {
     path: string;

package/lib/Viewer/loaders/RangesLoader.d.ts

@@ -0,0 +1,15 @@
+export interface Range {
+    offset: number;
+    length: number;
+}
+export declare class RangesLoader {
+    private requestHeader;
+    private withCredentials;
+    private abortSignal;
+    constructor();
+    setRequestHeader(requestHeader: HeadersInit): void;
+    setWithCredentials(withCredentials: boolean): void;
+    setAbortSignal(abortSignal: AbortSignal): void;
+    load(url: string, ranges: Range[]): Promise<ArrayBuffer>;
+    extractRanges(arrayBuffer: ArrayBuffer, ranges: Range[]): ArrayBuffer;
+}

package/lib/Viewer/loaders/index.d.ts

@@ -6,29 +6,30 @@ import { ILoadersRegistry } from "@inweb/viewer-core";
  *
  * 1. Define a loader class implements {@link ILoader}.
  * 2. Define a constructor with a `viewer` parameter.
- * 3. Override {@link ILoader.isSupport} and сheck if the loader can load the specified file.
+ * 3. Override {@link ILoader.isSupport} and check if the loader can load the specified file.
  * 4. Override {@link ILoader.load} and define the logic for loading the scene from the file.
  *
  *    The loader should do:
  *
  *    - Load raw data from file and convert it to the `Three.js` scene.
  *    - Add scene to the viewer `scene`.
- *    - Create `ModelImpl` for the scene and to the viewer `models` list.
+ *    - Create `ModelImpl` instance with unique model ID add it to the viewer `models` list.
  *    - Synchronize viewer options and overlay.
  *    - Update the viewer.
  *
  *    The loader must emit events:
  *
- *    - `geometryprogress` - during loading. If progress is not supported, emit it once with a value of 100%
- *         after the load is complete.
+ *    - `geometryprogress` - during loading (or once at 100% when complete).
  *    - `databasechunk` - when scene is loaded and ready to render.
  * 5. Override {@link ILoader.dispose} and release loader resources, if required.
- * 6. Register loader provider in the loaders registry by calling the {@link loaders.registerLoader}.
+ * 6. Use `this.abortController` (defined in `Loader` class) to abort loading raw data.
+ * 7. Register loader provider in the loaders registry by calling the {@link loaders.registerLoader}.
  *
  * @example Implementing a custom loader.
  *
  * ```javascript
- * import { loaders, Loader, ModelImpl, Viewer } from "@inweb/viewer-three";
+ * import { Scene } from "three";
+ * import { Loader, loaders, ModelImpl, Viewer } from "@inweb/viewer-three";
  *
  * class MyLoader extends Loader {
  *   public viewer: Viewer;
@@ -39,18 +40,19 @@ import { ILoadersRegistry } from "@inweb/viewer-core";
  *   }
  *
  *   override isSupport(file, format): Boolean {
- *     // place custom logic here
- *     return ...;
+ *     // check if this loader supports the file source and format
+ *     return type file === "string" && format === "myformat";
  *   }
  *
- *   override load(file, format, params): Promise<this> {
+ *   override load(file, format, params = {}): Promise<this> {
+ *      // load raw data from file (custom loading logic)
+ *     const data = await fetch(file).then((result) => result.arrayBuffer());
  *
- *     // place custom loading logic here
- *     const scene = ...;
+ *     // convert raw data to the Three.js scene (custom parsing logic)
+ *     const scene = this.parse(data);
  *
  *     const modelImpl = new ModelImpl(scene);
- *     modelImpl.loader = this;
- *     modelImpl.viewer = this.viewer;
+ *     modelImpl.id = params.modelId;
  *
  *     this.viewer.scene.add(scene);
  *     this.viewer.models.push(modelImpl);
@@ -59,11 +61,17 @@ import { ILoadersRegistry } from "@inweb/viewer-core";
  *     this.viewer.syncOverlay();
  *     this.viewer.update();
  *
+ *     this.viewer.emitEvent({ type: "geometryprogress", data: 1, file });
  *     this.viewer.emitEvent({ type: "databasechunk", data: scene, file });
  *
  *     return Promise.resove(this);
  *   };
- * }
+ *
+ *   private parse(data: ArrayBuffer): Scene {
+ *     // custom parsing logic
+ *     return new Scene();
+ *   }
+ *  }
  *
  * loaders.registerLoader("MyLoader", (viewer) => new MyLoader(viewer));
  * ```

package/lib/Viewer/models/IModelImpl.d.ts

@@ -1,19 +1,17 @@
 import { Box3, Object3D } from "three";
-import { ILoader, IViewer } from "@inweb/viewer-core";
+import { IModel } from "@inweb/viewer-core";
 /**
- * Model interface.
+ * Basic model implementation.
  */
-export interface IModelImpl {
-    handle: string;
+export interface IModelImpl extends IModel {
     scene: Object3D;
-    loader: ILoader;
-    viewer: IViewer;
-    dispose(): void;
     getExtents(target: Box3): Box3;
     getObjects(): Object3D[];
     getVisibleObjects(): Object3D[];
-    hasObject(objects: Object3D): boolean;
+    hasObject(object: Object3D): boolean;
+    hasHandle(handle: string): boolean;
     getOwnObjects(objects: Object3D | Object3D[]): Object3D[];
+    getOwnHandles(handles: string | string[]): string[];
     getObjectsByHandles(handles: string | string[]): Object3D[];
     getHandlesByObjects(objects: Object3D | Object3D[]): string[];
     hideObjects(objects: Object3D | Object3D[]): this;

package/lib/Viewer/models/ModelImpl.d.ts

@@ -1,19 +1,17 @@
 import { Box3, Object3D } from "three";
-import { ILoader } from "@inweb/viewer-core";
 import { IModelImpl } from "./IModelImpl";
-import { Viewer } from "../Viewer";
 export declare class ModelImpl implements IModelImpl {
-    handle: string;
+    id: string;
     scene: Object3D;
-    loader: ILoader;
-    viewer: Viewer;
     constructor(scene: Object3D);
     dispose(): void;
     getExtents(target: Box3): Box3;
     getObjects(): Object3D[];
     getVisibleObjects(): Object3D[];
     hasObject(object: Object3D): boolean;
+    hasHandle(handle: string): boolean;
     getOwnObjects(objects: Object3D | Object3D[]): Object3D[];
+    getOwnHandles(handles: string | string[]): string[];
     getObjectsByHandles(handles: string | string[]): Object3D[];
     getHandlesByObjects(objects: Object3D | Object3D[]): string[];
     hideObjects(objects: Object3D | Object3D[]): this;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@inweb/viewer-three",
-  "version": "26.10.6",
+  "version": "26.11.1",
   "description": "JavaScript library for rendering CAD and BIM files in a browser using Three.js",
   "homepage": "https://cloud.opendesign.com/docs/index.html",
   "license": "SEE LICENSE IN LICENSE",
@@ -35,10 +35,10 @@
     "docs": "typedoc"
   },
   "dependencies": {
-    "@inweb/client": "~26.10.6",
-    "@inweb/eventemitter2": "~26.10.6",
-    "@inweb/markup": "~26.10.6",
-    "@inweb/viewer-core": "~26.10.6"
+    "@inweb/client": "~26.11.1",
+    "@inweb/eventemitter2": "~26.11.1",
+    "@inweb/markup": "~26.11.1",
+    "@inweb/viewer-core": "~26.11.1"
   },
   "devDependencies": {
     "@types/three": "^0.180.0",

package/plugins/components/AxesHelperComponent.ts

@@ -21,17 +21,21 @@
 // acknowledge and accept the above terms.
 ///////////////////////////////////////////////////////////////////////////////
 
-import { AxesHelper, Vector3 } from "three";
+import { AxesHelper, Box3, Vector3 } from "three";
 import { IComponent, components, Viewer } from "@inweb/viewer-three";
 
 class AxesHelperComponent implements IComponent {
   private viewer: Viewer;
   private axesHelper1: AxesHelper;
   private axesHelper2: AxesHelper;
+  private modelHelpers: AxesHelper[];
 
   constructor(viewer: Viewer) {
     this.axesHelper1 = new AxesHelper(1);
     this.axesHelper2 = new AxesHelper(1);
+    this.modelHelpers = [];
+
+    this.axesHelper1.setColors("#ccc", "#ccc", "#cccb");
 
     this.viewer = viewer;
     this.viewer.addEventListener("initialize", this.syncHelper);
@@ -40,6 +44,11 @@ class AxesHelperComponent implements IComponent {
   }
 
   dispose() {
+    this.modelHelpers.forEach((helper) => {
+      helper.removeFromParent();
+      helper.dispose();
+    });
+
     this.axesHelper1.removeFromParent();
     this.axesHelper1.dispose();
 
@@ -52,6 +61,12 @@ class AxesHelperComponent implements IComponent {
   }
 
   syncHelper = () => {
+    this.modelHelpers.forEach((helper) => {
+      helper.removeFromParent();
+      helper.dispose();
+    });
+    this.modelHelpers.length = 0;
+
     this.axesHelper1.removeFromParent();
     this.axesHelper2.removeFromParent();
 
@@ -59,13 +74,27 @@ class AxesHelperComponent implements IComponent {
     const center = this.viewer.extents.getCenter(new Vector3());
 
     this.axesHelper1.position.set(0, 0, 0);
-    this.axesHelper1.scale.setScalar(size);
+    this.axesHelper1.scale.setScalar(size * 1.25);
 
     this.axesHelper2.position.copy(center);
     this.axesHelper2.scale.setScalar(size);
 
     this.viewer.helpers.add(this.axesHelper1);
     this.viewer.helpers.add(this.axesHelper2);
+
+    if (this.viewer.models.length < 2) return;
+
+    this.viewer.models.forEach((model) => {
+      const extents = model.getExtents(new Box3());
+      const size = extents.getSize(new Vector3()).length();
+      const center = extents.getCenter(new Vector3());
+
+      const helper = new AxesHelper(size);
+      helper.position.copy(center);
+
+      this.modelHelpers.push(helper);
+      this.viewer.helpers.add(helper);
+    });
   };
 }
 

package/plugins/components/ExtentsHelperComponent.ts

@@ -27,9 +27,12 @@ import { IComponent, components, Viewer } from "@inweb/viewer-three";
 class ExtentsHelperComponent implements IComponent {
   private viewer: Viewer;
   private boxHelper: Box3Helper;
+  private modelHelpers: Box3Helper[];
 
   constructor(viewer: Viewer) {
     this.boxHelper = new Box3Helper(new Box3(), "#ff0000");
+    this.modelHelpers = [];
+
     this.viewer = viewer;
     this.viewer.on("geometryend", this.syncHelper);
     this.viewer.on("clear", this.syncHelper);
@@ -41,6 +44,11 @@ class ExtentsHelperComponent implements IComponent {
   }
 
   dispose() {
+    this.modelHelpers.forEach((helper) => {
+      helper.removeFromParent();
+      helper.dispose();
+    });
+
     this.boxHelper.removeFromParent();
     this.boxHelper.dispose();
 
@@ -54,12 +62,29 @@ class ExtentsHelperComponent implements IComponent {
   }
 
   syncHelper = () => {
+    this.modelHelpers.forEach((helper) => {
+      helper.removeFromParent();
+      helper.dispose();
+    });
+    this.modelHelpers.length = 0;
+
     this.boxHelper.removeFromParent();
 
     if (this.viewer.extents.isEmpty()) return;
 
     this.boxHelper.box = this.viewer.extents.clone();
     this.viewer.helpers.add(this.boxHelper);
+
+    if (this.viewer.models.length < 2) return;
+
+    this.viewer.models.forEach((model) => {
+      const extents = model.getExtents(new Box3());
+
+      const helper = new Box3Helper(extents, "#ff0000");
+
+      this.modelHelpers.push(helper);
+      this.viewer.helpers.add(helper);
+    });
   };
 }
 

package/plugins/loaders/GLTFCloudLoader.ts

@@ -58,10 +58,9 @@ class GLTFCloudLoader extends Loader {
     if (!this.viewer.scene) return this;
 
     const modelImpl = new ModelImpl(gltf.scene);
-    modelImpl.loader = this;
-    modelImpl.viewer = this.viewer;
+    modelImpl.id = model.file.id;
 
-    this.viewer.scene.add(modelImpl.scene);
+    this.viewer.scene.add(gltf.scene);
     this.viewer.models.push(modelImpl);
 
     this.viewer.syncOptions();

package/{src/Viewer → plugins}/loaders/GLTFFileLoader.ts

@@ -22,20 +22,21 @@
 ///////////////////////////////////////////////////////////////////////////////
 
 import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader.js";
-import { Loader } from "@inweb/viewer-core";
-
-import { Viewer } from "../Viewer";
-import { GLTFLoadingManager, GLTFLoadParams } from "./GLTFLoadingManager";
-import { ModelImpl } from "../models/ModelImpl";
+import { GLTFLoadingManager, GLTFLoadParams, Loader, loaders, ModelImpl, Viewer } from "@inweb/viewer-three";
 
 export class GLTFFileLoader extends Loader {
   public viewer: Viewer;
+  private manager: GLTFLoadingManager;
 
   constructor(viewer: Viewer) {
     super();
     this.viewer = viewer;
   }
 
+  override dispose() {
+    if (this.manager) this.manager.dispose();
+  }
+
   override isSupport(file: any, format?: string): boolean {
     return (
       (typeof file === "string" || file instanceof globalThis.File || file instanceof ArrayBuffer) &&
@@ -43,12 +44,13 @@ export class GLTFFileLoader extends Loader {
     );
   }
 
-  override async load(file: any, format?: string, params?: GLTFLoadParams): Promise<this> {
-    const manager = new GLTFLoadingManager(file, params);
+  override async load(file: any, format?: string, params: GLTFLoadParams = {}): Promise<this> {
+    this.manager = new GLTFLoadingManager(file, params);
 
-    const loader = new GLTFLoader(manager);
-    loader.setPath(manager.path);
+    const loader = new GLTFLoader(this.manager);
+    loader.setPath(this.manager.path);
     loader.setCrossOrigin(params.crossOrigin || loader.crossOrigin);
+    loader.setRequestHeader((params.requestHeader as any) || {});
     loader.setWithCredentials(params.withCredentials || loader.withCredentials);
 
     const progress = (event: ProgressEvent) => {
@@ -57,12 +59,17 @@ export class GLTFFileLoader extends Loader {
       this.viewer.emitEvent({ type: "geometryprogress", data: progress, file });
     };
 
-    const gltf = await loader.loadAsync(manager.fileURL, progress);
+    const gltf = await loader.loadAsync(this.manager.fileURL, progress);
     if (!this.viewer.scene) return this;
 
+    let handle = 0;
+    gltf.scene.traverse((object) => {
+      object.userData = { handle: handle + "", ...object.userData };
+      handle++;
+    });
+
     const modelImpl = new ModelImpl(gltf.scene);
-    modelImpl.loader = this;
-    modelImpl.viewer = this.viewer;
+    modelImpl.id = params.modelId || this.extractFileName(file);
 
     this.viewer.scene.add(gltf.scene);
     this.viewer.models.push(modelImpl);
@@ -76,3 +83,5 @@ export class GLTFFileLoader extends Loader {
     return this;
   }
 }
+
+loaders.registerLoader("gltf-file", (viewer: any) => new GLTFFileLoader(viewer));