diff --git a/index.html b/index.html
index 82463d893..fef944cec 100755
--- a/index.html
+++ b/index.html
@@ -77,6 +77,11 @@
map.setZoom(18)
.setCentre({ lat: 40.7965621, lon: -74.4773184 });
+ window.onresize = function() {
+ map.setSize(m.node().offsetWidth,
+ m.node().offsetHeight);
+ };
+
// ----------------------------------------------------
// Data is loaded and app ready to go
// Set initial controllerState
diff --git a/js/iD/Node.js b/js/iD/Node.js
index e6e963c1f..dfd613890 100644
--- a/js/iD/Node.js
+++ b/js/iD/Node.js
@@ -1,22 +1,25 @@
iD.Node = function(id, lat, lon, tags, loaded) {
- this.type = 'node';
this.id = id;
this._id = iD.Util.id();
this.lat = lat;
this.lon = lon;
this[0] = lon;
this[1] = lat;
- this.tags = tags;
+ this.tags = tags || {};
this.loaded = (loaded === undefined) ? true : loaded;
};
iD.Node.prototype = {
+
+ type: 'node',
+
intersects: function(extent) {
return (this.lon >= extent[0][0]) &&
(this.lon <= extent[1][0]) &&
(this.lat <= extent[0][1]) &&
(this.lat >= extent[1][1]);
}
+
};
iD.Util.extend(iD.Node, iD.Entity);
diff --git a/js/iD/Relation.js b/js/iD/Relation.js
index fb90e8c3f..55cb216bd 100644
--- a/js/iD/Relation.js
+++ b/js/iD/Relation.js
@@ -1,17 +1,14 @@
iD.Relation = function(id, children, tags, loaded) {
- members = members || [];
- tags = tags || {};
- this.type = 'relation';
this.id = id;
this._id = iD.Util.id();
- this.entity = new iD.Entity();
- this.children = children;
- this.tags = tags;
- this.modified = this.id < 0;
+ this.children = children || [];
+ this.tags = tags || {};
this.loaded = (loaded === undefined) ? true : loaded;
};
iD.Relation.prototype = {
+ type: 'relation',
+
intersects: function() { return true; }
};
diff --git a/js/iD/Way.js b/js/iD/Way.js
index 491dc9761..d35edd5d8 100644
--- a/js/iD/Way.js
+++ b/js/iD/Way.js
@@ -6,20 +6,19 @@
//
// If a a way is _closed_, it is assumed to be an area unless it has a
// `highway` or `barrier` tag and is not also tagged `area`.
-iD.Way = function(id, nodes, tags, loaded) {
- nodes = nodes || [];
- tags = tags || {};
- this.type = 'way';
+iD.Way = function(id, children, tags, loaded) {
this.id = id;
this._id = iD.Util.id();
- this.tags = tags;
- this.children = nodes;
+ this.tags = tags || {};
+ this.children = children || [];
this.loaded = (loaded === undefined) ? true : loaded;
this.extent = {};
};
iD.Way.prototype = {
+ type: 'way',
+
// JOSM: http://josm.openstreetmap.de/browser/josm/trunk/src/org/openstreetmap/josm/data/osm/Way.java#L466
isClosed: function() {
// summary: Is this a closed way (first and last nodes the same)?
diff --git a/js/iD/renderer/Map.js b/js/iD/renderer/Map.js
index 370fe91ce..18e1524f9 100755
--- a/js/iD/renderer/Map.js
+++ b/js/iD/renderer/Map.js
@@ -11,8 +11,7 @@ iD.Map = function(obj) {
height = obj.height || 400,
projection = d3.geo.mercator()
.scale(512).translate([512, 512]),
- connection = obj.connection,
- layers = {};
+ connection = obj.connection;
var inspector = iD.Inspector();
@@ -34,20 +33,19 @@ iD.Map = function(obj) {
// http://bl.ocks.org/1557377
function dragmove(d) {
- d3.select(this).attr('transform', function() {
- return 'translate(' + d3.event.x + ',' + d3.event.y + ')';
- });
- var ll = projection.invert([d3.event.x, d3.event.y]);
- d[0] = ll[0];
- d[1] = ll[1];
- drawVector();
+ d3.select(this).attr('transform', function() {
+ return 'translate(' + d3.event.x + ',' + d3.event.y + ')';
+ });
+ var ll = projection.invert([d3.event.x, d3.event.y]);
+ d[0] = ll[0];
+ d[1] = ll[1];
+ drawVector();
}
zoombehavior.on('zoom', redraw);
var surface = d3.selectAll(obj.selector)
.append('svg')
- .attr({ width: width, height: height })
.call(zoombehavior);
var defs = surface.append('defs');
@@ -56,29 +54,28 @@ iD.Map = function(obj) {
.attr('id', 'clip')
.append('rect')
.attr('id', 'clip-rect')
- .attr({ x: 0, y: 0 })
- .attr({ width: width, height: height });
+ .attr({ x: 0, y: 0 });
var tilegroup = surface.append('g')
.attr('clip-path', 'url(#clip)')
.on('click', deselectClick),
- container = surface.append('g')
+ r = surface.append('g')
.attr('clip-path', 'url(#clip)');
- var tileclient = iD.Tiles(tilegroup, width, height);
+ var tileclient = iD.Tiles(tilegroup, projection, width, height);
- var r = container.append('g');
+ function setSize(width, height) {
+ surface.attr({ width: width, height: height });
+ clipPath.attr({ width: width, height: height });
+ tileclient.setSize(width, height);
+ }
- layers[0] = {
- root: r,
- fill: r.append('g'),
- casing: r.append('g'),
- stroke: r.append('g'),
- text: r.append('g'),
- hit: r.append('g')
- };
-
- var elastic = container.append('g');
+ var fill_g = r.append('g'),
+ casing_g = r.append('g'),
+ stroke_g = r.append('g'),
+ text_g = r.append('g'),
+ hit_g = r.append('g'),
+ elastic = r.append('g');
var download = _.debounce(function() {
connection.loadFromAPI(extent(), drawVector);
@@ -148,24 +145,35 @@ iD.Map = function(obj) {
return a.type === 'node';
});
- var fills = layers[0].fill.selectAll('path.area')
+ var fills = fill_g.selectAll('path.area')
.data(areas, key),
- casings = layers[0].casing.selectAll('path.casing')
+ casings = casing_g.selectAll('path.casing')
.data(ways, key),
- strokes = layers[0].stroke.selectAll('path.stroke')
+ strokes = stroke_g.selectAll('path.stroke')
.data(ways, key),
- markers = layers[0].hit.selectAll('image.marker')
+ markers = hit_g.selectAll('image.marker')
.data(points.filter(iD.markerimage), key);
- var _id = selection[0];
- var active_entity = all.filter(function(a) {
- return a._id === _id && a.entityType === 'way';
- });
+ if (selection.length) {
+ var _id = selection[0];
+ var active_entity = all.filter(function(a) {
+ return a._id === _id && a.entityType === 'way';
+ });
- var handles = layers[0].hit.selectAll('circle.handle')
- .data(active_entity.length ? active_entity[0].children : [], key);
+ var handles = hit_g.selectAll('circle.handle')
+ .data(active_entity.length ? active_entity[0].children : [], key);
+
+ handles.exit().remove();
+
+ handles.enter().append('circle')
+ .attr('class', 'handle')
+ .attr('r', 5)
+ .call(dragbehavior);
+ handles.attr('transform', function(d) {
+ return 'translate(' + projection(d) + ')';
+ });
+ }
- handles.exit().remove();
fills.exit().remove();
markers.exit().remove();
casings.exit().remove();
@@ -201,13 +209,6 @@ iD.Map = function(obj) {
return 'translate(' + projection(d) + ')';
});
- handles.enter().append('circle')
- .attr('class', 'handle')
- .attr('r', 5)
- .call(dragbehavior);
- handles.attr('transform', function(d) {
- return 'translate(' + projection(d) + ')';
- });
}
function zoomIn() {
@@ -238,7 +239,7 @@ iD.Map = function(obj) {
.translate(d3.event.translate)
.scale(d3.event.scale);
}
- tileclient.redraw(projection);
+ tileclient.redraw();
drawVector();
download();
}
@@ -267,7 +268,9 @@ iD.Map = function(obj) {
map.connection = connection;
map.projection = projection;
+ map.setSize = setSize;
+ setSize(width, height);
redraw();
return map;
};
diff --git a/js/iD/renderer/tiles.js b/js/iD/renderer/tiles.js
index cede0fb2f..1150e765f 100644
--- a/js/iD/renderer/tiles.js
+++ b/js/iD/renderer/tiles.js
@@ -1,8 +1,8 @@
// a minimal map tile client, to be turned on and off etc.
-iD.Tiles = function(selection, width, height) {
+iD.Tiles = function(selection, projection, width, height) {
var tiles = {};
- function tilesForView(projection) {
+ function tilesForView() {
var t = projection.translate(),
s = projection.scale(),
z = Math.max(Math.log(s) / Math.log(2) - 8, 0);
@@ -36,7 +36,7 @@ iD.Tiles = function(selection, width, height) {
return tmpl.replace('$quadkey', u);
}
- function redraw(projection) {
+ function redraw() {
var t = projection.translate(),
s = projection.scale(),
z = Math.max(Math.log(s) / Math.log(2) - 8, 0);
@@ -63,6 +63,14 @@ iD.Tiles = function(selection, width, height) {
});
}
+ function setSize(w, h) {
+ width = w;
+ height = h;
+ redraw();
+ return tiles;
+ }
+
+ tiles.setSize = setSize;
tiles.redraw = redraw;
return tiles;