Refactor scenes into separate files

scenes/scene-lowg.js

@@ -0,0 +1,83 @@
+(() => {
+  const { Bodies } = Matter;
+  const scenes =
+    (window.PhysilinksSceneDefs = window.PhysilinksSceneDefs || []);
+
+  scenes.push({
+    id: "scene2",
+    name: "Low-G terraces",
+    config: {
+      gravity: 0.65,
+      spawnIntervalMs: 600,
+      minChain: 3,
+      palette: ["#fb7185", "#fbbf24", "#34d399", "#38bdf8"],
+      ballRadius: 22,
+      link: {
+        stiffness: 0.6,
+        lengthScale: 1,
+        damping: 0.01,
+        lineWidth: 4,
+        rope: false,
+        renderType: "spring",
+        maxLengthMultiplier: 4.7,
+      },
+    },
+    createBodies: (w, h) => {
+      const floorHeight = Math.max(70, h * 0.12);
+      const wallThickness = Math.max(32, w * 0.05);
+      const wallHeight = h * 1.8;
+      const ledgeHeight = Math.max(14, h * 0.022);
+      const leftWidth = Math.max(160, w * 0.18);
+      const midWidth = Math.max(190, w * 0.26);
+      const rightWidth = Math.max(150, w * 0.18);
+      return [
+        Bodies.rectangle(
+          w / 2,
+          h + floorHeight / 2,
+          w + wallThickness * 2,
+          floorHeight,
+          {
+            isStatic: true,
+            restitution: 0.9,
+            render: { fillStyle: "#0ea5e9", strokeStyle: "#0ea5e9" },
+          },
+        ),
+        Bodies.rectangle(
+          -wallThickness / 2,
+          h / 2,
+          wallThickness,
+          wallHeight,
+          {
+            isStatic: true,
+            render: { fillStyle: "#7c3aed", strokeStyle: "#7c3aed" },
+          },
+        ),
+        Bodies.rectangle(
+          w + wallThickness / 2,
+          h / 2,
+          wallThickness,
+          wallHeight,
+          {
+            isStatic: true,
+            render: { fillStyle: "#7c3aed", strokeStyle: "#7c3aed" },
+          },
+        ),
+        Bodies.rectangle(w * 0.2, h * 0.45, leftWidth, ledgeHeight, {
+          isStatic: true,
+          angle: 0.08,
+          render: { fillStyle: "#f97316", strokeStyle: "#f97316" },
+        }),
+        Bodies.rectangle(w * 0.5, h * 0.6, midWidth, ledgeHeight, {
+          isStatic: true,
+          angle: -0.04,
+          render: { fillStyle: "#14b8a6", strokeStyle: "#14b8a6" },
+        }),
+        Bodies.rectangle(w * 0.8, h * 0.42, rightWidth, ledgeHeight, {
+          isStatic: true,
+          angle: 0.14,
+          render: { fillStyle: "#c084fc", strokeStyle: "#c084fc" },
+        }),
+      ];
+    },
+  });
+})();