AI game creator

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

No:44518

←

Prev Next

→

Crea Bubbles game
Developer User19399｜Date and time 24/2/18 6:43:41
Build time 5.373 sec｜Game capacity 1.911KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Bubbles Game</title>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="600"></canvas>

let bubbles = [];
        let score = 0;

canvas.addEventListener('click', function(event) {
            let rect = canvas.getBoundingClientRect();
            let mouseX = event.clientX - rect.left;
            let mouseY = event.clientY - rect.top;

bubbles.forEach(function(bubble) {
                if (mouseX >= bubble.x && mouseX <= bubble.x + bubble.size &&
                    mouseY >= bubble.y && mouseY <= bubble.y + bubble.size) {
                    score++;
                    bubbles.splice(bubbles.indexOf(bubble), 1);
                }
            });
        });

function createBubble() {
            let bubble = {
                x: Math.random() * canvas.width,
                y: canvas.height,
                size: 50,
                speed: Math.random() * 5 + 1
            };
            bubbles.push(bubble);
        }

function drawBubble() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);

bubbles.forEach(function(bubble) {
                bubble.y -= bubble.speed;
                ctx.fillStyle = 'blue';
                ctx.beginPath();
                ctx.arc(bubble.x, bubble.y, bubble.size, 0, Math.PI * 2);
                ctx.fill();
            });

ctx.fillStyle = 'black';
            ctx.font = '24px Arial';
            ctx.fillText('Score: ' + score, 10, 30);
        }

function gameLoop() {
            if (Math.random() < 0.03) {
                createBubble();
            }

drawBubble();

requestAnimationFrame(gameLoop);
        }

gameLoop();
    </script>
</body>
</html>