createCanvas(windowWidth, windowHeight);

}

​

​

let framwCountCustom = 0;

function draw() {

framwCountCustom += 0.1;  

  background(0);

​

  let txt = "TWIST";

  let numberOfLines = 150;

  let lineSpacing = 11;

  push();

  fill("rgb(225,53,124)");

  blendMode(DIFFERENCE);

  translate(0, height/2  - (lineSpacing * numberOfLines)/2);

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

    let x0 = cos((framwCountCustom + j * 2) * 2 * 3) * 2 * 30;

    let y0 = lineSpacing * j;

​

    push();

    translate(x0, y0);

    let letterLocX = 0;

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

      let whichLetter = txt.charAt(i);

      let movementX = tan((framwCountCustom + i * 20 + j * 0.154) * 0.04 ) * 180 * 3;

      let txtSize = 90;

      // let txtSize = map(sin(((i+5) * (j+10) + framwCountCustom) * 2 * 10), -5, 10, 1, 50, 30, 20);

      let x1 = letterLocX + movementX;

      let y1 = 0;

​

      textSize(txtSize);

      text(whichLetter, x1, y1);

      letterLocX += textWidth(whichLetter);

    }

    pop();

  }

​

  pop();

}

​

function keyPressed() {

  if (key === 'f' || key === 'F') {

    enterFullscreen();

  }

}

​

/* enter fullscreen-mode via

 * https://editor.p5js.org/kjhollentoo/sketches/H199a0c-x

 */

function enterFullscreen() {

  var fs = fullscreen();

  if (!fs) {

    fullscreen(true);

  }

}

​

/* full screening will change the size of the canvas */

function windowResized() {

  resizeCanvas(windowWidth, windowHeight);

}

​