​

let vid;

let playing = true;

let vidX = 0;

​

function setup() {

  // Load the video with a callback function

  vid = createVideo('ocean.m4v', vidLoaded);

​

}

​

// callback function

function vidLoaded() {

  createCanvas(vid.width, vid.height);

  vid.hide();

  vid.play();

  vid.loop();

  vid.speed(2);

​

}

​

​

function draw() {

  background(220);

  // Fill the canvas

  image(vid, 0,0);

  // Draw a distorted version

  image(vid, 50, 50, 150, 150);

  // Flip it

  push();

  translate(width, 0);

  scale(-1,1);

  image(vid, 50, 50, 150, 150);

  pop();

  // Move it

  image(vid, vidX, 0, 30, 360);

  if (vidX < width) vidX++;

  else vidX = 0;

​

}

​

​

// Toggle playback

function mousePressed() {

  if (playing) vid.pause();

  else vid.loop();

  playing = !playing;

}

​