let waitTime;

let oc1, oc2, oc3;

​

function setup() {

  createCanvas(400, 500);

  textAlign(CENTER);

  presentClicked = 0;

  waitTime = 0;

  oc1 = "gold"

  oc2 = "red"

  oc3 = "blue"

}

​

function draw() {

  background(240, 240, 180);

  if(presentClicked == 0 && frameCount > 200) {

    textSize(10);

    fill(0);

    text("Click on           \nthe present --->", 50, 450);

  }

  // Tree

  noStroke();

  fill(0, 150, 0);

  triangle(200, 200, 130, 300, 270, 300);

  triangle(200, 250, 100, 360, 300, 360);

  triangle(200, 300, 70, 420, 330, 420);

  fill(100, 60, 0);

  rect(180, 420, 40)

  // Present

  fill(50, 100, 220);

  rect(100, 440, 50);

  fill(50, 90, 210);

  rect(98, 438, 54, 12);

  fill(180, 10, 10);

  rect(120, 438, 10, 52);

  fill(200, 20, 20);

  rect(100, 460, 50, 10);

  if(mouseX > 98 && mouseX < 152 && mouseY > 438 && mouseY < 492 && mouseIsPressed) {

    presentClicked = 1;

    waitTime = frameCount;

  }

  if(presentClicked == 1) {

    // Ornaments

    stroke(240, 240, 255);

    strokeWeight(0.5);

    fill(oc1);

    ellipse(100, 400, 20);

    ellipse(200, 230, 20);

    ellipse(210, 330, 22);

    ellipse(288, 394, 20);

    fill(oc2);

    ellipse(160, 410, 20);

    ellipse(230, 270, 20);

    ellipse(270, 340, 20);

    fill(oc3);

    ellipse(230, 390, 20);

    ellipse(140, 340, 20);

    ellipse(180, 280, 20);

  }

  if(presentClicked == 1 && frameCount - waitTime > 40) {

    textFont("Rubik Gemstones")

    textSize(50);

    fill(200, 0, 0);

    text("Merry", 200, 100)

    fill(0, 150, 0);

    text("Christmas!", 200, 160);

  }

  if(presentClicked == 1 && frameCount - waitTime > 100) {

    textSize(50);

    text("⭐", 200, 205);

    let toggle = (frameCount - waitTime)/60%3;

    if(toggle == 0) {

      oc3 = "gold"

      oc1 = "red"

      oc2 = "blue"

    }

    else if(toggle == 1) {

      oc2 = "gold"

      oc3 = "red"

      oc1 = "blue"

    }

    else if(toggle == 2) {

      oc1 = "gold"

      oc2 = "red"

      oc3 = "blue"

    }

    if(frameCount - waitTime > 300) {

      textSize(40);

      fill(0);

      textFont("Mountains of Christmas");

      text("Love you, Bran ❤️", 200, 50);

    }

  }

}