From 8a286707f427b5ddd9e6360cc32d541a28d463ee Mon Sep 17 00:00:00 2001 From: Uddeshya Singh Date: Thu, 13 Jun 2019 22:43:34 +0530 Subject: [PATCH 1/2] Add toggle filters for mobile screens --- app/components/explore/side-bar.js | 11 +- app/templates/components/explore/side-bar.hbs | 167 +++++++++--------- 2 files changed, 96 insertions(+), 82 deletions(-) diff --git a/app/components/explore/side-bar.js b/app/components/explore/side-bar.js index 32e903188da..da10b725933 100644 --- a/app/components/explore/side-bar.js +++ b/app/components/explore/side-bar.js @@ -9,7 +9,8 @@ export default Component.extend({ customStartDate: moment().toISOString(), - customEndDate: null, + customEndDate : null, + showFilters : false, hideClearFilters: computed('category', 'sub_category', 'event_type', 'startDate', 'endDate', 'location', function() { return !(this.category || this.sub_category || this.event_type || this.startDate || this.endDate || this.location !== null); @@ -19,6 +20,10 @@ export default Component.extend({ return getDateRanges.bind(this)(); }), + showFiltersOnMobile: computed('device.isMobile', 'showFilters', function() { + return ((this.device.isMobile && this.showFilters) || !this.device.isMobile); + }), + actions: { onLocationChangeHandler(lat, lng) { this.setProperties({ @@ -111,6 +116,10 @@ export default Component.extend({ this.set('sub_category', null); this.set('event_type', null); this.set('location', null); + }, + + toggleFilters() { + this.set('showFilters', !this.showFilters); } } }); diff --git a/app/templates/components/explore/side-bar.hbs b/app/templates/components/explore/side-bar.hbs index af1a08dd62c..cce0d2eff17 100644 --- a/app/templates/components/explore/side-bar.hbs +++ b/app/templates/components/explore/side-bar.hbs @@ -2,7 +2,7 @@ {{#g-map lat=37.7833 lng=-122.4167 zoom=2 address=location class='google-maps' as |context|}} {{g-map-address-marker context address=location onLocationChange=(action 'onLocationChangeHandler')}} {{/g-map}} - +
{{widgets/forms/places-autocomplete @@ -12,89 +12,94 @@ placeholder=(t 'Enter Location')}}
-
- {{#ui-accordion}} - - - {{t 'Categories'}} - -
- {{#each model.eventTopics as |Category| }} - - - {{Category.name}} - - {{#if (eq category Category.name)}} - {{#each Category.subTopics as |subCategory|}} - - {{subCategory.name}} - - {{/each}} - {{/if}} - {{/each}} -
- {{/ui-accordion}} -
-
- {{#ui-accordion}} - - - {{t 'Event Type' }} - -
- {{#each model.eventTypes as |eventType|}} - - {{eventType.name}} - - {{/each}} -
- {{/ui-accordion}} -
-
- {{#ui-accordion}} - - - {{t 'Date'}} - -
- {{#each dateRanges as |dateRange|}} - - {{dateRange.name}} - {{#if (and (eq dateRange.key 'custom_dates') (eq dateType 'custom_dates'))}} -
-
-
-
- - {{widgets/forms/date-picker type='text' - value=customStartDate - rangePosition='start' - onChange=(action 'dateValidate') - }} -
-
- - {{widgets/forms/date-picker type='text' - value=customEndDate - rangePosition='end' - onChange=(action 'onDateChange') - }} +{{#if showFiltersOnMobile}} +
+ {{#ui-accordion}} + + + {{t 'Categories'}} + +
+ {{#each model.eventTopics as |Category| }} + + + {{Category.name}} + + {{#if (eq category Category.name)}} + {{#each Category.subTopics as |subCategory|}} + + {{subCategory.name}} + + {{/each}} + {{/if}} + {{/each}} +
+ {{/ui-accordion}} +
+
+ {{#ui-accordion}} + + + {{t 'Event Type' }} + +
+ {{#each model.eventTypes as |eventType|}} + + {{eventType.name}} + + {{/each}} +
+ {{/ui-accordion}} +
+
+ {{#ui-accordion}} + + + {{t 'Date'}} + +
+ {{#each dateRanges as |dateRange|}} + + {{dateRange.name}} + {{#if (and (eq dateRange.key 'custom_dates') (eq dateType 'custom_dates'))}} +
+
+
+
+ + {{widgets/forms/date-picker type='text' + value=customStartDate + rangePosition='start' + onChange=(action 'dateValidate') + }} +
+
+ + {{widgets/forms/date-picker type='text' + value=customEndDate + rangePosition='end' + onChange=(action 'onDateChange') + }} +
-
- {{/if}} - - {{/each}} -
- {{/ui-accordion}} -
+ {{/if}} + + {{/each}} +
+ {{/ui-accordion}} +
+{{/if}}
+ {{#if device.isMobile}} + + {{/if}}
From 660408d9529bfa04c5985f7fe5513c0c119e60fa Mon Sep 17 00:00:00 2001 From: Uddeshya Singh Date: Fri, 14 Jun 2019 12:52:08 +0530 Subject: [PATCH 2/2] simplify logic as suggested --- app/components/explore/side-bar.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/components/explore/side-bar.js b/app/components/explore/side-bar.js index da10b725933..67b7d2dbb78 100644 --- a/app/components/explore/side-bar.js +++ b/app/components/explore/side-bar.js @@ -21,7 +21,7 @@ export default Component.extend({ }), showFiltersOnMobile: computed('device.isMobile', 'showFilters', function() { - return ((this.device.isMobile && this.showFilters) || !this.device.isMobile); + return (!this.device.isMobile || this.showFilters); }), actions: {