added an overlay to the WebUI and some ConnectionHandling

Software/data_src/static/css/tweaks.css

@@ -25,3 +25,20 @@ hr {
     padding: 10px;
 }
 
+#overlay {
+    display: none;
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.8); /* Dunkler Hintergrund mit Transparenz */
+    color: white; /* Textfarbe */
+    justify-content: center;
+    align-items: center;
+    z-index: 9999; /* Stellen Sie sicher, dass es über anderen Elementen liegt */
+}
+
+.overlay-content {
+    text-align: center;
+}

Software/data_src/static/js/websocket.js

@@ -3,8 +3,13 @@ var websocket;
 
 var statusMapping;
 var staticMapping;
+var overlay;
 
-window.addEventListener("load", onLoad);
+document.addEventListener("DOMContentLoaded", function () {
+  // Ihr JavaScript-Code hier, einschließlich der onLoad-Funktion
+  overlay = document.getElementById("overlay");
+  onLoad();
+});
 
 function initWebSocket() {
   console.log("Trying to open a WebSocket connection...");
@@ -46,7 +51,8 @@ function onOpen(event) {
 
 function onClose(event) {
   console.log("Connection closed");
-  setTimeout(initWebSocket, 2000);
+  setTimeout(initWebSocket, 1000);
+  overlay.style.display = "flex";
 }
 
 function onMessage(event) {
@@ -98,6 +104,7 @@ function onMessage(event) {
     console.log("STATIC:");
     console.log(JSON.stringify(result, null, 2));
     fillValuesToHTML(result);
+    overlay.style.display = "none";
     return;
   }
 }
@@ -130,6 +137,7 @@ function onLoad(event) {
   initWebSocket();
   initButtons();
   initSettingInputs();
+  overlay.style.display = "flex";
 }
 
 function websocket_sendevent(element_id, element_value) {