From 7e2ed058a6afadcc9d39808296db936838da8972 Mon Sep 17 00:00:00 2001
From: Bluedragon <bcomsugi@yahoo.com>
Date: Mon, 2 May 2022 03:19:50 +0700
Subject: [PATCH] startrally added autoreconnect if websocket is error

---
 data/startrally.html | 152 ++++++++++++++++++++++++++-----------------
 src/index.h          | 152 ++++++++++++++++++++++++++-----------------
 src/main.cpp         |  20 ++++--
 3 files changed, 203 insertions(+), 121 deletions(-)

diff --git a/data/startrally.html b/data/startrally.html
index 89d00a8..7898feb 100644
--- a/data/startrally.html
+++ b/data/startrally.html
@@ -10,67 +10,101 @@
     <script type = "text/javascript">
     var ping;
     var ws;
+    var wsInterval;
+    window.onerror = function (message, file, line, col, error) {
+      const date = new Date();
+      console.log(date.toLocaleTimeString()+";Onerror->Error occurred: " + error.message);
+      return false;
+    };
+    function checkWS(){
+      const date = new Date();
+      console.log(date.toLocaleTimeString()+";checkWS")
+      if (!ws || ws.readyState === 3 ) loaded();
+    }
+    function wsStartTimer(){
+      const date = new Date();
+      console.log(date.toLocaleTimeString()+";startwsStartTimer")
+      wsInterval = setInterval(checkWS(), 1000);
+    }
+    function wsStopTimer(){
+      const date = new Date();
+      console.log(date.toLocaleTimeString()+";clearWSInterval")
+      if (wsInterval) clearInterval(wsInterval);
+      console.log(wsInterval);
+    }
     function loaded(){
       ws = new WebSocket("ws://%serveripaddress%/ws");
-      console.log("new ws");
+      const date = new Date();
+      console.log(date.toLocaleTimeString()+";new ws");
+    
+      // const ws = new WebSocket("ws://%serveripaddress%/ws");
+      ws.onopen = function() {
+        const date = new Date();
+        console.log(date.toLocaleTimeString()+";WebSocket Connected");
+        wsStopTimer();
+        if(document.getElementById("mainTime").classList.contains("bg-danger")){
+            document.getElementById("mainTime").classList.remove("bg-danger")
+        }
+        ping = 1;
+      };
+      ws.onclose = function() {
+        // alert("WS Connection Closed");
+        const date = new Date();
+        console.log(date.toLocaleTimeString()+";WS Connection Closed");
+        if(!document.getElementById("mainTime").classList.contains("bg-danger")){
+          document.getElementById("mainTime").classList.add("bg-danger")
+        }
+        ping = -1;
+        wsStartTimer();
+      };
+      ws.onerror = function(err) {
+        const date = new Date();
+        console.error(date.toLocaleTimeString()+';Socket encountered error: ', err.message, 'Closing socket');
+        ws.close();
+      };
+      ws.onmessage = function(event) {
+        // console.log(event.data);
+        let data = JSON.parse(event.data);
+        // if (data.hasOwnProperty("ping")) {
+        //   console.log("with ping key");
+        //   ping++;
+        // } else{
+          let curTrack=document.getElementById("currenttrack").innerHTML;
+          let tripSpeed=document.getElementById("tripspeed").innerHTML;
+          let tripDist=document.getElementById("tripdist").innerHTML;
+          let tripTime=document.getElementById("triptime").innerHTML;
+          let tripsTime=document.getElementById("tripstime").innerHTML;
+          if(curTrack==data.Trip){
+            if(tripSpeed!=data.TSpeed || tripDist != data.TDist || tripTime!=data.TTime ||tripsTime!=data.TsTime){
+              console.log("Refresh Trip "+data.Trip);
+              changeTrip(data.Trip);
+            }
+          }          
+          ping++;
+          document.getElementById("counter").innerHTML =  data.counter+";"+data.counter2;
+          document.getElementById("currenttime").innerHTML = data.Time;
+          document.getElementById("currenttrack").innerHTML = data.Trip;
+          document.getElementById("tripspeed").innerHTML =  data.TSpeed;
+          document.getElementById("tripdist").innerHTML =  data.TDist;
+          document.getElementById("triptime").innerHTML =  data.TTime;
+          document.getElementById("tripstime").innerHTML =  data.TsTime;
+          document.getElementById("currentspeed").innerHTML =  data.curSpeed;
+          document.getElementById("dir1").innerHTML =   data.dir1;
+          document.getElementById("dir2").innerHTML =   data.dir2;
+          document.getElementById("odo1").innerHTML =   data.curDist1;
+          document.getElementById("odo2").innerHTML =   data.curDist2;
+          document.getElementById("time1").innerHTML =   data.time1;
+          document.getElementById("time2").innerHTML =   data.time2;
+          document.getElementById("tdiff1").innerHTML =   data.TDiff;
+          document.getElementById("tdiff2").innerHTML =   data.TDiff;
+        // }
+      };
+    }
+    const checkhealt = setInterval(checkPing, 1000); //heartbeat
     
