// one texture, different parts assigned to 

// different shapes.

//using an image instead of text

​

let font;

let blocks;

let buffer;

let tex;

​

function preload() {

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

  tex = loadImage("plastic.jpg");

}

​

function setup() {

  createCanvas(windowWidth, windowHeight, WEBGL);

  textFont(font);

  textSize(24);

  textLeading(24);

​

}

​

​

​

function draw() {

  background(0);

    // image(tex, -width/2, -height/2,width, height);

​

​

​

  push();

  translate(-tex.width/2, -tex.height/2 + 20);

  // rotateZ(-0.4);

  // rotateY(-0.7);

​

  randomSeed(5);

  let minIndex = 0;

  let maxIndex = 11; // max is 30

  let xOffset = [];

  //x position of each box

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

    // xOffset[i] = 0;

        xOffset[i] = random(0,200);

​

  }

​

  // using beginShape and endShape to display

  // different part of a texture per shape.

  // 

  texture(tex);

  textureMode(NORMAL);

  for (let i = minIndex; i < maxIndex; i++) {

// rotate

                rotateX((frameCount + i * 1) * 0.005);

​

            rotateY((frameCount + i * 1) * 0.005);

​

    // y-starting point from which to read texture

    let y0 = 24;       

    // spacing between text-lines from texture

    let spacing =  76;  

    // height of shape onto which texture segments are mapped

    let h = 72;        

    push();

    // 1 position shape with texture 

    let x = tan((frameCount + i * 30) * 0.01) * 50;

    translate(x + xOffset[i], (h+0) * (i - minIndex));

    // 2 map and normalise texture coordinates

    //map(value, start1, stop1, start2, stop2)

​

    let y1 = map(y0 + i * spacing, 0, tex.height, 0, 1);

    let y2 = map(y0 + (i + 1) * spacing, 0, tex.height, 0, 1);

    let x1 = map(0, 0, tex.height, 0, 1);

    // 3 draw shape with texture coordinates

    beginShape();

    vertex(0, 0, x1, y1);

    vertex(733, 0, 1, y1);

    vertex(733, h, 1, y2);

    vertex(0, h, x1, y2);

    endShape();

​

    pop();

​

  }

  pop();

  // push();

  // translate(-width/2, -height/2);

  // translate(50,80);

  // fill(0);

  // // \ln for line break

  // text("No Boundaries\nby Kris Allen",0,0);

  // pop();

}