Mirroristas/owncast
2
0
Fork 0
mirror of https://github.com/owncast/owncast.git synced 2024-10-10 19:16:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

Guard against the infinite that can take place when the ws server goes unavailable

Browse Source
This commit is contained in:
Gabe Kangas 2020-06-09 10:51:12 -07:00
parent a29852f404
commit a65564eedf
1 changed files with 44 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

86
webroot/js/app.js
View File

@ -45,13 +45,12 @@ function setupApp() {
}); });
} }
async function getStatus() { async function getStatus() {
let url = "https://util.real-ity.com:8042/status"; let url = "https://util.real-ity.com:8042/status";
try { try {
let response = await fetch(url); const response = await fetch(url);
let status = await response.json(); // read response body and parse as JSON const status = await response.json(); // read response body and parse as JSON
app.streamStatus = status.online app.streamStatus = status.online
? "Stream is online." ? "Stream is online."
: "Stream is offline." : "Stream is offline."
@ -65,13 +64,16 @@ async function getStatus() {
} }
var websocketReconnectTimer
function setupWebsocket() { function setupWebsocket() {
clearTimeout(websocketReconnectTimer)
const protocol = location.protocol == "https:" ? "wss" : "ws" const protocol = location.protocol == "https:" ? "wss" : "ws"
var ws = new WebSocket("wss://util.real-ity.com:8042/entry") var ws = new WebSocket("wss://util.real-ity.com:8042/entry")
ws.onmessage = (e) => { ws.onmessage = (e) => {
var model = JSON.parse(e.data) const model = JSON.parse(e.data)
var message = new Message(model) const message = new Message(model)
const existing = this.messagesContainer.messages.filter(function (item) { const existing = this.messagesContainer.messages.filter(function (item) {
return item.id === message.id return item.id === message.id
@ -86,11 +88,14 @@ function setupWebsocket() {
ws.onclose = (e) => { ws.onclose = (e) => {
// connection closed, discard old websocket and create a new one in 5s // connection closed, discard old websocket and create a new one in 5s
ws = null ws = null
setTimeout(setupWebsocket, 5000) console.log("Websocket closed.")
websocketReconnectTimer = setTimeout(setupWebsocket, 5000)
} }
// On ws error just close the socket and let it re-connect again for now.
ws.onerror = (e) => { ws.onerror = (e) => {
setTimeout(setupWebsocket, 5000) console.log("Websocket error: ", e)
ws.close()
} }
window.ws = ws window.ws = ws
@ -101,42 +106,39 @@ getStatus()
setupWebsocket() setupWebsocket()
// setInterval(getStatus, 5000) // setInterval(getStatus, 5000)
// HLS Video setup // HLS Video setup. Commented out for local html work. Uncomment to make HLS work.
function setupVideo() { // const video = document.getElementById("video")
var video = document.getElementById("video") // const videoSrc = "hls/stream.m3u8"
var videoSrc = "hls/stream.m3u8" // if (Hls.isSupported()) {
if (Hls.isSupported()) { // var hls = new Hls()
var hls = new Hls() // hls.loadSource(videoSrc)
hls.loadSource(videoSrc) // hls.attachMedia(video)
hls.attachMedia(video) // hls.on(Hls.Events.MANIFEST_PARSED, function () {
hls.on(Hls.Events.MANIFEST_PARSED, function () { // video.play()
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 // //
// Extensions (MSE) enabled. // // When the browser has built-in HLS support (check using `canPlayType`),
// // // we can provide an HLS manifest (i.e. .m3u8 URL) directly to the video
// When the browser has built-in HLS support (check using `canPlayType`), // // element through the `src` property. This is using the built-in support
// we can provide an HLS manifest (i.e. .m3u8 URL) directly to the video // // of the plain video element, without using hls.js.
// element through the `src` property. This is using the built-in support // //
// of the plain video element, without using hls.js. // // Note: it would be more normal to wait on the 'canplay' event below however
// // // on Safari (where you are most likely to find built-in HLS support) the
// Note: it would be more normal to wait on the 'canplay' event below however // // video.src URL must be on the user-driven white-list before a 'canplay'
// on Safari (where you are most likely to find built-in HLS support) the // // event will be emitted; the last video event that can be reliably
// video.src URL must be on the user-driven white-list before a 'canplay' // // listened-for when the URL is not on the white-list is 'loadedmetadata'.
// event will be emitted; the last video event that can be reliably // else if (video.canPlayType("application/vnd.apple.mpegurl")) {
// listened-for when the URL is not on the white-list is 'loadedmetadata'. // video.src = videoSrc
else if (video.canPlayType("application/vnd.apple.mpegurl")) { // video.addEventListener("loadedmetadata", function () {
video.src = videoSrc // video.play()
video.addEventListener("loadedmetadata", function () { // });
video.play() // }
});
}
}
function scrollSmoothToBottom(id) { function scrollSmoothToBottom(id) {
var div = document.getElementById(id) const div = document.getElementById(id)
$('#' + id).animate({ $('#' + id).animate({
scrollTop: div.scrollHeight - div.clientHeight scrollTop: div.scrollHeight - div.clientHeight
}, 500) }, 500)
@ -144,7 +146,7 @@ function scrollSmoothToBottom(id) {
function uuidv4() { function uuidv4() {
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) { return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8); const r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
return v.toString(16); return v.toString(16);
}); });
} }