//announcing variables
float eyeType = 0;
float hairStyle = 0;
float mouthType = 0;
float clothesStyles = 0;
float extraStuff = 0;

//setup
void setup() 
{
  size(400, 400);
  rectMode(CENTER);
  ellipseMode(CORNERS);
  noStroke();
  smooth();
  frameRate(50);

  println ("Customize your character!");
}

void draw() {

  //draw the background

    //sunny background

    if (mouseX < width/3) {

      background (178 - mouseY/4, 219 - mouseY/4, 255 - mouseY/4);

      //grass

      fill (46, 140, 3);
      rect (200, 370, 400, 80);

      //flowers

      fill (255, 220, 0);
      ellipse (30, 352, 34, 356);
      ellipse (86, 380, 90, 384);
      ellipse (150, 366, 154, 370);
      ellipse (208, 390, 212, 394);
      ellipse (259, 348, 263, 352);
      ellipse (302, 376, 306, 380);
      ellipse (350, 357, 355, 361);
      ellipse (369, 390, 373, 384);

      //sun

      fill (255, 251, 133);
      ellipse (350, 10, 390, 50);
      fill (255, 251, 133, random(50, 255));
      quad (347, 30, 235, -5, 240, 45, 350, 41);
      quad (353, 13, 300, -40, 252, -5, 347, 22);
      quad (362, 5, 355, -5, 380, -5, 375, 5);
      quad (382, 11, 400, -20, 420, 5, 392, 20);
      quad (393, 30, 420, 20, 420, 60, 388, 43);
      quad (385, 48, 400, 70, 400, 130, 372, 52);
      quad (367, 52, 380, 150, 320, 170, 358, 49);
      quad (350, 50, 290, 170, 220, 70, 348, 45);

      //clouds

      fill (255, 255, 255, 100);
      ellipse (-10, 18, 51, 50);
      ellipse (110, -5, 181, 23);
      ellipse (160, 15, 210, 40);
      ellipse (80, 50, 141, 80);
      ellipse (180, 90, 245, 125);
      ellipse (150, 111, 210, 144);
  
  } else if (mouseX < 2*width/3) {

      //sunset sky 

      background (242 - mouseY, 118 - mouseY, 0 - mouseY);

      //sun

      fill (255, 63, 87, random(50, 150));
      ellipse (20, 290, 110, 380);
      fill (255, 63, 87, random(50, 150));
      ellipse (0, 270, 130, 400);
      fill (255, 155, 13, 255);
      ellipse (40, 310, 90, 360);

      //ground

      fill (147, 92, 163);
      rect (200, 370, 400, 80);
    } else {

      //night sky

      background (53 - mouseY/4, 71 - mouseY/4, 140 - mouseY/4);

      //ground

      fill (255);
      rect (200, 370, 400, 80);

      //moon

      ellipse (20, 20, 80, 80);
      fill (53 - mouseY/4, 71 - mouseY/4, 140 - mouseY/4);
      ellipse (50, 30, 90, 65);

      //stars

      fill (255, 255, 255, random(50, 200));
      ellipse (100, -2, 140, 40);
      ellipse (110, 10, 130, 30);
      fill (255, 255, 255, random(50, 200));
      ellipse (150, 70, 200, 120);
      ellipse (163, 80, 190, 110);
      fill (255, 255, 255, random(50, 200));
      ellipse (210, 140, 245, 180);
      ellipse (220, 150, 240, 170);
      fill (255, 255, 255, random(50, 200));
      ellipse (240, 20, 280, 70);
      ellipse (250, 30, 270, 60);
      fill (255, 255, 255, random(50, 200));
      ellipse (290, 90, 330, 127);
      ellipse (300, 97, 320, 120);
      fill (255, 255, 255, random(50, 200));
      ellipse (350, 50, 390, 85);
      ellipse (362, 57, 383, 82);
      fill (255, 255, 255, 255);
      quad(120, 12, 117, 20, 120, 24, 123, 20);
      quad(180, 83, 178, 97, 180, 102, 184, 97);
      quad(231, 157, 229, 160, 231, 164, 233, 160);
      quad(260, 40, 252, 49, 260, 57, 262, 49);
      quad(311, 100, 308, 110, 311, 118, 318, 110);
      quad(378, 60, 370, 70, 378, 79, 380, 70);
    }

  //this draws the character base

  //head and neck

  fill (185, 136, 101);
  rect (277, 200, 8, 18);
  fill (192, 161, 131);
  ellipse (247, 140, 303, 198);
  ellipse (238, 160, 255, 182);
  ellipse (295, 160, 312, 182);

  fill (190, 66, 72, 180);
  ellipse (250, 167, 270, 187);
  ellipse (280, 167, 300, 187);

  //body

  fill (192, 161, 131);
  triangle (277, 204, 277, 213, 243, 213);
  triangle (277, 204, 277, 213, 315, 213);
  quad (255, 213, 248, 300, 310, 300, 302, 213);

  quad (243, 213, 209, 280, 218, 286, 260, 213);
  quad (315, 213, 343, 280, 333, 286, 295, 213);

  quad (248, 300, 240, 360, 260, 365, 270, 300);
  quad (290, 300, 300, 365, 320, 360, 310, 300);

  fill (0);
  quad (254, 220, 252, 250, 306, 250, 302, 220);
  quad (249, 280, 248, 300, 310, 300, 309, 280);

  //this draws the options box

  fill (0, 0, 0, 150);
  rect (50, 240, 60, 180);

  fill (255, 13, 255);
  triangle (40, 170, 40, 190, 60, 180);
  fill (218, 114, 126);
  triangle (40, 200, 40, 220, 60, 210);
  fill (189, 242, 93);
  triangle (40, 230, 40, 250, 60, 240);
  fill (41, 217, 194);
  triangle (40, 260, 40, 280, 60, 270);
  fill (155, 102, 220);
  triangle (40, 290, 40, 310, 60, 300);

  drawEyes();
  drawHair();
  drawMouth();
  drawClothes();
  drawExtra();
  
}

