> show canvas only <


/* built with Studio Sketchpad: 
 *   https://sketchpad.cc
 * 
 * observe the evolution of this sketch: 
 *   https://p5js.sketchpad.cc/sp/pad/view/ro.0k1EN5wcEfO/rev.19
 * 
 * authors: 
 *   [Sketchpad]
 *   GoToLoop

 * license (unless otherwise specified): 
 *   creative commons attribution-share alike 3.0 license.
 *   https://creativecommons.org/licenses/by-sa/3.0/ 
 */ 



/**
 * CellGrid (v6.2)
 * by GoToLoop (2015/Jul/09)
 *
 * forum.Processing.org/two/discussion/11605/100x100-grid-draw-at-2-fps
 * studio.ProcessingTogether.com/sp/pad/export/ro.9KbaSot4iSjhZ
 * p5js.ProcessingTogether.com/sp/pad/export/ro.Cf6RWyw2ANSO4h
 */

const W = 640, H = 480, FPS = 30,
      COLS = 100, ROWS = 80, DIM = COLS*ROWS,
      WIDE = W/COLS, TALL = H/ROWS,
      WIDE_ADJ = WIDE + .5, TALL_ADJ = TALL + .5,
      RESHUFFLE = true, // change it to false to stop auto-reshuffle.
      cells = Array(DIM);

var on, off;

function setup() {
  createCanvas(W, H);
  noSmooth().noStroke().rectMode(CORNER).frameRate(FPS);

  on = Object.freeze(color(255)), off = Object.freeze(color(0));

  fill(on);
  createCells();
}

function draw() {
  RESHUFFLE && randomCells();
  print(frameRate());

  background(off);
  for (var idx = 0; idx != DIM; cells[idx++].display());
}

function mousePressed() {
  RESHUFFLE || randomCells();
}

function randomCells() {
  for (var idx = 0; idx != DIM; cells[idx++].isOn = random(1) < .5);
}

function createCells() {
  for (var x, y, idx = 0; idx != DIM; ++idx) {
    x = idx%COLS * WIDE, y = (idx/COLS | 0) * TALL;
    cells[idx] = new Cell(x, y);
  }

  Object.freeze(cells);
  RESHUFFLE || randomCells();
}

function Cell(x, y) {
  this.isOn = false, this.x = round(x), this.y = round(y);
  Object.seal(this);
}

Cell.prototype.display = function () {
  this.isOn && rect(this.x, this.y, WIDE_ADJ, TALL_ADJ);
}

Object.freeze(Object.freeze(Cell).prototype);