CatEastHat

function setup() {
  // Create a canvas that fills the entire window
  createCanvas(windowWidth, windowHeight);
  // Initialize cat at the center of the screen
  catX = width / 2;
  catY = height / 2;
  // Initialize hat at a random position, ensuring it's within bounds
  resetHat();
}

function draw() {
  background(220); // Light gray background

  // Move the cat to follow the mouse/touch position
  catX = mouseX;
  catY = mouseY;

  // Draw the hat only if it hasn't been eaten
  if (!hatEaten) {
    drawHat(hatX, hatY, hatSize);
  }

  // Draw the cat
  drawCat(catX, catY, catSize);

  // Check if the cat is "eating" the hat
  // Calculate the distance between the center of the cat and the center of the hat
  let d = dist(catX, catY, hatX, hatY);
  // If the distance is less than the combined half-sizes (minus a small offset for better feel)
  // AND the hat hasn't been eaten yet, then the hat is eaten!
  if (d < (catSize / 2 + hatSize / 2 - 20) && !hatEaten) {
    hatEaten = true;
    console.log("Hat eaten!"); // Log to the console
    // You could add a sound effect here using the p5.sound library:
    // let meowSound = new p5.SoundFile('assets/meow.mp3');
    // meowSound.play();
  }

  // Display a message when the hat is eaten
  if (hatEaten) {
    fill(0); // Black text
    textSize(32);
    textAlign(CENTER, CENTER); // Center the text on the screen
    text("Meow! That was a delicious hat!", width / 2, height / 4);
    textSize(20);
    text("Click to reset", width / 2, height * 3 / 4);
  }
}

function resetHat() {
  hatEaten = false;
  // Place the hat at a random position, ensuring it's fully visible
  hatX = random(hatSize, width - hatSize);
  hatY = random(hatSize, height - hatSize);
}

function mousePressed() {
  if (hatEaten) {
    resetHat();
  }
}

function windowResized() {
  resizeCanvas(windowWidth, windowHeight);
  // Re-adjust hat position if it hasn't been eaten
  if (!hatEaten) {
    resetHat();
  }
}

function drawCat(x, y, size) {
  noStroke(); // No outline for the cat

  // Body (ellipse)
  fill(150, 75, 0); // Brownish color
  ellipse(x, y + size * 0.3, size * 1.2, size * 0.8);

  // Head (circle)
  fill(150, 75, 0);
  circle(x, y, size);

  // Ears (triangles)
  fill(150, 75, 0);
  triangle(x - size * 0.4, y - size * 0.5, x - size * 0.2, y - size * 0.8, x - size * 0.1, y - size * 0.5);
  triangle(x + size * 0.4, y - size * 0.5, x + size * 0.2, y - size * 0.8, x + size * 0.1, y - size * 0.5);
  fill(255, 192, 203); // Pink inside ears
  triangle(x - size * 0.3, y - size * 0.45, x - size * 0.2, y - size * 0.75, x - size * 0.15, y - size * 0.45);
  triangle(x + size * 0.3, y - size * 0.45, x + size * 0.2, y - size * 0.75, x + size * 0.15, y - size * 0.45);

  // Eyes (circles)
  fill(255); // White eyes
  circle(x - size * 0.25, y - size * 0.1, size * 0.2);
  circle(x + size * 0.25, y - size * 0.1, size * 0.2);
  fill(0); // Black pupils
  circle(x - size * 0.25, y - size * 0.1, size * 0.1);
  circle(x + size * 0.25, y - size * 0.1, size * 0.1);

  // Nose (triangle)
  fill(255, 192, 203); // Pink nose
  triangle(x, y + size * 0.1, x - size * 0.05, y + size * 0.15, x + size * 0.05, y + size * 0.15);

  // Mouth (arc)
  noFill();
  stroke(0);
  arc(x, y + size * 0.2, size * 0.2, size * 0.1, 0, PI); // Happy arc mouth
  strokeCap(ROUND); // Rounded ends for lines
  strokeWeight(2);
  line(x, y + size * 0.15, x, y + size * 0.2); // Line connecting nose to mouth

  // Whiskers
  strokeWeight(1);
  line(x - size * 0.3, y + size * 0.1, x - size * 0.5, y + size * 0.1);
  line(x - size * 0.3, y + size * 0.15, x - size * 0.5, y + size * 0.2);
  line(x - size * 0.3, y + size * 0.05, x - size * 0.5, y);
  line(x + size * 0.3, y + size * 0.1, x + size * 0.5, y + size * 0.1);
  line(x + size * 0.3, y + size * 0.15, x + size * 0.5, y + size * 0.2);
  line(x + size * 0.3, y + size * 0.05, x + size * 0.5, y);
}

function drawHat(x, y, size) {
  noStroke(); // No outline for the hat

  // Hat brim
  fill(0, 0, 255); // Blue hat
  rectMode(CENTER); // Draw rectangles from their center
  rect(x, y + size * 0.2, size * 1.5, size * 0.2, 5); // Rounded corners

  // Hat crown
  fill(0, 0, 255);
  rect(x, y - size * 0.2, size, size * 0.8, 5);

  // Hat ribbon
  fill(255, 0, 0); // Red ribbon
  rect(x, y - size * 0.1, size, size * 0.1);

  // Hat pom-pom (optional)
  fill(255); // White pom-pom
  circle(x, y - size * 0.6, size * 0.3);
}