let gravity = 0.2; // Initial gravity value

let isArrowUpPressed = false;

let isArrowDownPressed = false;

let initialGravity = 0.3;

​

function setup() {

  createCanvas(400, 400);

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

    drops[i] = new Raindrop();

  }

}

​

function draw() {

  background(220);

​

  // Apply wind force (change the windX value to control wind intensity)

  let windX = 0.005;

  for (let drop of drops) {

    // Apply gravity

    let gravityForce = createVector(0, gravity);

    drop.applyForce(gravityForce);

    // Apply wind

    let wind = createVector(windX, 0);

    drop.applyForce(wind);

​

    drop.update();

    drop.display();

  }

}

​

function keyPressed() {

  if (keyCode === UP_ARROW) {

    // Increase gravity temporarily when the up arrow key is pressed

    gravity += 0.1;

    for (let i = 0; i < 10; i++) {

      drops.push(new Raindrop());

    }

    isArrowUpPressed = true;

    isArrowDownPressed = false;

  } else if (keyCode === DOWN_ARROW) {

    gravity = Math.max(gravity-0.05, 0.2);

    isArrowDownPressed = true;

    isArrowUpPressed = false;

  }

}

​

function keyReleased() {

  if (keyCode === UP_ARROW) {

    // Return gravity to initial value when the up arrow key is released

    gravity = initialGravity;

    isArrowUpPressed = false;

  } else if (keyCode === DOWN_ARROW) {

    isArrowDownPressed = false;

  }

}

​

class Raindrop {

  constructor() {

    this.position = createVector(random(width), random(-200, -100));

    this.velocity = createVector(0, 0);

    this.acceleration = createVector(0, 0);

    this.length = random(10, 20);

    this.splashed = false;

  }

​

  applyForce(force) {

    // Newton's second law: F = ma

    // We divide by mass (1 in this case) to simplify the calculation

    // this.acceleration.add(force);

    this.velocity.add(force)

  }

​

  update() {

    this.velocity.add(this.acceleration);

    this.velocity.x = Math.min(this.velocity.x, 0.5)

    this.velocity.y = Math.min(this.velocity.y, 10)

    this.position.add(this.velocity);

​

    if (this.position.y > height) {

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

      this.position.x = random(width);

      this.splashed = false;

    }

  }

​

  splash() {

    if (this.position.y >= height-5 && !this.splashed) {

      // Calculate splash size based on raindrop length

      let splashSize = map(this.length, 10, 20, 5, 15);

      ellipse(this.position.x, height-5, splashSize, splashSize);

      this.splashed = true;

      if (isArrowDownPressed) {

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

          if (drops[i] === this) {

            delete drops[i];

            drops.splice(i, 1);

            break;

          }

        }

      }

    }

  }

​

  display() {

    stroke(0, 0, 255); // Blue color

    line(this.position.x, this.position.y, this.position.x, this.position.y + this.length);

    this.splash();

  }

}

​