frontend with bootstrap

RpiLedBars/frontend/web/index_network_handler.js

@@ -0,0 +1,51 @@
+function wait_reconnection() {
+    --timeout;
+    document.getElementById("time-left").innerHTML = timeout + "s";
+    if (timeout == 0) {
+        clearInterval(timer);
+        reconnect();
+    }
+}
+
+function reconnect() {
+    socket = new WebSocket("ws://tropicananass.ovh:8080");
+    timeout = 60;
+
+    socket.onopen = function(e) {
+        console.log("[open] ws: Connection established");
+        clearInterval(timer);
+        modal.hide();
+    };
+
+    socket.onmessage = function(event) {
+        console.log(`[message] ws: Data received from server: ${event.data}`);
+        let message = event.data.split(":");
+        let command = message[0];
+        let payload = message[1];
+        console.log(command + ", " + payload);
+        switch (command) {
+            case 'm':
+                document.getElementById("mode-input").elements["mode-selection"][payload].checked = true;
+                break;
+
+            default:
+                break;
+        }
+    };
+
+    socket.onclose = function(event) {
+        if (event.wasClean) {
+            console.log(`[close] ws: Connection closed cleanly, code=${event.code} reason=${event.reason}`);
+        } else {
+            // e.g. server process killed or network down
+            // event.code is usually 1006 in this case
+            console.log('[close] ws: Connection died');
+            timer = setInterval(wait_reconnection, 1000);
+            modal.show();
+        }
+    };
+
+    socket.onerror = function(error) {
+        console.log(`[error] ws: ${error.message}`);
+    };
+}