From 425fdc621adf3ca752c90f7ef1a374ce8b55216f Mon Sep 17 00:00:00 2001 From: MaciejkaG Date: Sat, 9 Mar 2024 01:11:03 +0100 Subject: [PATCH] Minor changes - Fixed leaving a lobby - Improved CSS compatibility/clarity - Optimised game finishing --- index.js | 32 +++++++++++--------------------- public/assets/css/board.css | 3 ++- public/assets/css/main.css | 22 +++++++++++----------- public/assets/js/socket.js | 35 ++++++++++++++++++----------------- 4 files changed, 42 insertions(+), 50 deletions(-) diff --git a/index.js b/index.js index 25bb282..9c17744 100644 --- a/index.js +++ b/index.js @@ -209,6 +209,7 @@ io.on('connection', async (socket) => { if (playerGame.data.state === 'pregame') { socket.join(playerGame.id); if (io.sockets.adapter.rooms.get(playerGame.id).size === 2) { + GInfo.resetTimer(playerGame.id); io.to(playerGame.id).emit('players ready'); const members = [...roomMemberIterator(playerGame.id)]; @@ -243,6 +244,10 @@ io.on('connection', async (socket) => { await redis.json.set(`game:${playerGame.id}`, '$.state', "preparation"); } else if (io.sockets.adapter.rooms.get(playerGame.id).size > 2) { socket.disconnect(); + } else { + GInfo.timer(playerGame.id, 30, () => { + AFKEnd(playerGame.id); + }); } } @@ -292,29 +297,14 @@ io.on('connection', async (socket) => { if (hit.gameFinished) { const members = [...roomMemberIterator(playerGame.id)]; - let hostNickname; - let guestNickname; + let hostSocket = io.sockets.sockets.get(members[0][0]); + let hostNickname = hostSocket.request.session.nickname; + let guestSocket = io.sockets.sockets.get(members[1][0]); + let guestNickname = guestSocket.request.session.nickname; - for (let i = 0; i < members.length; i++) { - const sid = members[i][0]; - const socket = io.sockets.sockets.get(sid); - if (socket.request.session.id === playerGame.data.hostId) { - hostNickname = socket.request.session.nickname; - } else { - guestNickname = socket.request.session.nickname; - } - } - - for (let i = 0; i < members.length; i++) { - const sid = members[i][0]; - const socket = io.sockets.sockets.get(sid); - if (socket.request.session.id === playerGame.data.hostId) { - io.to(sid).emit("game finished", !enemyIdx ? 1 : 0, guestNickname); - } else { - io.to(sid).emit("game finished", !enemyIdx ? 1 : 0, hostNickname); - } - } + hostSocket.emit("game finished", !enemyIdx ? 1 : 0, guestNickname); + guestSocket.emit("game finished", !enemyIdx ? 1 : 0, hostNickname); GInfo.resetTimer(playerGame.id); endGame(playerGame.id); diff --git a/public/assets/css/board.css b/public/assets/css/board.css index d02bb28..8e401c7 100644 --- a/public/assets/css/board.css +++ b/public/assets/css/board.css @@ -244,7 +244,7 @@ h1,h2,h3,h4,h5,h6 { } .cover .dialog button { - padding: 0.5em 3em; + padding: 0.5rem 2rem; font-size: 1rem; background-color: black; border: solid 1px white; @@ -252,6 +252,7 @@ h1,h2,h3,h4,h5,h6 { border-radius: 15px; outline: none; cursor: pointer; + transition: all 0.3s; } .cover .dialog button:hover { diff --git a/public/assets/css/main.css b/public/assets/css/main.css index 9c961c9..44ed056 100644 --- a/public/assets/css/main.css +++ b/public/assets/css/main.css @@ -38,7 +38,7 @@ #mainMenuView .modes div { height: 10rem; width: 10rem; - background: black; + background-color: black; border: solid 1px white; border-radius: 15px; user-select: none; @@ -47,7 +47,7 @@ } #mainMenuView .modes div:hover { - background: white; + background-color: white; color: black; } @@ -60,7 +60,7 @@ #pvpMenuView .modes div { height: 10rem; width: 10rem; - background: black; + background-color: black; border: solid 1px white; border-radius: 15px; user-select: none; @@ -69,7 +69,7 @@ } #pvpMenuView .modes div:hover { - background: white; + background-color: white; color: black; } @@ -82,7 +82,7 @@ #pvpCreateView .modes div { height: 17rem; width: 15rem; - background: black; + background-color: black; border: solid 1px white; border-radius: 15px; user-select: none; @@ -93,7 +93,7 @@ } #pvpCreateView input, #pvpCreateView button { - background: black; + background-color: black; color: white; border-radius: 15px; border: 1px solid white; @@ -111,7 +111,7 @@ } #pvpCreateView button:hover { - background: white; + background-color: white; color: black; } @@ -124,7 +124,7 @@ #pvpJoinView .modes div { height: 7rem; width: 15rem; - background: black; + background-color: black; border: solid 1px white; border-radius: 15px; user-select: none; @@ -138,7 +138,7 @@ } #pvpJoinView form input { - background: black; + background-color: black; color: white; border-radius: 15px; border: 1px solid white; @@ -155,7 +155,7 @@ } #pvpJoinView form input[type=submit]:hover { - background: white; + background-color: white; color: black; } @@ -168,7 +168,7 @@ #preparingGame .modes div { height: 13rem; width: 11rem; - background: black; + background-color: black; border: solid 1px white; border-radius: 15px; user-select: none; diff --git a/public/assets/js/socket.js b/public/assets/js/socket.js index f4ea422..8e4c766 100644 --- a/public/assets/js/socket.js +++ b/public/assets/js/socket.js @@ -63,25 +63,26 @@ $("#createGameButton").on("click", function () { $("#leaveGameButton").on("click", function () { lockUI(true); - socket.emit("leave lobby", (response) => { - switch (response.status) { - case "ok": - switchView("mainMenuView"); - lockUI(false); - break; + window.location.reload(); + // socket.emit("leave lobby", (response) => { + // switch (response.status) { + // case "ok": + // switchView("mainMenuView"); + // lockUI(false); + // break; - case "youreNotInLobby": - switchView("mainMenuView"); - lockUI(false); - break; + // case "youreNotInLobby": + // switchView("mainMenuView"); + // lockUI(false); + // break; - default: - alert(`Wystąpił nieznany problem\nStatus: ${response.status}`); - switchView("mainMenuView"); - lockUI(false); - break; - } - }); + // default: + // alert(`Wystąpił nieznany problem\nStatus: ${response.status}`); + // switchView("mainMenuView"); + // lockUI(false); + // break; + // } + // }); }); $("#pvpMenuButton").on("click", function () {