​

let squares, num_squares, sq_size;

let grid;

​

function getRandomInt(min, max) {

  min = Math.ceil(min);

  max = Math.floor(max);

  return Math.floor(Math.random() * (max - min) + min); //The maximum is exclusive and the minimum is inclusive

}

​

function calcPos(row, col) {

  return { x: sq_size * col, y: sq_size * row };

}

​

function drawBG() {

  background(255);

​

  noFill();

  stroke(color(0, 0, 0, 120));

  strokeWeight(5.0);

​

  for (let y = 0; y < grid.length; y++) {

    for (let x = 0; x < grid.length; x++) {

      // let col = color(255);

      // if (grid[y][x].type == 1) col = color(0);

​

      fill(grid[y][x].color);

      stroke(color("#FF00FF"));

      strokeWeight(0.5);

      rect(x * sq_size, y * sq_size, sq_size, sq_size);

    }

  }

}

​

class Square {

  constructor() {

    this.row = getRandomInt(-1, -10);

    this.col = getRandomInt(0, num_squares);

    this.color = color(120);

  }

  update() {

    let nextRow = this.row + 1;

​

    if (nextRow > 0 && nextRow < num_squares - 1) {

      // let a = grid[this.row][this.col].color;

      // grid[this.row][this.col].color._array[3] -= 0.1;

      if (grid[nextRow][this.col].type == 1) {

        // left

​

        if (

          this.col > 0 &&

          grid[nextRow][this.col - 1].type == 0 &&

          this.col < num_squares - 1 &&

          grid[nextRow][this.col + 1].type == 0

        ) {

          if (random() > 0.5) this.col--;

          else this.col++;

          this.row++;

        } else if (this.col > 0 && grid[nextRow][this.col - 1].type == 0) {

          this.row++;

          this.col--;

        } else if (

          this.col < num_squares - 1 &&

          grid[nextRow][this.col + 1].type == 0

        ) {

          this.row++;

          this.col++;

        } else {

          return false;

        }

      } else this.row++;

    } else this.row++;

​

    // this.row++;

    if (this.row >= num_squares) {

      return false;

    }

    return true;

  }

​

  draw() {

    noStroke();

    fill(this.color);

    let pos = calcPos(this.row, this.col);

    square(pos.x+1, pos.y+1, sq_size-1);

  }

}

function setup() {

  createCanvas(1000, 1000);

​

  sq_size = 50;

  num_squares = int(width / sq_size);

​

  grid = new Array(num_squares);

  for (let y = 0; y < grid.length; y++) {

    grid[y] = new Array(num_squares);

    for (let x = 0; x < grid[y].length; x++) 

      grid[y][x] = {'type':0, 'color': color(255)};

  }

​

  for (let k = 0; k < int(width*0.05); k++) {

    let i = getRandomInt(1, num_squares);

    let j = getRandomInt(1, num_squares);

    grid[i][j] = {'type':1, 'color': color(0)};

  }

  squares = [];

​

  drawBG();

​

  for (let i = 0; i < num_squares; i++) squares.push(new Square());

​

  //   for (let y = sq_size; y <= width-sq_size; y += sq_size)

  //     line(sq_size,y,width-sq_size,y);

  //   for (let x = sq_size; x <= height-sq_size; x += sq_size)

  //     line(x,sq_size,x,height-sq_size);

​

  frameRate(20);

}

​

function draw() {

  drawBG();

​

  for (let i = squares.length - 1; i >= 0; i--) {

    let ret = squares[i].update();

    squares[i].draw();

    if (!ret) squares.splice(i, 1);

  }

  if (squares.length === 0) {

    console.log("done");

    noLoop();

  }

  if (random() > 0.9)

      squares.push(new Square());

  // noLoop();

}

​