add collision detection for objects

app/components/FirstPersonControls.tsx

@@ -22,18 +22,18 @@ export const FirstPersonControls = (speed) => {
   const rooms = [
     {
       minX: -50, maxX: 50, minY: 0, maxY: 20, minZ: -50, maxZ: 50,
-      slopes: [
-        { angle: Math.PI / 3, position: { x: 0, y: 0, z: 0 }, width: 10, length: 50 },
-        { angle: Math.PI / 3, position: { x: 10, y: 5, z: 5 }, width: 5, length: 50 }
-      ],
+      slopes: [],
       objects: [
-        { minX: 5, maxX: 10, minY: 5, maxY: 10, minZ: -50, maxZ: 10 }
+        { minX: 10, maxX: 15, minY: 0, maxY: 15, minZ: 10, maxZ: 15 }
       ]
     },
     {
       minX: 50, maxX: 60, minY: 0, maxY: 10, minZ: 0, maxZ: 10,
       slopes: [
-        { angle: Math.PI / 2, position: { x: 10, y: 5, z: 5 }, width: 5, length: 10 }
+        { angle: Math.PI / 2, position: { x: 10, y: 5, z: 5 }, width: 5, length: 10 },
+        { angle: Math.PI / 3, position: { x: 0, y: 0, z: 0 }, width: 10, length: 50 },
+        { angle: Math.PI / 3, position: { x: 10, y: 5, z: 5 }, width: 5, length: 50 }
+
         ],
       objects: []
     },
@@ -129,6 +129,29 @@ export const FirstPersonControls = (speed) => {
       );
       scene.add(roomBox);
 
+      room.objects.forEach(object => {
+
+          const objectGeometry = new THREE.BoxGeometry(
+            object.maxX - object.minX,
+            object.maxY - object.minY,
+            object.maxZ - object.minZ
+          );
+          const objectMaterial = new THREE.MeshBasicMaterial({
+            color: 0xff0000,
+            transparent: true,
+            opacity: 0.25,
+            wireframe: true
+          });
+          const objectBox = new THREE.Mesh(objectGeometry, objectMaterial);
+          objectBox.position.set(
+            (room.minX + object.minX - room.maxX + object.maxX) / 2,
+            (room.minY + object.minY - room.maxY + object.maxY) / 2,
+            (room.minZ + object.minZ - room.maxZ + object.maxZ) / 2
+          );
+          objectBox.name = `object-${room.minX}-${room.maxX}-${room.minZ}-${room.maxZ}`;
+          scene.add(objectBox);
+        });
+
       // Add slopes to the scene
       room.slopes.forEach((slope, index) => {
         const slopeGeometry = new THREE.PlaneGeometry(slope.width, slope.length);
@@ -144,9 +167,10 @@ export const FirstPersonControls = (speed) => {
           (room.minY + room.maxY) / 2 + slope.position.y,
           room.minZ + (room.maxZ - room.minZ) / 2 + slope.position.z
         );
-        slopeMesh.name = `slope-${room.minX}-${room.maxX}-${room.minZ}-${room.maxZ}-${index}`; // Naming slopes to easily find them later
+        slopeMesh.name = `slope-${room.minX}-${room.maxX}-${room.minZ}-${room.maxZ}-${index}`;
         scene.add(slopeMesh);
       });
+
     });
 
     return () => {
@@ -179,7 +203,7 @@ export const FirstPersonControls = (speed) => {
       velocity.addScaledVector(direction, movementSpeed * delta);
     }
 
-    const newPosition = camera.position.clone().addScaledVector(velocity, delta);
+    let newPosition = camera.position.clone().addScaledVector(velocity, delta);
 
     // find the room the user is currently in
     let currentRoom = rooms.find(room =>
@@ -195,12 +219,23 @@ export const FirstPersonControls = (speed) => {
       newPosition.z >= room.minZ && newPosition.z <= room.maxZ
     );
 
+    // Boundary checks for objects in the room
+    const object = currentRoom.objects.find(object =>
+      newPosition.x >= currentRoom.minX + object.minX  && newPosition.x <= currentRoom.minX + object.minX + (object.maxX - object.minX) &&
+      newPosition.y >= currentRoom.minY + object.minY - 10 && newPosition.y <= currentRoom.minY + object.minY - 10 + (object.maxY - object.minY) &&
+      newPosition.z >= currentRoom.minZ + object.minZ && newPosition.z <= currentRoom.minZ + object.minZ + (object.maxZ - object.minZ)
+    );
+
+    if (object) {
+        newPosition = camera.position;
+    }
+
     // detect if user is going into another room
     if (currentRoom && nextRoom && currentRoom !== nextRoom) {
       currentRoom = nextRoom;
     }
 
-    if (currentRoom) {
+    if (currentRoom && !object) {
       // Boundary checks for the current room
       newPosition.x = Math.max(currentRoom.minX, Math.min(currentRoom.maxX, newPosition.x));
       newPosition.z = Math.max(currentRoom.minZ, Math.min(currentRoom.maxZ, newPosition.z));