camera.js
JavaScript wrapper for HTML5 camera input
MIT License
Stars
160
Ecosystems:
JavaScript
Camera.js
A simple wrapper around the HTML5 getUserMedia API, offering cross-browser access to the user's webcam video stream.
Usage
Upon initalization, the library asks the user for permission, sets up the necessary getUserMedia code and starts the stream. All parameters are optional, their default values are explained below.
The onFrame callback function is called each time there is a new frame to be processed, with respect to the fps option.
If you want the video stream to also be rendered in a <canvas> element, set the targetCanvas option to an element reference.
camera.init({
width: 160, // default: 640
height: 120, // default: 480
fps: 30, // default: 30
mirror: true, // default: false
targetCanvas: document.getElementById('webcam'), // default: null
onFrame: function(canvas) {
// do something with image data found in the canvas argument
},
onSuccess: function() {
// stream succesfully started, yay!
},
onError: function(error) {
// something went wrong on initialization
},
onNotSupported: function() {
// instruct the user to get a better browser
}
});
To pause the video capture, call camera.pause(). To resume, call camera.start().
Live examples
Supported browsers
- Chrome ≥ 21
- Firefox ≥ 17 (requires
media.navigator.enabled = trueinabout:config) - Opera ≥ 12
Author
Andrei Gheorghe
- About me
- LinkedIn: linkedin.com/in/idevelop
- Twitter: @idevelop
License
- This code is licensed under the MIT License.