Laszlo - OpenProcessing

sketch
xxxxxxxxxx
 
// By Roni Kaufman
// https://ronikaufman.github.io
​
let margin = 1;
let N = 20;
let maxSize;
let u, gap;
let backCol = 5;
let strokeCol = "#fdfdfd";
let palette = ["#584594", "#e488b7", "#d74c41", "#f0d235", "#36ad63", "#69bcea"];
​
let rectangles = [];
​
let randInt = (a, b) => (floor(random(a, b))); 
​
function setup() {
  createCanvas(600, 600);
  pixelDensity(4);
  noStroke();
  noLoop();
  
  maxSize = random([2, 2, 2, 3, 3, 3, 3, 4, 4, 5]);
  u = width/N;
  gap = u/6;
  
  createComposition();
  createConnections();
  DSatur("cubeType", [1, 2, 3, 4, 5, 6], true);
}
​
function draw() {
  background(backCol);
  //translate(-width/2, -height/2);
  
  for (let recta of rectangles) {
    drawRectangle(recta);
  }
}
​
// creating the composition
​
function createComposition() {
  let nRects = 1000;
  if (random() < 1/100) nRects = 1;
  for (let i = 0; i < nRects; i++) {
    let newRecta = generateRectangle(rectangles);
    if (newRecta.si > 1 || newRecta.sj > 1) {
      rectangles.push(newRecta);
    }
  }
  
  // fill the gaps with 1x1 rectangles
  for (let i = margin; i < N-margin; i++) {
    for (let j = margin; j < N-margin; j++) {
      let newRecta = {
        i: i,
        j: j,
        si: 1,
        sj: 1
      }
      let canAdd = true;
      for (let recta of rectangles) {
        if (rectanglesIntersect(newRecta, recta)) {
          canAdd = false;
          break;
        }
      }
      if (canAdd) {
        rectangles.push(newRecta);
      }
    }
  }
}
​
function rectanglesIntersect(recta1, recta2) {
  return ((recta1.i <= recta2.i && recta1.i+recta1.si > recta2.i) || (recta2.i <= recta1.i && recta2.i+recta2.si > recta1.i)) && ((recta1.j <= recta2.j && recta1.j+recta1.sj > recta2.j) || (recta2.j <= recta1.j && recta2.j+recta2.sj > recta1.j));
}
​
function generateRectangle(rectangles) {
  let i = randInt(margin, N-margin);
  let j = randInt(margin, N-margin);
  
  // determine biggest possible size
  let s = 0;
  if (rectangles.length == 0) {
    s = min(maxSize, N-i-margin-1, N-j-margin-1);
  } else {
    let intersects = false;
    while (!intersects) {
      s++;
      for (let recta of rectangles) {
        if (i+s > N-margin || j+s > N-margin || s > maxSize || rectanglesIntersect({i: i, j: j, si: s, sj: s}, recta)) {
          intersects = true;
          break;
        }
      }
    }
    s--;
  }
  
  let si = s, sj = s;
  if (i < N/2 && i+si > N/2) {
    si = N/2-i;
    sj = si;
  }
  if (j < N/2 && j+sj > N/2) {
    sj = N/2-j;
    si = sj;
  }
  let recta = {
    i: i,
    j: j,
    si: si,
    sj: sj
  };
  return recta;
}
​
// creating the graph
​
function createConnections() {
  let l = rectangles.length;
  for (let i = 0; i < l; i++) {
    let recta1 = rectangles[i];
    if (!recta1.neighbors) recta1.neighbors = [];
    for (let j = 0; j < l; j++) {
      let recta2 = rectangles[j];
      if (!recta2.neighbors) recta2.neighbors = [];
      if (i != j && rectanglesTouch(recta1, recta2)) {
        recta1.neighbors.push(recta2);
        //recta2.neighbors.push(recta1);
      }
    }
  }
}
​
function rectanglesTouch(recta1, recta2) {
  if (((recta1.i <= recta2.i && recta1.i+recta1.si == recta2.i) || (recta2.i <= recta1.i && recta2.i+recta2.si == recta1.i)) && ((recta1.j <= recta2.j && recta1.j+recta1.sj > recta2.j) || (recta2.j <= recta1.j && recta2.j+recta2.sj > recta1.j)))
    return true;
  if (((recta1.i <= recta2.i && recta1.i+recta1.si > recta2.i) || (recta2.i <= recta1.i && recta2.i+recta2.si > recta1.i)) && ((recta1.j <= recta2.j && recta1.j+recta1.sj == recta2.j) || (recta2.j <= recta1.j && recta2.j+recta2.sj == recta1.j)))
    return true;
  return false;
}
​
// coloring the graph
​
function DSatur(el, elements, shuffleIt) {
  // from https://en.wikipedia.org/wiki/DSatur
  
  for (let i = 0; i < rectangles.length; i++) {
    // step 1
    let v, vSat = -1, vElementsUsed;
    for (let recta of rectangles) {
      if (!recta[el]) {
        let elementsUsed = elementsUsedByNeighbors(recta, el);
        let sat = elementsUsed.length;
        if (sat > vSat) {
          v = recta;
          vSat = sat;
          vElementsUsed = elementsUsed;
        } else if (sat == vSat) {
          if (largestDegreeInTheSubgraphInducedByTheUncoloredVertices(recta, el) > largestDegreeInTheSubgraphInducedByTheUncoloredVertices(v, el)) {
            v = recta;
            vSat = sat;
            vElementsUsed = elementsUsed;
          }
        }
      }
    }
​
    // step2
    shuffle(elements, shuffleIt);
    for (let element of elements) {
      if (vElementsUsed.indexOf(element) == -1) {
        v[el] = element;
        break;
      }
    }
  }
}
​
function elementsUsedByNeighbors(v, el) {
  let elementsUsed = [];
  for (let neigh of v.neighbors) {
    if (neigh[el]) elementsUsed.push(neigh[el]);
  }
  return [...new Set(elementsUsed)];
}
​
function largestDegreeInTheSubgraphInducedByTheUncoloredVertices(v, el) {
  let largestDegree = -1;
  for (let neigh of v.neighbors) {
    if (!neigh[el]) {
      let sat = elementsUsedByNeighbors(neigh, el);
      if (sat > largestDegree) largestDegree = sat;
    }
  }
  return largestDegree;
}
​
// drawing
​
function drawRectangle(recta) {
  let x = recta.i*u+gap/2, y = recta.j*u+gap/2;
  let w = recta.si*u - gap, h = recta.sj*u - gap;
  let dpth = w/4;
  //if (random() < 1/2) dpth = u/3;
  
  let tile = createGraphics(w, h);
  let sw = gap/2;
  tile.strokeWeight(sw);
  tile.strokeCap(PROJECT);
  tile.noStroke();
  
  tile.translate(w/2, h/2);
  
  let iPos = recta.i+recta.si/2;
  let iFirstHalf = (iPos < N/2);
  let iMiddle = (iPos == N/2);
  let iSecondHalf = (iPos > N/2);
  let jPos = recta.j+recta.sj/2;
  let jFirstHalf = (jPos < N/2);
  let jMiddle = (jPos == N/2);
  let jSecondHalf = (jPos > N/2);
  if ((iFirstHalf || (iMiddle && random() < 1/2)) && (jFirstHalf || (jMiddle && random() < 1/2))) {
    tile.rotate(0);
  } else if ((iSecondHalf || (iMiddle && random() < 1/2)) && (jFirstHalf || (jMiddle && random() < 1/2))) {
    tile.rotate(PI/2);
  } else if ((iSecondHalf || (iMiddle && random() < 1/2)) && (jSecondHalf || (jMiddle && random() < 1/2))) {
    tile.rotate(PI);
  } else {
    tile.rotate(3*PI/2);
  }
  tile.translate(-w/2, -h/2);
  
  shuffle(palette, true);
  if (recta.cubeType == 1) {
    // full cube, 3 different colors, no lines
    tile.fill(palette[0]);
    frontFacet(0, 0, w, h, dpth, tile);
    tile.fill(palette[1]);
    rightFacet(0, 0, w, h, dpth, tile);
    tile.fill(palette[2]);
    bottomFacet(0, 0, w, h, dpth, tile);
  } else if (recta.cubeType == 2) {
    // front back back facets filled, connected with lines
    tile.fill(palette[0]);
    tile.stroke(palette[0]);
    backFacet(0, 0, w, h, dpth, tile);
    tile.stroke(strokeCol);
    tile.line(w-dpth, 0, w, dpth);
    tile.line(0, h-dpth, dpth, h);
    tile.line(w-dpth, h-dpth, w, h);
    tile.stroke(palette[1]);
    tile.fill(palette[1]);
    frontFacet(0, 0, w, h, dpth, tile);
    tile.noStroke();
  } else if (recta.cubeType == 3) {
    // full cube skeleton, drawn with lines
    let invertCols = random() < 1/4;
    tile.stroke(invertCols ? palette[0] : strokeCol);
    tile.noFill();
    topFacet(0, 0, w, h, dpth, tile);
    bottomFacet(0, 0, w, h, dpth, tile);
    leftFacet(0, 0, w, h, dpth, tile);
    rightFacet(0, 0, w, h, dpth, tile);
    tile.line(sw/2, sw/2, w-dpth, sw/2);
    tile.line(sw/2, sw/2, sw/2, h-dpth);
    tile.line(dpth, h-sw/2, w, h-sw/2);
    tile.line(w-sw/2, dpth, w-sw/2, h);
    tile.noStroke();
  } else if (recta.cubeType == 4) {
    // full monochromatic cube, lines around the shapes
    let invertCols = random() < 1/4;
    tile.fill(invertCols ? strokeCol : palette[0]);
    tile.stroke(invertCols ? palette[0] : strokeCol);
    frontFacet(0, 0, w, h, dpth, tile);
    rightFacet(0, 0, w, h, dpth, tile);
    bottomFacet(0, 0, w, h, dpth, tile);
    tile.line(sw/2, sw/2, w-dpth, sw/2);
    tile.line(sw/2, sw/2, sw/2, h-dpth);
    tile.line(dpth, h-sw/2, w, h-sw/2);
    tile.line(w-sw/2, dpth, w-sw/2, h);
    tile.noStroke();
  } else if (recta.cubeType == 5) {
    // sides of the cube filled, front facet lined
    tile.fill(palette[0]);
    topFacet(0, 0, w, h, dpth, tile);
    tile.fill(palette[1]);
    leftFacet(0, 0, w, h, dpth, tile);
    tile.fill(palette[0]);
    bottomFacet(0, 0, w, h, dpth, tile);
    tile.fill(palette[1]);
    rightFacet(0, 0, w, h, dpth, tile);
    tile.stroke(palette[0]);
    tile.line(0, h-dpth, dpth, h);
    tile.stroke(palette[1]);
    tile.line(w-dpth, 0, w, dpth);
    tile.stroke(strokeCol);
    tile.noFill();
    frontFacet(0, 0, w, h, dpth, tile);
    tile.line(sw/2, sw/2, w-dpth, sw/2);
    tile.line(sw/2, sw/2, sw/2, h-dpth);
    tile.noStroke();
  } else {
    // two side facets have the same color, with a single line to separate them
    tile.fill(palette[1]);
    rightFacet(0, 0, w, h, dpth, tile);
    bottomFacet(0, 0, w, h, dpth, tile);
    tile.stroke(strokeCol);
    tile.line(w-dpth, h-dpth, w, h);
    tile.noStroke();
    tile.fill(palette[0]);
    frontFacet(0, 0, w, h, dpth, tile);
  }
  
  image(tile, x, y);
}
​
function frontFacet(x, y, w, h, dpth, tile) {
  tile.strokeJoin(MITER);
  tile.rect(x, y, w-dpth, h-dpth);
}
​
function backFacet(x, y, w, h, dpth, tile) {
  tile.strokeJoin(MITER);
  tile.rect(x+dpth, y+dpth, w-dpth, h-dpth);
}
​
function topFacet(x, y, w, h, dpth, tile) {
  tile.strokeJoin(ROUND);
  tile.quad(x, y, x+dpth, y+dpth, x+w, y+dpth, x+w-dpth, y);
}
​
function bottomFacet(x, y, w, h, dpth, tile) {
  tile.strokeJoin(ROUND);
  tile.quad(x+w, y+h, x+w-dpth, y+h-dpth, x, y+h-dpth, x+dpth, y+h);
}
​
function leftFacet(x, y, w, h, dpth, tile) {
  tile.strokeJoin(ROUND);
  tile.quad(x, y, x, y+h-dpth, x+dpth, y+h, x+dpth, y+dpth);
}
​
function rightFacet(x, y, w, h, dpth, tile) {
  tile.strokeJoin(ROUND);
  tile.quad(x+w, y+w, x+w, y+dpth, x+w-dpth, y, x+w-dpth, y+h-dpth);
}