matthew/satyr
1
0
Fork 0
mirror of https://git.waldn.net/git/knotteye/satyr.git synced 2025-09-05 09:26:21 +00:00
Code Issues Projects Releases Wiki Activity

Switch from video.js to dash.js, it seems to be more consistent and hiccup less during streams.

Browse Source 
This means transcoding to HLS is no longer an option.
Also add a bit of JS to reload the stream periodically if it hadn't started when the page was loaded.
That thing spits out errors fucking constantly, so hopefully it won't cause any problems.
This commit is contained in:
knotteye
2020-06-27 12:11:42 -05:00
parent ee6c902905
commit 4bd10151f8
109 changed files with 44 additions and 270186 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
templates/base.njk
View File

@ -16,7 +16,7 @@
{% block head %}
{% endblock %}
</head>
<body>
<body onload="startVideo()">
<div id="wrapper">
<div id="header">
<span style="float:left;"><h4><a href="/">{{ sitename }}</a> | <a href="/users">Users</a> <a href="/users/live">Live</a> <a href="/about">About</a></h4></span><span style="float:right;"><h4><a href="/help">Help</a> | {% if auth.is %}<a href="/profile">{{ auth.name }}{% else %}<a href="/login">Log In{% endif %}</a></h4></span>

26
templates/user.njk
View File

@ -1,7 +1,16 @@
{% 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="/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>
function startVideo(){
var url = "/live/{{username}}/index.mpd";
var player = dashjs.MediaPlayer().create();
player.initialize(document.querySelector("#videoPlayer"), url, true);
console.log('called startvideo');
}
</script>
{% endblock %}
{% block content %}
<script>
@ -14,16 +23,21 @@ function newPopup(url) {
<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 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>window.setInterval(startVideo, 60000)</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: 500px;" allowfullscreen></iframe>
<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>
<!--<script>
window.HELP_IMPROVE_VIDEOJS = false;
var player = videojs('live-video', {
html: {
@ -39,5 +53,5 @@ function newPopup(url) {
type: 'application/dash+xml'
});
})
</script>
</script>-->
{% endblock %}