Project-02-Variable-Face

	// Huijun Shen D


	var faceWidthA = 100;
    var faceHeightA = 120;
    var faceWidthB = 100;
    var faceWidthB = 100;
    var faceHeightB = 100;
    var eyeWidth = 30;
    var eyeHeight = 30;
    var mouthWidth = 30;
    var mouthHeight = 30;
    var puffRWidth = 30;
    var puffRHeight = 30;
    var puffLwidth = 30;
    var puffLHeight = 30;
    var r = 10;
    var g = 10;
    var b = 10;

 
function setup() {
    createCanvas(640,480);
}
 
function draw() {
    noStroke();
    //bg
    background(r,g,b);    //randomize bg color
    fill(r+30, g+30, b+30);
    rect(width/2-width/3, height/2-height/3, width-width/2-width/3, height -30);
    rect(width/2-width/3+faceWidthB, height/2-height/3, width-width/2-width/3, height -30);
    rect(width/2-width/3+faceWidthB*2, height/2-height/3, width-width/2-width/3, height -30);
    //fill(r, g, b);

    stroke(0)
    fill(219,153,112);
    fill(50+r,50+g,b+50);  //neckDeco
    rect(width/2 - faceWidthB * 0.25, height/2 + faceHeightB/3, faceWidthB/2, faceHeightB/5);  
    fill(247,216,186);
    ellipse(width/2, height/2, faceWidthB, faceHeightB);  //face    
    var eyeLX = width / 2 - faceWidthB * 0.25;
    var eyeRX = width /2 + faceWidthB * 0.25;
    stroke(255,0,0);
    fill(245,140,203);
    ellipse(width / 2- faceWidthB * 0.25, height/2 + faceHeightB * 0.2, puffLwidth, puffLHeight); //puff
    ellipse(width / 2+ faceWidthB * 0.25, height/2 + faceHeightB * 0.2 , puffRWidth, puffRHeight); //puff

    //change eye white cirlce position
    fill(255);
    if (mouseX < width/2) {
        ellipse(eyeLX, height / 2, eyeWidth+20, eyeHeight+15); //eyeWhitCircle
    }else{
        ellipse(eyeRX, height / 2, eyeWidth+20, eyeHeight+15);
    }

    
    fill(0);
    ellipse (eyeLX, height / 2, eyeWidth, eyeHeight); //eye
    ellipse (eyeRX, height / 2, eyeWidth, eyeHeight); //eye
    stroke(0);
    ellipse(width / 2, height/2 + faceHeightB * 0.25, mouthWidth, mouthHeight) //mouth


    noFill();  //hair
    beginShape();
    vertex(width / 2 - faceWidthB * 0.5 ,height / 2 - faceHeightB * 0.5);
    bezierVertex(width / 2 - faceWidthB * 0.3, height / 2 - faceHeightB * 0.3, width / 2 - faceWidthB * 0.25, height / 2 - faceHeightB * 0.2, height / 2 - faceHeightB * 0.1 , height / 2 - faceHeightB * 0.1);
    endShape();

    noFill();  //hair
    beginShape();
    vertex(width / 2 - faceWidthB * 0.65 ,height / 2 - faceHeightB * 0.65);
    bezierVertex(width / 2 - faceWidthB * 0.3, height / 2 - faceHeightB * 0.3, width / 2 - faceWidthB * 0.25, height / 2 - faceHeightB * 0.2, height / 2 - faceHeightB * 0.1 , height / 2 - faceHeightB * 0.1);
    endShape();

    noFill(); //hair
    beginShape();
    vertex(width / 2 + faceWidthB * 0.25 ,height / 2 - faceHeightB * 0.25);
    bezierVertex(width / 2 + faceWidthB * 0.3, height / 2 - faceHeightB * 0.4, width / 2 + faceWidthB * 0.25, height / 2 + faceHeightB * 0.2, width / 2 + faceWidthB * 0.25 , height / 2 - faceHeightB * 0.6);
    endShape();

    noFill();  //hair
    beginShape();
    vertex(width / 2 + faceWidthB * 0.4 ,height / 2 - faceHeightB * 0.4);
    bezierVertex(width / 2 + faceWidthB * 0.4, height / 2 - faceHeightB * 0.5, width / 2 + faceWidthB * 0.3, height / 2 + faceHeightB * 0.25, width / 2 + faceWidthB * 0.25 , height / 2 - faceHeightB * 0.6);
    endShape();

    noFill();  //hair
    beginShape();
    vertex(width / 2 + faceWidthB * 0.6 ,height / 2 - faceHeightB * 0.5);
    bezierVertex(width / 2 + faceWidthB * 0.2, height / 2 - faceHeightB * 0.7, width / 2 + faceWidthB * 0.5, height / 2 + faceHeightB * 0.8, width / 2 + faceWidthB * 0.5 , height / 2 - faceHeightB * 0.9);
    endShape();
}


    function mousePressed() {
        r = random (0,255);
        g = random (0,255);
        b = random (0,255);
        faceWidthA = random(50, 70);
        faceHeightA = random(30,50);
        faceWidthB = random(150,250);
        faceHeightB = random (150, 300);
        eyeWidth = random(10, 30);
        eyeHeight = random(10, 30);
        mouthWidth = random (8, 15);
        mouthHeight = random (5,10);
        puffRWidth = random (10,30);
        puffRHeight = random (5,15);
        puffLwidth = random(10,30);
        puffLHeight = random(5,15);

    }