Your browser does not support the canvas tag.

previous        Show / Hide Source        Download        next
//Liam Peixoto
/*This processing sketch is that of a somewhat active volcano. Smoke bellows from the 
top and small, bright embers float across the screen. Objects move with the mouse to give
the feel of perspective, and when the mouse is clicked, it will turn to daytime for a 
brief moment
*/

void setup()
{
  size(400, 400);
}

void draw()
{
  background(#2c334f);

  //Creating the tiny moon in the top left
  ///////////////////////////////////////////////
  ellipseMode(CENTER);
  rectMode(CENTER);
  fill(175, 175, 175, 140);
  ellipse(50, 40, 25, 25);
  fill(255, 255, 255, 15);
  ellipse(50, 40, 45, 45);
  //////////////////////////////////////////////

  //Clouds added here
  ////////////////////////////////////////////////
  fill(255, 255, 255, 25);
  noStroke();
  ellipse(200+(-mouseX/150), 75+(2*(sin(radians(frameCount)))), 100, 27);
  ellipse(100+(-mouseX/150), 60+(2*(sin(radians(frameCount)))), 100, 25);
  ellipse(25+(-mouseX/150), 100+(2*(sin(radians(frameCount)))), 100, 20);
  ellipse(300+(-mouseX/150), 25+(2*(sin(radians(frameCount)))), 100, 25);
  ellipse(395+(-mouseX/150), 65+(2*(sin(radians(frameCount)))), 100, 20);
  ///////////////////////////////////////////////

  //Creating dark background mountains
  /////////////////////////////////////
  fill(#0f142b);
  noStroke();
  triangle(-100+(mouseX/80), 500, 50+(mouseX/80), 200, 200+(mouseX/80), 500);
  triangle(300+(mouseX/80), 500, 400+(mouseX/80), 300, 500+(mouseX/80), 500);
  triangle(350+(mouseX/80), 400, 350+(mouseX/80), 275, 400+(mouseX/80), 400);
  rect(335+(mouseX/80), 325, 30, 100);
  triangle(320+(mouseX/80), 400, 320+(mouseX/80), 275, 280+(mouseX/80), 400);
  triangle(320+(mouseX/80), 275, 330+(mouseX/80), 245, 340+(mouseX/80), 275);
  /////////////////////////////////////

  //Creating smoke pillar
  ////////////////////////////////
  fill(65, 65, 65, 150);
  ellipse((200+(9*(sin(radians(frameCount)))))+(mouseX/25), 100, 50, 35);
  ellipse((210+(9*(sin(radians(frameCount-5)))))+(mouseX/25), 85, 60, 45);
  ellipse((220+(9*(sin(radians(frameCount-10)))))+(mouseX/25), 70, 70, 55);
  ellipse((230+(9*(sin(radians(frameCount-15)))))+(mouseX/25), 55, 80, 65);
  ellipse((240+(9*(sin(radians(frameCount-20)))))+(mouseX/25), 40, 90, 65);
  ellipse((250+(9*(sin(radians(frameCount-25)))))+(mouseX/25), 25, 90, 65);
  ellipse((260+(9*(sin(radians(frameCount-30)))))+(mouseX/25), 10, 90, 65);
  ///////////////////////////////

  /*Creating main volcano. Main points are the taller peaks while mini points
   the shorter peaks. Both types form the spiked flat area on top of the
   volcano. The small peak is the little mountain jutting out of the side 
   of the volcano*/

  fill(#160c0b);
  triangle(-50+(mouseX/25), 350, 65+(mouseX/25), 300, 150+(mouseX/25), 400); //small peak
  triangle(60+(mouseX/25), 400, 170+(mouseX/25), 100, 270+(mouseX/25), 400); //Main
  triangle(90+(mouseX/25), 400, 190+(mouseX/25), 100, 270+(mouseX/25), 400); //Main
  triangle(110+(mouseX/25), 400, 210+(mouseX/25), 100, 290+(mouseX/25), 400); //Main
  triangle(130+(mouseX/25), 400, 230+(mouseX/25), 100, 340+(mouseX/25), 400); //Main
  triangle(80+(mouseX/25), 400, 180+(mouseX/25), 105, 280+(mouseX/25), 400); //Mini point 1
  triangle(100+(mouseX/25), 400, 200+(mouseX/25), 105, 300+(mouseX/25), 400); //Mini point 2
  triangle(120+(mouseX/25), 400, 220+(mouseX/25), 105, 320+(mouseX/25), 400); //Mini point 3

  //Floating embers. These float around the screen slowly and have a lighting effect
  stroke(#f9aa68);
  fill(#ff9138);
  ellipse(5+(frameCount/4), 200+(50*(sin(radians(frameCount)))), 3, 3);
  fill(#ffd6b5, 35);
  noStroke();
  ellipse(5+(frameCount/4), 200+(50*(sin(radians(frameCount)))), 15, 15);
  stroke(#f9aa68);
  fill(#ff9138);
  ellipse(-50+(frameCount/4), 50+(50*(sin(radians(frameCount-100)))), 3, 3);
  fill(#ffd6b5, 35);
  noStroke();
  ellipse(-50+(frameCount/4), 50+(50*(sin(radians(frameCount-100)))), 15, 15);
  stroke(#f9aa68);
  fill(#ff9138);
  ellipse(50+(frameCount/4), 150+(30*(sin(radians(frameCount/2)))), 3, 3);
  fill(#ffd6b5, 35);
  noStroke();
  ellipse(50+(frameCount/4), 150+(30*(sin(radians(frameCount/2)))), 15, 15);
  stroke(#f9aa68);
  fill(#ff9138);
  ellipse(165+(frameCount/4), -50+(150*(sin(0.5*radians(frameCount/2)))), 3, 3);
  fill(#ffd6b5, 35);
  noStroke();
  ellipse(165+(frameCount/4), -50+(150*(sin(0.5*radians(frameCount/2)))), 15, 15);
  fill(#ff9138);
  stroke(#f9aa68);
  ellipse(75+(frameCount/4), 275+(45*(sin(0.5*radians(frameCount/2)))), 3, 3);
  fill(#ffd6b5, 35);
  noStroke();
  ellipse(75+(frameCount/4), 275+(45*(sin(0.5*radians(frameCount/2)))), 15, 15);
  fill(#ff9138);
  stroke(#f9aa68);
  ellipse(300+(frameCount/4), 275+(65*(sin(0.75*radians(frameCount/2-50)))), 3, 3);
  fill(#ffd6b5, 35);
  noStroke();
  ellipse(300+(frameCount/4), 275+(65*(sin(0.75*radians(frameCount/2-50)))), 15, 15);
  fill(#ff9138);
  stroke(#f9aa68);
  ellipse(245+(frameCount/5), 200+(30*(sin(0.95*radians(frameCount-5)))), 3, 3);
  fill(#ffd6b5, 35);
  noStroke();
  ellipse(245+(frameCount/5), 200+(30*(sin(0.95*radians(frameCount-5)))), 15, 15);


  /* Standing lava. This is the lava that has collected at
   the base of the volcano*/

  noStroke();
  fill(#f75129);
  ellipse(-25+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60); //All ellipses form the humps of lava
  ellipse(25+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60);
  ellipse(75+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60);
  ellipse(125+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60);
  ellipse(175+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60);
  ellipse(225+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60);
  ellipse(275+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60);
  ellipse(325+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60);
  ellipse(375+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60);
  ellipse(425+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60);

  //Black foreground
  fill(#040404);
  rect(200, 387, 400, 40);
  triangle(350+(mouseX/15), 400, 425+(mouseX/15), 200, 500+(mouseX/15), 400); //These two shapes form the black foreground
}

void mousePressed() //This entire block of code changes the color of the sky and some of the mountains
{                   //Entire code was copied to prevent the background from overlaying everything else
  background(#ffb951);

  //Creating the tiny moon in the top left
  ///////////////////////////////////////////////
  ellipseMode(CENTER);
  rectMode(CENTER);
  fill(#ffde72);
  ellipse(50, 40, 25, 25);
  fill(255, 255, 255, 15);
  ellipse(50, 40, 45, 45);
  //////////////////////////////////////////////

  //Clouds added here
  ////////////////////////////////////////////////
  fill(255, 255, 255, 100);
  noStroke();
  ellipse(200+(-mouseX/150), 75+(2*(sin(radians(frameCount)))), 100, 27);
  ellipse(100+(-mouseX/150), 60+(2*(sin(radians(frameCount)))), 100, 25);
  ellipse(25+(-mouseX/150), 100+(2*(sin(radians(frameCount)))), 100, 20);
  ellipse(300+(-mouseX/150), 25+(2*(sin(radians(frameCount)))), 100, 25);
  ellipse(395+(-mouseX/150), 65+(2*(sin(radians(frameCount)))), 100, 20);
  ///////////////////////////////////////////////

  //Creating dark background mountains
  /////////////////////////////////////
  fill(#ad6e11);
  noStroke();
  triangle(-100+(mouseX/80), 500, 50+(mouseX/80), 200, 200+(mouseX/80), 500);
  triangle(300+(mouseX/80), 500, 400+(mouseX/80), 300, 500+(mouseX/80), 500);
  triangle(350+(mouseX/80), 400, 350+(mouseX/80), 275, 400+(mouseX/80), 400);
  rect(335+(mouseX/80), 325, 30, 100);
  triangle(320+(mouseX/80), 400, 320+(mouseX/80), 275, 280+(mouseX/80), 400);
  triangle(320+(mouseX/80), 275, 330+(mouseX/80), 245, 340+(mouseX/80), 275);
  /////////////////////////////////////

  //Creating smoke pillar
  ////////////////////////////////
  fill(65, 65, 65, 150);
  ellipse((200+(9*(sin(radians(frameCount)))))+(mouseX/25), 100, 50, 35);
  ellipse((210+(9*(sin(radians(frameCount-5)))))+(mouseX/25), 85, 60, 45);
  ellipse((220+(9*(sin(radians(frameCount-10)))))+(mouseX/25), 70, 70, 55);
  ellipse((230+(9*(sin(radians(frameCount-15)))))+(mouseX/25), 55, 80, 65);
  ellipse((240+(9*(sin(radians(frameCount-20)))))+(mouseX/25), 40, 90, 65);
  ellipse((250+(9*(sin(radians(frameCount-25)))))+(mouseX/25), 25, 90, 65);
  ellipse((260+(9*(sin(radians(frameCount-30)))))+(mouseX/25), 10, 90, 65);
  ///////////////////////////////

  /*Creating main volcano. Main points are the taller peaks while mini points
   the shorter peaks. Both types form the spiked flat area on top of the
   volcano. The small peak is the little mountain jutting out of the side 
   of the volcano*/

  fill(#634519);
  triangle(-50+(mouseX/25), 350, 65+(mouseX/25), 300, 150+(mouseX/25), 400); //small peak
  triangle(60+(mouseX/25), 400, 170+(mouseX/25), 100, 270+(mouseX/25), 400); //Main
  triangle(90+(mouseX/25), 400, 190+(mouseX/25), 100, 270+(mouseX/25), 400); //Main
  triangle(110+(mouseX/25), 400, 210+(mouseX/25), 100, 290+(mouseX/25), 400); //Main
  triangle(130+(mouseX/25), 400, 230+(mouseX/25), 100, 340+(mouseX/25), 400); //Main
  triangle(80+(mouseX/25), 400, 180+(mouseX/25), 105, 280+(mouseX/25), 400); //Mini point 1
  triangle(100+(mouseX/25), 400, 200+(mouseX/25), 105, 300+(mouseX/25), 400); //Mini point 2
  triangle(120+(mouseX/25), 400, 220+(mouseX/25), 105, 320+(mouseX/25), 400); //Mini point 3

  //Floating embers. These float around the screen slowly and have a lighting effect
  stroke(#f9aa68);
  fill(#ff9138);
  ellipse(5+(frameCount/4), 200+(50*(sin(radians(frameCount)))), 3, 3);
  fill(#ffd6b5, 35);
  noStroke();
  ellipse(5+(frameCount/4), 200+(50*(sin(radians(frameCount)))), 15, 15);
  stroke(#f9aa68);
  fill(#ff9138);
  ellipse(-50+(frameCount/4), 50+(50*(sin(radians(frameCount-100)))), 3, 3);
  fill(#ffd6b5, 35);
  noStroke();
  ellipse(-50+(frameCount/4), 50+(50*(sin(radians(frameCount-100)))), 15, 15);
  stroke(#f9aa68);
  fill(#ff9138);
  ellipse(50+(frameCount/4), 150+(30*(sin(radians(frameCount/2)))), 3, 3);
  fill(#ffd6b5, 35);
  noStroke();
  ellipse(50+(frameCount/4), 150+(30*(sin(radians(frameCount/2)))), 15, 15);
  stroke(#f9aa68);
  fill(#ff9138);
  ellipse(165+(frameCount/4), -50+(150*(sin(0.5*radians(frameCount/2)))), 3, 3);
  fill(#ffd6b5, 35);
  noStroke();
  ellipse(165+(frameCount/4), -50+(150*(sin(0.5*radians(frameCount/2)))), 15, 15);
  fill(#ff9138);
  stroke(#f9aa68);
  ellipse(75+(frameCount/4), 275+(45*(sin(0.5*radians(frameCount/2)))), 3, 3);
  fill(#ffd6b5, 35);
  noStroke();
  ellipse(75+(frameCount/4), 275+(45*(sin(0.5*radians(frameCount/2)))), 15, 15);
  fill(#ff9138);
  stroke(#f9aa68);
  ellipse(300+(frameCount/4), 275+(65*(sin(0.75*radians(frameCount/2-50)))), 3, 3);
  fill(#ffd6b5, 35);
  noStroke();
  ellipse(300+(frameCount/4), 275+(65*(sin(0.75*radians(frameCount/2-50)))), 15, 15);
  fill(#ff9138);
  stroke(#f9aa68);
  ellipse(245+(frameCount/5), 200+(30*(sin(0.95*radians(frameCount-5)))), 3, 3);
  fill(#ffd6b5, 35);
  noStroke();
  ellipse(245+(frameCount/5), 200+(30*(sin(0.95*radians(frameCount-5)))), 15, 15);


  /* Standing lava. This is the lava that has collected at
   the base of the volcano*/

  noStroke();
  fill(#f75129);
  ellipse(-25+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60); //All ellipses form the humps of lava
  ellipse(25+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60);
  ellipse(75+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60);
  ellipse(125+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60);
  ellipse(175+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60);
  ellipse(225+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60);
  ellipse(275+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60);
  ellipse(325+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60);
  ellipse(375+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60);
  ellipse(425+(mouseX/15), 375+(3*(sin(radians(frameCount)))), 70, 60);

  //Black foreground
  fill(#040404);
  rect(200, 387, 400, 40);
  triangle(350+(mouseX/15), 400, 425+(mouseX/15), 200, 500+(mouseX/15), 400); //These two shapes form the black foreground
}