//draw clothes

void drawClothes() {
  
  if (clothesStyles == 1) {
    
    fill (255);
    rect (277, 204, 8, 8);
    triangle (277, 204, 277, 213, 243, 213);
    triangle (277, 204, 277, 213, 315, 213);
    quad (255, 213, 248, 300, 310, 300, 302, 213);
    quad (243, 213, 229, 240, 243, 243, 260, 213);
    quad (315, 213, 326, 240, 311, 243, 295, 213);
    
    fill (0);
    rect (265, 212, 8, 12);
    rect (290, 212, 8, 12);
    quad (255, 217, 240, 310, 318, 310, 302, 217);
    
    quad (245, 320, 240, 360, 260, 365, 268, 320);
    quad (291, 320, 300, 365, 320, 360, 314, 320);
    
    fill (255);
    quad (241, 350, 240, 360, 260, 365, 263, 350);
    quad (297, 350, 300, 365, 320, 360, 318, 350);
    
  } else if (clothesStyles == 2){

    fill (0);
    triangle (277, 204, 277, 213, 243, 213);
    triangle (277, 204, 277, 213, 315, 213);
    quad (255, 213, 248, 300, 310, 300, 302, 213);
    quad (243, 213, 229, 240, 243, 243, 260, 213);
    quad (315, 213, 326, 240, 311, 243, 295, 213);
    
    fill (185, 136, 101);
    rect (277, 200, 8, 8);
    triangle (273, 204, 281, 204, 277, 215);
    
    fill (23, 46, 120);
    quad (248, 300, 240, 360, 260, 365, 270, 300);
    quad (290, 300, 300, 365, 320, 360, 310, 300);
    quad (249, 280, 248, 300, 310, 300, 309, 280);
    
    fill (0);
    quad (241, 350, 240, 360, 260, 365, 263, 350);
    quad (297, 350, 300, 365, 320, 360, 318, 350);
    
    fill (255);
    ellipse (270, 230, 290, 250);
    rect (280, 250, 10, 10);
    
    fill (0);
    ellipse (273, 235, 277, 240);
    ellipse (283, 235, 287, 240);
    triangle (280, 240, 283, 245, 277, 245);
    
  } else if (clothesStyles == 3){
    
    fill (0);
    quad (249, 280, 237, 320, 320, 320, 309, 280);
    
    fill (255, 131, 226);
    triangle (277, 204, 277, 213, 243, 213);
    triangle (277, 204, 277, 213, 315, 213);
    quad (255, 213, 245, 295, 314, 295, 302, 213);

    quad (243, 213, 214, 270, 224, 276, 260, 213);
    quad (315, 213, 339, 270, 327, 275, 295, 213);

    fill (0);
    triangle (271, 204, 277, 204, 274, 212);
    triangle (277, 204, 283, 204, 280, 212);
    
    fill (0);
    quad (241, 350, 240, 360, 260, 365, 263, 350);
    quad (297, 350, 300, 365, 320, 360, 318, 350);
    
    ellipse (260, 220, 280, 240);
    ellipse (275, 220, 295, 240);
    triangle (260, 230, 295, 230, 278, 270); 
  
  }
}

