let vidScale = 8;

let slider;

let median;

let bgCol = 0;

let ptCol;

​

function setup() {

  createCanvas(640, 480);

  pixelDensity(1);

​

  vid = createCapture(VIDEO);

  vid.size(width / vidScale, height / vidScale);

  vid.hide();

​

  slider = createSlider(0, vidScale, 0);

}

​

function draw() {

  background(bgCol);

​

  vid.loadPixels();

​

  loadPixels();

​

  for (x = 0; x < vid.width + vidScale; x++) {

    for (y = y = 0; y < vid.height + vidScale ; y++) {

      let index = (vid.width - x + 1 + y * vid.width) * 4;

      let red = vid.pixels[index];

      let green = vid.pixels[index + 1];

      let blue = vid.pixels[index + 2];

​

      let brightness = (red + green + blue) / 3;

      median = slider.value();

​

      if (median == 0) {

        // yellow

        ptCol = color(255, 213, 0);

        // purple

        bgCol = color(119, 10, 131);

      } else if (median == 1) {

        // green

        ptCol = color(12, 245, 1);

        // red

        bgCol = color(176, 1, 80);

      } else if (median == 2) {

        // teal

        ptCol = color(4, 254, 174);

        // brown

        bgCol = color(173, 83, 1);

      } else if (median == 3) {

        // blue

        ptCol = color(26, 190, 255);

        // chocolate

        bgCol = color(100, 64, 10);

      } else if (median == 4) {

        // mauve

        ptCol = color(197,103,245);

        // dark purple

        bgCol = color(63,27,134);

        } else if (median == 5) {

        // pink

        ptCol = color(255,0,152);

        // dark purple

        bgCol = color(66,87,15)

          } else if (median == 6) {

       // orange

        ptCol = color(249,119,24)

        // dark blue

        bgCol = color(41,111,138)

          }else if (median == 7) {

       // grey1

        ptCol = color(179, 189, 179)

        // grey2

        bgCol = color(141, 148, 141)

          }else {

        // white

        ptCol = color(255)

        // black

        bgCol = color(0)

          }

​

      fill(ptCol);

​

      noStroke();

      radius = map(brightness, 0, 255, 0, vidScale);

​

      circle(x * vidScale, y * vidScale, radius);

    }

  }

}

​

​