let time;

const numAnimations = 3; 

​

function setup() {

  createCanvas(600, 600);

  noStroke();

  animationIndex = 0;

}

​

function draw() {

  translate(width / 2, height / 2);

  time = frameCount * 0.01;

​

  switch (animationIndex) {

​

​

    case 0:

      background(255 * osc(3), 204 * osc(2), 252 * osc(1));

      rotate(time);

      layoutRings(40, 3 * osc(5), 30 * osc(3), 20 * osc(3));

      layoutRings(10, 10 * osc(3), 10, 10);

      break;

​

​

​

    case 1:

      background(245 * osc(3), 236 * osc(2), 108 * osc(1));

      rotate(time * 50);

      layoutCircle(20, 40 * osc(1), 60, 20);

      layoutCircle(2 * osc(1), 4, 6, 2);

      layoutCircle(12, 14, 16, 12 * osc(2));

      layoutCircle(22, 24, 26, 22);

      layoutCircle(32, 34, 36, 32);

      layoutCircle(42, 44, 46, 42);

      layoutCircle(52, 54, 56, 52 * osc(20));

      break;

​

​

    case 2:

      background(255 * osc(3), 204 * osc(2), 252 * osc(1));

      rotate(time*100);

      layoutGrid(10, 5, 25, 30);

      layoutGrid(50 * osc(1), 30 * osc(1), 20 * osc(1), 30 * osc(1));

      layoutRings(40, 3 * osc(5), 30 * osc(3), 20 * osc(3));

      break;

      default:

      break;

​

  }

}

​

// returns an osccilator that's speed is determined by the given scale

function osc(scale) {

  if (!scale) {

    scale = 0;

  }

  return abs(sin(frameCount * 0.01 * scale));

}

​

function mousePressed() {

  animationIndex += 1;

  animationIndex = animationIndex % 3;

}

​

function layoutRings(numRings, numItems, radius, itemSize) {

  for (let i = 0; i <= numRings; i++) {

    let step = i / numRings;

    let colorStep = (i + 1) / numRings;

    // fill(0, 0, colorStep*255);

    fill(0 * osc, 255 * osc, colorStep);

    layoutCircle(numItems * i, radius * i, itemSize, step);

  }

}

​

// draws an ellipse count number of times at the given scale

function layoutCircle(count, scale, itemSize, step) {

  for (let i = 0; i < count; i++) {

    let inc = map(i, 0, 10, 0, TWO_PI);

    let col = map(i, 0, count, 0, 250); 

    let x = sin(inc) * count * scale;

    let y = cos(inc) * count * scale;

    ellipse(x, y, itemSize, itemSize);

  }

}

​

​

function layoutGrid(row, column, itemSize, padding) {

  translate(-row * padding/2, -column * padding/2);

  let step = 0;

  let index = 0;

  let size = osc(step)*2;

  for (let i = 0.0; i < row; i++) {

    for (let j = 0.0; j < column; j++) {

      step = index / (row * column);

      index += i;

      let x = i * padding;

      let y = j * padding;

      ellipse(x, y, itemSize * size, itemSize * size);

      ellipse(x, y, 5, 5);

    }

  }

​

​

​

}