Browse Source

added a 3D level object, remain to place 3 levels @ correct height

Bachir Soussi Chiadmi 3 years ago
parent
commit
40c010c630
2 changed files with 39 additions and 23 deletions
  1. 17 17
      src/components/objects/ContentBlock.vue
  2. 22 6
      src/components/objects/Project.vue

+ 17 - 17
src/components/objects/ContentBlock.vue

@@ -169,7 +169,7 @@ export default {
     // }
     // this.position.y = y
 
-    // let face = Math.random()
+    let face = Math.random()
     // // USES 4 FACES
     // if (face < 0.25) {
     //   // gauche
@@ -197,28 +197,28 @@ export default {
     // }
 
     // // USES 2 FACES
-    // if (face < 0.5) {
-    //   // gauche
-    //   this.face = 'left'
-    //   this.position.x = this.prtPosition.x - this.prtSize.x / 2 + 0.1
-    //   this.position.z = this.prtPosition.z - this.prtSize.z / 2 + this.size.x / 2 + Math.random() * (this.prtSize.z - this.size.x / 2)
-    //   this.rotation.y = 90
-    // } else {
-    //   // droite
-    //   this.face = 'right'
-    //   this.position.x = this.prtPosition.x + this.prtSize.x / 2 - 0.1
-    //   this.position.z = this.prtPosition.z - this.prtSize.z / 2 + this.size.x / 2 + Math.random() * (this.prtSize.z - this.size.x / 2)
-    //   this.rotation.y = -90
-    // }
+    if (face < 0.5) {
+      // gauche
+      this.face = 'left'
+      this.position.x = this.prtPosition.x - this.prtSize.x / 2 + 0.1
+      // this.position.z = this.prtPosition.z - this.prtSize.z / 2 + this.size.x / 2 + Math.random() * (this.prtSize.z - this.size.x / 2)
+      this.rotation.y = 90
+    } else {
+      // droite
+      this.face = 'right'
+      this.position.x = this.prtPosition.x + this.prtSize.x / 2 - 0.1
+      // this.position.z = this.prtPosition.z - this.prtSize.z / 2 + this.size.x / 2 + Math.random() * (this.prtSize.z - this.size.x / 2)
+      this.rotation.y = -90
+    }
 
     // With GRID
-    this.face = 'left'
-    this.position.x = this.prtPosition.x - this.prtSize.x / 2 + 0.1
+    // this.face = 'left'
+    // this.position.x = this.prtPosition.x - this.prtSize.x / 2 + 0.1
+    // this.rotation.y = 90
     let pos = this.getGridPos(this.prtIndex)
     console.log('pos', pos)
     this.position.z = this.prtPosition.z - this.prtSize.z / 2 + pos.z
     this.position.y = this.prtPosition.y - this.prtSize.y / 2 + pos.y
-    this.rotation.y = 90
 
     // this.label_position.x = this.position.x - this.size.x / 2 + this.label_size.x / 2 + 0.1
     // this.label_position.y = this.position.y + this.size.y / 2 - this.label_size.y / 2 - 0.1

+ 22 - 6
src/components/objects/Project.vue

@@ -3,6 +3,7 @@
     <object3d ref="block3d" name="Project" :obj="building" :position="building_position"/>
     <object3d ref="top" :obj="top_mesh" :position="top_position"/>
     <object3d ref="floor" :obj="floor_mesh" :position="floor_position"/>
+    <object3d ref="level" :obj="level_mesh" :position="level_position"/>
     <!-- <light :obj="light" :position="building_position" /> -->
     <mesh ref="label3d" name="Label" :position="label_position">
       <geometry type="Plane" :args="[label_size.x, label_size.y]" />
@@ -224,10 +225,7 @@ export default {
     let buildingPos = { ...position }
     buildingPos.z -= 0.5 * size.z
 
-    // let light = new THREE.PointLight(0xfcfcf9, 1)
-    // var sun = new THREE.DirectionalLight(0xfcfcf9, 2)
-    // sun.position.set(-150, 200, 110)
-
+    // TOP & FLOOR
     let topGeom = new THREE.BoxGeometry(size.x, wall.wallW, size.z)
     let topOpts = {
       color: new THREE.Color(`hsl(${hTop}, ${sTop}%, ${lTop}%)`),
@@ -239,17 +237,33 @@ export default {
     let topPosition = { ...position }
     topPosition.y += 0.5 * size.y
 
-    let floorGeom = new THREE.BoxGeometry(size.x, wall.wallW, size.z)
+    // let floorGeom = new THREE.BoxGeometry(size.x, wall.wallW, size.z)
     let floorOpts = {
       color: new THREE.Color(`hsl(${hFloor}, ${sFloor}%, ${lFloor}%)`),
       // side: THREE.DoubleSide,
       shininess: 10
     }
     let floorMat = new THREE.MeshPhongMaterial(floorOpts)
-    let floorMesh = new THREE.Mesh(floorGeom, floorMat)
+    let floorMesh = new THREE.Mesh(topGeom, floorMat)
     let floorPosition = { ...position }
     floorPosition.y -= 0.5 * size.y
 
+    // LEVELS
+    let levelGeom = new THREE.BoxGeometry(size.x, 1, size.z)
+    let levelMesh = new THREE.Mesh(levelGeom)
+    let levelBSP = new ThreeBSP(levelMesh)
+    let levelHoleGeom = new THREE.BoxGeometry(size.x - 3, 1, size.z - 3)
+    let levelHoleMesh = new THREE.Mesh(levelHoleGeom)
+    let levelHoleBSP = new ThreeBSP(levelHoleMesh)
+    levelBSP = levelBSP.subtract(levelHoleBSP)
+    levelMesh = levelBSP.toMesh()
+    let levelOpts = {
+      color: 0xff0000,
+      shininess: 10
+    }
+    let levelMat = new THREE.MeshPhongMaterial(levelOpts)
+    levelMesh.material = levelMat
+
     return {
       block3d: null,
       // block_opts: materialOpts,
@@ -273,6 +287,8 @@ export default {
       top_position: topPosition,
       floor_mesh: floorMesh,
       floor_position: floorPosition,
+      level_mesh: levelMesh,
+      level_position: { ...position },
       label_position: { x: 0, y: 0, z: 0 },
       color: 0xffffff,
       label_canvas: null,