Your browser does not support the canvas tag.

previous        Show / Hide Source        Download        next
//Created by: Gavin Nelson
//Name of Creation:Not_so_typical_weather_balloon
//
//This is an interactive drawing that will allow the user to
//determine the weather in the scene and manipulate a hot air
//balloon and it floats over the sea. Pressing the mouse button
//will animate the cursor, simulating blowing wind. 



//Setting canvas and mode
void setup() {
  size(400, 400);
  rectMode(CENTER);
  frameRate(60); //Setting the rate drawing will move at
  noCursor();
}

  //animated parts of scene
void draw() {
  
  //Layer zero
  
  background(-mouseY*0.325, 115, 150+mouseY*0.325);
  noStroke();
  
  //small rain drops
  
  strokeWeight(1);
  stroke(0, 0, 255, 255-mouseY);
  line(30-mouseY*0.5+frameCount*2%400, frameCount*4%400 , 50-mouseY*0.5+frameCount*2%400, 30+(frameCount*4)%400);
  line(80-mouseY*0.5+frameCount*2%400, -70+frameCount*4%400 , 100-mouseY*0.5+frameCount*2%400, -40+(frameCount*4)%400);
  line(180-mouseY*0.5+frameCount*2%400, 30+frameCount*4%400 , 200-mouseY*0.5+frameCount*2%400, 60+(frameCount*4)%400);
  line(200-mouseY*0.5+frameCount*2%400, -100+frameCount*4%400 , 220-mouseY*0.5+frameCount*2%400 , -70+frameCount*4%400);
  line(-200-mouseY*0.5+frameCount*2%400, -60+frameCount*4%400 , -180-mouseY*0.5+frameCount*2%400 , -30+frameCount*4%400);
  line(-120+frameCount*2%800, -120+frameCount*4%800 , -100+frameCount*2%800, -90+(frameCount*4)%800);
  line(-100+frameCount*2%800, -200+frameCount*4%800 , -80+frameCount*2%800, -170+(frameCount*4)%800);
  line(60+frameCount*2%800, -250+frameCount*4%800 , 80+frameCount*2%800, -220+(frameCount*4)%800);
  line(-100+frameCount*2%800, -400+frameCount*4%800 , -80+frameCount*2%800, -370+(frameCount*4)%800);
  line(-100+frameCount*2%800, -350+frameCount*4%800 , -80+frameCount*2%800, -320+(frameCount*4)%800);
  
  //Sun
  
  fill(255, 255, 100, 125+mouseY*0.5);
  ellipse(400-mouseY*0.1, mouseY*0.05, 100+mouseY*0.1, 100+mouseY*0.1);
 
  //Small sun rays
  
  stroke(255, 255, 100, 100+mouseY*0.5);
  strokeWeight(2);
  line(335-mouseY*0.2, 10+mouseY*0.1, 345-mouseY*0.17, 10+mouseY*0.09);
  line(340-mouseY*0.12, 40+mouseY*0.17, 350-mouseY*0.12, 35+mouseY*0.14);
  line(380-mouseY*0.07, 70+mouseY*0.17, 385-mouseY*0.07, 60+mouseY*0.14);
  noStroke();
  
  //Hot air balloon 
    //Lantern ropes
  stroke(0);
  strokeWeight(1);
  line(180+(-50+mouseX*0.25), 150+(((mouseY*0.05)-17)*sin(frameCount*0.1)), 200+(-50+mouseX*0.25), 180+(((mouseY*0.05)-17)*sin(frameCount*0.1)));
  line(220+(-50+mouseX*0.25), 150+(((mouseY*0.05)-17)*sin(frameCount*0.1)), 200+(-50+mouseX*0.25), 180+(((mouseY*0.05)-17)*sin(frameCount*0.1)));
    //Balloon
  fill(255, 0, 0);
  ellipse(200+(-50+mouseX*0.25), 150+(((mouseY*0.05)-17)*sin(frameCount*0.1)), 40, 40);

  strokeWeight(2);
    //Ropes
  line(180+(-50+mouseX*0.25), 150+(((mouseY*0.05)-17)*sin(frameCount*0.1)), 190+(-50+mouseX*0.25), 190+(((mouseY*0.05)-17)*sin(frameCount*0.1)));//Rope left
  line(220+(-50+mouseX*0.25), 150+(((mouseY*0.05)-17)*sin(frameCount*0.1)), 210+(-50+mouseX*0.25), 190+(((mouseY*0.05)-17)*sin(frameCount*0.1)));//Rope right
    //Basket
  fill(110, 84, 56);//Brown
  stroke(90, 64, 36);//Darker Brown
  quad(190+(-50+mouseX*0.25), 190+(((mouseY*0.05)-17)*sin(frameCount*0.1)), 210+(-50+mouseX*0.25), 190+(((mouseY*0.05)-17)*sin(frameCount*0.1)), 208+(-50+mouseX*0.25), 202+(((mouseY*0.05)-17)*sin(frameCount*0.1)), 192+(-50+mouseX*0.25), 202+(((mouseY*0.05)-17)*sin(frameCount*0.1)));
    //Fire
  stroke(255, 120, 0);//Orange
  strokeWeight(2);
  line(200+(-50+mouseX*0.25), 180+(((mouseY*0.05)-17)*sin(frameCount*0.1)), 200+(-50+mouseX*0.25), 175+(((mouseY*0.05)-17)*sin(frameCount*0.1)));
    //Lantern
  noStroke();
  fill(200);//Grey
  rect(200+(-50+mouseX*0.25), 180+(((mouseY*0.05)-17)*sin(frameCount*0.1)), 6, 6);
  
  //cloud1

  fill(200, 200, 200);
  quad(355-mouseY*0.25, 0, 355-mouseY*0.25, 20, 0-mouseY*0.25, 63, 0-mouseY*0.25, 0);
  strokeWeight(1);
  stroke(80, 80, 90);
  arc(350-mouseY*0.25, 0, 50, 50, 0, HALF_PI);
  arc(280-mouseY*0.25, 20, 100, 75, 0, PI);
  arc(315-mouseY*0.25, 20, 75, 50, 0, HALF_PI);
  arc(230-mouseY*0.25, 20, 100, 75, 1, PI-QUARTER_PI);
  arc(200-mouseY*0.25, 20, 100, 75, 1, PI);
  arc(110-mouseY*0.25, 20, 100, 95, 0.75, 2.5);
  arc(150-mouseY*0.25, 20, 100, 75, 0.75, 2);
  arc(60-mouseY*0.25, 20, 100, 95, 0.75, 2.5);
  arc(25-mouseY*0.25, 20, 100, 95, 0.75, 2.5);

  //cloud 2
  
    fill(200, 200, 200);
    noStroke();
  quad(385-mouseY*0.7, 0, 385-mouseY*0.7, 40, 0-mouseY*0.7, 83, 0-mouseY*0.7, 0);
  strokeWeight(1);
  stroke(80, 80, 90);
  arc(375-mouseY*0.7, 20, 70, 70, -1.2, HALF_PI);
  arc(300-mouseY*0.7, 45, 90, 70, 0, 3);
  arc(345-mouseY*0.7, 40, 70, 70, 0, 2);
  arc(215-mouseY*0.7, 40, 110, 70, 0.6, 2);
  arc(255-mouseY*0.7, 40, 70, 70, 0.6, 2.2);
  arc(175-mouseY*0.7, 50, 70, 70, 0.3, 2.6);
  arc(70-mouseY*0.7, 50, 50, 100, 0.4, 2.7);
  arc(100-mouseY*0.7, 55, 110, 70, 0.2, 2);
  arc(10-mouseY*0.7, 60, 100, 100, 0.3, 3);

  //cloud 3

  fill(200, 200, 200);
  noStroke();
  quad(401-mouseY, 0, 401-mouseY, 75, 0-mouseY, 135, 0-mouseY, 0);
  strokeWeight(2);
  stroke(80, 80, 90);
  arc(400-mouseY*1.1, 0, 80, 150, 0, HALF_PI);
  arc(330-mouseY*1.1, 70, 100, 75, 0, 2.5);
  arc(365-mouseY*1.1, 70, 75, 50, 0, 2);
  arc(280-mouseY*1.1, 70, 100, 75, 1, PI-QUARTER_PI);
  arc(250-mouseY*1.1, 70, 100, 75, 1, 2.5);
  arc(160-mouseY*1.1, 70, 100, 95, 0.75, 2.5);
  arc(200-mouseY*1.1, 70, 100, 75, 0.75, 2);
  arc(110-mouseY*1.1, 75, 100, 95, 0.75, 2.5);
  arc(25-mouseY*1.1, 95, 100, 95, 0.75, 2.5);
  arc(75-mouseY*1.1, 90, 100, 95, 0.75, 2.5);
  


  
  //Wave 1
 
  noStroke();
  fill(50+mouseY*0.1, mouseY*0.2, 255);
  
  quad(-80+( 40+frameCount)%480 , 400, -80+( 40+frameCount)%480, 320+5*sin(frameCount*0.1), ( 40+frameCount)%480, 280+5*sin(frameCount*0.1), ( 40+frameCount)%480, 400);
      fill(-mouseY*0.325, 115, 150+mouseY*0.325);
      noStroke();
      ellipse((40+frameCount)%480, 300+5*sin(frameCount*0.1), 10, 40);
      fill(50+mouseY*0.1, mouseY*0.2, 255);
  quad(-80+(120+frameCount)%480 , 400, -80+(120+frameCount)%480, 320+5*sin(frameCount*0.1), (120+frameCount)%480, 280+5*sin(frameCount*0.1), (120+frameCount)%480, 400);
      fill(-mouseY*0.325, 115, 150+mouseY*0.325);
      noStroke();
      ellipse((120+frameCount)%480, 300+5*sin(frameCount*0.1), 10, 40);
      fill(50+mouseY*0.1, mouseY*0.2, 255);
  quad(-80+(200+frameCount)%480 , 400, -80+(200+frameCount)%480, 320+5*sin(frameCount*0.1), (200+frameCount)%480, 280+5*sin(frameCount*0.1), (200+frameCount)%480, 400);
      fill(-mouseY*0.325, 115, 150+mouseY*0.325);
      noStroke();
      ellipse((200+frameCount)%480, 300+5*sin(frameCount*0.1), 10, 40);
      fill(50+mouseY*0.1, mouseY*0.2, 255);
  quad(-80+(280+frameCount)%480 , 400, -80+(280+frameCount)%480, 320+5*sin(frameCount*0.1), (280+frameCount)%480, 280+5*sin(frameCount*0.1), (280+frameCount)%480, 400);
      fill(-mouseY*0.325, 115, 150+mouseY*0.325);
      noStroke();
      ellipse((280+frameCount)%480, 300+5*sin(frameCount*0.1), 10, 40);
      fill(50+mouseY*0.1, mouseY*0.2, 255);
  quad(-80+(360+frameCount)%480 , 400, -80+(360+frameCount)%480, 320+5*sin(frameCount*0.1), (360+frameCount)%480, 280+5*sin(frameCount*0.1), (360+frameCount)%480, 400);
      fill(-mouseY*0.325, 115, 150+mouseY*0.325);
      noStroke();
      ellipse((360+frameCount)%480, 300+5*sin(frameCount*0.1), 10, 40);
      fill(50+mouseY*0.1, mouseY*0.2, 255);
  quad(-80+(440+frameCount)%480 , 400, -80+(440+frameCount)%480, 320+5*sin(frameCount*0.1), (440+frameCount)%480, 280+5*sin(frameCount*0.1), (440+frameCount)%480, 400);
      fill(-mouseY*0.325, 115, 150+mouseY*0.325);
      noStroke();
      ellipse((440+frameCount)%480, 300+5*sin(frameCount*0.1), 10, 40);
      fill(50+mouseY*0.1, mouseY*0.2, 255);
    
  //Land
  
  fill(100);
  ellipse(200, 400, 500, 110);
  fill(85, 133, 64); //Green
  ellipse(200, 400, 460, 90);
    
  //Bench
 
  strokeWeight(5);
  stroke(150);
  line(150, 310, 150, 365);//Left back rail
  line(250, 310, 250, 365);//Right back rail
  line(150, 365, 140, 385);//Left bottom rail
  line(250, 365, 260, 385);//Right bottom rail
  noStroke();
  fill(110, 84, 56);//Brown
  rect(200, 325, 140, 20); //Back top
  rect(200, 350, 140, 20); //Back bottom
  quad(130, 365, 270, 365, 280, 380, 120, 380); //Bottom back
  quad(118, 385, 282, 385, 280, 400, 120, 400);


  //Big sun ray
  
  noStroke();
  fill(255, 255, 100, -50+mouseY*0.5);
  triangle(400-mouseY*0.1, 0, 400, 400, 400-mouseY, 400);

  //Cursor substitute
  
  strokeWeight(3);
  stroke(100);
  line(mouseX-5, mouseY, mouseX+20, mouseY);
  line(mouseX-5, mouseY, mouseX-10, mouseY-5);
  line(mouseX-10, mouseY-5, mouseX-5, mouseY-10);

}
  //Cursor breeze icon
  

void mousePressed(){
  frameRate(2);
  noFill();
  strokeWeight(3);
  stroke(100);
  line(mouseX, mouseY, mouseX+40, mouseY);
  line(mouseX, mouseY+5, mouseX+20, mouseY+5);
  line(mouseX, mouseY+5, mouseX-5, mouseY+10);
  line(mouseX-5, mouseY+10, mouseX, mouseY+15);
  line(mouseX-15, mouseY, mouseX-20, mouseY-5);
  line(mouseX-20, mouseY-5, mouseX-10, mouseY-15);
  }

void mouseReleased(){
  frameRate(60);
}