diff --git a/board.js b/board.js
index 0c0e81c..858958b 100644
--- a/board.js
+++ b/board.js
@@ -160,15 +160,15 @@ let gameBoard = {
// Creation of ships
- this.boardArray[boardCenter-1][col-1].pieces = {populatedSquare: true, category: 'Transport', type: 'cargo ship', direction: '-90', used: 'unused', damageStatus: 5, team: 'Orange Team', goods: 'none', stock: 0, production: 0, homeRow: boardCenter-1, homeCol: col-1};
- this.boardArray[boardCenter+1][col-1].pieces = {populatedSquare: true, category: 'Transport', type: 'cargo ship', direction: '-90', used: 'unused', damageStatus: 5, team: 'Orange Team', goods: 'none', stock: 0, production: 0, homeRow: boardCenter+1, homeCol: col-1};
- this.boardArray[0][boardCenter-1].pieces = {populatedSquare: true, category: 'Transport', type: 'cargo ship', direction: '180', used: 'unused', damageStatus: 5, team: 'Red Team', goods: 'none', stock: 0, production: 0, homeRow: 0, homeCol: boardCenter-1};
- this.boardArray[0][boardCenter+1].pieces = {populatedSquare: true, category: 'Transport', type: 'cargo ship', direction: '180', used: 'unused', damageStatus: 5, team: 'Red Team', goods: 'none', stock: 0, production: 0, homeRow: 0, homeCol: boardCenter+1};
- this.boardArray[row-1][boardCenter-1].pieces = {populatedSquare: true, category: 'Transport', type: 'cargo ship', direction: '0', used: 'unused', damageStatus: 5, team: 'Green Team', goods: 'none', stock: 0, production: 0, homeRow: row-1, homeCol: boardCenter-1};
- this.boardArray[row-1][boardCenter+1].pieces = {populatedSquare: true, category: 'Transport', type: 'warship', direction: '0', used: 'unused', damageStatus: 5, team: 'Green Team', goods: 'none', stock: 0, production: 0, homeRow: row-1, homeCol: boardCenter+1};
- this.boardArray[row-2][boardCenter].pieces = {populatedSquare: true, category: 'Transport', type: 'catamaran', direction: '0', used: 'unused', damageStatus: 5, team: 'Green Team', goods: 'none', stock: 0, production: 0, homeRow: row-1, homeCol: boardCenter+1};
- this.boardArray[boardCenter-1][0].pieces = {populatedSquare: true, category: 'Transport', type: 'cargo ship', direction: '90', used: 'unused', damageStatus: 5, team: 'Blue Team', goods: 'none', stock: 0, production: 0, homeRow: boardCenter-1, homeCol: 0};
- this.boardArray[boardCenter+1][0].pieces = {populatedSquare: true, category: 'Transport', type: 'cargo ship', direction: '90', used: 'unused', damageStatus: 5, team: 'Blue Team', goods: 'none', stock: 0, production: 0, homeRow: boardCenter+1, homeCol: 0};
+ this.boardArray[boardCenter-1][col-1].pieces = {populatedSquare: true, category: 'Transport', type: 'catamaran', direction: '-90', used: 'unused', damageStatus: 5, team: 'Orange Team', goods: 'none', stock: 0, production: 0, homeRow: boardCenter-1, homeCol: col-1};
+ //this.boardArray[boardCenter+1][col-1].pieces = {populatedSquare: true, category: 'Transport', type: 'cargo ship', direction: '-90', used: 'unused', damageStatus: 5, team: 'Orange Team', goods: 'none', stock: 0, production: 0, homeRow: boardCenter+1, homeCol: col-1};
+ this.boardArray[0][boardCenter-1].pieces = {populatedSquare: true, category: 'Transport', type: 'catamaran', direction: '180', used: 'unused', damageStatus: 5, team: 'Red Team', goods: 'none', stock: 0, production: 0, homeRow: 0, homeCol: boardCenter-1};
+ //this.boardArray[0][boardCenter+1].pieces = {populatedSquare: true, category: 'Transport', type: 'cargo ship', direction: '180', used: 'unused', damageStatus: 5, team: 'Red Team', goods: 'none', stock: 0, production: 0, homeRow: 0, homeCol: boardCenter+1};
+ //this.boardArray[row-1][boardCenter-1].pieces = {populatedSquare: true, category: 'Transport', type: 'cargo ship', direction: '0', used: 'unused', damageStatus: 5, team: 'Green Team', goods: 'none', stock: 0, production: 0, homeRow: row-1, homeCol: boardCenter-1};
+ this.boardArray[row-1][boardCenter+1].pieces = {populatedSquare: true, category: 'Transport', type: 'catamaran', direction: '0', used: 'unused', damageStatus: 5, team: 'Green Team', goods: 'none', stock: 0, production: 0, homeRow: row-1, homeCol: boardCenter+1};
+ //this.boardArray[row-2][boardCenter].pieces = {populatedSquare: true, category: 'Transport', type: 'warship', direction: '0', used: 'unused', damageStatus: 5, team: 'Green Team', goods: 'none', stock: 0, production: 0, homeRow: row-1, homeCol: boardCenter+1};
+ //this.boardArray[boardCenter-1][0].pieces = {populatedSquare: true, category: 'Transport', type: 'cargo ship', direction: '90', used: 'unused', damageStatus: 5, team: 'Blue Team', goods: 'none', stock: 0, production: 0, homeRow: boardCenter-1, homeCol: 0};
+ this.boardArray[boardCenter+1][0].pieces = {populatedSquare: true, category: 'Transport', type: 'catamaran', direction: '90', used: 'unused', damageStatus: 5, team: 'Blue Team', goods: 'none', stock: 0, production: 0, homeRow: boardCenter+1, homeCol: 0};
// Creation of pirate ships and pirate harbours
this.boardArray[4][6] = {xpos: 4, ypos: 6, terrain: 'sea', subTerrain: 'pirateHarbour', activeStatus: 'inactive', pieces: {populatedSquare: true, category: 'Transport', type: 'warship', direction: '135', used: 'unused', damageStatus: 5, team: 'Pirate', goods: 'none', stock: 0, ref: 0}};
@@ -200,11 +200,8 @@ let gameBoard = {
this.boardArray[boardCenter][boardCenter+1].pieces = {populatedSquare: true, category: 'Resources', type: 'plantation', direction: '0', used: 'unused', damageStatus: 5, team: 'Kingdom', goods: 'coffee', stock: 0, production: 2};
// TEST AREA
- /* this.boardArray[(row-4)][boardCenter].terrain = 'land';
- this.boardArray[(row-4)][boardCenter].pieces = {populatedSquare: true, category: 'Settlements', type: 'fort', direction: '0', used: 'unused', damageStatus: 5, team: 'Kingdom', goods: 'none', stock: 0};
- tradeContracts.contractsArray[2].row = row-4;
- tradeContracts.contractsArray[2].col = boardCenter;
+ /*
// Battle Royale
this.boardArray[row-4][boardCenter].pieces = {populatedSquare: true, category: 'Transport', type: 'cargo ship', direction: '45', used: 'unused', damageStatus: 5, team: 'Pirate', goods: 'none', stock: 0};
this.boardArray[row-4][boardCenter + 1].pieces = {populatedSquare: true, category: 'Transport', type: 'cargo ship', direction: '45', used: 'unused', damageStatus: 5, team: 'Pirate', goods: 'none', stock: 0};
@@ -231,7 +228,7 @@ let gameBoard = {
{i: row-1, j: boardCenter+1, team: 'Green Team'},
{i: boardCenter+1, j: 0, team: 'Blue Team'}]
- // function picks a tile form the resource deck and checks polayer does not already have this Resource allocated
+ // function picks a tile form the resource deck and checks player does not already have this Resource allocated
function completeAllocatedTile(locali, localj, localTeam) {
stockDashboard.stockTake();
//keep for debugging - console.log(stockDashboard.pieceTotals);
@@ -241,7 +238,7 @@ let gameBoard = {
var deckCard = resourceManagement.pickFromResourceDeck();
//keep for debugging - console.log(deckCard.type);
}
- while (stockDashboard.pieceTotals[pieceTotalsTeamPosition].pieces[deckCard.type] > 0)
+ while (stockDashboard.pieceTotals[pieceTotalsTeamPosition].pieces[deckCard.type].quantity > 0)
gameBoard.boardArray[locali][localj].pieces = {populatedSquare: true, category: 'Resources', type: deckCard.type, direction: '0', used: 'unused', damageStatus: 5, team: localTeam, goods: deckCard.goods, stock: 0};
}
diff --git a/build.js b/build.js
new file mode 100644
index 0000000..c1b34fb
--- /dev/null
+++ b/build.js
@@ -0,0 +1,162 @@
+// Building object - methods and arrays to allow building of ships
+let buildItem = {
+
+ // Array to hold building recipes
+ // -------------------------------
+ buildRecipe: [
+ {type: 'warship', recipe: [{goods: 'wood', quantity: 8}, {goods: 'iron', quantity: 12}, {goods: 'stone', quantity: 8}]},
+ {type: 'cargo ship', recipe: [{goods: 'wood', quantity: 10}, {goods: 'iron', quantity: 10}, {goods: 'stone', quantity: 8}]},
+ ],
+
+ // Method to handle clicks on stock dashboard
+ // ------------------------------------------
+ // Only build actions currently operational from clicking on stock dashboard
+ clickStock: function(e) {
+ if (e.target.classList.contains('buildcargo') || e.target.parentNode.classList.contains('buildcargo')) {
+ buildItem.clickBuild(e, 'cargo ship');
+ } else if (e.target.classList.contains('buildwarship') || e.target.parentNode.classList.contains('buildwarship')) {
+ buildItem.clickBuild(e, 'warship');
+ }
+ },
+
+ // Method to operate building slider and check if chosen ship can be built
+ // -----------------------------------------------------------------------
+ clickBuild: function(stockElement, localBuild) {
+ // Resets any half-made board moves and deactivates tiles
+ resetMove();
+
+ // Clears building slider for use
+ buildItem.clearBuilding();
+
+ // Slides building slider up and commentary down
+ commentary.style.bottom = '-10%';
+ building.style.bottom = 0;
+
+ // Refreshes amount of stock held by players and set up variables
+ stockDashboard.goodsStockTake();
+ let teamNo = gameManagement.teamArray.indexOf(gameManagement.turn);
+ let buildNo = buildItem.buildRecipe.findIndex(y => y.type == localBuild);
+
+ // Add icon of ship clicked on
+ let buildIcon = building.appendChild(gameBoard.createActionTile(0, 0, localBuild, gameManagement.turn, 'buildPiece', 10, (screenWidth - 2*surroundSize) * 0.04 - (gridSize + 2*tileBorder)/2, 1.5, 0));
+
+ // Loop through each goods type in build recipe and only allow construction if sufficient goods stock available
+ let allowConstruction = true;
+ for (var k = 0; k < buildItem.buildRecipe[buildNo].recipe.length; k++) {
+ if(stockDashboard.goodsTotals[teamNo].land[buildItem.buildRecipe[buildNo].recipe[k].goods] < buildItem.buildRecipe[buildNo].recipe[k].quantity) {
+ allowConstruction = false;
+ }
+ // Adds goods icons to illustrate quantity held vs quantity required
+ for (var i = 0; i < Math.min(stockDashboard.goodsTotals[teamNo].land[buildItem.buildRecipe[buildNo].recipe[k].goods], buildItem.buildRecipe[buildNo].recipe[k].quantity); i++) {
+ building.appendChild(gameBoard.createIcon(buildItem.buildRecipe[buildNo].recipe[k].goods + i, 1.5, buildItem.buildRecipe[buildNo].recipe[k].goods, (screenWidth - 2*surroundSize) * ((k+2) * 0.20) - tileBorder/2 + (((i % 10) - 0.5) * (gridSize + tileBorder) / 1.5), 10 + Math.floor(i/10) * ((gridSize + tileBorder) / 1.5)));
+ for (var z = 0; z < building.lastChild.children.length; z++) {
+ let nextChild = building.lastChild.children[z];
+ nextChild.setAttribute('class', building.lastChild.children[z].baseVal + ' ' + gameManagement.turn + ' team_stroke team_fill');
+ }
+ }
+ for (var j = stockDashboard.goodsTotals[teamNo].land[buildItem.buildRecipe[buildNo].recipe[k].goods]; i < buildItem.buildRecipe[buildNo].recipe[k].quantity; i++) {
+ building.appendChild(gameBoard.createIcon('stock' + i, 1.5, buildItem.buildRecipe[buildNo].recipe[k].goods, (screenWidth - 2*surroundSize) * ((k+2) * 0.20) - tileBorder/2 + (((i % 10) - 0.5) * (gridSize + tileBorder) / 1.5), 10 + Math.floor(i/10) * ((gridSize + tileBorder) / 1.5)));
+ }
+ }
+
+ // Adds ship construction details to building slider
+ firstBuildLine.innerText = 'Construction of ' + localBuild + ' requires:';
+ secondBuildLine.innerText = buildItem.buildRecipe[buildNo].recipe[0].goods + ' ' + buildItem.buildRecipe[buildNo].recipe[0].quantity + ', ' + buildItem.buildRecipe[buildNo].recipe[1].goods + ' ' + buildItem.buildRecipe[buildNo].recipe[1].quantity + ', ' + buildItem.buildRecipe[buildNo].recipe[2].goods + ' ' + buildItem.buildRecipe[buildNo].recipe[2].quantity ;
+ // Sets up piece movement array and adds ship type and launches construction
+ if (allowConstruction == true) {
+ thirdBuildLine.innerText = 'Click ship icon to confirm construction.';
+ pieceMovement.movementArray = {start: {row: '', col: ''}, end: {row: '', col: ''}};
+ pieceMovement.movementArray.start.pieces = {type: localBuild};
+ buildIcon.addEventListener('click', buildItem.startConstruction);
+ // Does not launch construction if insufficient stock
+ } else {
+ thirdBuildLine.innerText = 'Insufficient goods available to build ' + localBuild + '.';
+ }
+ },
+
+ // Method to activate harbours and capture start inputs of building turn
+ // ---------------------------------------------------------------------
+ // End inputs are captured as normal through buildMarkNode event listener
+ startConstruction: function() {
+ // Activating current team harbours
+ for (var i = 0; i < gameBoard.boardArray.length; i++) {
+ for (var j = 0; j < gameBoard.boardArray[i].length; j++) {
+ if (gameBoard.boardArray[i][j].pieces.team == gameManagement.turn && gameBoard.boardArray[i][j].subTerrain == 'harbour' && gameBoard.boardArray[i][j].pieces.populatedSquare == false) {
+ gameBoard.boardArray[i][j].activeStatus = 'active';
+ } else if (gameBoard.boardArray[i][j].pieces.team == gameManagement.turn && gameBoard.boardArray[i][j].pieces.type == 'fort') {
+ pieceMovement.movementArray.start.row = i;
+ pieceMovement.movementArray.start.col = j;
+ }
+ }
+ }
+
+ // Capture move inputs, since boardMarkNode has not been clicked on. Uses 'Building' as special designation for off-board action.
+ pieceMovement.movementArray.start.pieces = {populatedSquare: false, category: 'Building', type: pieceMovement.movementArray.start.pieces.type, direction: 0, used: 'unused', damageStatus: 3, team: gameManagement.turn, goods: 'none', stock: 0, production: 0};
+ gameBoard.drawActiveTiles();
+ startEnd = 'end';
+
+ // Changing building text
+ firstBuildLine.innerText = 'Select harbour for construction.';
+ secondBuildLine.innerText = '';
+ thirdBuildLine.innerText = '';
+ },
+
+ // Method to reduce stock levels of Resource and fort tiles for construction of ship
+ // ---------------------------------------------------------------------------------
+ // Fort stock is used prior to and Resource piece stock
+ constructionPayment: function(localBuild) {
+ // Updates stock numbers for use in this method
+ stockDashboard.stockTake();
+ let teamArrayPosition = stockDashboard.pieceTotals.findIndex(fI => fI.team == gameManagement.turn);
+ let buildNo = this.buildRecipe.findIndex(fI => fI.type == localBuild);
+
+ // Determines if any of the resources are in the team fort and reduces this balance first
+ let fortPaymentGoods = 'none';
+ let fortPaymentQuantity = 0;
+ for (var a = 0; a < this.buildRecipe[buildNo].recipe.length; a++) {
+ if(stockDashboard.pieceTotals[teamArrayPosition].pieces.fort.goods == this.buildRecipe[buildNo].recipe[a].goods) {
+ fortPaymentGoods = this.buildRecipe[buildNo].recipe[a].goods;
+ fortPaymentQuantity = Math.min(this.buildRecipe[buildNo].recipe[a].quantity, stockDashboard.pieceTotals[teamArrayPosition].pieces.fort.stock);
+ }
+ }
+
+ // Loops through each board tile and reduces the goods on Resource and fort tiles in accordance with construction costs
+ for (var i = 0; i < gameBoard.boardArray.length; i++) {
+ for (var j = 0; j < gameBoard.boardArray[i].length; j++) {
+ if (gameBoard.boardArray[i][j].pieces.team == gameManagement.turn && gameBoard.boardArray[i][j].pieces.category == 'Resources') {
+ for (var k = 0; k < this.buildRecipe[buildNo].recipe.length; k++) {
+ if (this.buildRecipe[buildNo].recipe[k].goods == gameBoard.boardArray[i][j].pieces.goods) {
+ gameBoard.boardArray[i][j].pieces.stock -= this.buildRecipe[buildNo].recipe[k].quantity
+ // Adjustment for fort stock which is reduced below
+ if (gameBoard.boardArray[i][j].pieces.goods == fortPaymentGoods) {
+ gameBoard.boardArray[i][j].pieces.stock += fortPaymentQuantity;
+ }
+ }
+ }
+ // Use of fort stock
+ } else if (gameBoard.boardArray[i][j].pieces.team == gameManagement.turn && gameBoard.boardArray[i][j].pieces.type == 'fort') {
+ gameBoard.boardArray[i][j].pieces.stock -= fortPaymentQuantity;
+ if (gameBoard.boardArray[i][j].pieces.stock == fortPaymentQuantity) {
+ gameBoard.boardArray[i][j].pieces.goods = 'none';
+ }
+
+ }
+ }
+ }
+ },
+
+ // Resets building slider
+ // ----------------------
+ clearBuilding: function() {
+ if(workFlow == 1) {console.log('Clearing building slider: ' + (Date.now() - launchTime)); }
+ for (var i = building.children.length - 1; i > -1; i--) {
+ if (building.children[i].id == 'firstBuildLine' || building.children[i].id == 'secondBuildLine' || building.children[i].id == 'thirdBuildLine') {
+ building.children[i].innerText = '';
+ } else {
+ building.children[i].remove();
+ }
+ }
+ },
+
+// LAST BRACKET OF OBJECT
+}
diff --git a/dashboard.js b/dashboard.js
index 4c8a416..d35d6a2 100644
--- a/dashboard.js
+++ b/dashboard.js
@@ -10,14 +10,14 @@ let stockDashboard = {
// Array to hold list of all piece types
// -------------------------------------
// Pieces must be added in the order: Settlements, Transport, Resources
- pieceTypes: [ {type: 'fort', category: 'Settlements', maxNo: 1, goods: 'none', maxProduction: 0, maxMove: 0, deckNumber: 0},
- {type: 'catamaran', category: 'Transport', maxNo: 1, goods: 'none', maxProduction: 0, maxMove: 5, deckNumber: 0},
- {type: 'warship', category: 'Transport', maxNo: 1, goods: 'none', maxProduction: 0, maxMove: 4, deckNumber: 0},
- {type: 'cargo ship', category: 'Transport', maxNo: 1, goods: 'none', maxProduction: 0, maxMove: 3, deckNumber: 0},
- {type: 'forest', category: 'Resources', maxNo: 1, goods: 'wood', maxProduction: 2, maxMove: 0, deckNumber: 4},
- {type: 'ironworks', category: 'Resources', maxNo: 1, goods: 'iron', maxProduction: 2, maxMove: 0, deckNumber: 4},
- {type: 'quarry', category: 'Resources', maxNo: 1, goods: 'stone', maxProduction: 2, maxMove: 0, deckNumber: 4},
- {type: 'plantation', category: 'Resources', maxNo: 1, goods: 'coffee', maxProduction: 2, maxMove: 0, deckNumber: 4}
+ pieceTypes: [ {type: 'fort', category: 'Settlements', maxNo: 1, goods: 'none', maxProduction: 0, maxMove: 0, maxHold: 20, deckNumber: 0},
+ {type: 'catamaran', category: 'Transport', maxNo: 1, goods: 'none', maxProduction: 0, maxMove: 5, maxHold: 5, deckNumber: 0},
+ {type: 'warship', category: 'Transport', maxNo: 1, goods: 'none', maxProduction: 0, maxMove: 4, maxHold: 10, deckNumber: 0},
+ {type: 'cargo ship', category: 'Transport', maxNo: 1, goods: 'none', maxProduction: 0, maxMove: 3, maxHold: 20, deckNumber: 0},
+ {type: 'forest', category: 'Resources', maxNo: 1, goods: 'wood', maxProduction: 2, maxMove: 0, maxHold: 20, deckNumber: 4},
+ {type: 'ironworks', category: 'Resources', maxNo: 1, goods: 'iron', maxProduction: 2, maxMove: 0, maxHold: 20, deckNumber: 4},
+ {type: 'quarry', category: 'Resources', maxNo: 1, goods: 'stone', maxProduction: 2, maxMove: 0, maxHold: 20, deckNumber: 4},
+ {type: 'plantation', category: 'Resources', maxNo: 1, goods: 'coffee', maxProduction: 2, maxMove: 0, maxHold: 20, deckNumber: 4}
],
@@ -28,36 +28,41 @@ let stockDashboard = {
stockTake: function() {
let counter = 0;
+ let piecesGoods = 'none';
+ let piecesStock = 0;
+
for (var h = 0; h < gameManagement.teamArray.length; h++) {
//console.log(gameManagement.teamArray[h]);
stockDashboard.pieceTotals[h] = {team: gameManagement.teamArray[h], pieces: {}};
for (var k = 0; k < stockDashboard.pieceTypes.length; k++) {
//console.log(stockDashboard.pieceTypes[k].type);
- stockDashboard.pieceTotals[h].pieces[stockDashboard.pieceTypes[k].type] = 0;
+ stockDashboard.pieceTotals[h].pieces[stockDashboard.pieceTypes[k].type] = {};
counter = 0;
+ piecesGoods = 'none';
+ piecesStock = 0;
for (var i = 0; i < gameBoard.boardArray.length; i++) {
for (var j = 0; j < gameBoard.boardArray[i].length; j++) {
if(gameBoard.boardArray[i][j].pieces.populatedSquare) {
if(gameBoard.boardArray[i][j].pieces.team == gameManagement.teamArray[h]) {
if(gameBoard.boardArray[i][j].pieces.type == stockDashboard.pieceTypes[k].type) {
counter += 1;
+ piecesGoods = gameBoard.boardArray[i][j].pieces.goods;
+ piecesStock = gameBoard.boardArray[i][j].pieces.stock;
}
}
}
}
}
- stockDashboard.pieceTotals[h].pieces[stockDashboard.pieceTypes[k].type] = counter;
+ stockDashboard.pieceTotals[h].pieces[stockDashboard.pieceTypes[k].type] = {quantity: counter, goods: piecesGoods, stock: piecesStock};
}
}
- //console.log(stockDashboard.pieceTotals);
+ console.log('pieceTotals', stockDashboard.pieceTotals);
},
// Method to populate stock dashboard on left-hand panel
// -----------------------------------------------------
- drawStock : function() {
- // Finds the stockDashboard holder in the left hand panel
- let stockDashboardNode = document.querySelector('div.stockDashboard');
+ drawStock: function() {
// Any existing dashboard is deleted
while (stockDashboardNode.firstChild) {
@@ -71,7 +76,7 @@ let stockDashboard = {
let rotateIcon = 0;
let xPosition = 0;
- // Loops through all the piece types
+ // Loops through all the piece types in pieceTypes array - dashboard is created one piece type at a time - k is each piece type
for (var k = 0; k < this.pieceTypes.length; k++) {
//Sets counter to zero
let counter = 0;
@@ -95,7 +100,7 @@ let stockDashboard = {
divCat.appendChild(divCatTitle);
}
- // Loop through boardArray
+ // Loop through boardArray - looks for pieces for current turn team and piece type k
for (var i = 0; i < gameBoard.boardArray.length; i++) {
for (var j = 0; j < gameBoard.boardArray[i].length; j++) {
if(gameBoard.boardArray[i][j].pieces.team == gameManagement.turn) {
@@ -113,6 +118,7 @@ let stockDashboard = {
divType.appendChild(divForText);
//let divTypeTitle = document.createTextNode(' ' + this.pieceTypes[i].type + ': ' + this.pieceTotals[0].pieces[this.pieceTypes[i].type]);
+ // Adds x2 (or equivalent) indicator if production greater than 1
if (this.pieceTypes[k].category == 'Resources' && gameBoard.boardArray[i][j].pieces.production > 1) {
let divTypeTitle = document.createTextNode('x' + gameBoard.boardArray[i][j].pieces.production);
divForText.style.fontWeight = 'bold';
@@ -122,16 +128,15 @@ let stockDashboard = {
divForText.appendChild(divTypeTitle);
}
-
let divForStock = document.createElement('div');
divForStock.setAttribute('class', 'stock_item_holder');
- divCat.appendChild(divForStock);
+ divType.appendChild(divForStock);
if (this.pieceTypes[k].category != 'Resources' && gameBoard.boardArray[i][j].pieces.stock == 0) {
let divStockTitle = document.createTextNode('no cargo');
divForStock.appendChild(divStockTitle);
} else {
- let divStockTitle = document.createTextNode(gameBoard.boardArray[i][j].pieces.goods + ': ' + gameBoard.boardArray[i][j].pieces.stock);
+ let divStockTitle = document.createTextNode(gameBoard.boardArray[i][j].pieces.goods + ': ' + gameBoard.boardArray[i][j].pieces.stock + '/' + this.pieceTypes[k].maxHold);
divForStock.appendChild(divStockTitle);
}
counter += 1;
@@ -139,17 +144,30 @@ let stockDashboard = {
}
}
}
+ // If no pieces of type k found:
if (counter == 0) {
+ let additionalClass = '';
+ if (this.pieceTypes[k].type == 'cargo ship') {
+ additionalClass = 'buildcargo';
+ } else if (this.pieceTypes[k].category == 'Transport') {
+ additionalClass = 'build' + this.pieceTypes[k].type;
+ }
+
// Div to hold piece type is created and icon added
let divType = document.createElement('div');
- divType.setAttribute('class', 'inner_item_holder');
+ divType.setAttribute('class', 'inner_item_holder ' + additionalClass);
divCat.appendChild(divType);
// Icon added
let divTypeIcon = gameBoard.createActionTile(0, 0, this.pieceTypes[k].type, 'Unclaimed', 'dash_' + this.pieceTypes[k].type, 2, xPosition, 1.5, rotateIcon);
+ if (this.pieceTypes[k].category == 'Transport') {
+ //divTypeIcon.setAttribute('class', additionalClass);
+ divTypeIcon.classList.add(additionalClass);
+ console.log(divTypeIcon.classList);
+ }
divType.appendChild(divTypeIcon);
let divForText = document.createElement('div');
- divForText.setAttribute('class', 'dashboard_text');
+ divForText.setAttribute('class', 'dashboard_text ' + additionalClass);
divType.appendChild(divForText);
//let divTypeTitle = document.createTextNode(' ' + this.pieceTypes[i].type + ': ' + this.pieceTotals[0].pieces[this.pieceTypes[i].type]);
@@ -157,12 +175,16 @@ let stockDashboard = {
divForText.appendChild(divTypeTitle);
let divForStock = document.createElement('div');
- divForStock.setAttribute('class', 'stock_item_holder');
- divCat.appendChild(divForStock);
-
- //let arrayPosition = this.pieceTypes.findIndex(fI => fI.type == gameManagement.turn);
- let divStockTitle = document.createTextNode('no ' + this.pieceTypes[k].goods);
- divForStock.appendChild(divStockTitle);
+ divForStock.setAttribute('class', 'stock_item_holder ' + additionalClass);
+ divType.appendChild(divForStock);
+
+ if (this.pieceTypes[k].category == 'Resources') {
+ let divStockTitle = document.createTextNode('no ' + this.pieceTypes[k].goods);
+ divForStock.appendChild(divStockTitle);
+ } else if (this.pieceTypes[k].category == 'Transport') {
+ let divStockTitle = document.createTextNode('build');
+ divForStock.appendChild(divStockTitle);
+ }
}
}
}
@@ -173,31 +195,43 @@ let stockDashboard = {
populateGoodsTotals: function () {
for (var h = 0; h < gameManagement.teamArray.length; h++) {
- this.goodsTotals.push({team: gameManagement.teamArray[h], goods: {wood: 0, iron: 0, stone: 0}});
+ this.goodsTotals.push({team: gameManagement.teamArray[h], land: {wood: 0, iron: 0, stone: 0}, sea: {wood: 0, iron: 0, stone: 0}, total: {wood: 0, iron: 0, stone: 0}});
}
+ console.log(this.goodsTotals);
+ console.log(this.pieceTypes[0].goods);
+ console.log(this.goodsTotals[0].land[this.pieceTypes[0].goods]);
},
goodsStockTake: function() {
let counter = 0;
for (var h = 0; h < gameManagement.teamArray.length; h++) {
//console.log(gameManagement.teamArray[h]);
- this.goodsTotals[h] = {team: gameManagement.teamArray[h], goods: {}};
+ this.goodsTotals[h] = {team: gameManagement.teamArray[h], land: {wood: 0, iron: 0, stone: 0}, sea: {wood: 0, iron: 0, stone: 0}, total: {wood: 0, iron: 0, stone: 0}};
for (var k = 0; k < this.pieceTypes.length; k++) {
//console.log(stockDashboard.pieceTypes[k].type);
- this.goodsTotals[h].goods[this.pieceTypes[k].goods] = 0;
- counter = 0;
+ this.goodsTotals[h].land[this.pieceTypes[k].goods] = 0;
+ this.goodsTotals[h].sea[this.pieceTypes[k].goods] = 0;
+ this.goodsTotals[h].total[this.pieceTypes[k].goods] = 0;
+ counterLand = 0;
+ counterSea = 0;
for (var i = 0; i < gameBoard.boardArray.length; i++) {
for (var j = 0; j < gameBoard.boardArray[i].length; j++) {
if(gameBoard.boardArray[i][j].pieces.populatedSquare) {
if(gameBoard.boardArray[i][j].pieces.team == gameManagement.teamArray[h]) {
if(gameBoard.boardArray[i][j].pieces.goods == this.pieceTypes[k].goods) {
- counter += gameBoard.boardArray[i][j].pieces.stock;
+ if (gameBoard.boardArray[i][j].terrain == 'land') {
+ counterLand += gameBoard.boardArray[i][j].pieces.stock;
+ } else if (gameBoard.boardArray[i][j].terrain == 'sea') {
+ counterSea += gameBoard.boardArray[i][j].pieces.stock;
+ }
}
}
}
}
}
- this.goodsTotals[h].goods[this.pieceTypes[k].goods] = counter;
+ this.goodsTotals[h].land[this.pieceTypes[k].goods] = counterLand;
+ this.goodsTotals[h].sea[this.pieceTypes[k].goods] = counterSea;
+ this.goodsTotals[h].total[this.pieceTypes[k].goods] = counterLand + counterSea;
}
}
},
diff --git a/gamemanagement.js b/gamemanagement.js
index db8f9f5..1931449 100644
--- a/gamemanagement.js
+++ b/gamemanagement.js
@@ -61,7 +61,7 @@ let gameManagement = {
// Settings and options
// --------------------
optionsArray: [
- { variable: 'speed', active: 'medium', options: [{text: 'slow', active: false, constant: 1.5}, {text: 'medium', active: true, constant: 1}, {text: 'fast', active: false, constant: 0.6}] },
+ { variable: 'speed', active: 'fast', options: [{text: 'slow', active: false, constant: 1.5}, {text: 'medium', active: false, constant: 1}, {text: 'fast', active: true, constant: 0.6}] },
{ variable: 'dev', options: [{text: 'workflow', active: true}, {text: 'transitions', active: false}] },
],
diff --git a/index.html b/index.html
index 17f8d19..f0435cb 100644
--- a/index.html
+++ b/index.html
@@ -78,12 +78,19 @@
-
+
+
+
+
@@ -126,6 +133,9 @@
+
+
+
diff --git a/main.js b/main.js
index 5ccc260..b918061 100644
--- a/main.js
+++ b/main.js
@@ -55,7 +55,7 @@ for (var a = 0; a < sideCollection.length; a++) {
sideCollection[a].style.fontSize = (0.6 * screenReduction) + 'em';
}
-let headFootCollection = document.querySelectorAll(' .the_header, .the_footer, .commentary');
+let headFootCollection = document.querySelectorAll(' .the_header, .the_footer, .commentary, .building');
for (var c = 0; c < headFootCollection.length; c++) {
@@ -89,6 +89,9 @@ boardMarkNode.appendChild(tradeRouteLayer);
let moonLayer = gameBoard.createNewLayer('moonLayer');
boardMarkNode.appendChild(moonLayer);
+// Finds the stockDashboard holder in the left hand panel
+let stockDashboardNode = document.querySelector('div.stockDashboard');
+
// Function to set up board and resource deck and allocate resources
function boardSetUp(row, col, gridSize, boardShape) {
gameBoard.populateBoardArray(row, col, boardShape);
@@ -129,33 +132,6 @@ let gameSpeedRef = gameManagement.optionsArray[0].options.findIndex(item => item
let gameSpeed = gameManagement.optionsArray[0].options[gameSpeedRef].constant;
-// board size button handler
-/*var elSize = document.querySelector('.boardSizeSelect');
-elSize.addEventListener('click', function(element) {
- if(element.target.classList.contains('boardSizeSelect_31')) {
- row = 31;
- col = 31;
- boardSetUp(row, col, gridSize, boardShape);
- } else if (element.target.classList.contains('boardSizeSelect_40')) {
- row = 40;
- col = 40;
- boardSetUp(row, col, gridSize, boardShape);
- }
-});
-
-// board shape button handler
-var elShape = document.querySelector('.boardShapeSelect');
-elShape.addEventListener('click', function(element) {
- if(element.target.classList.contains('boardShapeSelect_octagon')) {
- boardShape = 'octagon';
- boardSetUp(row, col, gridSize, boardShape);
- } else if (element.target.classList.contains('boardShapeSelect_square')) {
- boardShape = 'square';
- boardSetUp(row, col, gridSize, boardShape);
- }
-});*/
-
-
// ------------------------------------------------------------------------------------
// ------------------------------------------------------------------------------------
// SET UP THE SURROUND
@@ -183,11 +159,12 @@ stockDashboard.drawStock();
tradeContracts.populateContracts();
tradeContracts.drawContracts();
+
// Set up of goods dashboard
// -------------------------
-stockDashboard.goodsStockTake();
+//stockDashboard.goodsStockTake();
//console.log(gameBoard.boardArray);
@@ -222,6 +199,8 @@ function nextTurn() {
commentary.removeEventListener('click', clickGoods);
clearCommentary();
+ buildItem.clearBuilding();
+
// Resetting used pieces
pieceMovement.usedPiecesReset();
@@ -239,8 +218,10 @@ function nextTurn() {
needleDirection = compass.directionArray[windDirection].needle;
needle.style.transform = 'rotate(' + needleDirection + 'deg)';
- // Comment bar reset
+ // Comment and building bars reset
commentary.style.bottom = '-10%';
+ building.style.bottom = '-15%';
+
// End turn button colour is changed
endTurn.setAttribute('class', gameManagement.turn + ' team_fill team_stroke');
@@ -273,7 +254,7 @@ function nextTurn() {
tradeContracts.drawContracts();
// Update the goods dashboard
- stockDashboard.goodsStockTake();
+ //stockDashboard.goodsStockTake();
}
}
@@ -320,6 +301,23 @@ function popRunClose(e) {
}
};
+// Set up of building event listener
+// ------------------------------
+
+// building slider set up
+let building = document.querySelector('.building');
+let firstBuildLine = document.querySelector('#firstBuildLine');
+let secondBuildLine = document.querySelector('#secondBuildLine');
+let thirdBuildLine = document.querySelector('#thirdBuildLine');
+
+firstBuildLine.style.left = '7%';
+secondBuildLine.style.left = '7%';
+thirdBuildLine.style.left = '7%';
+
+// Event listener added to stock dashboard
+stockDashboardNode.addEventListener('click', buildItem.clickStock);
+
+
// ------------------------------------------------------------------------------------
// ------------------------------------------------------------------------------------
// PIECE MOVEMENT
@@ -342,7 +340,7 @@ let startEnd = 'start';
let chosenSquare = {start: '', end: ''};
let chosenHolding = {start: '', end: ''};
-// commentary box - Future work: develop into illustrated commentary by side of board (with flags and pieces)
+// commentary box set up
let commentary = document.querySelector('.commentary');
let firstLineComment = document.querySelector('#firstLine');
let secondLineComment = document.querySelector('#secondLine');
@@ -364,6 +362,10 @@ function clearCommentary() {
}
}
+
+
+
+
// Function for goods quantity selection
// ------------------------------------
@@ -476,6 +478,7 @@ function boardHandler(event) {
if (pieceMovement.movementArray[startEnd].pieces.stock > 0) {
firstLineComment.insertAdjacentText('beforeend', ' - ' + pieceMovement.movementArray[startEnd].pieces.goods + ": " + pieceMovement.movementArray[startEnd].pieces.stock);
}
+ building.style.bottom = '-15%';
commentary.style.bottom = 0;
// commentary event handler for goods
@@ -490,7 +493,7 @@ function boardHandler(event) {
if (pieceMovement.movementArray[startEnd].pieces.category == 'Resources' && pieceMovement.movementArray[startEnd].pieces.type != 'desert' && pieceMovement.movementArray[startEnd].pieces.team == 'Unclaimed') {
// Check that this resource type is not already held by player
let pieceTotalsTeamPosition = stockDashboard.pieceTotals.findIndex(fI => fI.team == gameManagement.turn);
- if(stockDashboard.pieceTotals[pieceTotalsTeamPosition].pieces[pieceMovement.movementArray.start.pieces.type] == 0) {
+ if(stockDashboard.pieceTotals[pieceTotalsTeamPosition].pieces[pieceMovement.movementArray.start.pieces.type].quantity == 0) {
if (pieceMovement.shipAvailable('crew') == 'crew') {
// TO ADD - Check that ship has not previously landed crew somewhere
secondLineComment.innerText = 'Click ship to land team and claim resource';
@@ -563,8 +566,10 @@ function boardHandler(event) {
// Once "start" piece has been selected second click needs to be to an active "end" square
// Piece move is then made
} else if (startEnd == 'end') {
- // Removing commentary
+ // Removing commentary / building slider
commentary.style.bottom = '-10%';
+ building.style.bottom = '-15%';
+
if (pieceMovement.movementArray.end.activeStatus == 'active') {
// Claiming of unclaimed resources
if (pieceMovement.movementArray.end.pieces.category == 'Transport' && pieceMovement.movementArray.start.pieces.type != 'desert' && pieceMovement.movementArray.start.pieces.team == 'Unclaimed') {
@@ -583,6 +588,8 @@ function boardHandler(event) {
pieceMovement.deactivateTiles(1);
gameBoard.drawActiveTiles();
//loadingStock = gameBoard.boardArray[pieceMovement.movementArray.start.row][pieceMovement.movementArray.start.col].pieces.stock;
+ let arrayPosition = stockDashboard.pieceTypes.findIndex(k => k.type == pieceMovement.movementArray.end.pieces.type);
+ loadingStock = Math.min(loadingStock, stockDashboard.pieceTypes[arrayPosition].maxHold - pieceMovement.movementArray.end.pieces.stock);
loadingGoods = gameBoard.boardArray[pieceMovement.movementArray.start.row][pieceMovement.movementArray.start.col].pieces.goods;
gameBoard.boardArray[pieceMovement.movementArray.start.row][pieceMovement.movementArray.start.col].pieces.stock -= loadingStock;
if (gameBoard.boardArray[pieceMovement.movementArray.start.row][pieceMovement.movementArray.start.col].pieces.category == 'Settlements') {
@@ -615,11 +622,25 @@ function boardHandler(event) {
gameBoard.boardArray[pieceMovement.movementArray.end.row][pieceMovement.movementArray.end.col].pieces.stock += loadingStock;
gameBoard.boardArray[pieceMovement.movementArray.end.row][pieceMovement.movementArray.end.col].pieces.goods = loadingGoods;
loadingStock = 0;
-
+ // Building new ship
+ } else if (pieceMovement.movementArray.start.pieces.category == 'Building') {
+ pieceMovement.deactivateTiles(1);
+ gameBoard.drawActiveTiles();
+ let newShip = boardMarkNode.appendChild(gameBoard.createActionTile(pieceMovement.movementArray.end.row, pieceMovement.movementArray.end.col, pieceMovement.movementArray.start.pieces.type, gameManagement.turn,
+ 'tile' + Number((pieceMovement.movementArray.end.row)*1000 + (pieceMovement.movementArray.end.col)), boardSurround + tileBorder/2 + (gridSize + tileBorder * 2) * (pieceMovement.movementArray.end.row), boardSurround + tileBorder/2 + (gridSize + tileBorder * 2) * (pieceMovement.movementArray.end.col), 1, pieceMovement.movementArray.end.pieces.direction));
+ if (pieceMovement.movementArray.start.pieces.type == 'cargo ship') {
+ gameBoard.boardArray[pieceMovement.movementArray.end.row][pieceMovement.movementArray.end.col].pieces = {populatedSquare: true, category: 'Transport', type: pieceMovement.movementArray.start.pieces.type, direction: '0', used: 'unused', damageStatus: 1, team: gameManagement.turn, goods: 'none', stock: 0, production: 0};
+ gameBoard.repairShip(newShip, gameManagement.turn, pieceMovement.movementArray.start.pieces.type, 1);
+ } else if (pieceMovement.movementArray.start.pieces.type == 'warship') {
+ gameBoard.boardArray[pieceMovement.movementArray.end.row][pieceMovement.movementArray.end.col].pieces = {populatedSquare: true, category: 'Transport', type: pieceMovement.movementArray.start.pieces.type, direction: '0', used: 'unused', damageStatus: 3, team: gameManagement.turn, goods: 'none', stock: 0, production: 0};
+ gameBoard.repairShip(newShip, gameManagement.turn, pieceMovement.movementArray.start.pieces.type, 3);
+ }
+ buildItem.constructionPayment(pieceMovement.movementArray.start.pieces.type);
// Piece movement
} else if (pieceMovement.movementArray.start.pieces.category == 'Transport') {
endTurn.removeEventListener('click', nextTurn);
boardMarkNode.removeEventListener('click', boardHandler);
+ stockDashboardNode.removeEventListener('click', buildItem.clickStock);
pieceMovement.deactivateTiles(maxMove);
// Redraw active tile layer after deactivation to remove activated tiles
gameBoard.drawActiveTiles();
@@ -628,16 +649,7 @@ function boardHandler(event) {
}
} else {
// Resetting if second click is not valid
- pieceMovement.deactivateTiles(maxMove);
- gameBoard.drawActiveTiles();
-
- // Resetting movement array once second click has been made (if invalid)
- pieceMovement.movementArray = {start: {row: '', col: ''}, end: {row: '', col: ''}};
- startEnd = 'start';
-
- // Removing commentary goods event handler
- commentary.removeEventListener('click', clickGoods);
- clearCommentary();
+ resetMove();
}
// Update the stock dashboard
@@ -647,6 +659,19 @@ function boardHandler(event) {
}
}
+function resetMove() {
+ pieceMovement.deactivateTiles(maxMove);
+ gameBoard.drawActiveTiles();
+
+ // Resetting movement array once second click has been made (if invalid)
+ pieceMovement.movementArray = {start: {row: '', col: ''}, end: {row: '', col: ''}};
+ startEnd = 'start';
+
+ // Removing commentary goods event handler
+ commentary.removeEventListener('click', clickGoods);
+ clearCommentary();
+}
+
// boardMarkNode is board holder in document
let boardMarkLeft = boardMarkNode.offsetLeft;
let boardMarkTop = boardMarkNode.offsetTop;
diff --git a/movement.js b/movement.js
index f8ff533..74038bd 100644
--- a/movement.js
+++ b/movement.js
@@ -414,6 +414,7 @@ let pieceMovement = {
startEnd = 'start';
endTurn.addEventListener('click', nextTurn);
boardMarkNode.addEventListener('click', boardHandler);
+ stockDashboardNode.addEventListener('click', buildItem.clickStock);
} else if (gameManagement.turn == 'Pirate') {
// Resetting movement array once second click has been made (if move valid)
diff --git a/pirates.js b/pirates.js
index 07dfb9d..d739cc6 100644
--- a/pirates.js
+++ b/pirates.js
@@ -120,6 +120,8 @@ let pirates = {
if (pirates.pirateCount == -1) {
// Generate array of all pirate ships to be moved
this.populatePirateShipsArray();
+ stockDashboard.drawStock();
+ tradeContracts.drawContracts();
}
// Moves on to next ship
pirates.pirateCount +=1;
@@ -143,6 +145,7 @@ let pirates = {
pirates.pirateCount = -1;
endTurn.addEventListener('click', nextTurn);
boardMarkNode.addEventListener('click', boardHandler);
+ stockDashboardNode.addEventListener('click', buildItem.clickStock);
}
},
@@ -264,12 +267,14 @@ let pirates = {
for (var i = 0; i < row; i++) {
for (var j = 0; j < col; j++) {
if (gameBoard.boardArray[i][j].pieces.type == 'fort') {
+ let fortTeam = gameBoard.boardArray[i][j].pieces.team;
for (var k = -1; k <= 1; k++) {
for (var l = -1; l <= 1; l++) {
if ((i+k >= 0) && (i+k < row)) {
if ((j+l >= 0) && (j+l < col)) {
if (gameBoard.boardArray[i+k][j+l].terrain == 'sea') {
gameBoard.boardArray[i+k][j+l].subTerrain = 'harbour';
+ gameBoard.boardArray[i+k][j+l].pieces.team = fortTeam;
}
}
}
diff --git a/surround.css b/surround.css
index 7c8afd4..cdd4384 100644
--- a/surround.css
+++ b/surround.css
@@ -53,9 +53,7 @@ html {
/* style to fix the header and footer and prevent scrolling */
.over_text {
position: fixed;
-
-
- z-index: 10;
+ z-index: 15;
}
.under_text {
@@ -124,7 +122,6 @@ html {
/* commentary box */
.commentary {
-
position: fixed;
text-align: center;
bottom: -10%;
@@ -138,8 +135,27 @@ html {
z-index: 15;
background-color: rgba(138, 87, 50, 0.1);
transition: bottom 0.2s ease-in-out
+}
+/* commentary box */
+.building {
+ position: fixed;
+ text-align: left;
+ bottom: -15%;
+ height: 10%;
+ left: 0%;
+ font-style: italic;
+ padding: 0.5% 0% 0.5% 0%;
+ color: rgb(137, 113, 82);
+ font-size:0.8em;
+ line-height: 140%;
+ z-index: 15;
+ background-color: rgba(138, 87, 50, 0.1);
+ transition: bottom 0.2s ease-in-out
+}
+#firstBuildLine, #secondBuildLine, #thirdBuildLine {
+ position: relative;
}
/* Side bar item holders and inner item formats*/
@@ -161,7 +177,7 @@ html {
margin-top: 10%;
padding-top: 10%;
padding-bottom: 0%;
- width: 90%;
+ width: 100%;
display: inline-block;
text-align: left;
font-size: 100%;
@@ -174,7 +190,7 @@ html {
padding-top: 10%;
padding-bottom: 10%;
margin-top: 0%;
- width: 90%;
+ width: 100%;
display: inline-block;
text-align: left;
margin-left: 8%;