// let sizes= []

let fibonacci= []

let FIBONACCI_MAX=100

let SCALE_CIRCLES=0.001

let a=0

let b=1

let c

let systems=[]

let slider1

let x=1

let y=1

​

function setup() {

  title= createP ('SOME SUPER COOL CIRCLES').addClass('title');

  // title.style ('orange');

  // title.center();

  createCanvas(1000, 300);

  fillFibonacci();

    createP ('');

    createP('Cool Circles Size');

    slider1= createSlider (10,500,50);

    createP('Number of circles');

    slider2= createSlider (1,10,6);

    createP('Trippiness').addClass('other');

    slider3= createSlider (0,255,50)

  createP('COLOR')

  slider4= createSlider (0,255,50)

  for (i=0 ; i<5 ; i++){

    let s = new fiboCircle (random(width), random(height), random(100), 2, random(255));

   systems.push(s);  

  }

  // coolCircle= new fiboCircle (100, 100, 100, 10, 10)

​

print (fibonacci[0])

}

​

function draw() {

  background(0,255-slider3.value());

 // title.position (x+random(3),y+random(3));

  // coolCircle.show();

  // coolCircle.getPositionsForCircles();

    for (let s in systems){

  systems[s].show();

  systems[s].getPositionsForCircles();

  }

​

}

function fillFibonacci ()

{

 for (i=0;i<FIBONACCI_MAX;i++){

              c = a + b; 

            a = b; 

            b = c;

   fibonacci[i]=c

 }

}

​

class fiboCircle {

 constructor (posX,posY,size, iterations, colourReal) {

   this.posX=posX

   this.posY=posY

   this.size=size

   this.colourReal=colourReal

   this.iterations=iterations

 }

  // defineColour(){

  //   this.colR=fibonacci[i]*(SCALE_CIRCLES*this.colourReal);

  //   this.colG=(fibonacci[i]*i)*(SCALE_CIRCLES*this.colourReal);

  //   this.colB=(i*3)*(SCALE_CIRCLES*this.colourReal);

  // }

  getPositionsForCircles(){

    this.complexPosX=(this.posX)+((mouseX-(this.posX))*i)/(fibonacci[i])

    this.complexPosY=(this.posY)+((mouseY-(this.posY))*i)/(fibonacci[i])

  }

  // defineCircleSizes(){

  //   // this.complexSize=

  // }

  show (){

      for(i=this.iterations+slider2.value() ; i>=2; i--){

  // fill(this.colR,this.colG,this.colB,150) 

  fill (this.colourReal+slider4.value(),fibonacci[i]*this.colourReal-slider4.value(),i*this.colourReal-slider4.value(),100)

  ellipse ((this.posX)+((mouseX-(this.posX))*i)/(fibonacci[i]), (this.posY)+((mouseY-(this.posY))*i)/(fibonacci[i]), (fibonacci[i])*(slider1.value()*this.size*(sin(frameCount*0.01))*SCALE_CIRCLES), (fibonacci[i])*(slider1.value()*this.size*(sin(frameCount*0.01))*SCALE_CIRCLES))

  }

  }

  movement(){

    // this.closenessX=(abs(mouseX-this.posX))

    // this.closenessY=(abs(mouseY-this.posY))

    // this.speedX=5/this.closenessX

    // this.speedY=5/this.closenessY

    // this.posX=this.posX+this.speedX

    // this.posY=this.posY+this.speedY

  }

}