2048 · llama-4-scout
Build a playable 2048 game with arrow-key tile sliding and merging, smooth animations, a score, and win and lose states.
This one-shot run produced no runnable artifact.
agent produced no index.html
The transcript below shows what the model did — read it to see why the one shot fell short.
transcript · 2 messages
Build a playable 2048 game with arrow-key tile sliding and merging, smooth animations, a score, and win and lose states.
a simple implementation of the 2048 game in a single HTML file. ```html <!DOCTYPE html> <html> <head> <title>2048 Game</title> <style> body { font-family: Arial, sans-serif; } #game-container { width: 400px; margin: 50px auto; text-align: center; } #game-board { display: inline-block; border: 1px solid #ccc; padding: 10px; } .tile { width: 100px; height: 100px; display: inline-block; margin: 5px; border: 1px solid #ccc; line-height: 100px; font-size: 36px; } </style> </head> <body> <div id="game-container"> <div id="score">Score: 0</div> <div id="game-board"></div> <div id="game-over"></div> </div> <script> let gameBoard = []; let score = 0; let gameOver = false; // Initialize game board for (let i = 0; i < 4; i++) { gameBoard.push([0, 0, 0, 0]); } // Add two initial tiles addTile(); addTile(); // Draw game board drawGameBoard(); // Add event listeners for arrow keys document.addEventListener('keydown', (e) => { if (gameOver) return; switch (e.key) { ArrowUp': moveUp(); break; case 'ArrowDown': moveDown(); break; case 'ArrowLeft': moveLeft(); break; case 'ArrowRight': moveRight(); break; } // Check game over if (isGameOver()) { gameOver = true; document.getElementById('game-over').innerText = 'Game Over!'; } // Check win if (isWin()) { gameOver = true; document.getElementById('game-over').innerText = 'You Win!'; } // Add new tile if (!gameOver) { addTile(); drawGameBoard(); } }); // Function to add a new tile function addTile() { let emptyTiles = []; for (let i = 0; i < 4; i++) { for (let j = 0; j < 4; j++) { if (gameBoard[i][j] === 0) { emptyTiles.push([i, j]); } } } if (emptyTiles.length > 0) { let randomTile = emptyTiles[Math.floor(Math.random() * emptyTiles.length)]; gameBoard[randomTile[0]][randomTile[1]] = Math.random() < 0.9 ? 2 : 4; } } // Function to draw game board function drawGameBoard() { let gameBoardHtml = ''; for (let i = 0; i < 4; i++) { for (let j = 0; j < 4; j++) { gameBoardHtml += `<div class="tile" style="background-color: ${getTileColor(gameBoard[i][j])}">${gameBoard[i][j] === 0 ? '' : gameBoard[i][j]}</div>`; } gameBoardHtml += '<br>'; } document.getElementById('game-board').innerHTML = gameBoardHtml; document.getElementById('score').innerText = `Score: ${score}`; } // Function to get tile color function getTileColor(value) { switch (value) { case 0: return '#ccc case 2: return '#eee'; case 4: return '#eee'; case 8: return '#f2b179'; case 16: return '#f59563'; case 32: return '#f67c5f'; 64: return '#f75f3b'; case 128: return '#edcf72'; case 256: '#edcc61'; case 512: return '#ed'; case 1024: return '#edc22 case 2048: return '#edc22e default: return '#3c3a32'; } } // Function to move tiles up function moveUp() { for (let j = 0; j < 4; j let column = []; for (let i = 0; i < 4; i++) { column.push(gameBoard[i][j]); } column = compress(column); column = merge(column); column = compress(column); for (let i = 0; i < 4; i++) { gameBoard[i][j] = column[i]; } } } // Function to move tiles down function moveDown() { for (let j = 0; j < 4; j++) { let column = []; for (let i = 3; i >= 0; i--) { column.push(gameBoard[i][j]); } column = compress(column); column = merge(column); column = compress(column); for (let i = 3; i >= 0; i--) { gameBoard[i][j] = column } } } // Function to move tiles left function moveLeft() { for (let i = 0; i < 4; i++) { let row = gameBoard[i]; row = compress(row); row = merge(row); row = compress(row); gameBoard[i] = row; } } // Function to move tiles right function moveRight() { for (let i = 0; i < 4; i++) { let row = gameBoard[i].slice().reverse(); compress(row); row = merge(row); row =); gameBoard[i] = row.slice().reverse(); } // Function to compress tiles function compress(tiles) { let newTiles = []; for (let i = 0; i < tiles.length; i++) { if (tiles[i] !== 0) { newTiles.push(tiles[i]); } } while (newTiles.length < 4) { newTiles.push(0); } return newTiles; } // Function to merge tiles function merge(tiles) { for (let i = 0; i < 3; i if (tiles[i] === tiles[i + 1] && tiles[i] !== 0) { tiles[i] *= 2; score += tiles[i]; tiles[i + 1] = 0; } } return tiles; } // Function to check game over function isGameOver() { for (let i = 0; i < 4; i++) { for (let j = 0; j < 4; j++) { if (gameBoard[i][j] ===) { return false; } if (j < 3 && gameBoard[i][j] === gameBoard[i][j + 1]) { return false; } if (i < 3 && gameBoard[i][j] === gameBoard[i + 1][j]) { return false; } } } return true; } // Function to check win function isWin() { for (let i = 0; i < 4; i++) { for (let j = 0; j < 4; j++) { if (gameBoard[i][j] === 2048) { return true; } } } return false; } </script> </body> </html> ```
TAKE IT TO CODE
This run produced no artifact — reuse the prompt with a different model or your own pi-agent run.