Skip to content
Snippets Groups Projects
Commit 6f616038 authored by AceZephyr's avatar AceZephyr
Browse files

Spectator colors

parent aa534627
No related branches found
No related tags found
No related merge requests found
......@@ -56,3 +56,11 @@
.color-red {
background-color: pink;
}
.color-yellow {
background-color: yellow;
}
.color-blue {
background-color: lightskyblue;
}
......@@ -5,6 +5,8 @@ const BOARDS = new Set();
const CELL_COLORS = new Map();
CELL_COLORS.set(1, "color-green");
CELL_COLORS.set(2, "color-red");
CELL_COLORS.set(3, "color-yellow"); // spectator player 1
CELL_COLORS.set(4, "color-blue"); // spectator player 2
function deselectAllBoards() {
BOARDS.forEach(board => board.deselect());
......
......@@ -43,7 +43,7 @@
BOARD1 = new SudokuBoard("board-container", args.editable, updateToServer);
BOARD1.updateBoard(args.boardDisplay, args.boardLock, args.boardColors);
BOARD1.editable = args.editable;
displayPlayerScores(args.playerScores);
displayPlayerScores(args.playerScores, args.playerColors);
hideJoinButton();
});
......@@ -84,11 +84,15 @@
}
}
function displayPlayerScores(playerScores) {
function displayPlayerScores(playerScores, playerColors) {
removePrevScore();
for (let player in playerScores) {
let scoreText = document.createElement("p");
if (BOARD1.editable) {
scoreText.textContent = `${player}: ${playerScores[player]}`;
} else {
scoreText.textContent = `${player} (${playerColors[player]}): ${playerScores[player]}`;
}
playerInfo.appendChild(scoreText);
}
}
......
......@@ -14,6 +14,7 @@
<div id="message"></div>
<script>
document.querySelector("#button-login").onclick = () => {
document.querySelector("#message").innerText = "";
fetch("/login", {
method: "POST",
headers: {
......
......@@ -68,17 +68,22 @@ class Game {
this.boardSolution = gen[1];
this.boardLock = ARR9.map(y => ARR9.map(x => this.boardDisplay[y][x] ? 1 : 0));
this.boardColors = ARR9.map(y => ARR9.map(x => this.boardDisplay[y][x] ? 1 : 0));
this.boardSpectatorColors = ARR9.map(y => ARR9.map(x => this.boardDisplay[y][x] ? 1 : 0));
this.playerUsers.forEach(user => this.playerScores[user] = 0);
this.state = ROOM_PLAYING;
this.sendBoard();
}
packageBoardState(editable) {
const playerColors = {};
playerColors[this.playerUsers[0]] = "Yellow";
playerColors[this.playerUsers[1]] = "Blue";
return {
boardDisplay: this.boardDisplay,
boardLock: this.boardLock,
boardColors: this.boardColors,
boardColors: editable ? this.boardColors : this.boardSpectatorColors,
playerScores: this.playerScores,
playerColors: playerColors,
editable: editable
};
}
......@@ -119,10 +124,12 @@ class Game {
return false;
if (this.boardSolution[y][x] === val) {
this.boardColors[y][x] = 1;
this.boardSpectatorColors[y][x] = this.playerUsers.indexOf(user) + 3;
this.boardLock[y][x] = 1;
dPoints = 1;
} else {
this.boardColors[y][x] = 2;
this.boardSpectatorColors[y][x] = 2;
dPoints = -1;
}
this.boardDisplay[y][x] = val;
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment