working ascii skifree

<!DOCTYPE html> <html> <head> <title>ASCII SkiFree</title> <style> body { text-align: center; font-family: monospace; } \#game { white-space: pre; } </style> </head> <body> <h1>ASCII SkiFree</h1> <div id="game"></div>

<button onclick="startGame()">Start Game</button>

​

<script> const gameWidth = 40; const gameHeight = 20; let gameBoard = \[\]; let skierPosition = Math.floor(gameWidth / 2); let gameOver = false; ​ function startGame() { gameBoard = \[\]; for (let i = 0; i < gameHeight; i++) { gameBoard.push(new Array(gameWidth).fill(' ')); if (i > 0) { const obstaclePosition = Math.floor(Math.random() \* gameWidth); gameBoard\[i\]\[obstaclePosition\] = 'X'; } } skierPosition = Math.floor(gameWidth / 2); gameBoard\[0\]\[skierPosition\] = '@'; gameOver = false; renderGame(); gameLoop(); } ​ function gameLoop() { if (gameOver) return; gameBoard.shift(); const newRow = new Array(gameWidth).fill(' '); newRow\[Math.floor(Math.random() \* gameWidth)\] = 'X'; gameBoard.push(newRow); gameBoard\[0\]\[skierPosition\] = ' '; if (skierPosition > 0 && skierPosition < gameWidth - 1) { skierPosition += Math.random() > 0.5 ? -1 : 1; } if (gameBoard\[1\]\[skierPosition\] === 'X') { gameOver = true; alert('Game Over!'); return; } gameBoard\[0\]\[skierPosition\] = '@'; renderGame(); setTimeout(gameLoop, 500); } ​ function renderGame() { document.getElementById('game').textContent = gameBoard.map(row => row.join('')).join('\\n'); } ​ document.addEventListener('keydown', event => { if (event.key === 'ArrowLeft') { skierPosition = Math.max(0, skierPosition - 1); } else if (event.key === 'ArrowRight') { skierPosition = Math.min(gameWidth - 1, skierPosition + 1); } }); ​ startGame(); </script> </body> </html>