ardenw project 02 variable face

sketch.js

/* Arden Wolf
Section B
ardenw@andrew.cmu.edu
Project-02 
*/


var num= (1);

function setup() {
    createCanvas(350, 350);
    
    
}

function draw() {
    if(num==1){
    //angry face
        background(66);
        fill (255,0,0);
        noStroke();
        ellipse(200, 200,300, 200);

        //eyes
        fill(255);
        stroke(152,8,8);
        strokeWeight(5);
        rect (100,200, 60,10);// left eye
        rect (240,200,60,10);//right eye

        //pupils
        fill(0);
        noStroke();
        rect (100,200, 10,10);
        rect (240,200,10,10);

        //hilight
        fill(255);
        noStroke();
        rect (100,200, 3,3);
        rect (240,200,3,3);


        //eyebrows
        fill(152,8,8);
        noStroke();
        rect (100,190, 60,10);
        rect (240,190,60,10);

        //mouth
        rect (170,250,60,10);
        fill(0);
        rect (180,251,40,6);

        //ears
        fill(152,8,8);
        noStroke();
        triangle(100,100,100,150,150,120);
        triangle(300,100,300,150,250,120);


    } else if (num==2){
    //sad face
        noStroke();
         background(84,108,254);
         fill (102,185,248);
         ellipse(200, 150,200, 180);

         //eyes
         fill(200);
         stroke (84,108,254);
         strokeWeight (4);
        ellipse (160,150, 40,20);// left eye
        ellipse (240,150,40,20);//right eye

        fill (0); //pupil
        ellipse (160,150, 20,20);
        ellipse (240,150,20,20);

        fill(255); //hilight
        noStroke();
        ellipse(165,145, 10,5);
        ellipse (245,145,10,5);

        //mouth
        fill(84,108,254);
        ellipse(200, 200,50, 30);

        fill (102,185,248);
        ellipse(200, 210,50, 30);


    }else {
    //happy face
        background(255,138,23);
        fill (255,240,0); 
        ellipse(150, 150,200, 150);

          //eyes
         fill(255);
        ellipse (100,150, 40,20);// left eye
        ellipse (200,150,40,20);//right eye

        fill (0); //pupil
        ellipse (100,150, 20,20);
        ellipse (200,150,20,20);

        fill(255); //hilight
        noStroke();
        ellipse(105,145, 10,5);
        ellipse (205,145,10,5);

        //mouth
        fill(255,138,23);
        ellipse(150, 190,50, 30);

        fill (255,240,0);
        ellipse(150, 180,50, 30);

    }

}

function mousePressed() {
   
num = num+1;
if (num==4)
{
    num=1;
}


}

For this assignment I decided to represent three emotions: Angry, Sad and Happy. I used if else statements and the variable num for function mouseIsPressed to change the faces and the background color to represent each emotion.

Leave a Reply