CalvinBackup/iD
1
0
Fork 0
mirror of https://github.com/FoggedLens/iD.git synced 2026-02-12 16:52:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

Persist the photo overlay layers via the URL query string (re: #5813)

Browse Source
This commit is contained in:
Quincy Morgan
2019-03-14 16:48:08 -04:00
parent c65a4d038e
commit 7d0080a642
14 changed files with 68 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
css/60_photos.css
View File

@@ -180,13 +180,13 @@
/* Mapillary Image Layer */
.layer-mapillary-images {
.layer-mapillary {
pointer-events: none;
}
.layer-mapillary-images .viewfield-group * {
.layer-mapillary .viewfield-group * {
fill: #55ff22;
}
.layer-mapillary-images .sequence {
.layer-mapillary .sequence {
stroke: #55ff22;
}
@@ -211,13 +211,13 @@
/* OpenStreetCam Image Layer */
.layer-openstreetcam-images {
.layer-openstreetcam {
pointer-events: none;
}
.layer-openstreetcam-images .viewfield-group * {
.layer-openstreetcam .viewfield-group * {
fill: #20c4ff;
}
.layer-openstreetcam-images .sequence {
.layer-openstreetcam .sequence {
stroke: #20c4ff;
}

1
modules/core/context.js
View File

@@ -538,6 +538,7 @@ export function coreContext() {
background.init();
features.init();
photos.init();
if (utilStringQs(window.location.hash).presets) {
var external = utilStringQs(window.location.hash).presets;
presets.fromExternal(external, function(externalPresets) {

4
modules/renderer/background.js
View File

@@ -197,7 +197,7 @@ export function rendererBackground(context) {
imageryUsed.push('Bing Streetside');
}
var mapillary_images = context.layers().layer('mapillary-images');
var mapillary_images = context.layers().layer('mapillary');
if (mapillary_images && mapillary_images.enabled()) {
imageryUsed.push('Mapillary Images');
}
@@ -207,7 +207,7 @@ export function rendererBackground(context) {
imageryUsed.push('Mapillary Signs');
}
var openstreetcam_images = context.layers().layer('openstreetcam-images');
var openstreetcam_images = context.layers().layer('openstreetcam');
if (openstreetcam_images && openstreetcam_images.enabled()) {
imageryUsed.push('OpenStreetCam Images');
}

41
modules/renderer/photos.js
View File

@@ -3,17 +3,39 @@ import _clone from 'lodash-es/clone';
import { dispatch as d3_dispatch } from 'd3-dispatch';
import { utilRebind } from '../util/rebind';
import { utilQsString, utilStringQs } from '../util';
export function rendererPhotos(context) {
var dispatch = d3_dispatch('change');
var _layerIDs = ['streetside', 'mapillary', 'mapillary-signs', 'openstreetcam'];
var _allPhotoTypes = ['flat', 'panoramic'];
var _shownPhotoTypes = _clone(_allPhotoTypes);
function photos() {}
function updateStorage() {
if (!window.mocha) {
var q = utilStringQs(window.location.hash.substring(1));
var enabled = context.layers().all().filter(function(d) {
return _layerIDs.indexOf(d.id) !== -1 && d.layer && d.layer.supported() && d.layer.enabled();
}).map(function(d) {
return d.id;
});
if (enabled.length) {
q.photo_overlay = enabled.join(',');
} else {
delete q.photo_overlay;
}
window.location.replace('#' + utilQsString(q, true));
}
}
photos.overlayLayerIDs = function() {
return _layerIDs;
};
photos.allPhotoTypes = function() {
return _allPhotoTypes;
};
@@ -24,8 +46,8 @@ export function rendererPhotos(context) {
}
photos.shouldFilterByPhotoType = function() {
return showsLayer('mapillary-images') ||
(showsLayer('streetside') && showsLayer('openstreetcam-images'));
return showsLayer('mapillary') ||
(showsLayer('streetside') && showsLayer('openstreetcam'));
};
photos.showsPhotoType = function(val) {
@@ -53,5 +75,18 @@ export function rendererPhotos(context) {
return photos;
};
photos.init = function() {
var q = utilStringQs(window.location.hash.substring(1));
if (q.photo_overlay) {
var hashOverlayIDs = q.photo_overlay.replace(/;/g, ',').split(',');
hashOverlayIDs.forEach(function(id) {
var layer = context.layers().layer(id);
if (layer) layer.enabled(true);
});
}
context.layers().on('change.rendererPhotos', updateStorage);
};
return utilRebind(photos, dispatch, 'on');
}

4
modules/services/mapillary.js
View File

@@ -591,12 +591,12 @@ export default {
// highlight sibling viewfields on either the selected or the hovered sequences
var highlightedImageKeys = _union(hoveredImageKeys, selectedImageKeys);
d3_selectAll('.layer-mapillary-images .viewfield-group')
d3_selectAll('.layer-mapillary .viewfield-group')
.classed('highlighted', function(d) { return highlightedImageKeys.indexOf(d.key) !== -1; })
.classed('hovered', function(d) { return d.key === hoveredImageKey; })
.classed('currentView', function(d) { return d.key === selectedImageKey; });
d3_selectAll('.layer-mapillary-images .sequence')
d3_selectAll('.layer-mapillary .sequence')
.classed('highlighted', function(d) { return d.properties.key === hoveredSequenceKey; })
.classed('currentView', function(d) { return d.properties.key === selectedSequenceKey; });

4
modules/services/openstreetcam.js
View File

@@ -522,12 +522,12 @@ export default {
// highlight sibling viewfields on either the selected or the hovered sequences
var highlightedImageKeys = _union(hoveredImageKeys, selectedImageKeys);
d3_selectAll('.layer-openstreetcam-images .viewfield-group')
d3_selectAll('.layer-openstreetcam .viewfield-group')
.classed('highlighted', function(d) { return highlightedImageKeys.indexOf(d.key) !== -1; })
.classed('hovered', function(d) { return d.key === hoveredImageKey; })
.classed('currentView', function(d) { return d.key === selectedImageKey; });
d3_selectAll('.layer-openstreetcam-images .sequence')
d3_selectAll('.layer-openstreetcam .sequence')
.classed('highlighted', function(d) { return d.properties.key === hoveredSequenceKey; })
.classed('currentView', function(d) { return d.properties.key === selectedSequenceKey; });

4
modules/svg/layers.js
View File

@@ -33,9 +33,9 @@ export function svgLayers(projection, context) {
{ id: 'keepRight', layer: svgKeepRight(projection, context, dispatch) },
{ id: 'improveOSM', layer: svgImproveOSM(projection, context, dispatch) },
{ id: 'streetside', layer: svgStreetside(projection, context, dispatch)},
{ id: 'mapillary-images', layer: svgMapillaryImages(projection, context, dispatch) },
{ id: 'mapillary', layer: svgMapillaryImages(projection, context, dispatch) },
{ id: 'mapillary-signs', layer: svgMapillarySigns(projection, context, dispatch) },
{ id: 'openstreetcam-images', layer: svgOpenstreetcamImages(projection, context, dispatch) },
{ id: 'openstreetcam', layer: svgOpenstreetcamImages(projection, context, dispatch) },
{ id: 'debug', layer: svgDebug(projection, context, dispatch) },
{ id: 'geolocate', layer: svgGeolocate(projection, context, dispatch) },
{ id: 'touch', layer: svgTouch(projection, context, dispatch) }

5
modules/svg/mapillary_images.js
View File

@@ -51,7 +51,6 @@ export function svgMapillaryImages(projection, context, dispatch) {
var service = getService();
if (!service) return;
service.loadViewer(context);
editOn();
layer
@@ -258,7 +257,7 @@ export function svgMapillaryImages(projection, context, dispatch) {
var enabled = svgMapillaryImages.enabled;
var service = getService();
layer = selection.selectAll('.layer-mapillary-images')
layer = selection.selectAll('.layer-mapillary')
.data(service ? [0] : []);
layer.exit()
@@ -266,7 +265,7 @@ export function svgMapillaryImages(projection, context, dispatch) {
var layerEnter = layer.enter()
.append('g')
.attr('class', 'layer-mapillary-images')
.attr('class', 'layer-mapillary')
.style('display', enabled ? 'block' : 'none');
layerEnter

1
modules/svg/mapillary_signs.js
View File

@@ -34,7 +34,6 @@ export function svgMapillarySigns(projection, context, dispatch) {
var service = getService();
if (!service) return;
service.loadViewer(context);
editOn();
}

5
modules/svg/openstreetcam_images.js
View File

@@ -36,7 +36,6 @@ export function svgOpenstreetcamImages(projection, context, dispatch) {
var service = getService();
if (!service) return;
service.loadViewer(context);
editOn();
layer
@@ -195,7 +194,7 @@ export function svgOpenstreetcamImages(projection, context, dispatch) {
var enabled = svgOpenstreetcamImages.enabled,
service = getService();
layer = selection.selectAll('.layer-openstreetcam-images')
layer = selection.selectAll('.layer-openstreetcam')
.data(service ? [0] : []);
layer.exit()
@@ -203,7 +202,7 @@ export function svgOpenstreetcamImages(projection, context, dispatch) {
var layerEnter = layer.enter()
.append('g')
.attr('class', 'layer-openstreetcam-images')
.attr('class', 'layer-openstreetcam')
.style('display', enabled ? 'block' : 'none');
layerEnter

1
modules/svg/streetside.js
View File

@@ -46,7 +46,6 @@ export function svgStreetside(projection, context, dispatch) {
var service = getService();
if (!service) return;
service.loadViewer(context);
editOn();
layer

13
modules/ui/map_data.js
View File

@@ -117,7 +117,7 @@ export function uiMapData(context) {
function drawPhotoItems(selection) {
var photoKeys = ['streetside', 'mapillary-images', 'mapillary-signs', 'openstreetcam-images'];
var photoKeys = context.photos().overlayLayerIDs();
var photoLayers = layers.all().filter(function(obj) { return photoKeys.indexOf(obj.id) !== -1; });
var data = photoLayers.filter(function(obj) { return obj.layer.supported(); });
@@ -156,10 +156,11 @@ export function uiMapData(context) {
var labelEnter = liEnter
.append('label')
.each(function(d) {
var titleID = d.id.replace('-', '_') + '.tooltip';
if (d.id === 'mapillary-signs') {
titleID = 'mapillary.signs.tooltip';
}
var titleID;
if (d.id === 'mapillary-signs') titleID = 'mapillary.signs.tooltip';
else if (d.id === 'mapillary') titleID = 'mapillary_images.tooltip';
else if (d.id === 'openstreetcam') titleID = 'openstreetcam_images.tooltip';
else titleID = d.id.replace('-', '_') + '.tooltip';
d3_select(this)
.call(tooltip()
.title(t(titleID))
@@ -176,8 +177,6 @@ export function uiMapData(context) {
.append('span')
.text(function(d) {
var id = d.id;
if (id === 'mapillary-images') id = 'mapillary';
if (id === 'openstreetcam-images') id = 'openstreetcam';
if (id === 'mapillary-signs') id = 'photo_overlays.traffic_signs';
return t(id.replace('-', '_') + '.title');
});

3
modules/ui/photoviewer.js
View File

@@ -49,6 +49,9 @@ export function uiPhotoviewer(context) {
buildResizeListener(selection, 'resize', dispatch, { resizeOnY: true })
);
services.streetside.loadViewer(context);
services.mapillary.loadViewer(context);
services.openstreetcam.loadViewer(context);
function buildResizeListener(target, eventName, dispatch, options) {
var resizeOnX = !!options.resizeOnX;

4
test/spec/svg/layers.js
View File

@@ -33,9 +33,9 @@ describe('iD.svgLayers', function () {
expect(d3.select(nodes[3]).classed('keepRight')).to.be.true;
expect(d3.select(nodes[4]).classed('improveOSM')).to.be.true;
expect(d3.select(nodes[5]).classed('streetside')).to.be.true;
expect(d3.select(nodes[6]).classed('mapillary-images')).to.be.true;
expect(d3.select(nodes[6]).classed('mapillary')).to.be.true;
expect(d3.select(nodes[7]).classed('mapillary-signs')).to.be.true;
expect(d3.select(nodes[8]).classed('openstreetcam-images')).to.be.true;
expect(d3.select(nodes[8]).classed('openstreetcam')).to.be.true;
expect(d3.select(nodes[9]).classed('debug')).to.be.true;
expect(d3.select(nodes[10]).classed('geolocate')).to.be.true;
expect(d3.select(nodes[11]).classed('touch')).to.be.true;