game.js

const canvas = document.getElementById('gameCanvas');
const ctx = canvas.getContext('2d');

canvas.width = 800;
canvas.height = 600;

let spaceship;
let bullets = [];
let enemies = [];
let gameOver = false;

function startGame() {
    spaceship = new Spaceship();
    bullets = [];
    enemies = [];
    gameOver = false;
    document.getElementById('gameOver').style.display = 'none';
    gameLoop();
}

class Spaceship {
    constructor() {
        this.width = 50;
        this.height = 50;
        this.x = canvas.width / 2 - this.width / 2;
        this.y = canvas.height - this.height - 10;
        this.speed = 5;
        this.image = new Image();
        this.image.src = 'https://via.placeholder.com/50';  // Add spaceship image URL here
    }

    move(direction) {
        if (direction === 'left' && this.x > 0) {
            this.x -= this.speed;
        } else if (direction === 'right' && this.x + this.width < canvas.width) {
            this.x += this.speed;
        }
    }

    draw() {
        ctx.drawImage(this.image, this.x, this.y, this.width, this.height);
    }

    shoot() {
        const bullet = new Bullet(this.x + this.width / 2 - 5, this.y);
        bullets.push(bullet);
    }
}

class Bullet {
    constructor(x, y) {
        this.x = x;
        this.y = y;
        this.width = 10;
        this.height = 20;
        this.speed = 5;
    }

    move() {
        this.y -= this.speed;
    }

    draw() {
        ctx.fillStyle = '#00ff99';
        ctx.fillRect(this.x, this.y, this.width, this.height);
    }
}

class Enemy {
    constructor() {
        this.width = 50;
        this.height = 50;
        this.x = Math.random() * (canvas.width - this.width);
        this.y = -50;
        this.speed = 2;
    }

    move() {
        this.y += this.speed;
    }

    draw() {
        ctx.fillStyle = '#ff4444';
        ctx.fillRect(this.x, this.y, this.width, this.height);
    }
}

function gameLoop() {
    if (gameOver) {
        document.getElementById('gameOver').style.display = 'block';
        return;
    }

    ctx.clearRect(0, 0, canvas.width, canvas.height);

    spaceship.draw();

    bullets.forEach((bullet, index) => {
        bullet.move();
        bullet.draw();
        if (bullet.y < 0) {
            bullets.splice(index, 1);
        }
    });

    if (Math.random() < 0.02) {
        enemies.push(new Enemy());
    }

    enemies.forEach((enemy, index) => {
        enemy.move();
        enemy.draw();

        if (enemy.y > canvas.height) {
            enemies.splice(index, 1);
        }

        bullets.forEach((bullet, bulletIndex) => {
            if (
                bullet.x < enemy.x + enemy.width &&
                bullet.x + bullet.width > enemy.x &&
                bullet.y < enemy.y + enemy.height &&
                bullet.y + bullet.height > enemy.y
            ) {
                enemies.splice(index, 1);
                bullets.splice(bulletIndex, 1);
            }
        });
    });

    requestAnimationFrame(gameLoop);
}

document.addEventListener('keydown', (e) => {
    if (e.key === 'ArrowLeft') {
        spaceship.move('left');
    } else if (e.key === 'ArrowRight') {
        spaceship.move('right');
    } else if (e.key === ' ') {
        spaceship.shoot();
    }
});

startGame();