//draw hair

void drawHair() {
  if (hairStyle == 1) {
    fill (0);
    rect (275, 150, 65, 20);
    triangle (303, 145, 247, 145, 247, 170);
    triangle (307, 145, 280, 145, 307, 190);
    quad (235, 160, 255, 160, 260, 250, 230, 230);
    quad (293, 157, 312, 157, 318, 230, 290, 250);
  } else if (hairStyle == 2) {
    fill (255, 167, 180);
    rect (275, 145, 56, 10);

    fill(204, 16, 115); 
    quad (234, 155, 252, 155, 243, 200, 220, 200);
    quad (243, 200, 220, 200, 225, 245, 255, 245);
    quad (225, 245, 255, 245, 255, 290, 225, 290);
    quad (300, 155, 317, 150, 340, 200, 315, 200);
    quad (340, 200, 315, 200, 305, 245, 335, 245);
    quad (305, 245, 335, 245, 340, 290, 305, 290);
    triangle (220, 200, 223, 210, 213, 215);
    triangle (338, 198, 315, 207, 350, 215);

    fill (255, 97, 180);
    ellipse (230, 130, 260, 160);
    ellipse (290, 130, 320, 160);

    fill (255, 167, 180);
    quad (258, 150, 265, 150, 260, 160, 250, 160);
    quad (265, 150, 285, 150, 275, 160, 263, 160);
    quad (280, 150, 290, 150, 300, 160, 285, 160);
  } else if (hairStyle == 3) {
    fill (0, 138, 207);
    ellipse (230, 130, 295, 170);
    ellipse (290, 140, 320, 170);
    quad (230, 150, 275, 150, 275, 210, 230, 210);
    quad (275, 210, 230, 210, 245, 250, 290, 230);
    quad (290, 230, 245, 230, 240, 245, 290, 245);
    quad (305, 155, 320, 155, 340, 245, 300, 250);

    fill (192, 161, 131);
    ellipse (295, 160, 312, 182);

    fill (190, 66, 72, 180);
    ellipse (280, 167, 300, 187);
  } else if (hairStyle == 4) {
    fill (210, 132, 17);
    ellipse (290, 120, 320, 150);
    quad (295, 145, 315, 130, 360, 200, 315, 230);
    quad (360, 200, 315, 230, 310, 320, 365, 250);

    fill (242, 205, 117);
    quad (300, 130, 260, 140, 247, 155, 285, 150);
    triangle (299, 129, 285, 150, 310, 160);
    quad (247, 155, 250, 150, 250, 225, 245, 215);
    quad (310, 160, 293, 150, 293, 260, 320, 220);
    triangle (293, 150, 285, 143, 270, 160);
    triangle (285, 143, 250, 150, 250, 170);
  }
}

//draw eyes

