AI game creator

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

No:28640

←

Prev Next

→

サインカーブ
Developer うにょUser14145｜Date and time 23/12/13 15:19:33
Build time 82.126 sec｜Game capacity 5.751KB｜

Script

Score: 0

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>サインカーブゲーム</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
        }
        #canvas {
            margin: 20px auto;
            border: 2px solid black;
            touch-action: none;
        }
        #score {
            font-size: 20px;
            margin-bottom: 20px;
        }
    </style>
</head>
<body>

<div id="score">Score: 0</div>

// ゲーム変数
        let canvas, ctx, paddle, ball, bricks, score;

// 初期化処理
        function init() {
            // Canvas要素を取得
            canvas = document.getElementById("canvas");
            ctx = canvas.getContext("2d");

// パドルを作成
            paddle = {
                x: CANVAS_WIDTH / 2 - PADDLE_WIDTH / 2,
                y: CANVAS_HEIGHT - PADDLE_HEIGHT - 10,
                width: PADDLE_WIDTH,
                height: PADDLE_HEIGHT
            };

// ボールを作成
            ball = {
                x: CANVAS_WIDTH / 2,
                y: CANVAS_HEIGHT / 2,
                dx: BALL_SPEED,
                dy: -BALL_SPEED,
                radius: BALL_RADIUS
            };

// ブロックを作成
            bricks = [];
            for (let row = 0; row < BRICK_ROWS; row++) {
              for (let col = 0; col < BRICK_COLUMNS; col++) {
                bricks.push({
                  x: col * (BRICK_WIDTH + BRICK_GAP) + BRICK_GAP / 2,
                  y: row * (BRICK_HEIGHT + BRICK_GAP) + BRICK_GAP / 2,
                  width: BRICK_WIDTH,
                  height: BRICK_HEIGHT,
                  destroyed: false
                });
              }
            }

// スコアを初期化
            score = 0;

// イベントリスナーを設定
            canvas.addEventListener("mousemove", movePaddle);

// ゲームループを開始
            requestAnimationFrame(gameLoop);
        }

// パドルの移動処理
        function movePaddle(event) {
            let rect = canvas.getBoundingClientRect();
            let mouseX = event.clientX - rect.left;
            paddle.x = mouseX - paddle.width / 2;
        }

// ボールとの衝突判定処理
        function collideBricks() {
            for (let i = 0; i < bricks.length; i++) {
                let brick = bricks[i];
                if (!brick.destroyed) {
                    if (ball.x + ball.radius > brick.x &&
                        ball.x - ball.radius < brick.x + brick.width &&
                        ball.y + ball.radius > brick.y &&
                        ball.y - ball.radius < brick.y + brick.height) {
                        brick.destroyed = true;
                        ball.dy = -ball.dy;
                        score++;
                    }
                }
            }
        }

// ボールとのパドルの衝突判定処理
        function collidePaddle() {
            if (ball.y + ball.radius > paddle.y &&
                ball.x + ball.radius > paddle.x &&
                ball.x - ball.radius < paddle.x + paddle.width) {
                ball.dy = -ball.dy;
            }
        }

// ボールとの壁の衝突判定処理
        function collideWalls() {
            if (ball.x - ball.radius < 0 || ball.x + ball.radius > CANVAS_WIDTH) {
                ball.dx = -ball.dx;
            }
            if (ball.y - ball.radius < 0) {
                ball.dy = -ball.dy;
            } else if (ball.y + ball.radius > CANVAS_HEIGHT) {
                gameOver();
            }
        }

// ゲームオーバー処理
        function gameOver() {
            alert("Game Over!");
            init();
        }

// ゲームループ
        function gameLoop() {
            // Canvasをクリア
            ctx.clearRect(0, 0, CANVAS_WIDTH, CANVAS_HEIGHT);

// パドルを描画
            ctx.fillStyle = "#000000";
            ctx.fillRect(paddle.x, paddle.y, paddle.width, paddle.height);

// ボールを描画
            ctx.beginPath();
            ctx.arc(ball.x, ball.y, ball.radius, 0, Math.PI * 2);
            ctx.fillStyle = "#000000";
            ctx.fill();
            ctx.closePath();

// ブロックを描画
            bricks.forEach(brick => {
                if (!brick.destroyed) {
                    ctx.fillStyle = "#000000";
                    ctx.fillRect(brick.x, brick.y, brick.width, brick.height);
                }
            });

// スコアを表示
            document.getElementById("score").innerText = "Score: " + score;

// ボールの移動
            ball.x += ball.dx;
            ball.y += ball.dy;

// ボールとパドルの衝突判定
            collidePaddle();

// ボールとブロックの衝突判定
            collideBricks();

// ボールと壁の衝突判定
            collideWalls();

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

// ゲームの開始
        init();
    </script>

</body>
</html>