Improve handling of loading spinner display.

Going back to /around from /report/new can trigger loadend (and the
spinner hiding function) twice (if the strategy activation starts a
read), with triggerRead aborting that read and triggering the event
itself. This means the spinner is not displayed, as the count falls
below 0. We could pin the count above 0, but instead let’s log each
layer ID while ‘active’ and switch off when they’re all gone.

2 files changed, 18 insertions, 5 deletions

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 9ee873306..aea940ce0 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -45,6 +45,7 @@
         - Fixed CSS padding/overflow bug during sidebar "drawer" animations. #2132
         - Response template containing double quote now works.
         - A few small display issues with RTL text display.
+        - Improve handling of loading spinner display. #2059
     - Admin improvements:
         - Inspectors can set non_public status of reports. #1992
         - Default start date is shown on the dashboard.
diff --git a/web/js/map-OpenLayers.js b/web/js/map-OpenLayers.js
index a96e65953..2e62336ed 100644
--- a/web/js/map-OpenLayers.js
+++ b/web/js/map-OpenLayers.js
@@ -1,3 +1,15 @@
+if (!Object.keys) {
+  Object.keys = function(obj) {
+    var result = [];
+    for (var prop in obj) {
+      if (Object.prototype.hasOwnProperty.call(obj, prop)) {
+        result.push(prop);
+      }
+    }
+    return result;
+  };
+}
+
 var fixmystreet = fixmystreet || {};
 
 fixmystreet.utils = fixmystreet.utils || {};
@@ -247,18 +259,18 @@ $.extend(fixmystreet.utils, {
        * the spinner in the DOM.
        */
       loading_spinner: {
-          count: 0,
+          count: {},
           show: function() {
-              fixmystreet.maps.loading_spinner.count++;
-              if (fixmystreet.maps.loading_spinner.count > 0) {
+              fixmystreet.maps.loading_spinner.count[this.id] = 1;
+              if (Object.keys(fixmystreet.maps.loading_spinner.count).length) {
                   // Show the loading indicator over the map
                   $('#loading-indicator').removeClass('hidden');
                   $('#loading-indicator').attr('aria-hidden', false);
               }
           },
           hide: function() {
-              fixmystreet.maps.loading_spinner.count--;
-              if (fixmystreet.maps.loading_spinner.count <= 0) {
+              delete fixmystreet.maps.loading_spinner.count[this.id];
+              if (!Object.keys(fixmystreet.maps.loading_spinner.count).length) {
                   // Remove loading indicator
                   $('#loading-indicator').addClass('hidden');
                   $('#loading-indicator').attr('aria-hidden', true);