-    // const ws = new WebSocket("ws://%serveripaddress%/ws");
-    ws.onopen = function() {
-      console.log("WebSocket Connected");
-      if(document.getElementById("mainTime").classList.contains("bg-danger")){
-          document.getElementById("mainTime").classList.remove("bg-danger")
-      }
-      ping = 1;
-    };
-    ws.onclose = function() {
-      // alert("WS Connection Closed");
-      // console.log("WS Connection Closed");
-      if(!document.getElementById("mainTime").classList.contains("bg-danger")){
-        document.getElementById("mainTime").classList.add("bg-danger")
-      }
-      ping = -1;
-    };
-    ws.onmessage = function(event) {
-      // console.log(event.data);
-      let data = JSON.parse(event.data);
-      // if (data.hasOwnProperty("ping")) {
-      //   console.log("with ping key");
-      //   ping++;
-      // } else{
-        let curTrack=document.getElementById("currenttrack").innerHTML;
-        let tripSpeed=document.getElementById("tripspeed").innerHTML;
-        let tripDist=document.getElementById("tripdist").innerHTML;
-        let tripTime=document.getElementById("triptime").innerHTML;
-        let tripsTime=document.getElementById("tripstime").innerHTML;
-        if(curTrack==data.Trip){
-          if(tripSpeed!=data.TSpeed || tripDist != data.TDist || tripTime!=data.TTime ||tripsTime!=data.TsTime){
-            console.log("Refresh Trip "+data.Trip);
-            changeTrip(data.Trip);
-          }
-        }          
-        ping++;
-        document.getElementById("counter").innerHTML =  data.counter+";"+data.counter2;
-        document.getElementById("currenttime").innerHTML = data.Time;
-        document.getElementById("currenttrack").innerHTML = data.Trip;
-        document.getElementById("tripspeed").innerHTML =  data.TSpeed;
-        document.getElementById("tripdist").innerHTML =  data.TDist;
-        document.getElementById("triptime").innerHTML =  data.TTime;
-        document.getElementById("tripstime").innerHTML =  data.TsTime;
-        document.getElementById("currentspeed").innerHTML =  data.curSpeed;
-        document.getElementById("dir1").innerHTML =   data.dir1;
-        document.getElementById("dir2").innerHTML =   data.dir2;
-        document.getElementById("odo1").innerHTML =   data.curDist1;
-        document.getElementById("odo2").innerHTML =   data.curDist2;
-        document.getElementById("time1").innerHTML =   data.time1;
-        document.getElementById("time2").innerHTML =   data.time2;
-        document.getElementById("tdiff1").innerHTML =   data.TDiff;
-        document.getElementById("tdiff2").innerHTML =   data.TDiff;
-      // }
-    };
-  }
-    setInterval(checkPing, 1000); //heartbeat
     function checkPing(){
-      // console.log("ping="+ping);
+      // const date = new Date();
+      // console.log(date.toLocaleTimeString()+";ping="+ping);
       ping--;
       if (ping>=0){
         ping=0;
@@ -80,15 +114,17 @@
         if(!document.getElementById("mainTime").classList.contains("bg-danger")){
           document.getElementById("mainTime").classList.add("bg-danger")
         }
+
       }
     }
+
     function onlyNumberKey(evt,e) {
             // Only ASCII character in that range allowed
             var ASCIICode = (evt.which) ? evt.which : evt.keyCode
             if (ASCIICode > 31 && (ASCIICode < 48 || ASCIICode > 57) && ASCIICode !=46)
                 return false;
             return true;
-        }
+    }
   </script>
 </head><body onload="loaded();">
 <!--
diff --git a/src/index.h b/src/index.h
index a1f37cb..c12e002 100644
--- a/src/index.h
+++ b/src/index.h
@@ -11,67 +11,101 @@ const char HTML_startrally[] PROGMEM = R"rawliteral(
     <script type = "text/javascript">
     var ping;
     var ws;
