diff options
| author | Jules Laplace <jules@okfoc.us> | 2015-04-22 05:21:11 -0400 |
|---|---|---|
| committer | Jules Laplace <jules@okfoc.us> | 2015-04-22 05:21:11 -0400 |
| commit | bef106de9fa827d983fa319cecdf688c2822efb9 (patch) | |
| tree | d336ec726e97e5c19cb0dfee56d2bf4912d0db29 /webcam.html | |
smartblur convolution experiment
Diffstat (limited to 'webcam.html')
| -rw-r--r-- | webcam.html | 55 |
1 files changed, 55 insertions, 0 deletions
diff --git a/webcam.html b/webcam.html new file mode 100644 index 0000000..a2b9519 --- /dev/null +++ b/webcam.html @@ -0,0 +1,55 @@ +<style> +canvas { display: inline-block; } +</style> +<body></body> +<script src="convolve.js"></script> +<script src="smartblur.js"></script> +<script src="fetch.js"></script> +<script> + +navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia; +function getStream(cb){ + var constraints = { + video: true, + audio: false + } + navigator.getUserMedia(constraints, success, error); + function success (stream) { + var video = document.createElement("video") + video.src = window.URL.createObjectURL(stream) + video.play() + cb(video) + } + function error(error){ + console.log('navigator.getUserMedia error: ', error); + } +} + +var smart_blur = new SmartBlurFilter () +var cam = document.createElement("canvas"), camctx = cam.getContext('2d') +var blurred = document.createElement("canvas") +document.body.appendChild(blurred) + +var camera +getStream(function(video){ + camera = video + document.body.appendChild(camera) + wait() +}) + +function wait () { + if (! camera.videoWidth) return requestAnimationFrame(wait) + cam.width = blurred.width = camera.videoWidth + cam.height = blurred.height = camera.videoHeight + animate() +} +function animate () { + requestAnimationFrame(animate) + + camctx.drawImage(camera,0,0,cam.width,cam.height) + smart_blur.blur(cam, blurred) +} + + +</script> + |