import { ComVal } from "../common/ComVal.js"; import { QingXiCheAndQvCarEventClick } from "../js/QingXiCheAndQvCarEventClick.js"; import { QingXiCheAndQvComHighlightLayer } from "../js/QingXiCheAndQvComHighlightLayer.js"; import { ElMessage, ElMessageBox } from 'element-plus'; /** * 操作 3d场景 相关事件 */ export class QingXiCheAndQvThreeWorldEvent { // 每次 new 出对象则会调用这个构造函数 constructor() { // 已经封装好的,编辑器的类对象,内置可以直接调用的代码 this.objIframeEdit = null; // iframe对象 this.objIframe = null; // 3d世界的场景,后续要操作3d世界常用的对象 this.objScene = null; // babylon 对象,懂babylon,就可以使用babylon的api去操作 this.BABYLON = null; // 操作 Cesium 的类 this.objCesiumMain = null; // 当前鼠标是否按住 this.clickPressBool = false; // 记录鼠标最后一次点击的时间戳 this.clickTime = 0; } /** * 初始化方法 * objIframeEdit 已经封装好的,编辑器的类对象,内置可以直接调用的代码 * objIframe iframe对象 * objScene 场景对象 * BABYLON babylon.js对象,用于后续调用babylon的代码去创建更新等操作 * objCesiumMain 操作 Cesium 的类 */ initObj = function (objIframeEdit, objIframe, objScene, BABYLON, objCesiumMain) { if (this.objIframe != null && this.objIframe != undefined) { return this; } this.objIframeEdit = objIframeEdit; this.objIframe = objIframe; this.objScene = objScene; this.BABYLON = BABYLON; this.pointerEvent(); this.renderEvent(); return this; } /** * 鼠标事件 */ pointerEvent = function() { var thisClass = this; var BABYLON = this.BABYLON; var objScene = this.objScene; objScene.onPointerObservable.add( (pointerInfo) => { if ( // 鼠标按住 thisClass.clickPressBool == true ) { // 获取选择的对象, 通过测试 scene.pick() 方法是非常消耗性能的 let pickResultMove = objScene.pick( objScene.pointerX, objScene.pointerY ); if (pickResultMove.hit) { // console.log( // "鼠标按住移动触发逻辑", // "pickResultMove", pickResultMove // ); thisClass.clickMoveEvent(pickResultMove); } } // 如果点击到3d世界里的物体的时候 if (pointerInfo.pickInfo.hit) { var pickResult = pointerInfo.pickInfo; switch (pointerInfo.type) { case BABYLON.PointerEventTypes.POINTERDOWN: // console.log("clickType 鼠标按下"); thisClass.clickEvent(pickResult); break; case BABYLON.PointerEventTypes.POINTERUP: // console.log("clickType 鼠标弹起"); thisClass.clickUpEvent(pickResult); break; case BABYLON.PointerEventTypes.POINTERMOVE: // console.log("clickType 鼠标移动中"); break; case BABYLON.PointerEventTypes.POINTERWHEEL: // console.log("clickType 鼠标滚轮滚动中"); break; case BABYLON.PointerEventTypes.POINTERPICK: // console.log("clickType 鼠标指针选中事件"); break; case BABYLON.PointerEventTypes.POINTERTAP: // console.log("clickType 当对象被触摸并在没有拖动的情况下释放时,触发指针触发事件。"); break; case BABYLON.PointerEventTypes.POINTERDOUBLETAP: // console.log("clickType 鼠标双击"); break; } } } ); } /** * 点击事件 * pickResult 返回的鼠标参数 */ clickEvent = function(pickResult) { var thisClass = this; var BABYLON = this.BABYLON; var objScene = this.objScene; this.clickPressBool = true; this.clickTime = new Date().getTime(); var objMesh = pickResult.pickedMesh; var objPosition = pickResult.pickedPoint; // 获取点击对象的方向【 一定要加上 true,否则载入的获取模型的方向,会有问题 】 // eslint-disable-next-line no-unused-vars var getNormal = pickResult.getNormal(true); // console.log( // "鼠标点击事件", // // pickResult // objMesh, objPosition, getNormal // ); QingXiCheAndQvCarEventClick.find().clickMeshEvent(pickResult); } /** * 鼠标弹起事件 * pickResult 返回的鼠标参数 */ clickUpEvent = function(pickResult) { var thisClass = this; var objScene = this.objScene; var objIframe = this.objIframe; var BABYLON = this.BABYLON; this.clickPressBool = false; var thisTime = new Date().getTime(); // 与点击相差时间 var upTime = thisTime - this.clickTime; var objMesh = pickResult.pickedMesh; var objPosition = pickResult.pickedPoint; // 获取点击对象的方向【 一定要加上 true,否则载入的获取模型的方向,会有问题 】 // eslint-disable-next-line no-unused-vars var getNormal = pickResult.getNormal(true); // console.log( // "鼠标弹起事件", upTime, // // pickResult // objMesh, objPosition, getNormal // ); if (thisClass.experimentMeshBool(pickResult) == true) { ElMessageBox.confirm( '确定进行该操作吗?', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning', } ) .then(() => { // ElMessage({ // type: 'success', // message: 'Delete completed', // }) QingXiCheAndQvCarEventClick.find().main(pickResult); }) .catch(() => { // ElMessage({ // type: 'info', // message: '取消成功', // }) }) } // QingXiCheAndQvCarEventClick.find().main(pickResult); } /** * 判断是否是点击物体的范围内 * pickResult 点击的具体坐标,物体等信息 * */ experimentMeshBool = function(pickResult) { var thisClass = this; var objScene = this.objScene; var objIframe = this.objIframe; var BABYLON = this.BABYLON; // 优先判断当前流程,是否需要进行物体点击判断逻辑的触发 let listIndex = QingXiCheAndQvCarEventClick.find().QingXiCheAndQvProcessEventStore.obj.listIndex; let list = QingXiCheAndQvCarEventClick.find().QingXiCheAndQvProcessEventStore.obj.list; if (list[listIndex] == null || list[listIndex] == undefined) { return false; } // 得到当前流程的配置 let obj = list[listIndex]; // console.log("experimentMeshBool 得到当前的流程", obj); if (typeof obj.correctAnswerMesh != 'object' || obj.correctAnswerMesh == {}) { return false; } // console.log("experimentMeshBool =====>", pickResult, QingXiCheAndQvCarEventClick.find().QingXiCheAndQvProcessEventStore); var objMesh = pickResult.pickedMesh; if (typeof objMesh.id != 'string') { return false; } let meshId = objMesh.id; for (let i = 0; i < QingXiCheAndQvCarEventClick.find().QingXiCheAndQvProcessEventStore.obj.list.length; i++ ) { let thisList = QingXiCheAndQvCarEventClick.find().QingXiCheAndQvProcessEventStore.obj.list[i]; // console.log("experimentMeshBool thisList =====>", thisList); if (typeof thisList.correctAnswerMesh == 'object' ) { for (let key in thisList.correctAnswerMesh) { let json = thisList.correctAnswerMesh[key]; // console.log("experimentMeshBool key =====>", key, json, meshId); if (meshId == key) { return true; } } } } return false; } /** * 鼠标按住并且拖拽事件 * pickResult 返回的鼠标参数 */ clickMoveEvent = function(pickResult) { // 不存在要拖拽移动的物体,则不触发后面逻辑,要不然一直触后面逻辑,会影响性能 if (QingXiCheAndQvCarEventClick.find().moveMeshList.length <= 0) { return; } var thisClass = this; var objScene = this.objScene; var objIframe = this.objIframe; var BABYLON = this.BABYLON; var objMesh = pickResult.pickedMesh; var objPosition = pickResult.pickedPoint; // 获取点击对象的方向【 一定要加上 true,否则载入的获取模型的方向,会有问题 】 // eslint-disable-next-line no-unused-vars var getNormal = pickResult.getNormal(true); // console.log( // "鼠标按住拖拽事件", // // pickResult // objMesh, objPosition, getNormal // ); QingXiCheAndQvCarEventClick.find().clickMoveMeshEvent(pickResult); } /** * 帧事件 */ renderEvent = function() { var thisClass = this; var objScene = this.objScene; var objIframe = this.objIframe; var BABYLON = this.BABYLON; // 添加帧事件 objScene.onBeforeRenderObservable.add(function() { // console.log("帧事件触发"); ComVal.find().fpsEventMain(); QingXiCheAndQvComHighlightLayer.find().flickerBoolEvent(); QingXiCheAndQvCarEventClick.find().renderEvent(); if ( QingXiCheAndQvCarEventClick.find().moveCameraRadius != null && QingXiCheAndQvCarEventClick.find().moveCameraRadius != undefined && QingXiCheAndQvCarEventClick.find().moveCameraAlpha != null && QingXiCheAndQvCarEventClick.find().moveCameraAlpha != undefined && QingXiCheAndQvCarEventClick.find().moveCameraBeta != null && QingXiCheAndQvCarEventClick.find().moveCameraBeta != undefined ) { let ChengGuangYuanJing = objIframe.ChengGuangYuanJing; let objSceneActiveCamera = ChengGuangYuanJing.CommonVal.find().objSceneActiveCamera; objSceneActiveCamera.radius = QingXiCheAndQvCarEventClick.find().moveCameraRadius; objSceneActiveCamera.alpha = QingXiCheAndQvCarEventClick.find().moveCameraAlpha; objSceneActiveCamera.beta = QingXiCheAndQvCarEventClick.find().moveCameraBeta; } }); } }