diff --git a/index.html b/index.html
index afeb9f81d..2c24bb818 100755
--- a/index.html
+++ b/index.html
@@ -87,8 +87,10 @@
});
window.onresize = function() {
- map.setSize(m.node().offsetWidth,
- m.node().offsetHeight);
+ map.setSize({
+ width: m.node().offsetWidth,
+ height: m.node().offsetHeight
+ });
};
function grid(resp) {
diff --git a/js/iD/Connection.js b/js/iD/Connection.js
index 32c600de9..9db185a01 100755
--- a/js/iD/Connection.js
+++ b/js/iD/Connection.js
@@ -101,6 +101,12 @@ iD.Connection = function() {
return iD.Graph(entities);
}
+ connection.url = function(x) {
+ if (!arguments.length) return apiURL;
+ apiURL = x;
+ return connection;
+ };
+
connection.bboxFromAPI = bboxFromAPI;
connection.wayFromAPI = wayFromAPI;
connection.loadFromURL = loadFromURL;
diff --git a/js/iD/graph/Graph.js b/js/iD/graph/Graph.js
index 027377a66..e3a28829c 100644
--- a/js/iD/graph/Graph.js
+++ b/js/iD/graph/Graph.js
@@ -11,7 +11,6 @@ iD.Graph = function(entities, annotation) {
for (var j = 0, l = w.nodes.length; j < l; j++) {
if (w.nodes[j].lon > extent[0][0]) extent[0][0] = w.nodes[j].lon;
if (w.nodes[j].lon < extent[1][0]) extent[1][0] = w.nodes[j].lon;
-
if (w.nodes[j].lat < extent[0][1]) extent[0][1] = w.nodes[j].lat;
if (w.nodes[j].lat > extent[1][1]) extent[1][1] = w.nodes[j].lat;
}
diff --git a/js/iD/renderer/Map.js b/js/iD/renderer/Map.js
index d1f1be896..e5ebd9f55 100755
--- a/js/iD/renderer/Map.js
+++ b/js/iD/renderer/Map.js
@@ -23,7 +23,7 @@ iD.Map = function(elem) {
}
var map = {},
- width, height,
+ dimensions = { width: null, height: null },
dispatch = d3.dispatch('move', 'update'),
history = iD.History(),
connection = iD.Connection(),
@@ -285,12 +285,11 @@ iD.Map = function(elem) {
}
}
- function setSize(w, h) {
- width = w;
- height = h;
- surface.attr({ width: width, height: height });
- surface.selectAll('#clip-rect').attr({ width: width, height: height });
- tileclient.setSize(width, height);
+ function setSize(x) {
+ dimensions = x;
+ surface.attr(dimensions);
+ surface.selectAll('#clip-rect').attr(dimensions);
+ tileclient.setSize(dimensions);
}
var apiTilesLoaded = {};
@@ -322,9 +321,9 @@ iD.Map = function(elem) {
var tile_origin = [s / 2 - t[0], s / 2 - t[1]],
coords = [],
cols = d3.range(Math.max(0, Math.floor(tile_origin[0] / ts)),
- Math.max(0, Math.ceil((tile_origin[0] + width) / ts))),
+ Math.max(0, Math.ceil((tile_origin[0] + dimensions.width) / ts))),
rows = d3.range(Math.max(0, Math.floor(tile_origin[1] / ts)),
- Math.max(0, Math.ceil((tile_origin[1] + height) / ts)));
+ Math.max(0, Math.ceil((tile_origin[1] + dimensions.height) / ts)));
cols.forEach(function(x) {
rows.forEach(function(y) {
@@ -332,27 +331,31 @@ iD.Map = function(elem) {
});
});
- return coords.filter(tileAlreadyLoaded).map(function(c) {
+ function apiExtentBox(c) {
var x = (c[0] * ts) - tile_origin[0];
var y = (c[1] * ts) - tile_origin[1];
apiTilesLoaded[c] = true;
return [
projection.invert([x, y]),
projection.invert([x + ts, y + ts])];
+ }
+
+ return coords.filter(tileAlreadyLoaded).map(apiExtentBox);
+ }
+
+ function apiRequestExtent(extent) {
+ connection.bboxFromAPI(extent, function (result) {
+ if (result instanceof Error) {
+ // TODO: handle
+ } else {
+ history.merge(result);
+ drawVector();
+ }
});
}
var download = _.debounce(function() {
- apiTiles().map(function(extent) {
- connection.bboxFromAPI(extent, function (result) {
- if (result instanceof Error) {
- // TODO: handle
- } else {
- history.merge(result);
- drawVector();
- }
- });
- });
+ apiTiles().map(apiRequestExtent);
}, 1000);
function deselectClick() {
@@ -396,7 +399,6 @@ iD.Map = function(elem) {
if (fast) {
if (!translateStart) translateStart = d3.mouse(document.body).slice();
- hideHandles();
fastPan(d3.mouse(document.body), translateStart);
} else {
redraw();
@@ -479,7 +481,7 @@ iD.Map = function(elem) {
function getExtent() {
return [
projection.invert([0, 0]),
- projection.invert([width, height])];
+ projection.invert([dimensions.width, dimensions.height])];
}
function pointLocation(p) {
@@ -501,14 +503,14 @@ iD.Map = function(elem) {
function setZoom(zoom) {
// summary: Redraw the map at a new zoom level.
var scale = 256 * Math.pow(2, zoom - 1);
- var l = pointLocation([width / 2, height / 2]);
+ var l = pointLocation([dimensions.width / 2, dimensions.height / 2]);
projection.scale(scale);
zoombehavior.scale(projection.scale());
var t = projection.translate();
l = locationPoint(l);
- t[0] += (width / 2) - l[0];
- t[1] += (height / 2) - l[1];
+ t[0] += (dimensions.width / 2) - l[0];
+ t[1] += (dimensions.height / 2) - l[1];
projection.translate(t);
zoombehavior.translate(projection.translate());
@@ -522,8 +524,8 @@ iD.Map = function(elem) {
function getCenter() {
return a2ll(projection.invert([
- width / 2,
- height / 2]));
+ dimensions.width / 2,
+ dimensions.height / 2]));
}
function setCenter(loc) {
@@ -531,13 +533,18 @@ iD.Map = function(elem) {
var t = projection.translate(),
ll = projection([loc.lon, loc.lat]);
projection.translate([
- t[0] - ll[0] + width / 2,
- t[1] - ll[1] + height / 2]);
+ t[0] - ll[0] + dimensions.width / 2,
+ t[1] - ll[1] + dimensions.height / 2]);
zoombehavior.translate(projection.translate());
redraw();
return map;
}
+ function setAPI(x) {
+ connection.url(x);
+ return map;
+ }
+
map.handleDrag = handleDrag;
map.download = download;
@@ -558,6 +565,7 @@ iD.Map = function(elem) {
map.connection = connection;
map.projection = projection;
map.setSize = setSize;
+ map.setAPI = setAPI;
map.history = history;
map.surface = surface;
@@ -568,7 +576,7 @@ iD.Map = function(elem) {
map.redraw = redraw;
- setSize(parent.node().offsetWidth, parent.node().offsetHeight);
+ setSize({ width: parent.node().offsetWidth, height: parent.node().offsetHeight });
redraw();
return d3.rebind(map, dispatch, 'on', 'move', 'update');
diff --git a/js/iD/renderer/tiles.js b/js/iD/renderer/tiles.js
index c0b5f0352..71811b8e2 100644
--- a/js/iD/renderer/tiles.js
+++ b/js/iD/renderer/tiles.js
@@ -1,6 +1,6 @@
// a minimal map tile client, to be turned on and off etc.
-iD.Tiles = function(selection, projection, width, height) {
- var tiles = {};
+iD.Tiles = function(selection, projection, dimensions) {
+ var tiles = {}, dimensions;
// derive the url of a 'quadkey' style tile from a coordinate object
function tileUrl(coord) {
@@ -30,9 +30,9 @@ iD.Tiles = function(selection, projection, width, height) {
var tile_origin = [s / 2 - t[0], s / 2 - t[1]],
coords = [],
cols = d3.range(Math.max(0, Math.floor((tile_origin[0]) / ts)),
- Math.max(0, Math.ceil((tile_origin[0] + width) / ts))),
+ Math.max(0, Math.ceil((tile_origin[0] + dimensions.width) / ts))),
rows = d3.range(Math.max(0, Math.floor((tile_origin[1]) / ts)),
- Math.max(0, Math.ceil((tile_origin[1] + height) / ts)));
+ Math.max(0, Math.ceil((tile_origin[1] + dimensions.height) / ts)));
cols.forEach(function(x) {
rows.forEach(function(y) {
@@ -58,9 +58,8 @@ iD.Tiles = function(selection, projection, width, height) {
});
}
- function setSize(w, h) {
- width = w;
- height = h;
+ function setSize(x) {
+ dimensions = x;
redraw();
return tiles;
}