"use strict";
var balls = [];
var i;
var blower;
function setup() {
  createCanvas(900, 560);
  for (var i = 0; i < 40; ++i) {
    balls[i] = new Ball()
    .position(random(0, 900), random(360, 361))
  }
}

function draw() {
  background('#AED6F1');
  fill('#3498DB');
  rect(0, 360, 900, 200);
  noStroke();


  //Balls
  for (var i = 0; i < balls.length; ++i){
    balls[i].move();
    balls[i].display();
  }

  var blower = new Blower();

  //blow up
  var f1 = createVector(0, -1);

  //gravity
  var f2 = createVector(0, 1);

  //fuli
  var f3 = createVector(0, -0.2);

  if (mouseY > 360 && mouseY < 560) {
    blower.update_pos(mouseX);
    for (var i = 0; i < balls.length; ++i){
      //blowed up
      if (balls[i].pos.x > blower.x1 && balls[i].pos.x < blower.x4){
        balls[i].applyForce(f1);
      }
      else{
        //drop down
        if (balls[i].pos.y < 360){
          balls[i].applyForce(f2);
        }
        //come up
        if (balls[i].pos.y > 361) {
          balls[i].applyForce(f3);
        }
      }
    balls[i].update();
    balls[i].display();

    }
  }
  blower.display();

}

class Blower{
  constructor(){
    this.x1 = 0;
    this.y1 = 460;
    this.x2 = 20;
    this.y2 = 560;
    this.x3 = 40;
    this.y3 = 560;
    this.x4 = 60;
    this.y4 = 460;
  }

  update_pos(center_x) {
    this.x1 = center_x - 30;
    this.x2 = center_x - 10;
    this.x3 = center_x + 10;
    this.x4 = center_x + 30;
  }


  display(){
    fill('#F7DC6F');
    quad(this.x1,this.y1,this.x2,this.y2,this.x3,this.y3,this.x4,this.y4);
  }

}