Hi, I'm good at this, I do not understand why it is necessary to do an if here, (navigator.mediaDevices & & navigator.mediaDevices.getUserMedia), if my mediaDevices object and my getUserMedia method is true enter the block, but I could skip this step, right? I do not understand that part very well
let video = document.getElementById('video');
let canvas = document.getElementById('canvas');
let context = canvas.getContext('2d');
//mediaDevices es sub-objeto, getUserMedia es metodo de mediaDevices
if(navigator.mediaDevices && navigator.mediaDevices.getUserMedia) { // la segunda retorna true si objeto navigator si tiene mediadevices
// then tecibe una function como parametro, then determina la respuesta a una espera si acepto o rechazo...
navigator.mediaDevices.getUserMedia({ video: true, audio: false }).then( function(reproduccion) {
video.src = window.URL.createObjectURL(reproduccion);//le doy como valor una url ficticia para el stream
video.play();
});
}
document.getElementById("foto").onclick = function() {
video = document.getElementById('video');
context.drawImage(video, 0, 0, 640, 480);// drawImage method recibe la imagen que es el video, 0 distancia del eje xy eje y, ancho 640 alto 480
}
console.log(typeof navigator.mediaDevices.getUserMedia);<html>
<head>
<meta charset="utf-8">
<title>getUserMedia API</title>
</head>
<body>
<button id="foto">¡Sácate unas fotos!</button>
<video id="video" width="640" height="480"></video>
<canvas id="canvas" width="640" height="480"></canvas>ç
</body>
</div>
</html>