const canvas = document.getElementById('canvas'); const ctx = canvas.getContext('2d'); const boardSize = 4; const tileSize = 100; const padding = 10; const board = []; let score = 0; function initializeBoard() { for (let i = 0; i < boardSize; i++) { board[i] = []; for (let j = 0; j < boardSize; j++) { board[i][j] = 0; } } } function drawTile(x, y, value) { ctx.beginPath(); ctx.rect(x, y, tileSize, tileSize); ctx.fillStyle = getTileColor(value); ctx.fill(); if (value !== 0) { ctx.font = 'bold 32px Arial'; ctx.fillStyle = '#776e65'; ctx.textAlign = 'center'; ctx.fillText(value, x + tileSize / 2, y + tileSize / 2 + 10); } } function drawBoard() { ctx.clearRect(0, 0, canvas.width, canvas.height); for (let i = 0; i < boardSize; i++) { for (let j = 0; j < boardSize; j++) { const x = j * (tileSize + padding); const y = i * (tileSize + padding); const value = board[i][j]; drawTile(x, y, value); } } } function getTileColor(value) { switch (value) { case 2: return '#eee4da'; case 4: return '#ede0c8'; case 8: return '#f2b179'; case 16: return '#f59563'; case 32: return '#f67c5f'; case 64: return '#f65e3b'; case 128: return '#edcf72'; case 256: return '#edcc61'; case 512: return '#edc850'; case 1024: return '#edc53f'; case 2048: return '#edc22e'; default: return '#cdc1b4'; } } function generateRandomTile() { const emptyTiles = []; for (let i = 0; i < boardSize; i++) { for (let j = 0; j < boardSize; j++) { if (board[i][j] === 0) { emptyTiles.push({ row: i, col: j }); } } } if (emptyTiles.length > 0) { const randomTile = emptyTiles[Math.floor(Math.random() * emptyTiles.length)]; const newValue = Math.random() < 0.9 ? 2 : 4; board[randomTile.row][randomTile.col] = newValue; } } function moveTiles(direction) { let moved = false; let merged = false; function mergeTiles(row) { for (let i = boardSize - 1; i > 0; i--) { if (row[i] === row[i - 1]) { row[i] *= 2; score += row[i]; row[i - 1] = 0; merged = true; } } } function moveRowLeft(row) { for (let i = 0; i < boardSize - 1; i++) { if (row[i] === 0 && row[i + 1] !== 0) { row[i] = row[i + 1]; row[i + 1] = 0; moved = true; } } } function moveRowRight(row) { for (let i = boardSize - 1; i > 0; i--) { if (row[i] === 0 && row[i - 1] !== 0) { row[i] = row[i - 1]; row[i - 1] = 0; moved = true; } } } function moveUp() { for (let j = 0; j < boardSize; j++) { const column = []; for (let i = 0; i < boardSize; i++) { column.push(board[i][j]); } moveRowLeft(column); mergeTiles(column); moveRowLeft(column); for (let i = 0; i < boardSize; i++) { board[i][j] = column[i]; } } } function moveDown() { for (let j = 0; j < boardSize; j++) { const column = []; for (let i = boardSize - 1; i >= 0; i--) { column.push(board[i][j]); } moveRowRight(column); mergeTiles(column); moveRowRight(column); for (let i = boardSize - 1; i >= 0; i--) { board[i][j] = column[boardSize - 1 - i]; } } } function moveLeft() { for (let i = 0; i < boardSize; i++) { moveRowLeft(board[i]); mergeTiles(board[i]); moveRowLeft(board[i]); } } function moveRight() { for (let i = 0; i < boardSize; i++) { moveRowRight(board[i]); mergeTiles(board[i]); moveRowRight(board[i]); } } switch (direction) { case 'up': moveUp(); break; case 'down': moveDown(); break; case 'left': moveLeft(); break; case 'right': moveRight(); break; } return moved || merged; } function checkGameOver() { for (let i = 0; i < boardSize; i++) { for (let j = 0; j < boardSize; j++) { if (board[i][j] === 0) { return false; } if (i > 0 && board[i][j] === board[i - 1][j]) { return false; } if (i < boardSize - 1 && board[i][j] === board[i + 1][j]) { return false; } if (j > 0 && board[i][j] === board[i][j - 1]) { return false; } if (j < boardSize - 1 && board[i][j] === board[i][j + 1]) { return false; } } } return true; } function handleKeyPress(event) { if (event.key === 'ArrowUp') { if (moveTiles('up')) { generateRandomTile(); drawBoard(); if (checkGameOver()) { console.log('Game Over'); } } } else if (event.key === 'ArrowDown') { if (moveTiles('down')) { generateRandomTile(); drawBoard(); if (checkGameOver()) { console.log('Game Over'); } } } else if (event.key === 'ArrowLeft') { if (moveTiles('left')) { generateRandomTile(); drawBoard(); if (checkGameOver()) { console.log('Game Over'); } } } else if (event.key === 'ArrowRight') { if (moveTiles('right')) { generateRandomTile(); drawBoard(); if (checkGameOver()) { console.log('Game Over'); } } } } function startGame() { initializeBoard(); generateRandomTile(); generateRandomTile(); drawBoard(); document.addEventListener('keydown

GPTgame

Sign up for free tokens!

2048 game

GPTgame