diff --git a/index.html b/index.html
index f97818ad5..3f79dabc0 100644
--- a/index.html
+++ b/index.html
@@ -41,6 +41,7 @@
+
diff --git a/js/id/renderer/mapillary_image_layer.js b/js/id/renderer/mapillary_image_layer.js
index 8fae6f0ef..c46d22e50 100644
--- a/js/id/renderer/mapillary_image_layer.js
+++ b/js/id/renderer/mapillary_image_layer.js
@@ -1,8 +1,5 @@
iD.MapillaryImageLayer = function (context) {
- var urlSearch = 'https://a.mapillary.com/v2/search/s/geojson',
- urlImage = 'https://www.mapillary.com/map/im/',
- urlThumb = 'https://d1cuyjsrcm0gby.cloudfront.net/',
- clientId = 'NzNRM2otQkR2SHJzaXJmNmdQWVQ0dzo1ZWYyMmYwNjdmNDdlNmVi',
+ var mapillary = iD.services.mapillary(),
enable = false,
currentImage,
svg, div, request;
@@ -38,7 +35,45 @@ iD.MapillaryImageLayer = function (context) {
return t;
}
- function render(selection) {
+ function render(err, data) {
+ if (err) return;
+
+ var images = [];
+ for (var i = 0; i < data.features.length; i++) {
+ var sequence = data.features[i];
+ for (var j = 0; j < sequence.geometry.coordinates.length; j++) {
+ images.push({
+ key: sequence.properties.keys[j],
+ ca: sequence.properties.cas[j],
+ loc: sequence.geometry.coordinates[j]
+ });
+ if (images.length >= 1000) break;
+ }
+ }
+
+ var g = svg.selectAll('g')
+ .data(images, function(d) { return d.key; });
+
+ var enter = g.enter().append('g')
+ .attr('class', 'image');
+
+ enter.append('path')
+ .attr('class', 'viewfield')
+ .attr('transform', 'scale(1.5,1.5),translate(-8, -13)')
+ .attr('d', 'M 6,9 C 8,8.4 8,8.4 10,9 L 16,-2 C 12,-5 4,-5 0,-2 z');
+
+ enter.append('circle')
+ .attr('dx', '0')
+ .attr('dy', '0')
+ .attr('r', '6');
+
+ g.attr('transform', transform);
+
+ g.exit()
+ .remove();
+ }
+
+ function layer(selection) {
svg = selection.selectAll('svg')
.data([0]);
@@ -107,57 +142,20 @@ iD.MapillaryImageLayer = function (context) {
request = d3.json(urlSearch + '?client_id=' + clientId + '&min_lat=' +
extent[0][1] + '&max_lat=' + extent[1][1] + '&min_lon=' +
extent[0][0] + '&max_lon=' + extent[1][0] + '&max_results=100&geojson=true',
- function (error, data) {
- if (error) return;
-
- var images = [];
-
- for (var i = 0; i < data.features.length; i++) {
- var sequence = data.features[i];
- for (var j = 0; j < sequence.geometry.coordinates.length; j++) {
- images.push({
- key: sequence.properties.keys[j],
- ca: sequence.properties.cas[j],
- loc: sequence.geometry.coordinates[j]
- });
- if (images.length >= 1000) break;
- }
- }
-
- var g = svg.selectAll('g')
- .data(images, function(d) { return d.key; });
-
- var enter = g.enter().append('g')
- .attr('class', 'image');
-
- enter.append('path')
- .attr('class', 'viewfield')
- .attr('transform', 'scale(1.5,1.5),translate(-8, -13)')
- .attr('d', 'M 6,9 C 8,8.4 8,8.4 10,9 L 16,-2 C 12,-5 4,-5 0,-2 z');
-
- enter.append('circle')
- .attr('dx', '0')
- .attr('dy', '0')
- .attr('r', '6');
-
- g.attr('transform', transform);
-
- g.exit()
- .remove();
- });
+ );
}
- render.enable = function(_) {
+ layer.enable = function(_) {
if (!arguments.length) return enable;
enable = _;
- return render;
+ return layer;
};
- render.dimensions = function(_) {
+ layer.dimensions = function(_) {
if (!arguments.length) return svg.dimensions();
svg.dimensions(_);
- return render;
+ return layer;
};
- return render;
+ return layer;
};
diff --git a/js/id/services/mapillary.js b/js/id/services/mapillary.js
new file mode 100644
index 000000000..5a0b572d4
--- /dev/null
+++ b/js/id/services/mapillary.js
@@ -0,0 +1,25 @@
+iD.services.mapillary = function() {
+ var mapillary = {},
+ apiBase = 'https://a.mapillary.com/v2/',
+ urlSearch = 'search/s/geojson',
+ urlImage = 'https://www.mapillary.com/map/im/',
+ urlThumb = 'https://d1cuyjsrcm0gby.cloudfront.net/',
+ clientId = 'NzNRM2otQkR2SHJzaXJmNmdQWVQ0dzo1ZWYyMmYwNjdmNDdlNmVi';
+
+
+ mapillary.images = function(location, callback) {
+ var cache = iD.services.mapillary.cache;
+ };
+
+ mapillary.reset = function() {
+ iD.services.mapillary.cache = rbush();
+ return mapillary;
+ };
+
+
+ if (!iD.services.mapillary.cache) {
+ mapillary.reset();
+ }
+
+ return mapillary;
+};
diff --git a/test/index.html b/test/index.html
index 58735a09c..c8b018623 100644
--- a/test/index.html
+++ b/test/index.html
@@ -39,6 +39,7 @@
+
@@ -303,6 +304,7 @@
+
diff --git a/test/index_packaged.html b/test/index_packaged.html
index 4fc6c13bd..bb2b50d29 100644
--- a/test/index_packaged.html
+++ b/test/index_packaged.html
@@ -99,6 +99,7 @@
+
diff --git a/test/spec/services/mapillary.js b/test/spec/services/mapillary.js
new file mode 100644
index 000000000..8df099dd6
--- /dev/null
+++ b/test/spec/services/mapillary.js
@@ -0,0 +1,24 @@
+describe("iD.services.mapillary", function() {
+ var server, mapillary;
+
+ beforeEach(function() {
+ server = sinon.fakeServer.create();
+ mapillary = iD.services.mapillary();
+ mapillary.reset();
+ });
+
+ afterEach(function() {
+ server.restore();
+ });
+
+ function query(url) {
+ return iD.util.stringQs(url.substring(url.indexOf('?') + 1));
+ }
+
+ describe("#images", function() {
+ });
+
+ describe("#signs", function() {
+ });
+
+});