Skip to content

Instantly share code, notes, and snippets.

@Christopher-Hayes
Created July 31, 2021 05:25
Show Gist options
  • Save Christopher-Hayes/3be432dbb564390407d41f9372998098 to your computer and use it in GitHub Desktop.
Save Christopher-Hayes/3be432dbb564390407d41f9372998098 to your computer and use it in GitHub Desktop.
Preview Camera before Joining a Call
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
* { margin: 0; padding: 0; }
html, body { text-align: center; overflow: hidden; background-color: black; }
#video { height: 100vh;width: auto; display: inline-block; }
</style>
</head>
<body>
<video id="video" autoplay></video>
<script>
// Grab elements, create settings, etc.
var video = document.getElementById('video');
// Get access to the camera!
if(navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
navigator.mediaDevices.getUserMedia({ video: true }).then(function(stream) {
video.srcObject = stream;
video.play();
});
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment