From 79c4ce20d10d082a728da9fb9462f0b07a9f03b3 Mon Sep 17 00:00:00 2001 From: jude Date: Mon, 6 Feb 2023 12:30:24 +0000 Subject: [PATCH] Added a far more basic map --- static/css/style.css | 36 +++++++++++++++ static/js/dom.js | 4 ++ static/js/index.js | 11 ++++- static/js/map.js | 102 +++++-------------------------------------- static/js/player.js | 14 +++++- static/js/shim.js | 3 -- templates/index.html | 60 ++++++++++++++++++++++++- 7 files changed, 133 insertions(+), 97 deletions(-) delete mode 100644 static/js/shim.js diff --git a/static/css/style.css b/static/css/style.css index facd455..2f8fb50 100644 --- a/static/css/style.css +++ b/static/css/style.css @@ -37,3 +37,39 @@ .not-ready { color: red; } + +#map { + position: absolute; + top: 50vh; + left: 50vw; +} + +#map-back { + position: absolute; + top: -500px; + left: -500px; + z-index: 0; +} + +.node { + border-radius: 50%; + width: 40px; + height: 40px; + border-color: black; + border-style: solid; + border-width: 2px; + position: absolute; + background-color: #fff; + display: flex; + align-items: center; + justify-content: center; +} + +.strength { + margin: auto; +} + +.label { + position: absolute; + top: -20px; +} diff --git a/static/js/dom.js b/static/js/dom.js index ef8e6eb..fbc27b5 100644 --- a/static/js/dom.js +++ b/static/js/dom.js @@ -1,3 +1,7 @@ +function unlockMapDom() {} + +function lockMapDom() {} + function updatePlayerDom() { let list = document.querySelector("#playerList"); list.replaceChildren(); diff --git a/static/js/index.js b/static/js/index.js index f3344e5..7748c23 100644 --- a/static/js/index.js +++ b/static/js/index.js @@ -11,6 +11,8 @@ const PRE_GAME = 1; const PLAYING = 2; const POST_GAME = 3; +const COLORS = ["#FF0000", "#00FF00", "#0000FF", "#FF00FF", "#FFFF00", "#00FFFF"]; + let gameState = WAITING; let socket; @@ -69,6 +71,12 @@ document.addEventListener("DOMContentLoaded", () => { case "CLAIM": // Claim a region in the pregame. await currentPlayer().claim(data); + // Increment to next player. + currentPlayer().endTurn(); + + if (currentPlayer() === us) { + currentPlayer().claimRegions(); + } break; } }); @@ -155,8 +163,7 @@ async function startPregame() { firstPlayer.isPlaying = true; await barrier.wait(); + updatePlayerDom(); // Players select starting regions. - - updatePlayerDom(); } diff --git a/static/js/map.js b/static/js/map.js index 896e955..c16705d 100644 --- a/static/js/map.js +++ b/static/js/map.js @@ -46,95 +46,17 @@ class Region { } } -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 EAST = new Continent("East"); +const WEST = new Continent("West"); -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 A = new Region("A", EAST); +const B = new Region("B", EAST); +const C = new Region("C", EAST); +const D = new Region("D", EAST); +const E = new Region("E", EAST); -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); +const F = new Region("F", WEST); +const G = new Region("G", WEST); +const H = new Region("H", WEST); +const I = new Region("I", WEST); +const J = new Region("J", WEST); diff --git a/static/js/player.js b/static/js/player.js index d4528b3..781c8fe 100644 --- a/static/js/player.js +++ b/static/js/player.js @@ -13,11 +13,22 @@ class Player { } this.timeout = window.setTimeout(() => { - delete players[this.id]; + if (players[this.id] !== undefined) { + delete players[this.id]; + } updatePlayerDom(); }, TIMEOUT); } + /** + * Allow the user to claim regions whilst in the pre-game phase. + */ + claimRegions() { + unlockMapDom(); + + lockMapDom(); + } + /** * Claim a region of the map. * @@ -50,6 +61,7 @@ class Player { */ endTurn() { this.isPlaying = false; + this.nextPlayer().startTurn(); } nextPlayer() { diff --git a/static/js/shim.js b/static/js/shim.js deleted file mode 100644 index 5041cd2..0000000 --- a/static/js/shim.js +++ /dev/null @@ -1,3 +0,0 @@ -Array.prototype.min = function () { - return this.reduce((min, val) => (min < val ? min : val)); -}; diff --git a/templates/index.html b/templates/index.html index b0c8387..064d5a3 100644 --- a/templates/index.html +++ b/templates/index.html @@ -7,7 +7,6 @@ - @@ -23,6 +22,65 @@ +
+ + + + + + + + + + + + + + + + +
+
U
+
A
+
+
+
U
+
B
+
+
+
U
+
C
+
+
+
U
+
D
+
+
+
U
+
E
+
+
+
U
+
F
+
+
+
U
+
G
+
+
+
U
+
H
+
+
+
U
+
I
+
+
+
U
+
J
+
+
+