Changeset 585 in tmcsimulator

Timestamp:

03/08/2020 02:15:25 PM (6 years ago)

Author:

jdalbey

Message:

Add LIVE indicator

Location:

branches/realtime_VDS/cptms

Files:

• images/fetchError.jpg (added)
• images/fetchError.png (added)
• images/live.svg (added)
• images/sad.svg (added)
• index.html (modified) (3 diffs)
• js/vdsLayer.js (modified) (1 diff)
• last_fetch_time.txt (added)

branches/realtime_VDS/cptms/index.html

@@ -149 +149 @@
     var kCCTVfile = "data_layers/cctv_locations_D12.gjson"; // CCTV locations
     var kHARfile = "data_layers/har_locations_D12.gjson"; // CMS locations 
+    var lastFetchFile = "last_fetch_time.txt";
+    var fetchInterval = 15;
+    var liveImage = "images/live.svg"
     var iconCMSactive = "images/icon_cms_active.png";
     var iconCMSidle = "images/icon_cms_idle.png";
@@ -200 +203 @@
         initVDSbutton();
         initVDSicons();
+        checkLastFetch();
     }
 
@@ -235 +239 @@
         var harTimer = setInterval(loadAllharMessages, 10000);
 
+        var fetchTimer = setInterval(checkLastFetch, 10000);
+
         // Listen for zoom changes and move the vds dots so as to keep a nice
         // visual distance between them appropriate to the zoom factor

branches/realtime_VDS/cptms/js/vdsLayer.js

@@ -160 +160 @@
 }
 
+//initialize live indicator icon
+function initLiveIcon(success) {
+    //create new img tags for live and not-live indicators
+    var live = document.createElement('img');
+    var notLive = document.createElement('img');
+    live.src ="images/live.svg";
+    live.width = 50 ;
+    live.height= 40 ;
+    notLive.src ="images/fetchError.jpg";
+    notLive.width = 50 ;
+    notLive.height= 50 ;
+    // if fetch is a success, display live img
+    if (success) {
+        console.log(live);
+        if (map.controls[google.maps.ControlPosition.TOP_RIGHT].getLength() > 0)
+            map.controls[google.maps.ControlPosition.TOP_RIGHT].pop();
+        map.controls[google.maps.ControlPosition.TOP_RIGHT].push(live);
+    }
+    // if error, display sad smiley image
+    else {
+        console.log(notLive);
+        if (map.controls[google.maps.ControlPosition.TOP_RIGHT].getLength() > 0)
+            map.controls[google.maps.ControlPosition.TOP_RIGHT].pop();
+        map.controls[google.maps.ControlPosition.TOP_RIGHT].push(notLive);
+    }
+}
+
+//reads first line on last fetch file and checks if its less than 15 minutes old
+function checkLastFetch()
+{
+    var rawFile = new XMLHttpRequest();
+    rawFile.open("GET", lastFetchFile, false);
+    rawFile.onreadystatechange = function ()
+    {
+        if(rawFile.readyState === 4)
+        {
+            if(rawFile.status === 200 || rawFile.status == 0)
+            {
+                var text = rawFile.responseText;
+                // get last fetch time from file
+                var lastFetch = new Date(text);
+                // get current date time
+                var now = new Date();
+                // calculate time difference
+                var msec = now - lastFetch;
+                var days = Math.floor(msec / 1000 / 60 / (60 * 24));
+                msec -= days * 1000 * 60 * 60 * 24
+                var hh = Math.floor(msec / 1000 / 60 / 60);
+                msec -= hh * 1000 * 60 * 60;
+                var mm = Math.floor(msec / 1000 / 60);
+                msec -= mm * 1000 * 60;
+                var ss = Math.floor(msec / 1000);
+                msec -= ss * 1000;
+                // display icon if less than 15 
+               if (days === 0 && hh === 0 && mm < fetchInterval)
+                    initLiveIcon(1)
+                else 
+                    initLiveIcon(0)
+                //console.log(days + " Days "+ hh + " Hours " + mm + " Minutes " + ss + " Seconds");
+            }
+        }
+    }
+    rawFile.send(null);
+}