stream-api/frontend/script.js

(() => {
    const findUpstreamVideo = () => {
        const search = new URLSearchParams(location.search);
        search.set("render", "false");
        const url = new URL(location.origin);
        url.pathname = location.pathname;
        url.search = search.toString();
        return url.href;
    }

    const upstream = findUpstreamVideo();
    const xhr = new XMLHttpRequest();
    xhr.open("HEAD", upstream, true);
    xhr.send();

    let count = 2;
    const handleCount = () => {
        if(--count === 0) {
            handle();
        }
    }

    const handle = () => {
        const [body] = document.getElementsByTagName("body");
        const video = document.createElement("video");
        video.className = "video-js vjs-big-play-centered";
        body.appendChild(video);
        const ctype = xhr.getResponseHeader("Content-Type");
        const image = xhr.getResponseHeader("Custom-Poster");
        console.log(ctype);
        const options = {};
        options.controls = true;
        options.liveui = true;
        options.responsive = true;
        options.fill = true;
        options.techOrder = ["chromecast", "html5"];
        options.plugins = {};
        options.plugins.chromecast = {};
        options.plugins.chromecast.addButtonToControlBar = false;
        const player = videojs(video, options);
        if((image instanceof String) || ((typeof image) == "string")) {
            player.poster(image);
        }
        const source = {};
        source.type = ctype;
        source.src = upstream;
        player.src(source);
        const canPlayTypeRaw = player.canPlayType(ctype);
        const canPlayType = (canPlayTypeRaw === "maybe") || (canPlayTypeRaw === "probably");
        if(canPlayType) {
            const Button = videojs.getComponent("Button");
            const cbutton = {};
            cbutton.clickHandler = (ev) => {
                player.trigger("chromecastRequested");
            }
            cbutton.text = "Chromecast";

            const bigCastButton = new Button(player, cbutton);
            bigCastButton.addClass("fab");
            bigCastButton.addClass("fa-chromecast");
            bigCastButton.addClass("vjs-control");
            bigCastButton.addClass("vjs-button");
            bigCastButton.addClass("vjs-big-chromecast");
            player.addChild(bigCastButton);
            
            player.one("error", () => {
                player.removeChild(bigCastButton);
            });

            player.one("play", () => {
                player.removeChild(bigCastButton);
            });

            const smallCastButton = new Button(player, cbutton);
            smallCastButton.addClass("fab");
            smallCastButton.addClass("fa-chromecast");
            smallCastButton.addClass("vjs-control");
            smallCastButton.addClass("vjs-button");
            player.controlBar.addChild(smallCastButton);
            player.on("chromecastConnected", () => {
                if(player.volume() > 0.3) {
                    player.volume(0.2);
                }
            });
        }
    }
    document.addEventListener("DOMContentLoaded", handleCount);
    xhr.addEventListener("load", handleCount);
})();