constructor() {

        this.x = random(0, width);

        this.y = random(-200, -100);

        this.z = random(0,20);

        this.yspeed = map(this.z, 0, 20, 0, 4);        

    }

    fall() {

        this.y = this.y + this.yspeed;

        var g = map(this.z, 0, 20, 0, 0.1);

        this.yspeed = this.yspeed + g;

         if (this.y > height) {

            this.y = random(-200, -100);

            this.yspeed = random(4, 10);

           //fai suono

        }

    }

    show() {

        var l = map(this.z, 0, 20, 10, 20);

        var thickness = map(this.z, 0, 20, 1, 4);

        strokeWeight(thickness);

        stroke(255, 255, 255);

        line(this.x, this.y, this.x, this.y + l);

    }

}

​

​

var drops = [];

​

function setup() {

    createCanvas(windowWidth, 400);

  for(var i = 0; i < 100; i++) {

      drops[i] = new goccia();

    }

}

​

function draw() {

  //dopo millis() ad ogni click del mouse aggiungo una goccia

  //il numero di gocce è oscillante

  //il mouse fa da vento

    background(0, 0, 0);

    for(var i = 0 ; i < drops.length; i++) {

        drops[i].fall();

        drops[i].show();

    }

}

​

​