My OperaThe My Opera forums have been replaced with forums.opera.com. Please head over there to discuss Opera's products and features
See the new ForumsThis topic has been closed. No new entries allowed.
Reason: You can now post comments on articles on Dev Opera
You need to be logged in to post in the forums. If you do not have an account, please sign up first.
Playing with HTML5 video and getUserMedia support
Building on the famous exploding video demo by Sean Christmann, we're going to see how we can explode the video stream from a camera. With a few performance tweaks, this works surprisingly well both in desktop browser and on mobile devices.( Read the article )
You can get the webcam ratio by dividing the video's dimensions. Something like this should work:
// Assign the <video> element to a variable
var video = document.getElementById('sourcevid');
// Change the video source to the webcam
if (navigator.getUserMedia) {
navigator.getUserMedia('video', successCallback, errorCallback);
function successCallback(stream) {
video.src = stream;
}
function errorCallback(error) {
console.error('An error occurred: [CODE ' + error.code + ']');
return;
}
} else {
console.log('Native web camera streaming (getUserMedia) is not supported in this browser.');
return;
}
// Calculate the webcam ratio
var ratio = video.videoWidth / video.videoHeight;
