|
|
@@ -42,6 +42,8 @@ export default {
|
|
|
paper: null,
|
|
|
//
|
|
|
mapPopupData: null,
|
|
|
+ //
|
|
|
+ superpositions_constraints: []
|
|
|
}
|
|
|
},
|
|
|
provide() {
|
|
|
@@ -58,7 +60,8 @@ export default {
|
|
|
'concernementsByID',
|
|
|
'opened_concernement',
|
|
|
'opened_entite_id',
|
|
|
- 'opened_recit'
|
|
|
+ 'opened_recit',
|
|
|
+ 'allSuperpositions'
|
|
|
]),
|
|
|
...mapState(CommonStore,['map_item_ray',
|
|
|
'hover_elmt',
|
|
|
@@ -72,13 +75,22 @@ export default {
|
|
|
timing: {
|
|
|
//timestamp: 0.5,
|
|
|
timeScale: 0.5
|
|
|
- }
|
|
|
+ },
|
|
|
+ // constraintIterations: 20,
|
|
|
+ // positionIterations: 20,
|
|
|
+ // velocityIterations: 20
|
|
|
}
|
|
|
this.engine = Matter.Engine.create(engineOptions);
|
|
|
this.engine.gravity.scale = 0;
|
|
|
this.world = this.engine.world;
|
|
|
+
|
|
|
+
|
|
|
+ // listen for afterUpdate event from Matter.Engine object
|
|
|
+ Matter.Events.on(this.engine, "beforeUpdate", this.onBeforeEngineUpdate);
|
|
|
+ Matter.Events.on(this.engine, "afterUpdate", this.onAfterEngineUpdate);
|
|
|
},
|
|
|
mounted() {
|
|
|
+ console.log('map mounted');
|
|
|
this.canvasMap.canvas = this.$refs['canvas-map'];
|
|
|
this.canvasMap.ctx = this.canvasMap.canvas.getContext('2d');
|
|
|
|
|
|
@@ -111,6 +123,7 @@ export default {
|
|
|
this.setHoverElmt(null);
|
|
|
}
|
|
|
}.bind(this);
|
|
|
+
|
|
|
// MATTER
|
|
|
let wall_w = 1000;
|
|
|
Matter.Composite.add(this.world, [
|
|
|
@@ -203,6 +216,33 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
deep: true
|
|
|
+ },
|
|
|
+ map_mode: {
|
|
|
+ handler (n, o) {
|
|
|
+ console.log('concernementMap watch map_mode', o, n);
|
|
|
+ if (n === 'superposition' && !this.opened_concernement) {
|
|
|
+ // create constraints
|
|
|
+ this.setSuperpositionsMatterConstraints();
|
|
|
+ }else{
|
|
|
+ // destroy constraints
|
|
|
+ this.clearSuperpositionsMatterConstraints();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ deep: true
|
|
|
+ },
|
|
|
+ allSuperpositions: {
|
|
|
+ handler (n, o) {
|
|
|
+ console.log('concernementMap watch allSuperpositions', o, n);
|
|
|
+ if (n && n.length) {
|
|
|
+ // create constraints with a delay (watch is needed for first page load)
|
|
|
+ window.setTimeout(this.setSuperpositionsMatterConstraints, 200);
|
|
|
+ }
|
|
|
+ // else{
|
|
|
+ // // destroy constraints
|
|
|
+ // this.clearSuperpositionsMatterConstraints();
|
|
|
+ // }
|
|
|
+ },
|
|
|
+ deep: true
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
@@ -995,6 +1035,98 @@ export default {
|
|
|
strokeColor: "#01ffe2",
|
|
|
strokeWidth: 0.25,
|
|
|
})
|
|
|
+ },
|
|
|
+ setSuperpositionsMatterConstraints(){
|
|
|
+ console.log('setSuperpositionsMatterConstraints this.allSuperpositions', this.allSuperpositions);
|
|
|
+ // let allBodies = Matter.Composite.allBodies(this.world);
|
|
|
+ // console.log('allBodies', allBodies);
|
|
|
+ // let allComposites = Matter.Composite.allComposites(this.world);
|
|
|
+ // console.log('allComposites', allComposites);
|
|
|
+
|
|
|
+ for(let superposition of this.allSuperpositions){
|
|
|
+ // console.log('superposition', superposition[0].cid, superposition[1].cid);
|
|
|
+ // get the concernement matter bodies with id
|
|
|
+ let bodyA = Matter.Composite.get(this.world, superposition[0].cid, 'body');
|
|
|
+ let bodyB = Matter.Composite.get(this.world, superposition[1].cid, 'body');
|
|
|
+ // console.log('bodyA, bodyB', bodyA, bodyB);
|
|
|
+
|
|
|
+ // get the entite coordinates inside the concernement body
|
|
|
+ let pointA = null;
|
|
|
+ let concernementA = this.concernementsByID[superposition[0].cid];
|
|
|
+ // console.log('concernementA', concernementA);
|
|
|
+ for(let entiteA of concernementA.revisions_byid[concernementA.active_revision].entites){
|
|
|
+ if (entiteA.entite && entiteA.entite.id === superposition[0].eid && entiteA.display) {
|
|
|
+ // console.log('entiteA', entiteA);
|
|
|
+ pointA = Matter.Vector.create(entiteA.display.pos.x, entiteA.display.pos.y);
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ let pointB = null;
|
|
|
+ let concernementB = this.concernementsByID[superposition[1].cid];
|
|
|
+ // console.log('concernementB', concernementB);
|
|
|
+ for(let entiteB of concernementB.revisions_byid[concernementB.active_revision].entites){
|
|
|
+ if (entiteB.entite && entiteB.entite.id === superposition[1].eid && entiteB.display) {
|
|
|
+ // console.log('entiteB', entiteB);
|
|
|
+ pointB = Matter.Vector.create(entiteB.display.pos.x, entiteB.display.pos.y);
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // console.log(`pointA:`, pointA,` pointB:`, pointB);
|
|
|
+ if (bodyA && bodyB && pointA && pointB) {
|
|
|
+ let c = Matter.Constraint.create({
|
|
|
+ bodyA: bodyA,
|
|
|
+ pointA: pointA,
|
|
|
+ bodyB: bodyB,
|
|
|
+ pointB: pointB,
|
|
|
+ stiffness: 1,
|
|
|
+ length: 0,
|
|
|
+ damping: 1
|
|
|
+ });
|
|
|
+ this.superpositions_constraints.push(c);
|
|
|
+ Matter.Composite.add(this.world, c);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ clearSuperpositionsMatterConstraints(){
|
|
|
+ console.log('clearSuperpositionsMatterConstraints', this.superpositions_constraints);
|
|
|
+ for(let constraint of this.superpositions_constraints){
|
|
|
+ Matter.Composite.remove(this.world, constraint, true);
|
|
|
+ }
|
|
|
+ this.superpositions_constraints = [];
|
|
|
+ },
|
|
|
+ onBeforeEngineUpdate(){
|
|
|
+
|
|
|
+ },
|
|
|
+ onAfterEngineUpdate(){
|
|
|
+
|
|
|
+ // // START OF DEBUGGING
|
|
|
+ // // draw lines of constraints for debuging
|
|
|
+ // let constraints_lines = this.paper.project.getItem({name: 'constraints_lines', class: paper.Group});
|
|
|
+ // if (constraints_lines) {
|
|
|
+ // constraints_lines.removeChildren();
|
|
|
+ // }else{
|
|
|
+ // constraints_lines = new paper.Group({
|
|
|
+ // pivot: new paper.Point({x:0,y:0}),
|
|
|
+ // name: 'constraints_lines',
|
|
|
+ // });
|
|
|
+ // }
|
|
|
+ // let all_constrains = Matter.Composite.allConstraints(this.world);
|
|
|
+ // let children = [];
|
|
|
+ // for(let constraint of all_constrains){
|
|
|
+ // // console.log('constrain', constraint);
|
|
|
+ // let pointAWorld = Matter.Constraint.pointAWorld(constraint);
|
|
|
+ // let pointBWorld = Matter.Constraint.pointBWorld(constraint);
|
|
|
+ // // console.log('pointAWorld, pointBWorld', pointAWorld, pointBWorld);
|
|
|
+ // children.push(new paper.Path.Line({
|
|
|
+ // from: [pointAWorld.x, pointAWorld.y],
|
|
|
+ // to: [pointBWorld.x, pointBWorld.y],
|
|
|
+ // strokeColor: '#f00',
|
|
|
+ // strokeWidth: 1
|
|
|
+ // }));
|
|
|
+ // }
|
|
|
+ // constraints_lines.addChildren(children);
|
|
|
+ // // END OF DEBUGGING
|
|
|
}
|
|
|
},
|
|
|
beforeUpdate () {
|
