// Feb 15, 2023

// peskythisdot

​

const edge = 400;

let angleX = 0;

let angleY = 0;

let angleZ = 0;

let m1;

let m2;

let grid = [];

let detailX = 10;

let detailY = 1;

​

function setup() {

  createCanvas(500, 500, WEBGL);

  colorMode(HSB);

  getGrid(detailX, detailY);

}

​

function draw() {

  background(30);

  orbitControl(2, 1, 0.05);

  directionalLight(30, 30, 80, 1, 0, -1);

  specularMaterial(30, 30, 80);

​

  // Triangle strip ////////////////////

  push();

  translate(-200, -100);

  m1 = createTriangle(detailX, detailY);

  model(m1);

  pop();

​

  // Geometry, following the example ///////////

  push();

  translate(-200, 100);

  m2 = createGeometry(detailX, detailY);

  model(m2);

  pop();

​

  //noLoop();

}

​

function getGrid(detailX, detailY) {

  let x;

  let y;

  let z;

​

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

    grid[i] = [];

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

      x = i * 40;

      y = j * 40;

      if (i % 2 == 0) {

        z = -10;

      }

      else {

        z = 0;

      }

      grid[i][j] = new p5.Vector(x, y, z);

    }

  }

  //print(grid);

  return grid;

}

​

function createTriangle(detailX, detailY) {

  //noStroke();

  stroke(30, 30, 100);

  return new p5.Geometry(

    detailX,

    detailY,

    function () {

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

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

          this.vertices.push(grid[i][j], grid[i + 1][j], grid[i][j + 1]);

          const c = j * 3 * 2 * detailX + i * 6;

          this.faces.push([c, c + 1, c + 2]);

          this.vertices.push(grid[i + 1][j], grid[i + 1][j + 1], grid[i][j + 1]);

          this.faces.push([c + 3, c + 4, c + 5]);

        }

      }

      // print(this.vertices);

      //this.computeFaces();

      this.computeNormals();

      this.gid = 'triangle'

    }

  );

}

​

function createGeometry(detailX, detailY) {

  //noStroke();

  stroke(30, 30, 100);

  return new p5.Geometry(

    detailX,

    detailY,

    function () {

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

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

          x = 40 * i;

          y = 40 * j

          if (i % 2 == 0) {

            z = -10;

          }

          else {

            z = 0;

          }

          this.vertices.push(new p5.Vector(x, y, z));

        }

      }

      // print(this.vertices);

      this.computeFaces();

      this.computeNormals();

      this.gid = 'Geometry'

    }

  );

}

​