​

function setup() {

  createCanvas(400, 400);

  frameRate(100);

  ellipseMode(CENTER);

  angleMode(DEGREES);

}

​

​

/*

  1. let isHappy = happy face (happy hour) 

     and !isHappy = sad face (suffering times)

  2. use mouseClicked () to change faces.

  3. canvas starts with isHappy = !isHappy, showing sad face.

  4. if (isHappy), showing happy face with happy hour clock.

  5. else if (!isHappy), showing suffering face with sad clock.

*/

​

​

  function mouseClicked(){

    isHappy = !isHappy;

    print (!isHappy);

  }

​

  function draw() {

    translate(200,200);

    let m = millis();

  if (isHappy){

    background(255, 255, 128);

//happy face base

    push();

    noStroke();

    fill(255, 179, 179);

    ellipse(0,-30,300,300);

    pop();

//happy hour texts

    textSize(32);

    fill(255, 179, 179);

    text('Happy Hours :)', -100, 160);

​

//happy time pie

    push();

    rotate(-90);

    stroke(255,255,255);

    strokeWeight(4);

    fill(179, 240, 255);

    let end = map(m, 0, 2000, 0, 360);

    arc(30,0,300,300,0,end);

    pop();

​

//happy facial

    push();

    let x1 = random(15,25);

    let x2 = random(-50, -60);

    noStroke();

    fill(255,255,255);

    ellipse(-50, x2, 20, 25);

    ellipse(50, x2, 20, 25);

    stroke(255,255,255);

    strokeWeight(3);

    noFill();

    arc(0, x1, 110, 90, 0, 180);

    pop();

  }else if (!isHappy){

    background(0, 0, 0);

//sad face base

    push();

    noStroke();

    fill(26, 163, 255);

    ellipse(0,-30,300,300);

    pop();

//sad hour texts

    textSize(32);

    fill(26, 163, 255);

    text('Suffering :(', -80, 160);

​

//sad time pie

    push();

    rotate(-90);

    stroke(255,255,255);

    strokeWeight(4);

    fill(255, 204, 255);

    let end = map(m, 0, 80000, 0, 360);

    arc(30,0,300,300,0,end);

    pop();

​

//sad facial

    push();

    let x3 = random(-40, -30);

    let x4 = random(30, 40);

    strokeWeight(6);

    stroke(255,255,255);

    line(-80, -50, -40, -50);

    line(80, -50, 40, -50);

    line(x3, 40, x4, 40)

    pop();

  }

}