Webcam Feedback

let capture

let currComposite

let prevComposite

let currFrame

let prevFrame

let currDiff

let prevDiff

let frameMask

let opShader

let maskShader

​

function setup() {

  createCanvas(windowWidth, windowHeight, WEBGL)

  capture = createCapture(VIDEO)

  capture.hide()

  currComposite = createFramebuffer()

  prevComposite = createFramebuffer()

  currFrame = createFramebuffer()

  prevFrame = createFramebuffer()

  currDiff = createFramebuffer()

  prevDiff = createFramebuffer()

  frameMask = createFramebuffer()

  opShader = createShader(...opShaderSource())

  maskShader = createShader(...maskShaderSource())

}

​

function draw() {

  [currComposite, prevComposite] = [prevComposite, currComposite];

  [currFrame, prevFrame] = [prevFrame, currFrame];

  [currDiff, prevDiff] = [prevDiff, currDiff];

  currFrame.draw(() => {

    push()

    imageMode(CENTER)

    scale(-1, 1) // Flip webcam

    image(capture, 0, 0, width, height, 0, 0, capture.width, capture.height, COVER)

    pop()

  })

  const OP_DIFFERENCE = 0

  const OP_SUBTRACT = 1

  currDiff.draw(() => {

    clear()

    push()

    noStroke()

    shader(opShader)

    opShader.setUniform('a', currFrame.color)

    opShader.setUniform('b', prevFrame.color)

    opShader.setUniform('op', OP_DIFFERENCE)

    plane(width, height)

    pop()

  })

  frameMask.draw(() => {

    push()

    noStroke()

    shader(opShader)

    opShader.setUniform('a', currDiff.color)

    opShader.setUniform('b', prevDiff.color)

    opShader.setUniform('op', OP_SUBTRACT)

    plane(width, height)

    pop()

  })

  currComposite.draw(() => {

    clear()

    push()

    rotate(0.01 * sin(millis() * 0.001))

    scale(1.005)

    colorMode(HSB, 360, 100, 100)

    tint(map(sin(millis() * 0.0002), -1, 1, 0, 360), 1, 100, 255)

    image(prevComposite, 0, 0)

    pop()

    push()

    shader(maskShader)

    maskShader.setUniform('content', currFrame.color)

    maskShader.setUniform('mask', frameMask.color)

    noStroke()

    plane(width, height)

    pop()

  })

  imageMode(CENTER)

  image(currComposite, 0, 0)

}