Map: manage a default limit to items displayed

7 files changed, 70 insertions, 5 deletions

diff --git a/example_project/settings.py b/example_project/settings.py
index 0fb4a22da..bedcfaec7 100644
--- a/example_project/settings.py
+++ b/example_project/settings.py
@@ -229,6 +229,9 @@ LOGGING = {
 USE_BACKGROUND_TASK = False
 
 # Ishtar custom
+
+ISHTAR_MAP_MAX_ITEMS = 50000
+
 SRID = 27572
 SURFACE_SRID = 2154
 ENCODING = 'windows-1252'
diff --git a/ishtar_common/context_processors.py b/ishtar_common/context_processors.py
index 786d3f5b5..3835466da 100644
--- a/ishtar_common/context_processors.py
+++ b/ishtar_common/context_processors.py
@@ -28,7 +28,8 @@ from menus import Menu
 
 
 def get_base_context(request):
-    dct = {'URL_PATH': settings.URL_PATH, 'BASE_URL': ''}
+    dct = {'URL_PATH': settings.URL_PATH, 'BASE_URL': '',
+           "ISHTAR_MAP_MAX_ITEMS": settings.ISHTAR_MAP_MAX_ITEMS}
     if 'HTTP_HOST' in request.META:
         dct['BASE_URL'] = "{}://{}".format(request.scheme,
                                            request.META['HTTP_HOST'])
diff --git a/ishtar_common/static/js/ishtar.js b/ishtar_common/static/js/ishtar.js
index e7ec6850c..e8652720a 100644
--- a/ishtar_common/static/js/ishtar.js
+++ b/ishtar_common/static/js/ishtar.js
@@ -29,6 +29,17 @@ if (typeof String.prototype.endsWith !== 'function') {
     };
 }
 
