diff --git a/README.md b/README.md
index 6d7d15b..a71ef57 100644
--- a/README.md
+++ b/README.md
@@ -8,10 +8,15 @@ This is a Javascript application running on a node express server. I am using th
+
+
diff --git a/server.js b/server.js
index 9bf9409..fab4c59 100644
--- a/server.js
+++ b/server.js
@@ -111,30 +111,29 @@ io.on('connection', function(socket) {
}
}
});
- // broadcast current game state to all sockets in the room with a particular access code
+ // send the game state to the client that requested it
socket.on('requestState', function(data) {
const game = activeGames[Object.keys(activeGames).find((key) => key === data.code)];
if (game && Object.keys(socket.rooms).includes(data.code) === false) {
socket.join(data.code, function() {
- io.sockets.in(data.code).emit('state', game);
+ socket.emit('state', game);
});
} else {
if (game) {
- io.sockets.in(data.code).emit('state', game);
+ socket.emit('state', game);
}
}
});
socket.on('startGame', function(gameData) {
let game = activeGames[Object.keys(activeGames).find((key) => key === gameData.code)];
if (game) {
- game.state = "started";
+ game.status = "started";
game.players = gameData.players;
if (game.time) {
let d = new Date();
d.setMinutes(d.getMinutes() + parseInt(game.time));
game.endTime = d.toJSON();
}
- io.sockets.in(gameData.code).emit('state', game);
}
});
socket.on('pauseGame', function(code) {
@@ -142,7 +141,6 @@ io.on('connection', function(socket) {
if (game) {
game.pauseTime = (new Date()).toJSON();
game.paused = true;
- io.sockets.in(code).emit('state', game);
}
});
socket.on('resumeGame', function(code) {
@@ -153,15 +151,13 @@ io.on('connection', function(socket) {
let newDate = new Date(game.endTime);
newDate.setTime(newTime);
game.endTime = newDate.toJSON();
- io.sockets.in(code).emit('state', game);
}
});
socket.on("timerExpired", function(code) {
let game = activeGames[Object.keys(activeGames).find((key) => key === code)];
if (game) {
game.winningTeam = "wolf";
- game.state = "ended";
- io.sockets.in(code).emit('state', game);
+ game.status = "ended";
}
});
socket.on('killPlayer', function(id, code) {
@@ -176,14 +172,10 @@ io.on('connection', function(socket) {
const winCheck = teamWon(game);
if (winCheck === "wolf") {
game.winningTeam = "wolf";
- game.state = "ended";
- io.sockets.in(code).emit('state', game);
- } else if (winCheck === "village") {
+ game.status = "ended";
+ } if (winCheck === "village") {
game.winningTeam = "village";
- game.state = "ended";
- io.sockets.in(code).emit('state', game);
- } else {
- io.sockets.in(code).emit('state', game);
+ game.status = "ended";
}
}
});
diff --git a/static/game.js b/static/game.js
index 3eeb770..e5a0cf7 100644
--- a/static/game.js
+++ b/static/game.js
@@ -5,6 +5,7 @@ const socket = io();
const standardRoles = ["Villager", "Werewolf", "Seer", "Shadow", "Hunter", "Mason", "Minion", "Sorcerer"];
let clock;
let currentGame = null;
+let lastGameState = null;
let cardFlippedOver = false;
let cardRendered = false;
let lastKilled = null;
@@ -12,7 +13,9 @@ let lastKilled = null;
// respond to the game state received from the server
socket.on('state', function(game) {
currentGame = game;
- buildGameBasedOnState();
+ if(detectChanges(game)) {
+ buildGameBasedOnState(game);
+ }
});
window.onblur = function() { // pause animations if the window is not in focus
@@ -27,8 +30,8 @@ window.onfocus = function() { // play animations when window is focused
this.document.querySelector("#killed-name").style.animationPlayState = 'running';
};
-function buildGameBasedOnState() {
- switch(currentGame.state) {
+function buildGameBasedOnState(game) {
+ switch(game.status) {
case "lobby":
renderLobby();
break;
@@ -43,6 +46,19 @@ function buildGameBasedOnState() {
}
}
+function detectChanges(game) {
+ if (lastGameState === null ||
+ lastGameState.status !== game.status ||
+ lastGameState.paused !== game.paused ||
+ lastGameState.lastKilled !== game.lastKilled ||
+ lastGameState.startTime !== game.startTime ||
+ lastGameState.players.length !== game.players.length) {
+ lastGameState = game;
+ return true;
+ }
+ return false;
+}
+
function hideAfterExit(e) {
e.target.style.display = 'none';
e.target.classList.remove(e.target.exitClass);
@@ -312,7 +328,7 @@ function renderLobby() {
}
}
-// request the current state of the game from the server
-window.onload = function() {
+// request game state from server periodically
+setInterval(function () {
socket.emit('requestState', {code: sessionStorage.getItem("code")});
-};
+}, 200);
diff --git a/static/setup.js b/static/setup.js
index cf4abf7..31d60ad 100644
--- a/static/setup.js
+++ b/static/setup.js
@@ -23,7 +23,7 @@ class Game {
this.deck = deck;
this.time = time;
this.players = [];
- this.state = "lobby";
+ this.status = "lobby";
this.endTime = null;
}
}