Added 3 additional presets that have modules inside the perimeter

index.html

@@ -67,6 +67,9 @@
                     <button id="preset-4rect" type="button">4-Wheel Rectangle</button>
                     <button id="preset-6wheel" type="button">6-Wheel Hexagon</button>
                     <button id="preset-8wheel" type="button">8-Wheel Octagon</button>
+                    <button id="preset-8square" type="button">8-Wheel Square</button>
+                    <button id="preset-12hex" type="button">12-Wheel Hexagon</button>
+                    <button id="preset-16oct" type="button">16-Wheel Octogon</button>
                 </div>
             </fieldset>
             <fieldset>

script.js

@@ -159,7 +159,7 @@ const PresetConfigs = {
         return modules;
     },
 
-    eightWheel: (size) => {
+    eightWheelOctogon: (size) => {
         const radius = size / 2;
         const modules = [];
         for (let i = 0; i < 8; i++) {
@@ -171,7 +171,64 @@ const PresetConfigs = {
             });
         }
         return modules;
-    }
+    },
+
+    eightWheelSquare: (size) => {
+        const full = size;
+        const half = size / 2;
+        return [
+            { x: full, y: full, name: "Outer FL" },
+            { x: full, y: -full, name: "Outer FR" },
+            { x: -full, y: full, name: "Outer BL" },
+            { x: -full, y: -full, name: "Outer BR" },
+            { x: half, y: half, name: "Inner FL" },
+            { x: half, y: -half, name: "Inner FR" },
+            { x: -half, y: half, name: "Inner BL" },
+            { x: -half, y: -half, name: "Inner BR" }
+        ];
+    },
+
+    twelveWheelHexagon: (size) => {
+        const outerRadius = size;
+        const innerRadius = size / 2;
+        const modules = [];
+        for (let i = 0; i < 6; i++) {
+            const angle = (Math.PI / 2) + (i * Math.PI / 3);
+            modules.push({
+                x: outerRadius * Math.cos(angle),
+                y: outerRadius * Math.sin(angle),
+                name: `Module ${i + 1}`
+            });
+
+            modules.push({
+                x: innerRadius * Math.cos(angle),
+                y: innerRadius * Math.sin(angle),
+                name: `Module ${i + 7}`
+            });
+        }
+        return modules;
+    },
+
+    sixteenWheelOctogon: (size) => {
+        const outerRadius = size;
+        const innerRadius = size / 2;
+        const modules = [];
+        for (let i = 0; i < 8; i++) {
+            const angle = (Math.PI / 2) + (i * Math.PI / 4);
+            modules.push({
+                x: outerRadius * Math.cos(angle),
+                y: outerRadius * Math.sin(angle),
+                name: `Module ${i + 1}`
+            });
+
+            modules.push({
+                x: innerRadius * Math.cos(angle),
+                y: innerRadius * Math.sin(angle),
+                name: `Module ${i + 9}`
+            });
+        }
+        return modules;
+    },
 };
 
 /*
@@ -205,6 +262,9 @@ const preset4WheelBtn = document.getElementById('preset-4wheel');
 const preset4RectBtn = document.getElementById('preset-4rect');
 const preset6WheelBtn = document.getElementById('preset-6wheel');
 const preset8WheelBtn = document.getElementById('preset-8wheel');
+const preset8SquareBtn = document.getElementById('preset-8square');
+const preset12HexBtn = document.getElementById('preset-12hex');
+const preset16OctBtn = document.getElementById('preset-16oct');
 
 /*
 * END DOM VARIABLES
@@ -284,13 +344,39 @@ preset6WheelBtn.addEventListener('click', () => {
 });
 
 preset8WheelBtn.addEventListener('click', () => {
-    const positions = PresetConfigs.eightWheel(robotSize);
+    const positions = PresetConfigs.eightWheelOctogon(robotSize);
     robot.setModules(positions);
     robot.setName("8-Wheel Octogon");
     createModuleDisplays(robot);
     updateModuleDisplays(robot);
 });
 
+preset8SquareBtn.addEventListener('click', () => {
+    const positions = PresetConfigs.eightWheelSquare(robotSize);
+    robot.setModules(positions);
+    robot.setName("8-Wheel Square");
+    createModuleDisplays(robot);
+    updateModuleDisplays(robot);
+});
+
+preset12HexBtn.addEventListener('click', () => {
+    const positions = PresetConfigs.twelveWheelHexagon(robotSize);
+    robot.setModules(positions);
+    robot.setName("12-Wheel Hexagon");
+    createModuleDisplays(robot);
+    updateModuleDisplays(robot);
+});
+
+preset16OctBtn.addEventListener('click', () => {
+    const positions = PresetConfigs.sixteenWheelOctogon(robotSize);
+    robot.setModules(positions);
+    robot.setName("16-Wheel Octogon");
+    createModuleDisplays(robot);
+    updateModuleDisplays(robot);
+});
+
+
+
 generateInputsBtn.addEventListener('click', () => {
     const count = parseInt(moduleCountInput.value);