Added a far more basic map
This commit is contained in:
@ -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;
|
||||
}
|
||||
|
@ -1,3 +1,7 @@
|
||||
function unlockMapDom() {}
|
||||
|
||||
function lockMapDom() {}
|
||||
|
||||
function updatePlayerDom() {
|
||||
let list = document.querySelector("#playerList");
|
||||
list.replaceChildren();
|
||||
|
@ -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();
|
||||
}
|
||||
|
102
static/js/map.js
102
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);
|
||||
|
@ -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() {
|
||||
|
@ -1,3 +0,0 @@
|
||||
Array.prototype.min = function () {
|
||||
return this.reduce((min, val) => (min < val ? min : val));
|
||||
};
|
Reference in New Issue
Block a user