修改三维课程编辑器,增加动画事件逻辑

This commit is contained in:
sunzhenyu 2021-10-15 18:10:46 +08:00
parent d23143a1cb
commit 3660628203
13 changed files with 179 additions and 70 deletions

View File

@ -63,7 +63,7 @@ export function Lesson3dPlayer(dom,lessonData,lessonIndex) {
scope.nowSceneType = lessonData.lessonProgress[0].progressScene;
animateManager.initAnimation(assetModelManager);
console.log(lessonData.trainDeviceData);
controlManager.init(animateManager.actions,assetModelManager,lessonData.trainDeviceData);
startLesson();
@ -76,8 +76,7 @@ export function Lesson3dPlayer(dom,lessonData,lessonIndex) {
this.actionModelControl = function(actionType,actionModel){
// console.log(actionType);
// console.log(actionModel);
if(actionType == "remove"){
assetModelManager.otherModel.remove(actionModel);
}else if(actionType == "show"){
@ -88,7 +87,6 @@ export function Lesson3dPlayer(dom,lessonData,lessonIndex) {
assetModelManager.otherModel.add(actionModel);
}
}
this.actionRemove = function(actionModel){

View File

@ -13,16 +13,46 @@ export function AnimateManager() {
for(let k in assetModelManager.staticAsset){
if(assetModelManager.staticAsset[k].mesh.animations.length > 0){
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(assetModelManager.staticAsset[k]);
if(assetModelManager.staticAsset[k].modelId == "PBMDH"){
scope.actions[actionName] = {
status:"01",
action:mixer.clipAction( assetModelManager.staticAsset[k].mesh.animations[ 0 ])
};
// scope.actions[actionName].action.play();
mixers.push(mixer);
// console.log(assetModelManager.staticAsset[k].mesh);
let animations = assetModelManager.staticAsset[k].mesh.animations[0];
for(let i=0;i <assetModelManager.staticAsset[k].mesh.children.length;i++){
if(assetModelManager.staticAsset[k].mesh.children[i].type == "Group"){
assetModelManager.staticAsset[k].mesh.children[i].animations = [];
//
// console.log(assetModelManager.staticAsset[k].mesh.children[i]);
assetModelManager.staticAsset[k].mesh.children[i].animations.push(animations.clone());
let mixer = new THREE.AnimationMixer( assetModelManager.staticAsset[k].mesh.children[i] );
let actionName = assetModelManager.staticAsset[k].mesh.children[i].name;
scope.actions[actionName] = {
status:"01",
action:mixer.clipAction( assetModelManager.staticAsset[k].mesh.children[i].animations[ 0 ])
};
scope.actions[actionName].action.setLoop(THREE.LoopOnce);
scope.actions[actionName].action.clampWhenFinished = true;
mixers.push(mixer);
}
}
}else{
let animations = assetModelManager.staticAsset[k].mesh.animations;
let mixer = new THREE.AnimationMixer( assetModelManager.staticAsset[k].mesh );
let actionName = assetModelManager.staticAsset[k].mesh.name;
scope.actions[actionName] = {
status:"01",
action:mixer.clipAction( assetModelManager.staticAsset[k].mesh.animations[ 0 ])
};
// scope.actions[actionName].action.play();
mixers.push(mixer);
}
}
}

View File

@ -225,6 +225,16 @@ export function AssetModelManager(editor,scene) {
scope.lessonTriggerList["standstation"].push(scope.staticAsset['station'].mesh.getObjectByName("DMH"));
scope.staticAsset['station'].mesh.getObjectByName("DMH").rotation.z = Math.PI/2;
for(let i=0;i <scope.staticAsset['PBMDH'].mesh.children.length;i++){
if(scope.staticAsset['PBMDH'].mesh.children[i].type == "Group"){
let meshname = scope.staticAsset['PBMDH'].mesh.children[i].name;
scope.staticAsset['PBMDH'].mesh.children[i].showType = "default";
scope.staticAsset['PBMDH'].mesh.children[i].label = meshname;
scope.lessonTriggerList["standstation"].push(scope.staticAsset['PBMDH'].mesh.getObjectByName(meshname));
}
}
}
//动态加载资源

View File

@ -24,8 +24,8 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
let raycasterBoxs = [];
let actionList = [];
let eventTrigger;
let nowActions;
let nowActions = [];
let allOverAction;
let trainDeviceMode = false;
let trainDeviceList = [];
@ -269,9 +269,9 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
document.addEventListener( 'mousedown', (event) => {
fpsMouseStatus = true;
// document.body.requestPointerLock();
console.log("mousedown-----------------------");
console.log(raycasterBoxs);
console.log(roleMode);
// console.log("mousedown-----------------------");
// console.log(raycasterBoxs);
// console.log(roleMode);
if(raycasterBoxs.length>0 && roleMode){
var mouse = new THREE.Vector2();
@ -289,21 +289,34 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
if(intersects.length>0){
if(raycasterBoxs[i].type == "switch"){
// console.log(raycasterBoxs[i]);
// console.log(raycasterBoxs[i].actionMode);
if(raycasterBoxs[i].actionMode == "jump"){
actionEvent("remove",raycasterBoxs[i],raycasterBoxs[i].mesh);
jumpEvent("action",raycasterBoxs[i]);
}else{
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();
}else if(raycasterBoxs[i].actionMode == "play"){
if(raycasterBoxs[i].animateModel != "播放动画的模型"){
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();
}
}else{
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();
}
}
raycasterBoxs[i].actionStatus = "1";
actionEvent("remove",raycasterBoxs[i],raycasterBoxs[i].mesh);
}
}else if(raycasterBoxs[i].type == "urgeSwitch"){
console.log(raycasterBoxs[i]);
if(raycasterBoxs[i].action.status == "02"){
raycasterBoxs[i].action.status = "01";
raycasterBoxs[i].action.action.stop();
@ -314,26 +327,41 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
}
}
if(trainDeviceMode == true){
var mouse = new THREE.Vector2();
// if(trainDeviceMode == true){
// 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);
//
// var intersects = raycaster.intersectObject( modelManager.otherModel.children[1],true);
// if(intersects.length>0){
//
// jl3dZzwwTrainTestUpdate(intersects[0].object.name);
//
// }
//
// }
var raycaster = new THREE.Raycaster();
if(raycasterBoxs.length>0){
let isOverEvent = false;
let overEvent = "";
for(let i=0;i<raycasterBoxs.length;i++){
mouse.x = ( event.clientX / dom.offsetWidth ) * 2 - 1;
mouse.y = - ( event.clientY / dom.offsetHeight ) * 2 + 1;
raycaster.setFromCamera(mouse,scope.nowCamera);
var intersects = raycaster.intersectObject( modelManager.otherModel.children[1],true);
if(intersects.length>0){
jl3dZzwwTrainTestUpdate(intersects[0].object.name);
if(raycasterBoxs[i].actionStatus == "0"){
isOverEvent = true;
}
}
if(isOverEvent == false){
jumpEvent("action",allOverAction);
}
}
//
} );
@ -587,6 +615,16 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
eventTrigger = lessonTriggerList;
nowActions = actions;
let isOverAction = false;
for(let i=0;i<nowActions.length;i++){
if(nowActions[i].actionMode == "allover"){
allOverAction = nowActions[i];
isOverAction = true;
}
}
if(isOverAction == false){
allOverAction = null;
}
// let newEventBoxs = [];
// eventBoxs = newEventBoxs;
raycasterBoxs = [];
@ -597,14 +635,12 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
// console.log(eventTrigger);
// console.log("----------------------------");
console.log(roleMode);
if(actions.length>0 ){
scope.eventHitMode = true;
for(let i=0;i<actions.length;i++){
if(actions[i].actionType == "auto"){
console.log(actions[i]);
if(actions[i].actionMode == "play"){
for(let j=0;j<eventTrigger.length;j++){
if(eventTrigger[j].label == actions[i].actionModel){
@ -676,7 +712,13 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
type:actions[i].actionType,
actionMode:actions[i].actionMode,
jumpNode:actions[i].jumpNode,
animateModel:actions[i].animateModel,
actionStatus:actions[i].actionStatus,
};
if(actions[i].animateModel != "播放动画的模型"){
eventRaycaster.action = actionList[actions[i].animateModel];
}
raycasterBoxs.push(eventRaycaster);
actionEvent("changeIndex",actions[i],eventTrigger[j]);

View File

@ -283,6 +283,11 @@ export function AssetModelManager(editor,scene) {
scope.lessonTriggerList["standstation"].push(scope.staticAsset['station'].mesh.getObjectByName("spbmkg"));
scope.staticAsset['station'].mesh.getObjectByName("spbmkg").showType = "default";
scope.staticAsset['station'].mesh.getObjectByName("spbmkg").label = "屏蔽门开关";
scope.lessonTriggerList["standstation"].push(scope.staticAsset['station'].mesh.getObjectByName("spbmkg"));
// console.log(scope.loadAsset['default1'].mesh.getObjectByName("FTKG"));
}

View File

@ -282,11 +282,21 @@ export function AssetModelManager(editor,scene) {
scope.staticAsset['station'].mesh.getObjectByName("spbmkg").label = "屏蔽门开关";
scope.lessonTriggerList["standstation"].push(scope.staticAsset['station'].mesh.getObjectByName("spbmkg"));
// console.log(DMH);
scope.staticAsset['station'].mesh.getObjectByName("DMH").showType = "default";
scope.staticAsset['station'].mesh.getObjectByName("DMH").label = "隔离门";
scope.lessonTriggerList["standstation"].push(scope.staticAsset['station'].mesh.getObjectByName("DMH"));
scope.staticAsset['station'].mesh.getObjectByName("DMH").rotation.z = Math.PI/2;
for(let i=0;i <scope.staticAsset['PBMDH'].mesh.children.length;i++){
if(scope.staticAsset['PBMDH'].mesh.children[i].type == "Group"){
let meshname = scope.staticAsset['PBMDH'].mesh.children[i].name;
scope.staticAsset['PBMDH'].mesh.children[i].showType = "default";
scope.staticAsset['PBMDH'].mesh.children[i].label = meshname;
scope.lessonTriggerList["standstation"].push(scope.staticAsset['PBMDH'].mesh.getObjectByName(meshname));
}
}
// console.log(scope.loadAsset['default1'].mesh.getObjectByName("FTKG"));
}

View File

@ -77,7 +77,6 @@ export function LessonData() {
}
this.loadLessonProgress = function(loadData){
console.log(loadData);
for(let i=0;i<loadData.length;i++){
let newLessonProgress = {
id:loadData[i].id,

View File

@ -258,7 +258,7 @@ export function JobPaneData() {
],
},
{
name:"调度",
name:"通号调度",
value:"scdd",
text:"",
picurl:"",

View File

@ -136,14 +136,22 @@
<el-option label="显示模型" value="show"></el-option>
<el-option label="隐藏模型" value="remove"></el-option>
<el-option label="跳转" value="jump"></el-option>
<el-option label="所有事件完成跳转" value="allover"></el-option>
</el-select>
</el-form-item>
<el-form-item label="播放动画的模型:" v-if="selectedAction.actionMode == 'play'">
<el-select v-model="selectedAction.animateModel" placeholder="选择播放动画的模型">
<el-option
v-for="(item,index) in triggerList"
:label="item.label"
:value="item.label"
:key="item.label">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="跳转节点:" v-if="selectedAction.actionMode == 'jump'">
<el-form-item label="跳转节点:" v-if="selectedAction.actionMode == 'jump'|| selectedAction.actionMode == 'allover'">
<el-select v-model="selectedAction.jumpNode" placeholder="当前场景镜头控制模式">
<el-option
v-for="(item,index) in lessonData.lessonData.lessonProgress"
@ -278,6 +286,9 @@
actionModel:"操作的模型",
actionType:"事件操作类型",
actionMode:"触发事件类型",
animateModel:"播放动画的模型",
actionStatus:true,
jumpNode:"无",
},
revisionList:[],
selectType:"",
@ -452,6 +463,8 @@
actionModel:"操作的模型",
actionType:"事件操作类型",
actionMode:"触发事件类型",
animateModel:"播放动画的模型",
actionStatus:true,
jumpNode:"无",
};
this.lessonData.lessonData.lessonProgress[this.lessonEditIndex].action.push(newaction);

View File

@ -58,7 +58,6 @@
:trainDeviceData='trainDeviceData'
:lessonData='lessonData'
:lessonEditIndex='lessonEditIndex'
ref="jobpane"
v-show="lessonTools[5].isShow ">
</TrainTest-Pane>
@ -263,11 +262,18 @@
this.checkedRole = loadData.setup.checkedRole;
this.examMode = loadData.setup.examMode;
this.jobPaneData.dataList = loadData.toolJobPane;
console.log(this.jobPaneData);
this.$refs.jobpane.initJobList(this.jobPaneData.dataList);
this.lessonTools = loadData.lessonTools;
if(this.lessonTools[5].isShow){
if(this.lessonTools[5]){
loadData.trainDeviceData = this.trainDeviceData.deviceList;
}else{
this.lessonTools[5] = {
name:"大铁车检组件",
type:"",
isShow:false,
};
}
this.lessonData.loadLessonProgress(loadData.lessonProgress);
@ -321,7 +327,6 @@
this.lessonData.removeLessonProgress(removeIndex);
},
selectModel(selectedModel){
console.log(selectedModel);
lesson3dSelect('toolproperty','modelproperty',selectedModel);
this.jl3d.attachModel(selectedModel);
},
@ -343,7 +348,6 @@
},
updateTriggerList(newTriggerList){
this.triggerList = newTriggerList;
console.log(this.triggerList);
},
jl3dUpdateAccidentlist(newAccidentlist){
this.accidentlist = newAccidentlist;

View File

@ -83,9 +83,10 @@
this.showJobList = false;
this.selectedJob = null;
}
console.log(this.jobPaneData);
},
initJobList(data){
console.log(data);
this.jobList = data;
},
selectJob(item){
@ -153,7 +154,7 @@
border:solid 2px #000;
overflow-y: auto;
overflow-x: hidden;
background-color: #fff;
// background-color: #fff;
}
.jobdiv{

View File

@ -78,14 +78,6 @@
@changeCameraPos="changeCameraPos">
</Tool-Bar>
<TrainTest-Pane
:trainDeviceData='trainDeviceData'
:lessonData='lessonData'
:lessonPlayIndex='lessonPlayIndex'
ref="jobpane"
v-show="lessonTools[5].isShow ">
</TrainTest-Pane>
<Result-Tips
:examStatus='examStatus'
ref="rtui">
@ -144,7 +136,6 @@
import ExplainPane from '@/views/jlmap3d/lesson3dplayer/tools/explainpane';
import JobPane from '@/views/jlmap3d/lesson3dplayer/tools/jobpane';
import ToolBar from '@/views/jlmap3d/lesson3dplayer/tools/toolbar';
import TrainTestPane from '@/views/jlmap3d/lesson3dplayer/tools/traintestpane';
import { Lesson3dPlayer } from '@/jlmap3d/lesson3d/lesson3dplayer.js';
@ -168,8 +159,7 @@
ExplainPane,
JobPane,
ToolBar,
ResultTips,
TrainTestPane
ResultTips
},
data() {
return {
@ -298,8 +288,14 @@
this.$refs.jobpane.initJobList(this.jobPaneData.dataList);
this.lessonTools = loadData.lessonTools;
this.lessonData.loadLessonProgress(loadData.lessonProgress);
if(this.lessonTools[5].isShow){
if(this.lessonTools[5]){
loadData.trainDeviceData = this.trainDeviceData.deviceList;
}else{
this.lessonTools[5] = {
name:"大铁车检组件",
type:"",
isShow:false,
};
}
}else{
@ -404,7 +400,8 @@
if(type == "jump"){
this.lessonPlayIndex = action.nextNode;
}
console.log(type);
console.log(action);
this.jl3d.changeIndex(this.lessonPlayIndex);
},
actionEvent(type,action,mesh){

Binary file not shown.