// https://www.youtube.com/watch?v=iCXBNKC6Wjw

​

let w;

let h;

let ry;

let colors = ['#FF6347', '#DC143C', '#B22222', '#FF0000', '#8B0000', '#FF4500', '#CD5C5C'];

let multi = ['#C460E0', '#FFD200','#41F059','#BCF2E4', '#7FA4FF'];

let mycolor;

​

function setup() {

  createCanvas(windowWidth, windowHeight);

​

  w = windowWidth;

  h = windowHeight;

​

  let rand = round(random(multi.length - 1));

  mycolor = multi[rand];

  //text(color, 34, 45); 

​

  angleMode(DEGREES);

  frameRate(9);

  ellipseMode(CENTER);

}

​

function draw() {

  text(mycolor, 34, 45);

  background(mycolor);

​

  if (mouseIsPressed) {

    angry();

  } else if (rotationY){

     ry = Math.abs(rotationY);

    awakeLess();

  } else{

    sleepy();

  }

}

​

function sleepy() {

​

  //hair

  noStroke();

  fill("#010178");

  rect(0, 0, w / 9, h / 5);

  rect(w / 9, 0, w / 9, h / 7);

  rect(w / 4.5, 0, w / 9, h / 5);

  rect(w / 3, 0, w / 9, h / 7);

  rect(w * 4 / 9, 0, w / 9, h / 5);

  rect(w * 5 / 9, 0, w / 9, h / 7);

  rect(w * 6 / 9, 0, w / 9, h / 5);

  rect(w * 7 / 9, 0, w / 9, h / 7);

  rect(w * 8 / 9, 0, w / 9, h / 5);

  rect(w, 0, w / 9, h / 7);

​

  //left eyebrow

  rectMode(CENTER);

  fill("#010178");

  rect(w / 3, h / 3, w / 4, h / 20);

​

  //right eyebrow

  rect(width - w / 3, h / 3, w / 4, h / 20);

​

  //left eye closed

  fill("#010178");

  ellipse(w / 3, h / 2, w / 4, w / 4);

​

  //right eye closed

  noStroke();

  fill("#010178");

  ellipse(width - w / 3, h / 2, w / 4, w / 4);

​

  //nose

  fill("#FFFFFF");

  arc(w / 2, height - h / 2.8, w / 16, w / 16, 180, 0);

​

  //mouth

  {

    fill("FFFFFFF");

    stroke("#010178");

    strokeWeight(h / 40);

    var step = frameCount % 20;

    translate(width - w / 2, height - h / 5);

    applyMatrix(1 / step, 0, 0, 1 / step, 0, 0);

    ellipse(10, 0, w / 5, w / 5);

    textSize(80);

    noStroke();

    fill('#FFFFFF');

    text('zzz', w / 5, w / 5);

    resetMatrix();

  }

​

}

​

function awakeLess() {

  //hair

  noStroke();

  fill('#010178');

  rect(0, 0, w / 9, h / 5);

  rect(w / 9, 0, w / 9, h / 7);

  rect(w / 4.5, 0, w / 9, h / 5);

  rect(w / 3, 0, w / 9, h / 7);

  rect(w * 4 / 9, 0, w / 9, h / 5);

  rect(w * 5 / 9, 0, w / 9, h / 7);

  rect(w * 6 / 9, 0, w / 9, h / 5);

  rect(w * 7 / 9, 0, w / 9, h / 7);

  rect(w * 8 / 9, 0, w / 9, h / 5);

  rect(w, 0, w / 9, h / 7);

​

  //nose

  fill('#FFFFFF');

  arc(w / 2, height - h / 2.8, w / 16, w / 16, 180, 0);

​

  // mouth

  {

    textAlign(CENTER);

    textSize(0.5*ry);

    noStroke();

    textStyle(BOLD);

    fill('#FFFFFF');

    text('bazinga!', width - w / 2, height - h / 5);

    resetMatrix();

  }

​

  //left eyebrow

  rectMode(CENTER);

  fill('#010178');

  rect(w / 3, h / 3, w / 4, h / 20);

​

  //right eyebrow

  rect(width - w / 3, h / 3, w / 4, h / 20);

​

  //left eye open

  noStroke();

  fill('#010178');

  ellipse(w / 3, h / 2, w / 4, w / 4);

  fill('#69F5E7');

  ellipse(w / 3, h / 2, w / 5, w / 5);

  fill('#B6BDFA');

  ellipse(w / 3, h / 2, w / 6, w / 6);

  fill('#010178');

  ellipse(w / 3, h / 2, w / 11, w / 11);

  fill('#FFFFFF');

  ellipse(w / 2.8, h / 2.1, w / 28, w / 28);

​

  //right eye open

  fill('#010178');

  ellipse(width - w / 3, h / 2, w / 4, w / 4);

  fill('#69F5E7');

  ellipse(width - w / 3, h / 2, w / 5, w / 5);

  fill('#B6BDFA');

  ellipse(width - w / 3, h / 2, w / 6, w / 6);

  fill('#010178');

  ellipse(width - w / 3, h / 2, w / 11, w / 11);

  fill('#FFFFFF');

  ellipse(width - w / 3.2, h / 2.1, w / 28, w / 28);

​

  //left eye cover

  fill('#010178');

  ellipse(w / 3, h / 2, w / 5 - 1.5 * ry, w / 5 - 1.5 * ry);

​

  //right eye cover

  fill('#010178');

  ellipse(width - w / 3, h / 2, w / 5 - 1.5 * ry, w / 5 - 1.5 * ry);

}

