Dispatch layer change events instead of hacky map pan

(fixes #3027, fixes #2804)
This commit is contained in:
Bryan Housel
2016-03-12 00:12:43 -05:00
parent f98eb8200d
commit 85d38de75b
6 changed files with 57 additions and 49 deletions

View File

@@ -1,9 +1,9 @@
iD.Background = function(context) {
var dispatch = d3.dispatch('change'),
baseLayer = iD.TileLayer().projection(context.projection),
overlayLayers = [];
overlayLayers = [],
backgroundSources;
var backgroundSources;
function findSource(id) {
return _.find(backgroundSources, function(d) {
@@ -11,7 +11,34 @@ iD.Background = function(context) {
});
}
function updateImagery() {
function background(selection) {
var base = selection.selectAll('.layer-background')
.data([0]);
base.enter()
.insert('div', '.layer-data')
.attr('class', 'layer layer-background');
base.call(baseLayer);
var overlays = selection.selectAll('.layer-overlay')
.data(overlayLayers, function(d) { return d.source().name(); });
overlays.enter()
.insert('div', '.layer-data')
.attr('class', 'layer layer-overlay');
overlays.each(function(layer) {
d3.select(this).call(layer);
});
overlays.exit()
.remove();
}
background.updateImagery = function() {
var b = background.baseLayerSource(),
o = overlayLayers.map(function (d) { return d.source().id; }).join(','),
q = iD.util.stringQs(location.hash.substring(1));
@@ -50,32 +77,7 @@ iD.Background = function(context) {
}
context.history().imageryUsed(imageryUsed);
}
function background(selection) {
var base = selection.selectAll('.layer-background')
.data([0]);
base.enter()
.insert('div', '.layer-data')
.attr('class', 'layer layer-background');
base.call(baseLayer);
var overlays = selection.selectAll('.layer-overlay')
.data(overlayLayers, function(d) { return d.source().name(); });
overlays.enter()
.insert('div', '.layer-data')
.attr('class', 'layer layer-overlay');
overlays.each(function(layer) {
d3.select(this).call(layer);
});
overlays.exit()
.remove();
}
};
background.sources = function(extent) {
return backgroundSources.filter(function(source) {
@@ -96,7 +98,7 @@ iD.Background = function(context) {
baseLayer.source(d);
dispatch.change();
updateImagery();
background.updateImagery();
return background;
};
@@ -123,7 +125,7 @@ iD.Background = function(context) {
if (layer.source() === d) {
overlayLayers.splice(i, 1);
dispatch.change();
updateImagery();
background.updateImagery();
return;
}
}
@@ -135,7 +137,7 @@ iD.Background = function(context) {
overlayLayers.push(layer);
dispatch.change();
updateImagery();
background.updateImagery();
};
background.nudge = function(d, zoom) {

View File

@@ -32,6 +32,11 @@ iD.Map = function(context) {
.on('change.map', redraw);
context.features()
.on('redraw.map', redraw);
drawLayers
.on('change.map', function() {
context.background().updateImagery();
redraw();
});
selection
.on('dblclick.map', dblClick)

View File

@@ -1,4 +1,4 @@
iD.svg.Gpx = function(projection, context) {
iD.svg.Gpx = function(projection, context, dispatch) {
var showLabels = true,
layer;
@@ -92,10 +92,6 @@ iD.svg.Gpx = function(projection, context) {
return (new DOMParser()).parseFromString(x, 'text/xml');
}
function redraw() {
context.pan([0,0]);
}
drawGpx.showLabels = function(_) {
if (!arguments.length) return showLabels;
showLabels = _;
@@ -105,6 +101,7 @@ iD.svg.Gpx = function(projection, context) {
drawGpx.enabled = function(_) {
if (!arguments.length) return iD.svg.Gpx.enabled;
iD.svg.Gpx.enabled = _;
dispatch.change();
return this;
};
@@ -117,6 +114,7 @@ iD.svg.Gpx = function(projection, context) {
if (!arguments.length) return iD.svg.Gpx.geojson;
if (_.isEmpty(gj) || _.isEmpty(gj.features)) return this;
iD.svg.Gpx.geojson = gj;
dispatch.change();
return this;
};
@@ -124,7 +122,6 @@ iD.svg.Gpx = function(projection, context) {
d3.text(url, function(err, data) {
if (!err) {
drawGpx.geojson(toGeoJSON.gpx(toDom(data)));
redraw();
}
});
return this;
@@ -136,7 +133,6 @@ iD.svg.Gpx = function(projection, context) {
reader.onload = function(e) {
drawGpx.geojson(toGeoJSON.gpx(toDom(e.target.result))).fitZoom();
redraw();
};
reader.readAsText(f);

View File

@@ -1,10 +1,11 @@
iD.svg.Layers = function(projection, context) {
var svg = d3.select(null),
var dispatch = d3.dispatch('change'),
svg = d3.select(null),
layers = [
{ id: 'osm', layer: iD.svg.Osm(projection, context) },
{ id: 'gpx', layer: iD.svg.Gpx(projection, context) },
{ id: 'mapillary-images', layer: iD.svg.MapillaryImages(projection, context) },
{ id: 'mapillary-signs', layer: iD.svg.MapillarySigns(projection, context) }
{ id: 'osm', layer: iD.svg.Osm(projection, context, dispatch) },
{ id: 'gpx', layer: iD.svg.Gpx(projection, context, dispatch) },
{ id: 'mapillary-images', layer: iD.svg.MapillaryImages(projection, context, dispatch) },
{ id: 'mapillary-signs', layer: iD.svg.MapillarySigns(projection, context, dispatch) }
];
@@ -51,6 +52,7 @@ iD.svg.Layers = function(projection, context) {
arr.forEach(function(id) {
layers = _.reject(layers, 'id', id);
});
dispatch.change();
return this;
};
@@ -61,6 +63,7 @@ iD.svg.Layers = function(projection, context) {
layers.push(obj);
}
});
dispatch.change();
return this;
};
@@ -76,5 +79,5 @@ iD.svg.Layers = function(projection, context) {
};
return drawLayers;
return d3.rebind(drawLayers, dispatch, 'on');
};

View File

@@ -1,5 +1,5 @@
iD.svg.MapillaryImages = function(projection, context) {
var debouncedRedraw = _.debounce(function () { context.pan([0,0]); }, 1000),
iD.svg.MapillaryImages = function(projection, context, dispatch) {
var debouncedRedraw = _.debounce(function () { dispatch.change(); }, 1000),
minZoom = 12,
layer = d3.select(null),
_mapillary;
@@ -175,6 +175,7 @@ iD.svg.MapillaryImages = function(projection, context) {
} else {
hideLayer();
}
dispatch.change();
return this;
};

View File

@@ -1,5 +1,5 @@
iD.svg.MapillarySigns = function(projection, context) {
var debouncedRedraw = _.debounce(function () { context.pan([0,0]); }, 1000),
iD.svg.MapillarySigns = function(projection, context, dispatch) {
var debouncedRedraw = _.debounce(function () { dispatch.change(); }, 1000),
minZoom = 12,
layer = d3.select(null),
_mapillary;
@@ -154,6 +154,7 @@ iD.svg.MapillarySigns = function(projection, context) {
} else {
hideLayer();
}
dispatch.change();
return this;
};