2f:T485,{ if (webcam) { // check to make sure that the user's browser supports the JavaScript getUserMedia API if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) { let webcamStream = null; try { // prompts for user's permission to use their webcam // prefer front camera if both front (facingMode: "user") & rear (facingMode: "environment") cameras are available webcamStream = await navigator.mediaDevices.getUserMedia({ audio: false, video: { facingMode: "user"} }); } catch (error) { console.log("Something went wrong while fetching video stream from webcam."); } // check for old browsers that do not support srcObject attribute. if ("srcObject" in video) { video.srcObject = webcamStream; } else { video.src = window.URL.createObjectURL(webcamStream); } } else { // User's browser does not support JavaScript's getUserMedia API. console.log("Are you a dinosaur?"); } } else { if (video.srcObject) { const tracks = video.srcObject.getTracks(); tracks.forEach(track => track.stop()); } } }30:[] 2d:{"title":"Accessing your webcam in HTML","cells":[{"id":0,"value":"# Accessing your webcam in HTML\nHistorically, you couldn't access webcams with web technologies. You needed to use plugins to access data from webcams e.g. Silverlight, Flash etc. Now, the web APIs have become powerful enough to access them.\n\nThere are two critical components—\n1. [HTML `video` element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video): take the video stream from your webcam and display it in the browser.\n2. [JavaScript `getUserMedia` API](https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia): allows us to—\n 1. Specify the data type: video from webcam, audio from microphone, or both.\n 2. If the user grants permission, call a success function, else call an error function.","pinned":false,"hidden":false,"mode":"md"},{"id":53,"value":"viewof webcam = Inputs.toggle({label: \"Switch on webcam?\", value: false})","pinned":false,"hidden":false,"mode":"ojs"},{"id":65,"value":"video = htl.html`