@inweb/viewer-three
Version:
JavaScript library for rendering CAD and BIM files in a browser using Three.js
91 lines (85 loc) • 4.45 kB
text/typescript
///////////////////////////////////////////////////////////////////////////////
// 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 { IComponentsRegistry, componentsRegistry } from "@inweb/viewer-core";
import { BackgroundComponent } from "./BackgroundComponent";
import { CameraComponent } from "./CameraComponent";
import { ExtentsComponent } from "./ExtentsComponent";
import { LightComponent } from "./LightComponent";
import { InfoComponent } from "./InfoComponent";
import { RenderLoopComponent } from "./RenderLoopComponent";
import { ResizeCanvasComponent } from "./ResizeCanvasComponent";
import { HighlighterComponent } from "./HighlighterComponent";
import { SelectionComponent } from "./SelectionComponent";
import { WCSHelperComponent } from "./WCSHelperComponent";
import { ResetComponent } from "./ResetComponent";
/**
* Viewer components registry. Use this registry to register custom components.
*
* To implement custom component:
*
* 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 `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}.
*
* @example Implementing a custom component.
*
* ```javascript
* import { IComponent, components, Viewer } from "@inweb/viewer-three";
*
* class MyComponent implements IComponent {
* protected viewer: Viewer;
*
* constructor(viewer: Viewer) {
* this.viewer = viewer;
* this.viewer.addEventListener("geometryend", this.onGeometryEnd);
* }
*
* override dispose() {
* this.viewer.removeEventListener("geometryend", this.onGeometryEnd);
* }
*
* onGeometryEnd = (event: MouseEvent) => {
* this.viewer.executeCommand("zoomToExtents");
* };
* }
*
* components.registerComponent("MyComponent", (viewer): IComponent => new MyComponent(viewer));
* ```
*/
export const components: IComponentsRegistry = componentsRegistry("threejs");
// build-in components
components.registerComponent("ExtentsComponent", (viewer) => new ExtentsComponent(viewer));
components.registerComponent("CameraComponent", (viewer) => new CameraComponent(viewer));
components.registerComponent("BackgroundComponent", (viewer) => new BackgroundComponent(viewer));
components.registerComponent("LightComponent", (viewer) => new LightComponent(viewer));
components.registerComponent("InfoComponent", (viewer) => new InfoComponent(viewer));
components.registerComponent("ResizeCanvasComponent", (viewer) => new ResizeCanvasComponent(viewer));
components.registerComponent("RenderLoopComponent", (viewer) => new RenderLoopComponent(viewer));
components.registerComponent("HighlighterComponent", (viewer) => new HighlighterComponent(viewer));
components.registerComponent("SelectionComponent", (viewer) => new SelectionComponent(viewer));
components.registerComponent("WCSHelperComponent", (viewer) => new WCSHelperComponent(viewer));
components.registerComponent("ResetComponent", (viewer) => new ResetComponent(viewer));