/* 

function preload(){

   font = loadFont("Fuji-Bold.otf");

    //img = loadImage('IMG-5153.JPG');

}

*/

​

​

function setup() {

  createCanvas(1080, 200);

  pg = createGraphics(1080, 200);

}

​

​

​

function draw() {

  background('#f7ff56');

​

​

  // PGraphics 

  pg.fill('#032d3c');

  //pg.textFont(font);

  pg.textSize(180);

  pg.textAlign(CENTER, CENTER);

  pg.text("typography", width/2, height/2);

  //pg.text("world", width/2, 150);

  //pg.text("bonjour", width/2, 250);

​

​

  let tilesX = 40;//a changer

  let tilesY = 4;//à changer

​

  let tileW = int(width/tilesX);

  let tileH = int(height/tilesY);

​

  for (let y = 0; y < tilesY; y++) {

    for (let x = 0; x < tilesX; x++) {

​

      // WARP

      let speed = 0.05;

      let deform = 0.01;

      let amplitude = 200;//mouseX

      let wave = int(sin(frameCount * speed + ( x * y) * deform) * amplitude);

​

      // SOURCE

      let sx = x*tileW + wave;

      let sy = y*tileH;

      let sw = tileW;

      let sh = tileH;

​

​

      // DESTINATION

      let dx = x*tileW;

      let dy = y*tileH;

      let dw = tileW;

      let dh = tileH;

      copy(pg, sx, sy, sw, sh, dx, dy, dw, dh);

​

    }

  }

  text(mouseX, 10, height - 20);

​

}

​

​