​

function touchZ() {

  zzz.display(); //displays the zzz on click

​

  //hair

  noStroke();

  fill("#010178");

  rect(0, 0, w / 9, h / 5);

  rect(w / 9, 0, w / 9, h / 7);

  rect(w / 4.5, 0, w / 9, h / 5);

  rect(w / 3, 0, w / 9, h / 7);

  rect(w * 4 / 9, 0, w / 9, h / 5);

  rect(w * 5 / 9, 0, w / 9, h / 7);

  rect(w * 6 / 9, 0, w / 9, h / 5);

  rect(w * 7 / 9, 0, w / 9, h / 7);

  rect(w * 8 / 9, 0, w / 9, h / 5);

  rect(w, 0, w / 9, h / 7);

​

  //left eyebrow

  rectMode(CENTER);

  fill("#010178");

  rect(w / 3, h / 3, w / 4, h / 20);

​

  //right eyebrow

  rect(width - w / 3, h / 3, w / 4, h / 20);

​

  //left eye closed

  fill("#010178");

  ellipse(w / 3, h / 2, w / 4, w / 4);

​

  //right eye closed

  noStroke();

  fill("#010178");

  ellipse(width - w / 3, h / 2, w / 4, w / 4);

​

  //nose

  fill("#FFFFFF");

  arc(w / 2, height - h / 2.8, w / 16, w / 16, 180, 0);

​

  //mouth

  {

    fill("FFFFFFF");

    stroke("#010178");

    strokeWeight(h / 40);

    ellipse(width - w / 2, height - h / 5, w / 5, w / 5);

  }

}

​

function angry() {

  let color = random(colors)

  background(color);

  //hair

  noStroke();

  fill("#010178");

  rect(0, 0, w / 9, h / 5);

  rect(w / 9, 0, w / 9, h / 7);

  rect(w / 4.5, 0, w / 9, h / 5);

  rect(w / 3, 0, w / 9, h / 7);

  rect(w * 4 / 9, 0, w / 9, h / 5);

  rect(w * 5 / 9, 0, w / 9, h / 7);

  rect(w * 6 / 9, 0, w / 9, h / 5);

  rect(w * 7 / 9, 0, w / 9, h / 7);

  rect(w * 8 / 9, 0, w / 9, h / 5);

  rect(w, 0, w / 9, h / 7);

​

  //left eye closed

  fill("#010178");

  ellipse(w / 3, h / 2, w / 4, w / 4);

​

  //right eye closed

  noStroke();

  fill("#010178");

  ellipse(width - w / 3, h / 2, w / 4, w / 4);

​

  //nose

  fill("#FFFFFF");

  arc(w / 2, height - h / 2.8, w / 16, w / 16, 180, 0);

​

  //www mouth

  textSize(h / 10);

  fill("#010178");

  textAlign(CENTER);

  textStyle(BOLD);

  text('www', width - w / 2, height - h / 5);

​

  //angry left eyebrow

  rectMode(CENTER);

  fill("#010178");

  translate(w / 2, h / 3);

  rotate(30);

  rect(-w / 6, 0, w / 4, h / 20);

​

  //angry right eyebrow

  rotate(-60);

  rect(w / 6, 0, w / 4, h / 20);

}

​

function windowResized() {

resizeCanvas(windowWidth, windowHeight);

}