jappel/scoreboard-js
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: jappel:ad6ab2ecab6810e8ecac48aa76ae4ffbfe3929bb
Branches Tags
jappel:master
..
compare: jappel:faaa47a792c7809d1f846dbef671032e4a72bfe4
Branches Tags
jappel:master

No commits in common. "ad6ab2ecab6810e8ecac48aa76ae4ffbfe3929bb" and "faaa47a792c7809d1f846dbef671032e4a72bfe4" have entirely different histories.
ad6ab2ecab ... faaa47a792

6 changed files with 28 additions and 166 deletions
Show Stats Expand all files Collapse all files

23
scoreboard/controllers/score.js
View File

@ -17,11 +17,12 @@ let sideswitch = false;
// Function prototypes // Function prototypes
function setEnabled(status) {}; function setEnabled(status) {};
function configTeam(team, name, name2, isSpielgemeinschaft) {}; function setName(team, name) {};
function configTeam() {};
function setScore(team, score) {}; function setScore(team, score) {};
function alterScore(team, dir) {}; function alterScore(team, dir) {};
function clearScore() {}; function clearScore() {};
function toggleSideSwitch() {}; function toggleSwitch() {};
function getEnabled() {}; function getEnabled() {};
function getValues() {}; function getValues() {};
@ -42,6 +43,15 @@ function configTeam(team, name, name2, isSpielgemeinschaft) {
} }
} }
// Set team name
function setName(team, name) {
if(team == "teamA") {
teamA.name = name;
} else if(team == "teamB") {
teamB.name = name;
}
}
// Set score of team to passed value // Set score of team to passed value
function setScore(team, score) { function setScore(team, score) {
if(team == "teamA") { if(team == "teamA") {
@ -83,11 +93,8 @@ function clearScore() {
} }
// Toggle sideswitch // Toggle sideswitch
function toggleSideswitch() { function toggleSwitch() {
console.log("Seiten gewechselt");
sideswitch = !sideswitch; sideswitch = !sideswitch;
io.sockets.emit('score', print());
io.sockets.emit('scoreSideswitch', '');
} }
// Return enabled value // Return enabled value
@ -95,7 +102,6 @@ function getEnabled() {
return enabled return enabled
} }
// Print current score depending on sideswitch
function print() { function print() {
if(sideswitch) { if(sideswitch) {
return teamB.score + ":" + teamA.score return teamB.score + ":" + teamA.score
@ -104,7 +110,6 @@ function print() {
} }
} }
// Return all important values
function getValues() { function getValues() {
return { return {
enabled: enabled, enabled: enabled,
@ -116,5 +121,5 @@ function getValues() {
} }
module.exports = { module.exports = {
setEnabled, configTeam, setScore, alterScore, clearScore, toggleSideswitch, getEnabled, getValues setEnabled, setScore, alterScore, clearScore, getEnabled, getValues
} }

38
scoreboard/public/javascripts/admin.js
View File

@ -48,15 +48,6 @@ function updateScoreFrontend(values) {
console.log(values); // Print received data console.log(values); // Print received data
document.getElementById("scoreSwitchEnable").checked = values.enabled; // Set switch status to received score enabled value 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("score").innerHTML = values.print; // Set score on admin interface
// Input current Team values into form inputs
document.getElementById("teamAname").value = values.teamA.name;
document.getElementById("teamAname2").value = values.teamA.name2;
document.getElementById("teamAisSpielgemeinschaft").checked = values.teamA.isSpielgemeinschaft;
document.getElementById("teamBname").value = values.teamB.name;
document.getElementById("teamBname2").value = values.teamB.name2;
document.getElementById("teamBisSpielgemeinschaft").checked = values.teamB.isSpielgemeinschaft;
} }
// Initial update gets called whenever page has been loaded // Initial update gets called whenever page has been loaded
@ -68,6 +59,7 @@ async function initialUpdate() {
// Request monitor refresh for index frontend // Request monitor refresh for index frontend
async function refreshMonitor() { async function refreshMonitor() {
const response = await fetch("/admin/refreshMonitor"); // Call API Endpoint /admin/timerStart const response = await fetch("/admin/refreshMonitor"); // Call API Endpoint /admin/timerStart
const data = await response.json(); // Wait for asyncronous transfer to complete
} }
// ###################################################################################################################################################### // ######################################################################################################################################################
@ -159,8 +151,8 @@ async function scoreAlterScore(team, dir) {
} }
// Switch sides // Switch sides
async function scoreToggleSideswitch() { async function scoreSwitch() {
const response = await fetch("/admin/scoreToggleSideswitch");// Call API Endpoint /admin/scoreSwitch const response = await fetch("/admin/scoreSwitch"); // Call API Endpoint /admin/scoreSwitch
const data = await response.json(); // Wait for asyncronous transfer to complete const data = await response.json(); // Wait for asyncronous transfer to complete
updateScoreFrontend(data); // Update admin frontend updateScoreFrontend(data); // Update admin frontend
} }
@ -171,27 +163,3 @@ async function scoreClearScore() {
const data = await response.json(); // Wait for asynchronous transfer to complete const data = await response.json(); // Wait for asynchronous transfer to complete
updateScoreFrontend(data); // Update admin frontend updateScoreFrontend(data); // Update admin frontend
} }
// Configure Teams
async function scoreConfigTeams() {
teamA = {
name: document.getElementById("teamAname").value,
name2: document.getElementById("teamAname2").value,
isSpielgemeinschaft: document.getElementById("teamAisSpielgemeinschaft").checked
};
teamB = {
name: document.getElementById("teamBname").value,
name2: document.getElementById("teamBname2").value,
isSpielgemeinschaft: document.getElementById("teamBisSpielgemeinschaft").checked
}
console.log(teamA, teamB)
const response = await fetch("/admin/scoreConfigTeams", { // 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({teamA: teamA, teamB: teamB})
});
const data = await response.json(); // Wait for asyncronous transfer to complete
updateScoreFrontend(data); // Update admin frontend
refreshMonitor();
}

31
scoreboard/public/javascripts/indexScore.js
View File

@ -27,10 +27,6 @@ socket.on('score', (message) => {
document.getElementById("score").innerHTML = message; // Display score in corresponding html Element document.getElementById("score").innerHTML = message; // Display score in corresponding html Element
}); });
socket.on('scoreSideswitch', (message) => {
scoreGetValues(); // Update frontend when sides have been switch (switches team name sides)
});
// ###################################################################################################################################################### // ######################################################################################################################################################
// General functions // General functions
// ###################################################################################################################################################### // ######################################################################################################################################################
@ -43,33 +39,6 @@ function updateTimerFrontend(values) {
// Update DOM score elements from passed values // Update DOM score elements from passed values
function updateScoreFrontend(values) { function updateScoreFrontend(values) {
document.getElementById("score").innerHTML = values.print; // Set score on admin interface 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 + '<br>' + values.teamA.name2;
} else {
document.getElementById("teamA").innerHTML = values.teamA.name
}
if(values.teamB.isSpielgemeinschaft) {
document.getElementById("teamB").innerHTML = values.teamB.name + '<br>' + values.teamB.name2;
} else {
document.getElementById("teamB").innerHTML = values.teamB.name
}
} else {
if(values.teamA.isSpielgemeinschaft) {
document.getElementById("teamB").innerHTML = values.teamA.name + '<br>' + values.teamA.name2;
} else {
document.getElementById("teamB").innerHTML = values.teamA.name
}
if(values.teamB.isSpielgemeinschaft) {
document.getElementById("teamA").innerHTML = values.teamB.name + '<br>' + values.teamB.name2;
} else {
document.getElementById("teamA").innerHTML = values.teamB.name
}
}
} }
async function initialUpdate() { async function initialUpdate() {

12
scoreboard/routes/admin.js
View File

@ -93,10 +93,7 @@ router.post('/scoreAlterScore', function(req, res, next) {
}); });
// Express router endpoint to switch the score after halftime // Express router endpoint to switch the score after halftime
router.get('/scoreToggleSideswitch', function(req, res, next) { router.post('/scoreSwitch', function(req, res, next) {
score.toggleSideswitch();
res.status(200);
res.json(score.getValues());
}); });
// Express router endpoint to get important score values // Express router endpoint to get important score values
@ -110,13 +107,6 @@ router.get('/scoreClearScore', function(req, res, next) {
res.json(score.getValues()); // Respond with important values for frontend res.json(score.getValues()); // Respond with important values for frontend
}); });
router.post('/scoreConfigTeams', function(req, res, next) {
score.configTeam("teamA", req.body.teamA.name, req.body.teamA.name2, req.body.teamA.isSpielgemeinschaft);
score.configTeam("teamB", req.body.teamB.name, req.body.teamB.name2, req.body.teamB.isSpielgemeinschaft);
console.log(score.getValues());
res.json(score.getValues());
});
/* GET home page. */ /* GET home page. */
router.get('/', function(req, res, next) { router.get('/', function(req, res, next) {
res.render('admin'); res.render('admin');

86
scoreboard/views/admin.hbs
View File

@ -93,9 +93,9 @@
<div class="col-sm-12 col-md-12 col-lg-4"> <div class="col-sm-12 col-md-12 col-lg-4">
<div class="h-100 card text-center"> <div class="h-100 card text-center">
<div class="card-body"> <div class="card-body">
<button class="mb-2 btn btn-lg btn-danger" data-bs-toggle="modal" data-bs-target="#scoreSwitchModal"><i class="fa-solid fa-rotate"></i> Seitenwechsel</button> <button class="mb-2 btn btn-lg btn-danger" onclick="scoreSwitch()"><i class="fa-solid fa-rotate"></i> Seitenwechsel</button>
<button class="mb-2 btn btn-lg btn-danger" data-bs-toggle="modal" data-bs-target="#scoreResetModal"><i class="fa-solid fa-rotate-right"></i> Score zurücksetzen</button> <button class="mb-2 btn btn-lg btn-danger" onclick="scoreClearScore()"><i class="fa-solid fa-rotate"></i> Score löschen</button>
<button class="mb-2 btn btn-lg btn-danger" data-bs-toggle="modal" data-bs-target="#scoreConfigTeamsModal">Teams konfigurieren</button> <button class="mb-2 btn btn-lg btn-danger" data-bs-toggle="modal" data-bs-target="#scoreConfigTeamAModal">Team A konfigurieren</button>
</div> </div>
</div> </div>
</div> </div>
@ -188,91 +188,21 @@
</div> </div>
<!-- Modal --> <!-- Modal -->
<!-- Score switch Modal --> <!-- Config Team Modal -->
<div class="modal fade" id="scoreSwitchModal" tabindex="-1" aria-labelledby="scoreSwitchModalLabel" aria-hidden="true"> <div class="modal fade" id="scoreConfigTeamAModal" tabindex="-1" aria-labelledby="scoreConfigTeamAModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered"> <div class="modal-dialog modal-dialog-centered">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<h1 class="modal-title fs-5" id="scoreSwitchModalLabel">Seiten wechseln?</h1> <h1 class="modal-title fs-5" id="timerResetModalLabel">Timer zurücksetzen?</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<p>Möchtest du die Seiten für den Score wirklich wechseln?</p> <p>Konfiguration von Team A bearbeiten:</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger" data-bs-dismiss="modal" onclick="scoreToggleSideswitch()">Seitenwechsel</button>
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Schließen</button>
</div>
</div>
</div>
</div>
<!-- Score switch Modal -->
<!-- Score reset Modal -->
<div class="modal fade" id="scoreResetModal" tabindex="-1" aria-labelledby="scoreResetModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="scoreResetModalLabel">Score zurücksetzen?</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<p>Möchtest du den Score wirklich zurücksetzen?</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger" data-bs-dismiss="modal" onclick="scoreClearScore()">Zurücksetzen</button>
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Schließen</button>
</div>
</div>
</div>
</div>
<!-- Score reset Modal -->
<!-- Config Team Modal -->
<div class="modal fade" id="scoreConfigTeamsModal" tabindex="-1" aria-labelledby="scoreConfigTeamsModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="timerResetModalLabel">Teams konfigurieren</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<p class="fw-bold">Konfiguration von Team A bearbeiten:</p>
<form>
<div class="mb-3">
<label for="teamAname", class="form-label">Team A Name</label>
<input type="text" class="form-control" id="teamAname" aria-describedby="teamAnameHelp">
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" id="teamAisSpielgemeinschaft">
<label class="form-check-label" for="teamAisSpielgemeinschaft">Team ist eine Spielgemeinschaft</label>
</div>
<div class="mb-3">
<label for="teamAname2", class="form-label">Team A Name 2</label>
<input type="text" class="form-control" id="teamAname2" aria-describedby="teamAname2help">
<div id="teamAname2help" class="form-text">Wird nur bei einer Spielgemeinschaft angezeigt, sonst leer lassen</div>
</div>
<br><br>
<p class="fw-bold">Konfiguration von Team B bearbeiten:</p>
<div class="mb-3">
<label for="teamBname", class="form-label">Team B Name</label>
<input type="text" class="form-control" id="teamBname" aria-describedby="teamBnameHelp">
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" id="teamBisSpielgemeinschaft">
<label class="form-check-label" for="teamBisSpielgemeinschaft">Team ist eine Spielgemeinschaft</label>
</div>
<div class="mb-3">
<label for="teamBname2", class="form-label">Team B Name 2</label>
<input type="text" class="form-control" id="teamBname2" aria-describedby="teamBname2help">
<div id="teamBname2help" class="form-text">Wird nur bei einer Spielgemeinschaft angezeigt, sonst leer lassen</div>
</div>
</form>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-success" data-bs-dismiss="modal" onclick="scoreConfigTeams()">Absenden</button> <button type="button" class="btn btn-success" data-bs-dismiss="modal" onclick="">Absenden</button>
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Schließen</button> <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Schließen</button>
</div> </div>
</div> </div>

4
scoreboard/views/indexScore.hbs
View File

@ -15,13 +15,13 @@
<div class="d-flex flex-sm-wrap flex-md-wrap text-center align-items-center justify-content-around box-etc"> <div class="d-flex flex-sm-wrap flex-md-wrap text-center align-items-center justify-content-around box-etc">
<div class="flex-fill order-xs-1 order-sm-1 order-md-1 order-lg-0"> <div class="flex-fill order-xs-1 order-sm-1 order-md-1 order-lg-0">
<h1 id="teamA">Team A</h> <h1 id="scoreTeamA">Team A</h>
</div> </div>
<div class="flex-fill order-xs-0 order-sm-0 order-md-0 order-lg-1"> <div class="flex-fill order-xs-0 order-sm-0 order-md-0 order-lg-1">
<div id="score" class="score"></div> <div id="score" class="score"></div>
</div> </div>
<div class="flex-fill order-xs-2 order-sm-2 order-md-2 order-lg-2"> <div class="flex-fill order-xs-2 order-sm-2 order-md-2 order-lg-2">
<h1 id="teamB">Team B</h> <h1 id="scoreTeamB">Team B</h>
</div> </div>
</div> </div>