Switch mapillary and openstreetcam tests to work async

- can't reliably use sinon.spy to tell whether a thing has been called,
  so we listen for events instead and check server.requests()
- make sure to request the next page before dispatching `loadedImages` so
  we can `server.respond()` to the request in the event handler if we want to
- also moves `localeDateString` in the openstreetcam service from parsing
  code to display code, because it's very slow (we can just do this for the
  images we look at, instead of all images we fetch)

modules/services/mapillary.js

@@ -180,18 +180,18 @@ function loadNextTilePage(which, currZoom, url, tile) {
                 cache.rtree.load(features);
             }
 
-            if (which === 'images' || which === 'sequences') {
-                dispatch.call('loadedImages');
-            } else if (which === 'map_features') {
-                dispatch.call('loadedSigns');
-            }
-
             if (data.features.length === maxResults) {  // more pages to load
                 cache.nextPage[tile.id] = nextPage + 1;
                 loadNextTilePage(which, currZoom, url, tile);
             } else {
                 cache.nextPage[tile.id] = Infinity;     // no more pages to load
             }
+
+            if (which === 'images' || which === 'sequences') {
+                dispatch.call('loadedImages');
+            } else if (which === 'map_features') {
+                dispatch.call('loadedSigns');
+            }
         })
         .catch(function() {
             cache.loaded[id] = true;
@@ -326,7 +326,7 @@ export default {
     },
 
 
-    loadSigns: function(context, projection) {
+    loadSigns: function(projection) {
         // if we are looking at signs, we'll actually need to fetch images too
         loadTiles('images', apibase + 'images?', projection);
         loadTiles('map_features', apibase + 'map_features?layers=trafficsigns&min_nbr_image_detections=1&', projection);

modules/services/openstreetcam.js

@@ -95,15 +95,6 @@ function loadNextTilePage(which, currZoom, url, tile) {
                 throw new Error('No Data');
             }
 
-            function localeDateString(s) {
-                if (!s) return null;
-                var detected = utilDetect();
-                var options = { day: 'numeric', month: 'short', year: 'numeric' };
-                var d = new Date(s);
-                if (isNaN(d.getTime())) return null;
-                return d.toLocaleDateString(detected.locale, options);
-            }
-
             var features = data.currentPageItems.map(function(item) {
                 var loc = [+item.lng, +item.lat];
                 var d;
@@ -113,7 +104,7 @@ function loadNextTilePage(which, currZoom, url, tile) {
                         loc: loc,
                         key: item.id,
                         ca: +item.heading,
-                        captured_at: localeDateString(item.shot_date || item.date_added),
+                        captured_at: (item.shot_date || item.date_added),
                         captured_by: item.username,
                         imagePath: item.lth_name,
                         sequence_id: item.sequence_id,
@@ -136,16 +127,16 @@ function loadNextTilePage(which, currZoom, url, tile) {
 
             cache.rtree.load(features);
 
-            if (which === 'images') {
-                dispatch.call('loadedImages');
-            }
-
             if (data.currentPageItems.length === maxResults) {  // more pages to load
                 cache.nextPage[tile.id] = nextPage + 1;
                 loadNextTilePage(which, currZoom, url, tile);
             } else {
                 cache.nextPage[tile.id] = Infinity;     // no more pages to load
             }
+
+            if (which === 'images') {
+                dispatch.call('loadedImages');
+            }
         })
         .catch(function() {
             cache.loaded[id] = true;
@@ -439,7 +430,7 @@ export default {
                 attribution
                     .append('span')
                     .attr('class', 'captured_at')
-                    .text(d.captured_at);
+                    .text(localeDateString(d.captured_at));
 
                 attribution
                     .append('span')
@@ -453,7 +444,18 @@ export default {
                 .attr('href', 'https://openstreetcam.org/details/' + d.sequence_id + '/' + d.sequence_index)
                 .text('openstreetcam.org');
         }
+
         return this;
+
+
+        function localeDateString(s) {
+            if (!s) return null;
+            var detected = utilDetect();
+            var options = { day: 'numeric', month: 'short', year: 'numeric' };
+            var d = new Date(s);
+            if (isNaN(d.getTime())) return null;
+            return d.toLocaleDateString(detected.locale, options);
+        }
     },
 
 

modules/svg/mapillary_signs.js

@@ -142,7 +142,7 @@ export function svgMapillarySigns(projection, context, dispatch) {
             if (service && ~~context.map().zoom() >= minZoom) {
                 editOn();
                 update();
-                service.loadSigns(context, projection);
+                service.loadSigns(projection);
             } else {
                 editOff();
             }