roypur/stream-api
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

add chromecast button

Browse Source
This commit is contained in:
Roy Olav Purser
2021-05-19 15:54:42 +02:00
parent 5dd5390fac
commit d8df3ac030
6 changed files with 47 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/index.html
View File

@ -6,6 +6,7 @@
<script async src="https://www.gstatic.com/cv/js/sender/v1/cast_sender.js?loadCastFramework=1"></script>
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/video.js/{{ data["videojs_version"] }}/video.min.js"></script>
<script defer src="https://cdn.jsdelivr.net/npm/@silvermine/videojs-chromecast@{{ data["chromecast_version"] }}/dist/silvermine-videojs-chromecast.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/{{ data["font_awesome_version"] }}/css/all.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/video.js/{{ data["videojs_version"] }}/video-js.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@silvermine/videojs-chromecast@{{ data["chromecast_version"] }}/dist/silvermine-videojs-chromecast.css">
<link rel="stylesheet" href="{{ data["custom_style"] }}">

16
frontend/script.js
View File

@ -37,9 +37,23 @@
source.type = ctype;
source.src = upstream;
player.src(source);
let Button = videojs.getComponent("Button");
let cbutton = {};
cbutton.clickHandler = (ev) => {
videojs.log("clicked");
}
let button = new Button(player, cbutton);
button.addClass("fab");
button.addClass("fa-chromecast");
button.addClass("vjs-control");
button.addClass("vjs-button");
button.addClass("vjs-big-chromecast");
player.addChild(button);
player.one("play", (ev) => {
player.removeChild(button);
});
}
}
document.addEventListener("DOMContentLoaded", handleCount);
xhr.addEventListener("load", handleCount);
})();

8
frontend/style.css
View File

@ -1,3 +1,11 @@
body {
margin: 0px;
}
.vjs-big-chromecast {
position: absolute !important;
font-size: 3rem !important;
height: 4rem !important;
width: 4rem !important;
top: 1rem !important;
right: 1rem !important;
}