Navy.gif/owncast
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Support local development of index.html

Browse Source
This commit is contained in:
Gabe Kangas 2020-06-02 18:37:05 -07:00
parent ad959b130b
commit a29852f404
2 changed files with 37 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
webroot/index.html
View File

@ -24,6 +24,7 @@
autoplay autoplay
controls controls
style="width: 100%;" style="width: 100%;"
src="https://ia800300.us.archive.org/17/items/BigBuckBunny_124/Content/big_buck_bunny_720p_surround.mp4"
></video> ></video>
<div id="app"> <div id="app">
{{ streamStatus }} {{ viewerCount }} {{ 'viewer' | plural(viewerCount) }}. {{ streamStatus }} {{ viewerCount }} {{ 'viewer' | plural(viewerCount) }}.

67
webroot/js/app.js
View File

@ -26,7 +26,7 @@ function setupApp() {
el: "#chatForm", el: "#chatForm",
data: { data: {
message: { message: {
author: localStorage.author || "Viewer" + (Math.floor(Math.random() * 42) + 1), author: "",//localStorage.author || "Viewer" + (Math.floor(Math.random() * 42) + 1),
body: "" body: ""
} }
}, },
@ -47,7 +47,7 @@ function setupApp() {
async function getStatus() { async function getStatus() {
let url = "/status"; let url = "https://util.real-ity.com:8042/status";
try { try {
let response = await fetch(url); let response = await fetch(url);
@ -67,7 +67,7 @@ async function getStatus() {
function setupWebsocket() { function setupWebsocket() {
const protocol = location.protocol == "https:" ? "wss" : "ws" const protocol = location.protocol == "https:" ? "wss" : "ws"
var ws = new WebSocket(protocol + "://" + location.host + "/entry") var ws = new WebSocket("wss://util.real-ity.com:8042/entry")
ws.onmessage = (e) => { ws.onmessage = (e) => {
var model = JSON.parse(e.data) var model = JSON.parse(e.data)
@ -99,37 +99,40 @@ function setupWebsocket() {
setupApp() setupApp()
getStatus() getStatus()
setupWebsocket() setupWebsocket()
setInterval(getStatus, 5000) // setInterval(getStatus, 5000)
// HLS Video setup // HLS Video setup
var video = document.getElementById("video") function setupVideo() {
var videoSrc = "hls/stream.m3u8" var video = document.getElementById("video")
if (Hls.isSupported()) { var videoSrc = "hls/stream.m3u8"
var hls = new Hls() if (Hls.isSupported()) {
hls.loadSource(videoSrc) var hls = new Hls()
hls.attachMedia(video) hls.loadSource(videoSrc)
hls.on(Hls.Events.MANIFEST_PARSED, function () { hls.attachMedia(video)
video.play() hls.on(Hls.Events.MANIFEST_PARSED, function () {
}); video.play()
} });
// hls.js is not supported on platforms that do not have Media Source }
// Extensions (MSE) enabled.
// // hls.js is not supported on platforms that do not have Media Source
// When the browser has built-in HLS support (check using `canPlayType`), // Extensions (MSE) enabled.
// we can provide an HLS manifest (i.e. .m3u8 URL) directly to the video //
// element through the `src` property. This is using the built-in support // When the browser has built-in HLS support (check using `canPlayType`),
// of the plain video element, without using hls.js. // we can provide an HLS manifest (i.e. .m3u8 URL) directly to the video
// // element through the `src` property. This is using the built-in support
// Note: it would be more normal to wait on the 'canplay' event below however // of the plain video element, without using hls.js.
// on Safari (where you are most likely to find built-in HLS support) the //
// video.src URL must be on the user-driven white-list before a 'canplay' // Note: it would be more normal to wait on the 'canplay' event below however
// event will be emitted; the last video event that can be reliably // on Safari (where you are most likely to find built-in HLS support) the
// listened-for when the URL is not on the white-list is 'loadedmetadata'. // video.src URL must be on the user-driven white-list before a 'canplay'
else if (video.canPlayType("application/vnd.apple.mpegurl")) { // event will be emitted; the last video event that can be reliably
video.src = videoSrc // listened-for when the URL is not on the white-list is 'loadedmetadata'.
video.addEventListener("loadedmetadata", function () { else if (video.canPlayType("application/vnd.apple.mpegurl")) {
video.play() video.src = videoSrc
}); video.addEventListener("loadedmetadata", function () {
video.play()
});
}
} }
function scrollSmoothToBottom(id) { function scrollSmoothToBottom(id) {