contents are placed on inner faces of building, with visibles above surface and others below

src/components/objects/Project.vue

@@ -13,7 +13,30 @@
       </material>
     </mesh>
     <div v-if="isOpened">
-      <ContentBlock v-for="n in 10" :key="n" :prtPosition="position" :prtSize="size" />
+      <ContentBlock
+        v-for="item in data.visibles"
+        :key="item.id"
+        :prtPosition="position"
+        :prtSize="size"
+        type="visible"
+        :data="item"
+        />
+      <ContentBlock
+        v-for="item in data.contexts"
+        :key="item.id"
+        :prtPosition="position"
+        :prtSize="size"
+        type="context"
+        :data="item"
+        />
+      <ContentBlock
+        v-for="item in data.processes"
+        :key="item.id"
+        :prtPosition="position"
+        :prtSize="size"
+        type="process"
+        :data="item"
+        />
     </div>
   </div>
 </template>
@@ -69,7 +92,7 @@ export default {
     }
   },
   created () {
-    // console.log('this.index', this.index)
+    console.log('Project created: data', this.data)
     // randomize size and positions
     this.size.y = 100 + Math.random() * 90
     this.size.z = 10 + Math.random() * 30
@@ -78,7 +101,7 @@ export default {
     this.position.y = -1 * this.size.y / 2 + 10 + Math.random() * 30// -10 + Math.random() * this.size.y / 2
     this.position.z = -10 + Math.random() * 10
 
-    this.label_canvas = this.createLabelCanvas(this.data.Titre.replace(/ /g, '\n').toUpperCase(), 48)
+    this.label_canvas = this.createLabelCanvas(this.data.Titre.replace(/ /g, '\n').toUpperCase(), 48, 21, '#000000')
     this.label_position.x = this.position.x - this.size.x / 2 + this.label_size.x / 2 + 1
     this.label_position.y = this.position.y + this.size.y / 2 - this.label_size.y / 2 - 1
     this.label_position.z = this.position.z + this.size.z / 2 + 0.1