@inweb/viewer-three/extensions/components/LightHelperComponent.ts

JavaScript library for rendering CAD and BIM files in a browser using Three.js

///////////////////////////////////////////////////////////////////////////////
// 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 { DirectionalLightHelper, HemisphereLightHelper, PointLightHelper, Sphere } from "three";
import { IComponent, components, Viewer } from "@inweb/viewer-three";

class LightHelperComponent implements IComponent {
  private viewer: Viewer;
  private lightHelpers: (DirectionalLightHelper | HemisphereLightHelper | PointLightHelper)[];

  constructor(viewer: Viewer) {
    this.lightHelpers = [];
    this.viewer = viewer;
    this.viewer.addEventListener("geometryend", this.syncHelper);
    this.viewer.addEventListener("clear", this.syncHelper);
  }

  dispose() {
    this.lightHelpers.forEach((helper) => {
      helper.removeFromParent();
      helper.dispose();
    });
    this.lightHelpers.length = 0;

    this.viewer.removeEventListener("geometryend", this.syncHelper);
    this.viewer.removeEventListener("clear", this.syncHelper);
  }

  syncHelper = () => {
    this.lightHelpers.forEach((helper) => {
      helper.removeFromParent();
      helper.dispose();
    });
    this.lightHelpers.length = 0;

    const extentsSize = this.viewer.extents.getBoundingSphere(new Sphere()).radius * 2;
    const size = extentsSize / 20;

    this.viewer.scene.traverse((object: any) => {
      let helper: DirectionalLightHelper | HemisphereLightHelper | PointLightHelper;

      if (object.isDirectionalLight) helper = new DirectionalLightHelper(object, size, "#aa0000");
      else if (object.isHemisphereLight) helper = new HemisphereLightHelper(object, size, "#ff9800");
      else if (object.isPointLight) helper = new PointLightHelper(object, size, "#ff9800");

      if (helper) {
        this.lightHelpers.push(helper);
        this.viewer.helpers.add(helper);
      }
    });
  };
}

components.registerComponent("LightHelperComponent", (viewer) => new LightHelperComponent(viewer));