2020-06-17 04:55:00 +03:00
|
|
|
async function setupApp() {
|
2020-06-18 20:24:54 +03:00
|
|
|
Vue.filter('plural', pluralize);
|
2020-06-03 03:35:49 +03:00
|
|
|
|
2020-06-02 23:56:59 +03:00
|
|
|
window.app = new Vue({
|
2020-06-17 04:36:11 +03:00
|
|
|
el: "#app-container",
|
2020-06-02 23:56:59 +03:00
|
|
|
data: {
|
2020-06-18 03:13:55 +03:00
|
|
|
streamStatus: "Stream is offline.", // Default state.
|
2020-06-03 03:35:49 +03:00
|
|
|
viewerCount: 0,
|
2020-06-14 11:10:26 +03:00
|
|
|
sessionMaxViewerCount: 0,
|
|
|
|
overallMaxViewerCount: 0,
|
2020-06-17 04:36:11 +03:00
|
|
|
messages: [],
|
2020-06-17 04:55:00 +03:00
|
|
|
description: "",
|
|
|
|
title: "",
|
2020-06-19 06:46:00 +03:00
|
|
|
isOnline: false,
|
2020-06-21 09:41:13 +03:00
|
|
|
socialHandles: [],
|
2020-06-02 23:56:59 +03:00
|
|
|
},
|
2020-06-18 10:06:10 +03:00
|
|
|
watch: {
|
|
|
|
messages: {
|
|
|
|
deep: true,
|
|
|
|
handler: function (newMessages, oldMessages) {
|
|
|
|
if (newMessages.length !== oldMessages.length) {
|
|
|
|
// jump to bottom
|
|
|
|
jumpToBottom(appMessaging.scrollableMessagesContainer);
|
|
|
|
}
|
|
|
|
},
|
|
|
|
},
|
|
|
|
},
|
2020-06-02 23:56:59 +03:00
|
|
|
});
|
|
|
|
|
2020-06-18 10:06:10 +03:00
|
|
|
|
2020-06-15 07:14:42 +03:00
|
|
|
// init messaging interactions
|
2020-06-18 10:06:10 +03:00
|
|
|
var appMessaging = new Messaging();
|
|
|
|
appMessaging.init();
|
2020-06-15 01:18:43 +03:00
|
|
|
|
2020-06-17 04:55:00 +03:00
|
|
|
const config = await new Config().init();
|
|
|
|
app.title = config.title;
|
2020-06-21 09:41:13 +03:00
|
|
|
app.socialHandles = config.socialHandles;
|
2020-06-18 06:20:28 +03:00
|
|
|
|
2020-06-21 09:41:13 +03:00
|
|
|
// const configFileLocation = "../js/config.json";
|
2020-06-18 06:20:28 +03:00
|
|
|
|
|
|
|
try {
|
2020-06-21 09:41:13 +03:00
|
|
|
const pageContentFile = "../static/content.md"
|
2020-06-18 06:20:28 +03:00
|
|
|
const response = await fetch(pageContentFile);
|
|
|
|
const descriptionMarkdown = await response.text()
|
|
|
|
const descriptionHTML = new showdown.Converter().makeHtml(descriptionMarkdown);
|
|
|
|
app.description = descriptionHTML;
|
|
|
|
return this;
|
|
|
|
} catch (error) {
|
|
|
|
console.log(error);
|
|
|
|
}
|
2020-06-02 23:56:59 +03:00
|
|
|
}
|
|
|
|
|
2020-06-14 06:15:31 +03:00
|
|
|
var websocketReconnectTimer;
|
2020-06-02 23:56:59 +03:00
|
|
|
function setupWebsocket() {
|
2020-06-18 10:06:10 +03:00
|
|
|
clearTimeout(websocketReconnectTimer);
|
2020-06-09 20:51:12 +03:00
|
|
|
|
2020-06-15 02:44:38 +03:00
|
|
|
// Uncomment to point to somewhere other than goth.land
|
2020-06-17 04:36:11 +03:00
|
|
|
const protocol = location.protocol == "https:" ? "wss" : "ws"
|
2020-06-21 09:41:13 +03:00
|
|
|
// var ws = new WebSocket(protocol + "://" + location.host + "/entry")
|
2020-06-15 02:44:38 +03:00
|
|
|
|
2020-06-21 09:41:13 +03:00
|
|
|
var ws = new WebSocket("wss://goth.land/entry")
|
2020-06-15 02:44:38 +03:00
|
|
|
|
2020-06-02 23:56:59 +03:00
|
|
|
ws.onmessage = (e) => {
|
2020-06-09 20:51:12 +03:00
|
|
|
const model = JSON.parse(e.data)
|
2020-06-15 02:44:38 +03:00
|
|
|
|
|
|
|
// Ignore non-chat messages (such as keepalive PINGs)
|
|
|
|
if (model.type !== SocketMessageTypes.CHAT) { return; }
|
|
|
|
|
2020-06-18 10:06:10 +03:00
|
|
|
const message = new Message(model);
|
2020-06-17 04:36:11 +03:00
|
|
|
|
|
|
|
const existing = this.app.messages.filter(function (item) {
|
2020-06-18 10:06:10 +03:00
|
|
|
return item.id === message.id;
|
2020-06-03 03:59:40 +03:00
|
|
|
})
|
|
|
|
|
|
|
|
if (existing.length === 0 || !existing) {
|
2020-06-18 10:06:10 +03:00
|
|
|
this.app.messages = [...this.app.messages, message];
|
2020-06-03 03:59:40 +03:00
|
|
|
}
|
2020-06-02 23:56:59 +03:00
|
|
|
}
|
2020-06-03 03:35:49 +03:00
|
|
|
|
|
|
|
ws.onclose = (e) => {
|
|
|
|
// connection closed, discard old websocket and create a new one in 5s
|
2020-06-18 10:06:10 +03:00
|
|
|
ws = null;
|
2020-06-09 20:51:12 +03:00
|
|
|
console.log("Websocket closed.")
|
2020-06-18 10:06:10 +03:00
|
|
|
websocketReconnectTimer = setTimeout(setupWebsocket, 5000);
|
2020-06-03 03:35:49 +03:00
|
|
|
}
|
|
|
|
|
2020-06-09 20:51:12 +03:00
|
|
|
// On ws error just close the socket and let it re-connect again for now.
|
2020-06-03 03:35:49 +03:00
|
|
|
ws.onerror = (e) => {
|
2020-06-18 10:06:10 +03:00
|
|
|
console.log("Websocket error: ", e);
|
|
|
|
ws.close();
|
2020-06-03 03:35:49 +03:00
|
|
|
}
|
|
|
|
|
2020-06-16 03:40:12 +03:00
|
|
|
window.ws = ws;
|
2020-06-02 23:56:59 +03:00
|
|
|
}
|
|
|
|
|
2020-06-18 10:06:10 +03:00
|
|
|
setupApp();
|
2020-06-17 07:05:54 +03:00
|
|
|
|
2020-06-18 10:06:10 +03:00
|
|
|
setupWebsocket();
|
2020-06-02 23:56:59 +03:00
|
|
|
|