Add regions. Retrieve next player.

static/js/dom.js

@@ -7,7 +7,7 @@ function updatePlayerDom() {
 
         let statusSpan = document.createElement("div");
         statusSpan.classList.add("status-span");
-        if (game_state === WAITING) {
+        if (gameState === WAITING) {
             if (player.ready) {
                 statusSpan.textContent = "R";
                 statusSpan.classList.add("ready");

static/js/index.js

@@ -4,13 +4,14 @@ const TIMEOUT = 30_000;
 
 let players = {};
 let us = null;
+let currentPlayer = () => Object.values(players).filter((p) => p.isReady)[0];
 
 const WAITING = 0;
 const PRE_GAME = 1;
 const PLAYING = 2;
 const POST_GAME = 3;
 
-let game_state = WAITING;
+let gameState = WAITING;
 
 let socket;
 let random;
@@ -64,6 +65,11 @@ document.addEventListener("DOMContentLoaded", () => {
             case "BARRIER":
                 barrier.resolve(data);
                 break;
+
+            case "CLAIM":
+                // Claim a region in the pregame.
+                await currentPlayer().claim(data);
+                break;
         }
     });
 
@@ -80,7 +86,7 @@ document.addEventListener("DOMContentLoaded", () => {
  */
 function playerConnected(data) {
     // Block players from joining mid-game
-    if (game_state !== WAITING) {
+    if (gameState !== WAITING) {
         return;
     }
 
@@ -139,7 +145,7 @@ function allPlayersReady() {
 async function startPregame() {
     console.log("all players ready.");
 
-    game_state = PRE_GAME;
+    gameState = PRE_GAME;
 
     let firstPlayerIndex = await random.get(Object.keys(players).length, "first-player");
 
@@ -148,9 +154,9 @@ async function startPregame() {
     ];
 
     firstPlayer.isPlaying = true;
-    game_state = PLAYING;
-
     await barrier.wait();
 
+    // Players select starting regions.
+
     updatePlayerDom();
 }

static/js/map.js

@@ -0,0 +1,140 @@
+class Continent {
+    constructor(name) {
+        this.name = name;
+        this.yield = 0;
+    }
+}
+
+const REGIONS = {};
+
+class Region {
+    constructor(name, continent) {
+        this.name = name;
+        this.owner = null;
+        this.strength = 0;
+        this.neighbours = new Set();
+        this.continent = continent;
+
+        REGIONS[name] = this;
+    }
+
+    static setNeighbours(region1, region2) {
+        region1.neighbours.add(region2);
+        region2.neighbours.add(region1);
+    }
+
+    static getRegion(name) {
+        return REGIONS[name];
+    }
+
+    /**
+     * Test if all regions are claimed or not.
+     *
+     * @returns {boolean}
+     */
+    static allClaimed() {
+        return Object.values(REGIONS).find((r) => r.owner === null) === null;
+    }
+
+    claim(player) {
+        this.owner = player;
+        this.strength = 1;
+    }
+
+    reinforce(amount) {
+        this.strength += amount;
+    }
+}
+
+const EUROPE = new Continent("Europe");
+const ASIA = new Continent("Asia");
+const AUSTRALASIA = new Continent("Australasia");
+const AFRICA = new Continent("Africa");
+const SOUTH_AMERICA = new Continent("South America");
+const NORTH_AMERICA = new Continent("North America");
+
+const BRITISH_ISLES = new Region("British Isles", EUROPE);
+const SPAIN = new Region("Spain", EUROPE);
+const MEDITERRANEAN = new Region("Mediterranean", EUROPE);
+const GERMANIC = new Region("Germanic States", EUROPE);
+const WESTERN_SOVIET = new Region("USSR - West", EUROPE);
+const SCANDINAVIA = new Region("Scandinavia", EUROPE);
+const ICELAND = new Region("Iceland", EUROPE);
+
+const GREENLAND = new Region("Greenland", NORTH_AMERICA);
+const NEWFOUNDLAND = new Region("Newfoundland", NORTH_AMERICA);
+const EAST_COAST = new Region("USA - East Coast", NORTH_AMERICA);
+const CENTRAL_AMERICA = new Region("Mexico", NORTH_AMERICA);
+const WEST_COAST = new Region("USA - West Coast", NORTH_AMERICA);
+const ALASKA = new Region("USA - Alaskan", NORTH_AMERICA);
+const WEST_CANADA = new Region("Canada - West", NORTH_AMERICA);
+const NORTH_CANADA = new Region("Canada - North", NORTH_AMERICA);
+const CENTRAL_CANADA = new Region("Canada - Central", NORTH_AMERICA);
+
+const MIDDLE_EAST = new Region("Middle East", ASIA);
+const INDIA = new Region("India", ASIA);
+const SOUTH_EAST_ASIA = new Region("South East Asia", ASIA);
+const SOUTH_CHINA = new Region("China - South", ASIA);
+const NORTH_CHINA = new Region("China - North", ASIA);
+const JAPAN = new Region("Japan", ASIA);
+const ALASKAN_SOVIET = new Region("USSR - Alaskan", ASIA);
+const EAST_NORTH_SOVIET = new Region("USSR - Far East/North", ASIA);
+const EAST_SOUTH_SOVIET = new Region("USSR - Far East/South", ASIA);
+const EASTERN_SOVIET = new Region("USSR - East", ASIA);
+const CENTRAL_SOVIET = new Region("USSR - Central", ASIA);
+const ISLAMIC_EMIRATE = new Region("Islamic Emirate States", ASIA);
+
+const NORTH_AFRICA = new Region("Egypt", AFRICA);
+const EAST_AFRICA = new Region("Somalia", AFRICA);
+const SOUTH_AFRICA = new Region("Southern Africa", AFRICA);
+const CENTRAL_AFRICA = new Region("Central Africa", AFRICA);
+const WEST_AFRICA = new Region("Saharan Africa", AFRICA);
+const MADAGASCAR = new Region("Madagascar", AFRICA);
+
+const EAST_AUSTRALIA = new Region("Australia - Eastern", AUSTRALASIA);
+const WEST_AUSTRALIA = new Region("Australia - Western", AUSTRALASIA);
+const EAST_INDONESIA = new Region("East Indonesia", AUSTRALASIA);
+const WEST_INDONESIA = new Region("West Indonesia", AUSTRALASIA);
+
+const NORTH_SOUTH_AMERICA = new Region("Northern South America", SOUTH_AMERICA);
+const EAST_SOUTH_AMERICA = new Region("Brazil", SOUTH_AMERICA);
+const SOUTH_SOUTH_AMERICA = new Region("Argentina", SOUTH_AMERICA);
+const WEST_SOUTH_AMERICA = new Region("Peru", SOUTH_AMERICA);
+
+Region.setNeighbours(BRITISH_ISLES, ICELAND);
+Region.setNeighbours(BRITISH_ISLES, SCANDINAVIA);
+Region.setNeighbours(BRITISH_ISLES, GERMANIC);
+Region.setNeighbours(BRITISH_ISLES, SPAIN);
+
+Region.setNeighbours(SPAIN, BRITISH_ISLES);
+Region.setNeighbours(SPAIN, GERMANIC);
+Region.setNeighbours(SPAIN, MEDITERRANEAN);
+Region.setNeighbours(SPAIN, WEST_AFRICA);
+
+Region.setNeighbours(GERMANIC, SCANDINAVIA);
+Region.setNeighbours(GERMANIC, WESTERN_SOVIET);
+Region.setNeighbours(GERMANIC, MEDITERRANEAN);
+Region.setNeighbours(GERMANIC, BRITISH_ISLES);
+
+Region.setNeighbours(MEDITERRANEAN, GERMANIC);
+Region.setNeighbours(MEDITERRANEAN, SPAIN);
+Region.setNeighbours(MEDITERRANEAN, NORTH_AFRICA);
+Region.setNeighbours(MEDITERRANEAN, WEST_AFRICA);
+Region.setNeighbours(MEDITERRANEAN, MIDDLE_EAST);
+Region.setNeighbours(MEDITERRANEAN, WESTERN_SOVIET);
+
+Region.setNeighbours(ICELAND, GREENLAND);
+Region.setNeighbours(ICELAND, SCANDINAVIA);
+Region.setNeighbours(ICELAND, BRITISH_ISLES);
+
+Region.setNeighbours(SCANDINAVIA, WESTERN_SOVIET);
+Region.setNeighbours(SCANDINAVIA, ICELAND);
+Region.setNeighbours(SCANDINAVIA, GERMANIC);
+Region.setNeighbours(SCANDINAVIA, BRITISH_ISLES);
+
+Region.setNeighbours(WESTERN_SOVIET, CENTRAL_SOVIET);
+Region.setNeighbours(WESTERN_SOVIET, ISLAMIC_EMIRATE);
+Region.setNeighbours(WESTERN_SOVIET, MIDDLE_EAST);
+Region.setNeighbours(WESTERN_SOVIET, MEDITERRANEAN);
+Region.setNeighbours(WESTERN_SOVIET, GERMANIC);
+Region.setNeighbours(WESTERN_SOVIET, SCANDINAVIA);

static/js/packet.js

@@ -32,4 +32,11 @@ class Packet {
     static createBarrierSignal() {
         return this._createBase("BARRIER");
     }
+
+    static createRegionClaim(region) {
+        return {
+            ...this._createBase("CLAIM"),
+            name: region,
+        };
+    }
 }

static/js/player.js

@@ -17,4 +17,45 @@ class Player {
             updatePlayerDom();
         }, TIMEOUT);
     }
+
+    /**
+     * Claim a region of the map.
+     *
+     * @param data Data received via socket.
+     */
+    claim(data) {
+        let region = Region.getRegion(data.region);
+
+        if (region.owner === null) {
+            region.claim(this);
+        }
+    }
+
+    /**
+     * Start a player's turn.
+     */
+    startTurn() {
+        this.isPlaying = true;
+    }
+
+    /**
+     * Perform some game action on your turn.
+     *
+     * @param data Data received via socket.
+     */
+    perform(data) {}
+
+    /**
+     * End player's turn
+     */
+    endTurn() {
+        this.isPlaying = false;
+    }
+
+    nextPlayer() {
+        let sorted = Object.values(players).sort((a, b) => (a.id < b.id ? -1 : 1));
+        let ourIndex = sorted.findIndex((player) => player.id === ID);
+
+        return sorted[(ourIndex + 1) % sorted.length];
+    }
 }

templates/index.html

@@ -23,10 +23,6 @@
         </ul>
     </div>
 
-    <div id="turn-title">
-        <span class="current-player"></span>'s Turn!
-    </div>
-
     <div id="ready">
         <button id="ready-button">Not ready</button>
     </div>