gas-injection/src/views/vent/monitorManager/fireDoorMonitor/fireDoor.threejs.ts

import * as THREE from 'three';
import UseThree from '../../../../utils/threejs/useThree';
import FireDoor from './fireDoor.threejs.fire';
import FireDoorF from './fireDoor.threejs.fireF';
import { animateCamera } from '/@/utils/threejs/util';
import useEvent from '../../../../utils/threejs/useEvent';
import { useGlobSetting } from '/@/hooks/setting';

// 模型对象、 文字对象
let model,
  fireDoor, //液压风门
  fireDoorF, //液压风门
  group: THREE.Object3D,
  fmType = '';

const { mouseDownFn } = useEvent();

// 初始化左右摇摆动画
const startAnimation = () => {
  // 定义鼠标点击事件
  model.canvasContainer?.addEventListener('mousedown', mouseEvent.bind(null));
  model.canvasContainer?.addEventListener('pointerup', (event) => {
    event.stopPropagation();
    // 单道、 双道
    if (fmType === 'fireDoor') {
      fireDoor?.mouseUpModel.call(fireDoor);
    }
    if (fmType === 'fireDoorF') {
      fireDoorF?.mouseUpModel.call(fireDoorF);
    }
  });
};

// 鼠标点击、松开事件
const mouseEvent = (event) => {
  if (event.button == 0) {
    mouseDownFn(model, group, event, (intersects) => {
      if (fmType === 'fireDoor' && fireDoor) {
        fireDoor?.mousedownModel.call(fireDoor, intersects);
      }
      if (fmType === 'fireDoorF' && fireDoorF) {
        fireDoorF?.mousedownModel.call(fireDoorF, intersects);
      }
    });
    // console.log('摄像头控制信息', model.orbitControls, model.camera);
  }
};

export const play = (handlerState, flag?) => {
  debugger;
  if (fmType === 'fireDoor' && fireDoor) {
    return fireDoor.play.call(fireDoor, handlerState, flag);
  }
  if (fmType === 'fireDoorF' && fireDoorF) {
    return fireDoorF.play.call(fireDoorF, handlerState, flag);
  }
};

// 切换风门类型
export const setModelType = (type) => {
  fmType = type;
  return new Promise((resolve) => {
    // 暂停风门1动画
    if (fmType === 'fireDoor' && fireDoor && fireDoor.group) {
      if (fireDoor.clipActionArr.door) {
        fireDoor.clipActionArr.door.reset();
        fireDoor.clipActionArr.door.time = 0.5;
        fireDoor.clipActionArr.door.stop();
      }

      if (fireDoor.damperOpenMesh) fireDoor.damperOpenMesh.visible = false;
      if (fireDoor.damperClosedMesh) fireDoor.damperClosedMesh.visible = true;
      model.scene.remove(group);
      model.startAnimation = fireDoor.render.bind(fireDoor);
      group = fireDoor.group;
      group.rotation.y = 0;
      const oldCameraPosition = { x: -1000, y: 100, z: 500 };
      setTimeout(async () => {
        resolve(null);
        model.scene.add(fireDoor.group);
        await animateCamera(
          oldCameraPosition,
          { x: 0, y: 0, z: 0 },
          { x: -654.2006991449887, y: 103.16181473511944, z: -30.348656073478562 },
          { x: -7.380506513422206, y: 56.36967052459397, z: -29.230675020846963 },
          model,
          0.8
        );
      }, 300);
    } else if (fmType === 'fireDoorF' && fireDoorF && fireDoorF.group) {
      if (fireDoorF.clipActionArr.door) {
        fireDoorF.clipActionArr.door.reset();
        fireDoorF.clipActionArr.door.time = 0;
        fireDoorF.clipActionArr.door.stop();
      }
      model.scene.remove(group);
      model.startAnimation = fireDoorF.render.bind(fireDoorF);
      group = fireDoorF.group;
      group.rotation.y = 0;
      const oldCameraPosition = { x: -1000, y: 100, z: 500 };
      setTimeout(async () => {
        resolve(null);
        model.scene.add(fireDoorF.group);
        await animateCamera(
          oldCameraPosition,
          { x: 0, y: 0, z: 0 },
          { x: -655.0169729333649, y: 47.24181078408825, z: -9.781926649842067 },
          { x: -7.380506513422206, y: 47.24181078408821, z: -37.9244016972381 },
          model,
          0.8
        );
      }, 300);
    }
  });
};

export const initCameraCanvas = async (playerVal1) => {
  if (fmType === 'fireDoor' && fireDoor) {
    return await fireDoor.initCamera.call(fireDoor, playerVal1);
  } else if (fmType === 'fireDoorF' && fireDoorF) {
    return await fireDoorF.initCamera.call(fireDoorF, playerVal1);
  }
};
const setControls = () => {
  if (model && model.orbitControls) {
    model.orbitControls.maxPolarAngle = Math.PI / 2;
    model.orbitControls.minPolarAngle = Math.PI / 3;
    model.orbitControls.minDistance = 600;
    model.orbitControls.maxDistance = 900;
  }
};

export const mountedThree = () => {
  // const { sysOrgCode } = useGlobSetting();
  return new Promise(async (resolve) => {
    model = new UseThree('#damper3D', '', '#deviceDetail');
    model.setEnvMap('test1');
    model.renderer.toneMappingExposure = 1.0;
    model.camera.position.set(100, 0, 1000);
    fireDoor = new FireDoor(model);
    fireDoor.mountedThree();

    fireDoorF = new FireDoorF(model);
    fireDoorF.mountedThree();
    resolve(null);
    setControls();
    model.animate();
    startAnimation();
  });
};

export const destroy = () => {
  if (model) {
    model.orbitControls.maxPolarAngle = Math.PI;
    model.orbitControls.minPolarAngle = 0;
    model.orbitControls.enableRotate = true;
    model.orbitControls.minDistance = 0;
    model.orbitControls.maxDistance = Infinity;
    model.orbitControls.update();
    model.isRender = false;
    if (fireDoor) fireDoor.destroy();
    fireDoor = null;
    group = null;
    model.mixers = [];
    model.destroy();
  }
  model = null;
};