diff --git a/app/components/main-map.js b/app/components/main-map.js index 35f646ac..1e259638 100644 --- a/app/components/main-map.js +++ b/app/components/main-map.js @@ -9,10 +9,14 @@ import { alias } from '@ember/object/computed'; import bblDemux from '../utils/bbl-demux'; import drawnFeatureLayers from '../layers/drawn-feature'; import selectedLayers from '../layers/selected-lot'; +import comparisonSelectedLayers from '../layers/comparison-selected-lot'; const selectedFillLayer = selectedLayers.fill; const selectedLineLayer = selectedLayers.line; +const comparisonSelectedFillLayer = comparisonSelectedLayers.fill; +const comparisonSelectedLineLayer = comparisonSelectedLayers.line; + // Custom Control const MeasurementText = function () {}; @@ -114,6 +118,15 @@ export default class MainMap extends Component { }; } + @computed('mainMap.comparisonSelected') + get comparisonSelectedLotSource() { + const comparisonSelected = this.get('mainMap.comparisonSelected'); + return { + type: 'geojson', + data: comparisonSelected.get('geometry'), + }; + } + @computed('mainMap.drawMode') get interactivity() { const drawMode = this.get('mainMap.drawMode'); @@ -124,6 +137,10 @@ export default class MainMap extends Component { selectedLineLayer = selectedLineLayer; + comparisonSelectedFillLayer = comparisonSelectedFillLayer; + + comparisonSelectedLineLayer = comparisonSelectedLineLayer; + @action handleMapLoad(map) { window.map = map; @@ -168,6 +185,10 @@ export default class MainMap extends Component { map.on('zoom', function () { mainMap.set('zoom', map.getZoom()); }); + + if (this.router.currentRoute.name === 'map-feature.lot-comparison') { + mainMap.set('comparisonSelected', mainMap.selected); + } } @action @@ -211,7 +232,22 @@ export default class MainMap extends Component { if (bbl && !ceqr_num) { // eslint-disable-line const { boro, block, lot } = bblDemux(bbl); - this.router.transitionTo('map-feature.lot', boro, block, lot); + if (this.router.currentRoute.name === 'map-feature.lot-comparison') { + if (!this.mainMap.comparisonSelected) { + this.mainMap.set('comparisonSelected', this.mainMap.selected); + } + this.router.transitionTo( + 'map-feature.lot-comparison', + this.router.currentRoute.params.boro, + this.router.currentRoute.params.block, + this.router.currentRoute.params.lot, + boro, + block, + lot + ); + } else { + this.router.transitionTo('map-feature.lot', boro, block, lot); + } } if (ulurpno) { diff --git a/app/layers/comparison-selected-lot.js b/app/layers/comparison-selected-lot.js new file mode 100644 index 00000000..817c02d7 --- /dev/null +++ b/app/layers/comparison-selected-lot.js @@ -0,0 +1,32 @@ +const comparisonSelectedLayers = { + fill: { + id: 'comparison-selected-fill', + type: 'fill', + source: 'comparison-selected-lot', + paint: { + 'fill-opacity': 0.6, + 'fill-color': 'rgba(0, 20, 130, 1)', + }, + }, + line: { + id: 'comparison-selected-line', + type: 'line', + source: 'comparison-selected-lot', + layout: { + 'line-cap': 'round', + }, + paint: { + 'line-opacity': 0.9, + 'line-color': 'rgba(0, 10, 90, 1)', + 'line-width': { + stops: [ + [13, 1.5], + [15, 8], + ], + }, + 'line-dasharray': [2, 1.5], + }, + }, +}; + +export default comparisonSelectedLayers; diff --git a/app/models/lot-comparison.js b/app/models/lot-comparison.js index 5e546c86..1283c2c1 100644 --- a/app/models/lot-comparison.js +++ b/app/models/lot-comparison.js @@ -1,7 +1,7 @@ import { attr } from '@ember-data/model'; import CartoGeojsonFeature from './carto-geojson-feature'; -export default class Lot extends CartoGeojsonFeature { +export default class LotComparison extends CartoGeojsonFeature { @attr properties; get title() { diff --git a/app/templates/components/main-map.hbs b/app/templates/components/main-map.hbs index e8faac8b..9400fd3e 100644 --- a/app/templates/components/main-map.hbs +++ b/app/templates/components/main-map.hbs @@ -63,6 +63,16 @@ {{/if}} + {{#if this.mainMap.comparisonSelected}} + + + + + {{/if}}