/*///////////////////////////////////////////////////
** Bat Signal by Cheyenne Amil
** an interactive drawing in 96 shapes

/*//////////////////////////////////////////////////

void setup (){
    // set up Canvas Size
    size(400,400);
    //Select the modes in how i will draw ellipses and rectangles (x,y,w,h)
    ellipseMode(CORNER);
    rectMode(CORNER);
}

void draw (){
   // Dark blue background
   background (33,36,67);
   
   //**Drawing the cloudy sky above using 23 dull blue ellipses
   
   //Darker base of the cloud made up of 12 ellipses
   fill(49,88,129);
   //no outlines for all shapes
   noStroke();
   ellipse(5,45,40,40);
   ellipse(35,45,50,50);
   ellipse(65,40,60,65);
   ellipse(90,45,70,75);
   ellipse(120,45,70,75);
   ellipse(160,50,70,65);
   ellipse(200,50,65,60);
   ellipse(235,45,70,70);
   ellipse(260,40,65,65);
   ellipse(280,45,60,65);
   ellipse(320,40,60,60);
   ellipse(350,40,50,40);
   
   
   //Bulk of the cloud made of 1 ellipse
   fill(58,98,154);    
   ellipse(5,20,400,70);
   
   //Top of the cloud made up of 10 ellipses
   fill(58,98,154);
   ellipse(0,20,50,50);
   ellipse(10,5,40,40);
   ellipse(30,0,65,60); 
   ellipse(90,-20,80,80);
   ellipse(160,-20,100,110);
   ellipse(245,0,55,40);
   ellipse(295,5,40,30);
   ellipse(330,10,30,30);
   ellipse(350,5,40,40);
   ellipse(380,30,30,30);
   
  
   //**These are the buildings in the background of different shades and layers as to add depth to a city scape. 10 shapes
    
   fill(108,85,113);
   rect(0,180,60,220); 
   
   fill(96,75,100);
   rect(80,220,60,80);
   
   fill(96,75,100);
   rect(170,140,80,260);
   
   fill(124,93,131);
   rect(120,190,70,210);
   
   fill(81,61,85);
   rect(270,120,70,280);
   
   //this one is pointy
   fill(106,88,121);
   rect(330,180,60,220);
   triangle(330,180,390,180,360,140);
   
   fill(124,93,131);
   rect(280,200,60,200);
   
   
   fill(147,124,152);
   rect(220,300,90,100);
   
   fill(153,115,162);
   rect(370,280,30,120);
  
  
   //**Drawing windows with lights on on some of the buildings
     

   if(mousePressed){
     //the city lights Dim when the BatSignal is Active
     fill(50,50,50,200-mouseY/2);
     rect(0,0,400,400);
     
     //Windows hint at the joker
     fill(32,36,32,200);
     rect(230,315,10,15);
     rect(290,315,10,15);
     fill(247,10,26,150);
     rect(230,350,10,15);
     rect(290,350,10,15);
     rect(230,385,10,15);
     rect(260,385,10,15);
     rect(290,385,10,15);
     
     //turns the buildings windows green to make the city joker themed 
     fill(55,134,54,150);
     
     
     //Prints a line of text
     println("nananananananana");
     println("HAHAHAHAHAHA");

 }
   else{
       //otherwise theyre yellow
       fill(230,230,56,150);
       rect(230,315,10,15);
       rect(290,315,10,15);
       rect(230,350,10,15);
       rect(290,350,10,15);
       rect(230,385,10,15);
       rect(260,385,10,15);
       rect(290,385,10,15);
     }
        
    //building on the far left, windows        
    rect(10,190,10,15);
    rect(40,190,10,15);
    rect(10,215,10,15);
    rect(40,215,10,15);
    rect(10,240,10,15);
    rect(40,240,10,15);
    
    //2nd building from the left, windows
    rect(135,200,10,15);
    rect(165,200,10,15);
    rect(135,235,10,15);
    rect(165,235,10,15);
    rect(135,270,10,15);
    rect(165,270,10,15);
    rect(135,305,10,15);
    rect(165,305,10,15);
    rect(135,340,10,15);
    rect(165,340,10,15);
    rect(135,375,10,15);
    rect(165,375,10,15);  
  
    //3rd set of windows
    rect(290,210,10,15);
    rect(320,210,10,15);
    rect(290,245,10,15);
    rect(320,245,10,15);
    rect(290,280,10,15);
    rect(320,280,10,15);
    rect(320,315,10,15);
    rect(320,350,10,15);
    rect(320,385,10,15);
    
    //front most building in background
    rect(260,315,10,15);
    rect(260,350,10,15);
  
  
   //Draw the bat signal light beam relative to the position of the mouse
   if (mousePressed){

     //the Beam of light and the logo ellipse
     fill(255,255,0,150);
     ellipse(mouseX-50,mouseY-25,100,50);
     triangle(mouseX-50,mouseY,mouseX+50,mouseY,100,250);
   
     //Body of bat in the bat signal
     fill(28,27,31);
     triangle(mouseX-15,mouseY-10,mouseX-5,mouseY-10,mouseX-10,mouseY-20);
     triangle(mouseX+15,mouseY-10,mouseX+4,mouseY-10,mouseX+10,mouseY-20);
     triangle(mouseX-15,mouseY-10,mouseX+15,mouseY-10,mouseX,mouseY+25);
   
     //Wings of the bat in the bat signal
     triangle(mouseX-10,mouseY-10,mouseX-45,mouseY-10,mouseX-40,mouseY+15);
     triangle(mouseX,mouseY-10,mouseX-25,mouseY-5,mouseX-20,mouseY+15);
   
     triangle(mouseX+10,mouseY-10,mouseX+45,mouseY-10,mouseX+40,mouseY+15);
     triangle(mouseX,mouseY-10,mouseX+25,mouseY-5,mouseX+20,mouseY+15); 
   }
    
   
   //**Draw the building that the bat signal will be on
   
   //drawing the back of the building
   fill(101,66,116);
   rect(0,280,120,220);
    
   //Top of building
   fill(125,83,127);
   rect(0,250,160,30);
   fill(101,66,116);
   rect(0,250,160,5); // this is the ledge
   
   //right wall of building
   fill(88,58,103);
   rect(120,280,40,220);
   triangle(120,280,160,250,160,280);
   
   //Windows on Building with bat signal
   if(mousePressed){
   fill(245,250,8,200-mouseY/4);
   }
   else{
   fill(245,250,8,100);  
   }
   rect(50,320,50,60);
   fill(125,83,127);
   rect(50,370,50,10);
  
   
   
   
   
   //**Drawing the bat signal 
   
   
   //Drawing front of light
   fill(114,130,134);
   ellipse((mouseX/50)+75,(mouseY/50)+210,50,50);
   
   //triangles for the base
   fill(123,134,137);
   triangle(70,270,130,270,100,250);
   fill(111,121,124);
   triangle(100,250,130,270,138,265);
   
   //Drawing back of light
   fill(133,159,165);
   ellipse(80,220,40,40);
   
 

  
}