var video;

var imgRain; 

​

let xOk=0;

let yOk;

let yOk2;

let yOk3;

let yOk4;

let yOk5;

​

let star;

let swan;

let thisT;

let tig;

let car;

​

let backtop;

let backBack;

​

let backtopType;

let giffff; 

let gifDog; 

let gifLoad; 

let gifSmile; 

​

var vScale = 4;

​

function setup() {

  createCanvas(windowWidth, windowWidth*9/16);

  pixelDensity(1);

  video = createCapture(VIDEO);

  video.size(width / vScale, height / vScale);

    colorMode(HSB,100);

  yOk = height

    yOk2 = height

    yOk3 = height

    yOk4 = height

    yOk5 = height

​

}

​

function preload() {

​

  imgRain = loadImage('rainbow.png');

    star = loadImage('star.png');

   swan = loadImage('swan.png');

   thisT = loadImage('this.png');

   tig = loadImage('tig.png');

   car = loadImage('car.png');

     giffff = loadImage('giphfe.gif');

     gifDog = loadImage('giphydog.gif');

     gifLoad = loadImage('gahh.gif');

     gifSmile = loadImage('giphyas.gif');

​

     backtop = loadImage('fg-03.png');

     backtopType = loadImage('fg-06.png');

     backBack = loadImage('fggh-07.png');

​

}

​

function draw() {

  background(255);

    imageMode(CENTER)

​

         image(backBack, width/2, height/2, width, height)

  video.loadPixels();

  for (var y = 0; y < video.height; y++) {

    for (var x = 0; x < video.width; x++) {

      var index = (video.width - x + 1 + (y * video.width)) * 4;

      var r = video.pixels[index + 0];

      var g = video.pixels[index + 1];

      var b = video.pixels[index + 2];

      var bright = (r + g + b) / 3;

      var w = map(bright, 0, 255, 0, vScale);

      noStroke();

​

     // fill(7*x, 25*y, 15*y);

      //colour

    //  let hue = map(0, width,0, 100, x);

    // fill(hue,255,255);

    //    rectMode(CENTER);

    //   rect(x * vScale, y * vScale, w, w);

      //white

         fill(0,0,100);

       rectMode(CENTER);

      rect(x * vScale, y * vScale, w, w);

      // or emoji

     // image(imgRain, x * vScale, y * vScale, w, w);

    }

  }

   imageMode(CENTER)

​

          image(backtop, width/2, height/2, width, height)

  let size = width/6 

    if (yOk < 10){

    yOk = height

  } else {

    imageMode(CENTER)

      image(star, width/6, yOk, size, size)

  yOk = lerp(yOk,0, 0.015);

  }

      if (yOk2 < 10){

    yOk2 = height

  } else {

    imageMode(CENTER)

          image(swan, width/6*2, yOk2, size, size)

  yOk2 = lerp(yOk2,0, 0.0068);

​

  }

     imageMode(CENTER)

​

          image(backtopType, width/2, height/2, width, height)

     if (yOk3 < 10){

    yOk3 = height

  } else {

    imageMode(CENTER)

          image(thisT, width/6*3, yOk3, size, size)

​

  yOk3 = lerp(yOk3,0, 0.01);

​

  }

       if (yOk4 < 10){

    yOk4 = height

  } else {

    imageMode(CENTER)

          image(tig, width/6*4, yOk4, size, size)

​

  yOk4 = lerp(yOk4,0, 0.0085);

  }

       if (yOk5 < 10){

    yOk5 = 0

  } else {

    imageMode(CENTER)

​

          image(car, width/6*5, yOk5, size, size)

​

​

  yOk5 = lerp(yOk5, 0, 0.008);

  }

   imageMode(CENTER)

​

          image(giffff, width-width/9, height/9, size, size)

      image(gifDog, width-width/9, height-height/9, size-80, size-80)

      image(giffff, width/9, height/9, size, size)

      image(gifLoad, width/9, height-height/9, size-80, size-80)

​

}