Your browser does not support the canvas tag.

previous        Show / Hide Source        Download        next
////////////////////////////////////////////////
/////////Haoran Lu (Peter) in PO3///////////////
////////////////////////////////////////////////




void setup()
{
 size(400, 400);
 colorMode(RGB);
 rectMode(CORNER);
}






void draw()
{
  //set the framerate to 30, so the framerate doesn't stuck at 3 after mouse is pressed.
  frameRate(30);
  
  //set the background color; background color changes brighter when mouse moves right, changes darker when mouse moves left.
  background(mouseX/1.5);
  
  //----------------ghost--------------------------------
  //body of the ghost; move up when mouse moves left.
  fill(mouseX/3);
  triangle(0, mouseX+300, 60,  mouseX+140, 120,  mouseX+300);
  
  //head of the ghost; move up when mouse moves left.
  ellipse(60, mouseX+170, 100, 100);


  //left eye of the ghost; move up when mouse moves left.
  fill(#A00A02);
  ellipse(40, mouseX+160, 30, 30);
  
  //right eye of the ghost; move up when mouse moves left.
  ellipse(80, mouseX+160, 30, 30);
  
  //eye balls of the ghost, staring at the candle
  fill(mouseX/3);
  ellipse((40+(mouseX/20)), (mouseX+170), 20, 20); 
  ellipse((80+(mouseX/20)), (mouseX+170), 20, 20); 
  //-----------------ghost-------------------------------------
  
  
  
  
  
  
  
  //----------------Devil's eyes(when mouse is not pressed)------------------------------
  //Eyes' color becomes whiter when mouse moves right, darker when mouse moves left 
  fill(((mouseX+120)-255)/1.2,((mouseX+120)-255)/1.2,((mouseX+120)-255)/1.2);
  noStroke();
  //draw devil's eyes; opens up when mouse moves left, closes up when mouse moves right
  triangle(70, 90+mouseX/25, 80, 120-mouseX/25, 160, 110);
  triangle(240, 110, 330, 90+mouseX/25, 320, 120-mouseX/25);
  //----------------Devil's eyes(when mouse is not pressed)------------------------------








  //-------------------------table----------------------------------------------
  //table's color changes darker when mouse moves left.
  fill(0+mouseX/2, 102+mouseX/2, 119+mouseX/2);
  //draw the table.
  rect(0,300, 400, 100);
  //-------------------------table----------------------------------------------
  
  
  
  
  
  
  
  //---------------------------------------------------------candle--------------------------------------------------------------------
  //shadow of the candle, moves along with the candle.
  fill(0);
  quad(4*sin(frameCount)+(mouseX-30)+(mouseX/2), 400, mouseX-20, 330, mouseX+20, 330, 4*sin(frameCount)+(mouseX+30)+(mouseX/1.5), 400);
  
  //remove the stroke
  noStroke();
  
  //bottom candle ellipse part, least bright; moves with the mouse
  fill(#D6D132);
  ellipse(mouseX, 330, 40, 20);
  
  //bottom candle rectangle part, least bright; moves with the mouse
  rect(mouseX-20, 310, 40, 20);
  
  //middle candle ellipse part, 3rd bright; moves with the mouse
  fill(#FAF442);
  ellipse(mouseX, 310, 40, 20);
  
  //middle candle rectangle part, 3rd bright; moves with the mouse
  rect(mouseX-20, 300, 40, 10);
  
  //top candle ellipse part, 2nd bright; moves with the mouse
  fill(#FFFDCB);
  ellipse(mouseX, 300, 40, 20);
  
  //top candle rectangle part, 2nd bright; moves with the mouse
  rect(mouseX-20, 290, 40, 10);
  
  //top candle part, most bright; moves with the mouse
  fill(#FFFEED);
  ellipse(mouseX, 290, 40, 20);
  
  //outer flame; moves with the candle
  fill(#FF2705);
  ellipse((2*sin(frameCount)+mouseX), 270, 20, 2*(sin(frameCount))+40);
  
  //inner flame; moves with the candle
  fill(#FFCE05);
  ellipse((2*sin(frameCount)+mouseX), 280, 10, 2*(cos(frameCount)+10));
  
  //inner light; moves with the candle
  fill(255, 255, 255, 30);
  ellipse((2*sin(frameCount)+mouseX), 270, 2*(sin(frameCount)+60), 2*(sin(frameCount)+60));
  
  //outer light; moves with the candle
  fill(255, 255, 255, 10);
  ellipse((2*sin(frameCount)+mouseX), 270, 2*(sin(frameCount)+80), 2*(sin(frameCount)+80));
}
//---------------------------------------------------------candle--------------------------------------------------------------------



void mousePressed()
{
  //when mouse is pressed, print line !!!!!!!!!!!.
  println("!!!!!!!!!!!!");
  //Set the frameRate to 3, so it's easier to see, and then draw a devil's face.
  frameRate(3);
  //reset the background color to black
  background(20);
  //set the color of the eyes to red
  fill(255, 0, 0);
  noStroke();
  //draw devil's eyes
  triangle(70, 90, 80, 120, 160, 110);
  triangle(240, 110, 330, 90, 320, 120);
  
  
  //set the teeth's color to white
  fill(255);
  //draw the teeth
  triangle(140, 190, 160, 190, 150, 220);
  triangle(170, 190, 190, 190, 180, 220);
  triangle(210, 190, 230, 190, 220, 220);
  triangle(240, 190, 260, 190, 250, 220);
  triangle(160, 240, 170, 210, 180, 240);
  triangle(190, 240, 200, 210, 210, 240);
  triangle(220, 240, 230, 210, 240, 240);
  //set the clawn's color to yellow
  fill(255, 255, 0);
  //draw the clawns
  quad(70, 210, 130, 230, 330, 340, 110, 250);
  quad(10, 210, 70, 240, 350, 390, 50, 260);
  quad(10, 270, 60, 290, 230, 390, 40, 310);
}