diff --git a/app/src/modules/builder/wall/Instances/instance/helpers/useWallClassification.ts b/app/src/modules/builder/wall/Instances/instance/helpers/useWallClassification.ts
index 00b7eaa..5ae9a21 100644
--- a/app/src/modules/builder/wall/Instances/instance/helpers/useWallClassification.ts
+++ b/app/src/modules/builder/wall/Instances/instance/helpers/useWallClassification.ts
@@ -120,7 +120,6 @@ export function useWallClassification(walls: Walls) {
}
});
- console.log('rooms: ', rooms);
return rooms;
};
diff --git a/app/src/modules/builder/wall/Instances/wallInstances.tsx b/app/src/modules/builder/wall/Instances/wallInstances.tsx
index eacf943..37f07e0 100644
--- a/app/src/modules/builder/wall/Instances/wallInstances.tsx
+++ b/app/src/modules/builder/wall/Instances/wallInstances.tsx
@@ -1,15 +1,22 @@
import React, { useEffect, useMemo } from 'react';
+import { DoubleSide, RepeatWrapping, Shape, SRGBColorSpace, TextureLoader, Vector2, Vector3 } from 'three';
+import { Geometry } from '@react-three/csg';
+import { Html, Extrude } from '@react-three/drei';
import { useWallStore } from '../../../../store/builder/useWallStore'
-import WallInstance from './instance/wallInstance';
+import { useWallClassification } from './instance/helpers/useWallClassification';
+import { useToggleView } from '../../../../store/builder/store';
import Line from '../../line/line';
import Point from '../../point/point';
-import { useToggleView } from '../../../../store/builder/store';
-import { Geometry } from '@react-three/csg';
-import { Vector3 } from 'three';
-import { Html } from '@react-three/drei';
+import WallInstance from './instance/wallInstance';
+import * as Constants from '../../../../types/world/worldConstants';
+
+import texturePath from "../../../../assets/textures/floor/white.png";
+import texturePathDark from "../../../../assets/textures/floor/black.png";
+import { useLoader } from '@react-three/fiber';
function WallInstances() {
const { walls } = useWallStore();
+ const { rooms } = useWallClassification(walls)
const { toggleView } = useToggleView();
useEffect(() => {
@@ -34,15 +41,22 @@ function WallInstances() {
return (
<>
-
{!toggleView && (
-
-
- {walls.map((wall) => (
-
+ <>
+
+
+ {walls.map((wall) => (
+
+ ))}
+
+
+
+
+ {rooms.map((room, index) => (
+
))}
-
-
+
+ >
)}
{toggleView && (
@@ -97,4 +111,36 @@ function WallInstances() {
)
}
-export default WallInstances
+export default WallInstances;
+
+function Floor({ room }: { room: Point[] }) {
+ const savedTheme: string | null = localStorage.getItem('theme');
+ const textureScale = Constants.floorConfig.textureScale;
+ const floorTexture = useLoader(TextureLoader, savedTheme === "dark" ? texturePathDark : texturePath);
+ floorTexture.wrapS = floorTexture.wrapT = RepeatWrapping;
+ floorTexture.repeat.set(textureScale, textureScale);
+ floorTexture.colorSpace = SRGBColorSpace;
+
+ const shape = useMemo(() => {
+ const shape = new Shape();
+ const points = room.map(p => new Vector2(p.position[0], p.position[2]));
+ if (points.length < 3) return null;
+ shape.moveTo(points[0].x, points[0].y);
+ points.forEach((pt) => { shape.lineTo(pt.x, pt.y); });
+ return shape;
+ }, [room]);
+
+ if (!shape) return null;
+
+ return (
+
+
+
+
+
+ );
+}
diff --git a/app/src/modules/builder/wall/wallCreator/wallCreator.tsx b/app/src/modules/builder/wall/wallCreator/wallCreator.tsx
index e263571..61af916 100644
--- a/app/src/modules/builder/wall/wallCreator/wallCreator.tsx
+++ b/app/src/modules/builder/wall/wallCreator/wallCreator.tsx
@@ -243,7 +243,7 @@ function WallCreator() {
canvasElement.removeEventListener("click", onMouseClick);
canvasElement.removeEventListener("contextmenu", onContext);
};
- }, [gl, camera, scene, raycaster, pointer, plane, toggleView, toolMode, activeLayer, socket, tempPoints, isCreating, addWall, getWallPointById, snappedPosition, snappedPoint]);
+ }, [gl, camera, scene, raycaster, pointer, plane, toggleView, toolMode, activeLayer, socket, tempPoints, isCreating, addWall, getWallPointById, wallThickness, wallHeight, insideMaterial, outsideMaterial, snappedPosition, snappedPoint]);
return (
<>