1 files changed, 104 insertions, 30 deletions

diff --git a/web/js/duplicates.js b/web/js/duplicates.js
index 723c357e9..853456932 100644
--- a/web/js/duplicates.js
+++ b/web/js/duplicates.js
@@ -4,12 +4,30 @@
     // quickly remove them when we’re finished showing duplicates.
     var current_duplicate_markers;
 
+    // keep track of whether the suggestion UI has already been dismissed
+    // for this category
+    var dismissed = false;
+    var dismissed_category = null;
+
     // Report ID will be available on report inspect page,
     // but undefined on new report page.
     var report_id = $("#report_inspect_form .js-report-id").text() || undefined;
 
-    function refresh_duplicate_list() {
-        var category = $('select[name="category"]').val();
+    // Don't make another call whilst one is in progress
+    var in_progress = false;
+
+    function refresh_duplicate_list(evt, params, category) {
+        if (params && params.skip_duplicates) {
+            return;
+        }
+
+        if (in_progress) {
+            return;
+        }
+
+        if (!category) {
+            category = $('select[name="category"]').val();
+        }
         if (category === '-- Pick a category --') {
             return;
         }
@@ -31,12 +49,28 @@
             url_params.pin_size = 'normal';
         }
 
+        if ($('html').hasClass('mobile')) {
+            url_params.inline_maps = 1;
+        }
+
+        if (category && params && params.check_duplicates_dismissal ) {
+            dismissed = category === dismissed_category;
+            dismissed_category = category;
+
+            if (!take_effect()) {
+                remove_duplicate_pins();
+                remove_duplicate_list();
+                return;
+            }
+        }
+
+        in_progress = true;
         $.ajax({
             url: nearby_url,
             data: url_params,
             dataType: 'json'
         }).done(function(response) {
-            if ( response.pins.length ){
+            if (response.pins.length && take_effect()) {
                 render_duplicate_list(response);
                 render_duplicate_pins(response);
             } else {
@@ -61,20 +95,29 @@
         $("#js-duplicate-reports ul").empty().prepend( $reports );
         fixmystreet.set_up.fancybox_images();
 
-        $('#js-duplicate-reports').hide().removeClass('hidden').slideDown();
+        $('#js-duplicate-reports').hide().removeClass('hidden').slideDown(function(){
+            in_progress = false;
+        });
         if ( $('#problem_form').length ) {
             $('.js-hide-if-invalid-category').slideUp();
+            $('.js-hide-if-invalid-category_extras').slideUp();
         }
 
-        // Highlight map pin when hovering associated list item.
-        var timeout;
-        $reports.on('mouseenter', function(){
-            var id = parseInt( $(this).data('reportId'), 10 );
-            clearTimeout( timeout );
-            fixmystreet.maps.markers_highlight( id );
-        }).on('mouseleave', function(){
-            timeout = setTimeout( fixmystreet.maps.markers_highlight, 50 );
-        });
+        if (!fixmystreet.map.events.extensions.buttonclick.isDeviceTouchCapable) {
+            // Highlight map pin when hovering associated list item.
+            // (not on touchscreens though because a) the 'mouseenter' handler means
+            // two taps are required on the 'read more' button - one to highlight
+            // the list item and another to activate the button- and b) the pins
+            // might be scrolled off the top of the screen anyway e.g. on phones)
+            var timeout;
+            $reports.on('mouseenter', function(){
+                var id = parseInt( $(this).data('reportId'), 10 );
+                clearTimeout( timeout );
+                fixmystreet.maps.markers_highlight( id );
+            }).on('mouseleave', function(){
+                timeout = setTimeout( fixmystreet.maps.markers_highlight, 50 );
+            });
+        }
 
         // Add a "select this report" button, when on the report inspect form.
         if ( $('#report_inspect_form').length ) {
@@ -121,33 +164,44 @@
     }
 
     function render_duplicate_pins(api_response) {
+        if (!fixmystreet.markers) {
+            return;
+        }
         var markers = fixmystreet.maps.markers_list( api_response.pins, true );
         fixmystreet.markers.removeFeatures( current_duplicate_markers );
         fixmystreet.markers.addFeatures( markers );
         current_duplicate_markers = markers;
-    }
 
-    function remove_duplicate_list(cb) {
-        var animations = [];
+        // Hide any asset layer that might be visible and get confused with the duplicates
+        var layers = fixmystreet.map.getLayersBy('assets', true);
+        for (var i = 0; i<layers.length; i++) {
+            if (!layers[i].fixmystreet.always_visible && layers[i].getVisibility()) {
+                layers[i].setVisibility(false);
+            }
+        }
+    }
 
-        animations.push( $.Deferred() );
+    function remove_duplicate_list() {
         $('#js-duplicate-reports').slideUp(function(){
             $(this).addClass('hidden');
             $(this).find('ul').empty();
-            animations[0].resolve();
+            in_progress = false;
         });
-        if ( $('#problem_form').length ) {
-            animations.push( $.Deferred() );
-            $('.js-hide-if-invalid-category').slideDown(function(){
-                animations[1].resolve();
-            });
+        if ($('#problem_form').length && take_effect()) {
+            $('.js-hide-if-invalid-category').slideDown();
+            $('.js-hide-if-invalid-category_extras').slideDown();
         }
-
-        $.when.apply(this, animations).then(cb);
     }
 
     function remove_duplicate_pins() {
+        if (!fixmystreet.markers) {
+            return;
+        }
         fixmystreet.markers.removeFeatures( current_duplicate_markers );
+
+        // In order to reinstate a hidden assets layer, let's pretend we've
+        // just picked the category anew, but skip ourselves
+        $(fixmystreet).trigger('report_new:category_change', { skip_duplicates: true });
     }
 
     function inspect_form_state_change() {
@@ -164,7 +218,23 @@
         if (!!duplicate_of) {
             return;
         }
-        refresh_duplicate_list();
+        var category = $("#report_inspect_form [name=category]").val();
+        refresh_duplicate_list(undefined, {}, category);
+    }
+
+    function take_effect() {
+        // We do not want to do anything if any other message is being shown
+        if (document.getElementById('js-category-stopper')) {
+            return false;
+        }
+        if ($('.js-responsibility-message:visible').length) {
+            return false;
+        }
+        // On mobile only show once per category
+        if ($('html').hasClass('mobile') && dismissed) {
+            return false;
+        }
+        return true;
     }
 
     // Want to show potential duplicates when a regular user starts a new
@@ -179,10 +249,14 @@
 
     $('.js-hide-duplicate-suggestions').on('click', function(e){
         e.preventDefault();
-        remove_duplicate_pins();
-        remove_duplicate_list(function(){
-            $('#form_title').focus();
-        });
+        fixmystreet.duplicates.hide();
     });
 
+    fixmystreet.duplicates = {
+        hide: function() {
+            remove_duplicate_pins();
+            remove_duplicate_list();
+            dismissed = true;
+        }
+    };
 })();