//////////////////////////////////////////////////////////
/////////////////Lixingzi Gan (MiLu)//////////////////////////
/////////////////////////////////////////////////////////
///////////////////////////////////////////////////////



void setup() {
  size(400, 400);
  rectMode(CORNERS);
  ellipseMode(CENTER);
    
}


void draw() {
  
  frameRate(60);
  background(#5F94C6);
  noStroke();

  //SHADOW/BACK OF  SCREEN
  fill(#A49A99);
  rect(47, 105, 67, 105, 30);
  rect(67, 105, 323, 287, 30); 
  
 
 
  //outside SCREEN

  fill(#FFEC54);
  rect(67, 102, 323, 270);
    fill(#B566B1);
  rect(70, 105, 320, 267);

 
   //purple SCREEN
   fill(#8D49B1);
   rect(110, 120, 280, 235);
   
   //green screen
   fill(88, 176, 90);
   fill(88, 176, 90, 255-mouseY+50);
   rect(125, 125, 265, 230);
  
 
  //SMALLER CIRCLE BUTTONS
 
  fill(#FDFFFA);
  ellipse(95, 230, 20, 20); //left button
   fill(#E40200);
  ellipse(95, 230, 15, 15); //left button

  fill(#FDFFFA);
  ellipse(300, 230, 20, 20); // right button
   fill(#E40200);
  ellipse(300, 230, 15, 15); //left button
  
  fill(#FDFFFA);
  ellipse(250, 250, 15, 15); // midium button
  ellipse(268, 250, 15, 15); // right button
  ellipse(232, 250, 15, 15); // left button
  
  fill(#E40200);
  ellipse(250, 250, 13, 13); //shadow right button
  ellipse(268, 250, 13, 13); //shadow right button
  ellipse(232, 250, 13, 13); //shadow right button

}
  
 void mousePressed()
{
  
  frameRate(0.5);
  
  noStroke();
  //dots
  //right side
  fill(#4B9921);
  ellipse(225,130,7,7);
  ellipse(235,130,7,7);  
  ellipse(245,130,7,7);
  ellipse(255,130,7,7);

 //left side 
  ellipse(135,130,7,7);
  ellipse(145,130,7,7);
  ellipse(155,130,7,7);
  
  //tank
 rect(175, 180, 205, 200);
 rect(185, 165, 195, 180);
 
}