added fadein intro to mapitems #2235

src/App.vue

@@ -151,22 +151,16 @@ export default {
 
   <div id="main-content">
     <MapConcernements>
-      <template v-for="(mapitem,index) in mapitems">
-        <ConcernementMapItem
-          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="(mapitem,index) in superposed_cloned_mapitems">
+      <!-- <div class="loading" v-if="mapitems.length === 0">Chargement ...</div> -->
+      <!-- <template v-else> -->
+        <template v-for="(mapitem,index) in mapitems">
           <ConcernementMapItem
-            v-if="mapitem.concernement.visible"
+            v-if="mapitem.concernement.visible && ((map_mode === 'superposition' && mapitem.clone) || !mapitem.clone)"
             :key="mapitem.id"
             :mapitem="mapitem"
           />
         </template>
-      </template> -->
+      <!-- </template> -->
     </MapConcernements>
     <div id="content" :class="{'recit-opened':opened_recit}">
       <RouterView />

src/assets/main.scss

@@ -83,7 +83,12 @@ body{
   }
 
   #map-concernements{
-
+    div.loading{
+      position: absolute;
+      top:50%;
+      left:50%;
+      z-index: 200;
+    }
   }
 
   #map-nav{

src/components/ConcernementMapItem.vue

@@ -521,6 +521,9 @@ export default {
         superposition_id: this.mapitem.superposition_ids[0] // TODO what to do with multiples superpositions ids
       });
 
+      // fadein intro
+      this.paper_main_object.opacity = (1 + Math.random())*0.001;
+
       // the sub items for one concernement
       this.paper_main_object.addChild(this.setPaperContour());
 
@@ -2138,6 +2141,13 @@ export default {
 
       this.paper_main_object.position = this.pos = this.body.position;
 
+      // fadein intro
+      if (this.paper_main_object.opacity < 9) {
+        this.paper_main_object.opacity = this.paper_main_object.opacity * 1.04;
+      } else{
+        this.paper_main_object.opacity = 1;
+      }
+
       this.handlePaperVisibilityOnAfterEnginUpdate()
 
     },