let rbs = [];

let numBouncers = 100;

​

function setup() {

  createCanvas(400, 400);

  angleMode(DEGREES);

  rectMode(CENTER);

​

  for (let x = 100; x < height; x = x + 100) {

    for (let y = 10; y < width; y = y + 10) {

      rs.push(new Rotator(

        y,                                   // x location

        x,                                   // y location

        220,                                 // width of rect

        700,                                 // height of rect

        random(0.2, 1),      // speed of rotation

        map(x,1,width,55,9), // color

                random(8)

      ));

    }

  }

}

​

​

function draw() {

  background(255);

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

    rs[i].update();

  }

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

    rbs[i].update();

  }

}

​

​

function mouseDragged() {

  let h = 15 // this.w;

  let w = 1 // h;

  let rb = new RotatorBouncer(

      mouseX, // x

      mouseY, // y

      w, // width

      h, // height

      random(-2,2), // xspeed

      random(-2,2), // yspeed

      random(0.2,180) // rspeed

      //color(HSB);

    );

  rbs.push(rb);

}

​

class Rotator {

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

    this.x = y;

    this.y = r;

    this.w = w;

    this.h = h;

    this.s = s;

    this.a = 2;

    this.c = x;

    this.r = w;

    this.xSpeed = xSpeed;

    this.ySpeed = ySpeed;

    this.rSpeed = rSpeed;

  }

​

  update() {

    push();

    translate(this.x, this.y);

    rotate(this.a);

    colorMode(HSB);

    fill(this.c,10,200,0);

    rect(0, 10, this.h, this.h, this.r);

    pop();

    this.a = this.a + this.s;

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

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

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

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

      this.xSpeed = this.xSpeed * -1;

    }

​

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

      this.ySpeed = this.ySpeed * -1;

    }

  }

}

​

class RotatorBouncer {

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

    this.x = x;

    this.y = y;

    this.w = w;

    this.h = h;

    this.xSpeed = xSpeed;

    this.ySpeed = ySpeed;

    this.rSpeed = rSpeed;

    this.a = 0;

  }

​

  update() {

    fill (0,0,0);

    push();

    translate(this.x, this.x);

    rotate(this.y);

    rect(0, 0, this.w, this.h);

    pop();

​

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

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

    this.a = this.a * this.rSpeed + this.x;

​

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

      this.ySpeed = this.xSpeed * -10;

    }

​

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

      this.ySpeed = this.ySpeed * -1;

    }

    if (this.x > 250 || this.y > 200) {

       this.x = this.y * -10 || rect -1;

    }

     if ( rect < 10) { 

      fill (220,220,200);

     }

  }

}

​

​