Merge branch 'master' of https://git.jappel.io/jappel/scoreboard-js
Konflikt in scoreboard/controllers/cli.js zugunsten der Remote-Version aufgeloest: openBrowser()/killBrowser() bleiben erhalten, da routes/admin.js sie verwendet. Der lokale Testcode wurde verworfen (er rief zudem das child_process-Modul faelschlich als Funktion auf). Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
commit
c4325ae8ac
19 changed files with 546 additions and 78 deletions
|
|
@ -20,13 +20,28 @@ socket.on('timerEnded', (message) => {
|
|||
|
||||
socket.on('score', (message) => {
|
||||
console.log(message); // Log score in client console
|
||||
document.getElementById("score").innerHTML = message; // Display score in corresponding html Element
|
||||
scoreGetValues();
|
||||
// document.getElementById("score").innerHTML = message; // Display score in corresponding html Element
|
||||
});
|
||||
|
||||
// ######################################################################################################################################################
|
||||
// General functions
|
||||
// ######################################################################################################################################################
|
||||
|
||||
// Initial update gets called whenever page has been loaded
|
||||
async function initialUpdate() {
|
||||
etcGetValues(); // Request new values for etc stuff
|
||||
timerGetValues(); // Request new values for timer
|
||||
scoreGetValues(); // Request new values for score
|
||||
dbGetValues(); // Request new values for db contents
|
||||
}
|
||||
|
||||
// Update DOM timer elements from passed values
|
||||
function updateEtcFrontend(values) {
|
||||
console.log(values);
|
||||
document.getElementById("etcSwitchEnable").checked = values.splashscreenEnabled;// Set switch status to received score enabled value
|
||||
}
|
||||
|
||||
// Update DOM timer elements from passed values
|
||||
function updateTimerFrontend(values) {
|
||||
console.log(values); // Print received data
|
||||
|
|
@ -43,13 +58,22 @@ function updateTimerFrontend(values) {
|
|||
}
|
||||
}
|
||||
|
||||
// Build colname to show Teams on Adminpanel based on isSpielgemeinschaft
|
||||
function buildColFromIsSpielgemeinschaft(team) {
|
||||
if(team.isSpielgemeinschaft) {
|
||||
return team.name + "<br>" + team.name2;
|
||||
} else {
|
||||
return team.name + "<br> ";
|
||||
}
|
||||
}
|
||||
|
||||
// Update DOM score elements from passed values
|
||||
function updateScoreFrontend(values) {
|
||||
console.log(values); // Print received data
|
||||
document.getElementById("scoreSwitchEnable").checked = values.enabled; // Set switch status to received score enabled value
|
||||
document.getElementById("score").innerHTML = values.print; // Set score on admin interface
|
||||
document.getElementById("scoreSwitchReferenceMirrored").checked = values.referenceMirrored; // Set switch status to received score enabled value
|
||||
|
||||
// Input current Team values into form inputs
|
||||
// Config Teams - Input current teams into text fields
|
||||
document.getElementById("teamAname").value = values.teamA.name;
|
||||
document.getElementById("teamAname2").value = values.teamA.name2;
|
||||
document.getElementById("teamAisSpielgemeinschaft").checked = values.teamA.isSpielgemeinschaft;
|
||||
|
|
@ -57,12 +81,88 @@ function updateScoreFrontend(values) {
|
|||
document.getElementById("teamBname").value = values.teamB.name;
|
||||
document.getElementById("teamBname2").value = values.teamB.name2;
|
||||
document.getElementById("teamBisSpielgemeinschaft").checked = values.teamB.isSpielgemeinschaft;
|
||||
|
||||
// Show current Teams on admin panel
|
||||
if(!values.referenceMirrored && !values.sideswitch || values.referenceMirrored && values.sideswitch) { // If not mirrored on adminpanel, show like main frontend while considering sideswitch state
|
||||
document.getElementById("score").innerHTML = values.teamA.score + ':' + values.teamB.score;
|
||||
document.getElementById("teamAcolName").innerHTML = buildColFromIsSpielgemeinschaft(values.teamA);
|
||||
document.getElementById("teamBcolName").innerHTML = buildColFromIsSpielgemeinschaft(values.teamB);
|
||||
document.getElementById("teamAinc").setAttribute("onclick", "scoreAlterScore('teamA', 'inc')");
|
||||
document.getElementById("teamAdec").setAttribute("onclick", "scoreAlterScore('teamA', 'dec')");
|
||||
document.getElementById("teamBinc").setAttribute("onclick", "scoreAlterScore('teamB', 'inc')");
|
||||
document.getElementById("teamBdec").setAttribute("onclick", "scoreAlterScore('teamB', 'dec')");
|
||||
|
||||
} else if(!values.referenceMirrored && values.sideswitch || values.referenceMirrored && !values.sideswitch) { // Else, swap posistions
|
||||
document.getElementById("score").innerHTML = values.teamB.score + ':' + values.teamA.score;
|
||||
document.getElementById("teamAcolName").innerHTML = buildColFromIsSpielgemeinschaft(values.teamB);
|
||||
document.getElementById("teamBcolName").innerHTML = buildColFromIsSpielgemeinschaft(values.teamA);
|
||||
document.getElementById("teamAinc").setAttribute("onclick", "scoreAlterScore('teamB', 'inc')");
|
||||
document.getElementById("teamAdec").setAttribute("onclick", "scoreAlterScore('teamB', 'dec')");
|
||||
document.getElementById("teamBinc").setAttribute("onclick", "scoreAlterScore('teamA', 'inc')");
|
||||
document.getElementById("teamBdec").setAttribute("onclick", "scoreAlterScore('teamA', 'dec')");
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Initial update gets called whenever page has been loaded
|
||||
async function initialUpdate() {
|
||||
timerGetValues(); // Request new values for timer
|
||||
scoreGetValues(); // Request new values for score
|
||||
// Update DOM for all db contents with the passed values
|
||||
function updateDbFrontend(values) {
|
||||
console.log(values);
|
||||
|
||||
let teamAnameDropdown = document.getElementById("teamAnameDropdown"); // Dropdown for TeamA name
|
||||
let teamAname2Dropdown = document.getElementById("teamAname2Dropdown"); // Dropdown for TeamA name2
|
||||
let teamBnameDropdown = document.getElementById("teamBnameDropdown"); // Dropdown for TeamB name
|
||||
let teamBname2Dropdown = document.getElementById("teamBname2Dropdown"); // Dropdown for TeamB name2
|
||||
|
||||
// Clear innerHTML of dropdowns
|
||||
teamAnameDropdown.innerHTML = "";
|
||||
teamAname2Dropdown.innerHTML = "";
|
||||
teamBnameDropdown.innerHTML = "";
|
||||
teamBname2Dropdown.innerHTML = "";
|
||||
|
||||
let selectDelete = document.getElementById("dbTeamToDelete"); // Select for team deletion from db
|
||||
selectDelete.innerHTML = "" // Clears all existing options from select
|
||||
|
||||
// <li><a class="dropdown-item" onclick="scoreInsertChosenName">Action</a></li>
|
||||
|
||||
for(team of values.teams) {
|
||||
// Create custom Dropdowns with different function arguments for team configuration
|
||||
var li = document.createElement("li");
|
||||
li.innerHTML = `<a class="dropdown-item" onclick="scoreInsertChosenName('teamAname','` + team +`')"> `+ team +`</a>`;
|
||||
teamAnameDropdown.appendChild(li);
|
||||
var li = document.createElement("li");
|
||||
li.innerHTML = `<a class="dropdown-item" onclick="scoreInsertChosenName('teamAname2','` + team +`')"> `+ team +`</a>`;
|
||||
teamAname2Dropdown.appendChild(li);
|
||||
var li = document.createElement("li");
|
||||
li.innerHTML = `<a class="dropdown-item" onclick="scoreInsertChosenName('teamBname','` + team +`')"> `+ team +`</a>`;
|
||||
teamBnameDropdown.appendChild(li);
|
||||
var li = document.createElement("li");
|
||||
li.innerHTML = `<a class="dropdown-item" onclick="scoreInsertChosenName('teamBname2','` + team +`')"> `+ team +`</a>`;
|
||||
teamBname2Dropdown.appendChild(li);
|
||||
|
||||
// Create select options for deletion in debugwindow
|
||||
let opt = document.createElement("option");
|
||||
opt.value = team;
|
||||
opt.innerHTML = team;
|
||||
selectDelete.appendChild(opt);
|
||||
}
|
||||
}
|
||||
|
||||
// Inserts the passed name into the passed name text input
|
||||
async function scoreInsertChosenName(field, name) {
|
||||
switch(field) {
|
||||
case 'teamAname':
|
||||
document.getElementById("teamAname").value = name;
|
||||
break;
|
||||
case 'teamAname2':
|
||||
document.getElementById("teamAname2").value = name;
|
||||
break;
|
||||
case 'teamBname':
|
||||
document.getElementById("teamBname").value = name;
|
||||
break;
|
||||
case 'teamBname2':
|
||||
document.getElementById("teamBname2").value = name;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// Request monitor refresh for index frontend
|
||||
|
|
@ -70,6 +170,33 @@ async function refreshMonitor() {
|
|||
const response = await fetch("/admin/refreshMonitor"); // Call API Endpoint /admin/timerStart
|
||||
}
|
||||
|
||||
async function openBrowser() {
|
||||
const response = await fetch("/admin/openBrowser"); // Call API Endpoint /admin/openBrowser
|
||||
}
|
||||
|
||||
async function killBrowser() {
|
||||
const response = await fetch("/admin/killBrowser"); // Call API Endpoint /admin/killBrowser
|
||||
}
|
||||
|
||||
// ######################################################################################################################################################
|
||||
// Etc endpoints
|
||||
// ######################################################################################################################################################
|
||||
|
||||
// Request important values for etc stuff
|
||||
async function etcGetValues() {
|
||||
const response = await fetch("/admin/etcGetValues"); // Call API Endpoint /admin/etcGetValues
|
||||
const data = await response.json(); // Wait for asynchronous transfer to complete
|
||||
updateEtcFrontend(data); // Update admin frontend
|
||||
}
|
||||
|
||||
// Toggle index page to also show scoreboard
|
||||
async function etcToggleSplashscreen() {
|
||||
const response = await fetch("/admin/etcToggleSplashscreen");// Call API Endpoint /admin/etcToggleSplashscreen
|
||||
const data = await response.json(); // Wait for asyncronous transfer to complete
|
||||
updateEtcFrontend(data); // Update admin frontend
|
||||
refreshMonitor(); // Refresh main monitor to display new frontend
|
||||
}
|
||||
|
||||
// ######################################################################################################################################################
|
||||
// Timerfunctions
|
||||
// ######################################################################################################################################################
|
||||
|
|
@ -165,6 +292,13 @@ async function scoreToggleSideswitch() {
|
|||
updateScoreFrontend(data); // Update admin frontend
|
||||
}
|
||||
|
||||
// Switch sides to mirror admin panel when sitting behind main monitor
|
||||
async function scoreToggleReferenceMirrored() {
|
||||
const response = await fetch("/admin/scoreToggleReferenceMirrored");// Call API Endpoint /admin/scoreSwitch
|
||||
const data = await response.json(); // Wait for asyncronous transfer to complete
|
||||
updateScoreFrontend(data); // Update admin frontend
|
||||
}
|
||||
|
||||
// Clear score
|
||||
async function scoreClearScore() {
|
||||
const response = await fetch("/admin/scoreClearScore"); // Call API Endpoint /admin/scoreClearScore
|
||||
|
|
@ -194,4 +328,39 @@ async function scoreConfigTeams() {
|
|||
const data = await response.json(); // Wait for asyncronous transfer to complete
|
||||
updateScoreFrontend(data); // Update admin frontend
|
||||
refreshMonitor();
|
||||
}
|
||||
|
||||
// ######################################################################################################################################################
|
||||
// DB functions
|
||||
// ######################################################################################################################################################
|
||||
|
||||
// Request important values for db contents
|
||||
async function dbGetValues() {
|
||||
const response = await fetch("/admin/dbGetValues"); // Call API Endpoint /admin/dbGetValues
|
||||
const data = await response.json(); // Wait for asynchronous transfer to complete
|
||||
updateDbFrontend(data); // Update admin frontend
|
||||
}
|
||||
|
||||
// Add team to DB
|
||||
async function dbAddTeam() {
|
||||
const response = await fetch("/admin/dbAddTeam", { // Call API Endpoint /admin/scoreAlterScore with the teamname to alter the score in the specified direction
|
||||
method: 'POST',
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({teamName: document.getElementById("dbTeamToAdd").value})
|
||||
});
|
||||
document.getElementById("dbTeamToAdd").value = ""; // Empty the text field after sending
|
||||
const data = await response.json(); // Wait for asyncronous transfer to complete
|
||||
updateDbFrontend(data);
|
||||
}
|
||||
|
||||
// Delete team from DB
|
||||
async function dbDeleteTeam() {
|
||||
let teamName = document.getElementById("dbTeamToDelete").value;
|
||||
const response = await fetch("/admin/dbDeleteTeam", { // Call API Endpoint /admin/scoreAlterScore with the teamname to alter the score in the specified direction
|
||||
method: 'POST',
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({teamName: teamName})
|
||||
});
|
||||
const data = await response.json(); // Wait for asyncronous transfer to complete
|
||||
updateDbFrontend(data);
|
||||
}
|
||||
14
scoreboard/public/javascripts/splashscreen.js
Normal file
14
scoreboard/public/javascripts/splashscreen.js
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
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('refresh', (message) => {
|
||||
document.location.reload() // Reload page on received 'refresh' messagen
|
||||
});
|
||||
Loading…
Add table
Add a link
Reference in a new issue