refactored mapitem (main and clones) generation for better superpositions opening
This commit is contained in:
parent
c1c1eab95d
commit
36e88290e6
136
src/App.vue
136
src/App.vue
@ -13,6 +13,13 @@ import MapConcernements from '@components/MapConcernements.vue'
|
||||
import ConcernementMapItem from '@components/ConcernementMapItem.vue'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
mapitems: [],
|
||||
// not_cloned_mapitems: [],
|
||||
// superposed_cloned_mapitems: []
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.loadContentTypeDefinition();
|
||||
this.loadConcernements()
|
||||
@ -25,48 +32,92 @@ export default {
|
||||
...mapState(UserStore,['isloggedin']),
|
||||
...mapState(ConcernementsStore,['map_mode',
|
||||
'concernements',
|
||||
'concernements_loaded',
|
||||
'concernementsByID',
|
||||
'allSuperpositions_byid',
|
||||
'opened_recit']),
|
||||
superposed_clones_concernements () {
|
||||
let clones = [];
|
||||
// loop through all superposition grouped by concernements couples
|
||||
for(let [couple_id, superpositions] of Object.entries(this.allSuperpositions_byid)){
|
||||
// loop through all superpositions for one concernement couple and mark the first as NOT cloned and clone the others and mark them as cloned
|
||||
let i = 0;
|
||||
for(let [superposition_id, superposition] of Object.entries(superpositions)){
|
||||
i++
|
||||
if (i === 1) {
|
||||
// first superposition of the couple is not cloned
|
||||
this.allSuperpositions_byid[couple_id][superposition_id].cloned = false;
|
||||
continue;
|
||||
}
|
||||
// following superpositions of the couple generate concernement map_item clones
|
||||
// first concernement of the couple
|
||||
clones.push({
|
||||
concernement: this.concernementsByID[superposition[0].cid],
|
||||
superposition_id: superposition_id
|
||||
})
|
||||
// second concernement of the couple
|
||||
clones.push({
|
||||
concernement: this.concernementsByID[superposition[1].cid],
|
||||
superposition_id: superposition_id
|
||||
})
|
||||
|
||||
this.allSuperpositions_byid[couple_id][superposition_id].cloned = true;
|
||||
},
|
||||
watch: {
|
||||
concernements_loaded:{
|
||||
handler (n, o) {
|
||||
if(n && !o){
|
||||
this.parseMapitems()
|
||||
}
|
||||
}
|
||||
return clones;
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
...mapActions(ConcernementsStore,['loadConcernements']),
|
||||
...mapActions(ConcernementsStore,['loadContentTypeDefinition']),
|
||||
...mapActions(UserStore,['checkUser']),
|
||||
// parseSuperposedMapitemsClones () {
|
||||
// let clones = [];
|
||||
// // loop through all superposition grouped by concernements couples
|
||||
// for(let [couple_id, superpositions] of Object.entries(this.allSuperpositions_byid)){
|
||||
// // loop through all superpositions for one concernement couple and mark the first as NOT cloned and clone the others and mark them as cloned
|
||||
// let i = 0;
|
||||
// for(let [superposition_id, superposition] of Object.entries(superpositions)){
|
||||
// i++
|
||||
// if (i === 1) {
|
||||
// // first superposition of the couple is not cloned
|
||||
// this.allSuperpositions_byid[couple_id][superposition_id].cloned = false;
|
||||
// continue;
|
||||
// }
|
||||
// // following superpositions of the couple generate concernement map_item clones
|
||||
// // first concernement of the couple
|
||||
// clones.push({
|
||||
// concernement: this.concernementsByID[superposition[0].cid],
|
||||
// superposition_id: superposition_id
|
||||
// })
|
||||
// // second concernement of the couple
|
||||
// clones.push({
|
||||
// concernement: this.concernementsByID[superposition[1].cid],
|
||||
// superposition_id: superposition_id
|
||||
// })
|
||||
|
||||
// mapitem_opened(concernement){
|
||||
// return concernement.opened;
|
||||
// }
|
||||
// this.allSuperpositions_byid[couple_id][superposition_id].cloned = true;
|
||||
// }
|
||||
// }
|
||||
// this.superposed_cloned_mapitems = clones;
|
||||
// },
|
||||
parseMapitems() {
|
||||
let couple_ids = Object.keys(this.allSuperpositions_byid);
|
||||
console.log('App couple_ids', couple_ids);
|
||||
// loop through all concernement
|
||||
for(let [concernement_id, concernement] of Object.entries(this.concernementsByID)){
|
||||
// create the main mapitem object
|
||||
let mapitem = {
|
||||
id: concernement.id,
|
||||
concernement: concernement,
|
||||
superposition_ids: [],
|
||||
clone: false,
|
||||
}
|
||||
// loop through superposistions couples
|
||||
couple_ids.forEach(couple_id => {
|
||||
let cids = couple_id.match(/(\d+)-(\d+)/i);
|
||||
// console.log('cids', cids);
|
||||
if (concernement.id === parseInt(cids[1]) || concernement.id === parseInt(cids[2])) {
|
||||
let i = 0;
|
||||
for(let [superposition_id, superposition] of Object.entries(this.allSuperpositions_byid[couple_id])){
|
||||
i++;
|
||||
if (i === 1) {
|
||||
mapitem.superposition_ids.push(superposition_id)
|
||||
}else{
|
||||
this.mapitems.push({
|
||||
id: `${concernement.id}___${superposition_id}`,
|
||||
concernement: concernement,
|
||||
superposition_ids: [superposition_id],
|
||||
clone: true
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
this.mapitems.push(mapitem)
|
||||
}
|
||||
console.log('App mapitems', this.mapitems);
|
||||
}
|
||||
},
|
||||
components: {
|
||||
MapConcernements,
|
||||
@ -96,25 +147,22 @@ export default {
|
||||
|
||||
<div id="main-content">
|
||||
<MapConcernements>
|
||||
<template v-for="(concernement,index) in concernements">
|
||||
<template v-for="(mapitem,index) in mapitems">
|
||||
<ConcernementMapItem
|
||||
v-if="concernement.visible"
|
||||
:key="index"
|
||||
:concernement="concernement"
|
||||
:active_revision="concernement.active_revision"
|
||||
v-if="mapitem.concernement.visible && ((map_mode === 'superposition' && mapitem.clone) || !mapitem.clone)"
|
||||
:key="mapitem.id"
|
||||
:mapitem="mapitem"
|
||||
/>
|
||||
</template>
|
||||
<template v-if="map_mode === 'superposition'">
|
||||
<template v-for="(superposition,index) in superposed_clones_concernements">
|
||||
<!-- <template v-if="map_mode === 'superposition'">
|
||||
<template v-for="(mapitem,index) in superposed_cloned_mapitems">
|
||||
<ConcernementMapItem
|
||||
v-if="superposition.concernement.visible"
|
||||
:key="index"
|
||||
:concernement="superposition.concernement"
|
||||
:active_revision="superposition.concernement.active_revision"
|
||||
:superposition_id="superposition.superposition_id"
|
||||
v-if="mapitem.concernement.visible"
|
||||
:key="mapitem.id"
|
||||
:mapitem="mapitem"
|
||||
/>
|
||||
</template>
|
||||
</template>
|
||||
</template> -->
|
||||
</MapConcernements>
|
||||
<div id="content" :class="{'recit-opened':opened_recit}">
|
||||
<RouterView />
|
||||
|
@ -19,6 +19,9 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
id: null,
|
||||
cid: null,
|
||||
concernement: null,
|
||||
active_revision: null,
|
||||
entities: null,
|
||||
superposedEntitesIDsList: [],
|
||||
canvas: null,
|
||||
@ -47,7 +50,7 @@ export default {
|
||||
paper_groups: {}
|
||||
}
|
||||
},
|
||||
props: ['concernement', 'active_revision', 'superposition_id'],
|
||||
props: ['mapitem'],
|
||||
computed: {
|
||||
...mapState(ConcernementsStore,['map_mode',
|
||||
'concernementsByID',
|
||||
@ -61,8 +64,13 @@ export default {
|
||||
'paper_symbol_definitions'])
|
||||
},
|
||||
created () {
|
||||
console.log('ConcernementMapItem', this.mapitem);
|
||||
// this.id = this.superposition_id ? `${this.cid}___${this.superposition_id}` : this.cid;
|
||||
this.id = this.mapitem.id;
|
||||
this.concernement = this.mapitem.concernement;
|
||||
this.cid = this.concernement.id;
|
||||
this.id = this.superposition_id ? `${this.cid}___${this.superposition_id}` : this.cid;
|
||||
this.active_revision = this.concernement.active_revision;
|
||||
|
||||
// console.log(`ConcernementsMapItem ${this.id} created`);
|
||||
// this.entites = this.concernement.entites
|
||||
this.entites = this.concernement.revisions_byid[this.concernement.revision_id].entites;
|
||||
@ -103,7 +111,7 @@ export default {
|
||||
// beforeUnmount () {
|
||||
unmounted () {
|
||||
// console.log(`mapitem ${this.id} unmounted`);
|
||||
if(this.superposition_id) {
|
||||
if(this.mapitem.clone) {
|
||||
// console.log(`this.paper_main_object ${this.paper_main_object.id}`, this.paper_main_object);
|
||||
paper.project.getItem({id:this.paper_main_object.id}).remove();
|
||||
};
|
||||
@ -185,7 +193,9 @@ export default {
|
||||
active_revision: {
|
||||
handler (n, o) {
|
||||
console.log(`concernementMapItem watch active_revision o:${o}, n:${n}`);
|
||||
this.resetPaperActiveRevision();
|
||||
if(o & n){ // do not trigger on first variable filling (if o is null)
|
||||
this.resetPaperActiveRevision();
|
||||
}
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
@ -372,31 +382,12 @@ export default {
|
||||
return num
|
||||
},
|
||||
getSuperposedEntitesIDsList(){
|
||||
|
||||
// find the right entite(s) to display on this original map_item vs cloned map item
|
||||
// (clones are needed for multiple superpositions by concernement couples)
|
||||
// let eids = [];
|
||||
if (this.superposition_id) {
|
||||
// console.log('has superposition_id', this.superposition_id);
|
||||
// if we have a superposition_id prop then we are on a temporary concernement map_item clone
|
||||
// find the right entite id from the superposition_id prop
|
||||
let ids = this.superposition_id.match(/(\d+)_(\d+)__(\d+)_(\d+)/i)
|
||||
// console.log('ids', ids);
|
||||
switch (this.cid) { // get the right eid regarding the cid
|
||||
case parseInt(ids[1]):
|
||||
this.superposedEntitesIDsList.push(parseInt(ids[2]));
|
||||
break;
|
||||
case parseInt(ids[3]):
|
||||
this.superposedEntitesIDsList.push(parseInt(ids[4]));
|
||||
break;
|
||||
}
|
||||
} else if (this.concernement.superpositions) {
|
||||
// console.log('DONOT has superposition_id');
|
||||
// if we do not have a superposition_id prop then we are on the regular concernement map_item
|
||||
// loop through all concernement superpositions and select only thoose which are not part of a temporary cloned
|
||||
if (this.concernement.superpositions) {
|
||||
// loop through all concernement superpositions couples of this concernement
|
||||
for(let [couple_id, superpositions] of Object.entries(this.concernement.superpositions)){
|
||||
// loop through all superpositions of each couple
|
||||
for(let [superposition_id, superposition] of Object.entries(superpositions)){
|
||||
if (!superposition.cloned) { // not part of a clone
|
||||
if (this.mapitem.superposition_ids.indexOf(superposition_id) >= 0) {
|
||||
switch (this.cid) { // get the right eid regarding the cid
|
||||
case superposition[0].cid:
|
||||
this.superposedEntitesIDsList.push(superposition[0].eid);
|
||||
@ -409,7 +400,7 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
// console.log('eids', eids);
|
||||
console.log('superposedEntitesIDsList', this.superposedEntitesIDsList);
|
||||
|
||||
},
|
||||
// MATTER BODY
|
||||
@ -514,7 +505,7 @@ export default {
|
||||
pivot: new paper.Point(this.pos),
|
||||
name: `main_${this.id}`,
|
||||
cid: this.cid,
|
||||
superposition_id: this.superposition_id
|
||||
superposition_id: this.mapitem.superposition_ids[0] // TODO what to do with multiples superpositions ids
|
||||
});
|
||||
|
||||
// the sub items for one concernement
|
||||
@ -667,7 +658,7 @@ export default {
|
||||
const contrs = new paper.Path({
|
||||
name: 'contours',
|
||||
segments: segments,
|
||||
fillColor: 'rgba(255,255,255,0.4)', // this.superposition_id ? 'rgba(255,0,0,0.4)' : 'rgba(255,255,255,0.4)',
|
||||
fillColor: 'rgba(255,255,255,0.4)',
|
||||
// selected: true,
|
||||
strokeColor: '#fff',
|
||||
strokeWidth: 1,
|
||||
@ -1171,9 +1162,9 @@ export default {
|
||||
handlePaperVisibilityOnAfterEnginUpdate(){
|
||||
// contours focused
|
||||
if (!this.isFocused()){
|
||||
this.paper_main_object.children['contours'].fillColor = 'rgba(255,255,255,0.1)'; //this.superposition_id ? "rgba(255,0,0,0.1)" : "rgba(255,255,255,0.1)";
|
||||
this.paper_main_object.children['contours'].fillColor = this.mapitem.clone ? "rgba(255,0,0,0.1)" : "rgba(255,255,255,0.1)";
|
||||
}else{
|
||||
this.paper_main_object.children['contours'].fillColor = 'rgba(255,255,255,0.4)'; //this.superposition_id ? "rgba(255,0,0,0.4)" : "rgba(255,255,255,0.4)";
|
||||
this.paper_main_object.children['contours'].fillColor = this.mapitem.clone ? "rgba(255,0,0,0.4)" : "rgba(255,255,255,0.4)";
|
||||
if (this.is_hover) {
|
||||
this.paper_main_object.children['contours'].strokeColor = "#01ffe2";
|
||||
this.paper_main_object.children['contours'].strokeWidth = 2;
|
||||
@ -1398,7 +1389,8 @@ export default {
|
||||
params: {cid: this.cid},
|
||||
query: {
|
||||
mapitemid: this.id,
|
||||
superposition_id: this.superposition_id
|
||||
// TODO when mapitem not a clone, there is no superposition_id prop
|
||||
superposition_id: this.mapitem.superposition_ids[0]
|
||||
},
|
||||
hash: `#${this.map_mode}`
|
||||
});
|
||||
|
@ -1159,8 +1159,7 @@ export default {
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
},
|
||||
clearSuperpositionsMatterConstraints(){
|
||||
|
@ -61,7 +61,7 @@ export default {
|
||||
if (this.superposition) {
|
||||
let r = null;
|
||||
this.superposition.forEach(s => {
|
||||
if(s.cid !== this.opened_concernement.id){
|
||||
if(this.opened_concernement && s.cid !== this.opened_concernement.id){
|
||||
r = {
|
||||
cid: s.cid,
|
||||
eid: s.eid
|
||||
@ -156,7 +156,7 @@ export default {
|
||||
<PuissanceAgir v-if="map_mode === 'puissancedagir'" :id="cid"/>
|
||||
<Doleancer v-if="map_mode === 'doleancer'" :id="cid"/>
|
||||
</section>
|
||||
<section v-if="map_mode === 'superposition' && superposition" class="concernement clone">
|
||||
<section v-if="map_mode === 'superposition' && superposition && superposed_cid_eid" class="concernement clone">
|
||||
<TerrainDeVie :cid="superposed_cid_eid.cid" :eid="superposed_cid_eid.eid" />
|
||||
</section>
|
||||
<nav class="close-concernement" @click="closeConcernement">
|
||||
|
Loading…
x
Reference in New Issue
Block a user