Implement clean switching between online and offline mode

Now it is simple. When we are online, #remote div is shown and #local
is hidden, when offline, it is the opposite.

diff --git a/templates/main.js b/templates/main.js
index f0b50e1e5f3de1a735a17bbeabc21914c6256f1c..034fcfa96f28bc8262158d8f5d4d9cae3857f543 100644 (file)
--- a/templates/main.js
+++ b/templates/main.js
@@ -35,22 +35,24 @@ var flavorChosen;
 function updateUI()
 {
     try {
-        if (updateRemote === undefined) {
-            update("remote", "<center>Server offline...</center>");
-            document.getElementById("local").style.display = "block";
-            loadRemote();
-        } else {
-            document.getElementById("local").style.display = "none";
+        let offline = updateRemote === undefined;
 
-            if (id_user !== undefined) {
-                document.getElementById("nextStep").innerHTML = "Now select a beverage on the coffee machine…";
-            } else {
-                document.getElementById("nextStep").innerHTML = "Enjoy your " + flavorChosen + "!";
-            }
+        document.getElementById("local").style.display = !offline ? "none" : "block";
+        document.getElementById("remote").style.display = offline ? "none" : "block";
 
-            if (timeToLogout !== undefined)
-                document.getElementById("logout_button").innerHTML = '<br>logout<br>(' + timeToLogout + ' s)';
+        if (offline) {
+            loadRemote();       // Try to contact the server periodically
+            return;
         }
+
+        if (id_user !== undefined) {
+            document.getElementById("nextStep").innerHTML = "Now select a beverage on the coffee machine…";
+        } else {
+            document.getElementById("nextStep").innerHTML = "Enjoy your " + flavorChosen + "!";
+        }
+
+        if (timeToLogout !== undefined)
+            document.getElementById("logout_button").innerHTML = '<br>logout<br>(' + timeToLogout + ' s)';
     }
     catch (err) {
         console.log("Error: ", err);