Cleanup, comments, removed ejs stuff

scoreboard/public/javascripts/index.js

@@ -1,9 +1,13 @@
 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
@@ -16,4 +20,29 @@ socket.on('timerEnded', (message) => {
 
 socket.on('refresh', (message) => {
     document.location.reload()                                      // Reload page on received 'refresh' messagen
-});
+});
+
+// ######################################################################################################################################################
+// General functions
+// ######################################################################################################################################################
+
+// Update DOM timer elements from passed values
+function updateTimerFrontend(values) {
+    document.getElementById("durationLeft").innerHTML = values.print;   // Display durationLeft as prettyfied string
+}
+
+// Initial update gets called whenever page has been loaded
+async function initialUpdate() {
+    timerGetValues();                                           // Request new values for timer
+}
+
+// ######################################################################################################################################################
+// 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
+}

scoreboard/public/javascripts/indexScore.js

@@ -1,9 +1,13 @@
 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
@@ -23,19 +27,44 @@ socket.on('score', (message) => {
     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 switch status to received score enabled value
+    document.getElementById("score").innerHTML = values.print;          // Set score on admin interface
 }
 
 async function initialUpdate() {
-    scoreGetValues();
+    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 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)
+    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
+    console.log(data);                                          // Print received data
-    updateScoreFrontend(data);                              // Update admin frontend with received values for scoreboard
+    updateScoreFrontend(data);                                  // Update admin frontend with received values for scoreboard
 }

scoreboard/routes/admin.js

@@ -5,6 +5,10 @@ const io = require('../controllers/socketio');
 const timer = require('../controllers/timer');
 const score = require('../controllers/score');
 
+// ######################################################################################################################################################
+// General endpoints
+// ######################################################################################################################################################
+
 // Express router endpoint to trigger a frontend refresh on all connected sockets
 router.get('/refreshMonitor', function(req, res, next) {
     console.log("Monitor neu geladen");
@@ -13,6 +17,10 @@ router.get('/refreshMonitor', function(req, res, next) {
     res.send();                             // send empty response
 });
 
+// ######################################################################################################################################################
+// Timerendpoints
+// ######################################################################################################################################################
+
 // Express router entpoint to start the timer
 router.get('/timerStart', function(req, res, next) {
     if(timer.start()) {                     // If successfully started the timer
@@ -51,6 +59,10 @@ router.get('/timerGetValues', function(req, res, next) {
     res.json(timer.getValues());            // Respond with important values for frontend
 });
 
+// ######################################################################################################################################################
+// Scoreboard endpoints
+// ######################################################################################################################################################
+
 // Express router endpoint to toggle the scoreboard
 router.get('/scoreToggle', function(req, res, next) {
     if(score.getEnabled()) {                // If scoreboard enabled

scoreboard/routes/index.js

@@ -1,19 +1,16 @@
 var express = require('express');
 var router = express.Router();
 let io = require('../controllers/socketio');
-const timer = require('../controllers/timer');
+
-const score = require('../controllers/score');
+const score = require("../controllers/score");
 
 /* GET home page. */
 router.get('/', function(req, res, next) {
-  if (score.getEnabled()) {                                      // If scoreboard is enabled
+    if (score.getEnabled()) {                   // If scoreboard is enabled
-    res.render('indexScore', { 
+        res.render('indexScore', {});           // Render the site with scoreboard
-      title: "Timer and Score",
+    } else {                                    // If scoreboard is not enabled
-      durationLeft: timer.print(),
+        res.render('index', {});                // Render the site without scoreboard
-    });
+    }
-  } else {                                                      // If scoreboard is not enabled
-    res.render('index', { title: "Timer", durationLeft: timer.print()})
-  }
 });
 
 io.on('connection', (socket) => {
@@ -21,9 +18,8 @@ io.on('connection', (socket) => {
     socket.emit("Hello user from server");
 
     socket.on('message', (message) => {
-      console.log(message)
+        console.log(message)
     })
 })
 
-
 module.exports = router;

scoreboard/views/index.hbs

@@ -1,15 +1,15 @@
 <!DOCTYPE html>
 <html>
   <head>
-    <title>{{ title }}</title>
+    <title>Index</title>
     <link rel='stylesheet' href='/stylesheets/bootstrap/bootstrap.min.css' />
     <link rel='stylesheet' href='/stylesheets/index.css' />
     <link rel='stylesheet' href='/stylesheets/seven-segment.css' />
   </head>
-  <body>
+  <body onload="initialUpdate()">
 
     <div class="d-flex flex-column align-items-center justify-content-center box-time">
-      <div id="durationLeft" class="durationLeft">{{ durationLeft }}</div>
+      <div id="durationLeft" class="durationLeft"></div>
     </div>
 
   </body>

scoreboard/views/indexScore.hbs

@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
-    <title>{{ title }}</title>
+    <title>IndexScore</title>
     <link rel='stylesheet' href='/stylesheets/bootstrap/bootstrap.min.css' />
     <link rel='stylesheet' href='/stylesheets/indexScore.css' />
     <link rel='stylesheet' href='/stylesheets/seven-segment.css' />
@@ -9,7 +9,7 @@
   <body onload="initialUpdate()">
 
     <div class="d-flex flex-column align-items-center justify-content-center box-time">
-      <div id="durationLeft" class="durationLeft">{{ durationLeft }}</div>
+      <div id="durationLeft" class="durationLeft"></div>
     </div>