diff --git a/public/index.html b/public/index.html index 2e5ef9d..4688257 100644 --- a/public/index.html +++ b/public/index.html @@ -15,6 +15,13 @@ +
+
+

We have a winner

+ +
+
+
diff --git a/public/scripts/index.js b/public/scripts/index.js index c5efd32..0d3c985 100644 --- a/public/scripts/index.js +++ b/public/scripts/index.js @@ -48,6 +48,8 @@ socket.on("played move", (isHit, isWin) => { if (isHit) hitNotification.classList.remove("hidden-element"); else hitNotification.classList.add("hidden-element"); + if (isWin) gameEnd() + if (isWin) winNotification.classList.remove("hidden-element"); else winNotification.classList.add("hidden-element"); @@ -60,6 +62,11 @@ socket.on('opponent left', () => { modal.style.display = 'block'; }) +function gameEnd() { + const modal = document.getElementById('gameEndedModal'); + modal.style.display = 'block'; +} + export function sendMove(move) { const notification = document.querySelector("#play_notification"); socket.emit("play", roomId, socket.id, move); @@ -111,4 +118,15 @@ document.getElementById('closeModalButton').addEventListener('click', () => { drawGrid() }); +document.getElementById('closeModalButton').addEventListener('click', () => { + const modal = document.getElementById('opponentLeftModal'); + const ennemyBoard = document.querySelector("#ennemy_board"); + + ennemyBoard.classList.add("hidden-element"); + modal.style.display = 'none'; + + socket.emit("reset grid", roomId) + drawGrid() +}); + setTimeout(startConnection, 100);