var preloaded = false;
var preload = [];
-var prev = document.querySelector('#prev'),
+var presentation = document.querySelector('#presentation'),
+ prev = document.querySelector('#prev'),
next = document.querySelector('#next'),
first = document.querySelector('#first'),
last = document.querySelector('#last'),
current = document.querySelector('#current'),
total = document.querySelector('#total'),
status_text = document.querySelector('.status_text'),
+ presentation_text = document.querySelector('.presentation_text'),
current_img = document.querySelector('#current_img'),
next_img = document.querySelector('#next_img'),
current_div = document.querySelector('#current_div'),
show_next = document.querySelector('#show_next'),
shortcuts = document.querySelector('#shortcuts');
+var presentations_list = {};
+
+
+function getPresentationName() {
+ if (presentation.selectedOptions.length > 0) {
+ return presentation.selectedOptions[0].innerText;
+ } else {
+ return "";
+ }
+}
+
function startWebsocket() {
console.log("Attempting to connect")
var websocket = startWebsocket();
prev.onclick = function (event) {
- websocket.send(JSON.stringify({action: 'prev'}));
+ if (getPresentationName()) {
+ websocket.send(JSON.stringify({presentation: getPresentationName(), action: 'prev'}));
+ }
}
next.onclick = function (event) {
- websocket.send(JSON.stringify({action: 'next'}));
+ if (getPresentationName()) {
+ websocket.send(JSON.stringify({presentation: getPresentationName(), action: 'next'}));
+ }
}
first.onclick = function (event) {
- websocket.send(JSON.stringify({action: 'first'}));
+ if (getPresentationName()) {
+ websocket.send(JSON.stringify({presentation: getPresentationName(), action: 'first'}));
+ }
}
last.onclick = function (event) {
- websocket.send(JSON.stringify({action: 'last'}));
+ if (getPresentationName()) {
+ websocket.send(JSON.stringify({presentation: getPresentationName(), action: 'last'}));
+ }
}
black.onclick = function (event) {
- websocket.send(JSON.stringify({action: 'black'}));
+ if (getPresentationName()) {
+ websocket.send(JSON.stringify({presentation: getPresentationName(), action: 'black'}));
+ }
}
white.onclick = function (event) {
- websocket.send(JSON.stringify({action: 'white'}));
+ if (getPresentationName()) {
+ websocket.send(JSON.stringify({presentation: getPresentationName(), action: 'white'}));
+ }
}
current.onblur = function (event) {
- websocket.send(JSON.stringify({action: 'goto', value: current.value}));
+ if (getPresentationName()) {
+ websocket.send(JSON.stringify({presentation: getPresentationName(), action: 'goto', value: current.value}));
+ }
}
current.addEventListener('keyup',function(e){
}
});
+function refreshInterface() {
+ var d = new Date;
+ currentPresentationData = presentations_list[getPresentationName()];
+ presentation_text.style.display = "block";
+ status_text.textContent = "Slideshow running";
+ if (show_current.checked) {
+ switch (currentPresentationData.visible) {
+ case 3:
+ current_img.src = "/black.jpg";
+ break;
+ case 4:
+ current_img.src = "/white.jpg";
+ break;
+ default:
+ current_img.src = "/cache/" + currentPresentationData.name + "/" + currentPresentationData.slide_current + ".jpg?t=" + d.getTime();
+ break;
+ }
+ }
+ if (currentPresentationData.slide_current == currentPresentationData.slide_total + 1) {
+ next_img.src = "/black.jpg";
+ } else {
+ next_img.src = "/cache/" + currentPresentationData.name + "/" + (currentPresentationData.slide_current + 1) + ".jpg?t=" + d.getTime();
+ }
+ if (currentPresentationData.slide_current == 0) {
+ current_img.src = "/black.jpg";
+ next_img.src = "/black.jpg";
+ status_text.textContent = "Slideshow not running";
+ }
+
+ if (document.activeElement != current) {
+ current.value = currentPresentationData.slide_current;
+ }
+ total.textContent = currentPresentationData.slide_total;
+ document.title = currentPresentationData.name;
+}
+
function disconnect() {
console.log("Disconnecting")
document.title = DEFAULT_TITLE;
status_text.textContent = "Disconnected";
total.textContent = "?";
current.value = "";
+ presentation_text.style.display = "none";
}
function receive_message(event) {
data = JSON.parse(event.data);
- switch (data.type) {
- case 'state':
- if (data.connected == "0" || data.connected == 0) {
- disconnect();
- break;
- } else {
- status_text.textContent = "Connected";
- }
- var d = new Date;
- if (show_current.checked) {
- switch (data.visible) {
- case 3:
- current_img.src = "/black.jpg";
- break;
- case 4:
- current_img.src = "/white.jpg";
- break;
- default:
- current_img.src = "/cache/" + data.current + ".jpg?t=" + d.getTime();
- //current_img.src = "/cache/" + data.current + ".jpg";
- break;
- }
- }
- if (data.current == data.total + 1) {
- next_img.src = "/cache/" + (data.total + 1) + ".jpg?t=" + d.getTime();
- //next_img.src = "/cache/" + (data.total + 1) + ".jpg";
- } else {
- next_img.src = "/cache/" + (data.current + 1) + ".jpg?t=" + d.getTime();
- //next_img.src = "/cache/" + (data.current + 1) + ".jpg";
- }
+ presentations_list[data.name] = {"name": data.name, "pres_open": data.pres_open, "slideshow": data.slideshow, "visible": data.visible, "slide_current": data.slide_current, "slide_total": data.slide_total};
+ if (! presentations_list[data.name].pres_open) {
+ delete presentations_list[data.name];
+ if (Object.keys(presentations_list).length == 0) {
+ disconnect();
+ } else {
+ status_text.textContent = "Connected";
+ }
+ } else {
+
+ var presentation_dropdown = Array.from(presentation.children);
- if (document.activeElement != current) {
- current.value = data.current;
+ var found = false;
+ for(var i = 0; i < presentation_dropdown.length; i++) {
+ if (presentation_dropdown[i].textContent == data.name) {
+ if (! data.pres_open) {
+ presentation_dropdown[i].remove()
+ } else {
+ found = true;
+ break;
+ }
}
- total.textContent = data.total;
- document.title = data.name;
- break;
- default:
- console.error(
- "Unsupported event", data);
+ }
+ if (found == false) {
+ var dropdown_option = document.createElement("option");
+ dropdown_option.textContent = data.name;
+ dropdown_option.value = data.name;
+ presentation.appendChild(dropdown_option);
+ }
+ refreshInterface()
}
+
if (preloaded == false && ! isNaN(total.textContent)) {
image = document.getElementById("preload_img");
for (let i=1; i<=Number(total.textContent); i++) {
- image.src = "/cache/" + i + ".jpg";
+ image.src = "/cache/" + getPresentationName() + "/" + i + ".jpg";
preload.push(image);
}
preloaded = true;