const canvas = document.getElementById('canvas'); const ctx = canvas.getContext('2d'); const grid = [ [0, 0], [0, 0] ]; const colors = { 0: '#CDC1B4', 2: '#EEE4DA', 4: '#EDE0C8', 8: '#F2B179', 16: '#F59563', 32: '#F67C5F', 64: '#F65E3B', 128: '#EDCF72', 256: '#EDCC61', 512: '#EDC850', 1024: '#EDC53F', 2048: '#EDC22E' }; function drawTile(x, y, value) { ctx.fillStyle = colors[value]; ctx.fillRect(x * 100, y * 100, 100, 100); ctx.fillStyle = '#776E65'; ctx.font = '40px Arial'; ctx.textAlign = 'center'; ctx.fillText(value, x * 100 + 50, y * 100 + 60); } function drawGrid() { ctx.clearRect(0, 0, canvas.width, canvas.height); for (let i = 0; i < grid.length; i++) { for (let j = 0; j < grid[i].length; j++) { drawTile(j, i, grid[i][j]); } } } function getRandomEmptyCell() { const emptyCells = []; for (let i = 0; i < grid.length; i++) { for (let j = 0; j < grid[i].length; j++) { if (grid[i][j] === 0) { emptyCells.push({ x: j, y: i }); } } } if (emptyCells.length > 0) { const randomIndex = Math.floor(Math.random() * emptyCells.length); return emptyCells[randomIndex]; } return null; } function addRandomTile() { const emptyCell = getRandomEmptyCell(); if (emptyCell) { const newValue = Math.random() < 0.9 ? 2 : 4; grid[emptyCell.y][emptyCell.x] = newValue; } } function moveTiles(direction) { let moved = false; switch (direction) { case 'up': for (let i = 0; i < grid[0].length; i++) { for (let j = 1; j < grid.length; j++) { if (grid[j][i] !== 0) { let k = j; while (k > 0 && grid[k - 1][i] === 0) { grid[k - 1][i] = grid[k][i]; grid[k][i] = 0; k--; moved = true; } if (k > 0 && grid[k - 1][i] === grid[k][i]) { grid[k - 1][i] *= 2; grid[k][i] = 0; moved = true; } } } } break; case 'down': for (let i = 0; i < grid[0].length; i++) { for (let j = grid.length - 2; j >= 0; j--) { if (grid[j][i] !== 0) { let k = j; while (k < grid.length - 1 && grid[k + 1][i] === 0) { grid[k + 1][i] = grid[k][i]; grid[k][i] = 0; k++; moved = true; } if (k < grid.length - 1 && grid[k + 1][i] === grid[k][i]) { grid[k + 1][i] *= 2; grid[k][i] = 0; moved = true; } } } } break; case 'left': for (let i = 0; i < grid.length; i++) { for (let j = 1; j < grid[i].length; j++) { if (grid[i][j] !== 0) { let k = j; while (k > 0 && grid[i][k - 1] === 0) { grid[i][k - 1] = grid[i][k]; grid[i][k] = 0; k--; moved = true; } if (k > 0 && grid[i][k - 1] === grid[i][k]) { grid[i][k - 1] *= 2; grid[i][k] = 0; moved = true; } } } } break; case 'right': for (let i = 0; i < grid.length; i++) { for (let j = grid[i].length - 2; j >= 0; j--) { if (grid[i][j] !== 0) { let k = j; while (k < grid[i].length - 1 && grid[i][k + 1] === 0) { grid[i][k + 1] = grid[i][k]; grid[i][k] = 0; k++; moved = true; } if (k < grid[i].length - 1 && grid[i][k + 1] === grid[i][k]) { grid[i][k + 1] *= 2; grid[i][k] = 0; moved = true; } } } } break; } return moved; } function isGameOver() { for (let i = 0; i < grid.length; i++) { for (let j = 0; j < grid[i].length; j++) { if (grid[i][j] === 0) { return false; } if (i > 0 && grid[i][j] === grid[i - 1][j]) { return false; } if (j > 0 && grid[i][j] === grid[i][j - 1]) { return false; } } } return true; } function handleKeyPress(event) { if (isGameOver()) { return; } let moved = false; switch (event.key) { case 'ArrowUp': moved = moveTiles('up'); break; case 'ArrowDown': moved = moveTiles('down'); break; case 'ArrowLeft': moved = moveTiles('left'); break; case 'ArrowRight': moved = moveTiles('right'); break; } if (moved) { addRandomTile(); drawGrid(); if (isGameOver()) { console.log('Game Over'); } } } document.addEventListener('keydown', handleKeyPress); addRandomTile(); addRandomTile(); drawGrid();

GPTgame

Sign up for free tokens!

2*2 2048 name

GPTgame