made mapPopup hover proximites

This commit is contained in:
Bachir Soussi Chiadmi 2023-10-26 12:11:45 +02:00
parent fcce41aa77
commit 5a6a71359d
3 changed files with 61 additions and 13 deletions

View File

@ -716,6 +716,7 @@ body{
}
}
.entite-map-popup,
.entite-proximite-reference-map-popup,
.besoin-map-popup,
.reponse-map-popup{
background-color: white;
@ -737,7 +738,20 @@ body{
color: #01ffe2;
}
}
h1, div{
.entite-proximite-reference-map-popup{
span.point{
font-weight: 900;
}
h1.ref-entite span.point{
color: #01ffe2;
}
div.conjunction,h2{
font-size: 0.756em;
font-weight: 400;
margin: 0.5em
}
}
h1, h2, span, div{
font-size: 1em;
font-weight: 400;
}

View File

@ -540,6 +540,9 @@ export default {
this.initPaperEvents()
},
/*
* called by openClose() function
*/
setPaperContents(){
// trigered once opening tween is complete
this.clearPaperContents();
@ -589,7 +592,8 @@ export default {
this.paper_main_object.addChild(this.setPaperEntites());
},
clearPaperContents(){
let clearable_children = ['boussole_bg', 'entites',
let clearable_children = ['boussole_bg', 'entites',
'entites_proximites_references',
'puissanceagir_bg','puissanceagir_besoins',
'agissantes',
'doleance_bg', 'doleances'];
@ -850,6 +854,11 @@ export default {
let e=0;
entite.entite.proximite.forEach(entite_ref => {
// console.log(`${entite_ref.id}, ${entite_ref.title}`, this.allEntitesById[entite_ref.id]);
// get the concernement parents of the proximite reference
let ref_cid = this.allEntitesById[entite_ref.id].cid;
// console.log('PROXIMITE ref concernement jarvis_envelope_convexe', this.concernementsByID[ref_cid].sailentEntites);
let ref_concernement = this.concernementsByID[ref_cid];
// create the entite ref paper point
let ref_instance = new paper.SymbolItem(this.paper_symbol_definitions['entite']);
@ -867,14 +876,12 @@ export default {
ref_instance.fillColor = '#000';
ref_instance.item_id = entite_ref.id;
ref_instance.item_type = 'entite_proximite_reference';
ref_instance.ref_cid = ref_cid;
ref_instance.parent_eid = entite.entite.id;
ref_instance.is_symbol_instance = true;
ref_g.addChild(ref_instance)
// create the original concernement contours arround the entite_ref
let ref_cid = this.allEntitesById[entite_ref.id].cid;
// console.log('PROXIMITE ref concernement jarvis_envelope_convexe', this.concernementsByID[ref_cid].sailentEntites);
let ref_concernement = this.concernementsByID[ref_cid];
// define the right scale
let scale = 0.05;
@ -945,6 +952,7 @@ export default {
// })
// ref_g.addChild(p);
// })
// // end debug
// general contour arround proximité
// console.log('allEntiteRefConcernementContourEntites', allEntiteRefConcernementContourEntites);
@ -1623,7 +1631,9 @@ export default {
}
},
// PAPER EVENTS
/*
* PAPER EVENTS
*/
initPaperEvents(){
this.paper_main_object.onMouseLeave = function(event){
@ -1681,6 +1691,9 @@ export default {
case "terraindevie":
paper_group_tohit = this.paper_main_object.children['entites'];
break;
case "proximite":
paper_group_tohit = this.paper_main_object.children['entites_proximites_references'];
break;
case "superposition":
paper_group_tohit = this.paper_main_object.children['entites_superposes'];
break;
@ -1707,6 +1720,10 @@ export default {
id: result.item.item_id
};
switch (result.item.item_type) {
case "entite_proximite_reference":
new_hover_elmt.ref_cid = result.item.ref_cid;
new_hover_elmt.parent_eid = result.item.parent_eid;
break;
case "besoin":
new_hover_elmt.no_popup = true;
break;

View File

@ -17,6 +17,7 @@ export default {
type: null,
concernement: null,
entites: null,
entite_parent: null,
besoin: null,
reponse: null,
superposition: null,
@ -51,15 +52,22 @@ export default {
},
methods: {
parseInfos(){
console.log('mapPopup infos', this.infos);
switch (this.infos.type) {
case 'concernement':
this.concernement = this.concernementsByID[this.infos.cid];
break;
case 'entite':
case 'entite_proximite':
case 'entite_superpose':
case 'entite_action':
this.entites = [this.allEntitesById[this.infos.id]];
break;
case 'entite_proximite_reference':
this.entites = [this.allEntitesById[this.infos.id]];
this.concernement = this.concernementsByID[this.infos.ref_cid];
this.entite_parent = this.allEntitesById[this.infos.parent_eid];
break;
case 'besoin':
this.besoin = this.allBesoinsById[this.infos.id];
break;
@ -152,7 +160,7 @@ export default {
</div>
</section>
<section v-if="infos.type === 'entite' || infos.type === 'entite_action' || infos.type === 'superposition' || infos.type === 'entite_superpose'" class="entite-map-popup">
<section v-if="infos.type === 'entite' || infos.type === 'entite_action' || infos.type === 'superposition' || infos.type === 'entite_superpose' || infos.type === 'entite_proximite'" class="entite-map-popup">
<template
v-for="(entite, index) of entites"
:key="index"
@ -161,16 +169,25 @@ export default {
</template>
</section>
<section v-if="infos.type === 'entite_proximite_reference'" class="entite-proximite-reference-map-popup">
<h1 class="parent-entite"><span class="point">&bull;</span> {{ entite_parent.entite.title }}</h1>
<div class="conjunction">entité a proximité</div>
<h1 class="ref-entite"><span class="point">&bull;</span> {{ entites[0].entite.title }}</h1>
<h2>{{ concernement.title }}</h2>
</section>
<section v-if="infos.type === 'besoin'" class="besoin-map-popup">
<div v-html="besoin.description"></div>
</section>
<section v-if="infos.type === 'reponse'" class="reponse-map-popup">
<div v-if="reponse.qui"><label>Qui</label><p v-html="truncate(reponse.qui, 100, true)"/></div>
<div v-if="reponse.quoi"><label>Quoi</label><p v-html="truncate(reponse.quoi, 100, true)"/></div>
<div v-if="reponse.ou"><label></label><p v-html="truncate(reponse.ou, 100, true)"/></div>
<div v-if="reponse.avec"><label>Avec</label><p v-html="truncate(reponse.avec, 100, true)"/></div>
<div v-if="reponse.qui"><label>Qui</label><p v-html="truncate(reponse.qui, 100, true)"/></div>
<div v-if="reponse.quoi"><label>Quoi</label><p v-html="truncate(reponse.quoi, 100, true)"/></div>
<div v-if="reponse.ou"><label></label><p v-html="truncate(reponse.ou, 100, true)"/></div>
<div v-if="reponse.avec"><label>Avec</label><p v-html="truncate(reponse.avec, 100, true)"/></div>
</section>
</div>
</div>
</template>