Move state to a separate file

src/js/State.js

@@ -0,0 +1,23 @@
+/**
+ * The state of the board.
+ *
+ * @type {Board}
+ */
+export const State = /** @type {Board} */ (
+    Array(6).fill("").map(
+        () => (Array(7).fill("").map(
+            () =>
+            {
+                let id = Math.floor(Math.random() * 3);
+
+                switch (id)
+                {
+                    case 1:
+                        return "r";
+                    case 2:
+                        return "b";
+                    default:
+                        return "";
+                }
+            })))
+);

src/js/board.js

@@ -1,5 +1,5 @@
-import { Constants } from "./Constants.js";
 import { elt } from "./elt.js";
+import { State } from "./State.js";
 
 /**
  * Initializes the game board.
@@ -13,18 +13,18 @@ export function initializeBoard(id)
 
     for (let i = 0; i < 6; i++)
     {
-        for (let i = 0; i < 7; i++)
+        for (let j = 0; j < 7; j++)
         {
             /** @type {Node[]} */
             let children = [];
-            let playerId = Math.floor(Math.random() * 3);
+            let playerId = State[i][j];
 
-            if (playerId > 0)
+            if (playerId !== "")
             {
                 children.push(elt(
                     "div",
                     {
-                        class: `piece ${Constants.PLAYER_NAMES[playerId - 1]}`
+                        class: `piece ${playerId === "r" ? "red" : "blue"}`
                     }));
             }
 

src/js/types.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Represents the state of a field.
+ */
+type CellOwner = "" | "r" | "b";
+
+/**
+ * Represents a row of the game field.
+ */
+type Row = [CellOwner, CellOwner, CellOwner, CellOwner, CellOwner, CellOwner, CellOwner];
+
+/**
+ * Represents a game board.
+ */
+type Board = [
+    Row,
+    Row,
+    Row,
+    Row,
+    Row,
+    Row
+];