// A 6-inch (15 cm) grid covering the wall. Within each square, not straight lines in either of four directions. Only one direction in each square but as many as desired, and at least one line in each square.

let directions;
const tileSize = 100;

function setup() {
  createCanvas(800, 600);
  frameRate(2);
  
  directions = [
    createVector(1, 0),
    createVector(0, 1),
    createVector(1, 1).normalize(),
    createVector(1, -1).normalize()
  ];
}

function randomInBox(topLeft, bottomRight) {
  return createVector(
    random(topLeft.x, bottomRight.x),
    random(topLeft.y, bottomRight.y)
  );
}

function endpoints(anchor, direction, topLeft, bottomRight) {
  let ptLeft = null;
  let ptRight = null;
  let ptTop = null;
  let ptBottom = null;
  
  if (direction.x !== 0) {
    ptLeft = anchor.copy().add(direction.copy().setMag((topLeft.x - anchor.x) / direction.x));
    ptRight = anchor.copy().add(direction.copy().setMag((bottomRight.x - anchor.x) / direction.x));
    if (ptLeft.y < topLeft.y || ptLeft.y > bottomRight.y) {
      ptLeft = null;
    }
    if (ptRight.y < topLeft.y || ptRight.y > bottomRight.y) {
      ptRight = null;
    }
  }
  if (direction.y !== 0) {
    ptTop = anchor.copy().add(direction.copy().setMag((topLeft.y - anchor.y) / direction.y));
    ptBottom = anchor.copy().add(direction.copy().setMag((bottomRight.y - anchor.y) / direction.y));
    if (ptTop.x < topLeft.x || ptTop.x > bottomRight.x) {
      ptTop = null;
    }
    if (ptBottom.x < topLeft.x || ptBottom.x > bottomRight.x) {
      ptBottom = null;
    }
  }
  
  return [ptLeft, ptRight, ptTop, ptBottom].filter(pt => pt !== null);
}

function wigglyLine(x1, y1, x2, y2) {
  const vertices = [];
  for (let t = 0; t <= 1; t += 0.01) {
    const x = x1 + (x2-x1)*t;
    const y = y1 + (y2-y1)*t;
    const x_perturbed = x + 10*noise(x/50, y/50, 0);
    const y_perturbed = y + 10*noise(x/50, y/50, 1000);
    vertices.push([x_perturbed, y_perturbed]);
  }

  beginShape();
  vertices.forEach(([x, y]) =>  vertex(x, y));
  endShape();
}

function draw() {
  background(255);
  strokeWeight(1);
  stroke(0);
  for (let x = 0; x < width; x += tileSize) {
    for (let y = 0; y < height; y += tileSize) {
      const topLeft = createVector(x, y);
      const bottomRight = createVector(x+tileSize, y+tileSize);
      
      const direction = random(directions);
      const numLines = random(1, 30);
      
      for (let l = 0; l < numLines; l++) {
        const anchor = randomInBox(topLeft, bottomRight);
        const pts = endpoints(anchor, direction, topLeft, bottomRight);
        if (pts.length !== 2) continue;
        wigglyLine(pts[0].x, pts[0].y, pts[1].x, pts[1].y);
      }
    }
  }
}

function mousePressed() {
  draw();
}