let cap;

​

function preload() {

  img = createCapture(VIDEO);

  img.size(750, 600);

  img.position(750, 0);

  img.hide();

​

}

​

​

function setup() {

​

  createCanvas(750, 600);

  colorMode(HSB);

  slider = createSlider(0, 360, 60, 40);

  slider.position(10, 10);

  slider.style('width', '80px');

​

}

​

​

​

function draw() {

​

  let val = slider.value();

  background(255, val, val, 1);

  let cap = img.get();

  for (let x = 0; x < img.width; x += 10) {

    for (let y = 0; y < img.width; y += 10) {

      let c = img.get(x, y);

​

​

      fill(val, 100, 100, 1);

​

      //fill('white');

​

      noStroke();

​

​

​

      let brit = int(brightness(img.get(x, y)));

​

​

​

      if (brit >= 0 && brit <= 10) {

        updateText('.', x, y);

​

      } else if (brit >= 11 && brit <= 20) {

        updateText('*', x, y);

​

      } else if (brit >= 21 && brit <= 30) {

        updateText('!', x, y);

​

      } else if (brit >= 31 && brit <= 40) {

        updateText('/', x, y);

​

      } else if (brit >= 41 && brit <= 50) {

        updateText('+', x, y);

​

      } else if (brit >= 51 && brit <= 60) {

        updateText('=', x, y);

      } else if (brit >= 61 && brit <= 70) {

        updateText('o', x, y);

​

      } else if (brit >= 71 && brit <= 90) {

        updateText('O', x, y);

​

      } else if (brit >= 91 && brit <= 100) {

        updateText('@', x, y);

      }

​

​

    }

​

  }

​

}

​

​

function updateText(word, a, b) {

  textSize(8);

  text(word, a, b);

}