game.js

const canvas = document.getElementById('gameCanvas');
const ctx = canvas.getContext('2d');
const scoreElement = document.getElementById('score');
const livesElement = document.getElementById('lives');

// Game elements
const player = {
    x: canvas.width / 2,
    y: canvas.height / 2,
    radius: 15,
    color: '#FF5733',
    speed: 5
};

const toppings = {
    beef: [],
    lettuce: [],
    cheese: []
};

let score = 0;
let lives = 3;
let gameRunning = true;

// Initialize game
function init() {
    // Create toppings
    for (let i = 0; i < 20; i++) {
        toppings.beef.push(createTopping('beef'));
        toppings.lettuce.push(createTopping('lettuce'));
        if (i < 5) toppings.cheese.push(createTopping('cheese'));
    }

    // Event listeners
    window.addEventListener('keydown', movePlayer);
    
    // Start game loop
    gameLoop();
}

function createTopping(type) {
    return {
        x: Math.random() * (canvas.width - 30) + 15,
        y: Math.random() * (canvas.height - 30) + 15,
        radius: 10,
        type: type,
        color: type === 'beef' ? '#8B4513' : 
               type === 'lettuce' ? '#7CFC00' : '#FFD700'
    };
}

function movePlayer(e) {
    if (!gameRunning) return;
    
    switch(e.key) {
        case 'ArrowUp': player.y -= player.speed; break;
        case 'ArrowDown': player.y += player.speed; break;
        case 'ArrowLeft': player.x -= player.speed; break;
        case 'ArrowRight': player.x += player.speed; break;
    }

    // Boundary check
    player.x = Math.max(player.radius, Math.min(canvas.width - player.radius, player.x));
    player.y = Math.max(player.radius, Math.min(canvas.height - player.radius, player.y));
}

function checkCollision() {
    // Check beef collisions
    for (let i = 0; i < toppings.beef.length; i++) {
        const beef = toppings.beef[i];
        const dist = Math.hypot(player.x - beef.x, player.y - beef.y);
        if (dist < player.radius + beef.radius) {
            toppings.beef.splice(i, 1);
            score += 10;
            scoreElement.textContent = score;
            break;
        }
    }

    // Check lettuce collisions
    for (let i = 0; i < toppings.lettuce.length; i++) {
        const lettuce = toppings.lettuce[i];
        const dist = Math.hypot(player.x - lettuce.x, player.y - lettuce.y);
        if (dist < player.radius + lettuce.radius) {
            toppings.lettuce.splice(i, 1);
            score = Math.max(0, score - 5);
            scoreElement.textContent = score;
            break;
        }
    }

    // Check cheese collisions
    for (let i = 0; i < toppings.cheese.length; i++) {
        const cheese = toppings.cheese[i];
        const dist = Math.hypot(player.x - cheese.x, player.y - cheese.y);
        if (dist < player.radius + cheese.radius) {
            toppings.cheese.splice(i, 1);
            lives++;
            livesElement.textContent = lives;
            break;
        }
    }

    // Check win/lose conditions
    if (toppings.beef.length === 0) {
        gameRunning = false;
        alert('You won! Final score: ' + score);
    } else if (lives <= 0) {
        gameRunning = false;
        alert('Game over! Final score: ' + score);
    }
}

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

    // Draw player
    ctx.beginPath();
    ctx.arc(player.x, player.y, player.radius, 0, Math.PI * 2);
    ctx.fillStyle = player.color;
    ctx.fill();

    // Draw toppings
    drawToppings(toppings.beef);
    drawToppings(toppings.lettuce);
    drawToppings(toppings.cheese);
}

function drawToppings(toppingArray) {
    toppingArray.forEach(topping => {
        ctx.beginPath();
        ctx.arc(topping.x, topping.y, topping.radius, 0, Math.PI * 2);
        ctx.fillStyle = topping.color;
        ctx.fill();
    });
}

function gameLoop() {
    if (!gameRunning) return;
    
    draw();
    checkCollision();
    requestAnimationFrame(gameLoop);
}

// Start the game
init();