superposition: mapitem openeing and entite clickable
This commit is contained in:
parent
43290d3c5d
commit
36b76a9ba6
@ -544,6 +544,9 @@ export default {
|
|||||||
this.addNewPaperSymbolInstance('boussole_bg', true);
|
this.addNewPaperSymbolInstance('boussole_bg', true);
|
||||||
this.paper_main_object.addChild(this.setPaperEntites());
|
this.paper_main_object.addChild(this.setPaperEntites());
|
||||||
break;
|
break;
|
||||||
|
case 'superposition':
|
||||||
|
this.addNewPaperSymbolInstance('boussole_bg', true);
|
||||||
|
break;
|
||||||
case 'puissancedagir':
|
case 'puissancedagir':
|
||||||
this.addNewPaperSymbolInstance('puissanceagir_bg', true);
|
this.addNewPaperSymbolInstance('puissanceagir_bg', true);
|
||||||
this.paper_main_object.addChild(this.setPaperPuissanceagirBesoins());
|
this.paper_main_object.addChild(this.setPaperPuissanceagirBesoins());
|
||||||
@ -1129,13 +1132,30 @@ export default {
|
|||||||
this.paper_main_object.children.agissantes_icons.visible = false;
|
this.paper_main_object.children.agissantes_icons.visible = false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
|
||||||
handlePaperVisibilityOnOpened(){
|
|
||||||
|
|
||||||
|
|
||||||
|
// superposition
|
||||||
|
// scale down superposed entites on open
|
||||||
|
let entites_superposes = this.paper_main_object.children['entites_superposes'];
|
||||||
|
// console.log('entites_superposes.children', entites_superposes.children);
|
||||||
|
if(entites_superposes){
|
||||||
|
for(let paper_item of entites_superposes.children) {
|
||||||
|
// paper_item.definition = this.paper_symbol_definitions.entite_hover;
|
||||||
|
paper_item.scale(0.25)
|
||||||
|
}
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
handlePaperVisibilityOnOpened(){},
|
||||||
handlePaperVisibilityOnBeforeClose(){
|
handlePaperVisibilityOnBeforeClose(){
|
||||||
|
// superposition
|
||||||
|
// scale up superposed entites on open
|
||||||
|
let entites_superposes = this.paper_main_object.children['entites_superposes'];
|
||||||
|
// console.log('entites_superposes.children', entites_superposes.children);
|
||||||
|
if(entites_superposes){
|
||||||
|
for(let paper_item of entites_superposes.children) {
|
||||||
|
// paper_item.definition = this.paper_symbol_definitions.entite_hover;
|
||||||
|
paper_item.scale(4)
|
||||||
|
}
|
||||||
|
}
|
||||||
},
|
},
|
||||||
handlePaperVisibilityOnClosed(){
|
handlePaperVisibilityOnClosed(){
|
||||||
// agissantes
|
// agissantes
|
||||||
@ -1147,9 +1167,7 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
handlePaperVisibilityOnMapMode(){
|
handlePaperVisibilityOnMapMode(){},
|
||||||
|
|
||||||
},
|
|
||||||
handlePaperVisibilityOnAfterEnginUpdate(){
|
handlePaperVisibilityOnAfterEnginUpdate(){
|
||||||
// contours focused
|
// contours focused
|
||||||
if (!this.isFocused()){
|
if (!this.isFocused()){
|
||||||
@ -1283,9 +1301,7 @@ export default {
|
|||||||
// console.log(`onmousemove ${this.id}`);
|
// console.log(`onmousemove ${this.id}`);
|
||||||
|
|
||||||
// prevent hover map item mouse event if cartouch is opened
|
// prevent hover map item mouse event if cartouch is opened
|
||||||
if (this.cartouch_is_open) {
|
if (this.cartouch_is_open) return;
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!this.is_open) {
|
if (!this.is_open) {
|
||||||
if (!this.opened_concernement && this.isFocused()) { // only if no concernement is opened and is this focused
|
if (!this.opened_concernement && this.isFocused()) { // only if no concernement is opened and is this focused
|
||||||
@ -1316,6 +1332,9 @@ export default {
|
|||||||
case "terraindevie":
|
case "terraindevie":
|
||||||
paper_group_tohit = this.paper_main_object.children['entites'];
|
paper_group_tohit = this.paper_main_object.children['entites'];
|
||||||
break;
|
break;
|
||||||
|
case "superposition":
|
||||||
|
paper_group_tohit = this.paper_main_object.children['entites_superposes'];
|
||||||
|
break;
|
||||||
case "action":
|
case "action":
|
||||||
paper_group_tohit = this.paper_main_object.children['agissantes'];
|
paper_group_tohit = this.paper_main_object.children['agissantes'];
|
||||||
break;
|
break;
|
||||||
@ -1368,6 +1387,7 @@ export default {
|
|||||||
if (this.cartouch_is_open) return;
|
if (this.cartouch_is_open) return;
|
||||||
|
|
||||||
if (!this.is_open) { // si ce concernement n'est pas ouvet
|
if (!this.is_open) { // si ce concernement n'est pas ouvet
|
||||||
|
console.log('mapitem is NOT opened');
|
||||||
if (!this.opened_concernement) { // si aucun concernement n'est ouvert
|
if (!this.opened_concernement) { // si aucun concernement n'est ouvert
|
||||||
console.log(`Open me ${this.id}`);
|
console.log(`Open me ${this.id}`);
|
||||||
// open/close all concernements
|
// open/close all concernements
|
||||||
@ -1382,12 +1402,16 @@ export default {
|
|||||||
this.resetHoverElmt();
|
this.resetHoverElmt();
|
||||||
}
|
}
|
||||||
} else { // si ce concernement est ouvert
|
} else { // si ce concernement est ouvert
|
||||||
|
console.log('mapitem is opened');
|
||||||
// lets define some options regarding the map_mode
|
// lets define some options regarding the map_mode
|
||||||
let group_to_hit = null;
|
let group_to_hit = null;
|
||||||
switch (this.map_mode) {
|
switch (this.map_mode) {
|
||||||
case "terraindevie":
|
case "terraindevie":
|
||||||
group_to_hit = this.paper_main_object.children['entites'];
|
group_to_hit = this.paper_main_object.children['entites'];
|
||||||
break;
|
break;
|
||||||
|
case "superposition":
|
||||||
|
group_to_hit = this.paper_main_object.children['entites_superposes'];
|
||||||
|
break;
|
||||||
case "action":
|
case "action":
|
||||||
group_to_hit = this.paper_main_object.children['agissantes'];
|
group_to_hit = this.paper_main_object.children['agissantes'];
|
||||||
break;
|
break;
|
||||||
@ -1401,6 +1425,7 @@ export default {
|
|||||||
if (result) {
|
if (result) {
|
||||||
switch (this.map_mode) {
|
switch (this.map_mode) {
|
||||||
case "terraindevie":
|
case "terraindevie":
|
||||||
|
case "superposition":
|
||||||
case "action":
|
case "action":
|
||||||
// we have clicked on an entite
|
// we have clicked on an entite
|
||||||
this.$router.push({
|
this.$router.push({
|
||||||
@ -1443,8 +1468,6 @@ export default {
|
|||||||
}
|
}
|
||||||
if (open) {
|
if (open) {
|
||||||
this.is_opening = true;
|
this.is_opening = true;
|
||||||
// paper bring to front
|
|
||||||
this.paper_main_object.bringToFront();
|
|
||||||
// create the paper objects to display (like entite, besoin, etc)
|
// create the paper objects to display (like entite, besoin, etc)
|
||||||
this.setPaperContents();
|
this.setPaperContents();
|
||||||
this.handlePaperVisibilityOnBeforeOpen();
|
this.handlePaperVisibilityOnBeforeOpen();
|
||||||
@ -1454,8 +1477,7 @@ export default {
|
|||||||
// let s = this.canvas.height / (this.ray*2.8)
|
// let s = this.canvas.height / (this.ray*2.8)
|
||||||
let s = Math.min(this.canvas.height, this.canvas.width - this.cartouch_width) / (this.ray*2.8)
|
let s = Math.min(this.canvas.height, this.canvas.width - this.cartouch_width) / (this.ray*2.8)
|
||||||
|
|
||||||
|
// create once the opening tweening
|
||||||
// opening tweening
|
|
||||||
this.tween = new Tween.Tween({s: this.scale, x: this.pos.x, y: this.pos.y, o: 0})
|
this.tween = new Tween.Tween({s: this.scale, x: this.pos.x, y: this.pos.y, o: 0})
|
||||||
.to({
|
.to({
|
||||||
s: s,
|
s: s,
|
||||||
@ -1472,7 +1494,7 @@ export default {
|
|||||||
Matter.Body.scale(this.body, obj.s, obj.s)
|
Matter.Body.scale(this.body, obj.s, obj.s)
|
||||||
this.paper_main_object.scale(obj.s);
|
this.paper_main_object.scale(obj.s);
|
||||||
|
|
||||||
// update superposition constraints points
|
// update superposition constraints points poisitions
|
||||||
if (this.concernement.superposition_constraints_id
|
if (this.concernement.superposition_constraints_id
|
||||||
&& this.concernement.superposition_constraints_id[this.id]
|
&& this.concernement.superposition_constraints_id[this.id]
|
||||||
&& this.concernement.superposition_constraints_id[this.id].length)
|
&& this.concernement.superposition_constraints_id[this.id].length)
|
||||||
@ -1531,7 +1553,8 @@ export default {
|
|||||||
});
|
});
|
||||||
Matter.Composite.add(this.matterEngine.world, [this.body, this.constraint]);
|
Matter.Composite.add(this.matterEngine.world, [this.body, this.constraint]);
|
||||||
|
|
||||||
|
// paper bring to front
|
||||||
|
this.paper_main_object.bringToFront();
|
||||||
|
|
||||||
this.is_opening = false;
|
this.is_opening = false;
|
||||||
});
|
});
|
||||||
@ -1552,6 +1575,7 @@ export default {
|
|||||||
|
|
||||||
// this.setOpenedRecit(null);
|
// this.setOpenedRecit(null);
|
||||||
|
|
||||||
|
// create once the closing tween
|
||||||
this.tween = new Tween.Tween({s: this.scale, o: 1})
|
this.tween = new Tween.Tween({s: this.scale, o: 1})
|
||||||
.to({s: 1, o: 0}, 500)
|
.to({s: 1, o: 0}, 500)
|
||||||
.onUpdate((obj) => {
|
.onUpdate((obj) => {
|
||||||
@ -1563,7 +1587,7 @@ export default {
|
|||||||
Matter.Body.scale(this.body, obj.s, obj.s)
|
Matter.Body.scale(this.body, obj.s, obj.s)
|
||||||
this.paper_main_object.scale(obj.s);
|
this.paper_main_object.scale(obj.s);
|
||||||
|
|
||||||
// update superposition constraints points
|
// update superposition constraints points positions
|
||||||
if (this.concernement.superposition_constraints_id
|
if (this.concernement.superposition_constraints_id
|
||||||
&& this.concernement.superposition_constraints_id[this.id]
|
&& this.concernement.superposition_constraints_id[this.id]
|
||||||
&& this.concernement.superposition_constraints_id[this.id].length)
|
&& this.concernement.superposition_constraints_id[this.id].length)
|
||||||
@ -1623,7 +1647,8 @@ export default {
|
|||||||
// this.opened_concernement.id !== this.cid &&
|
// this.opened_concernement.id !== this.cid &&
|
||||||
this.opened_concernement.opened_mapitem_id !== this.id
|
this.opened_concernement.opened_mapitem_id !== this.id
|
||||||
// && (!this.opened_concernement.all_superposed_concernements_id || this.opened_concernement.all_superposed_concernements_id.indexOf(this.id) < 0)
|
// && (!this.opened_concernement.all_superposed_concernements_id || this.opened_concernement.all_superposed_concernements_id.indexOf(this.id) < 0)
|
||||||
&& (!this.opened_concernement.superposed_mapitem_id_by_mapitem_id[this.opened_concernement.opened_mapitem_id] // when we are not in superposition mode
|
&& (!this.opened_concernement.superposed_mapitem_id_by_mapitem_id
|
||||||
|
|| !this.opened_concernement.superposed_mapitem_id_by_mapitem_id[this.opened_concernement.opened_mapitem_id] // when we are not in superposition mode
|
||||||
|| this.opened_concernement.superposed_mapitem_id_by_mapitem_id[this.opened_concernement.opened_mapitem_id].indexOf(this.id) < 0) // this mapitem is not superposed to the opened mapitem
|
|| this.opened_concernement.superposed_mapitem_id_by_mapitem_id[this.opened_concernement.opened_mapitem_id].indexOf(this.id) < 0) // this mapitem is not superposed to the opened mapitem
|
||||||
) {
|
) {
|
||||||
this.pushAside()
|
this.pushAside()
|
||||||
@ -1952,7 +1977,8 @@ export default {
|
|||||||
|| this.pos.y >= this.canvas.height){
|
|| this.pos.y >= this.canvas.height){
|
||||||
this.pos = this.getRandomPos()
|
this.pos = this.getRandomPos()
|
||||||
Matter.Body.setPosition(this.body, {x:this.pos.x, y:this.pos.y});
|
Matter.Body.setPosition(this.body, {x:this.pos.x, y:this.pos.y});
|
||||||
this.setInitBodyVelocity();
|
// this.setInitBodyVelocity();
|
||||||
|
Matter.Body.setVelocity(this.body, {x:0,y:0});
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
|
@ -56,6 +56,7 @@ export default {
|
|||||||
this.concernement = this.concernementsByID[this.infos.cid];
|
this.concernement = this.concernementsByID[this.infos.cid];
|
||||||
break;
|
break;
|
||||||
case 'entite':
|
case 'entite':
|
||||||
|
case 'entite_superpose':
|
||||||
case 'entite_action':
|
case 'entite_action':
|
||||||
this.entites = [this.allEntitesById[this.infos.id]];
|
this.entites = [this.allEntitesById[this.infos.id]];
|
||||||
break;
|
break;
|
||||||
@ -148,7 +149,7 @@ export default {
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section v-if="infos.type === 'entite' || infos.type === 'entite_action' || infos.type === 'superposition'" class="entite-map-popup">
|
<section v-if="infos.type === 'entite' || infos.type === 'entite_action' || infos.type === 'superposition' || infos.type === 'entite_superpose'" class="entite-map-popup">
|
||||||
<template
|
<template
|
||||||
v-for="(entite, index) of entites"
|
v-for="(entite, index) of entites"
|
||||||
:key="index"
|
:key="index"
|
||||||
|
@ -108,7 +108,7 @@ export default {
|
|||||||
|
|
||||||
// use the paper.view click to get back if no items is clicked
|
// use the paper.view click to get back if no items is clicked
|
||||||
this.paper.view.onClick = function(event) {
|
this.paper.view.onClick = function(event) {
|
||||||
console.log("view onClick", this, event.target);
|
// console.log("view onClick", this, event.target);
|
||||||
if(event.target._id === "paper-view-0") {
|
if(event.target._id === "paper-view-0") {
|
||||||
this.resetConcernementOpened();
|
this.resetConcernementOpened();
|
||||||
this.$router.push({
|
this.$router.push({
|
||||||
|
@ -16,7 +16,7 @@ export const CommonStore = defineStore({
|
|||||||
},
|
},
|
||||||
actions: {
|
actions: {
|
||||||
setHoverElmt(elmt) {
|
setHoverElmt(elmt) {
|
||||||
// console.log(`setHoverElmt`, elmt);
|
console.log(`setHoverElmt`, elmt);
|
||||||
// mode can be : terraindevie, proximite, superposition, puissancedagir, action, doleancer
|
// mode can be : terraindevie, proximite, superposition, puissancedagir, action, doleancer
|
||||||
this.hover_elmt = elmt;
|
this.hover_elmt = elmt;
|
||||||
},
|
},
|
||||||
|
Loading…
x
Reference in New Issue
Block a user