> show canvas only <


/* built with Studio Sketchpad: 
 *   https://sketchpad.cc
 * 
 * observe the evolution of this sketch: 
 *   https://p5js.sketchpad.cc/sp/pad/view/ro.QvtEiuQZvLz/rev.156
 * 
 * authors: 
 *   MarcoK

 * license (unless otherwise specified): 
 *   creative commons attribution-share alike 3.0 license.
 *   https://creativecommons.org/licenses/by-sa/3.0/ 
 */ 



var balls = [];
var info = "Click on the stage and create sound balls [turn on your speakers]";
function setup() {
  createCanvas(640,480);
}

function draw() {
    background(50);
  
      for(var i=0;i<balls.length;i++){
          balls[i].show();
          balls[i].move();
      }
      textSize(16);
      textAlign(CENTER);
      fill(200);
      text(info, width/2, height/2);
}
function mouseReleased(){
    balls.push(new Ball(mouseX, mouseY));
    info = "";
}
function Ball(x,y){
    this.x = x;
    this.y = y;
    this.r = random(10,20);
    this.step = 0.01;
    this.osc = new p5.Oscillator();
    this.osc.setType('sine');
    this.rnd = Math.floor(random(60,2000))
    this.osc.freq(this.rnd);
    this.osc.start();
    this.osc.amp(0,10.5);
    this.delay = new p5.Delay();
    
    this.delay.process(this.delay,0.2);
    this.show = function(){
        fill(200,200,240);
        ellipse(this.x, this.y, this.r*2, this.r*2)
    }
    this.move = function(){
        this.step++;
        this.y+=this.step;
        if(this.y+this.r>=height){
            this.step = -this.step;
            this.rnd = Math.floor(random(60,2000));
            this.osc.freq(this.rnd);
            this.r/=1.2;
        }
    }
}