const canvas = document.getElementById('canvas'); const ctx = canvas.getContext('2d'); const gridSize = 4; const tileSize = 100; const tileMargin = 10; const gameBoard = []; let score = 0; // Initialize game board for (let i = 0; i < gridSize; i++) { gameBoard[i] = []; for (let j = 0; j < gridSize; j++) { gameBoard[i][j] = 0; } } // Generate a new tile function generateTile() { const emptyTiles = []; for (let i = 0; i < gridSize; i++) { for (let j = 0; j < gridSize; j++) { if (gameBoard[i][j] === 0) { emptyTiles.push({ x: i, y: j }); } } } if (emptyTiles.length > 0) { const randomIndex = Math.floor(Math.random() * emptyTiles.length); const randomTile = emptyTiles[randomIndex]; gameBoard[randomTile.x][randomTile.y] = Math.random() < 0.9 ? 2 : 4; } } // Draw the game board function drawBoard() { ctx.clearRect(0, 0, canvas.width, canvas.height); for (let i = 0; i < gridSize; i++) { for (let j = 0; j < gridSize; j++) { const tile = gameBoard[i][j]; const x = j * (tileSize + tileMargin) + tileMargin; const y = i * (tileSize + tileMargin) + tileMargin; ctx.fillStyle = getTileColor(tile); ctx.fillRect(x, y, tileSize, tileSize); ctx.fillStyle = getTextColor(tile); ctx.font = 'bold 24px Arial'; ctx.textAlign = 'center'; ctx.textBaseline = 'middle'; ctx.fillText(tile, x + tileSize / 2, y + tileSize / 2); } } } // Get color for the tile function getTileColor(tile) { switch (tile) { 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'; } } // Get text color for the tile function getTextColor(tile) { return tile >= 8 ? '#f9f6f2' : '#776e65'; } // Check if the game is over function isGameOver() { for (let i = 0; i < gridSize; i++) { for (let j = 0; j < gridSize; j++) { if (gameBoard[i][j] === 0) { return false; } if (i < gridSize - 1 && gameBoard[i][j] === gameBoard[i + 1][j]) { return false; } if (j < gridSize - 1 && gameBoard[i][j] === gameBoard[i][j + 1]) { return false; } } } return true; } // Move tiles to the left function moveLeft() { let moved = false; for (let i = 0; i < gridSize; i++) { for (let j = 1; j < gridSize; j++) { if (gameBoard[i][j] !== 0) { let k = j - 1; while (k >= 0 && gameBoard[i][k] === 0) { gameBoard[i][k] = gameBoard[i][k + 1]; gameBoard[i][k + 1] = 0; k--; moved = true; } if (k >= 0 && gameBoard[i][k] === gameBoard[i][k + 1]) { gameBoard[i][k] *= 2; score += gameBoard[i][k]; gameBoard[i][k + 1] = 0; moved = true; } } } } return moved; } // Move tiles to the right function moveRight() { let moved = false; for (let i = 0; i < gridSize; i++) { for (let j = gridSize - 2; j >= 0; j--) { if (gameBoard[i][j] !== 0) { let k = j + 1; while (k < gridSize && gameBoard[i][k] === 0) { gameBoard[i][k] = gameBoard[i][k - 1]; gameBoard[i][k - 1] = 0; k++; moved = true; } if (k < gridSize && gameBoard[i][k] === gameBoard[i][k - 1]) { gameBoard[i][k] *= 2; score += gameBoard[i][k]; gameBoard[i][k - 1] = 0; moved = true; } } } } return moved; } // Move tiles upwards function moveUp() { let moved = false; for (let j = 0; j < gridSize; j++) { for (let i = 1; i < gridSize; i++) { if (gameBoard[i][j] !== 0) { let k = i - 1; while (k >= 0 && gameBoard[k][j] === 0) { gameBoard[k][j] = gameBoard[k + 1][j]; gameBoard[k + 1][j] = 0; k--; moved = true; } if (k >= 0 && gameBoard[k][j] === gameBoard[k + 1][j]) { gameBoard[k][j] *= 2; score += gameBoard[k][j]; gameBoard[k + 1][j] = 0; moved = true; } } } } return moved; } // Move tiles downwards function moveDown() { let moved = false; for (let j = 0; j < gridSize; j++) { for (let i = gridSize - 2; i >= 0; i--) { if (gameBoard[i][j] !== 0) { let k = i + 1; while (k < gridSize && gameBoard[k][j] === 0) { gameBoard[k][j] = gameBoard[k - 1][j]; gameBoard[k - 1][j] = 0; k++; moved = true; } if (k < gridSize && gameBoard[k][j] === gameBoard[k - 1][j]) { gameBoard[k][j] *= 2; score += gameBoard[k][j]; gameBoard[k - 1][j] = 0; moved = true; } } } } return moved; } // Handle keydown event document.addEventListener('keydown', (event) => { let moved = false; switch (event.key) { case 'ArrowLeft': moved = moveLeft(); break; case 'ArrowRight': moved = moveRight(); break; case 'ArrowUp': moved = moveUp(); break; case 'ArrowDown': moved = moveDown(); break; } if (moved) { generateTile(); drawBoard(); if (isGameOver()) { alert('Game Over!'); } } }); // Initialize game generateTile(); generateTile(); drawBoard();

GPTgame

Sign up for free tokens!

game 2048 work version

GPTgame