Month: September 2022

// Evan Stuhlfire
// estuhlfi, Section B
// Project-02: Variable Faces; Face Variables

// Declare global variables


// variable controling head dimensions and shape
var headX = 0; // x value of head center
var headY = 0; // y value of head center
var minHead = 100;
var maxHeadW = 500; //max head width
var maxHeadH = 420; // max head height
var headHeight = 300;
var headWidth = 350;

// variables controling face dimensions and attributes
var eyeSize = 25;
var percentEyeW = 1; // value to adjust eye shape and position
var percentEyeH = 1; // value to adjust eye shape and position
var eyeVert = 2;
var lookAdjustLeft = .25; // Controls eye placement for look direction
var lookAdjustRight = .25;
var lookMax = .45;

// variable to control nose
var nose1 = 1;
var nose2 = 1.1;
var nose3 = 1.1;
var nose4 = 1;
var noseEnd = 1;
var noseLeft1 = 1;
var noseLeft2 = .9;
var noseLeft2 = 1;

// mouth variables
var noseMouthGap = 10;
var mouthStart = 1;
var mouth1 = 1.05;
var mouth2 = 1;
var mouthIncrease = 1.02;

//  color variables
var color1 = 0;
var color2 = 0;
var color3 = 0;

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

    // set head center
    centerX = width/2;
    centerY = height/2;

    // get initial colors
    getRandomColors();
}

function draw() {
    var colorChange = .4; // factor to modify color

    background(color1, color2, color3); // draw background from color variables

    // calculate eyes
    var eyeLeftX = centerX - headWidth * lookAdjustLeft; // x coordingate of left eye
    // x coordinate of right eye, can look different directions
    var eyeRightX = centerX + headWidth * lookAdjustRight; 
    var eyeHeight = min(eyeSize * percentEyeH, headHeight * .90);
    var eyeWidth = eyeSize * percentEyeW;
    var eyePositionY = height / eyeVert; // calculate vertical position of eyes 

    
    // calculate pupils
    var pupilSize = .2;
    var pupilLook = 4;
    var pupilX = eyeLeftX;
    var pupilY = eyeRightX;

    if (lookAdjustLeft > lookAdjustRight){ // looking left move pupils left
        pupilX -= pupilLook;
        pupilY -= pupilLook;
    } else { // looking right move pupils right
        pupilX += pupilLook;
        pupilY += pupilLook;
    }

    // variables for nose
    var maxNose = .90;

    var nose1X = (eyeLeftX + eyeRightX)/2;
    var nose1Y = eyePositionY; 
    if (lookAdjustLeft > lookAdjustRight) { 
        // looking left point nose left
        var nose2X = nose1X * noseLeft1;
        var nose2Y= min(nose1Y * nose2, (centerY + headHeight/2) * maxNose);
        var nose3X = nose2X * noseLeft2;
        var nose3Y= min(nose2Y * nose3, (centerY + headHeight/2) * maxNose);
        var nose4X= nose1X * noseLeft3;
        var nose4Y= min(nose3Y * nose4, (centerY + headHeight/2) * maxNose + noseMouthGap);
    } else { 
        // looking right point nose right 
        var nose2X = nose1X * nose1;
        var nose2Y= min(nose1Y * nose2, (centerY + headHeight/2) * maxNose);
        var nose3X = nose2X * nose3;
        var nose3Y= min(nose2Y * nose3, (centerY + headHeight/2) * maxNose);
        var nose4X= nose1X * noseEnd;
        var nose4Y= min(nose3Y * nose4, (centerY + headHeight/2) * maxNose + noseMouthGap);   
    }

    // calculate mouth
    var maxMouth = .98;
    var mouth1X = centerX * mouthStart;
    var mouth1Y = min(nose4Y * mouth1, (centerY + headHeight/2) - noseMouthGap);
    // keep mouth on face
    if (headHeight > headWidth){
        mouth1X = centerX - noseMouthGap;
    }
    var mouth2X = mouth1X * mouthIncrease;
    var mouth2Y = mouth1Y * mouth2;
    var mouth3X = mouth2X * mouthIncrease;
    var mouth3Y = mouth2Y;
    var mouth4X = mouth3X * mouthIncrease;
    var mouth4Y = mouth1Y;



    // draw head
    fill(color1 * colorChange, color2, color3);
    ellipse(centerX, centerY, headWidth,  headHeight);

    // draw eyes
    fill(color1, color2 * colorChange, color3);
    ellipse(eyeLeftX, eyePositionY, eyeWidth, eyeHeight);
    ellipse(eyeRightX, eyePositionY, eyeWidth, eyeHeight);

    // draw pupils
    fill(10);
    ellipse(pupilX, eyePositionY, eyeWidth * pupilSize, eyeHeight * pupilSize);
    ellipse(pupilY, eyePositionY, eyeWidth * pupilSize, eyeHeight * pupilSize);

    // draw mouth
    beginShape();
    curveVertex(mouth1X, mouth1Y);
    curveVertex(mouth1X, mouth1Y);
    curveVertex(mouth2X, mouth2Y);
    curveVertex(mouth3X, mouth3Y);
    curveVertex(mouth4X, mouth4Y);
    curveVertex(mouth4X, mouth4Y);
    endShape();

    // draw nose 
    fill(color1 * colorChange, color2, color3);
    beginShape();
    curveVertex(nose1X, nose1Y);
    curveVertex(nose1X, nose1Y);
    curveVertex(nose2X, nose2Y);
    curveVertex(nose3X, nose3Y);
    curveVertex(nose4X, nose4Y);
    curveVertex(nose4X, nose4Y);
    endShape();
}

function mousePressed() {
    // When the mouse is clicked random values are generated to control the 
    // dimensions, position, and color of a face

    // randomly generate head value
    headWidth = random(minHead, maxHeadW);
    headHeight = random(minHead, maxHeadH);

    // randomly generate eye values
    eyeSize = headWidth * random(.1, .3);
    percentEyeW = random(.5, 1); 
    percentEyeH = random(.5, 1);
    eyeVert = random(2, 2.25); // vertical position of eyes
    lookAdjustLeft = random(.01, lookMax);
    lookAdjustRight = lookMax - lookAdjustLeft;

    // generate nose values
    nose1 = random(1, 1.1);
    nose2 = random(1, 1.2);
    nose3 = random(1.1, 1.15);
    nose4 = random(.98, 1.05);
    noseEnd = random(.95, 1.05);
    noseLeft1 = random(.95, 1);
    noseLeft2 = random(.85, 1);
    noseLeft3 = random(1, 1.12);

    // generate mouth values
    mouthStart = random(.95, 1.05);
    mouth1 = random(1.05, 1.2);
    mouth2 = random(.98, 1.02);
    mouthIncrease = random(1.02, 1.03);

    // randomly generate a new color combination
    getRandomColors();
}

function getRandomColors(){
    // function generates a random number for color variables
    color1 = random(80, 255); 
    color2 = random(80, 255);
    color3 = random(80, 255);
}