88 lines
3.5 KiB
Plaintext
88 lines
3.5 KiB
Plaintext
{% extends "base.njk" %}
|
|
{% block head %}
|
|
<!--<script src="/videojs/video.min.js"></script>
|
|
<link rel="stylesheet" type="text/css" href="/videojs/video-js.min.css">-->
|
|
<script src="/dashjs/dash.all.min.js"></script>
|
|
<script>
|
|
async function startVideo(){
|
|
//var url = "/live/{{username}}/index.mpd";
|
|
//var player = dashjs.MediaPlayer().create();
|
|
//player.initialize(document.querySelector("#videoPlayer"), url, true);
|
|
//console.log('called startvideo');
|
|
while(true){
|
|
if(!document.querySelector('#videoPlayer'))
|
|
break;
|
|
|
|
if(window.location.pathname.substring(window.location.pathname.length - 1) !== '/'){
|
|
var url = "/api/"+window.location.pathname.substring(7)+"/config";
|
|
console.log(url)
|
|
var xhr = JSON.parse(await makeRequest("GET", url));
|
|
if(xhr.live){
|
|
var player = dashjs.MediaPlayer().create();
|
|
player.initialize(document.querySelector("#videoPlayer"), url, true);
|
|
break;
|
|
}
|
|
}
|
|
|
|
else{
|
|
var url = "/api/"+window.location.pathname.substring(7, window.location.pathname.length - 1)+"/config";
|
|
console.log(url)
|
|
var xhr = JSON.parse(await makeRequest("GET", url));
|
|
if(xhr.live){
|
|
var player = dashjs.MediaPlayer().create();
|
|
player.initialize(document.querySelector("#videoPlayer"), url, true);
|
|
break;
|
|
}
|
|
}
|
|
await sleep(60000);
|
|
}
|
|
}
|
|
|
|
function sleep(ms) {
|
|
return new Promise(resolve => setTimeout(resolve, ms));
|
|
}
|
|
</script>
|
|
{% endblock %}
|
|
{% block content %}
|
|
<script>
|
|
function newPopup(url) {
|
|
popupWindow = window.open(
|
|
url,'popUpWindow','height=700,width=450,scrollbars=yes,toolbar=no,menubar=no,location=no,directories=no,status=yes')
|
|
}
|
|
</script>
|
|
</br>
|
|
<span style="float: left;font-size: large;"><a href="/live/{{ username }}/index.mpd">{{ username }}</a> | {{ title | escape }}</b></span><span style="float: right;font-size: large;"> Links | <a href="rtmp://{{ domain }}/live/{{ username }}">Watch</a> <a href="JavaScript:newPopup('/chat?room={{ username }}');">Chat</a> <a href="/vods/{{ username }}">VODs</a></span>
|
|
<div id="jscontainer">
|
|
<div id="jschild" style="width: 70%;height: 100%;">
|
|
<!--<video controls poster="/thumbnail.jpg" class="video-js vjs-default-skin" id="live-video" style="width:100%;height:100%;min-height: 500px;"></video>-->
|
|
<video id="videoPlayer" style="width:100%;height:100%;width: 950px;height: 534px;background-color: rgb(0, 0, 0);" poster="/thumbnail.jpg" autoplay muted></video>
|
|
|
|
<!--this spits errors fucking constantly after it tries to reload a video that's already running.. I dunno if it's bad or causing problems so let's just push it to develop and wait for issues!-->
|
|
<!--it plays the stream without reloading the page tho lol-->
|
|
<script>startVideo()</script>
|
|
</div>
|
|
<div id="jschild" class="webchat" style="width: 30%;height: 100%;position: relative;">
|
|
<iframe src="/chat?room={{ username }}" frameborder="0" style="width: 100%;height: 100%; min-height: 534px;" allowfullscreen></iframe>
|
|
</div>
|
|
</div>
|
|
</br>
|
|
<noscript>The webclients for the stream and the chat require javascript, but feel free to use the direct links above!</br></br></noscript>
|
|
{{ about | escape }}
|
|
<!--<script>
|
|
window.HELP_IMPROVE_VIDEOJS = false;
|
|
var player = videojs('live-video', {
|
|
html: {
|
|
nativeCaptions: false,
|
|
},
|
|
});
|
|
player.ready(function() {
|
|
player.on("error", () => {
|
|
document.querySelector(".vjs-modal-dialog-content").textContent = "The stream is currently offline.";
|
|
});
|
|
player.src({
|
|
src: '/live/{{ username }}/index.mpd',
|
|
type: 'application/dash+xml'
|
|
});
|
|
})
|
|
</script>-->
|
|
{% endblock %} |