Movatterモバイル変換

■Grokが作ってくれたやつ

&lt;html lang="ja"&gt;&lt;head&gt;    &lt;meta charset="UTF-8"&gt;    &lt;title&gt;GrokのPONGゲーム&lt;/title&gt;    &lt;style&gt;body { display:flex; justify-content: center; align-items: center; height:100vh;margin: 0;background: #1a1a1a; }canvas {border: 2px solid #00ff00;background: #000; }        #score {color: #00ff00; font-family: 'Courier New', monospace; font-size: 24px; position:absolute;top:20px; width:100%;text-align: center; }    &lt;/style&gt;&lt;/head&gt;&lt;body&gt;0 : 0
    &lt;canvasid="gameCanvas" width="800" height="400"&gt;&lt;/canvas&gt;    &lt;script&gt;constcanvas = document.getElementById('gameCanvas');const ctx =canvas.getContext('2d');constscoreDisplay = document.getElementById('score');        //ゲームオブジェクトconst ball = { x:canvas.width / 2, y:canvas.height / 2,radius:10, speedX: 5, speedY: 5 };const paddleLeft = { x:10, y:canvas.height / 2 - 50, width:10, height:100, speed: 8 };const paddleRight = { x:canvas.width -20, y:canvas.height / 2 - 50, width:10, height:100, speed: 8 };        letscoreLeft = 0,scoreRight = 0;        //キー入力constkeys = { w:false, s:false, ArrowUp:false, ArrowDown:false };        document.addEventListener('keydown', e =&gt; { if (keys.hasOwnProperty(e.key))keys[e.key] =true; });        document.addEventListener('keyup', e =&gt; { if (keys.hasOwnProperty(e.key))keys[e.key] =false; });        //ゲームループ        function gameLoop() {            // 移動            if (keys.w &amp;&amp; paddleLeft.y&gt; 0) paddleLeft.y -= paddleLeft.speed;            if (keys.s &amp;&amp; paddleLeft.y &lt;canvas.height - paddleLeft.height) paddleLeft.y += paddleLeft.speed;            if (keys.ArrowUp &amp;&amp; paddleRight.y&gt; 0) paddleRight.y -= paddleRight.speed;            if (keys.ArrowDown &amp;&amp; paddleRight.y &lt;canvas.height - paddleRight.height) paddleRight.y += paddleRight.speed;            //ボール移動            ball.x += ball.speedX;            ball.y += ball.speedY;            // 壁衝突            if (ball.y + ball.radius&gt;canvas.height || ball.y - ball.radius &lt; 0) ball.speedY = -ball.speedY;            //パドル衝突            if (                (ball.x - ball.radius &lt; paddleLeft.x + paddleLeft.width &amp;&amp; ball.y&gt; paddleLeft.y &amp;&amp; ball.y &lt; paddleLeft.y + paddleLeft.height) ||                (ball.x + ball.radius&gt; paddleRight.x &amp;&amp; ball.y&gt; paddleRight.y &amp;&amp; ball.y &lt; paddleRight.y + paddleRight.height)            ) {                ball.speedX = -ball.speedX * 1.05; // 少し加速            }            //得点            if (ball.x &lt; 0) {scoreRight++; ballReset(); }            if (ball.x&gt;canvas.width) {scoreLeft++; ballReset(); }            // 描画            ctx.fillStyle = '#000';            ctx.fillRect(0, 0,canvas.width,canvas.height);            ctx.fillStyle = '#00ff00';            ctx.fillRect(paddleLeft.x, paddleLeft.y, paddleLeft.width, paddleLeft.height);            ctx.fillRect(paddleRight.x, paddleRight.y, paddleRight.width, paddleRight.height);            ctx.beginPath();            ctx.arc(ball.x, ball.y, ball.radius, 0, Math.PI * 2);            ctx.fill();scoreDisplay.textContent = `${scoreLeft} : ${scoreRight}`;            requestAnimationFrame(gameLoop);        }        function ballReset() {            ball.x =canvas.width / 2;            ball.y =canvas.height / 2;            ball.speedX = (Math.random()&gt; 0.5 ? 5 : -5) * (Math.random() * 0.5 + 0.75);            ball.speedY = (Math.random() * 4 - 2);        }        gameLoop();    &lt;/script&gt;&lt;/body&gt;&lt;/html&gt;