From 5ea2b77dfbe10a3f97f29066d48977d713c197b9 Mon Sep 17 00:00:00 2001 From: Tom MacWright Date: Fri, 16 Nov 2012 15:01:08 -0500 Subject: [PATCH] Less function nesting, dimensions as an object --- index.html | 6 ++-- js/iD/Connection.js | 6 ++++ js/iD/graph/Graph.js | 1 - js/iD/renderer/Map.js | 68 +++++++++++++++++++++++------------------ js/iD/renderer/tiles.js | 13 ++++---- 5 files changed, 54 insertions(+), 40 deletions(-) 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; }