let numBouncers = 10;

let current = 200;

let previous= 200;

​

var diameter = 1;

var ypoint = 0;

var amplitude = 60;

var timeperiod =100;

var angularvelocity = 6.28/timeperiod;

var time = 0;

var phasediff = 0;

var numofparticles;

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  //angleMode(DEGREES);

  rectMode(RIGHT);

  stroke(10);

  fill(2);

  numofparticles = (width / diameter) *2 ;

}

​

function draw() {

  background(2,102,150);

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

    rbs[i].update();

  }

  time += .8;

  for (let i=0; i < numofparticles+1; i++) { 

    ypoint = sin((angularvelocity ) * (time - phasediff)) * amplitude;

    line( i * (diameter * 10), height *1.5 + ypoint, diameter , diameter ); 

    phasediff += 2000;

     }

  phasediff = 0;

  if (time == timeperiod) time = 0;

}

​

function mouseDragged() {

  let w = 600;

  let h = 600;

  let l = 600;

  let rb = new RotatorBouncer(

      mouseX, // x

      mouseY, // y

      w, // width

      //h, // height

      random(-1,1), // xspeed

      random(-2,0), // yspeed

      random(0.8,1) // rspeed

      );

      color(222000)

  rbs.push(rb);

}

​

​

class RotatorBouncer {

  constructor(x, y, w, h, xSpeed, ySpeed, rSpeed) {

    this.x = x;

    this.y = y;

    this.w = x;

    this.h =h;

    this.xSpeed = xSpeed;

    this.ySpeed = ySpeed;

    this.rSpeed = rSpeed;

    this.a = 0;

  }

​

  update() {

    push();

    translate(this.y, this.y);

   // rotate(this.a);

    ellipse(100, 100, this.w, this.h);

    pop();

​

    this.x = this.x + this.xSpeed;

    this.y = this.y + this.ySpeed;

    this.a = this.a + this.rSpeed;

​

    if (this.x > height - this.w / 4 || this.x < this.w / 2) {

      this.xSpeed = this.xSpeed * -10;

    }

​

    if (this.y > width - this.h / 2 || this.y < this.h / 2) {

      this.ySpeed = this.ySpeed * -10;

    }

  }

}