Project 01: Portrait

// Emily Franco
// Section C
//Graphic elements used: ellipse,cicle,line,point,rect,square,tri,arc
var y_ref_pos = 150;
var x=0;
function setup() {
    createCanvas(500, 300);
    background(220);
    text("p5.js vers 0.9.0 test.", 10, 15);
}

function draw() {
	//background
	strokeWeight(0);
	fill(random(100,200),random (100,200),random(100,200));
	rect(x,0,10,height);
	fill(217,245,228);
	rect(x+10,0,30,height);
	x=x+30;
	//--------HAIR-------
	//back hair
	fill (104, 66, 17); //dark brown
	ellipse (width/2, y_ref_pos+28,130,200);

	//--------CLOTHES-------
	fill (220, 96, 46); //orange
	arc((width/2)-16+22,y_ref_pos+79,140,35,Math.PI,0);
	//shirt 
	rect((width/2)-43.5,y_ref_pos+70,90.5,90);

	//------FACE-----
	strokeWeight (.25);
	//base ears 
	fill (238, 217, 197); //beige
	ellipse ((width/2)-53,y_ref_pos,16,30);
	ellipse ((width/2)+53,y_ref_pos,16,30);
	//neck 
	fill (238, 217, 197);//beige
	ellipse((width/2)-22+22.5, y_ref_pos+45+20,45,30);
	strokeWeight (0);
	rect((width/2)-22, y_ref_pos+45,45,20);
	//base face
	strokeWeight (.25);
	ellipse (width/2,y_ref_pos,100,116);
	//nose 
	fill (229, 155, 99); //orange
	triangle (width/2,y_ref_pos-10,240,y_ref_pos+15,250,y_ref_pos+18);
	//eyes 
	fill (58,37,22); //dark brown
	ellipse ((width/2)-22,y_ref_pos-10,8,12);
	ellipse ((width/2)+22,y_ref_pos-10,8,12);
	//eyebrows 
	stroke(58,37,22);
	strokeWeight (.75);
	noFill();
	arc((width/2)-22,y_ref_pos-17,10,7,-3,-0.5);
	arc((width/2)+22,y_ref_pos-17,10,7,-2.5,0);
	//smile
	arc(width/2,y_ref_pos+33,10,7,0,3);
	//cheeks
	fill (233, 161, 135); //pink
	strokeWeight (0);
	circle((width/2)+22,y_ref_pos+15,20);
	circle((width/2)-25,y_ref_pos+15,20);

	//------BODY-----
	//shoulders
	fill (238, 217, 197); //beige
	circle((width/2)-60, y_ref_pos+90,40);
	circle((width/2)+63, y_ref_pos+90,40);
	//arms
	rect((width/2)-80,y_ref_pos+90,40,70);
	rect((width/2)+43,y_ref_pos+90,40,70);

	//-----DETAILS----
	//earings
	fill (111, 115, 210); //purple
	square ((width/2)-57,y_ref_pos+15,8); 
	square ((width/2)+50,y_ref_pos+15,8);
	//bangs
	push();
	strokeWeight(0);
	fill (104, 66, 17); //brown 
	rotate (-0.9);
	ellipse (width/2-165, y_ref_pos+135,20,75);
	rotate (1.7);
	ellipse (width/2-14, y_ref_pos-238,20,75);
	pop();
	//hairclip 
	//random color generated in first loop and only changes when page is reloaded
	if (x==30) {
		stroke(r=random(100,200),g=random (100,200),b=random(100,200));
	}else{
		stroke(r,g,b);
	}
	strokeWeight(4);
	line(width/2+25,y_ref_pos-30,(width/2)+40,y_ref_pos-40);
	//shirt details
	stroke(172,146,166);
	point(width/2, y_ref_pos+120);
	point(width/2, y_ref_pos+100);
	point(width/2, y_ref_pos+140);

	//reset stroke attribute
	strokeWeight(0);

}