Variable Face

//Jasmin Kim
//Section D

var eyeSize = 70;
var faceWidth = 200;
var faceHeight = 250;
var mouthSize = 80;
var mouthW = 80;
var mouthH=40;
var R = 188;
var G = 212;
var B = 246;


var value = 0;

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

function draw() {
    background(R,G,B);

    //Face Shape
    fill(243,213,B); //Beige
    noStroke();
    ellipse(width / 2, height / 2, faceWidth,  faceHeight);  //Face
    var faceX = (width/2);
    var faceY = (height/2);
    var eyeLX = width / 2 - faceWidth * 0.25;
    var eyeRX = width / 2 + faceWidth * 0.25;
    
    //Body Shape
    var bodyW = faceWidth*1.8
    var bodyH = (height/2)+(height*0.6)
    rect((width/2)-(faceWidth/1.1),(height/2)+(faceHeight/2.4),bodyW,bodyH,80,80,20,20);
    
    //glass rectangle
    fill(158,157,156);
    stroke(1);
    rect(eyeLX,(height/2)-3,faceWidth/2,5);
    
    //Eyes
    stroke(7);
    strokeWeight(1);
    var eyeH = height/2
    ellipse(eyeLX, eyeH, eyeSize*1.3, eyeSize*1.3);   //gray glasses
    ellipse(eyeRX, eyeH, eyeSize*1.3, eyeSize*1.3);
    fill(255);
    ellipse(eyeLX, eyeH, eyeSize, eyeSize);           //white eyes
    ellipse(eyeRX, eyeH, eyeSize, eyeSize);
    
    //eyes moving
    fill(0);
    var moveXr = constrain(mouseX,eyeLX-(eyeSize/5),eyeLX+(eyeSize/5));
    var moveYr = constrain(mouseY,eyeH-(eyeSize/5),eyeH+(eyeSize/5));
    var moveXl = constrain(mouseX,eyeRX-(eyeSize/5),eyeRX+(eyeSize/5));
    var moveYl = constrain(mouseY,eyeH-(eyeSize/5),eyeH+(eyeSize/5));
    ellipse(moveXr, moveYr, eyeSize/2, eyeSize/2);       //black eyeball
    ellipse(moveXl, moveYl, eyeSize/2, eyeSize/2);

    //Mouth
    if(faceWidth <230){
        strokeWeight(5);
        line(eyeLX-(eyeSize/2),eyeH-40,eyeLX+(eyeSize/2),eyeH-50);               //sad eyebrow
        line(eyeRX-(eyeSize/2),eyeH-50,eyeRX+(eyeSize/2),eyeH-40);
        noStroke();
        fill(79,129,255)
        circle(eyeLX,(height*0.65),20);                                           //tears
        triangle(eyeLX-10, height*0.65, eyeLX, height*0.6,eyeLX+10, height*0.65);   //tears#2
        fill(0);
        ellipse(width/2,(faceY+(faceHeight/4.5))+10,50,45);     //black mouth
        if(faceHeight<290){
            stroke(4);
            line(280,90,(width/2)-20,130);      //hair
            line(300,90,(width/2)-14,125);
            line(320,90,(width/2)-8,118);
        }
        
    } else{
        fill(R,G,B);
        strokeWeight(1);
        var mouthY = faceY+(faceHeight/4.5);
        var mouthX = faceX-(mouthW/2);
        rect(mouthX, mouthY, mouthW, mouthH,25,25,25,25);       //normal mouth
        //Angry Eyebrows
        strokeWeight(5);
        line(eyeLX-(eyeSize/2),eyeH-50,eyeLX+(eyeSize/2),eyeH-40);
        line(eyeRX-(eyeSize/2),eyeH-40,eyeRX+(eyeSize/2),eyeH-50);
        //tongue
        strokeWeight(1);
        fill(239,133,154);
        arc(mouthX+(mouthW/2),mouthY+mouthH, mouthW/1.8, mouthH*0.8, PI, TWO_PI);

    }

    
}


function mousePressed() {
    faceWidth = random(200, 300);
    faceHeight = random(250, 350);
    eyeSize = random(40, 70);
    R = random(0,255);
    G = random(0,255);
    B = random(0,255);
    mouthW = random(55,85);
    mouthH = random(30,45);

}