LittleFS mount OK, updated interface, upload to littlefs from browser

RotaxMonitor/data/script.js

@@ -1,14 +1,35 @@
 let ws;
+let lastMessageTimestamp = 0;
+const IDLE_THRESHOLD_MS = 1000;
+const loadingIndicator = document.getElementById("loadingIndicator");
+
+function setLoadingIndicator(visible) {
+    if (!loadingIndicator) {
+        return;
+    }
+
+    loadingIndicator.classList.toggle("hidden", !visible);
+}
+
+function updateLoadingState() {
+    const isConnected = ws && ws.readyState === WebSocket.OPEN;
+    const idle = Date.now() - lastMessageTimestamp >= IDLE_THRESHOLD_MS;
+
+    setLoadingIndicator(isConnected && idle);
+}
 
 function connectWS() {
     ws = new WebSocket("ws://" + location.host + "/ws");
 
     ws.onopen = () => {
         console.log("WebSocket connesso");
+        lastMessageTimestamp = Date.now();
+        setLoadingIndicator(false);
     };
 
     ws.onclose = () => {
         console.log("WebSocket disconnesso, retry...");
+        setLoadingIndicator(false);
         setTimeout(connectWS, 5000);
     };
 
@@ -22,6 +43,9 @@ function connectWS() {
             return;
         }
 
+        lastMessageTimestamp = Date.now();
+        setLoadingIndicator(false);
+
         document.getElementById("datavalid").textContent = data.datavalid ?? "-";
         document.getElementById("timestamp").textContent = data.timestamp ?? "-";
         document.getElementById("volts_gen").textContent = data.volts_gen ?? "-";
@@ -63,4 +87,39 @@ function stop() {
     fetch("/stop");
 }
 
+function uploadLittleFS() {
+    const fileInput = document.getElementById("littlefsFile");
+    const status = document.getElementById("uploadStatus");
+
+    if (!fileInput || fileInput.files.length === 0) {
+        if (status) status.textContent = "Select a file first.";
+        return;
+    }
+
+    const file = fileInput.files[0];
+    const formData = new FormData();
+    formData.append("file", file, file.name);
+
+    if (status) status.textContent = "Uploading...";
+
+    fetch("/upload", {
+        method: "POST",
+        body: formData,
+    })
+        .then((resp) => {
+            if (!resp.ok) {
+                throw new Error("Upload failed: " + resp.status + " " + resp.statusText);
+            }
+            return resp.text();
+        })
+        .then(() => {
+            if (status) status.textContent = "Uploaded: " + file.name;
+            fileInput.value = "";
+        })
+        .catch((err) => {
+            if (status) status.textContent = err.message;
+        });
+}
+
+setInterval(updateLoadingState, 200);
 connectWS();