Your browser does not support the canvas tag.

previous        Show / Hide Source        Download        next
/*
No Touchy by Ziyad Sattaur
 
 Mr Happy is a pretty nice guy. He's very fascinated by your mouse and his eyes will 
 follow it closely. However, Mr Happy does not like to be touched. If you touch him, 
 he becomes Mr Angry and stares at your mouse with disapproval
 */

void setup () {
  //set window size
  size (400, 400);
}

void mousePressed () {
  //drop framerate so mouseclick lasts longer
  frameRate(3);

  //angry red face
  background (223, 67, 41);

  //eyes
  stroke (0);
  fill(255);
  ellipse (100, 140, 100, 150);
  ellipse (300, 140, 100, 150);

  //moving pupils
  noStroke ();
  fill (0);
  ellipse (75+mouseX/7.3, 105+mouseY/5.7, 50, 75);
  ellipse (275+mouseX/7.3, 105+mouseY/5.7, 50, 75);

  //angry eyebrows
  stroke (0);
  strokeWeight (2);
  //eyebrow angle changes with position of mouse
  line (40, 40, 140, 60+mouseY/30);
  line (260, 60+mouseY/30, 360, 40);

  //nose
  stroke(0);
  strokeWeight(2);
  line (200, 200, 240, 280);
  line (180, 280, 240, 280);

  //angular mouth
  stroke (0);
  line(300, 340, 120, 340);
  line (120, 340, 100, 360);
}

void draw () {
  //framerate for "happy mode"
  frameRate(60);

  //happy yellow face
  background (255, 230, 63);

  //eyes
  stroke (0);
  fill(255);
  ellipse (100, 140, 100, 150);
  ellipse (300, 140, 100, 150);

  //moving pupils
  noStroke ();
  fill (0);
  ellipse (75+mouseX/7.3, 105+mouseY/5.7, 50, 75);
  ellipse (275+mouseX/7.3, 105+mouseY/5.7, 50, 75);

  //nose
  stroke(0);
  line (200, 200, 240, 280);
  line (180, 280, 240, 280);

  //smiling mouth
  fill(159, 31, 10);
  noStroke();
  //mouth expands when looking up, contracts when looking down
  arc(200, 300, 260-mouseY/30, 160+mouseY/30, 0, PI);

  //tounge
  noStroke();
  fill(223, 44, 146);
  //tongue height adjusts to fit expanding mouth
  ellipse(200, 360, 150, 40+mouseY/30);

  //curved eyebrows
  stroke(0);
  strokeWeight(2);
  noFill();
  //eyebrows extend when looking up
  arc(90, 60, 100, 50-mouseY/30, PI, TWO_PI);
  arc(310, 60, 100, 50-mouseY/30, PI, TWO_PI);
}