+if (typeof String.prototype.format !== 'function') {
+    String.prototype.format = function() {
+        var formatted = this;
+        for (var arg in arguments) {
+            formatted = formatted.replace("{" + arg + "}", arguments[arg]);
+        }
+        return formatted;
+    };
+}
+
+
 function manage_async_link(event){
     event.preventDefault();
     var url = $(this).attr('href');
@@ -1250,16 +1261,39 @@ var render_map_list_modal = function(map_id){
     return html;
 };
 
-var render_map = function(map_id){
+var limit_map_msg = "Limit to {0} items";
+var limit_map_help_msg = "Unchecking this limit on a poorly performing device may result in web browser freeze";
+var limit_map_nb = 50000;
+var current_map_limit = limit_map_nb;
+
+var render_map = function(map_id, use_map_limit){
     var html = "";
+    html += "<div class='ishtar-map-top row'>";
+    html += "<div class='ishtar-map-info col-sm' id='ishtar-map-info-" + map_id + "'></div>";
+    html += "<div class='ishtar-map-limit col-sm form-check'>";
+    html += "<input class='form-check-input' type='checkbox' id='ishtar-map-limit-" + map_id + "' ";
+    if (use_map_limit) html += " checked='checked'";
+    html += "/> ";
+    html += "<label class='form-check-label' for='ishtar-map-limit-" + map_id + "'>" + limit_map_msg.format(limit_map_nb);
+    html += " <i class='fa fa-question-circle' title=\""+  limit_map_help_msg  +"\" aria-hidden='true'></i></label>";
+    html += "</div></div>";
     html += "<div class='ishtar-table-map' id='" + map_id + "'></div>";
     html += "<div class='ishtar-map-popup' id='ishtar-map-popup-" + map_id + "'></div>";
     html += render_map_list_modal(map_id);
+    current_map_limit = limit_map_nb;
     return html;
 };
 
 var register_map = function(map_id, points){
     display_map(map_id, points);
+    $('#ishtar-map-limit-' + map_id).change(function() {
+        if ($(this).prop('checked')) {
+            current_map_limit = limit_map_nb;
+        } else {
+            current_map_limit = 0;
+        }
+        $(".search_button").click();
+    });
 };
 
 var main_submit_search = function(){
@@ -1295,5 +1329,9 @@ var search_get_query_data = function(query_vars, table_name){
         if (data) data += "&";
         data += "start=" + ((current_image_page - 1) * $(id_select).val());
     }
+    if (current_tab == "map" && !current_map_limit){
+        if (data) data += "&";
+        data += "no_limit=true";
+    }
     return data;
 };
diff --git a/ishtar_common/templates/base.html b/ishtar_common/templates/base.html
index 7807769e5..2a757b6a4 100644
--- a/ishtar_common/templates/base.html
+++ b/ishtar_common/templates/base.html
@@ -35,6 +35,7 @@
     {{EXTRA_JS|safe}}
     <script type='text/javascript'>
     var static_path = "{{STATIC_URL}}";
+    var limit_map_nb = {{ISHTAR_MAP_MAX_ITEMS}};
     var shortcut_url = '{% url "shortcut-menu" %}';
     {% if DISPLAY_PIN_MENU %}var show_shortcut_menu = true;{% endif %}
     var alert_url = '{% url "alert-list" %}';
@@ -66,6 +67,8 @@
     var track_me_msg = "{% trans "Geolocalize me" %}";
     var geoloc_activated_msg = "{% trans "Geolocation activated" %}";
     var geoloc_disabled_msg = "{% trans "Geolocation disabled" %}";
+    var limit_map_msg = "{% trans "Limit to {0} items" %}";
+    var limit_map_help_msg = "{% trans "Unchecking this limit on a poorly performing device may result in web browser freeze" %}";
     </script>
     {% endcompress %}
     <link rel="stylesheet" href="{{STATIC_URL}}ol/ol.css?ver={{VERSION}}">
diff --git a/ishtar_common/templates/blocks/DataTables.html b/ishtar_common/templates/blocks/DataTables.html
index cf33a8cfa..75151615e 100644
--- a/ishtar_common/templates/blocks/DataTables.html
+++ b/ishtar_common/templates/blocks/DataTables.html
@@ -110,12 +110,17 @@ map_submit_search = function(){
     if (!nb_select) nb_select = 10;
 
     var url = "{{source}}json-map?length=" + nb_select + "&submited=1&" + data;
+    var use_map_limit = false;
+    if(data.indexOf("no_limit=true") == -1){
+        url += "&limit=" + current_map_limit;
+        use_map_limit = true;
+    }
     $.getJSON(url, function(data) {
         var timestamp = Math.floor(Date.now() / 1000);
         var map_id = "map-" + timestamp;
         $('.modal-progress .modal-header').html("{% trans 'Render map...' %}");
 
-        var html = render_map(map_id);
+        var html = render_map(map_id, use_map_limit);
         $("#tab-content-map-{{name}}").html(html);
         $("#id_{{name}}-length_map").change(map_submit_search);
         if ($('.modal-progress').length > 0){
diff --git a/ishtar_common/views_item.py b/ishtar_common/views_item.py
index bc3962ff6..ffbbbb936 100644
--- a/ishtar_common/views_item.py
+++ b/ishtar_common/views_item.py
@@ -1307,8 +1307,10 @@ def get_item(model, func_name, default_name, extra_request_keys=None,
         except (ValueError, TypeError):
             row_nb = DEFAULT_ROW_NUMBER
 
-        if data_type == 'json-map':  # no limit for map
-            row_nb = None
+        if data_type == 'json-map':  # other limit for map
+            row_nb = settings.ISHTAR_MAP_MAX_ITEMS
+            if request_items.get('no_limit', False):
+                row_nb = None
 
         dct_request_items = {}
 
diff --git a/scss/custom.scss b/scss/custom.scss
index 1808c7e1e..9e50c4205 100644
--- a/scss/custom.scss
+++ b/scss/custom.scss
@@ -62,6 +62,15 @@ label {
     display: inline;
 }
 
+.form-check-label{
+    margin: 0.1em 0.5em;
+}
+
+.form-check-label .fa{
+    font-size: 1.4em;
+    color: $ishtar-color;
+}
+
 pre {
     white-space: pre-wrap;
 }
@@ -798,6 +807,10 @@ ul.compact{
     background: url(../media/images/map-background.jpg) repeat;
 }
 
+.ishtar-map-top{
+    padding: 0.5em;
+}
+
 .ishtar-map-popup{
     background-color: #fff;
     padding: 0.5em 1em;