let wss = "ws://" + window.location.hostname + ":3001" // Build socketio endpoint from window.location const socket = io(wss); // Connect to socketio server // ###################################################################################################################################################### // Websockets event handler // ###################################################################################################################################################### socket.on('connected', (message) => { console.log("Connected"); }); socket.on('timerDurationLeft', (message) => { console.log(message) // Log durationLeft in client console document.getElementById("durationLeft").innerHTML = message; // Display durationLeft in corresponding html Element }); socket.on('timerEnded', (message) => { document.getElementById("durationLeft").innerHTML = "ENDE"; // Display "STOP" in same html element as the duration }); socket.on('refresh', (message) => { document.location.reload() // Reload page on received 'refresh' messagen }); socket.on('score', (message) => { console.log(message) // Log score in client console document.getElementById("score").innerHTML = message; // Display score in corresponding html Element }); // ###################################################################################################################################################### // General functions // ###################################################################################################################################################### // Update DOM timer elements from passed values function updateTimerFrontend(values) { document.getElementById("durationLeft").innerHTML = values.print; // Display durationLeft as prettyfied string } // Update DOM score elements from passed values function updateScoreFrontend(values) { document.getElementById("score").innerHTML = values.print; // Set score on admin interface if(!values.sideswitch) { if(values.teamA.isSpielgemeinschaft) { document.getElementById("teamA").innerHTML = values.teamA.name + '
' + values.teamA.name2; } else { document.getElementById("teamA").innerHTML = values.teamA.name } if(values.teamB.isSpielgemeinschaft) { document.getElementById("teamB").innerHTML = values.teamB.name + '
' + values.teamB.name2; } else { document.getElementById("teamB").innerHTML = values.teamB.name } } else { if(values.teamA.isSpielgemeinschaft) { document.getElementById("teamB").innerHTML = values.teamA.name + '
' + values.teamA.name2; } else { document.getElementById("teamB").innerHTML = values.teamA.name } if(values.teamB.isSpielgemeinschaft) { document.getElementById("teamA").innerHTML = values.teamB.name + '
' + values.teamB.name2; } else { document.getElementById("teamA").innerHTML = values.teamB.name } } } async function initialUpdate() { timerGetValues(); // Request new values for timer scoreGetValues(); // Request new values for score } // ###################################################################################################################################################### // Timerfunctions // ###################################################################################################################################################### // Request important timer values async function timerGetValues() { const response = await fetch("/admin/timerGetValues"); // Call API Endpoint /admin/timerGetValues const data = await response.json(); // Wait for asynchronous transfer to complete updateTimerFrontend(data); // Update admin frontend } // ###################################################################################################################################################### // Scoreboardfunctions // ###################################################################################################################################################### // Request important values for score async function scoreGetValues() { const response = await fetch("/admin/scoreGetValues"); // Call API Endpoint /admin/scoreGetValues const data = await response.json(); // Wait for asynchronous transfer to complete and parse json (which got received by backend) console.log(data); // Print received data updateScoreFrontend(data); // Update admin frontend with received values for scoreboard }