//wccchallenge big sky - click to change

//what we can make with a humble circle...
let c, clouds, nClouds;
function setup() {
  clouds = []; //a container for those so close to the void
  nClouds = int(random(5, 20)); //a school of clouds
  c = min(min(windowWidth, windowHeight) * 0.9, 800); //a window's constraint
  cnv = createCanvas(c, c); // your window
  angleMode(DEGREES); //right ascention and declination is in degrees
  r1 = random(250, 300); //what we see is but a translation of color
  g1 = random(250, 300);
  b1 = random(250, 300);
  noStroke(); //to paint without a pen
  for (let i = 0; i < nClouds; i++) {
    clouds.push(new Cloud()); //evaporation leads to this moment
  }
}
function draw() {
  translate(width / 2, height / 2); //center on our radiance
  for (let i = c * 2; i > 0; i--) {
    // a vignette , to focus
    fill(r1 - i / 3, g1 - i / 3, b1 - i / 3);
    circle(0, 0, i);
  }
  for (let i = 0; i < clouds.length; i++) {
    push();
    translate(clouds[i].x, clouds[i].y); //the wind of different heights
    clouds[i].display(); //open your eyes
    clouds[i].move();
    pop();
  }
}

class Cloud {
  constructor() {
    this.x = random(-c, c); //turn to a random page of this book
    this.y = random(-c / 2, c / 2); //and pick a random line
    this.pos = []; //our vessels must first be empty
    this.cSize = [];
    for (let i = 0; i < 500; i++) {
      let x = random(-c / 3, c / 3); //a smear of earth upon the sky
      let y = randomGaussian(5, 10); //distributed and bunched without the weight to cry
      this.pos[i] = createVector(x, y);
      this.cSize[i] = random(0, (c / 3 - abs(x)) / 2); //to taper off
    }
    this.delta = random(0.01, 1); //and change
  }
  display() {
    for (let i = 0; i < this.pos.length; i++) {
      fill(r1 / 3, g1 / 3, b1 / 3, 3 + 2 * abs(sin(this.y))); //a steadfast ratio of color
      circle(this.pos[i].x, this.pos[i].y, this.cSize[i]); //just another locus of points - infinite - are these moments a locus?
    }
  }
  move() {
    //a breath out
    if (this.x > -c * 2) {
      this.x -= this.delta; //at its own velocity
    } else {
      this.x = c * 2;
    }
  }
}

function mousePressed() {
  //so many skies
  setup();
  draw();
}