let tiles;

let n = 10;

let bg, fg;

let buffer1;

let buffer2;

​

​

function preload() {

  font = loadFont("Smokum-Regular.ttf");

}

​

function setup() {

  createCanvas(windowWidth, windowHeight, WEBGL);

  bg = color(255,random(255));

  fg = color(255,20,147);

  tiles = [];

  let w = windowWidth/n;

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

    let tile = createGraphics(w, 600);

    tile.background(255);

    tile.textFont(font);

    tile.textSize(110);

    tiles.push(tile);

  }

  console.log(document.getElementsByClassName("preview-nav").style)

}

​

function draw() {

  background(255,255,255);

  scale(2.5 + (frameCount*0.001) * 5);

  translate(-width/10, -height / 6);

  lights();

​

  let w = windowWidth/n;

  tiles.forEach((tile, i) => {

    tile.background(bg);

    let x = (-sin((frameCount *i * 5) * 0.02)*10) - i * w;

    let y = 200 + ((frameCount + i * 10) * 0.01) * 10;

    tile.fill(fg);

    tile.text("GLITCH", x, y);

    push();

    translate(i * w, 200+i)*i;

    rotateX(tan(frameCount + i * 20) * 0.05);

    rotateY(sin(frameCount + i * 20) * 0.05);

    translate(0, -200);

    image(tile, 0, 0);

    pop();

  });

​

}