Project-02: Variable Faces

//Isabel Xu
//Section A
var face_width = 200;
var face_length = 200;
var hair_length = 600
var hair_color = 132;
var eye_width = 30
var eye_size = 20


function setup() {
    createCanvas(480, 640);
}

function draw() {

  background(220);

  //hair
  noStroke();
  fill(hair_color, 117, 82);
  rect(81,88,260,hair_length,100,100,45,45);

  //face
  fill(247, 194, 150);
  noStroke();
  ellipse(width/2,240,face_width,face_length);
  //ears
  ellipse(width/2-(face_width/2),275,30,40);
  ellipse(width/2+(face_width/2-10),275,30,40);

  
  //upper body
  fill(247, 194, 150);
  noStroke();
  beginShape();
  vertex(width/2-35, 260);
  vertex(width/2-35, 430);
  vertex(width/2-175, 470);
  vertex(width/2-225, 550);
  vertex(width/2-225, 650);
  vertex(width/2+225, 650);
  vertex(width/2+225, 550);
  vertex(width/2+175, 470);
  vertex(width/2+35, 430);
  vertex(width/2+35, 260);
  endShape();
  

  //lips
  fill(190,111,82);
  noStroke();
  beginShape();
  curveVertex(width/2-20,240+(face_length/2)-45);
  curveVertex(width/2-15,240+(face_length/2)-35);
  curveVertex(width/2+15,240+(face_length/2)-25);
  curveVertex(width/2+30,240+(face_length/2)-35);
  curveVertex(width/2+50,240+(face_length/2)-45);
  endShape();
  
  beginShape();
  curveVertex(width/2-20,240+(face_length/2)-25);
  curveVertex(width/2-15,240+(face_length/2)-35);
  curveVertex(width/2+15,240+(face_length/2)-40);
  curveVertex(width/2+30,240+(face_length/2)-35);
  curveVertex(width/2+50,240+(face_length/2)-25);
  endShape();

  //nose
  noStroke();
  fill(190,111,82);
  beginShape();
  vertex(width/2+2, 240+(face_length/2)-75);
  vertex(width/2, 240+(face_length/2)-60);
  vertex(width/2+20, 240+(face_length/2)-60);
  vertex(width/2+18, 240+(face_length/2)-75);
  endShape(CLOSE);
  
  beginShape();
  curveVertex(width/2, 240+(face_length/2)-60);
  curveVertex(width/2, 240+(face_length/2)-60);
  curveVertex(width/2+10, 240+(face_length/2)-55);
  curveVertex(width/2+20, 240+(face_length/2)-60);
  curveVertex(width/2+20, 240+(face_length/2)-60);
  endShape();


  //eyes
    fill(255);
    ellipse(width / 2 - face_width * 0.25 +10,245 , eye_width, eye_size);
    ellipse(width / 2 + face_width * 0.25 +10, 245, eye_width, eye_size);
    //pupils
    fill(76,50,36);
    noStroke();
    ellipse((width / 2 - face_width * 0.25 +10)+3, 244 , eye_width/2,eye_size*0.8);
    ellipse((width / 2 + face_width * 0.25 +10)+3,244, eye_width/2., eye_size*0.8);

  

  //garment with transparency
  fill(150,190);
  noStroke();
  strokeWeight(3);
  beginShape();
  curveVertex(width/2-45,405);
  curveVertex(width/2-35,425);
  curveVertex(width/2-57,435);
  curveVertex(width/2-175, 460);
  curveVertex(width/2-225, 550);
  curveVertex(width/2-205, 650);
  curveVertex(width/2+195, 650);
  curveVertex(width/2+225, 550);
  curveVertex(width/2+175, 460);
  curveVertex(width/2+57,435);
  curveVertex(width/2+35,425);
  curveVertex(width/2+45,405);
  endShape(CLOSE);

  //garment on top layer
  fill(250);
  noStroke();
  beginShape();
  vertex(width/2,610)
  vertex(width/2-50,430)
  vertex(width/2-170,430)
  vertex(width/2-180,470)
  vertex(width/2-180,650)
  vertex(width/2+180,650)
  vertex(width/2+180,470)
  vertex(width/2+170,430)
  vertex(width/2+50,430)
  endShape();

  //earrings *line
  stroke(2); //line
  strokeWeight(1);
  strokeCap(SQUARE);
  line(width/2-(face_width/2),290,width/2-(face_width/2),385);
  line(width/2+(face_width/2)-10,290,width/2+(face_width/2)-10,385);
  
  //earrings *rounds
    if (mouseIsPressed) {
        fill(99,234,232);
    } else {
        fill(249,239,80);
    }
    
    ellipse(width/2-(face_width/2),385,50,50);
    ellipse(width/2+(face_width/2)-10,385,40,40);
  
  
  
  }


function mousePressed() {
    hair_length = random(320, 431);
    face_width = random(180, 205);
    face_length = random (190,220)
    hair_color = random(50,132);
    eye_width = random(35,50);
    eye_size = random(25,35);
   

   
}