onsa
12/19/2016 - 9:23 PM

Take a snapshot with webcam.

Take a snapshot with webcam.

var video, webcamStream, canvas, context;
navigator.getUserMedia = ( navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia);

//	bound to body tag's onload attribute
function init() {
  // get the canvas and obtain a context for drawing in it
  canvas = document.getElementById("canvas");
  context = canvas.getContext('2d');
}

//	bound to a button's onclick attribute
function startWebcam() {
	if (navigator.getUserMedia) {
    navigator.getUserMedia ({
      video: true,
      audio: false
    },
    // successCallback
    function(localMediaStream) {
      video = document.querySelector('video');
      video.src = window.URL.createObjectURL(localMediaStream);
      webcamStream = localMediaStream.getTracks()[0];
    },
    // errorCallback
    function(err) {
      console.log("The following error occured: " + err);
    });
	}	
}

//	bound to a button's onclick attribute
function stopWebcam() {
	webCamContents.stop();
}

//	bound to a button's onclick attribute
function snapshot() {
  // Draw current image from the video element into the canvas
  context.drawImage(video, 0,0, canvas.width, canvas.height);
}