diff --git a/src/components/ConcernementMapItem.vue b/src/components/ConcernementMapItem.vue index 35e535c..7bb8cfc 100644 --- a/src/components/ConcernementMapItem.vue +++ b/src/components/ConcernementMapItem.vue @@ -107,6 +107,8 @@ export default { this.initPaperObjects() // } } + + this.setConcernementMapItem(this.id, this); }, // mounted() { // console.log(`ConcernementsMapItem ${this.concernement.id} mounted`, this.canvasMap.canvas); @@ -130,7 +132,7 @@ export default { // console.log('mapItem watch is_opened', n, this.is_opened); if(n){ // opened this.openClose(true); - }else{ // closed + }else if(o) { // closed if was opened this.openClose(false); } }, @@ -180,7 +182,8 @@ export default { }, methods: { ...mapActions(CommonStore,['setHoverElmt']), - ...mapActions(ConcernementsStore,['openCloseConcernements', + ...mapActions(ConcernementsStore,['setConcernementMapItem', + 'openCloseConcernements', 'hideShowConcernement', 'setBesoinPaperId', 'setOpenedDoleanceField', @@ -369,7 +372,7 @@ export default { // INFO https://github.com/liabru/matter-attractors/issues/8 // INFO https://github.com/liabru/matter-attractors/blob/master/index.js // INFO https://github.com/liabru/matter-attractors/blob/master/build/matter-attractors.js#L180 - // MatterAttractors.Attractors.gravityConstant = -20; + MatterAttractors.Attractors.gravityConstant = -20; // Create parts of the body : main big circle & entities // INFO map a range of numbers to another range of numbers https://stackoverflow.com/a/46462321 @@ -400,37 +403,37 @@ export default { collisionFilter: { group: -1 }, - // plugin: { - // attractors: [ - // // // there is a built in helper function for Newtonian gravity! - // // // you can find out how it works in index.js - // MatterAttractors.Attractors.gravity + plugin: { + attractors: [ + // // there is a built in helper function for Newtonian gravity! + // // you can find out how it works in index.js + MatterAttractors.Attractors.gravity - // // function(bodyA, bodyB) { - // // var force = { - // // x: (bodyA.position.x - bodyB.position.x) * 1e-6, - // // y: (bodyA.position.y - bodyB.position.y) * 1e-6 - // // } - // // // apply force to both bodies - // // Matter.Body.applyForce(bodyA, bodyA.position, force); - // // Matter.Body.applyForce(bodyB, bodyB.position, Matter.Vector.neg(force)); - // // } + // function(bodyA, bodyB) { + // var force = { + // x: (bodyA.position.x - bodyB.position.x) * 1e-6, + // y: (bodyA.position.y - bodyB.position.y) * 1e-6 + // } + // // apply force to both bodies + // Matter.Body.applyForce(bodyA, bodyA.position, force); + // Matter.Body.applyForce(bodyB, bodyB.position, Matter.Vector.neg(force)); + // } - // // INFO https://github.com/liabru/matter-attractors/blob/master/build/matter-attractors.js#L192 - // // function (bodyA, bodyB){ - // // // use Newton's law of gravitation - // // var bToA = Matter.Vector.sub(bodyB.position, bodyA.position), - // // distanceSq = Matter.Vector.magnitudeSquared(bToA) || 0.0001, - // // normal = Matter.Vector.normalise(bToA), - // // magnitude = -MatterAttractors.Attractors.gravityConstant * (bodyA.mass * bodyB.mass / distanceSq), - // // force = Matter.Vector.mult(normal, magnitude); + // INFO https://github.com/liabru/matter-attractors/blob/master/build/matter-attractors.js#L192 + // function (bodyA, bodyB){ + // // use Newton's law of gravitation + // var bToA = Matter.Vector.sub(bodyB.position, bodyA.position), + // distanceSq = Matter.Vector.magnitudeSquared(bToA) || 0.0001, + // normal = Matter.Vector.normalise(bToA), + // magnitude = -MatterAttractors.Attractors.gravityConstant * (bodyA.mass * bodyB.mass / distanceSq), + // force = Matter.Vector.mult(normal, magnitude); - // // // to apply forces to both bodies - // // Matter.Body.applyForce(bodyA, bodyA.position, Matter.Vector.neg(force)); - // // Matter.Body.applyForce(bodyB, bodyB.position, force); - // // } - // ] - // } + // // to apply forces to both bodies + // Matter.Body.applyForce(bodyA, bodyA.position, Matter.Vector.neg(force)); + // Matter.Body.applyForce(bodyB, bodyB.position, force); + // } + ] + } }); Matter.Body.setPosition(this.body, this.pos); @@ -1123,7 +1126,7 @@ export default { if (!this.is_opened) { this.paper_main_object.children.entites_superposes.visible = true; // if not opened and has_superpositions draw the entites_superposes points } else { - this.paper_main_object.children.entites_superposes.visible = false; + this.paper_main_object.children.entites_superposes.visible = true; } } else { this.paper_main_object.children.entites_superposes.visible = false; @@ -1389,15 +1392,32 @@ export default { Matter.Body.scale(this.body, obj.s, obj.s) this.paper_main_object.scale(obj.s); + // update superposition constraints + if (Object.keys(this.concernement.superposition_constraints).length) { + // console.log('concernement superposition_constraints', this.concernement.superposition_constraints); + for(let constraint_id in this.concernement.superposition_constraints) { + let constraint = this.concernement.superposition_constraints[constraint_id]; + // console.log('concernement mapitem constraint', constraint); + let ab = this.id === constraint.concernementA.id ? 'A' : 'B'; + let point = constraint[`point${ab}`]; + // console.log('point', point); + // revert to the original point + let oripoint = Matter.Vector.create(point.x / this.scale, point.y / this.scale) + let newpoint = Matter.Vector.create(oripoint.x * obj.s, oripoint.y * obj.s) + constraint[`point${ab}`] = newpoint; + } + } + // record new scale this.prev_scale = this.scale; this.scale = obj.s; this.opacity = obj.o; - + // console.log('tween update obj.s', obj.s); this.pos = {x:obj.x, y:obj.y}; Matter.Body.setPosition(this.body, this.pos); }) .onComplete((obj) => { + // console.log('tween complete obj.s', obj.s); // record tween one last time this.prev_scale = this.scale = obj.s; this.opacity = obj.o; @@ -1416,6 +1436,8 @@ export default { }); Matter.Composite.add(this.matterEngine.world, [this.body, this.constraint]); + + this.is_opening = false; }); // recreate the matter engine event to get it a the end of the events stack @@ -1446,6 +1468,22 @@ export default { Matter.Body.scale(this.body, obj.s, obj.s) this.paper_main_object.scale(obj.s); + // update superposition constraints + if (this.concernement.superposition_constraints && Object.keys(this.concernement.superposition_constraints).length) { + // console.log('concernement superposition_constraints', this.concernement.superposition_constraints); + for(let constraint_id in this.concernement.superposition_constraints) { + let constraint = this.concernement.superposition_constraints[constraint_id]; + // console.log('concernement mapitem constraint', constraint); + let ab = this.id === constraint.concernementA.id ? 'A' : 'B'; + let point = constraint[`point${ab}`]; + // console.log('point', point); + // revert to the original point + let oripoint = Matter.Vector.create(point.x / this.scale, point.y / this.scale) + let newpoint = Matter.Vector.create(oripoint.x * obj.s, oripoint.y * obj.s) + constraint[`point${ab}`] = newpoint; + } + } + // record new scale this.prev_scale = this.scale; this.scale = obj.s; @@ -1476,7 +1514,7 @@ export default { } if (this.opened_concernement) { - if (this.opened_concernement.id !== this.id) { + if (this.opened_concernement.id !== this.id && this.opened_concernement.superposed_concernements_id.indexOf(this.id) < 0) { this.pushAside() } } else if (this.map_mode === 'proximite' diff --git a/src/components/MapConcernements.vue b/src/components/MapConcernements.vue index a5ea1de..290ccc2 100644 --- a/src/components/MapConcernements.vue +++ b/src/components/MapConcernements.vue @@ -233,7 +233,7 @@ export default { allSuperpositions: { handler (n, o) { console.log('concernementMap watch allSuperpositions', o, n); - if (n && n.length) { + if (this.map_mode === "superposition" && n && n.length) { // create constraints with a delay (watch is needed for first page load) window.setTimeout(this.setSuperpositionsMatterConstraints, 200); } @@ -243,7 +243,16 @@ export default { // } }, deep: true - } + }, + // opened_concernement: { + // handler (n, o) { + // console.log('map opened_concernement', this.opened_concernement); + // if (this.map_mode === 'superposition' && n) { + // this.resetSuperpositionsMatterConstraints(); + // } + // }, + // deep: true + // } }, methods: { ...mapActions(ConcernementsStore,['setMapMode', @@ -1053,7 +1062,7 @@ export default { // get the entite coordinates inside the concernement body let pointA = null; let concernementA = this.concernementsByID[superposition[0].cid]; - // console.log('concernementA', concernementA); + 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); @@ -1063,7 +1072,7 @@ export default { } let pointB = null; let concernementB = this.concernementsByID[superposition[1].cid]; - // console.log('concernementB', concernementB); + 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); @@ -1081,20 +1090,39 @@ export default { pointB: pointB, stiffness: 1, length: 0, - damping: 1 + damping: 1, + concernementA: concernementA, + concernementB: concernementB }); this.superpositions_constraints.push(c); Matter.Composite.add(this.world, c); + // keep a link the constraint into the concernement object (useful for tweening the constraint pointA & pointB in concernementMapItem) + concernementA.superposition_constraints[c.id] = c; + concernementB.superposition_constraints[c.id] = c; + // record all superposed concernements for each concernement + if (concernementA.superposed_concernements_id.indexOf(concernementB.id) < 0) { + concernementA.superposed_concernements_id.push(concernementB.id); + } + if (concernementB.superposed_concernements_id.indexOf(concernementA.id) < 0) { + concernementB.superposed_concernements_id.push(concernementA.id); + } + } } }, clearSuperpositionsMatterConstraints(){ console.log('clearSuperpositionsMatterConstraints', this.superpositions_constraints); for(let constraint of this.superpositions_constraints){ + delete constraint.concernementA.superposition_constraints[constraint.id]; + delete constraint.concernementB.superposition_constraints[constraint.id]; Matter.Composite.remove(this.world, constraint, true); } this.superpositions_constraints = []; }, + // resetSuperpositionsMatterConstraints(){ + // this.clearSuperpositionsMatterConstraints(); + // this.setSuperpositionsMatterConstraints(); + // }, onBeforeEngineUpdate(){ }, diff --git a/src/stores/concernements.js b/src/stores/concernements.js index 8919084..74f24b5 100644 --- a/src/stores/concernements.js +++ b/src/stores/concernements.js @@ -92,25 +92,14 @@ export const ConcernementsStore = defineStore({ // SUPERPOSITIONS if (entite.entite.superposition.length) { concernement.has_superpositions = true; + concernement.superposition_constraints = {}; + concernement.superposed_concernements_id = []; entite.entite.superposition.forEach(entite_superpose => { // console.log(`superposition eid:${entite.entite.id}, teid:${entite_superpose.id}`); let already_recorded = false; // loop through all already recorded superposition to complete the array instead of create duplicates + // TODO check if target cid and eid are accessible before recording the superposition for(let superposition of this.allSuperpositions) { - // if (superposition.indexOf(entite_superpose.id) >= 0) { - // already_recorded = true; - // if (superposition.indexOf(entite.entite.id) < 0) { - // superposition.push(entite.entite.id) - // } - // break; - // } - // if (superposition.indexOf(entite.entite.id) >= 0) { - // already_recorded = true; - // if (superposition.indexOf(entite_superpose.id) < 0) { - // superposition.push(entite_superpose.id) - // } - // break; - // } for(let superposition_item of superposition) { if (superposition_item.eid === entite.entite.id && !superposition_item.cid) { console.log(`already_recorded, eid:${entite.entite.id}, teid:${entite_superpose.id}`, entite.entite.title); @@ -316,6 +305,9 @@ export const ConcernementsStore = defineStore({ } }); }, + setConcernementMapItem (id, o) { + this.concernementsByID[id].map_item = o; + }, resetConcernementOpened () { this.opened_concernement = null; this.openCloseConcernements(); diff --git a/src/views/Concernement.vue b/src/views/Concernement.vue index e7425ef..6107e75 100644 --- a/src/views/Concernement.vue +++ b/src/views/Concernement.vue @@ -106,7 +106,7 @@ export default {