From: Urban Wallasch <urban.wallasch@freenet.de>
Date: Sat, 27 Jul 2019 14:12:29 +0000 (+0200)
Subject: * Improved JavaScript object handling and pause / error status display.
X-Git-Tag: v0.1.0~65
X-Git-Url: https://git.packet-gain.de/?a=commitdiff_plain;h=5d0f01b300615493cc442fb7ae0ddd5018244ec5;p=ets2_tele.git

* Improved JavaScript object handling and pause / error status display.
---

diff --git a/dash.html b/dash.html
index cf3134b..719fa1f 100644
--- a/dash.html
+++ b/dash.html
@@ -55,14 +55,13 @@ x-boxright { float:right; }
 
 
 x-bar {
-  display: block;
+  display: none;
   clear: both;
   width: 100%;
   padding: 0.2em;
   margin: 0.1em;
   border: none;
   font-size: 150%;
-  visibility: hidden;
 }
 .pause {
   background-color:#fd0;
@@ -104,7 +103,7 @@ x-bar {
   </x-boxleft>
 </x-boxleft>
 
-<x-bar class="pause" id="pause"> GAME PAUSED </x-bar>
+<x-bar class="pause" id="pausebar">Paused</x-bar>
 <x-bar class="error" id="errbar"></x-bar>
 
 </x-page>
@@ -134,65 +133,81 @@ function s2hm(s) {
 
 function loadDoc() {
   xhttp.onreadystatechange = function() {
+    var speed = document.getElementById("speed");
+    var ccgtrl = document.getElementById("cctrl");
+    var gear = document.getElementById("gear");
+    var rpm = document.getElementById("rpm");
+    var odometer = document.getElementById("odometer");
+    var fuel = document.getElementById("fuel");
+    var fuel_range = document.getElementById("fuel_range");
+    var fuel_avg = document.getElementById("fuel_avg");
+    var nav_dist = document.getElementById("nav_dist");
+    var nav_eta = document.getElementById("nav_eta");
+    var nav_slimit = document.getElementById("nav_slimit");
+    var nav_slimitsign = document.getElementById("nav_slimitsign")
+
     var errbar = document.getElementById("errbar");
+    var pausebar = document.getElementById("pausebar");
+
     if (this.readyState == 4 && this.status == 200) {
-      var e;
       var tele = JSON.parse(this.responseText);
 
-      errbar.style.visibility = "hidden";
-
-      e = document.getElementById("speed");
-      e.innerHTML = Math.round(tele.speed * 3.6);
+      speed.innerHTML = Math.round(tele.speed * 3.6);
       if ( tele.nav_slimit > 0 && tele.speed > tele.nav_slimit * 1.075 ) {
-        e.classList.remove("warn1");
-        e.classList.add("warn2");
+        speed.classList.remove("warn1");
+        speed.classList.add("warn2");
       }
       else if ( tele.nav_slimit > 0 && tele.speed > tele.nav_slimit * 1.005 ) {
-        e.classList.remove("warn2");
-        e.classList.add("warn1");
+        speed.classList.remove("warn2");
+        speed.classList.add("warn1");
       }
       else {
-        e.classList.remove("warn1");
-        e.classList.remove("warn2");
+        speed.classList.remove("warn1");
+        speed.classList.remove("warn2");
       }
-      document.getElementById("cctrl").innerHTML = Math.round(tele.cctrl * 3.6);
 
-      e = document.getElementById("gear");
-      e.innerHTML = dgear(tele.gear_disp, tele.shifter);
+      cctrl.innerHTML = Math.round(tele.cctrl * 3.6);
+
+      gear.innerHTML = dgear(tele.gear_disp, tele.shifter);
       if ( tele.clutch_eff > 0 )
-        e.classList.add("hilite");
+        gear.classList.add("hilite");
       else
-        e.classList.remove("hilite");
+        gear.classList.remove("hilite");
 
-      document.getElementById("rpm").innerHTML = Math.round(tele.rpm);
-      document.getElementById("odometer").innerHTML = Math.round(tele.odometer);
+      rpm.innerHTML = Math.round(tele.rpm);
+      odometer.innerHTML = Math.round(tele.odometer);
 
-      e = document.getElementById("fuel");
-      e.innerHTML = Math.round(tele.fuel);
+      fuel.innerHTML = Math.round(tele.fuel);
       if ( tele.fuel_warn )
-        e.classList.add("warn1");
+        fuel.classList.add("warn1");
       else
-        e.classList.remove("warn1");
-      document.getElementById("fuel_range").innerHTML = Math.round(tele.fuel_range);
-      document.getElementById("fuel_avg").innerHTML = Math.round(tele.fuel_avg * 1000) / 10;
-
-      document.getElementById("nav_dist").innerHTML = Math.round(tele.nav_dist / 1000);
-      document.getElementById("nav_eta").innerHTML = s2hm(tele.nav_eta);
-      if (tele.nav_slimit > 0 ) {
-        document.getElementById("nav_slimit").innerHTML = Math.round(tele.nav_slimit * 3.6);
-        document.getElementById("nav_slimitsign").style.visibility = "visible";
+        fuel.classList.remove("warn1");
+
+      fuel_range.innerHTML = Math.round(tele.fuel_range);
+
+      fuel_avg.innerHTML = Math.round(tele.fuel_avg * 1000) / 10;
+
+      nav_dist.innerHTML = Math.round(tele.nav_dist / 1000);
+
+      nav_eta.innerHTML = s2hm(tele.nav_eta);
+
+      if ( tele.nav_slimit > 0 ) {
+        nav_slimit.innerHTML = Math.round(tele.nav_slimit * 3.6);
+        nav_slimitsign.style.visibility = "visible";
       }
       else
-        document.getElementById("nav_slimitsign").style.visibility = "hidden";
+        nav_slimitsign.style.visibility = "hidden";
 
-      document.getElementById("pause").style.visibility = tele.paused ? "visible" : "hidden";
+      pausebar.style.display = tele.paused ? "block" : "none";
+      errbar.style.display = "none";
     }
     else if (this.readyState == 4) {
+      pausebar.style.display = "none";
+      errbar.style.display = "block";
       if ( this.status )
         errbar.innerHTML = "Status: " + this.status + "<br>" + this.responseText;
       else
-        errbar.innerHTML = "No response from server.";
-      errbar.style.visibility = "visible";
+        errbar.innerHTML = "Connection error";
     }
   };
   xhttp.open("GET", "/json", true);