hehehe

function setup() {
  createCanvas(windowWidth, windowHeight); // Create a full-window canvas
  gameStartTime = millis(); // Record the game start time
  lastBugSpawnTime = millis(); // Record the last bug spawn time
  textSize(24); // Set text size for UI
  textAlign(LEFT, TOP); // Align text to the top-left
}

function draw() {
  background(100, 150, 100); // Dirty green/brown background

  // Spawn bugs if the game is not over and enough time has passed
  if (!gameOver && millis() - lastBugSpawnTime > bugSpawnRate) {
    spawnBug(); // Call function to create a new bug
    lastBugSpawnTime = millis(); // Update last spawn time
    // Gradually decrease spawn rate to make the game harder (minimum 200ms)
    bugSpawnRate = max(200, bugSpawnRate - 50); 
  }

  // Draw all existing splats
  for (let splat of splats) {
    splat.display();
  }

  // Draw all alive bugs
  for (let bug of bugs) {
    bug.display();
  }

  // --- Game UI and Timer ---
  let elapsedTime = millis() - gameStartTime; // Time elapsed since game start
  let remainingTime = max(0, gameDuration - elapsedTime); // Time left in the game

  fill(255); // White text color
  noStroke(); // No stroke for text
  text(`Score: ${score}`, 10, 10); // Display current score
  text(`Time Left: ${nf(remainingTime / 1000, 1, 1)}s`, 10, 40); // Display remaining time

  // Check if game duration has passed
  if (elapsedTime >= gameDuration) {
    gameOver = true; // Set game over flag
  }

  // --- Game Over Screen ---
  if (gameOver) {
    fill(255, 0, 0); // Red text color for game over
    textAlign(CENTER, CENTER); // Center text on the screen
    text(`GAME OVER! Final Score: ${score}`, width / 2, height / 2); // Display final score
    text(`Click to Restart`, width / 2, height / 2 + 40); // Instruction to restart
  }
}

function spawnBug() {
  let x = random(width * 0.1, width * 0.9); // Random X position (avoid edges)
  let y = random(height * 0.1, height * 0.9); // Random Y position (avoid edges)
  bugs.push(new Bug(x, y)); // Add the new bug to the bugs array
}

function mousePressed() {
  // If the game is over, restart it on click
  if (gameOver) {
    bugs = []; // Clear all bugs
    splats = []; // Clear all splats
    score = 0; // Reset score
    gameStartTime = millis(); // Reset game timer
    lastBugSpawnTime = millis(); // Reset bug spawn timer
    bugSpawnRate = 1000; // Reset bug spawn rate
    gameOver = false; // Set game over flag to false
    textAlign(LEFT, TOP); // Reset text alignment for UI
    return; // Exit the function to prevent squashing bugs immediately
  }

  // Check if any bug was clicked
  // Iterate through bugs array in reverse for easier state change/removal (if needed)
  for (let i = bugs.length - 1; i >= 0; i--) {
    let bug = bugs[i];
    // If the bug is alive and the mouse clicked on it
    if (bug.state === 'alive' && bug.isClicked(mouseX, mouseY)) {
      bug.squash(); // Squash the bug
      score++; // Increment score
      splats.push(new Splat(bug.x, bug.y)); // Create a splat at the bug's position
      break; // Only squash one bug per click
    }
  }
}

function windowResized() {
  resizeCanvas(windowWidth, windowHeight); // Resize the canvas to match the new window size
}

class Bug {
  constructor(x, y, size) {
    this.x = x;
    this.y = y;
    this.size = size || random(20, 50); // Random size for variety
    this.state = 'alive'; // 'alive' or 'squashed'
    this.color = color(50, 30, 0); // Dark brown for the bug
  }

  // Draw the bug on the canvas
  display() {
    if (this.state === 'alive') {
      noStroke();
      fill(this.color);

      // Body (large oval)
      ellipse(this.x, this.y, this.size * 1.5, this.size);

      // Head (smaller oval)
      ellipse(this.x + this.size * 0.7, this.y, this.size * 0.4, this.size * 0.3);

      // Legs (simple lines)
      stroke(this.color);
      strokeWeight(2);
      line(this.x - this.size * 0.6, this.y - this.size * 0.3, this.x - this.size * 0.9, this.y - this.size * 0.5);
      line(this.x - this.size * 0.5, this.y, this.x - this.size * 0.8, this.y);
      line(this.x - this.size * 0.6, this.y + this.size * 0.3, this.x - this.size * 0.9, this.y + this.size * 0.5);

      line(this.x + this.size * 0.6, this.y - this.size * 0.3, this.x + this.size * 0.9, this.y - this.size * 0.5);
      line(this.x + this.size * 0.5, this.y, this.x + this.size * 0.8, this.y);
      line(this.x + this.size * 0.6, this.y + this.size * 0.3, this.x + this.size * 0.9, this.y + this.size * 0.5);

      // Antennae
      line(this.x + this.size * 0.7, this.y - this.size * 0.1, this.x + this.size * 1.0, this.y - this.size * 0.3);
      line(this.x + this.size * 0.7, this.y + this.size * 0.1, this.x + this.size * 1.0, this.y + this.size * 0.3);
    }
  }

  // Change the bug's state to squashed
  squash() {
    this.state = 'squashed';
  }

  // Check if the mouse click is within the bug's area
  isClicked(mx, my) {
    // Approximating the bug's bounding box with a rectangle for click detection
    return mx > this.x - this.size * 0.75 &&
           mx < this.x + this.size * 0.75 &&
           my > this.y - this.size * 0.5 &&
           my < this.y + this.size * 0.5;
  }
}

class Splat {
  constructor(x, y, size, color) {
    this.x = x;
    this.y = y;
    this.size = size || random(40, 80); // Random size for the splat
    this.color = color || color(100, 150, 50, 200); // Greenish-brown, semi-transparent
  }

  // Draw the splat on the canvas
  display() {
    noStroke();
    fill(this.color);
    
    // Draw an irregular splat shape using multiple overlapping ellipses
    for (let i = 0; i < 5; i++) {
      let ox = random(-this.size * 0.2, this.size * 0.2);
      let oy = random(-this.size * 0.2, this.size * 0.2);
      let os = random(this.size * 0.6, this.size * 1.2);
      ellipse(this.x + ox, this.y + oy, os, os * random(0.5, 1.5));
    }
    
    // Add some smaller speckles around the main splat
    for (let i = 0; i < 10; i++) {
      let ox = random(-this.size * 0.5, this.size * 0.5);
      let oy = random(-this.size * 0.5, this.size * 0.5);
      let os = random(5, 15);
      ellipse(this.x + ox, this.y + oy, os, os);
    }
  }
}