From d57f9de21efb2d3a3f8961a69759200d070eda7e Mon Sep 17 00:00:00 2001
From: Jakob Ketterl <jakob.ketterl@gmx.de>
Date: Wed, 10 Jul 2019 23:13:03 +0200
Subject: [PATCH] automatic map reconnection

---
 htdocs/map.js | 121 ++++++++++++++++++++++++++++----------------------
 1 file changed, 69 insertions(+), 52 deletions(-)

diff --git a/htdocs/map.js b/htdocs/map.js
index 6ca108c..b104a0a 100644
--- a/htdocs/map.js
+++ b/htdocs/map.js
@@ -21,11 +21,6 @@
     var ws_url = protocol + "://" + (window.location.origin.split("://")[1]) + "/ws/";
     if (!("WebSocket" in window)) return;
 
-    var ws = new WebSocket(ws_url);
-    ws.onopen = function(){
-        ws.send("SERVER DE CLIENT client=map.js type=map");
-    };
-
     var map;
     var markers = {};
     var rectangles = {};
@@ -106,57 +101,79 @@
         });
     };
 
-    ws.onmessage = function(e){
-        if (typeof e.data != 'string') {
-            console.error("unsupported binary data on websocket; ignoring");
-            return
-        }
-		if (e.data.substr(0, 16) == "CLIENT DE SERVER") {
-		    console.log("Server acknowledged WebSocket connection.");
-		    return
-		}
-        try {
-            var json = JSON.parse(e.data);
-            switch (json.type) {
-                case "config":
-                    var config = json.value;
-                    $.getScript("https://maps.googleapis.com/maps/api/js?key=" + config.google_maps_api_key).done(function(){
-                        map = new google.maps.Map($('.openwebrx-map')[0], {
-                            center: {
-                                lat: config.receiver_gps[0],
-                                lng: config.receiver_gps[1]
-                            },
-                            zoom: 5
-                        });
-                        processUpdates(updateQueue);
-                        $.getScript("/static/lib/nite-overlay.js").done(function(){
-                            nite.init(map);
-                            setInterval(function() { nite.refresh() }, 10000); // every 10s
-                        });
-                    });
-                    retention_time = config.map_position_retention_time * 1000;
-                break;
-                case "update":
-                    processUpdates(json.value);
-                break;
-            }
-        } catch (e) {
-            // don't lose exception
-            console.error(e);
-        }
-    };
-    ws.onclose = function(){
-        console.info("onclose");
+    var clearMap = function(){
+        var reset = function(callsign, item) { item.setMap(); };
+        $.each(markers, reset);
+        $.each(rectangles, reset);
+        markers = {};
+        rectangles = {};
     };
 
-    window.onbeforeunload = function() { //http://stackoverflow.com/questions/4812686/closing-websocket-correctly-html5-javascript
-        ws.onclose = function () {};
-        ws.close();
-    };
-    ws.onerror = function(){
-        console.info("onerror");
+    var connect = function(){
+        var ws = new WebSocket(ws_url);
+        ws.onopen = function(){
+            ws.send("SERVER DE CLIENT client=map.js type=map");
+        };
+
+        ws.onmessage = function(e){
+            if (typeof e.data != 'string') {
+                console.error("unsupported binary data on websocket; ignoring");
+                return
+            }
+            if (e.data.substr(0, 16) == "CLIENT DE SERVER") {
+                console.log("Server acknowledged WebSocket connection.");
+                return
+            }
+            try {
+                var json = JSON.parse(e.data);
+                switch (json.type) {
+                    case "config":
+                        var config = json.value;
+                        if (!map) $.getScript("https://maps.googleapis.com/maps/api/js?key=" + config.google_maps_api_key).done(function(){
+                            map = new google.maps.Map($('.openwebrx-map')[0], {
+                                center: {
+                                    lat: config.receiver_gps[0],
+                                    lng: config.receiver_gps[1]
+                                },
+                                zoom: 5
+                            });
+                            processUpdates(updateQueue);
+                            updateQueue = [];
+                            $.getScript("/static/lib/nite-overlay.js").done(function(){
+                                nite.init(map);
+                                setInterval(function() { nite.refresh() }, 10000); // every 10s
+                            });
+                        });
+                        retention_time = config.map_position_retention_time * 1000;
+                    break;
+                    case "update":
+                        processUpdates(json.value);
+                    break;
+                }
+            } catch (e) {
+                // don't lose exception
+                console.error(e);
+            }
+        };
+        ws.onclose = function(){
+            clearMap();
+            setTimeout(connect, 5000);
+        };
+
+        window.onbeforeunload = function() { //http://stackoverflow.com/questions/4812686/closing-websocket-correctly-html5-javascript
+            ws.onclose = function () {};
+            ws.close();
+        };
+
+        /*
+        ws.onerror = function(){
+            console.info("websocket error");
+        };
+        */
     };
 
+    connect();
+
     var infowindow;
     var showInfoWindow = function(locator, pos) {
         if (!infowindow) infowindow = new google.maps.InfoWindow();