const canvas = document.getElementById('canvas'); const ctx = canvas.getContext('2d'); const tileSize = 100; const boardSize = 4; const board = []; 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.fillStyle = getColor(value); ctx.fillRect(x * tileSize, y * tileSize, tileSize, tileSize); ctx.font = 'bold 32px Arial'; ctx.fillStyle = '#ffffff'; ctx.textAlign = 'center'; ctx.fillText(value.toString(), x * tileSize + tileSize / 2, y * tileSize + tileSize / 2 + 10); } function drawBoard() { for (let i = 0; i < boardSize; i++) { for (let j = 0; j < boardSize; j++) { drawTile(j, i, board[i][j]); } } } function getColor(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({ x: i, y: j }); } } } if (emptyTiles.length > 0) { const randomTile = emptyTiles[Math.floor(Math.random() * emptyTiles.length)]; board[randomTile.x][randomTile.y] = Math.random() < 0.9 ? 2 : 4; } } function moveTiles(direction) { let moved = false; switch (direction) { case 'up': for (let j = 0; j < boardSize; j++) { for (let i = 1; i < boardSize; i++) { if (board[i][j] !== 0) { let k = i; while (k > 0 && board[k - 1][j] === 0) { board[k - 1][j] = board[k][j]; board[k][j] = 0; k--; moved = true; } if (k > 0 && board[k - 1][j] === board[k][j]) { board[k - 1][j] *= 2; board[k][j] = 0; moved = true; } } } } break; case 'down': for (let j = 0; j < boardSize; j++) { for (let i = boardSize - 2; i >= 0; i--) { if (board[i][j] !== 0) { let k = i; while (k < boardSize - 1 && board[k + 1][j] === 0) { board[k + 1][j] = board[k][j]; board[k][j] = 0; k++; moved = true; } if (k < boardSize - 1 && board[k + 1][j] === board[k][j]) { board[k + 1][j] *= 2; board[k][j] = 0; moved = true; } } } } break; case 'left': for (let i = 0; i < boardSize; i++) { for (let j = 1; j < boardSize; j++) { if (board[i][j] !== 0) { let k = j; while (k > 0 && board[i][k - 1] === 0) { board[i][k - 1] = board[i][k]; board[i][k] = 0; k--; moved = true; } if (k > 0 && board[i][k - 1] === board[i][k]) { board[i][k - 1] *= 2; board[i][k] = 0; moved = true; } } } } break; case 'right': for (let i = 0; i < boardSize; i++) { for (let j = boardSize - 2; j >= 0; j--) { if (board[i][j] !== 0) { let k = j; while (k < boardSize - 1 && board[i][k + 1] === 0) { board[i][k + 1] = board[i][k]; board[i][k] = 0; k++; moved = true; } if (k < boardSize - 1 && board[i][k + 1] === board[i][k]) { board[i][k + 1] *= 2; board[i][k] = 0; moved = true; } } } } break; } return moved; } 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(); } } else if (event.key === 'ArrowDown') { if (moveTiles('down')) { generateRandomTile(); } } else if (event.key === 'ArrowLeft') { if (moveTiles('left')) { generateRandomTile(); } } else if (event.key === 'ArrowRight') { if (moveTiles('right')) { generateRandomTile(); } } if (checkGameOver()) { alert('Game Over!'); initializeBoard(); } drawBoard(); } document.addEventListener('keydown', handleKeyPress); initializeBoard(); generateRandomTile(); generateRandomTile(); drawBoard();

GPTgame

Sign up for free tokens!

Old color game "2048"

GPTgame