Leahnaya/TableturfBattleApp
1
0
Fork 0
mirror of https://github.com/AndrioCelos/TableturfBattleApp.git synced 2026-04-24 07:17:05 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

Show projected turf count while choosing a placement

Browse Source
This commit is contained in:
Andrio Celos 2023-03-14 09:50:03 +11:00
parent 878d4e45cd
commit b2f3d8c16f
2 changed files with 43 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
TableturfBattleClient/src/Board.ts
View File

@ -20,6 +20,7 @@ class Board {
onsubmit: ((x: number, y: number) => void) | null = null;
oncancel: (() => void) | null = null;
onhighlightchange: ((dScores: number[] | null) => void) | null = null;
constructor(table: HTMLTableElement) {
this.table = table;
@ -158,7 +159,8 @@ class Board {
let legal = this.playerIndex == null || this.cardPlaying == null ? false
: this.checkMoveLegality(this.playerIndex, this.cardPlaying, this.highlightX, this.highlightY, this.cardRotation, this.specialAttack) == null;
this.clearHighlight();
this.internalClearHighlight();
const dScores = legal ? [ 0, 0, 0, 0 ] : null;
if (this.cardPlaying != null && this.playerIndex != null) {
for (let dx = 0; dx < 8; dx++) {
const x2 = this.highlightX + dx;
@ -170,6 +172,12 @@ class Board {
continue;
const space = this.cardPlaying.getSpace(dx, dy, this.cardRotation);
if (space != Space.Empty) {
if (dScores) {
const existingSpace = this.grid[x2][y2];
if (existingSpace >= Space.Ink1)
dScores[existingSpace & 3]--;
dScores[this.playerIndex]++;
}
const cell = this.cells[x2][y2];
cell.classList.add('hover');
cell.classList.add(`hover${this.playerIndex + 1}`);
@ -181,10 +189,18 @@ class Board {
}
}
}
if (this.onhighlightchange)
this.onhighlightchange(dScores);
}
}
clearHighlight() {
this.internalClearHighlight();
if (this.onhighlightchange)
this.onhighlightchange(null);
}
private internalClearHighlight() {
for (const [x, y] of this.highlightedCells) {
this.cells[x][y].setAttribute('class', Space[this.grid[x][y]] );
}
@ -286,16 +302,16 @@ class Board {
this.cells[x][y].setAttribute('class', Space[newState]);
}
getScore(playerIndex: number) {
let count = 0;
getScores() {
const scores = [ 0, 0, 0, 0 ];
for (let x = 0; x < this.grid.length; x++) {
for (let y = 0; y < this.grid[x].length; y++) {
const space = this.grid[x][y];
if (space >= Space.Ink1 && (space & 3) == playerIndex)
count++;
if (space >= Space.Ink1)
scores[space & 3]++;
}
}
return count;
return scores;
}
/**

29
TableturfBattleClient/src/Pages/GamePage.ts
View File

@ -164,8 +164,9 @@ replayNextButton.addEventListener('click', _ => {
replayAnimationAbortController = null;
turnNumberLabel.setTurnNumber(currentGame.turnNumber);
board.refresh();
const scores = board.getScores();
for (let i = 0; i < currentGame.players.length; i++) {
updateStats(i);
updateStats(i, scores);
}
}
@ -255,6 +256,7 @@ replayPreviousButton.addEventListener('click', _ => {
if (currentGame.turnNumber > 0) {
turnNumberLabel.setTurnNumber(currentGame.turnNumber);
const scores = board.getScores();
for (let i = 0; i < currentGame.players.length; i++) {
const move = currentReplay.turns[currentGame.turnNumber - 1][i];
if (move.isPass) {
@ -262,7 +264,7 @@ replayPreviousButton.addEventListener('click', _ => {
currentGame.players[i].specialPoints--;
} else if ((move as PlayMove).isSpecialAttack)
currentGame.players[i].specialPoints += (move as PlayMove).card.specialCost;
updateStats(i);
updateStats(i, scores);
}
} else
turnNumberLabel.setTurnNumber(null);
@ -299,8 +301,9 @@ flipButton.addEventListener('click', () => {
replayAnimationAbortController = null;
clearPlayContainers();
turnNumberLabel.setTurnNumber(currentGame.turnNumber);
const scores = board.getScores();
for (let i = 0; i < currentGame.players.length; i++) {
updateStats(i);
updateStats(i, scores);
}
}
if (currentReplay) {
@ -410,11 +413,12 @@ document.getElementById('testAllCardsMobileButton')!.addEventListener('click', _
function loadPlayers(players: Player[]) {
gamePage.dataset.players = players.length.toString();
const scores = board.getScores();
for (let i = 0; i < players.length; i++) {
const player = players[i];
currentGame!.players[i] = players[i];
playerBars[i].name = player.name;
updateStats(i);
updateStats(i, scores);
if (player.colour.r || player.colour.g || player.colour.b) {
document.body.style.setProperty(`--primary-colour-${i + 1}`, `rgb(${player.colour.r}, ${player.colour.g}, ${player.colour.b})`);
document.body.style.setProperty(`--special-colour-${i + 1}`, `rgb(${player.specialColour.r}, ${player.specialColour.g}, ${player.specialColour.b})`);
@ -426,9 +430,9 @@ function loadPlayers(players: Player[]) {
}
}
function updateStats(playerIndex: number) {
function updateStats(playerIndex: number, scores: number[]) {
if (currentGame == null) return;
playerBars[playerIndex].points = board.getScore(playerIndex);
playerBars[playerIndex].points = scores[playerIndex];
playerBars[playerIndex].pointsDelta = 0;
playerBars[playerIndex].pointsTo = 0;
playerBars[playerIndex].specialPoints = currentGame.players[playerIndex].specialPoints;
@ -507,13 +511,14 @@ async function playInkAnimations(data: {
board.refresh();
if (data.specialSpacesActivated.length > 0)
await delay(1000, abortSignal); // Delay if we expect that this changed the board.
const scores = board.getScores();
for (let i = 0; i < data.game.players.length; i++) {
playerBars[i].specialPoints = data.game.players[i].specialPoints;
playerBars[i].pointsDelta = board.getScore(i) - playerBars[i].points;
playerBars[i].pointsDelta = scores[i] - playerBars[i].points;
}
await delay(1000, abortSignal);
for (let i = 0; i < data.game.players.length; i++) {
updateStats(i);
updateStats(i, scores);
}
await delay(1000, abortSignal);
}
@ -840,6 +845,14 @@ board.oncancel = () => {
}
};
board.onhighlightchange = dScores => {
if (currentGame == null) return;
const scores = board.getScores();
for (let i = 0; i < playerBars.length; i++) {
playerBars[i].pointsTo = dScores && dScores[i] != 0 ? scores[i] + dScores[i] : null;
}
};
function focusFirstEnabledHandCard() {
const input = document.activeElement as HTMLInputElement;
if (input.name == 'handCard') {