From 78e95f67eb6d8fa2efea499386dd05bcc7689483 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fr=C3=A9d=C3=A9ric=20P=C3=A9ters?= <fpeters@entrouvert.com>
Date: Sun, 17 May 2020 16:22:57 +0200
Subject: [PATCH] toodego: reload around me markers when map center changes
 (#30159)

---
 static/toodego/extra.js | 83 ++++++++++++++++++++++++++++++++---------
 1 file changed, 66 insertions(+), 17 deletions(-)

diff --git a/static/toodego/extra.js b/static/toodego/extra.js
index b8425daa..fbba7d08 100644
--- a/static/toodego/extra.js
+++ b/static/toodego/extra.js
@@ -247,6 +247,17 @@ $(function() {
     var $map_widget = $('div.combo-cell-map');
     var map = $map_widget[0].leaflet_map;
     var search_timeout_id = null;
+    map.q_center_lat = null;
+    map.q_center_lng = null;
+
+    function get_distance(lat1, lng1, lat2, lng2) {
+        // simplest distance approximation https://www.mkompf.com/gps/distcalc.html
+        deglen = 111300;
+        x = lat1 - lat2;
+        lat = (lat1 + lat2) / 2 * 0.01745;
+        y = (lng1 - lng2) * Math.cos(lat1);
+        return deglen * Math.sqrt(x * x + y * y);
+    }
 
     function reset_map_query_string() {
       map.query_string = "";
@@ -254,9 +265,47 @@ $(function() {
         var center = map.getCenter();
         var distance_q = '&distance=1000';
         map.query_string += distance_q + '&lat=' + center.lat + '&lng=' + center.lng;
+        map.q_center_lat = center.lat;
+        map.q_center_lng = center.lng;
       }
     }
 
+    function get_mapsearch_query() {
+      var query = $('#mapsearch input').val();
+      query = query.toLowerCase();
+      query = query.replace(/^rue\s/i, '');
+      return query;
+    }
+
+    function refresh_around_me_query(map) {
+      var query = get_mapsearch_query();
+      if (query.length < 2) {
+        map.query_string = '';
+      } else {
+        map.query_string = 'q=' + query;
+      }
+      var center = map.getCenter();
+      var collectivity_slugs = JSON.parse(document.getElementById('collectivity-slugs').textContent);
+      var distance_q = '&distance=1000';
+
+      for (var i=0; i<collectivity_slugs.length; i++) {
+        if (downcode(query).indexOf(collectivity_slugs[i]) != -1) {
+          distance_q = '';
+          break;
+        }
+      }
+      if (distance_q) {
+        map.q_center_lat = center.lat;
+        map.q_center_lng = center.lng;
+        map.query_string += distance_q + '&lat=' + center.lat + '&lng=' + center.lng;
+      }
+    }
+
+    function refresh_markers(map) {
+      $('.search-page div.cell.map').addClass('loading');
+      map.load_geojson_layers();
+    }
+
     $map_search_input.on('change keyup paste search', function(e) {
       var keycode = e.which || e.keyCode;
       if (keycode == 13) {  // enter
@@ -269,10 +318,8 @@ $(function() {
       $sidebar.empty();
       clearTimeout(search_timeout_id);
       search_timeout_id = setTimeout(function() {
-        var query =  $('#mapsearch input').val();
+        var query = get_mapsearch_query();
         var new_geojson_layers = null;
-        query = query.toLowerCase();
-        query = query.replace(/^rue\s/i, '');
         if (query.length == 0) { // reset view
           reset_map_query_string();
           var initial_zoom = parseInt($map_widget.data('init-zoom'));
@@ -282,23 +329,11 @@ $(function() {
         } else {
           map.query_string = 'q=' + query;
           if (is_autour_de_moi) {
-            var center = map.getCenter();
-            var collectivity_slugs = JSON.parse(document.getElementById('collectivity-slugs').textContent);
-            var distance_q = '&distance=1000';
-            for (var i=0; i<collectivity_slugs.length; i++) {
-              if (downcode(query).indexOf(collectivity_slugs[i]) != -1) {
-                distance_q = '';
-                break;
-              }
-            }
-            if (distance_q) {
-              map.query_string += distance_q + '&lat=' + center.lat + '&lng=' + center.lng;
-            }
+            refresh_around_me_query(map);
           }
         }
         search_timeout_id = null;
-        $('.search-page div.cell.map').addClass('loading');
-        map.load_geojson_layers();
+        refresh_markers(map);
       }, 300);
     });
     $('#mapsearch').on('submit', function() {
@@ -313,7 +348,21 @@ $(function() {
         $('#sidebar').css('min-height', 0);
       }
     });
+    var map_move_timeout_id = null;
     $(map).on('zoomend moveend', function() {
+      if (is_autour_de_moi) {
+        /* if map is moved enough, refresh */
+        var center = map.getCenter();
+        if (map_move_timeout_id) clearTimeout(map_move_timeout_id);
+        map_move_timeout_id = setTimeout(function() {
+          map_move_timeout_id = null;
+          var distance = get_distance(map.q_center_lat, map.q_center_lng, center.lat, center.lng);
+          if (distance > 250) {
+            refresh_around_me_query(map);
+            refresh_markers(map);
+          }
+        }, 300);
+      }
       $(document).trigger('gnm:new-results');
     });