From e4da6a8eec283616188cc17dc909a45af266bc87 Mon Sep 17 00:00:00 2001 From: David Hochbaum Date: Tue, 12 Mar 2024 11:06:23 -0400 Subject: [PATCH 01/10] Added Toggle All Map Layers Off button to bottom of sidebar --- app/controllers/application.js | 13 +++++++++++++ app/styles/modules/_m-layer-palette.scss | 7 +++++++ app/templates/application.hbs | 1 + app/templates/components/layer-palette.hbs | 7 +++++++ config/environment.js | 1 + config/icons.js | 1 + 6 files changed, 30 insertions(+) diff --git a/app/controllers/application.js b/app/controllers/application.js index f42ae2e3..14c58c00 100644 --- a/app/controllers/application.js +++ b/app/controllers/application.js @@ -106,6 +106,19 @@ export default class ApplicationController extends Controller.extend( this.handleLayerGroupChange(); } + @action + setAllLayerVisibilityToFalse() { + this.model.layerGroups + .filter(({ visible }) => visible) + .forEach((model) => this.toggleLayerVisibilityToFalse(model)); + this.handleLayerGroupChange(); + } + + @action + toggleLayerVisibilityToFalse(layer) { + layer.visible = false; + } + @computed('queryParamsState') get isDefault() { const state = this.queryParamsState || {}; diff --git a/app/styles/modules/_m-layer-palette.scss b/app/styles/modules/_m-layer-palette.scss index 5655eebe..4f7afacb 100644 --- a/app/styles/modules/_m-layer-palette.scss +++ b/app/styles/modules/_m-layer-palette.scss @@ -131,6 +131,13 @@ $layer-palette-hover-color: rgba($dark-gray,0.08); width: calc(100% - #{$layer-palette-padding*4}); } +// +// "Toggle All Map Layers Off" button +// -------------------------------------------------- +.no-layers-button { + margin: $layer-palette-padding*0 $layer-palette-padding*2 $layer-palette-padding*3 $layer-palette-padding*2; + width: calc(100% - #{$layer-palette-padding*4}); +} // // Indeterminate hider (hides element alongside unchecked checkbox) diff --git a/app/templates/application.hbs b/app/templates/application.hbs index c929e8df..6e690409 100644 --- a/app/templates/application.hbs +++ b/app/templates/application.hbs @@ -30,6 +30,7 @@ @layerGroups={{this.model.layerGroupsObject}} @isDefault={{this.isDefault}} @resetQueryParams={{action this.setModelsToDefault}} + @setAllLayerVisibilityToFalse={{action this.setAllLayerVisibilityToFalse}} @handleLayerGroupChange={{action this.handleLayerGroupChange}} /> diff --git a/app/templates/components/layer-palette.hbs b/app/templates/components/layer-palette.hbs index 263b3572..978e72d7 100644 --- a/app/templates/components/layer-palette.hbs +++ b/app/templates/components/layer-palette.hbs @@ -331,5 +331,12 @@ Reset Map Layers + + + Toggle All Map Layers Off + {{yield}} diff --git a/config/environment.js b/config/environment.js index b53f5a00..d07f879b 100644 --- a/config/environment.js +++ b/config/environment.js @@ -382,6 +382,7 @@ module.exports = function (environment) { 'circle', 'dot-circle', 'square', + 'circle-xmark', ], 'free-solid-svg-icons': [ 'angle-up', diff --git a/config/icons.js b/config/icons.js index 7100ffd1..434edf8a 100644 --- a/config/icons.js +++ b/config/icons.js @@ -5,6 +5,7 @@ module.exports = function () { 'circle', 'dot-circle', 'square', + 'circle-xmark', ], 'free-solid-svg-icons': [ 'angle-up', From 6007b447cc63d30f685ee225dc3a3447246cb173 Mon Sep 17 00:00:00 2001 From: David Hochbaum Date: Tue, 12 Mar 2024 11:14:02 -0400 Subject: [PATCH 02/10] Added analytics to track toggle all off clicks --- app/controllers/application.js | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/app/controllers/application.js b/app/controllers/application.js index 14c58c00..173e71d8 100644 --- a/app/controllers/application.js +++ b/app/controllers/application.js @@ -87,6 +87,8 @@ export default class ApplicationController extends Controller.extend( @service mainMap; + @service metrics; + // this action extracts query-param-friendly state of layer groups // for various paramable layers @action @@ -112,6 +114,18 @@ export default class ApplicationController extends Controller.extend( .filter(({ visible }) => visible) .forEach((model) => this.toggleLayerVisibilityToFalse(model)); this.handleLayerGroupChange(); + + gtag('event', 'search', { + event_category: 'Toggle Layer', + event_action: 'Toggle All Layers Off', + }); + + // GA + this.metrics.trackEvent('MatomoTagManager', { + category: 'Toggle Layer', + action: 'Toggle All Layers Off', + name: 'Toggle All Layers Off', + }); } @action From 8757d6e814c6a526bc6a3ce19a4c17ded844f3f2 Mon Sep 17 00:00:00 2001 From: David Hochbaum Date: Fri, 15 Mar 2024 11:11:37 -0400 Subject: [PATCH 03/10] Moved button to top --- app/styles/modules/_m-layer-palette.scss | 2 +- app/templates/components/layer-palette.hbs | 14 +++++++------- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/app/styles/modules/_m-layer-palette.scss b/app/styles/modules/_m-layer-palette.scss index 4f7afacb..cd4d8a82 100644 --- a/app/styles/modules/_m-layer-palette.scss +++ b/app/styles/modules/_m-layer-palette.scss @@ -135,7 +135,7 @@ $layer-palette-hover-color: rgba($dark-gray,0.08); // "Toggle All Map Layers Off" button // -------------------------------------------------- .no-layers-button { - margin: $layer-palette-padding*0 $layer-palette-padding*2 $layer-palette-padding*3 $layer-palette-padding*2; + margin: $layer-palette-padding*3 $layer-palette-padding*2 $layer-palette-padding*2 $layer-palette-padding*2; width: calc(100% - #{$layer-palette-padding*4}); } diff --git a/app/templates/components/layer-palette.hbs b/app/templates/components/layer-palette.hbs index 978e72d7..3e9abc07 100644 --- a/app/templates/components/layer-palette.hbs +++ b/app/templates/components/layer-palette.hbs @@ -9,6 +9,13 @@ {{/if}}
+ + + Toggle All Map Layers Off + Reset Map Layers - - - Toggle All Map Layers Off -
{{yield}} From 51caee9efcbbdeea5db3c7164c72491cf4283884 Mon Sep 17 00:00:00 2001 From: David Hochbaum Date: Wed, 20 Mar 2024 11:55:03 -0400 Subject: [PATCH 04/10] Updated @nycplanning/ember to use branch with zola search history functionality --- package.json | 2 +- yarn.lock | 5 ++--- 2 files changed, 3 insertions(+), 4 deletions(-) diff --git a/package.json b/package.json index 196e352c..09b6bd39 100644 --- a/package.json +++ b/package.json @@ -41,7 +41,7 @@ "@glimmer/component": "^1.1.2", "@glimmer/tracking": "^1.1.2", "@mapbox/mapbox-gl-draw": "^1.0.0", - "@nycplanning/ember": "^3.0.0", + "@nycplanning/ember": "https://github.com/NYCPlanning/ose-ember-addons#zola-search-history", "@nycplanning/ember-cli-foundation-6-sass": "^0.1.0", "@nycplanning/ember-cli-nouislider": "^1.3.0", "@nycplanning/ember-mapbox-gl-draw": "^2.1.0", diff --git a/yarn.lock b/yarn.lock index bfa8623d..19208734 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2216,10 +2216,9 @@ dependencies: ember-cli-babel "^7.1.2" -"@nycplanning/ember@^3.0.0": +"@nycplanning/ember@https://github.com/NYCPlanning/ose-ember-addons#zola-search-history": version "3.0.0" - resolved "https://registry.yarnpkg.com/@nycplanning/ember/-/ember-3.0.0.tgz#8103d7ecae91218d0b91ac7eaf9350e3bf2cb4b6" - integrity sha512-qDRAWm3A+ubNjet9UTnEW6QzPDdG5OaTaZ0o8W3e9Oz8S0kvllCVEDNYml2U30DuUZ4zAGR1i7r9QSmfTAWTkA== + resolved "https://github.com/NYCPlanning/ose-ember-addons#2bd9e3210c3c9e3e84907997a66267d822fe1b38" dependencies: "@turf/union" "^6.0.0" ember-auto-import "^2.6.3" From 5b52a31fb0a6b49f0d5641d14b3546eb8d13fdc2 Mon Sep 17 00:00:00 2001 From: David Hochbaum Date: Tue, 26 Mar 2024 19:01:09 -0400 Subject: [PATCH 05/10] Removed reset button, added undo toggle functionality --- app/controllers/application.js | 47 ++++++++++++++++++++++ app/templates/application.hbs | 2 + app/templates/components/layer-palette.hbs | 32 ++++++++------- 3 files changed, 66 insertions(+), 15 deletions(-) diff --git a/app/controllers/application.js b/app/controllers/application.js index 173e71d8..13991f9f 100644 --- a/app/controllers/application.js +++ b/app/controllers/application.js @@ -1,6 +1,7 @@ import Controller from '@ember/controller'; import { assign } from '@ember/polyfills'; import { computed, action } from '@ember/object'; +import { tracked } from '@glimmer/tracking'; import { inject as service } from '@ember/service'; import QueryParams from '@nycplanning/ember-parachute'; import config from 'labs-zola/config/environment'; @@ -89,6 +90,8 @@ export default class ApplicationController extends Controller.extend( @service metrics; + @tracked layerGroupsStorage; + // this action extracts query-param-friendly state of layer groups // for various paramable layers @action @@ -100,6 +103,7 @@ export default class ApplicationController extends Controller.extend( .sort(); this.set('layerGroups', visibleLayerGroups); + this.set('layerGroupsStorage', null); } @action @@ -110,11 +114,19 @@ export default class ApplicationController extends Controller.extend( @action setAllLayerVisibilityToFalse() { + // save them so we can be able to reset them + const tempStorage = this.model.layerGroups + .filter(({ visible }) => visible) + .map(({ id }) => id) + .sort(); + this.model.layerGroups .filter(({ visible }) => visible) .forEach((model) => this.toggleLayerVisibilityToFalse(model)); this.handleLayerGroupChange(); + this.set('layerGroupsStorage', tempStorage); + gtag('event', 'search', { event_category: 'Toggle Layer', event_action: 'Toggle All Layers Off', @@ -128,11 +140,46 @@ export default class ApplicationController extends Controller.extend( }); } + @action + undoSetAllLayerVisibilityToFalse() { + this.model.layerGroups.forEach((lg) => { + if (this.layerGroupsStorage.includes(lg.id)) { + lg.set('visible', true); + } + }); + + this.set('layerGroupsStorage', null); + this.handleLayerGroupChange(); + + gtag('event', 'search', { + event_category: 'Toggle Layer', + event_action: 'Undo Toggle All Layers Off', + }); + + // GA + this.metrics.trackEvent('MatomoTagManager', { + category: 'Toggle Layer', + action: 'Undo Toggle All Layers Off', + name: 'Undo Toggle All Layers Off', + }); + } + @action toggleLayerVisibilityToFalse(layer) { layer.visible = false; } + @computed('layerGroupsStorage', 'model.layerGroups') + get showToggleLayersBackOn() { + if ( + this.model.layerGroups.filter(({ visible }) => visible).length === 0 && + this.layerGroupsStorage + ) { + return true; + } + return false; + } + @computed('queryParamsState') get isDefault() { const state = this.queryParamsState || {}; diff --git a/app/templates/application.hbs b/app/templates/application.hbs index 6e690409..108f2169 100644 --- a/app/templates/application.hbs +++ b/app/templates/application.hbs @@ -31,7 +31,9 @@ @isDefault={{this.isDefault}} @resetQueryParams={{action this.setModelsToDefault}} @setAllLayerVisibilityToFalse={{action this.setAllLayerVisibilityToFalse}} + @undoSetAllLayerVisibilityToFalse={{action this.undoSetAllLayerVisibilityToFalse}} @handleLayerGroupChange={{action this.handleLayerGroupChange}} + @showToggleLayersBackOn={{this.showToggleLayersBackOn}} /> diff --git a/app/templates/components/layer-palette.hbs b/app/templates/components/layer-palette.hbs index 3e9abc07..791fb613 100644 --- a/app/templates/components/layer-palette.hbs +++ b/app/templates/components/layer-palette.hbs @@ -9,13 +9,23 @@ {{/if}}
- - - Toggle All Map Layers Off - + {{#if this.showToggleLayersBackOn}} + + + Toggle Layers Back On + + {{else}} + + + Toggle All Map Layers Off + + {{/if}} - - - Reset Map Layers -
{{yield}} From daf2a7b55fcb3ece3966a887a33d5443338629e5 Mon Sep 17 00:00:00 2001 From: David Hochbaum Date: Thu, 28 Mar 2024 11:28:09 -0400 Subject: [PATCH 06/10] Changed icon for re-implementing layers to undo --- app/templates/components/layer-palette.hbs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/templates/components/layer-palette.hbs b/app/templates/components/layer-palette.hbs index 791fb613..628d9151 100644 --- a/app/templates/components/layer-palette.hbs +++ b/app/templates/components/layer-palette.hbs @@ -14,7 +14,7 @@ class="button gray small no-layers-button hide-for-print" onclick={{action this.undoSetAllLayerVisibilityToFalse}} data-test-reset-query-params="true"> - + Toggle Layers Back On {{else}} From aa0f422c1b60988df8c3a3523b1f4138e8e7854e Mon Sep 17 00:00:00 2001 From: David Hochbaum Date: Tue, 9 Apr 2024 17:00:30 -0400 Subject: [PATCH 07/10] Updated to turn on Search History fucntionality --- app/templates/components/map-resource-search.hbs | 1 + 1 file changed, 1 insertion(+) diff --git a/app/templates/components/map-resource-search.hbs b/app/templates/components/map-resource-search.hbs index a44ba2f3..ff617235 100644 --- a/app/templates/components/map-resource-search.hbs +++ b/app/templates/components/map-resource-search.hbs @@ -3,6 +3,7 @@ data-test-search="resource" @onSelect={{action "handleSearchSelect"}} @typeTitleLookup={{this.resourceTitleLookup}} + @useSearchHistory={{true}} /> Date: Thu, 11 Apr 2024 11:30:11 -0400 Subject: [PATCH 08/10] Update default selected aerial layer --- app/controllers/application.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/controllers/application.js b/app/controllers/application.js index f42ae2e3..1590b8e2 100644 --- a/app/controllers/application.js +++ b/app/controllers/application.js @@ -70,7 +70,7 @@ export const mapQueryParams = new QueryParams( }, 'aerial-year': { - defaultValue: 'aerials-2016', + defaultValue: 'aerials-2022', }, // TODO: After merge of params refactor, update print service based on this param. From ca0c9fabd8c8dd4d2f5bc54c8bcea2f7075ea9ad Mon Sep 17 00:00:00 2001 From: David Hochbaum Date: Tue, 16 Apr 2024 10:15:42 -0400 Subject: [PATCH 09/10] Updated to use new version of @nycplanning/ember that has Search History functionality --- package.json | 2 +- yarn.lock | 7 ++++--- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/package.json b/package.json index 09b6bd39..c130a91b 100644 --- a/package.json +++ b/package.json @@ -41,7 +41,7 @@ "@glimmer/component": "^1.1.2", "@glimmer/tracking": "^1.1.2", "@mapbox/mapbox-gl-draw": "^1.0.0", - "@nycplanning/ember": "https://github.com/NYCPlanning/ose-ember-addons#zola-search-history", + "@nycplanning/ember": "^3.1.0", "@nycplanning/ember-cli-foundation-6-sass": "^0.1.0", "@nycplanning/ember-cli-nouislider": "^1.3.0", "@nycplanning/ember-mapbox-gl-draw": "^2.1.0", diff --git a/yarn.lock b/yarn.lock index 19208734..80a4438f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2216,9 +2216,10 @@ dependencies: ember-cli-babel "^7.1.2" -"@nycplanning/ember@https://github.com/NYCPlanning/ose-ember-addons#zola-search-history": - version "3.0.0" - resolved "https://github.com/NYCPlanning/ose-ember-addons#2bd9e3210c3c9e3e84907997a66267d822fe1b38" +"@nycplanning/ember@^3.1.0": + version "3.1.0" + resolved "https://registry.yarnpkg.com/@nycplanning/ember/-/ember-3.1.0.tgz#34523670fb9bb5216efcd428c9222a0b21d0d0a8" + integrity sha512-DBZV9RVJEgttRMeauf0owwI6hqvCK3VS58ftQvAa9EZppqHicu2fDHM+yVpl3kIY17GV/AnE0Z8HmdNfOTf2QA== dependencies: "@turf/union" "^6.0.0" ember-auto-import "^2.6.3" From b87c49a69f543175ca9ebd1f31203d44d7b2c0d8 Mon Sep 17 00:00:00 2001 From: David Hochbaum Date: Wed, 1 May 2024 14:14:46 -0400 Subject: [PATCH 10/10] Removed duplicate import statement --- app/controllers/application.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/controllers/application.js b/app/controllers/application.js index ff62a154..2745dd91 100644 --- a/app/controllers/application.js +++ b/app/controllers/application.js @@ -5,7 +5,6 @@ import { tracked } from '@glimmer/tracking'; import { inject as service } from '@ember/service'; import QueryParams from '@nycplanning/ember-parachute'; import config from 'labs-zola/config/environment'; -import { tracked } from '@glimmer/tracking'; const { defaultLayerGroupState, @@ -92,6 +91,7 @@ export default class ApplicationController extends Controller.extend( @service metrics; @tracked leftSideMenuVisibilty = true; + @tracked layerGroupsStorage; // this action extracts query-param-friendly state of layer groups