Your browser does not support the canvas tag.

previous        Show / Hide Source        Download        next
//Setting up my canvas, done once
void setup() {
  //size of canvas

  size (400, 400);
  //settings for rectangle drawing
  rectMode(CENTER);
}
//repeated constantly
void draw() {
  background(57, 31, 22);

  //background background trees
  fill(58, 42, 31, 200);
  rect(20-mouseX/50, 200, 40, 400);
  rect(200-mouseX/50, 200, 40, 400);
  rect(350-mouseX/50, 200, 20, 400);


  //background trees
  fill(72, 43, 33);
  rect(80-mouseX/30, 200, 50, 400);  
  rect(150-mouseX/30, 200, 80, 400);
  rect(300-mouseX/30, 200, 50, 400);
  rect(400-mouseX/30, 200, 25, 400);

  //the ground
  noStroke();
  fill(41, 10, 5);
  rect(200, 400, 400, 200);

  //fire

  fill(222-mouseX/5, 67-mouseX/5, 16-mouseX/5, 255-mouseX/10);
  triangle(200+mouseX/50+sin(frameCount*.2), mouseX/2+100, 170+sin(frameCount*.2), 300, 230, 300);

  fill(222, 123, 18);
  triangle(200+mouseX/50+sin(frameCount*.3), mouseX/3+150, 180+sin(frameCount*.2), 300, 220, 300);

  fill(222, 178, 20);
  triangle(200+mouseX/50+sin(frameCount*3.5), mouseX/3+170, 190+sin(frameCount*.2), 300, 210, 300);

  //logs in the back
  fill(124-mouseX/50, 85-mouseX/50, 54-mouseX/50);
  ellipse(175+mouseX/50, 295, 50, 50);
  ellipse(225+mouseX/50, 295, 50, 50);

  //logs in the front
  fill(90-mouseX/50, 51-mouseX/50, 36-mouseX/50);
  ellipse(150+mouseX/50, 300, 150, 40);

  ellipse(250+mouseX/50, 300, 150, 40);

  ellipse(200+mouseX/50, 300, 40, 50);

  //front tree drawing
  fill(90-mouseX/10, 51-mouseX/10, 36-mouseX/10);
  rect(10-mouseX/7, 200, 100, 400);

  //fireflies
  fill(255, 252, 157, 200);
  ellipse(-mouseX/1.5+400, -mouseY/1.5+400, 10, 10);
  fill(255, 252, 157, 100);
  ellipse(-mouseX/1.5+397, -mouseY/1.5+397+sin(frameCount*2), 8, 8);
  ellipse(-mouseX/1.5+403, -mouseY/1.5+397+sin(-frameCount*2), 8, 8);

  //firefly 2
  fill(255, 252, 157, 150);
  ellipse(-mouseX/0.9+410, -mouseY/0.9+410, 10, 10);
  fill(255, 252, 157, 100);
  ellipse(-mouseX/0.9+407, -mouseY/0.9+407+sin(frameCount*2), 8, 8);
  ellipse(-mouseX/0.9+413, -mouseY/0.9+407+sin(-frameCount*2), 8, 8);

  //firefly 3
  fill(255, 252, 157, 175);
  ellipse(-mouseX+420, -mouseY+400, 10, 10);
  fill(255, 252, 157, 100);
  ellipse(-mouseX+417, -mouseY+397+sin(-frameCount*2), 8, 8);
  ellipse(-mouseX+423, -mouseY+397+sin(frameCount*2), 8, 8);
}