+    var wsInterval;
+    window.onerror = function (message, file, line, col, error) {
+      const date = new Date();
+      console.log(date.toLocaleTimeString()+";Onerror->Error occurred: " + error.message);
+      return false;
+    };
+    function checkWS(){
+      const date = new Date();
+      console.log(date.toLocaleTimeString()+";checkWS")
+      if (!ws || ws.readyState === 3 ) loaded();
+    }
+    function wsStartTimer(){
+      const date = new Date();
+      console.log(date.toLocaleTimeString()+";startwsStartTimer")
+      wsInterval = setInterval(checkWS(), 1000);
+    }
+    function wsStopTimer(){
+      const date = new Date();
+      console.log(date.toLocaleTimeString()+";clearWSInterval")
+      if (wsInterval) clearInterval(wsInterval);
+      console.log(wsInterval);
+    }
     function loaded(){
       ws = new WebSocket("ws://%serveripaddress%/ws");
-      console.log("new ws");
+      const date = new Date();
+      console.log(date.toLocaleTimeString()+";new ws");
+    
+      // const ws = new WebSocket("ws://%serveripaddress%/ws");
+      ws.onopen = function() {
+        const date = new Date();
+        console.log(date.toLocaleTimeString()+";WebSocket Connected");
+        wsStopTimer();
+        if(document.getElementById("mainTime").classList.contains("bg-danger")){
+            document.getElementById("mainTime").classList.remove("bg-danger")
+        }
+        ping = 1;
+      };
+      ws.onclose = function() {
+        // alert("WS Connection Closed");
+        const date = new Date();
+        console.log(date.toLocaleTimeString()+";WS Connection Closed");
+        if(!document.getElementById("mainTime").classList.contains("bg-danger")){
+          document.getElementById("mainTime").classList.add("bg-danger")
+        }
+        ping = -1;
+        wsStartTimer();
+      };
+      ws.onerror = function(err) {
+        const date = new Date();
+        console.error(date.toLocaleTimeString()+';Socket encountered error: ', err.message, 'Closing socket');
+        ws.close();
+      };
+      ws.onmessage = function(event) {
+        // console.log(event.data);
+        let data = JSON.parse(event.data);
+        // if (data.hasOwnProperty("ping")) {
+        //   console.log("with ping key");
+        //   ping++;
+        // } else{
+          let curTrack=document.getElementById("currenttrack").innerHTML;
+          let tripSpeed=document.getElementById("tripspeed").innerHTML;
+          let tripDist=document.getElementById("tripdist").innerHTML;
+          let tripTime=document.getElementById("triptime").innerHTML;
+          let tripsTime=document.getElementById("tripstime").innerHTML;
+          if(curTrack==data.Trip){
+            if(tripSpeed!=data.TSpeed || tripDist != data.TDist || tripTime!=data.TTime ||tripsTime!=data.TsTime){
+              console.log("Refresh Trip "+data.Trip);
+              changeTrip(data.Trip);
+            }
+          }          
+          ping++;
+          document.getElementById("counter").innerHTML =  data.counter+";"+data.counter2;
+          document.getElementById("currenttime").innerHTML = data.Time;
+          document.getElementById("currenttrack").innerHTML = data.Trip;
+          document.getElementById("tripspeed").innerHTML =  data.TSpeed;
+          document.getElementById("tripdist").innerHTML =  data.TDist;
+          document.getElementById("triptime").innerHTML =  data.TTime;
+          document.getElementById("tripstime").innerHTML =  data.TsTime;
+          document.getElementById("currentspeed").innerHTML =  data.curSpeed;
+          document.getElementById("dir1").innerHTML =   data.dir1;
+          document.getElementById("dir2").innerHTML =   data.dir2;
+          document.getElementById("odo1").innerHTML =   data.curDist1;
+          document.getElementById("odo2").innerHTML =   data.curDist2;
+          document.getElementById("time1").innerHTML =   data.time1;
+          document.getElementById("time2").innerHTML =   data.time2;
+          document.getElementById("tdiff1").innerHTML =   data.TDiff;
+          document.getElementById("tdiff2").innerHTML =   data.TDiff;
+        // }
+      };
+    }
+    const checkhealt = setInterval(checkPing, 1000); //heartbeat
     
