diff --git a/src/jlmap3d/lesson3d/lesson3dplayer.js b/src/jlmap3d/lesson3d/lesson3dplayer.js index 5273dd56d..429f83720 100644 --- a/src/jlmap3d/lesson3d/lesson3dplayer.js +++ b/src/jlmap3d/lesson3d/lesson3dplayer.js @@ -14,13 +14,12 @@ import { AssetModelManager } from '@/jlmap3d/lesson3d/manager/assetmodelmanager. import { ControlManager } from '@/jlmap3d/lesson3d/manager/controlmanager.js'; +import { AnimateManager } from '@/jlmap3d/lesson3d/manager/animatemanager.js'; + + // import { AnimationManager } from '@/jlmap3d/lesson3d/manager/assetmodelmanager.js'; -//动画播放相关 -let clock = new THREE.Clock(); -let delta; - let scene; export function Lesson3dPlayer(dom,lessonData,lessonIndex) { @@ -45,21 +44,28 @@ export function Lesson3dPlayer(dom,lessonData,lessonIndex) { light.position.set( 0, 4000, 0 ); scene.add( light ); + let animateManager = new AnimateManager(); + let controlManager = new ControlManager( dom,scene,lessonData,lessonIndex); let assetModelManager = new AssetModelManager(scene,controlManager); assetModelManager.lessonAssetsLoader(lessonData.assetList,lessonData.modelList).then((result) => { - controlManager.initOctree(assetModelManager.loadAsset['default1'].mesh); - animate(); + console.log(lessonData.lessonProgress[lessonIndex]); if(lessonData.lessonProgress[lessonIndex].action.length>0){ - controlManager.initNewEvent(lessonData.lessonProgress[lessonIndex].action,assetModelManager.lessonTriggerList); + controlManager.changeIndexEvent(lessonData.lessonProgress[lessonIndex].action,assetModelManager.lessonTriggerList); } + + animateManager.initAnimation(assetModelManager); + controlManager.init(animateManager.actions); + startLesson(); + animate(); resolve("loadeend"); //['成功了', 'success'] }).catch((error) => { //console.log(error); - });; + }); + @@ -67,7 +73,10 @@ export function Lesson3dPlayer(dom,lessonData,lessonIndex) { assetModelManager.otherModel.remove(actionModel); } - + this.changeIndex = function(nowIndex){ + lessonIndex = nowIndex; + controlManager.changeIndexEvent(lessonData.lessonProgress[lessonIndex].action); + } //循环渲染函数 function animate() { @@ -78,7 +87,7 @@ export function Lesson3dPlayer(dom,lessonData,lessonIndex) { if(controlManager.controlMode == "fps"){ controlManager.updateFpsControl(); } - // delta = clock.getDelta(); + animateManager.updateAnimation(); requestAnimationFrame(animate); } diff --git a/src/jlmap3d/lesson3d/manager/animatemanager.js b/src/jlmap3d/lesson3d/manager/animatemanager.js new file mode 100644 index 000000000..405129832 --- /dev/null +++ b/src/jlmap3d/lesson3d/manager/animatemanager.js @@ -0,0 +1,47 @@ + + +export function AnimateManager() { + + let scope = this; + + this.animateList = []; + + let mixers = []; + this.actions = []; + this.initAnimation = function(assetModelManager){ + + + for(let k in assetModelManager.staticAsset){ + if(assetModelManager.staticAsset[k].mesh.animations.length > 0){ + console.log(assetModelManager.staticAsset[k].mesh.name); + let animations = assetModelManager.staticAsset[k].mesh.animations; + let mixer = new THREE.AnimationMixer( assetModelManager.staticAsset[k].mesh ); + let actionName = assetModelManager.staticAsset[k].mesh.name; + + console.log(actionName); + scope.actions[actionName] = { + status:"01", + action:mixer.clipAction( assetModelManager.staticAsset[k].mesh.animations[ 0 ]) + }; + // scope.actions[actionName].action.play(); + mixers.push(mixer); + } + + } + } + + let clock = new THREE.Clock(); + let mixerUpdateDelta; + this.updateAnimation = function(){ + mixerUpdateDelta = clock.getDelta(); + + + for(let i=mixers.length-1;i>=0;i--){ + if(mixers[i]._actions[0].isRunning()){ + // console.log(scope.mixers[i]._actions[0].isRunning()); + mixers[i].update( mixerUpdateDelta ); + } + } + } + +} diff --git a/src/jlmap3d/lesson3d/manager/assetmodelmanager.js b/src/jlmap3d/lesson3d/manager/assetmodelmanager.js index 81012032f..948c9e5b2 100644 --- a/src/jlmap3d/lesson3d/manager/assetmodelmanager.js +++ b/src/jlmap3d/lesson3d/manager/assetmodelmanager.js @@ -1,4 +1,5 @@ import { BASE_ASSET_API } from '@/api/jlmap3d/assets3d.js'; +import { JL3D_LOCAL_STATIC } from '@/api/jlmap3d/assets3d.js'; export function AssetModelManager(scene) { let scope = this; @@ -12,16 +13,58 @@ export function AssetModelManager(scene) { this.loadAsset = []; - this.loadAsset['default1'] = { - modelId:'default1', + this.staticAsset = []; + scope.staticAsset['station'] = { + modelId:'station', packageName:"车站", - url:"/MODEL/2021-04-06/1381-54584.FBX", + url:JL3D_LOCAL_STATIC+"/lesson3d/station.FBX", mesh:"", - assetType:'default', + assetType:'static', isUse:true, resourceType:"三维课程", }; + scope.staticAsset['FTDH'] = { + modelId:'FTDH', + packageName:"电扶梯", + url:JL3D_LOCAL_STATIC+"/lesson3d/FTDH.FBX", + mesh:"", + assetType:'static', + isUse:true, + resourceType:"三维课程", + }; + + scope.staticAsset['IN'] = { + modelId:'IN', + packageName:"进闸机", + url:JL3D_LOCAL_STATIC+"/lesson3d/IN.FBX", + mesh:"", + assetType:'static', + isUse:true, + resourceType:"三维课程", + }; + + scope.staticAsset['OUT'] = { + modelId:'OUT', + packageName:"出闸机", + url:JL3D_LOCAL_STATIC+"/lesson3d/OUT.FBX", + mesh:"", + assetType:'static', + isUse:true, + resourceType:"三维课程", + }; + + scope.staticAsset['PBMDH'] = { + modelId:'PBMDH', + packageName:"屏蔽门", + url:JL3D_LOCAL_STATIC+"/lesson3d/PBMDH.FBX", + mesh:"", + assetType:'static', + isUse:true, + resourceType:"三维课程", + }; + + //场景中可触发事件模型 this.lessonTriggerList = []; @@ -31,13 +74,20 @@ export function AssetModelManager(scene) { if(assetList){ for(let i = 0;i { + document.addEventListener( 'mousedown', (event) => { fpsMouseStatus = true; // document.body.requestPointerLock(); + + if(raycasterBoxs.length>0){ + var mouse = new THREE.Vector2(); + + var raycaster = new THREE.Raycaster(); + + mouse.x = ( event.clientX / dom.offsetWidth ) * 2 - 1; + + mouse.y = - ( event.clientY / dom.offsetHeight ) * 2 + 1; + + raycaster.setFromCamera(mouse,scope.nowCamera) // 也可以给构造函数传参的形式写 + console.log(raycasterBoxs); + for(let i=0;i0){ + console.log(raycasterBoxs[i]); + if(raycasterBoxs[i].type == "switch"){ + if(raycasterBoxs[i].action.status == "01"){ + raycasterBoxs[i].action.status = "02"; + raycasterBoxs[i].action.action.play(); + }else if(raycasterBoxs[i].action.status == "02"){ + raycasterBoxs[i].action.status = "01"; + raycasterBoxs[i].action.action.stop(); + } + } + if(raycasterBoxs[i].type == "urgeSwitch"){ + if(raycasterBoxs[i].action.status == "02"){ + raycasterBoxs[i].action.status = "01"; + raycasterBoxs[i].action.action.stop(); + } + } + + } + } + } + + + + } ); + + document.body.addEventListener( 'mousemove', ( event ) => { if(fpsMouseStatus == true){ fpsCamera.rotation.y -= event.movementX / 500; @@ -377,27 +449,60 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) { renderer.setSize(dom.offsetWidth,dom.offsetHeight); } - this.initNewEvent = function(actions,lessonTriggerList){ - console.log(actions); - console.log(lessonTriggerList); + this.changeIndexEvent = function(actions,lessonTriggerList){ + if(lessonTriggerList){ + eventTrigger = lessonTriggerList; + scope.eventHitMode = true; + } + nowActions = actions; eventBoxs = []; - for(let i=0;i0){ + for(let i=0;i { - initTriggerList(); - for(let i=0;i { //console.log(error); @@ -131,13 +180,18 @@ export function AssetModelManager(scene) { //FTKG 扶梯开关（钥匙孔） //FTTJ 扶梯台阶 function initTriggerList(){ - scope.loadAsset['default1'].mesh.getObjectByName("FTAN").showType = "default"; - scope.loadAsset['default1'].mesh.getObjectByName("FTAN").label = "扶梯急停按钮"; - scope.lessonTriggerList.push(scope.loadAsset['default1'].mesh.getObjectByName("FTAN")); + scope.staticAsset['station'].mesh.getObjectByName("FTAN").showType = "default"; + scope.staticAsset['station'].mesh.getObjectByName("FTAN").label = "扶梯急停按钮"; + scope.lessonTriggerList.push(scope.staticAsset['station'].mesh.getObjectByName("FTAN")); + + scope.staticAsset['station'].mesh.getObjectByName("FTKG").showType = "default"; + scope.staticAsset['station'].mesh.getObjectByName("FTKG").label = "扶梯钥匙孔"; + scope.lessonTriggerList.push(scope.staticAsset['station'].mesh.getObjectByName("FTKG")); + + scope.staticAsset['station'].mesh.getObjectByName("spbmkg").showType = "default"; + scope.staticAsset['station'].mesh.getObjectByName("spbmkg").label = "屏蔽门开关"; + scope.lessonTriggerList.push(scope.staticAsset['station'].mesh.getObjectByName("spbmkg")); - scope.loadAsset['default1'].mesh.getObjectByName("FTKG").showType = "default"; - scope.loadAsset['default1'].mesh.getObjectByName("FTKG").label = "扶梯钥匙孔"; - scope.lessonTriggerList.push(scope.loadAsset['default1'].mesh.getObjectByName("FTKG")); // console.log(scope.loadAsset['default1'].mesh.getObjectByName("FTKG")); @@ -187,16 +241,27 @@ export function AssetModelManager(scene) { function fbxpromise(asset){ return new Promise(function(resolve, reject){ var loader = new THREE.FBXLoader(); - loader.load( BASE_ASSET_API+asset.url, function ( object ) { - - if(asset.assetType == "default"){ + if(asset.assetType == "static"){ + loader.load( asset.url, function ( object ) { + asset.mesh = object; scene.add(object); - }else if(asset.assetType == 'loadModel'){ + resolve(); + } ); + }else{ + loader.load( BASE_ASSET_API+asset.url, function ( object ) { + asset.mesh = object; + if(asset.assetType == "default"){ + + console.log(object); + // scene.add(object); + }else if(asset.assetType == 'loadModel'){ + + } + + resolve(); + } ); + } - } - asset.mesh = object; - resolve(); - } ); }); } diff --git a/src/jlmap3d/lesson3dedit/model/lessondata.js b/src/jlmap3d/lesson3dedit/model/lessondata.js index 96cc06a5b..cd4360f07 100644 --- a/src/jlmap3d/lesson3dedit/model/lessondata.js +++ b/src/jlmap3d/lesson3dedit/model/lessondata.js @@ -27,7 +27,7 @@ export function LessonData() { progressName:"命名", roleName:"", roleUse:true, - + score:0, progressScene:"", nextCode:"", nextNode:"", @@ -77,7 +77,7 @@ export function LessonData() { progressName:loadData[i].progressName, roleName:loadData[i].roleName, roleUse:loadData[i].roleUse, - score:loadData[i].roleUse, + score:loadData[i].score, progressScene:loadData[i].progressScene, nextCode:loadData[i].nextCode, nextNode:loadData[i].nextNode, diff --git a/src/jlmap3d/lesson3dedit/toolsmodel/lessontrigger.js b/src/jlmap3d/lesson3dedit/toolsmodel/lessontrigger.js index 40d9aedf1..df142633e 100644 --- a/src/jlmap3d/lesson3dedit/toolsmodel/lessontrigger.js +++ b/src/jlmap3d/lesson3dedit/toolsmodel/lessontrigger.js @@ -18,6 +18,7 @@ export function LessonTrigger() { type:"placetrigger", picurl:"", }, + ]; diff --git a/src/views/jlmap3d/lesson3dedit/component/property.vue b/src/views/jlmap3d/lesson3dedit/component/property.vue index 0f4c85944..39fec29e0 100644 --- a/src/views/jlmap3d/lesson3dedit/component/property.vue +++ b/src/views/jlmap3d/lesson3dedit/component/property.vue @@ -33,6 +33,11 @@ + + + + + - + @@ -360,8 +365,7 @@ } }, deleteEventItem(deleteAction){ - console.log(this.lessonData.lessonData.lessonProgress[this.lessonEditIndex].action); - console.log(deleteAction); + for(let i=0;i { console.log(data); }).catch(() => { + }); }, addProgress(){ diff --git a/src/views/jlmap3d/lesson3dedit/tools/jobpane.vue b/src/views/jlmap3d/lesson3dedit/tools/jobpane.vue index cb0ee8957..1491e3146 100644 --- a/src/views/jlmap3d/lesson3dedit/tools/jobpane.vue +++ b/src/views/jlmap3d/lesson3dedit/tools/jobpane.vue @@ -75,10 +75,8 @@ }, initJobList(data){ this.jobList = data; - console.log(data); }, selectJob(item){ - console.log(item); this.selectedJob = item; }, @@ -94,7 +92,6 @@ }, selsectJobTool(selectTool,jobList){ lesson3dSelect('toolproperty','jobpane',selectTool,jobList); - console.log(selectTool); }, generateUUID() { var d = new Date().getTime(); diff --git a/src/views/jlmap3d/lesson3dplayer/lesson3dplayer.vue b/src/views/jlmap3d/lesson3dplayer/lesson3dplayer.vue index aa1c5dce7..17f8d6b31 100644 --- a/src/views/jlmap3d/lesson3dplayer/lesson3dplayer.vue +++ b/src/views/jlmap3d/lesson3dplayer/lesson3dplayer.vue @@ -10,6 +10,9 @@ @@ -120,6 +123,7 @@ window.updateTriggerList = this.updateTriggerList; window.jumpEvent = this.jumpEvent; window.actionEvent = this.actionEvent; + window.startLesson = this.startLesson; this.init(this.$route.query.lessonId); }, beforeDestroy() { @@ -145,6 +149,7 @@ this.lessonTools = loadData.lessonTools; this.lessonData.loadLessonProgress(loadData.lessonProgress); + }else{ this.lessonData.initLessonProgress(); this.$refs.jobpane.initJobList(this.jobPaneData.dataList); @@ -155,7 +160,9 @@ }).catch(() => { }); }, - + startLesson(){ + this.$refs.processlog.startLog(); + }, saveLesson3dData(){ this.lessonData.lessonData.lessonTools = this.lessonTools; let saveData = this.lessonData.lessonData; @@ -180,6 +187,8 @@ if(type == "tools"){ this.lessonPlayIndex = action.nextNode; } + + this.jl3d.changeIndex(this.lessonPlayIndex); }, actionEvent(type,action,mesh){ if(type == "remove"){ diff --git a/src/views/jlmap3d/lesson3dplayer/tools/jobpane.vue b/src/views/jlmap3d/lesson3dplayer/tools/jobpane.vue index a06bf00a2..966a6643a 100644 --- a/src/views/jlmap3d/lesson3dplayer/tools/jobpane.vue +++ b/src/views/jlmap3d/lesson3dplayer/tools/jobpane.vue @@ -91,13 +91,10 @@ this.jobList = data; }, selectJob(item){ - console.log(item); this.selectedJob = item; }, selsectJobTool(selectTool){ - console.log(selectTool); - console.log(this.lessonData.lessonData.lessonProgress[this.lessonPlayIndex]); let nowProgress = this.lessonData.lessonData.lessonProgress[this.lessonPlayIndex]; if(selectTool.sceneId == nowProgress.id){ jumpEvent("tools",selectTool); diff --git a/src/views/jlmap3d/lesson3dplayer/tools/processlog.vue b/src/views/jlmap3d/lesson3dplayer/tools/processlog.vue index 149b96933..bd08abd41 100644 --- a/src/views/jlmap3d/lesson3dplayer/tools/processlog.vue +++ b/src/views/jlmap3d/lesson3dplayer/tools/processlog.vue @@ -1,23 +1,29 @@