void drawEyes() {
  if (eyeType == 1) {
    fill (255);
    ellipse (263, 160, 271, 170);
    ellipse (279, 160, 287, 170);
  } else if (eyeType == 2) {
    fill (0);
    triangle (260, 160, 265, 162, 264, 158);
    triangle (290, 160, 280, 162, 288, 158);
    fill (255);
    ellipse (263, 160, 271, 170);
    ellipse (279, 160, 287, 170);
  } else if (eyeType == 3) {
    fill (0);
    rect (263, 165, 20, 15);
    rect (288, 165, 20, 15);
    rect (283, 165, 20, 4);
  } else if (eyeType == 4) {
    fill (0);
    ellipse (255, 155, 275, 175);
    ellipse (276, 155, 296, 175);
  } else if (eyeType == 5) {
    fill (0);
    ellipse (255, 155, 275, 175);
    ellipse (276, 155, 296, 175);
    fill (255);
    quad (265, 155, 255, 165, 265, 175, 275, 165);
    quad (286, 155, 276, 165, 286, 175, 296, 165);
  } else if (eyeType == 6) {
    fill(0);
    ellipse (255, 155, 275, 175);
    ellipse (276, 155, 296, 175);
    fill(255);
    ellipse (257, 157, 267, 170); 
    ellipse (263, 157, 273, 170);
    triangle(257, 163, 273, 163, 265, 175);
    ellipse (278, 157, 289, 170); 
    ellipse (284, 157, 294, 170);
    triangle(278, 163, 294, 163, 286, 175);
  }
}

//draw mouth 

void drawMouth() {
  if (mouthType == 1) {

    fill (255, 0, 0);
    triangle (265, 180, 285, 180, 275, 190);
  } else if (mouthType == 2) {

    fill (255, 0, 0);
    triangle (265, 190, 285, 190, 275, 180);
  } else if (mouthType == 3) {

    fill (255, 0, 0);
    ellipse (273, 175, 280, 195);
  } else if (mouthType == 4) {

    fill (255, 0, 0);
    rect (275, 185, 20, 10);
  } else if (mouthType == 5) {

    fill (255, 0, 0);
    ellipse (265, 180, 285, 190);
  }
}

//draw other stuff

void  drawExtra() {
  if (extraStuff == 1) {

    fill (151, 104, 209);
    ellipse (255, 138, 263, 146);
    ellipse (249, 142, 258, 150);
    ellipse (251, 148, 258, 156);
    ellipse (256, 148, 266, 156);
    ellipse (259, 142, 269, 150);
  } else if (extraStuff == 2) {    

    fill (255);
    quad (280, 160, 280, 170, 295, 190, 295, 180);
    quad (280, 190, 280, 180, 295, 160, 295, 170);
  } else if (extraStuff == 3) {

    fill (255, 0, 0);
    triangle (260, 145, 255, 140, 253, 150);
    triangle (290, 145, 295, 140, 297, 150);
  }
}

void mousePressed () {

  //eyes

  if (mouseX >= 40 && mouseX <= 60 && mouseY >= 170 && mouseY <= 190) {
    if (eyeType == 1) {
      println("Change her eyes!");
    }
    eyeType = eyeType+1;
    if (eyeType == 7) {
      eyeType = 1;
    }
  }

  //hair
  
  if (mouseX >= 40 && mouseX <= 60 && mouseY >=200 && mouseY <= 220) {
    if (hairStyle == 1) {
      println("Style her hair!");
    }
    hairStyle = hairStyle+1;
    if (hairStyle == 5) {
      hairStyle = 1;
    }
  }
  if (mouseX >= 40 && mouseX <= 60 && mouseY >= 230 && mouseY <=250) {
    if (mouthType == 1) {
      println("Make her smile!");
    }
    mouthType = mouthType+1;
    if (mouthType == 7) {
      mouthType = 1;
    }
  }
  if (mouseX >= 40 && mouseX <= 60 && mouseY >= 260 && mouseY <=280) {
    if (clothesStyles == 1) {
      println("Dress her up!");
    }
    clothesStyles = clothesStyles+1;
    if (clothesStyles == 4) {
      clothesStyles = 1;
    }
  }
  if (mouseX >= 40 && mouseX <= 60 && mouseY >= 290 && mouseY <=310) {
    if (extraStuff == 1) {
      println("Give her some personality!");
    }
    extraStuff = extraStuff+1;
    if (extraStuff == 5) {
      extraStuff = 1;
    }
  }
}