Variable Grids - OpenProcessing

mySketch
xxxxxxxxxx
 
var gB, fullRes, windowRes;
var requiredFrames = 120;
var gridArray;
var arrayXDimension, arrayYDimension, arraySquareSize;
​
function setup() {
  windowRes = min(windowWidth, windowHeight);
  createCanvas(windowRes, windowRes);
  imageMode(CENTER);
  gB = createGraphics(fullRes = 1024, fullRes);
  gB.colorMode(HSB, 360);
​
  arrayXDimension = 32;
  arrayYDimension = 32;
  arraySquareSize = fullRes / max(arrayXDimension, arrayYDimension);
​
​
  gridArray = [];
  for (var i = 0; i < arrayXDimension; i += 1) {
    gridArray[i] = [];
    for (var j = 0; j < arrayYDimension; j += 1) {
      gridArray[i][j] = createVector(1, 1);
    }
  }
  
  for (var i = 0; i < 9999; i += 1) {
    var xPos = floor(random(arrayXDimension));
    var yPos = floor(random(arrayYDimension))
    var hSize = 1 + floor(random(arrayXDimension) * 0.5);
    var vSize = 1 + floor(random(arrayYDimension) * 0.5);
    placeRectangleOnGrid(xPos, yPos, hSize, vSize);
  }
}
​
function placeRectangleOnGrid(hStart, vStart, hSize, vSize) {
  if (hSize === 1 && vSize === 1) {
    return;
  }
  if (hStart > arrayXDimension || vStart > arrayYDimension) {
    return;
  }
  if (hStart + hSize > arrayXDimension) {
    hSize = arrayXDimension - hStart;
  }
  if (vStart + vSize > arrayYDimension) {
    vSize = arrayYDimension - vStart;
  }
  // Check for errors
  for (var i = 0; i < hSize; i += 1) {
    for (var j = 0; j < vSize; j += 1) {
      if (gridArray[hStart + i][vStart + j].x != 1 || gridArray[hStart + i][vStart + j].y != 1) {
        return;
      }
    }
  }
  for (var i = 0; i < hSize; i += 1) {
    for (var j = 0; j < vSize; j += 1) {
      gridArray[hStart + i][vStart + j] = createVector(0, 0);
      for (var i = 0; i < hSize; i += 1) {
        for (var j = 0; j < vSize; j += 1) {
            gridArray[hStart + i][vStart + j] = createVector(0, 0);
        }
      }
    }
  }
  gridArray[hStart][vStart] = createVector(hSize, vSize);
}
​
function draw() {
  gB.clear();
  gB.resetMatrix();
  gB.translate(0.5 * fullRes, 0.5 * fullRes);
  gB.translate(arrayXDimension * -0.5 * arraySquareSize, arrayYDimension * -0.5 * arraySquareSize);
​
  gB.stroke(0);
  gB.noFill();
​
  for (var i = 0; i < arrayXDimension; i += 1) {
    for (var j = 0; j < arrayYDimension; j += 1) {
      gB.push();
      gB.translate(arraySquareSize * 0.025, arraySquareSize * 0.025);
      gB.translate(arraySquareSize * i, arraySquareSize * j);
      var xValue = gridArray[i][j].x;
      var yValue = gridArray[i][j].y;
      if (xValue != 0 && yValue != 0) {
        gB.fill(map(noise(i, j), 0, 1, 300, 360));
        gB.rect(0, 0, xValue * arraySquareSize - arraySquareSize * 0.05, yValue * arraySquareSize - arraySquareSize * 0.05);
      }
      gB.pop();
    }
  }
​
  background(360);
  displayBuffer(gB);
  noLoop();
}
​
function keyPressed() {
  if (key === "g") {
    saveGif('export', requiredFrames, {
      delay: 0,
      units: "frames"
    });
  }
}
​
function displayBuffer(buffer) {
  image(buffer, windowRes / 2, windowRes / 2, windowRes * 0.9, windowRes * 0.9);
}
​
function windowResized() {
  windowRes = min(windowWidth, windowHeight);
  createCanvas(windowRes, windowRes);
}