churn2D_Day26

let n = 300;
let bArray = []
function setup() {
  createCanvas(400, 400);
  fill(0)
  for (let i = 0; i < n; i++) {
    bArray.push(new Ball(random(-width/2,width/2),random(-width/2,width/2)))
  }
  angleMode(DEGREES)
  strokeWeight(0.1)
}

function draw() {
  translate(width/2,width/2)
  background(20,60,120);
  for(let i=0;i<n;i++){
    noStroke();
    fill(105,195,255,2)
    circle(bArray[i].y,bArray[i].x,300)
  }
  for (i=0;i<n;i++){
stroke(bArray[i].color+100,bArray[i].color+140,bArray[i].color+160)  
    fill(bArray[i].color+100,bArray[i].color+140,bArray[i].color+160)
    bArray[i].move();
    bArray[i].display();
  }
  windowP();
}

class Ball {
  constructor(x,y) {
    this.x = random(-width/2,width/2);
    this.y = random(-width/2,width/2);
    this.r = random(20,50);
    this.vx = random(-2,3);
    this.vy = random(-2,3);
    this.color = random(20,90)
    this.angle = random(0,90)
  }
  move() {
    this.x=this.x+this.vy*sin(frameCount+5*this.vx)+this.vx*cos(frameCount+20*this.vx);
    this.y=this.y+this.vy*cos(frameCount-5*this.vy)-this.vx*sin(frameCount+20*this.vy);
  }
  display(){
    push()
    rotate(this.angle+frameCount)
    ellipse(this.x,this.y,this.r,this.r*2)
    pop()
  }
}

function mousePressed() {
  let myball = new Ball((mouseX-width/2)/(sin(frameCount)*random(0,2)), mouseY-width/2);
  bArray.push(myball);
  n = n+1;
}

function windowP(){
  noStroke();
  fill(255)
  beginShape()
    for (let i=0; i <= 180; i++) {
      x = 180*cos(i)
      y = 180*sin(i);
      vertex(x,y) 
  }
  vertex(-width/2,0)
  vertex(-width/2, height/2);
  vertex(width/2, height/2);
  vertex(width/2,0)
  endShape(CLOSE);
  beginShape()
    for (let i=180; i <= 360; i++) {
      x = 180*cos(i)
      y = 180*sin(i);
      vertex(x,y) 
  }
  vertex(width/2,0)
  vertex(width/2, -height/2);
  vertex(-width/2, -height/2);
  vertex(-width/2,0)
  endShape(CLOSE);
  stroke(4, 112, 179);
  strokeWeight(1)
}