bachir/ouatterrir-app
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

on multiple superpositions can switch by clicking on superposed mapitem

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi 2023-09-20 15:25:36 +02:00
parent 139db3516a
commit c67afa76e3
7 changed files with 102 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
src/components/ConcernementMapItem.vue
View File

@ -1264,8 +1264,12 @@ export default {
if (this.is_hover) {
this.paper_main_object.bringToFront();
} else {
// mapitem can be hover while an other mapitem is open if it is superposed (superposition) to the currently opened mapitem
// in this case don't send it back
if (!this.opened_concernement) {
this.paper_main_object.sendToBack();
}
}
// hightlight superposed entites on focus
let entites_superposes = this.paper_main_object.children['entites_superposes'];
// console.log('entites_superposes.children', entites_superposes.children);
@ -1296,10 +1300,11 @@ export default {
// console.log(`onmousemove ${this.id}`);
// prevent hover map item mouse event if cartouch is opened
if (this.cartouch_is_open) return;
if (this.cartouch_is_open && this.map_mode !== "superposition") return;
if (!this.is_open) {
if (!this.opened_concernement && this.isFocused()) { // only if no concernement is opened and is this focused
if (!this.opened_concernement) { // only if no concernement is opened and is this focused
if(this.isFocused()){
if (this.map_mode === 'superposition') {
// get the superposed entite
this.setHoverElmt({
@ -1308,17 +1313,29 @@ export default {
cid: this.cid,
eids: this.superposedEntitesIDsList
});
} else {
} else{
this.setHoverElmt({
type: 'concernement',
id: this.id,
cid: this.cid
});
}
document.body.style.cursor = "pointer";
}
} else if (this.map_mode === 'superposition'){
// if this mapitem is superposed to the opened mapitem
if(this.opened_concernement.all_superposed_concernements_id.indexOf(this.cid) >= 0){
this.setHoverElmt({
type: 'superposition',
id: this.id,
cid: this.cid,
eids: this.superposedEntitesIDsList
});
document.body.style.cursor = "pointer";
}
}
} else {
// lets define some options regarding the map_mode
@ -1400,6 +1417,22 @@ export default {
this.openCloseConcernements(this.cid, this.id)
// reset the mousehover
this.resetHoverElmt();
} else if (this.map_mode === 'superposition'){
// if this mapitem is superposed to the opened mapitem
if(this.opened_concernement.all_superposed_concernements_id.indexOf(this.cid) >= 0){
// push route (keep the hash for map_mode)
// wait for routing to be finished before opening the mapItem
console.log('click on superposed this.mapitem.superposition_ids', this.mapitem.superposition_ids);
await this.$router.push({
name: 'concernement',
params: {cid: this.opened_concernement.cid},
query: {
mapitemid: this.opened_concernement.opened_mapitem_id,
superposition_id: this.mapitem.superposition_ids[0]
},
hash: `#${this.map_mode}`
});
}
}
} else { // si ce concernement est ouvert
console.log('mapitem is opened');
@ -1563,7 +1596,8 @@ export default {
Matter.Composite.add(this.matterEngine.world, [this.body, this.constraint]);
// paper bring to front
this.paper_main_object.bringToFront();
// this.paper_main_object.bringToFront();
this.paper_main_object.sendToBack();
this.is_opening = false;
});

2
src/components/MapConcernements.vue
View File

@ -148,7 +148,7 @@ export default {
watch: {
hover_elmt: {
handler (n, o) {
console.log(`watch hover_elmt map: o, n`, o, n);
// console.log(`watch hover_elmt map: o, n`, o, n);
// over highlight effect on paper items
if (n && n.paper_id) {
let nitem = paper.project.getItem({id: n.paper_id});

9
src/components/contents/TerrainDeVie.vue
View File

@ -99,6 +99,15 @@ export default {
},
deep: true
},
cid: {
handler (n,o) {
console.log(`TerrainDeVie watch cid o:${o}, n:${n}`);
if (n) {
this.concernement = this.concernementsByID[n];
}
},
deep: true
},
eid: {
handler (n, o) {
console.log(`TerrainDeVie watch eid o:${o}, n:${n}`);

11
src/components/layout/CartoucheLayout.vue
View File

@ -20,6 +20,17 @@ export default {
computed: {
...mapState(ConcernementsStore,['concernementsByID', 'opened_concernement', 'ct_concernement']),
},
watch: {
cid: {
handler (n,o) {
console.log(`TerrainDeVie watch cid o:${o}, n:${n}`);
if (n) {
this.concernement = this.concernementsByID[n];
}
},
deep: true
}
},
methods: {
...mapActions(ConcernementsStore,['setMapMode'])
},

2
src/stores/common.js
View File

@ -17,7 +17,7 @@ export const CommonStore = defineStore({
},
actions: {
setHoverElmt(elmt) {
console.log(`setHoverElmt`, elmt);
// console.log(`setHoverElmt`, elmt);
// mode can be : terraindevie, proximite, superposition, puissancedagir, action, doleancer
this.hover_elmt = elmt;
},

2
src/stores/concernements.js
View File

@ -362,7 +362,7 @@ export const ConcernementsStore = defineStore({
if (state) {
this.opened_concernement = c;
this.opened_concernement.opened_mapitem_id = id;
if (c.has_recit) {
if (c.has_recit && this.map_mode === "terraindevie") {
this.opened_recit = c.recit;
}
// console.log('openCloseConcernements', this.opened_concernement.opened);

69
src/views/Concernement.vue
View File

@ -85,18 +85,7 @@ export default {
console.log("superposition", this.superposition);
if(this.map_mode === "superposition" && this.$route.query.superposition_id){
// get superposition_id and superposition object
this.superposition_id = this.$route.query.superposition_id;
console.log('this.superposition_id', this.superposition_id);
if(this.superposition_id){
let ids = this.superposition_id.match(/(\d+)_(\d+)__(\d+)_(\d+)/i)
let couple_key = `${ids[1]}-${ids[3]}`
// console.log('superposition_id', this.superposition_id, couple_key, ids);
if (this.allSuperpositions_byid[couple_key][this.superposition_id]) {
this.superposition = this.allSuperpositions_byid[couple_key][this.superposition_id]
console.log("this.superposition", this.superposition);
}
}
this.getSuperposition()
// as we have two content to show multiply the cartouch with by 2
// necessary for mapitem opening scale and position
this.setCartoucheWidth(2)
@ -109,7 +98,7 @@ export default {
// when we arrived directly to the url, load the entite
// this.eid provided by route params
if (this.map_mode === "terraindevie" && this.eid) {
this.openEntite();
this.setOpenedEntiteId(this.eid)
}
},
watch: {
@ -125,15 +114,21 @@ export default {
},
eid: {
handler (n, o){
if(n){
this.openEntite()
}else{
// this.entite = false;
this.setOpenedEntiteId(null);
this.setOpenedEntiteId(n)
},
deep: true
},
// watch superposition_id query
$route: {
handler (n, o) {
console.log("concernement view $route watcher o, n", o, n);
if (n.query && n.query.superposition_id) {
this.getSuperposition()
}
},
deep: true
}
},
methods: {
...mapActions(ConcernementsStore,['openCloseConcernements',
@ -141,28 +136,24 @@ export default {
'setMapMode',
'resetConcernementOpened']),
...mapActions(CommonStore,['setCartoucheWidth']),
openEntite(){
this.setOpenedEntiteId(parseInt(this.eid))
// this.loadEntite()
getSuperposition(){
console.log('getSuperposition');
// get superposition_id and superposition object
if (this.$route.query.superposition_id) {
this.superposition_id = this.$route.query.superposition_id;
console.log('this.superposition_id', this.superposition_id);
if(this.superposition_id){
let ids = this.superposition_id.match(/(\d+)_(\d+)__(\d+)_(\d+)/i)
let couple_key = `${ids[1]}-${ids[3]}`
// console.log('superposition_id', this.superposition_id, couple_key, ids);
if (this.allSuperpositions_byid[couple_key][this.superposition_id]) {
this.superposition = this.allSuperpositions_byid[couple_key][this.superposition_id]
console.log("this.superposition", this.superposition);
}
}
}
},
// loadEntite(){
// const ast = gql`{
// entite (id: ${this.eid}) {
// ...EntiteFields
// }
// }
// ${EntiteFields}
// `
// console.log('ast', ast);
// GQL.post('', { query: print(ast) })
// .then(({data: { data: { entite }}}) => {
// console.log('load entite loaded', entite)
// this.entite = entite
// })
// .catch(error => {
// console.warn('Issue with load entite', error)
// })
// },
closeConcernement(){
this.resetConcernementOpened();
}