2019-03-17 06:55:50 +01:00
|
|
|
/// <reference path="./both.js" />
|
2019-03-10 21:45:10 +01:00
|
|
|
|
|
|
|
function setPlaying(title, link) {
|
2019-03-17 06:55:50 +01:00
|
|
|
if (title !== "") {
|
|
|
|
$('#playing').text(title);
|
|
|
|
document.title = "Movie Night | " + title;
|
2019-03-10 21:45:10 +01:00
|
|
|
}
|
|
|
|
|
2019-03-17 06:55:50 +01:00
|
|
|
$('#playing').removeAttr('href');
|
|
|
|
if (link !== "") {
|
|
|
|
$('#playing').attr('href', link);
|
2019-03-10 21:45:10 +01:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2019-03-12 04:15:42 +01:00
|
|
|
function startGo() {
|
|
|
|
if (!WebAssembly.instantiateStreaming) { // polyfill
|
|
|
|
WebAssembly.instantiateStreaming = async (resp, importObject) => {
|
|
|
|
const source = await (await resp).arrayBuffer();
|
|
|
|
return await WebAssembly.instantiate(source, importObject);
|
|
|
|
};
|
|
|
|
}
|
|
|
|
|
|
|
|
const go = new Go();
|
|
|
|
WebAssembly.instantiateStreaming(fetch("/static/main.wasm"), go.importObject).then((result) => {
|
2019-03-16 15:13:30 +01:00
|
|
|
go.run(result.instance);
|
2019-03-12 04:15:42 +01:00
|
|
|
}).catch((err) => {
|
|
|
|
console.error(err);
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
2019-03-10 23:45:52 +01:00
|
|
|
function getWsUri() {
|
2019-03-16 15:13:30 +01:00
|
|
|
port = window.location.port;
|
2019-03-16 21:53:22 +01:00
|
|
|
if (port != "") {
|
|
|
|
port = ":" + port;
|
2019-03-10 23:45:52 +01:00
|
|
|
}
|
2019-03-16 21:53:22 +01:00
|
|
|
return "ws://" + window.location.hostname + port + "/ws";
|
2019-03-10 23:45:52 +01:00
|
|
|
}
|
|
|
|
|
2019-03-13 05:02:36 +01:00
|
|
|
let maxMessageCount = 0
|
2019-03-12 04:15:42 +01:00
|
|
|
function appendMessages(msg) {
|
2019-03-16 15:13:30 +01:00
|
|
|
let msgs = $("#messages").find('div');
|
2019-03-13 05:02:36 +01:00
|
|
|
|
|
|
|
// let's just say that if the max count is less than 1, then the count is infinite
|
|
|
|
// the server side should take care of chaking max count ranges
|
|
|
|
if (msgs.length > maxMessageCount) {
|
2019-03-16 15:13:30 +01:00
|
|
|
msgs.first().remove();
|
2019-03-13 05:02:36 +01:00
|
|
|
}
|
|
|
|
|
2019-03-12 04:15:42 +01:00
|
|
|
$("#messages").append(msg).scrollTop(9e6);
|
|
|
|
}
|
|
|
|
|
2019-03-18 03:29:31 +01:00
|
|
|
function purgeChat() {
|
|
|
|
$('#messages').empty()
|
|
|
|
}
|
|
|
|
|
2019-03-16 20:47:48 +01:00
|
|
|
inChat = false
|
2019-03-12 04:15:42 +01:00
|
|
|
function openChat() {
|
|
|
|
console.log("chat opening");
|
2019-03-16 15:13:30 +01:00
|
|
|
$("#joinbox").css("display", "none");
|
|
|
|
$("#chat").css("display", "grid");
|
2019-03-17 06:55:50 +01:00
|
|
|
$("#hidden").css("display", "")
|
2019-03-16 15:13:30 +01:00
|
|
|
$("#msg").val("");
|
|
|
|
$("#msg").focus();
|
2019-03-16 20:47:48 +01:00
|
|
|
inChat = true;
|
2019-03-12 04:15:42 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
function closeChat() {
|
2019-03-16 15:13:30 +01:00
|
|
|
console.log("chat closing");
|
|
|
|
$("#joinbox").css("display", "");
|
|
|
|
$("#chat").css("display", "none");
|
2019-03-17 06:55:50 +01:00
|
|
|
$("#hidden").css("display", "none")
|
|
|
|
setNotifyBox("That name was already used!");
|
2019-03-16 20:47:48 +01:00
|
|
|
inChat = false;
|
2019-03-12 04:15:42 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
function join() {
|
|
|
|
let name = $("#name").val();
|
2019-03-17 06:55:50 +01:00
|
|
|
if (name.length < 3 || name.length > 36) {
|
|
|
|
setNotifyBox("Please input a name between 3 and 36 characters");
|
2019-03-12 04:15:42 +01:00
|
|
|
return;
|
|
|
|
}
|
2019-03-16 15:13:30 +01:00
|
|
|
if (!sendMessage($("#name").val())) {
|
2019-03-17 06:55:50 +01:00
|
|
|
setNotifyBox("could not join");
|
2019-03-16 15:13:30 +01:00
|
|
|
return;
|
|
|
|
}
|
2019-03-17 06:55:50 +01:00
|
|
|
setNotifyBox();
|
2019-03-12 04:15:42 +01:00
|
|
|
openChat();
|
|
|
|
}
|
|
|
|
|
|
|
|
function websocketSend(data) {
|
2019-03-16 15:13:30 +01:00
|
|
|
ws.send(data);
|
2019-03-12 04:15:42 +01:00
|
|
|
}
|
|
|
|
|
2019-03-12 23:15:45 +01:00
|
|
|
function sendChat() {
|
|
|
|
sendMessage($("#msg").val());
|
|
|
|
$("#msg").val("");
|
|
|
|
}
|
|
|
|
|
2019-03-16 15:13:30 +01:00
|
|
|
function updateSuggestionCss(m) {
|
|
|
|
if ($("#suggestions").children().length > 0) {
|
|
|
|
div = $("#suggestions")[0]
|
2019-03-16 16:56:43 +01:00
|
|
|
$(div).css("bottom", `calc(${$("#chat").css("height")} - ${$("#messages").css("height")} - 10px)`)
|
2019-03-16 15:13:30 +01:00
|
|
|
$(div).css("right", `calc(${$("#chat").css("width")} - ${$(div).css("width")} + 5px)`)
|
|
|
|
}
|
|
|
|
}
|
2019-03-12 23:15:45 +01:00
|
|
|
|
2019-03-17 06:55:50 +01:00
|
|
|
function setNotifyBox(msg = "Please hover to view options") {
|
|
|
|
$("#notifiyBox").html(msg);
|
|
|
|
}
|
|
|
|
|
|
|
|
// Button Wrapper Functions
|
2019-03-16 22:57:58 +01:00
|
|
|
function auth() {
|
|
|
|
let pass = prompt("pass please")
|
|
|
|
if (pass != "") {
|
|
|
|
sendMessage("/auth " + pass);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2019-03-16 22:59:10 +01:00
|
|
|
function help() {
|
|
|
|
sendMessage("/help")
|
|
|
|
}
|
|
|
|
|
2019-03-17 06:55:50 +01:00
|
|
|
// Get the websocket setup in a function so it can be recalled
|
|
|
|
function setupWebSocket() {
|
|
|
|
ws = new WebSocket(getWsUri());
|
|
|
|
ws.onmessage = (m) => recieveMessage(m.data);
|
|
|
|
ws.onopen = (e) => console.log("Websocket Open:", e);
|
|
|
|
ws.onclose = () => closeChat();
|
|
|
|
ws.onerror = (e) => console.log("Websocket Error:", e);
|
|
|
|
}
|
2019-03-16 21:01:54 +01:00
|
|
|
|
2019-03-17 06:55:50 +01:00
|
|
|
function setupEvents() {
|
|
|
|
$("#name").on({
|
|
|
|
keypress: (e) => {
|
|
|
|
if (e.originalEvent.keyCode == 13) {
|
|
|
|
$("#join").trigger("click");
|
|
|
|
}
|
2019-03-10 21:45:10 +01:00
|
|
|
}
|
2019-03-16 15:13:30 +01:00
|
|
|
});
|
2019-03-10 21:45:10 +01:00
|
|
|
|
2019-03-17 06:55:50 +01:00
|
|
|
$("#msg").on({
|
|
|
|
keypress: (e) => {
|
|
|
|
if (e.originalEvent.keyCode == 13 && !e.originalEvent.shiftKey) {
|
|
|
|
$("#send").trigger("click");
|
|
|
|
e.preventDefault();
|
|
|
|
}
|
|
|
|
},
|
|
|
|
keydown: (e) => {
|
|
|
|
if (processMessageKey(e)) {
|
|
|
|
e.preventDefault();
|
|
|
|
}
|
|
|
|
},
|
|
|
|
input: () => processMessage(),
|
2019-03-16 15:13:30 +01:00
|
|
|
});
|
|
|
|
|
2019-03-17 06:55:50 +01:00
|
|
|
$("#hiddenColorPicker").on({
|
|
|
|
change: () => sendMessage("/color " + $("#hiddenColorPicker").val()),
|
|
|
|
});
|
2019-03-16 15:13:30 +01:00
|
|
|
|
2019-03-17 06:55:50 +01:00
|
|
|
$("#send").on({
|
|
|
|
click: () => $("#msg").focus(),
|
2019-03-16 15:13:30 +01:00
|
|
|
});
|
|
|
|
|
2019-03-17 06:55:50 +01:00
|
|
|
var suggestionObserver = new MutationObserver(
|
|
|
|
(mutations) => mutations.forEach(updateSuggestionCss)
|
|
|
|
).observe($("#suggestions")[0], { childList: true });
|
|
|
|
}
|
2019-03-16 16:56:43 +01:00
|
|
|
|
2019-03-17 06:55:50 +01:00
|
|
|
window.addEventListener("onresize", updateSuggestionCss);
|
2019-03-16 15:13:30 +01:00
|
|
|
|
2019-03-17 06:55:50 +01:00
|
|
|
window.addEventListener("load", () => {
|
|
|
|
setNotifyBox();
|
|
|
|
setupWebSocket();
|
2019-03-16 15:13:30 +01:00
|
|
|
startGo();
|
2019-03-17 06:55:50 +01:00
|
|
|
setupEvents();
|
|
|
|
$("#name").focus();
|
|
|
|
});
|