Exports wall models

playmint · Oct 8, 2024 · b791868 · b791868
1 parent a6cd1bb
commit b791868
Show file tree

Hide file tree

Showing 3 changed files with 57 additions and 7 deletions.
diff --git a/src/App.tsx b/src/App.tsx
@@ -28,6 +28,9 @@ function App() {
   const [enableAudio, setEnableAudio] = useState(false);
   const [isSidebarOpen, setIsSidebarOpen] = useState(false);
   const [radius, setRadius] = useState(200);
+  const [models, setModels] = useState<
+    { name: string; position: THREE.Vector3; rotation: number }[]
+  >([]);
 
   const incrementCubeWidth = useCallback(
     () => setCubeWidth(cubeWidth + 0.5),
@@ -238,6 +241,7 @@ function App() {
           <ExportLevel
             lines={mirrorAllQuadrants ? getMirroredLinesAllQuadrants() : lines}
             thickness={cubeWidth}
+            models={models}
           />
         </div>
         <div className="import-export-container">
@@ -309,6 +313,7 @@ function App() {
           <SpawnRadius radius={radius} />
           <CalcWallModels
             lines={mirrorAllQuadrants ? getMirroredLinesAllQuadrants() : lines}
+            setModels={setModels}
           />
         </Canvas>
         <Overlay

diff --git a/src/CalcWallModels.tsx b/src/CalcWallModels.tsx
@@ -7,16 +7,25 @@ import wall_cornerMediumGLTF from "./assets/walls/wall_cornerMedium2.glb?url";
 
 interface CalcWallModelsProps {
   lines: THREE.Vector3[][];
+  setModels: (
+    models: { name: string; position: THREE.Vector3; rotation: number }[]
+  ) => void;
 }
 
-const CalcWallModels: React.FC<CalcWallModelsProps> = ({ lines }) => {
+const CalcWallModels: React.FC<CalcWallModelsProps> = ({
+  lines,
+  setModels,
+}) => {
   const { scene: wallMedium } = useGLTF(wall_mediumGLTF);
   const { scene: wallLarge } = useGLTF(wall_largeGLTF);
   const { scene: wallCornerMedium } = useGLTF(wall_cornerMediumGLTF);
   const groupRef = useRef<THREE.Group>(null);
+  let models: { name: string; position: THREE.Vector3; rotation: number }[] =
+    [];
 
   useEffect(() => {
     calculateWalls();
+    setModels(models);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [lines]);
 
@@ -25,6 +34,7 @@ const CalcWallModels: React.FC<CalcWallModelsProps> = ({ lines }) => {
     if (groupRef.current) {
       groupRef.current.clear();
     }
+    models = [];
 
     lines.forEach((line) => {
       for (let i = 0; i < line.length - 1; i++) {
@@ -38,15 +48,25 @@ const CalcWallModels: React.FC<CalcWallModelsProps> = ({ lines }) => {
 
         if (isDiagonal) {
           // Place a corner wall
-          placeWall(wallCornerMedium, start, rotation + Math.PI / 4); // Adjust for corner wall orientation
+          placeWall(
+            wallCornerMedium,
+            start,
+            rotation + Math.PI / 4,
+            "wallCornerMedium"
+          );
         } else {
           let remainingDistance = distance;
           const currentPosition = start.clone();
 
           while (remainingDistance > 0) {
             if (remainingDistance >= 20) {
               // Place a large wall
-              placeWall(wallLarge, currentPosition, rotation + Math.PI / 2);
+              placeWall(
+                wallLarge,
+                currentPosition,
+                rotation + Math.PI / 2,
+                "wallLarge"
+              );
               currentPosition.add(
                 new THREE.Vector3(
                   20 * Math.cos(rotation),
@@ -57,7 +77,12 @@ const CalcWallModels: React.FC<CalcWallModelsProps> = ({ lines }) => {
               remainingDistance -= 20;
             } else if (remainingDistance >= 10) {
               // Place a medium wall
-              placeWall(wallMedium, currentPosition, rotation + Math.PI / 2);
+              placeWall(
+                wallMedium,
+                currentPosition,
+                rotation + Math.PI / 2,
+                "wallMedium"
+              );
               currentPosition.add(
                 new THREE.Vector3(
                   10 * Math.cos(rotation),
@@ -76,7 +101,8 @@ const CalcWallModels: React.FC<CalcWallModelsProps> = ({ lines }) => {
   const placeWall = (
     wall: THREE.Object3D,
     position: THREE.Vector3,
-    rotation: number
+    rotation: number,
+    name: string
   ) => {
     const wallClone = wall.clone();
     wallClone.position.copy(position);
@@ -85,6 +111,7 @@ const CalcWallModels: React.FC<CalcWallModelsProps> = ({ lines }) => {
     if (groupRef.current) {
       groupRef.current.add(wallClone);
     }
+    models.push({ name, position: position.clone(), rotation });
   };
 
   return <group ref={groupRef} />;

diff --git a/src/ExportLevel.tsx b/src/ExportLevel.tsx
@@ -11,9 +11,14 @@ interface Wall {
 interface ExportLevelProps {
   lines: THREE.Vector3[][];
   thickness: number;
+  models: { name: string; position: THREE.Vector3; rotation: number }[];
 }
 
-const ExportLevel: React.FC<ExportLevelProps> = ({ lines, thickness }) => {
+const ExportLevel: React.FC<ExportLevelProps> = ({
+  lines,
+  thickness,
+  models,
+}) => {
   const [output, setOutput] = useState("");
 
   const calculateWalls = () => {
@@ -43,6 +48,16 @@ const ExportLevel: React.FC<ExportLevelProps> = ({ lines, thickness }) => {
       }
     });
 
+    const formattedModels = models
+      .map(
+        (model) => `{
+      name: "${model.name}",
+      position: { x: ${model.position.x}, y: ${model.position.y} },
+      rotation: ${model.rotation}
+    }`
+      )
+      .join(",\n    ");
+
     const formattedOutput = `export default {
   walls: [
     ${walls
@@ -55,7 +70,10 @@ const ExportLevel: React.FC<ExportLevelProps> = ({ lines, thickness }) => {
     }`
       )
       .join(",\n    ")}
- ]
+  ],
+  models: [
+    ${formattedModels}
+  ]
 };`;
 
     setOutput(formattedOutput);