Simplify accessability of player names

src/js/Constants.js

@@ -5,9 +5,11 @@ export class Constants
 {
     /**
      * The IDs of the players.
+     *
+     * @type {Partial<Record<CellOwner, string>>}
      */
-    static PLAYER_NAMES = [
-        "red",
-        "blue"
-    ];
+    static PLAYER_NAMES = {
+        r: "red",
+        b: "blue"
+    };
 }

src/js/board.js

@@ -1,3 +1,4 @@
+import { Constants } from "./Constants.js";
 import { elt } from "./elt.js";
 import { State } from "./State.js";
 
@@ -10,6 +11,7 @@ import { State } from "./State.js";
 export function initializeBoard(id)
 {
     let board = document.getElementById(id);
+    board.innerHTML = "";
 
     for (let i = 0; i < 6; i++)
     {
@@ -24,7 +26,7 @@ export function initializeBoard(id)
                 children.push(elt(
                     "div",
                     {
-                        class: `piece ${playerId === "r" ? "red" : "blue"}`
+                        class: `piece ${Constants.PLAYER_NAMES[playerId]}`
                     }));
             }