JSFiddle - React, Tailwind, and code Playground

by Nick Hulea

JavaScript

var viewportWidth = document.documentElement.clientWidth,
    viewportHeight = document.documentElement.clientHeight;

var video;
var n = navigator;
var $vidCanvas = $('<canvas id="vid" ></canvas>');
var vidCanvas = $vidCanvas[0];
vidCanvas.width = viewportWidth;
vidCanvas.style.cssText = 'width:100%;z-index:1000000000;';



var ctx = vidCanvas.getContext("2d");
var elem = document.getElementById("main_overlay");
var btnStop = document.getElementById("close_overlay");

if (elem.offsetWidth !== 0 && elem.offsetHeight !== 0) {

    if (vidCanvas) {

        function onSuccess(stream) {
            video = document.createElement('video');
            var source;

            if (stream) {
                var url = window.URL || window.webkitURL;
                if (url) {
                    source = url.createObjectURL(stream);
                } else {
                    source = stream;
                }
            } else {
                source = "http://eyahuska.com/vid/space.webm";
            }

            video.src = source;
            video.width = 100;
            video.height = 100;
            video.loop = true;
            video.load();
            video.play();

            btnStop.addEventListener("click", function () {
                video.pause();
            });


        }

        function onError(e) {
            console.log("Error getting video cam");
            console.log(arguments);
            onSuccess(null);
        }

        n.getUserMedia_ = n.getUserMedia || n.webkitGetUserMedia || n.mozGetUserMedia || n.msGetUserMedia;

        if (n.getUserMedia_) {
            try {
                n.getUserMedia_({
                    video: true,
                    audio: false
                }, onSuccess, onError);
            } catch (e) {
                n.webkitGetUserMedia('video', onSuccess, onError);
            }
        } else {
            onSuccess(null);
        }
    }

} else if (elem.offsetWidth === 0 && elem.offsetHeight...