AI game creator

Click here for free DL of the app version that can save data.

No:37768

←

Prev Next

→

ビリヤード
Developer User17126｜Date and time 24/1/21 15:49:12
Build time 13.535 sec｜Game capacity 3.85KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>ビリヤードゲーム</title>
    <style>
        canvas {
            width: 100%;
            height: 100%;
            background-color: #000;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas"></canvas>

// キャンバスを取得
        const canvas = document.getElementById("gameCanvas");
        const ctx = canvas.getContext("2d");
        canvas.width = gameWidth;
        canvas.height = gameHeight;

// ビリヤードのボールの情報
        const ballRadius = 15;
        let ballX = gameWidth / 2;
        let ballY = gameHeight / 2;
        let ballSpeedX = 3;
        let ballSpeedY = 4;

// パドルの情報
        const paddleWidth = 150;
        const paddleHeight = 20;
        let paddleX = (gameWidth - paddleWidth) / 2;
        const paddleY = gameHeight - paddleHeight - 10;
        const paddleSpeed = 10;

// 左右のキーコード
        const leftKey = 37;
        const rightKey = 39;

// キーボードの状態を保持するオブジェクト
        const keys = {};

// キーダウンイベントのリスナーを設定
        document.addEventListener("keydown", function (event) {
            keys[event.keyCode] = true;
        });

// キーアップイベントのリスナーを設定
        document.addEventListener("keyup", function (event) {
            keys[event.keyCode] = false;
        });

// パドルの移動を処理する関数
        function movePaddle() {
            if (keys[leftKey]) {
                paddleX -= paddleSpeed;
            } else if (keys[rightKey]) {
                paddleX += paddleSpeed;
            }

// パドルが画面外に出ないようにする
            if (paddleX < 0) {
                paddleX = 0;
            } else if (paddleX > gameWidth - paddleWidth) {
                paddleX = gameWidth - paddleWidth;
            }
        }

// ボールの移動を処理する関数
        function moveBall() {
            ballX += ballSpeedX;
            ballY += ballSpeedY;

// ボールが壁に当たった場合の処理
            if (ballX < ballRadius || ballX > gameWidth - ballRadius) {
                ballSpeedX *= -1;
            }

if (ballY < ballRadius || ballY > gameHeight - ballRadius) {
                ballSpeedY *= -1;
            }

// ボールがパドルに当たった場合の処理
            if (
                ballY + ballRadius > paddleY &&
                ballY + ballRadius < paddleY + paddleHeight &&
                ballX + ballRadius > paddleX &&
                ballX - ballRadius < paddleX + paddleWidth
            ) {
                ballSpeedY *= -1;
            }
        }

// ゲームの描画を行う関数
        function draw() {
            // キャンバスをクリア
            ctx.clearRect(0, 0, gameWidth, gameHeight);

// パドルを描画
            ctx.fillStyle = "#fff";
            ctx.fillRect(paddleX, paddleY, paddleWidth, paddleHeight);

// ボールを描画
            ctx.beginPath();
            ctx.arc(ballX, ballY, ballRadius, 0, Math.PI * 2);
            ctx.fillStyle = "#fff";
            ctx.fill();
            ctx.closePath();
        }

// ゲームのメインループ
        function gameLoop() {
            movePaddle();
            moveBall();
            draw();

// ループを再呼び出し
            requestAnimationFrame(gameLoop);
        }

// ゲームの開始
        gameLoop();
    </script>
</body>
</html>