let imgRedApple, imgRottenApple, imgTrashCan, imgIntro, imgInstructions;

let trashCan;

let apples = [], redApplesCollected = 0, score = 0, gameOver = false, gameTimer = 40;

let currentPage = 'intro'; // 'intro', 'instructions', 'game', 'gameOver'

let inputName; // p5.Element for input

​

function preload() {

    imgRedApple = loadImage('red.png');

    imgRottenApple = loadImage('rotten.png');

    imgTrashCan = loadImage('trash1.png');

    imgIntro = loadImage('intro.jpeg');

    imgInstructions = loadImage('Instruction.jpeg');

}

​

function setup() {

    createCanvas(600, 600);

    trashCan = new TrashCan();

    textSize(32);

    inputName = createInput('');

    inputName.position(150, height / 2 + 100); // Adjust as needed

    inputName.hide();

​

    // Initialize buttons

    startOverButton = createButton('Start Over');

    startOverButton.position(width - 110, 10);

    startOverButton.mousePressed(resetGame);

    startOverButton.hide();

​

    backButton = createButton('Back');

    backButton.position(width - 110, 60);

    backButton.mousePressed(() => { currentPage = 'intro'; });

    backButton.hide();

}

​

​

function draw() {

    clear();

    switch (currentPage) {

        case 'intro':

            displayIntro();

            startOverButton.hide();

            backButton.hide();

            break;

        case 'instructions':

            displayInstructions();

            startOverButton.hide();

            backButton.hide();

            break;

        case 'game':

            runGame();

            startOverButton.show();

            backButton.show();

            break;

        case 'gameOver':

            displayGameOver();

            startOverButton.hide();

            backButton.hide();

            break;

    }

}

​

// Your existing displayIntro, displayInstructions, runGame, displayGameOver functions...

​

​

function displayIntro() {

    image(imgIntro, 0, 0, width, height);

    // Set up text characteristics for the game title

    fill(255, 0, 0); // Red for text

    stroke(255); // White stroke for text

    strokeWeight(2); // Stroke weight as per your instruction

    textSize(60); // Increased size for more prominent display

    textStyle(BOLD); // Make the text bold

    textAlign(CENTER, CENTER);

    text('Rotten Rescue', width / 2, height / 2 - 150); // Move title up and remove ellipse

​

    // Adjustments for the 'Start' button

    fill(255); // White for button

    stroke(255, 0, 0); // Red outline for button

    strokeWeight(2); // Adjust stroke weight for the button as per your instruction

    rect(width / 2 - 60, height / 2 - 30, 120, 60, 20); // Move the Start button up and adjust size

    noStroke(); // Reset stroke to default for text

    fill(255, 0, 0); // Red for button text

    textSize(24); // Adjust text size for 'Start' to fit the button

    text('Start', width / 2, height / 2 - 12); // Make sure 'Start' text is centered in the button

}

​

function displayInstructions() {

    image(imgInstructions, 0, 0, width, height);

    fill(0); // Set text color to black

    textSize(20); // Set text size

    textAlign(LEFT, TOP); // Align text to the top left corner

​

    // Set a text margin and calculate text width based on canvas size

    let textMargin = 30;

    let textWidth = width - 2 * textMargin;

​

    // Draw the instructions text within margins

    text('- Try to catch the rotten apples in the trash can within a 60 second period\nand avoid catching more than 2 normal apples or you LOSE!\n- Please write your name before starting the game', 

         textMargin, // x-coordinate (left margin)

         height / 4, // y-coordinate (a quarter way down the canvas)

         textWidth, // width (canvas width - left and right margins)

         height // height (just set to canvas height, adjust if needed)

    ); 

​

    // Update the input field position

    inputName.show();

    inputName.position(width / 2 - inputName.width / 2, height / 2 + 20);

​

    // Draw 'Next' button

    fill(255); // Set button fill to white

    stroke(255, 0, 0); // Set button stroke to red

    strokeWeight(2); // Set stroke weight as required

    rect(width / 2 - 50, height / 2 + 100, 100, 50, 20); // Draw the button

    noStroke(); // Disable stroke for text

    fill(255, 0, 0); // Set text color to red

    textSize(20); // Set text size for the button label

    textAlign(CENTER, CENTER); // Align text to be centered for the button

    text('Next', width / 2, height / 2 + 125); // Draw the button label

}

​

​

function runGame() {

    inputName.hide();

    background('white');

    trashCan.display();

    trashCan.move();

    displayScore();

​

    if (frameCount % 60 === 0) {

        let type = random(['clean', 'dirty']);

        apples.push(new Apple(type));

    }

​

    for (let i = apples.length - 1; i >= 0; i--) {

        apples[i].move();

        apples[i].display();

​

        if (apples[i].y + apples[i].size > trashCan.y && apples[i].x > trashCan.x && apples[i].x < trashCan.x + trashCan.width) {

            if (apples[i].type === 'dirty') {

                score += 10;

            } else {

                redApplesCollected++;

                if (redApplesCollected >= 3) {

                    currentPage = 'gameOver';

                    break;

                }

            }

            apples.splice(i, 1);

        } else if (apples[i].y > height) {

            apples.splice(i, 1);

        }

    }

​

    if (frameCount % 60 === 0 && gameTimer > 0) {

        gameTimer--;

    } else if (gameTimer === 0) {

        currentPage = 'gameOver';

    }

}

​

function resetGame() {

    gameTimer = 40; // Reset the game timer

    score = 0; // Reset the score

    redApplesCollected = 0; // Reset the red apples collected

    apples = []; // Clear the apples array

    currentPage = 'game'; // Set the current page to 'game' to restart

}

​

function displayScore() {

    fill(0);

    textAlign(LEFT, TOP);

    text(`SCORE: ${score}`, 10, 10);

    text(`Time: ${gameTimer}`, 10, 40);

}

​

function displayGameOver() {

    background(0);

    fill(255);

    textSize(32);

    textAlign(CENTER, CENTER);

    text('Game Over', width / 2, height / 2 - 20);

    textSize(20);

    text(`Score: ${score}`, width / 2, height / 2 + 20);

    // Optionally reset game here or prompt for restart

}

​

function displayScore() {

    fill(0);

    textAlign(LEFT, TOP);

    text(`SCORE: ${score}`, 10, 10);

    text(`Time: ${gameTimer}`, 10, 40);

}

​

function mouseClicked() {

    if (currentPage === 'intro' && mouseX > width / 2 - 50 && mouseX < width / 2 + 50 && mouseY > height / 2 && mouseY < height / 2 + 50) {

        currentPage = 'instructions';

    } else if (currentPage === 'instructions' && mouseX > width / 2 - 50 && mouseX < width / 2 + 50 && mouseY > height / 2 + 100 && mouseY < height / 2 + 150) {

        currentPage = 'game';

        gameTimer = 60; // Reset the timer each time the game starts

        redApplesCollected = 0; // Reset the count of red apples

        score = 0; // Reset score

        apples = []; // Clear existing apples

    }

}