/*Leona Wu
 *Interactive_drawing_01: Black Rock Shooter
 
 *Background, star, jacket, hair will move on x-axis
 *Background colour changes with mouseX movement
 *Sword moves on y-axis
 *MouseY movement will make her eyes and blush brighter
 *Mouse press will show a flame on one of her eyes
 */


void setup() {

  //screen size 400x400
  size(400, 400);

  //remove cursor
  noCursor();
}

void draw() {

  frameRate(60);
  rectMode(CORNERS);

  //background colour goes darker to lighter depending on mouse position of x-axis
  colorMode(RGB);
  fill(63, 204, 247);
  background(mouseX-400, mouseX, mouseX+400);

  //background color and shades
  fill(187, 245, 254, 35);
  rect(0, 60, 400, 400);
  fill(1, 10, 101, 25);
  rect(0, 95, 400, 400);
  fill(28, 91, 250, 25);
  rect(0, 140, 400, 400);

  //background shapes row 1
  rectMode(CORNERS);
  fill(8, 43, 101);
  rect(0, 130, 400, 250);
  rect(mouseX-400, 100, mouseX-120, 130);
  quad(mouseX-400, 100, mouseX-400, 80, mouseX-140, 80, mouseX-120, 100);
  triangle(mouseX-120, 130, mouseX-120, 100, mouseX-90, 130);
  quad(mouseX+30, 130, mouseX+50, 110, mouseX+90, 110, mouseX+110, 130);
  quad(mouseX+140, 130, mouseX+180, 80, mouseX+400, 80, mouseX+400, 130);
  //row 2
  fill(125, 191, 252);
  rect(0, 200, 400, 250);
  rect(-mouseX-400+width, 180, -mouseX-120+width, 200);
  quad(-mouseX-400+width, 180, -mouseX-400+width, 160, -mouseX-140+width, 160, -mouseX-120+width, 180);
  triangle(-mouseX-120+width, 210, -mouseX-120+width, 180, -mouseX-90+width, 210);
  quad(-mouseX+30+width, 210, -mouseX+50+width, 190, -mouseX+90+width, 190, -mouseX+110+width, 210);
  quad(-mouseX+140+width, 210, -mouseX+180+width, 160, -mouseX+400+width, 160, -mouseX+400+width, 210);

  //star shape and movement
  fill(0, 200);
  quad(mouseX-25+sin(frameCount*.2), 55+sin(frameCount*.2), mouseX+sin(frameCount*.2), 5, mouseX+25+sin(frameCount*.2), 55+sin(frameCount*.2), mouseX+sin(frameCount*.2), 45);
  triangle(mouseX-30+sin(frameCount*.2), 20, mouseX+sin(frameCount*.2), 45, mouseX+30+sin(frameCount*.2), 20);
  fill(255);
  quad(mouseX-20, 50, mouseX, 10, mouseX+20, 50, mouseX, 40);
  triangle(mouseX-25, 25, mouseX, 40, mouseX+25, 25);

  //floor and shading 
  rectMode(CORNERS);
  noStroke();
  fill(33, 40, 50);
  rect(0, 240, 400, 400);
  fill(68, 74, 96, 20);
  rect(0, 290, 400, 400);  
  fill(104, 146, 168, 20);
  rect(0, 340, 400, 400);
  fill(129, 194, 214, 20);
  rect(0, 380, 400, 400);

  //hood base color and structure
  fill(3, 10, 26);
  ellipse(200, 225, 50, 25);
  fill(3, 10, 26);
  ellipse(200, 150, 180, 160);

  //shirt base color and structure
  fill(3, 10, 26);
  quad(187, 221, 213, 221, 225, 300, 175, 300);

  //body base color and structure
  fill(255, 237, 217);
  arc(200, 265, 32, 100, 3.15, radians(360));
  fill(247, 205, 194);
  fill(192, 154, 133);
  arc(200, 246, 23, 55, 3.15, radians(360));
  fill(255, 237, 217);
  arc(200, 265, 30, 55, 3.15, radians(360));

  //legs
  ellipse(192, 272, 15, 40);
  ellipse(192, 292, 12, 49);
  ellipse(208, 272, 15, 40);
  ellipse(208, 292, 12, 49);
  fill(192, 154, 133);
  ellipse(192, 296, 12, 15);
  ellipse(208, 296, 12, 15);

  //clothing inside covered by jacket
  fill(0);
  triangle(193, 225, 199, 240, 188, 240);
  triangle(207, 225, 201, 240, 212, 240);

  //pants
  rectMode(CENTER);
  fill(0);
  rect(200, 264, 34, 15);
  rect(192, 270, 16, 15, 20);
  rect(208, 270, 16, 15, 20);
  fill(60, 68, 77, 60);
  rect(192, 269, 12, 11, 4);
  rect(208, 269, 12, 11, 4);

  //shoes
  fill(3, 10, 26);
  quad(185, 296, 198, 296, 196, 319, 187, 319);
  quad(202, 296, 215, 296, 212, 319, 203, 319);
  fill(34, 81, 107);
  rect(192, 319, 11, 8, 5);
  rect(208, 319, 11, 8, 5);
  fill(255);
  rect(192, 323, 11, 4);
  rect(208, 323, 11, 4);

  //jacket front and movement using mouseX
  fill(3, 10, 26);
  quad(187, 218, 197, 225, 189+mouseX/50, 310-mouseX/50, 170-mouseX/50, 308);
  stroke(255);
  strokeWeight(2);
  line(194, 230, 189+mouseX/50, 309-mouseX/50);
  noStroke();
  fill(70, 85, 108);
  quad(183, 245, 190, 260, 189+mouseX/50, 310-mouseX/50, 170-mouseX/50, 308);
  fill(3, 10, 26);
  quad(213, 218, 203, 225, 216+mouseX/50, 310+mouseX/50, 236-mouseX/50, 308-mouseX/50);
  stroke(255);
  strokeWeight(2);
  line(205, 230, 216+mouseX/50, 308+mouseX/50);
  noStroke();
  fill(100, 114, 143);
  rect(200, 230, 15, 7, 5);
  fill(177, 185, 206, 100);
  rect(200, 230, 10, 3, 5);

  //arms
  fill(0);
  ellipse(179, 284, 7, 15);
  ellipse(221, 284, 7, 15);
  fill(240, 240, 240);
  rect(179, 281, 8, 7, 2);
  rect(221, 281, 8, 7, 2);
  fill(91, 109, 114);
  quad(181, 230, 187, 225, 184, 280, 174, 280);
  fill(70, 85, 108);
  quad(219, 230, 213, 225, 216, 280, 226, 280);
  stroke(255);
  strokeWeight(1);
  line(219, 230, 213, 225);
  line(181, 230, 187, 225);
  noStroke();

  //face base color and structure
  fill(255, 237, 217);
  ellipse(200, 165, 140, 110);

  //left eye, arcs and ellipses overlapping 
  ellipseMode(CENTER);
  fill(3, 2, 53);
  arc(164, 170, 37, 40, 3.1, radians(360));
  fill(2, 38, 142);
  ellipse(164, 175, 35, 40);
  noStroke();
  fill(120, 190, 243);
  arc(164, 175, 35, 40, 0, radians(180));
  fill(5, 6, 87);
  ellipse(164, 175, 20, 25);
  fill(187, 185, 237);
  arc(164, 175, 7, 12, 0, radians(180));
  fill(255);
  ellipse(179, 170, 15, 6);

  //right eye
  fill(3, 2, 53);
  arc(236, 170, 37, 40, 3.1, radians(360));
  fill(2, 38, 142);
  ellipse(236, 175, 35, 40);
  noStroke();
  fill(120, 190, 243);
  arc(236, 175, 35, 40, 0, radians(180));
  fill(5, 6, 87);
  ellipse(236, 175, 20, 25);
  fill(186, 185, 237);
  arc(237, 175, 7, 12, 0, radians(180));
  fill(255);
  ellipse(252, 170, 15, 6);

  //eye glow
  colorMode(HSB);
  fill(150, 100, 80+mouseY, 50);
  ellipse(164, 175, 35, 40);
  ellipse(236, 175, 35, 40);

  //eye bags
  colorMode(RGB);
  fill(255, 237, 217);
  rectMode(CENTER);
  rect(164, 195, 30, 10);
  rect(236, 195, 30, 10);

  //blush, glows with movement on y-axis
  colorMode(HSB);
  fill(0, 190, 50+mouseY, 127);
  ellipse(164, 197, 29, 9);
  ellipse(239, 197, 29, 9);

  //mouth
  colorMode(RGB);
  fill(3, 2, 53);
  rect(200, 200, 3, 1);

  //hood side triangles
  noStroke();
  fill(144, 157, 176);
  triangle(108, 160, 130, 160, 150, 220);
  fill(70, 85, 108);
  triangle(292, 160, 270, 160, 250, 220);

  //hair base shapes and color
  fill(30, 89, 120);
  arc(200, 150, 140, 100, 3.1, radians(360));

  //character bangs and hair movement
  fill(30, 89, 120);
  quad(120, 110, 165, 160, 173+mouseX/20, 180, 180, 120);
  fill(8, 14, 38);
  quad(125, 110, 130, 145, 140+mouseX/20, 190, 150, 140);
  fill(30, 89, 120);
  quad(115, 110, 120, 155, 130+mouseX/20, 205, 155, 145);
  fill(8, 14, 38);
  quad(190, 130, 235, 165, 250+mouseX/20, 200, 270, 140);
  fill(30, 89, 120);
  quad(250, 110, 275, 153, 250+mouseX/20, 210, 260, 110);
  fill(8, 14, 38);
  quad(215, 110, 180, 160, 200+mouseX/20, 190, 210, 150);
  fill(30, 89, 120);
  quad(140, 110, 160, 150, 200+mouseX/20, 205, 195, 165);
  fill(30, 89, 120);
  quad(200, 110, 160, 150, 200+mouseX/20, 205, 195, 165);
  fill(30, 89, 120);
  quad(195, 115, 235, 155, 240+mouseX/20, 210, 270, 110);

  //hood top
  fill(70, 85, 108);
  quad(200, 50, 200, 120, 108, 160, 118, 90);
  fill(3, 10, 26);
  quad(200, 50, 200, 120, 292, 160, 285, 90);
  fill(26, 22, 36, 77);
  quad(200, 50, 200, 115, 285, 160, 270, 95);
  fill(26, 22, 36, 110);
  quad(219, 65, 219, 115, 275, 143, 268, 90);

  //sword
  fill(3, 48, 51);
  quad(60, mouseY+160, 80, mouseY+140, 80, mouseY+20, 60, mouseY+20);
  fill(174, 176, 171);
  quad(73, mouseY+147, 80, mouseY+140, 80, mouseY+20, 73, mouseY+20);
  fill(240, 241, 236);
  rect(70, mouseY+20, 40, 10, 2);
  rect(70, mouseY, 10, 40, 2);
  fill(76, 111, 108);
  rect(80, mouseY+20, 20, 10);
  rect(72, mouseY, 5, 40);

  //sword stand
  fill(139, 149, 149);
  quad(40, 400, 100, 400, 85, 320, 55, 320);
  fill(86, 100, 100);
  quad(90, 400, 100, 400, 85, 320, 80, 320);
}

void mousePressed() {

  frameRate(3);

  //fire
  fill(28, 209, 228, 150);
  triangle(210, 195, 260, 195, 230, 125+sin(frameCount*.10));
  fill(0, 80, 238, 120);
  triangle(220, 190, 250, 190, 230, 130+sin(frameCount*.2));
}