main_game.js

import kaboom from "https://unpkg.com/kaboom/dist/kaboom.mjs";

kaboom({
    background: [0, 0, 0],
});

const SPEED = 620;
let BSPEED = 2;
let SCORE = 0;

loadSprite("bad", "pg.png");
loadSprite("hero", "ultra.jpeg");
loadSprite("ball", "ball.jpeg");

scene("main", () => {
    const player = add([
        sprite("hero"),
        pos(120, 80),
        scale(0.5),
        area(),
    ]);

    // Create score text at top-right
    let scoreText = add([
        text(`Score: ${SCORE}`, 24),
        pos(width() - 20, 20),
    ]);
    // Align right by shifting left by the text width
    scoreText.pos.x = width() - 20 - scoreText.width;

    const updateScore = () => {
        scoreText.text = `Score: ${SCORE}`;
        scoreText.pos.x = width() - 20 - scoreText.width;
    };

    // Player movement
    onKeyDown("left", () => player.move(-SPEED, 0));
    onKeyDown("right", () => player.move(SPEED, 0));
    onKeyDown("up", () => player.move(0, -SPEED));
    onKeyDown("down", () => player.move(0, SPEED));

    // Spawn bugs and balls every 4 seconds
    loop(4, () => {
        for (let i = 0; i < 4; i++) {
            let x = rand(0, width());
            let y = height();
            const bad = add([
                sprite("bad"),
                pos(x, y),
                scale(0.1),
                area(),
                "bad",
            ]);
            bad.onUpdate(() => {
                bad.moveTo(bad.pos.x, bad.pos.y - BSPEED);
                if (bad.pos.y < 0) {
                    destroy(bad);
                }
            });
        }
        if(BSPEED<13){BSPEED+=1}
        let x = rand(0, width());
        let y = height();
        const ball = add([
            sprite("ball"),
            pos(x, y),
            scale(0.6),
            area(),
            "ball",
        ]);
        ball.onUpdate(() => {
            ball.moveTo(ball.pos.x, ball.pos.y - BSPEED);
            if (ball.pos.y < 0) {
                destroy(ball);
            }
        });
    });

    // Collisions
    player.onCollide("bad", (bad) => {
        destroy(player);
        addKaboom(player.pos);
        // Add game over or restart logic here if you want
        scoreText = add([
        text(`Game Over`),
        color(0,0,225),
        pos(5, 21),
    ]);
    });

    player.onCollide("ball", (ball) => {
        destroy(ball);
        SCORE += 1;
        updateScore();
        console.log("Score:", SCORE);
    });
});

go("main");