@inweb/viewer-three/src/Viewer/draggers/WalkDragger.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 { Mesh, Vector3 } from "three";
import { type IDragger } from "@inweb/viewer-core";

import type { Viewer } from "../Viewer";
import { WalkControls } from "../controls/WalkControls";
import { JoyStickControls } from "../controls/JoyStickControls";

export class WalkDragger implements IDragger {
  protected viewer: Viewer;
  public controls: WalkControls;
  private joyStickControls: JoyStickControls;

  constructor(viewer: Viewer) {
    const meshOnlyGround: Mesh[] = [];
    viewer.models.forEach((model) =>
      model.getVisibleObjects().forEach((obj) => {
        if (obj instanceof Mesh) {
          meshOnlyGround.push(obj);
        }
      })
    );
    this.controls = new WalkControls(viewer.camera, viewer.canvas, meshOnlyGround);
    this.controls.addEventListener("change", this.controlsChange);
    this.controls.addEventListener("walkspeedchange", this.walkspeedChange);

    this.joyStickControls = new JoyStickControls(viewer.camera, viewer.canvas, viewer.canvas, meshOnlyGround);
    this.joyStickControls.addEventListener("change", this.controlsChange);

    this.viewer = viewer;
    this.viewer.addEventListener("animate", this.animate);
    this.viewer.addEventListener("render", this.viewerRender);
    this.viewer.addEventListener("zoom", this.viewerZoom);
    this.viewer.addEventListener("changecameramode", this.updateControlsCamera);

    this.updateControls();
  }

  dispose() {
    this.viewer.removeEventListener("animate", this.animate);
    this.viewer.removeEventListener("render", this.viewerRender);
    this.viewer.removeEventListener("zoom", this.viewerZoom);
    this.viewer.removeEventListener("changecameramode", this.updateControlsCamera);

    this.controls.removeEventListener("walkspeedchange", this.walkspeedChange);
    this.controls.removeEventListener("change", this.controlsChange);
    this.controls.dispose();

    this.joyStickControls.removeEventListener("change", this.controlsChange);
    this.joyStickControls.dispose();
  }

  updateControls = () => {
    const size = this.viewer.extents.getSize(new Vector3());
    this.controls.movementSpeed = Math.min(size.x, size.y, size.z) / 2;
    this.joyStickControls.movementSpeed = this.controls.movementSpeed;
    this.joyStickControls.multiplier = this.controls.multiplier;
  };

  updateControlsCamera = () => {
    this.controls.object = this.viewer.camera;
  };

  controlsChange = () => {
    this.viewer.update();
    this.viewer.emitEvent({ type: "changecamera" });
  };

  walkspeedChange = (event: any) => {
    this.viewer.emitEvent(event);
    this.joyStickControls.multiplier = this.controls.multiplier;
  };

  viewerRender = () => {
    this.joyStickControls.update();
  };

  viewerZoom = () => {
    this.controls.rotateDelta.set(0, 0);
  };

  animate = () => {
    this.controls.update();
  };
}