Project 2: Variable Face

var eyeSize = 20;
var faceWidth = 100;
var faceHeight = 150;
var R = 0;
var G = 0;
var B = 0;
var FR = 252;
var FG = 224;
var FB = 203;
var nose = 10
var HR = 100;
var HG = 100;
var HB = 100;
var CR = 140;
var CG = 140;
var CB = 140;



 
function setup() {
    createCanvas(300, 300);
}
 
function draw() {
    background(R,G,B);
    noStroke();
    //back hair
    fill(HR,HG,HB);
    ellipse(width / 2, height / 2, faceWidth+10,  faceHeight+10);
    strokeWeight(2);
    stroke(0);
    rect(width / 2 - faceWidth/2-5, height / 2 -20, faceWidth + 10, faceHeight/2+25);
    noStroke();
    //clothes
    if(mouseX < width/2){
        fill(CR,CG,CB);
        ellipse(width/2,height,faceWidth+50,height/2 +faceHeight/2-10);
        fill(CR+40,CG+40,CB+40);
        ellipse(width/2,height/2 + faceHeight/2 +faceWidth/4+20, 10);
        ellipse(width/2,height/2 + faceHeight/2 +faceWidth/4+30, 10);
        ellipse(width/2,height/2 + faceHeight/2 +faceWidth/4+10, 10);
    }else{
        fill(255-CR,255-CG,255-CB);
        ellipse(width/2,height,faceWidth+50,height/2 +faceHeight/2-10);
        fill(CR+40,CG+40,CB+40);
        ellipse(width/2,height/2 + faceHeight/2 +faceWidth/4+20, 10);
        ellipse(width/2,height/2 + faceHeight/2 +faceWidth/4+30, 10);
        ellipse(width/2,height/2 + faceHeight/2 +faceWidth/4+10, 10);

    }
    //neck
    fill(FR-20,FG-20,FB-20);
    rect(width/2- faceWidth/8, height/2 + faceHeight/2 -10, faceWidth/4,20);
    ellipse(width/2, height/2 + faceHeight/2 +10, faceWidth/4,faceWidth/4);
    //face outline
    fill(FR,FG,FB);
    ellipse(width / 2, height / 2, faceWidth,  faceHeight);
    var eyeLX = width / 2 - faceWidth * 0.25;
    var eyeRX = width / 2 + faceWidth * 0.25;
    //eye
    fill(255);
    strokeWeight(1);
    stroke(0);
    ellipse(eyeLX, height / 2, eyeSize, eyeSize);
    ellipse(eyeRX, height / 2, eyeSize, eyeSize);
    noStroke();
    fill(0);
    ellipse(eyeLX,height / 2,eyeSize / 2);
    ellipse(eyeRX, height / 2, eyeSize / 2);
    fill(255);
    ellipse(eyeLX + 2,height / 2 -2,eyeSize / 6);
    ellipse(eyeRX + 2,height / 2 -2,eyeSize / 6);

    //mouth
    fill(240,90,85);
    arc(150,180,20,20,0,PI, open);
    //teeth
    fill(255);
    rect(145,180,10,2);
    //nose
    strokeWeight(2);
    stroke(0);
    line(150,150,150,150 + nose);
    //front hair
    fill(HR,HG,HB);
    arc(width / 2, height / 2-15, faceWidth+10,  faceHeight-10, PI,2*PI, PI);
}
 
function mousePressed() {
    // when the user clicks, these variables are reassigned
    // to random values within specified ranges. For example,
    // 'faceWidth' gets a random value between 75 and 150.
    R = random(50,250);
    G = random(0,256);
    B = random(0,256);
    FR = R + 50;
    FG = FR - 25;
    FB = FG - 25;
    HR = 255-R;
    HG = 255-G;
    HB = 255-B
    faceWidth = random(75, 150);
    faceHeight = random(100, 150);
    eyeSize = random(20, 30);
    nose = random(10,20);
    CR = random(100,200);
    CG =random(100,200);
    CB =random(100,200);
}