var r_noise;

​

let canvas_w = 600,

  canvas_h = 600,

  noise_r = 1,

  nSteps = 360,

  line_count = 1,

  line_height = 30,

  circle_size = 100,

  dot_size = 8,

  center_x = canvas_w / 2,

  center_y = canvas_h / 2,

  line_color = [],

  line_noise_offset = [];

​

function setup() {

  pixelDensity(1);

  // frameRate(5);

  createCanvas(canvas_w, canvas_h);

  colorMode(HSB, 1);

​

  fill(color(0, 0, 0));

  background(0);

  noStroke();

  things[0] = {

    draw: function(step) {

    fill(color(0.5, 1, 1));

    rect(step, step, 10, 10);

  }

}

  // shuffleArray(times);  

}

var things = [];

​

function shuffleArray(array) {

    for (var i = array.length - 1; i > 0; i--) {

        var j = Math.floor(Math.random() * (i + 1));

        var temp = array[i];

        array[i] = array[j];

        array[j] = temp;

    }

}

function noisy(theta, x, y) {

  var n = noise(noise_r + noise_r * sin(theta),

    noise_r + noise_r * cos(theta),

    x * 0.001);

  return map(n, 0.25, 0.75, 0, height)

}

​

var res = 200,

times = [

    120,

    90,

    72,

    60,

    45,

    40,

    36,

    30

  ],

  radiuses = [200,

    180,

    160,

    140,

    120,

    100,

    80,

    60,

  ];

​

function draw() {

  background(0, 0.1);

  var step = frameCount % nSteps;

  things.forEach((thing) => thing.draw(step));

​

  if ((frameCount >= nSteps) && frameCount < 2 * nSteps) {

    // frameRate(5)

    // saveCanvas("rainbow-dots-"+nf(frameCount%nSteps, 3)+".png")

  }

​

  // noLoop();

}