minor fixes, code cleanup, accesibility features

web/css/helpers.css

@@ -117,10 +117,18 @@
     font-size: 11px;
 }
 
+.text-light {
+    font-weight: 300;
+}
+
 .text-bold {
     font-weight: bold;
 }
 
+.text-monospace {
+    font-family: "Roboto Mono", monospace;
+}
+
 .text-gray {
     color: #666;
 }

web/js/main.js

@@ -5,6 +5,7 @@ var socket = new WebSocket(socketAddress);
 var parsedData;
 var data = [];
 let signalChart;
+let updateCounter = 0;
 
 const europe_programmes = [
     "No PTY", "News", "Current Affairs", "Info",
@@ -176,15 +177,12 @@ function getLocalizedTime(serverTime) {
     // Convert server time to a Date object
     const serverDate = new Date(serverTime);
 
-    // Get local time zone offset
-    const localOffset = serverDate.getTimezoneOffset() * 60000; // Convert minutes to milliseconds
-
     // Calculate local time by adding the offset
     const localTime = new Date(serverDate.getTime());
 
     // Format local time
     const options = { year: 'numeric', month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit', hour12: false };
-    const formattedLocalTime = localTime.toLocaleString('en-US', options);
+    const formattedLocalTime = localTime.toLocaleString(navigator.language ? navigator.language : 'en-US', options);
 
     return formattedLocalTime;
 }
@@ -603,12 +601,17 @@ function updateDataElements(parsedData) {
     } else {
         $('#data-station-container').removeAttr('style');
     }
+
+    updateCounter++;
+    if (updateCounter % 30 === 0) {
+        $('#data-ps').attr('aria-label', parsedData.ps);
+        $('#data-rt0').attr('aria-label', parsedData.rt0);
+        $('#data-rt1').attr('aria-label', parsedData.rt1);
+    }
 }
 
 let isEventListenerAdded = false;
 
-let updateCounter = 0;
-
 function updatePanels(parsedData) {
     updateCounter++;
 

web/js/setup.js

@@ -160,6 +160,7 @@ function fetchData() {
 
         $("#tuner-public").prop("checked", data.publicTuner);
         $("#tuner-lock").prop("checked", data.lockToAdmin);
+        $("#shutdown-tuner").prop("checked", data.autoShutdown);
 
         // Check if latitude and longitude are present in the data
         if (data.identification.lat && data.identification.lon) {
@@ -214,6 +215,7 @@ function submitData() {
 
     const publicTuner = $("#tuner-public").is(":checked");
     const lockToAdmin = $("#tuner-lock").is(":checked");
+    const autoShutdown = $("#shutdown-tuner").is(":checked");
   
     const data = {
       webserver: {
@@ -244,7 +246,8 @@ function submitData() {
         adminPass,
       },
       publicTuner, 
-      lockToAdmin
+      lockToAdmin,
+      autoShutdown
     };
   
 

web/setup.ejs

@@ -16,7 +16,7 @@
         <% if (isAdminAuthenticated) { %>
         <div class="panel-100 no-bg">
             <h1>FM-DX WebServer</h1>
-            <h2>[ADMIN PANEL]</h2>
+            <h2 class="text-monospace text-light">[ADMIN PANEL]</h2>
             <p>This web setup allows you to set up your entire tuner. <br>Some settings will only change after a server restart.</p>
             <p>In case you are setting up the webserver for the first time, we already filled fail-safe defaults for you.</p>
         </div>
@@ -51,7 +51,6 @@
                     <input class="input-text w-150" type="text" name="audio-port" id="audio-port" placeholder="8081">
                 </div> 
                 <br>
-                <!--tune password, public/private tuner, admin password, verbose mode-->
             </div>
             <div class="panel-50" style="min-height: 120px;margin-bottom: 0;">
                 <h2>AUDIO SETTINGS</h2>
@@ -147,6 +146,10 @@
                     <input type="checkbox" id="tuner-lock">
                     <label for="tuner-lock">Lock to admin</label>
                 </div><br>
+                <div class="form-group checkbox">
+                    <input type="checkbox" id="shutdown-tuner">
+                    <label for="shutdown-tuner">Auto-shutdown on empty server</label>
+                </div><br>
                 <div class="form-group">
                     <label for="tune-pass">Tune password:</label>
                     <input class="input-text w-150" type="password" name="tune-pass" id="tune-pass">
@@ -179,8 +182,9 @@
         <button onclick="document.location.href='./'" id="back-btn" aria-label="Go back to tuning"><i class="fa-solid fa-arrow-left"></i></button>
         <% } else { %>
         <div class="panel-100 no-bg">
+            <img src="../favicon2.png">
             <h1>FM-DX WebServer</h1>
-            <h2>[ADMIN PANEL]</h2>
+            <h2 class="text-monospace text-light">[ADMIN PANEL]</h2>
             <p>You are currently not logged in as an administrator and therefore can't change the settings.</p>
             <p>Please login below.</p>
         </div>