-    // const ws = new WebSocket("ws://%serveripaddress%/ws");
-    ws.onopen = function() {
-      console.log("WebSocket Connected");
-      if(document.getElementById("mainTime").classList.contains("bg-danger")){
-          document.getElementById("mainTime").classList.remove("bg-danger")
-      }
-      ping = 1;
-    };
-    ws.onclose = function() {
-      // alert("WS Connection Closed");
-      // console.log("WS Connection Closed");
-      if(!document.getElementById("mainTime").classList.contains("bg-danger")){
-        document.getElementById("mainTime").classList.add("bg-danger")
-      }
-      ping = -1;
-    };
-    ws.onmessage = function(event) {
-      // console.log(event.data);
-      let data = JSON.parse(event.data);
-      // if (data.hasOwnProperty("ping")) {
-      //   console.log("with ping key");
-      //   ping++;
-      // } else{
-        let curTrack=document.getElementById("currenttrack").innerHTML;
-        let tripSpeed=document.getElementById("tripspeed").innerHTML;
-        let tripDist=document.getElementById("tripdist").innerHTML;
-        let tripTime=document.getElementById("triptime").innerHTML;
-        let tripsTime=document.getElementById("tripstime").innerHTML;
-        if(curTrack==data.Trip){
-          if(tripSpeed!=data.TSpeed || tripDist != data.TDist || tripTime!=data.TTime ||tripsTime!=data.TsTime){
-            console.log("Refresh Trip "+data.Trip);
-            changeTrip(data.Trip);
-          }
-        }          
-        ping++;
-        document.getElementById("counter").innerHTML =  data.counter+";"+data.counter2;
-        document.getElementById("currenttime").innerHTML = data.Time;
-        document.getElementById("currenttrack").innerHTML = data.Trip;
-        document.getElementById("tripspeed").innerHTML =  data.TSpeed;
-        document.getElementById("tripdist").innerHTML =  data.TDist;
-        document.getElementById("triptime").innerHTML =  data.TTime;
-        document.getElementById("tripstime").innerHTML =  data.TsTime;
-        document.getElementById("currentspeed").innerHTML =  data.curSpeed;
-        document.getElementById("dir1").innerHTML =   data.dir1;
-        document.getElementById("dir2").innerHTML =   data.dir2;
-        document.getElementById("odo1").innerHTML =   data.curDist1;
-        document.getElementById("odo2").innerHTML =   data.curDist2;
-        document.getElementById("time1").innerHTML =   data.time1;
-        document.getElementById("time2").innerHTML =   data.time2;
-        document.getElementById("tdiff1").innerHTML =   data.TDiff;
-        document.getElementById("tdiff2").innerHTML =   data.TDiff;
-      // }
-    };
-  }
-    setInterval(checkPing, 1000); //heartbeat
     function checkPing(){
-      // console.log("ping="+ping);
+      // const date = new Date();
+      // console.log(date.toLocaleTimeString()+";ping="+ping);
       ping--;
       if (ping>=0){
         ping=0;
@@ -81,15 +115,17 @@ const char HTML_startrally[] PROGMEM = R"rawliteral(
         if(!document.getElementById("mainTime").classList.contains("bg-danger")){
           document.getElementById("mainTime").classList.add("bg-danger")
         }
+
       }
     }
+
     function onlyNumberKey(evt,e) {
             // Only ASCII character in that range allowed
             var ASCIICode = (evt.which) ? evt.which : evt.keyCode
             if (ASCIICode > 31 && (ASCIICode < 48 || ASCIICode > 57) && ASCIICode !=46)
                 return false;
             return true;
-        }
+    }
   </script>
 </head><body onload="loaded();">
 <!--
diff --git a/src/main.cpp b/src/main.cpp
index 0812a9e..7ff4c16 100644
--- a/src/main.cpp
+++ b/src/main.cpp
@@ -4321,23 +4321,33 @@ void loop() //loop from VSS RALLY V2
       // Serial.print("calculationRallyTime=");Serial.println(micros()-broadcastwebsocket);
       iscalculatingRally=false;
       // Serial.println(strRallyJson);
-      ws.textAll(strRallyJson);
+      if (strRallyJson){
+        ws.textAll(strRallyJson);
+      } else {
+        Serial.print("strRallyJson error:");Serial.println(strRallyJson);
+      }
       // Serial.print("calculationRallyToTTime=");Serial.println(micros()-broadcastwebsocket);
       broadcastwebsocket = millis();
     }
 
     if ((millis()-timerWebsocketCalibration) > 499 && !isloadingConst && gHasCalibClient) {
       timerWebsocketCalibration = millis();
-      // if (gHasCalibClient) {
-        redrawcalibrationMenuForESP32();
+      redrawcalibrationMenuForESP32();
+      if (strCalibJson){
         wscal.textAll(strCalibJson);
-      // }
+      } else {
+        Serial.print("strCalibJson error:");Serial.println(strCalibJson);
+      }
     }
 
     if ((millis()-timerWebsocketSetTime) > 450  && gHasSetTimeClient) {
       timerWebsocketSetTime = millis();
       fillSetTimeJsonForESP32();
-      wssettime.textAll(strSetTimeJson);
+      if (strSetTimeJson){
+        wssettime.textAll(strSetTimeJson);
+      } else {
+        Serial.print("strSetTimeJson error:");Serial.println(strSetTimeJson);
+      }
     }
 
     if ((millis()-timerDS3231Get) > 500  && (gHasCalibClient || gHasRallyClient || gHasSetTimeClient || gHasLcdClient)) {