More Rain

x = 80;

y = 70;

​

x1 = 550;

y1 = 150;

​

x2 = 1080;

y2 = 40;

​

​

​

function setup() {

  createCanvas(windowWidth, windowHeight);

    Velocity = [];

  r = [];

  g = [];

  b = [];

  a = [];

  rain = [];

  for(i=1; i<60; i++){

  Velocity[i] = random(1,20);

  r[i] = random(10,250);

  g[i] = random(10,255);

  b[i] = random(10,255);

  a[i] = random(50,190);

  }

  for (i = 0; i < 300; i++) {

    rain[i] = new Rain(random(50, windowWidth*3), random(0, -3000));

  }

}

​

function draw() {

  background(0,185,228);

  ground();

​

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

      rain[i].rainDrop();

      rain[i].splash();

    }

    noStroke();  

    fill(255,255,255);

  //cloud1

    ellipse(x, y, 100, 80);

    ellipse(x+50, y-20, 80, 80);

    ellipse(x+120, y, 100, 90);

    ellipse(x-50, y+50, 100, 120);

    ellipse(x+40, y+50, 140, 150);

    ellipse(x+140, y+50, 140, 120);

    //cloud2

    ellipse(x1, y1, 100, 80);

    ellipse(x1+50, y1-20, 80, 80);

    ellipse(x1+120, y1, 100, 90);

    ellipse(x1-50, y1+50, 100, 120);

    ellipse(x1+40, y1+50, 140, 150);

    ellipse(x1+140, y1+50, 140, 120);

  //cloud3

    ellipse(x2, y2, 100, 80);

    ellipse(x2+50, y2-20, 80, 80);

    ellipse(x2+120, y2, 100, 90);

    ellipse(x2-50, y2+50, 100, 120);

    ellipse(x2+40, y2+50, 140, 150);

    ellipse(x2+140, y2+50, 140, 120);

}

​

function ground() {

  fill(170, 150, 146, 240);

  rect(0, 530, windowWidth, 530);

}

​

function Rain(x, y) {

  this.x = x-700;

  this.y = y;

  this.length = 15;

  this.r = 0;

  this.opacity = 200;

​

​

  this.rainDrop = function() {

    noStroke();

    colorNum = int(random(1,60));

    fill(r[colorNum],g[colorNum],b[colorNum],a[colorNum]);    

      triangle(this.x-5, this.y, this.x+5, this.y, this.x, this.y-20);

  arc(this.x, this.y, 10, 10, 0, PI, PIE);

    this.x = this.x + 2;

    this.y = this.y + 6;

​

  }

​

  this.splash = function() {

    strokeWeight(2);

    stroke(245, this.opacity);

    noFill();

    if (this.y > 540) {

      ellipse(this.x, 550, this.r * 2, this.r / 2);

      this.r++;

      this.opacity = this.opacity - 10;

      if (this.opacity < 0) {

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

        this.length = 15;

        this.r = 0;

        this.opacity = 200;

      }

    }

  }

}

​