色付きBlob - OpenProcessing

mySketch
xxxxxxxxxx
 
let blob = [];
let iremono;
let jyougen =300;
​
function setup() {
  createCanvas(600, 600);
  blob.push(
      new Blob(150,
                  createVector(200,200),
                  createVector(random(-10,5),random(-10,5)),
                  random(255),
                  random(255),
                  random(255)))
}
​
function draw() {
  background(0);
  for(let i = 0; i < blob.length; i++){
    blob[i].move();
    blob[i].bounce();
    blob[i].display();
    
    if (mouseX <=blob[i].position.x && blob[i].position.x <=mouseX+60
        &&height/2-15 <= blob[i].position.y && blob[i].position.y <= height/2+15
        &&blob.length < jyougen) {
      blob.push(
      new Blob(random(70),
                    createVector(blob[i].position.x+30,blob[i].position.y+30),
                    createVector(random(-2,2),random(-2,2)),
                    random(255),
                    random(255),
                    random(255),))
    }
  }
  iremono = new RECT();
  iremono.move();
  iremono.display();
}
​
​
class Blob{
  constructor(diameter, position, velocity, colorA, colorB, colorC){
    this.diameter = diameter;
    this.position = position;
    this.velocity = velocity;
    this.A = colorA;
    this.B = colorB;
    this.C = colorC;
  }
  move(){
    this.position.add(this.velocity);
  }
  bounce(){
    if (this.position.x < this.diameter / 2 || this.position.x > width - this.diameter / 2) {
      this.velocity.x *= -1;
    }
    if (this.position.y < this.diameter / 2 || this.position.y > height - this.diameter / 2) {
      this.velocity.y *= -1;
    }
    if (mouseX<=this.position.x && this.position.x <=mouseX+60
        &&height/2-10 <= this.position.y && this.position.y <= height/2+10
        && this.velocity.y <=0) {
      this.velocity.y *= -1;
      this.position.y += 10;
    }
    if (mouseX<=this.position.x && this.position.x <=mouseX+60
        &&height/2-10 <= this.position.y && this.position.y <= height/2+10
        && this.velocity.y > 0) {
      this.velocity.y *= -1;
      this.position.y -= 10;
    }
  }
  display(){
    noStroke();
    fill(this.A,this.B,this.C, 127);
    let currentDiameter = sin(frameCount * 0.1) * (this.diameter / 4) + this.diameter;
    circle(this.position.x, this.position.y, currentDiameter);
    fill(255);
    circle(this.position.x, this.position.y, this.diameter / 6.0);
  }
}
  
class RECT{
  constructor(){
      this.position = createVector(width/2,height/2)
  }
  move(){
      this.position.x = mouseX;
  }
  display(){
    noStroke();
    fill(255, 127);
    rect(this.position.x, this.position.y, 60,10);
  }
}