let xScale;

let yScale;

let modeX = 100;

let modeX_speed = 0.5;

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  noStroke();

​

  // camera setup

  camera = createCapture(VIDEO);

  camera.size(40, 30);

  camera.hide();

​

  // scale setup

  xScale = width / camera.width;

  yScale = height / camera.height;

}

​

function draw() {

  background(50);

​

  camera.loadPixels();

​

  modeX = modeX + modeX_speed;

  if (modeX > 300) {

    modeX_speed = -modeX_speed;

  } else if (modeX < 100) {

    modeX_speed = -modeX_speed;

  }

​

  // loop tho pixels

  for (let row = 0; row < camera.height; row++) {

    for (let col = camera.width; col >= 0; col--) {

​

      // get rgb values for each pixel

      let i = (col + row * camera.width) * 4;

      let r = camera.pixels[i + 0];

      let g = camera.pixels[i + 1];

      let b = camera.pixels[i + 2];

      let h = hue(color(r, g, b));

​

      if ((h >= 351 && h <= 360) || (h >= 0 && h < 21.5)) {

        h = 4;

        s = 96;

        l = 60;

      } // red

      else if (h >= 21.5 && h < 45.5) {

        h = 39;

        s = 98;

        l = 58;

      } // orange

      else if (h >= 45.5 && h < 73.5) {

        h = 52;

        s = 99;

        l = 60;

      } // bright orange

      else if (h >= 73.5 && h < 128) {

        h = 95;

        s = 65;

        l = 68;

      } // lime

      else if (h >= 128 && h < 182) {

        h = 161;

        s = 72;

        l = 47;

      } // bright green

      else if (h >= 182 && h < 208.5) {

        h = 203;

        s = 87;

        l = 58;

      } // dark azure

      else if (h >= 208.5 && h < 241.5) {

        h = 214;

        s = 86;

        l = 46;

      } // blue

      else if (h >= 241.5 && h < 303.5) {

        h = 269;

        s = 49;

        l = 46;

      } // dark purple      

      else if (h >= 303.5 && h < 351) {

        h = 338;

        s = 93;

        l = 62;

      } // dark pink

​

      colorMode(HSB, modeX);

​

      fill(r, g, b);

      rect((camera.width - col - 1) * xScale, row * yScale, xScale, yScale);

    }

  }

  camera.updatePixels();

}