Update script.js

script.js

@@ -54,13 +54,14 @@ function generateShapes(maxWidth, maxHeight, minShapes, maxShapes, lines) {
 
         if (isShapeValid(newShape, shapes, lines)) {
             shapes.push(newShape);
-            console.log("how many shapes:", shapes)
+            console.log("how many shapes:", shapes.length);
         }
-
-     return shapes;
     }
+
+    return shapes;
 }
 
+
 function generateQuadrangleBetweenLines(lines, maxWidth, maxHeight) {
     // Separate vertical and horizontal lines
     let verticalLines = lines.filter(line => line.orientation === 'vertical').sort((a, b) => a.x - b.x);
@@ -78,10 +79,11 @@ function generateQuadrangleBetweenLines(lines, maxWidth, maxHeight) {
     return {
         x: vertGap.start + vertGap.thickness,
         y: horizGap.start + horizGap.thickness,
-        width: vertGap.end - vertGap.start - vertGap.thickness,
-        height: horizGap.end - horizGap.start - horizGap.thickness
+        width: vertGap.end - (vertGap.start + vertGap.thickness),
+        height: horizGap.end - (horizGap.start + horizGap.thickness)
     };
 }
+}
 
 function selectRandomGap(lines, maxDimension) {
         let gapIndex = Math.floor(Math.random() * (lines.length - 1));
@@ -168,7 +170,7 @@ function placeButtons(shapes) {
     shapes.forEach(shape => {
         if (placedButtons < buttons.length) {
             let button = document.getElementById(buttons[placedButtons]);
-            button.style.position = 'absolute';
+            button.style.position = "absolute";
             button.style.left = `${shape.x + (shape.width / 2)}px`;
             button.style.top = `${shape.y + (shape.height / 2)}px`;
             placedButtons++;