diff --git a/halloffame.json b/halloffame.json index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..1619b1e2e868703aac0a3bff6b4e8b070663e301 100644 --- a/halloffame.json +++ b/halloffame.json @@ -0,0 +1 @@ +{"test2":1,"aaa":1,"bbb":2,"fff":1} \ No newline at end of file diff --git a/public/room.html b/public/room.html index 81875d26cef7d10b3b3400b21087975f0b0030de..a01235835f0c15fd1e09a6ef9e428504eae3babe 100644 --- a/public/room.html +++ b/public/room.html @@ -32,11 +32,10 @@ const CELL_SIZE = 100; const RADIUS = CELL_SIZE / 2 - 10; - // Initialize game board function drawBoard(board) { - console.log(board); // Draw Connect4 grid based on board state - ctx.clearRect(0, 0, canvas.width, canvas.height); + ctx.fillStyle = 'blue'; + ctx.fillRect(0, 0, canvas.width, canvas.height); for (let row = 0; row < ROWS; row++) { for (let col = 0; col < COLS; col++) { let x = col * CELL_SIZE + CELL_SIZE / 2; @@ -49,12 +48,12 @@ ctx.fill(); // Pion - if (board[row][col] !== null) { - ctx.beginPath(); - ctx.arc(x, y, RADIUS, 0, Math.PI * 2); - ctx.fillStyle = board[row][col] === 0 ? 'red' : 'yellow'; - ctx.fill(); - } + ctx.beginPath(); + ctx.arc(x, y, RADIUS, 0, Math.PI * 2); + ctx.fillStyle = 'white'; + if (board[row][col] === 0) {ctx.fillStyle='red';} + if (board[row][col] === 1) {ctx.fillStyle='yellow';} + ctx.fill(); } } } @@ -80,18 +79,18 @@ }); - socket.on('stopGame', () => { + socket.on('stopGame', ({board, winner}) => { + alert(winner === 0 ? 'Player 1 wins!' : 'Player 2 wins!'); const messages = document.getElementById('messages'); messages.innerHTML += `<div><strong>Game Finish</strong></div>`; }); - socket.on('updateGame', ({ board, currentPlayer, winner }) => { + socket.on('updateGame', ({ board, currentPlayer}) => { drawBoard(board); - if (winner !== null) alert(winner === 0 ? 'Player 1 wins!' : 'Player 2 wins!'); }); canvas.addEventListener('click', (e) => { - const col = Math.floor(e.offsetX / 100); + const col = Math.floor(e.offsetX / CELL_SIZE); socket.emit('move', col); }); @@ -107,8 +106,6 @@ const messages = document.getElementById('messages'); messages.innerHTML += `<div><strong>${name}:</strong> ${message}</div>`; }); - - drawBoard(); // initial </script> </body> </html> \ No newline at end of file diff --git a/server.js b/server.js index 20ded88c77df735eb1085b3d3ebfd961d8abd388..ef06faa014c000f72ee2cb4830e9a0b59c83447a 100644 --- a/server.js +++ b/server.js @@ -5,8 +5,6 @@ const { } = require('uuid'); const fs = require('fs'); - - const app = express(); const PORT = process.env.PORT || 3000; @@ -50,11 +48,12 @@ io.on('connection', (socket) => { let stopGame = (room, roomId) => { console.log("Not enough players in room " + roomId + ", game stops."); + room["gameState"] = Array(6).fill().map(() => Array(7).fill(null)); + room["currentPlayer"] = 0; }; let startGame = (room, roomId) => { console.log("Two players on room " + roomId + ", game starting."); - console.log(room); io.to(roomId).emit('startGame', { board: room.gameState, currentPlayer: room.currentPlayer @@ -112,11 +111,12 @@ io.on('connection', (socket) => { return; }; - console.log("On room " + currentRoom + ", " + playerName + " played on column " + col); const row = findAvailableRow(currentRoom.gameState, col); if (row === -1) return; + console.log("On room " + currentRoom.id + ", " + playerName + " played on column " + col + " at height" + row); + currentRoom.gameState[row][col] = playerIndex; currentRoom.moves.push({ player: playerIndex, @@ -125,17 +125,24 @@ io.on('connection', (socket) => { const winner = checkWin(currentRoom.gameState, row, col); if (winner !== null) { + console.log("In room "+currentRoom.id+", player "+playerName+" won"); hallOfFame[playerName] = (hallOfFame[playerName] || 0) + 1; fs.writeFileSync('halloffame.json', JSON.stringify(hallOfFame)); + stopGame(currentRoom, currentRoom.id); + socket.join(currentRoom.id); + io.to(currentRoom.id).emit('stopGame', { + board: currentRoom.gameState, + winner: winner + }); + } + else { + currentRoom.currentPlayer = 1 - currentRoom.currentPlayer; + socket.join(currentRoom.id); + io.to(currentRoom.id).emit('updateGame', { + board: currentRoom.gameState, + currentPlayer: currentRoom.currentPlayer + }); } - - currentRoom.currentPlayer = 1 - currentRoom.currentPlayer; - socket.join(currentRoom.id) - io.to(currentRoom.id).emit('updateGame', { - board: currentRoom.gameState, - currentPlayer: currentRoom.currentPlayer, - winner - }); }); socket.on('chatMessage', (message) => { @@ -155,7 +162,7 @@ io.on('connection', (socket) => { function findAvailableRow(board, col) { for (let row = 5; row >= 0; row--) { - if (!board[row][col]) return row; + if (board[row][col] == null) return row; } return -1; }