Refactor scenes into separate files

2025-12-13 14:03:52 +01:00
parent a4fdcdb35f
commit 357922510a
7 changed files with 417 additions and 2 deletions
--- a/scenes/scene-grid.js
+++ b/scenes/scene-grid.js
@@ -0,0 +1,129 @@
+(() => {
+  const { Bodies } = Matter;
+  const scenes = (window.PhysilinksSceneDefs =
+    window.PhysilinksSceneDefs || []);
+
+  scenes.push({
+    id: "scene-grid",
+    name: "Zero-G Grid (default)",
+    config: {
+      gravity: 0,
+      spawnIntervalMs: 0,
+      autoSpawn: false,
+      minChain: 3,
+      palette: ["#38bdf8", "#f472b6", "#facc15", "#34d399", "#a78bfa"],
+      ballRadius: 24,
+      gridPadding: 0.08, // percent of viewport padding applied to both axes
+      gridBallScale: 0.38, // percent of cell size used as radius
+      gridLegend: {
+        A: "#38bdf8",
+        B: "#f472b6",
+        C: "#facc15",
+        D: "#34d399",
+        E: "#a78bfa",
+      },
+      winCondition: {
+        type: "clearCount",
+        target: 25,
+        nextSceneId: "scene1",
+        onWin: { setGravity: 0.88 },
+      },
+      gridLayouts: [
+        [
+          "AABBBBAA",
+          "ACCCBCCA",
+          "ACDDDDCA",
+          "ACEEEECA",
+          "ACEEEECA",
+          "ACDDDDCA",
+          "ACCCBCCA",
+          "AABBBBAA",
+        ],
+        [
+          "AAAABBBA",
+          "ABBBCCCA",
+          "ABCDDDCA",
+          "ABCEEECA",
+          "ABCEEECA",
+          "ABCDDDCA",
+          "ABBBCCCA",
+          "AAAABBBA",
+        ],
+        [
+          "AABBCCDD",
+          "ABBCCDEE",
+          "ABCCDEEA",
+          "ACCDDEEA",
+          "ACCDDEEA",
+          "ABCCDEEA",
+          "ABBCCDEE",
+          "AABBCCDD",
+        ],
+      ],
+      link: {
+        stiffness: 0.82,
+        lengthScale: 1.05,
+        damping: 0.06,
+        lineWidth: 3,
+        rope: true,
+        renderType: "line",
+        maxLengthMultiplier: 3.8,
+      },
+    },
+    createBodies: (w, h) => {
+      const pad = 0.08;
+      const usableW = w * (1 - pad * 2);
+      const usableH = h * (1 - pad * 2);
+      const gridSize = Math.min(usableW, usableH);
+      const gridX = (w - gridSize) / 2;
+      const gridY = (h - gridSize) / 2;
+      const wallThickness = Math.max(18, gridSize * 0.045);
+      const innerW = gridSize;
+      const innerH = gridSize;
+      const cx = gridX + innerW / 2;
+      const cy = gridY + innerH / 2;
+      return [
+        Bodies.rectangle(
+          cx,
+          gridY - wallThickness / 2,
+          innerW + wallThickness * 2,
+          wallThickness,
+          {
+            isStatic: true,
+            render: { fillStyle: "#0b1222", strokeStyle: "#0b1222" },
+          },
+        ),
+        Bodies.rectangle(
+          cx,
+          gridY + innerH + wallThickness / 2,
+          innerW + wallThickness * 2,
+          wallThickness,
+          {
+            isStatic: true,
+            render: { fillStyle: "#0b1222", strokeStyle: "#0b1222" },
+          },
+        ),
+        Bodies.rectangle(
+          gridX - wallThickness / 2,
+          cy,
+          wallThickness,
+          innerH + wallThickness * 2,
+          {
+            isStatic: true,
+            render: { fillStyle: "#0b1222", strokeStyle: "#0b1222" },
+          },
+        ),
+        Bodies.rectangle(
+          gridX + innerW + wallThickness / 2,
+          cy,
+          wallThickness,
+          innerH + wallThickness * 2,
+          {
+            isStatic: true,
+            render: { fillStyle: "#0b1222", strokeStyle: "#0b1222" },
+          },
+        ),
+      ];
+    },
+  });
+})();