AI game creator

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

No:48579

113

←

Prev Next

→

Caza patos
Developer User20803｜Date and time 24/3/2 14:42:02
Build time 8.373 sec｜Game capacity 2.594KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Caza patos</title>
</head>
<body>
    <canvas></canvas>
    <script>
        const canvas = document.querySelector('canvas');
        const ctx = canvas.getContext('2d');

canvas.width = window.innerWidth;
        canvas.height = window.innerHeight;

let score = 0;

const patos = [];

for(let i = 0; i < 5; i++) {
            patos.push({
                x: Math.random() * canvas.width,
                y: Math.random() * canvas.height,
                speedX: Math.random() * 5,
                speedY: Math.random() * 5,
                radius: 20,
                color: 'blue',
                alive: true
            });
        }

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

patos.forEach(pato => {
                if(pato.alive) {
                    ctx.beginPath();
                    ctx.arc(pato.x, pato.y, pato.radius, 0, Math.PI * 2);
                    ctx.fillStyle = pato.color;
                    ctx.fill();
                }
            });
        }

function update() {
            patos.forEach(pato => {
                if(pato.alive) {
                    pato.x += pato.speedX;
                    pato.y += pato.speedY;

if(pato.x <= 0 || pato.x >= canvas.width) {
                        pato.speedX *= -1;
                    }

if(pato.y <= 0 || pato.y >= canvas.height) {
                        pato.speedY *= -1;
                    }
                }
            });
        }

function gameLoop() {
            update();
            draw();
            requestAnimationFrame(gameLoop);
        }

gameLoop();

canvas.addEventListener('click', e => {
            const clickX = e.clientX;
            const clickY = e.clientY;

patos.forEach(pato => {
                const distancia = Math.sqrt(Math.pow(clickX - pato.x, 2) + Math.pow(clickY - pato.y, 2));
                if(distancia <= pato.radius && pato.alive) {
                    pato.alive = false;
                    score++;
                }
            });
        });

function endGame() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            ctx.font = '30px Arial';
            ctx.fillText(`Juego terminado! Puntaje final: ${score}`, canvas.width / 2 - 200, canvas.height / 2);
        }

setTimeout(() => {
            endGame();
            patos.forEach(pato => pato.alive = false);
        }, 30000);

</script>
</body>
</html>