From efa084dd0ad092bbfce37a5bfec902312c245810 Mon Sep 17 00:00:00 2001
From: Sami Mokaddem <mokaddem.sami@gmail.com>
Date: Thu, 26 Oct 2017 10:58:56 +0200
Subject: [PATCH] Auto-update geoTop + fixed bug duplicate markers

---
 templates/geo.html | 23 +++++++++++++++++++++--
 1 file changed, 21 insertions(+), 2 deletions(-)

diff --git a/templates/geo.html b/templates/geo.html
index ebe161e..b211cdf 100644
--- a/templates/geo.html
+++ b/templates/geo.html
@@ -86,6 +86,7 @@ small {
                     <div class='leftSepa textTopHeader'>
                         <strong>Date: <input type="text" id="datepicker" size="30" style="margin-bottom: 5px;"></strong>
                     </div>
+                    <div id="alertUpdate" class="textTopHeader alert alert-info" style="margin-left: 100px; Display: none;">Maps updated</div>
                 </div>
             </div>
             <!-- /.navbar-header -->
@@ -210,7 +211,10 @@ small {
     const OSMURL='http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
     const OSMATTRIB='Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors';
     var ZOOMLEVEL = 15;
+    var updateFrequency = 1000*60*60*1 //1h
+    var updateFrequency = 1000*20*1 //1h
     var allOpenStreetMap = {};
+    var savedMarker = {};
     var datePickerWidget;
 
     for(var i=1; i<7; i++) {
@@ -242,10 +246,21 @@ small {
     function updateTopMaps(dayNum) {
         $.getJSON("{{ url_for('getTopCoord') }}?dayNum="+dayNum, function(list){
             for(var i=0; i<6 && i<list.length; i++) {
+                // create marker + flyToIt
                 coordJson = JSON.parse(list[i][0]);
                 allOpenStreetMap[i+1].flyTo([coordJson.lat, coordJson.lon], ZOOMLEVEL);
-                var marker = L.marker([coordJson.lat, coordJson.lon]).addTo(allOpenStreetMap[i+1]);
-                marker.bindPopup('lat: '+coordJson.lat+', lon: '+coordJson.lon+' - '+list[i][1]).openPopup();
+
+                // update marker
+                var markerToUpdate = savedMarker[i+1];
+                if (markerToUpdate != undefined) {
+                    markerToUpdate.setLatLng({lat: coordJson.lat, lng: coordJson.lon});
+                    markerToUpdate._popup._content = 'lat: '+coordJson.lat+', lon: '+coordJson.lon+' - '+list[i][1];
+                    markerToUpdate.update();
+                } else { // create new marker
+                    var marker = L.marker([coordJson.lat, coordJson.lon]).addTo(allOpenStreetMap[i+1]);
+                    savedMarker[i+1] = marker;
+                    marker.bindPopup('lat: '+coordJson.lat+', lon: '+coordJson.lon+' - '+list[i][1]).openPopup();
+                }
             }
         });
     }
@@ -310,6 +325,10 @@ small {
         });
 
         updateAll();
+        setInterval(function(){ 
+            updateAll(); 
+            $("#alertUpdate").fadeIn(2200).fadeOut(2200);
+        }, updateFrequency);
 
     });