----- Coding Tutorial by Patt Vira ----- 

Name: 

Video Tutorial: 

​

Connect with Patt: @pattvira

https://www.pattvira.com/

----------------------------------------

*/

​

// Clock variables

let font; let fontSize = 150; 

let xPos = 35; let yPos = 250;

let sampleFactor = 0.1;

let points = []; 

let msg; 

​

function preload() {

  font = loadFont("fonts/Roboto-Regular.ttf");

}

​

// Grid variables 

let cols; let rows; let size = 10;

let grid = [];

let clock = [];

let distFromClock = 10;

​

// Color variables

let hueValue = 0; 

​

function setup() {

  createCanvas(800, 400);

  colorMode(HSB, 255);

  cols = width/size;

  rows = height/size; 

  for (let i=0; i<cols; i++) {

    grid[i] = [];

    clock[i] = [];

    for (let j=0; j<rows; j++) {

      grid[i][j] = 0;

      clock[i][j] = false;

    }

  }

}

​

function draw() {

  background(0);

  let h_msg = doubleDigits(hour());

  let m_msg = doubleDigits(minute());

  let s_msg = doubleDigits(second());

  msg = h_msg + " : " + m_msg + " : " + s_msg;

  points = font.textToPoints(msg, xPos, yPos, fontSize, {

    sampleFactor:sampleFactor,

    simplifyThreshold: 0

  });

  let distance;

  for (let i=0; i<cols; i++) {

    for (let j=0; j<rows; j++) {

      for (let k=0; k<points.length; k++){

          distance = dist(points[k].x, points[k].y, i*size, j*size);

​

          if (distance < distFromClock) {

            grid[i][j] = 1;

            clock[i][j] = true;

          } 

      }

      noFill();

      if (grid[i][j] == 1) {

        stroke(255);

      } else {

        noStroke();

      }

      rect(i*size, j*size, size, size); 

      // if (clock[i][j] == true) {

      //   stroke(hueValue, 255, 255);

      // } else {

      //   noStroke();

      // }

      // rect(i*size, j*size, size, size); 

      // clock[i][j] = false;

    }

  }

  // displayPoints();

  updateGrid();

  if (hueValue > 255) {

    hueValue = 0;

  }

  hueValue += 5;

}

​

function doubleDigits(integer) {

  let intToStr = integer.toString();

  let msg; 

  if (intToStr.length == 1) {

    msg = "0"+intToStr;

  } else {

    msg = intToStr;

  }

  return msg;

}

​

function displayPoints() {

  for (let i=0; i<points.length; i++){

      stroke(255);

      noFill();

      rect(points[i].x, points[i].y, 10, 10);

    }

}

​

function updateGrid() {

    let nextGen = [];

    for (let i=0; i<cols; i++) {

      nextGen[i] = [];

      for (let j=0; j<rows; j++) {

​

          let n = neighboringStates(grid, i, j);

          if (grid[i][j] == 1 && n < 2) {

            nextGen[i][j] = 0;

          } else if (grid[i][j] == 1 && (n == 2 || n ==3 )) {

            nextGen[i][j] = 1;

          } else if (grid[i][j] == 1 && n > 3) {

            nextGen[i][j] = 0;

          } else if (grid[i][j] == 0 && n == 3) {

            nextGen[i][j] = 1;

          } else {

            nextGen[i][j] = grid[i][j];

          }

        }

​

​

    }

    grid = nextGen;

}

​

function neighboringStates(grid, x, y) {

    let sum = 0;

    for (let i=-1; i<2; i++) {

      for (let j=-1; j<2; j++) {

        let xIndex = (x + i + cols) % cols;

        let yIndex = (y + j + rows) % rows;

        sum += grid[xIndex][yIndex];

      }

    }

    sum -= grid[x][y];

    return sum;

  }

​