let footballSheet; // Football sprite sheet

let mannequinImage; // Mannequin image

let frameIndex = 0; // Current frame index

let numFrames = 6; // Total number of frames in the sprite sheet

let frameWidth = 64; // Width of each frame

let frameHeight = 64; // Height of each frame

let footballX, footballY; // Position of the football

let targetX, targetY; // Open target position for the football

let footballSpeed = 8; // Speed of the football

let shotInterval = 3000; // Break time in milliseconds between shots

let lastShotTime = 0; // Track the last time a shot was fired

let timer = 60; // Countdown timer in seconds

let timerInterval; // Interval for the countdown timer

let positions = []; // Array to store predefined positions

let mannequins = []; // Array to store mannequin positions

let openPositionIndex; // Index of the open position (where the ball will aim)

​

function preload() {

  // Load the football sprite sheet

  footballSheet = loadImage("football.png"); // Replace with your sprite sheet path

  // Load the background image

  backgroundImage = loadImage("field.png"); // Replace with your background image path

​

  // Load the mannequin image

  mannequinImage = loadImage("mannequin.png"); // Replace with your mannequin image path

}

​

function setup() {

  createCanvas(windowWidth, windowHeight);

​

  // Define the predefined positions (left, center, right)

  positions = [

    { x: width * 0.2, y: height * 0.55 }, // Left

    { x: width * 0.5, y: height * 0.55 }, // Center

    { x: width * 0.8, y: height * 0.55 }  // Right

  ];

​

  // Initial position of the football (center bottom of the canvas)

  footballX = width / 2;

  footballY = height * 0.8;

​

  // Random initial open position

  randomizeMannequins();

​

  // Start the countdown timer

  timerInterval = setInterval(updateTimer, 1000); // Decrease timer every second

}

​

function draw() {

  // Draw the background

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

​

  // Draw the mannequins

  drawMannequins();

​

  // Draw the football animation

  drawFootball();

​

  // Move the football

  moveFootball();

​

  // Check if the ball reaches the target

  checkCollision();

​

  // Draw the timer on the screen

  drawTimer();

}

​

function drawMannequins() {

  // Draw mannequins at their assigned positions with increased size

  for (let i = 0; i < mannequins.length; i++) {

    image(

      mannequinImage,

      mannequins[i].x - 250, // Adjust x-offset to center the mannequin

      mannequins[i].y - 300, // Adjust y-offset for placement on the ground

      700, // Increased mannequin width

      800  // Increased mannequin height

    );

  }

}

​

function drawFootball() {

  // Draw one frame of the sprite sheet

  image(

    footballSheet,

    footballX, // X position to draw on canvas

    footballY, // Y position to draw on canvas

    frameWidth, // Width on canvas

    frameHeight, // Height on canvas

    frameIndex * frameWidth, // X position on sprite sheet

    0, // Y position on sprite sheet (assuming all frames are in one row)

    frameWidth, // Frame width

    frameHeight // Frame height

  );

​

  // Update the frame index to animate the football

  if (frameCount % 5 === 0) {

    frameIndex = (frameIndex + 1) % numFrames; // Change the frame every 5 frames

  }

}

​

function moveFootball() {

  // Calculate the direction to the target

  let dx = targetX - footballX;

  let dy = targetY - footballY;

  let distance = dist(footballX, footballY, targetX, targetY);

​

  // Move the football toward the target

  if (distance > footballSpeed) {

    footballX += (dx / distance) * footballSpeed;

    footballY += (dy / distance) * footballSpeed;

  }

}

​

function checkCollision() {

  // Check if the ball has reached the target

  let distanceToTarget = dist(footballX, footballY, targetX, targetY);

  if (distanceToTarget < frameWidth / 2) { // Adjust collision distance

    resetBall(); // Reset the ball and spawn a new one

  }

}

​

function resetBall() {

  // Wait for the 3-second break before resetting the ball

  if (millis() - lastShotTime > shotInterval) {

    footballX = width / 2;

    footballY = height * 0.8;

​

    // Randomize mannequins and choose the new open position

    randomizeMannequins();

​

    // Update the last shot time

    lastShotTime = millis();

  }

}

​

function randomizeMannequins() {

  // Randomly choose two positions for the mannequins

  let indexes = [0, 1, 2];

  shuffle(indexes, true);

  mannequins = [positions[indexes[0]], positions[indexes[1]]];

​

  // The remaining position is the open position

  openPositionIndex = indexes[2];

  targetX = positions[openPositionIndex].x;

  targetY = positions[openPositionIndex].y;

}

​

function updateTimer() {

  // Decrease the timer by 1 second

  if (timer > 0) {

    timer--;

  } else {

    clearInterval(timerInterval); // Stop the timer when it reaches 0

    gameOver();

  }

}

​

function drawTimer() {

  // Draw the timer at the top center of the screen

  fill(0);

  textSize(32);

  textAlign(CENTER, TOP);

  text(`Time Left: ${timer}s`, width / 2, 10);

}

​

function gameOver() {

  // Display the game over message

  noLoop(); // Stop the draw loop

  fill(0, 150);

  rect(0, 0, width, height);

  fill(255);

  textSize(64);

  textAlign(CENTER, CENTER);

  text("Game Over!", width / 2, height / 2);

}

​

function windowResized() {

  resizeCanvas(windowWidth, windowHeight);

​

  // Update the predefined positions dynamically

  positions = [

    { x: width * 0.2, y: height * 0.55 }, // Left

    { x: width * 0.5, y: height * 0.55 }, // Center

    { x: width * 0.8, y: height * 0.55 }  // Right

  ];

​

  // Recalculate mannequins and open position

  randomizeMannequins();

}

​

function keyTyped() {

  // Toggle fullscreen mode with the F key

  if (key === 'f') {

    let fs = fullscreen();

    fullscreen(!fs);

  }

}

​