import * as THREE from 'three'; import UseThree from '../../../../utils/threejs/useThree'; import { getDictItemsByCode } from '/@/utils/dict'; import { animateCamera } from '/@/utils/threejs/util'; import useEvent from '../../../../utils/threejs/useEvent'; // 模型对象、 文字对象 let model, fireDoor, //液压风门 fireDoorF, //保德风门 fireDoorSsl, // 思山岭防火门 fireDoorRed, // 防火门 group: THREE.Object3D, fhmType = ''; const { mouseDownFn } = useEvent(); // 初始化左右摇摆动画 const startAnimation = () => { // 定义鼠标点击事件 model.canvasContainer?.addEventListener('mousedown', mouseEvent.bind(null)); model.canvasContainer?.addEventListener('pointerup', (event) => { event.stopPropagation(); // 单道、 双道 if (fhmType === 'fireDoor') { fireDoor?.mouseUpModel.call(fireDoor); } if (fhmType === 'fireDoorF') { fireDoorF?.mouseUpModel.call(fireDoorF); } if (fhmType === 'fireDoorSsl') { fireDoorSsl?.mouseUpModel.call(fireDoorSsl); } if (fhmType === 'fireDoorRed') { fireDoorRed?.mouseUpModel.call(fireDoorRed); } }); }; // 鼠标点击、松开事件 const mouseEvent = (event) => { if (event.button == 0) { mouseDownFn(model, group, event, (intersects) => { if (fhmType === 'fireDoor' && fireDoor) { fireDoor?.mousedownModel.call(fireDoor, intersects); } if (fhmType === 'fireDoorF' && fireDoorF) { fireDoorF?.mousedownModel.call(fireDoorF, intersects); } if (fhmType === 'fireDoorSsl' && fireDoorSsl) { fireDoorSsl?.mousedownModel.call(fireDoorSsl, intersects); } if (fhmType === 'fireDoorRed' && fireDoorRed) { fireDoorRed?.mousedownModel.call(fireDoorRed, intersects); } }); // console.log('摄像头控制信息', model.orbitControls, model.camera); } }; export const play = (handlerState, flag?) => { if (fhmType === 'fireDoor' && fireDoor) { return fireDoor.play.call(fireDoor, handlerState, flag); } if (fhmType === 'fireDoorF' && fireDoorF) { return fireDoorF.play.call(fireDoorF, handlerState, flag); } if (fhmType === 'fireDoorSsl' && fireDoorSsl) { return fireDoorSsl.play.call(fireDoorSsl, handlerState, flag); } if (fhmType === 'fireDoorRed' && fireDoorRed) { return fireDoorRed.play.call(fireDoorRed, handlerState, flag); } }; // 切换风门类型 export const setModelType = (type) => { fhmType = type; const fhmConfigurations = { fireDoor: { render: fireDoor ? () => fireDoor.render() : null, group: fireDoor ? fireDoor.group : null, newP: { x: -654.2006991449887, y: 103.16181473511944, z: -30.348656073478562 }, newT: { x: -7.380506513422206, y: 56.36967052459397, z: -29.230675020846963 }, }, fireDoorF: { render: fireDoorF ? () => fireDoorF.render() : null, group: fireDoorF ? fireDoorF.group : null, newP: { x: -655.0169729333649, y: 47.24181078408825, z: -9.781926649842067 }, newT: { x: -7.380506513422206, y: 47.24181078408821, z: -37.9244016972381 }, }, fireDoorSsl: { render: fireDoorSsl ? () => fireDoorSsl.render() : null, group: fireDoorSsl ? fireDoorSsl.group : null, newP: { x: 342.74781900192056, y: 183.50210411099545, z: 451.0806333923029 }, newT: { x: 72.33938301176254, y: -35.03891296652319, z: -37.91742549963208 }, }, fireDoorRed: { render: fireDoorRed ? () => fireDoorRed.render() : null, group: fireDoorRed ? fireDoorRed.group : null, newP: { x: 66.257, y: 57.539, z: 94.313 }, newT: { x: -2.28, y: -0.91, z: -5.68 }, }, }; const config = fhmConfigurations[fhmType]; const oldCameraPosition = { x: -1000, y: 100, z: 500 }; return new Promise((resolve) => { // 暂停风门1动画 // if (fhmType === '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 (fhmType === '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); // } else if (fhmType === 'fireDoorSsl' && fireDoorSsl && fireDoorSsl.group) { // // if (fireDoorSsl.clipActionArr.door) { // // fireDoorSsl.clipActionArr.door.reset(); // // fireDoorSsl.clipActionArr.door.time = 0; // // fireDoorSsl.clipActionArr.door.stop(); // // } // // model.scene.remove(group); // // model.startAnimation = fireDoorSsl.render.bind(fireDoorSsl); // group = fireDoorSsl.group; // group.rotation.y = 0; // const oldCameraPosition = { x: -1000, y: 100, z: 500 }; // setTimeout(async () => { // resolve(null); // model.scene.add(fireDoorSsl.group); // await animateCamera( // oldCameraPosition, // { x: 0, y: 0, z: 0 }, // { // x: 342.74781900192056, // y: 183.50210411099545, // z: 451.0806333923029, // }, // { // x: 72.33938301176254, // y: -35.03891296652319, // z: -37.91742549963208, // }, // model, // 0.8 // ); // }, 300); // } if (config && config.group) { model.startAnimation = config.render; group = config.group; setTimeout(async () => { await animateCamera(oldCameraPosition, { x: 0, y: 0, z: 0 }, config.newP, config.newT, model); model.scene?.add(config.group); resolve(null); }, 1000); } else { resolve(null); throw new Error(`Unsupported fhmType: ${fhmType}`); } }); }; export const initCameraCanvas = async (playerVal1) => { if (fhmType === 'fireDoor' && fireDoor) { return await fireDoor.initCamera.call(fireDoor, playerVal1); } else if (fhmType === 'fireDoorF' && fireDoorF) { return await fireDoorF.initCamera.call(fireDoorF, playerVal1); } else if (fhmType === 'fireDoorSsl' && fireDoorSsl) { return await fireDoorSsl.initCamera.call(fireDoorSsl, playerVal1); } else if (fhmType === 'fireDoorRed' && fireDoorRed) { return await fireDoorRed.initCamera.call(fireDoorRed, 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; } }; const loadModel = (code): Promise => { if (code === 'fireDoor') return import('./fireDoor.threejs.fire').then((r) => r.default); if (code === 'fireDoorF') return import('./fireDoor.threejs.fireF').then((r) => r.default); if (code === 'fireDoorSsl') return import('./fireDoor.threejs.ssl').then((r) => r.default); if (code === 'fireDoorRed') return import('./fireDoor.threejs.fire.redGate').then((r) => r.default); return import('./fireDoor.threejs.fire.redGate').then((r) => r.default); }; export const mountedThree = () => { return new Promise(async (resolve) => { model = new UseThree('#damper3D', '', '#deviceDetail'); model.setEnvMap('test1.hdr'); model.renderer.toneMappingExposure = 1.0; model.camera.position.set(100, 0, 1000); const dictCodes = getDictItemsByCode('fireDoorStyle'); if (dictCodes && dictCodes.length > 0) { for (let i = 0; i < dictCodes.length; i++) { const dict = dictCodes[i]; switch (dict.value) { case 'fireDoor': const FireDoor = await loadModel('fireDoor'); fireDoor = new FireDoor(model); fireDoor.mountedThree(); break; case 'fireDoorF': const FireDoorF = await loadModel('fireDoorF'); fireDoorF = new FireDoorF(model); fireDoorF.mountedThree(); break; case 'fireDoorSsl': const FireDoorSsl = await loadModel('fireDoorSsl'); fireDoorSsl = new FireDoorSsl(model); fireDoorSsl.mountedThree(); break; case 'fireDoorRed': const FireDoorRed = await loadModel('fireDoorRed'); fireDoorRed = new FireDoorRed(model); fireDoorRed.mountedThree(); break; } } resolve(null); } else { const FireDoorRed = await loadModel(''); fireDoorRed = new FireDoorRed(model); fireDoorRed.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; if (fireDoorF) fireDoorF.destroy(); fireDoorF = null; if (fireDoorSsl) fireDoorSsl.destroy(); fireDoorSsl = null; if (fireDoorRed) fireDoorRed.destroy(); fireDoorRed = null; // @ts-ignore-next-line group = null; model.mixers = []; model.destroy(); } model = null; };