Added refernce mirrored to mirror team position when sitting behind the main monitor
This commit is contained in:
parent
c0ffac18e4
commit
a27c38eeb3
@ -14,7 +14,8 @@ let teamB = {
|
||||
score: 0,
|
||||
isSpielgemeinschaft: 0,
|
||||
};
|
||||
let sideswitch = false;
|
||||
let sideswitch = false; // Attribute to switch sides after halftime
|
||||
let referenceMirrored = false; // If sitting behind the scoreboard, switch sides for admin board
|
||||
|
||||
// Function prototypes
|
||||
function setEnabled(status) {};
|
||||
@ -22,7 +23,7 @@ function configTeam(team, name, name2, isSpielgemeinschaft) {};
|
||||
function setScore(team, score) {};
|
||||
function alterScore(team, dir) {};
|
||||
function clearScore() {};
|
||||
function toggleSideSwitch() {};
|
||||
function toggleSideswitch() {};
|
||||
function getEnabled() {};
|
||||
function getValues() {};
|
||||
|
||||
@ -91,6 +92,11 @@ function toggleSideswitch() {
|
||||
io.sockets.emit('scoreSideswitch', '');
|
||||
}
|
||||
|
||||
// Mirror team position on admin panel
|
||||
function toggleReferenceMirrored() {
|
||||
referenceMirrored = !referenceMirrored;
|
||||
}
|
||||
|
||||
// Return enabled value
|
||||
function getEnabled() {
|
||||
return enabled
|
||||
@ -112,11 +118,12 @@ function getValues() {
|
||||
teamA: teamA,
|
||||
teamB: teamB,
|
||||
sideswitch: sideswitch,
|
||||
referenceMirrored: referenceMirrored,
|
||||
print: print(),
|
||||
teams: db.getTeams(),
|
||||
};
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
setEnabled, configTeam, setScore, alterScore, clearScore, toggleSideswitch, getEnabled, getValues
|
||||
setEnabled, configTeam, setScore, alterScore, clearScore, toggleSideswitch, toggleReferenceMirrored, getEnabled, getValues,
|
||||
}
|
||||
@ -20,12 +20,22 @@ 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);
|
||||
@ -48,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;
|
||||
@ -62,6 +81,27 @@ 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')");
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Update DOM for all db contents with the passed values
|
||||
@ -125,13 +165,6 @@ async function scoreInsertChosenName(field, name) {
|
||||
}
|
||||
}
|
||||
|
||||
// Initial update gets called whenever page has been loaded
|
||||
async function initialUpdate() {
|
||||
timerGetValues(); // Request new values for timer
|
||||
scoreGetValues(); // Request new values for score
|
||||
dbGetValues(); // Request new values for db contents
|
||||
}
|
||||
|
||||
// Request monitor refresh for index frontend
|
||||
async function refreshMonitor() {
|
||||
const response = await fetch("/admin/refreshMonitor"); // Call API Endpoint /admin/timerStart
|
||||
@ -259,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
|
||||
|
||||
@ -6,6 +6,7 @@ const timer = require('../controllers/timer');
|
||||
const score = require('../controllers/score');
|
||||
const cli = require('../controllers/cli');
|
||||
const db = require('../controllers/db');
|
||||
const etc = require('../controllers/etc');
|
||||
|
||||
// ######################################################################################################################################################
|
||||
// General endpoints
|
||||
@ -132,6 +133,13 @@ router.get('/scoreToggleSideswitch', function(req, res, next) {
|
||||
res.json(score.getValues());
|
||||
});
|
||||
|
||||
// Express router endpoint to toggle reference mirrored attribute
|
||||
router.get('/scoreToggleReferenceMirrored', function(req, res, next) {
|
||||
score.toggleReferenceMirrored();
|
||||
res.status(200);
|
||||
res.json(score.getValues());
|
||||
});
|
||||
|
||||
// Express router endpoint to get important score values
|
||||
router.get('/scoreGetValues', function(req, res, next) {
|
||||
res.json(score.getValues()); // Respond with important values for frontend
|
||||
|
||||
@ -10,7 +10,7 @@
|
||||
<link href="/stylesheets/fontawesome/solid.min.css" rel="stylesheet" />
|
||||
</head>
|
||||
<body onload="initialUpdate()">
|
||||
<div class="container-md my-4">
|
||||
<div class=" container-fluid-sm container-fluid-md container-fluid-lg my-4 mx-4">
|
||||
|
||||
<div class="row mb-4 justify-content-center">
|
||||
<div class="col-sm-12 col-md-12 col-lg-4">
|
||||
@ -26,13 +26,13 @@
|
||||
<div class="col-sm-12 col-md-12 col-lg-4">
|
||||
<div class="h-100 card text-center">
|
||||
<div class="card-body">
|
||||
<button class="m-2 p-3 btn btn-lg btn-success" onclick="timerStart()" id="timerStartBtn"><i class="fa-solid fa-play"></i> Start</button>
|
||||
<button class="m-2 p-3 btn btn-lg btn-warning" onclick="timerPause()" id="timerPauseBtn"><i class="fa-solid fa-pause"></i> Pause</button>
|
||||
<button class="mb-2 btn btn-lg btn-success" onclick="timerStart()" id="timerStartBtn"><i class="fa-solid fa-play"></i> Start</button>
|
||||
<button class="mb-2 btn btn-lg btn-warning" onclick="timerPause()" id="timerPauseBtn"><i class="fa-solid fa-pause"></i> Pause</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-sm-12 col-md-12 col-lg-4">
|
||||
<div class="col-sm-12 col-md-12 col-lg-5">
|
||||
<div class="h-100 card text-center">
|
||||
<div class="card-body ">
|
||||
<div class="btn-group align-middle" role="group" aria-label="Basic example">
|
||||
@ -47,7 +47,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-sm-12 col-md-12 col-lg-4">
|
||||
<div class="col-sm-12 col-md-12 col-lg-3">
|
||||
<div class="h-100 card text-center">
|
||||
<div class="card-body">
|
||||
<button class="btn btn-lg btn-danger" data-bs-toggle="modal" data-bs-target="#timerResetModal">
|
||||
@ -59,11 +59,29 @@
|
||||
</div>
|
||||
|
||||
<div class="row mb-4 justify-content-center">
|
||||
<div class="col-sm-12 col-md-12 col-lg-4">
|
||||
<div class="col-sm-12 col-md-12 col-lg-8">
|
||||
<div class="card text-center">
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-md-5 col-lg-4">
|
||||
<h5 id="teamAcolName"></h5>
|
||||
<div class="btn-group-vertical" role="group" aria-label="Vertical button group">
|
||||
<button type="mb-2 button" class="btn btn-outline-success btn-lg" id="teamAinc"><i class="fa-solid fa-up-long"></i> +1</button>
|
||||
<button type="mb-2 button" class="btn btn-outline-danger btn-lg" id="teamAdec"><i class="fa-solid fa-down-long"></i> -1</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-2 col-md-2 col-lg-4">
|
||||
<h1 id="score"></h1>
|
||||
</div>
|
||||
<div class="col-sm-5 col-md-5 col-lg-4">
|
||||
<h5 id="teamBcolName"></h5>
|
||||
<div class="btn-group-vertical" role="group" aria-label="Vertical button group">
|
||||
<button type="mb-2 button" class="btn btn-outline-success btn-lg" id="teamBinc"><i class="fa-solid fa-up-long"></i> +1</button>
|
||||
<button type="mb-2 button" class="btn btn-outline-danger btn-lg" id="teamBdec"><i class="fa-solid fa-down-long"></i> -1</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -73,17 +91,13 @@
|
||||
<div class="h-100 card text-center">
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col-sm-6 col-md-6 col-lg-6">
|
||||
<div class="btn-group-vertical" role="group" aria-label="Vertical button group">
|
||||
<button type="mb-2 button" class="btn btn-outline-success" onclick="scoreAlterScore('teamA', 'inc')">Team A +1</button>
|
||||
<button type="mb-2 button" class="btn btn-outline-danger" onclick="scoreAlterScore('teamA', 'dec')">Team A -1</button>
|
||||
</div>
|
||||
<div class="col-sm-6 col-md-6 col-lg-6 mb-4">
|
||||
<h5 id="teamAcolName"></h5>
|
||||
|
||||
</div>
|
||||
<div class="col-sm-6 col-md-6 col-lg-6">
|
||||
<div class="btn-group-vertical" role="group" aria-label="Vertical button group">
|
||||
<button type="mb-2 button" class="btn btn-outline-success" onclick="scoreAlterScore('teamB', 'inc')">Team B +1</button>
|
||||
<button type="mb-2 button" class="btn btn-outline-danger" onclick="scoreAlterScore('teamB', 'dec')">Team B -1</button>
|
||||
</div>
|
||||
<h5 id="teamBcolName"></h5>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -299,10 +313,18 @@
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>Achtung, eine Fehlbedienung kann unerwünschtes Verhalten hervorrufen.</p>
|
||||
<div class="form-check form-switch">
|
||||
<input class="form-check-input" onclick="scoreToggleReferenceMirrored()" type="checkbox" role="switch" id="scoreSwitchReferenceMirrored">
|
||||
<label class="form-check-label" for="scoreSwitchEnable">Teamanzeige im Adminpanel spiegeln?</label>
|
||||
</div>
|
||||
<div class="form-check form-switch">
|
||||
<input class="form-check-input" onclick="scoreToggle()" type="checkbox" role="switch" id="scoreSwitchEnable">
|
||||
<label class="form-check-label" for="scoreSwitchEnable">Scoreboard anzeigen?</label>
|
||||
</div>
|
||||
<div class="form-check form-switch">
|
||||
<input class="form-check-input" onclick="etcToggleSplashscreen()" type="checkbox" role="switch" id="etcSwitchEnable">
|
||||
<label class="form-check-label" for="scoreSwitchEnable">SG-Arheilgen Splashscreen anzeigen?</label>
|
||||
</div>
|
||||
<button class="mb-2 btn btn-lg btn-warning" onclick="refreshMonitor()"><i class="fa-solid fa-rotate"></i> Monitor neu laden</button> <br>
|
||||
<button class="mb-2 btn btn-lg btn-success" onclick="openBrowser()"><i class="fa-solid fa-rocket"></i> Browser öffnen</button> <br>
|
||||
<button class="mb-3 btn btn-lg btn-danger" onclick="killBrowser()"><i class="fa-solid fa-stop"></i> Browser stoppen</button> <br>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user