Skip to content

Commit 403df8a

Browse files
Anupam-dagarabhinavk96
Anupam-dagar
authored and
abhinavk96
committed
feat: Add checkbox to sidebar filters in explore route. (#3263)
* Add checkbox to sidebar filters in explore route. Fixes: #3098 * change checkbox syntax to semantic ui checkbox. * change class from toggle to ui checkbox
1 parent 3cb7a1b commit 403df8a

File tree

1 file changed

+69
-64
lines changed

1 file changed

+69
-64
lines changed

‎app/templates/components/explore/side-bar.hbs

Lines changed: 69 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -20,36 +20,39 @@
2020
{{t 'Date'}}
2121
</span>
2222
<div class="content menu">
23-
{{#each dateRanges as |dateRange|}}
24-
<a href="#" class="link item {{if (eq dateType dateRange.key) 'active'}}" {{action 'selectDateFilter'
25-
dateRange.key}}>
26-
{{dateRange.name}}
27-
{{#if (and (eq dateRange.key 'custom_dates') (eq dateType 'custom_dates'))}}
28-
<div class="explore sub menu">
29-
<div class="ui form">
30-
<div class="grouped fields">
31-
<div class="item field">
32-
<label class="required" for="start_date">{{t 'Starts'}}</label>
33-
{{widgets/forms/date-picker type='text'
34-
value=customStartDate
35-
rangePosition='start'
36-
onChange=(action 'dateValidate')
37-
}}
38-
</div>
39-
<div class="item field">
40-
<label class="required" for="end_date">{{t 'Ends'}}</label>
41-
{{widgets/forms/date-picker type='text'
42-
value=customEndDate
43-
rangePosition='end'
44-
onChange=(action 'onDateChange')
45-
}}
23+
<div class="ui form">
24+
<div class="grouped fields">
25+
{{#each dateRanges as |dateRange|}}
26+
<div class="field">
27+
{{ui-checkbox label=dateRange.name class='ui checkbox' checked=(if (eq dateType dateRange.key) 'active') onChange=(action 'selectDateFilter' dateRange.key)}}
28+
</div>
29+
{{#if (and (eq dateRange.key 'custom_dates') (eq dateType 'custom_dates'))}}
30+
<div class="explore sub menu">
31+
<div class="ui form">
32+
<div class="grouped fields">
33+
<div class="item field">
34+
<label class="required" for="start_date">{{t 'Starts'}}</label>
35+
{{widgets/forms/date-picker type='text'
36+
value=customStartDate
37+
rangePosition='start'
38+
onChange=(action 'dateValidate')
39+
}}
40+
</div>
41+
<div class="item field">
42+
<label class="required" for="end_date">{{t 'Ends'}}</label>
43+
{{widgets/forms/date-picker type='text'
44+
value=customEndDate
45+
rangePosition='end'
46+
onChange=(action 'onDateChange')
47+
}}
48+
</div>
4649
</div>
4750
</div>
4851
</div>
49-
</div>
50-
{{/if}}
51-
</a>
52-
{{/each}}
52+
{{/if}}
53+
{{/each}}
54+
</div>
55+
</div>
5356
</div>
5457
{{/ui-accordion}}
5558
</div>
@@ -71,13 +74,15 @@
7174
{{Category.name}}
7275
</a>
7376
{{#if (eq category Category.name)}}
74-
{{#each Category.subTopics as |subCategory|}}
75-
<a href="#"
76-
class="link inner item {{if (eq sub_category subCategory.slug) 'active'}}"
77-
{{action 'selectCategory' Category.name subCategory.slug}}>
78-
{{subCategory.name}}
79-
</a>
80-
{{/each}}
77+
<div class="ui form">
78+
<div class="grouped fields">
79+
{{#each Category.subTopics as |subCategory|}}
80+
<div class="field inner item">
81+
{{ui-checkbox label=subCategory.name class='ui checkbox' checked=(if (eq sub_category subCategory.slug) 'active') onChange=(action 'selectCategory' Category.name subCategory.slug)}}
82+
</div>
83+
{{/each}}
84+
</div>
85+
</div>
8186
{{/if}}
8287
{{/each}}
8388
</div>
@@ -90,16 +95,16 @@
9095
{{t 'Event Type' }}
9196
</span>
9297
<div class="content menu">
93-
<a href="#" class="link item {{if showAllTypes 'active'}}" {{action 'clearFilterTypes'}}>
94-
{{t 'All Types'}}
95-
</a>
96-
{{#each model.eventTypes as |eventType|}}
97-
<a href="#"
98-
class="link item {{if (eq event_type eventType.name) 'active'}}"
99-
{{action 'selectEventType' eventType.name}}>
100-
{{eventType.name}}
101-
</a>
102-
{{/each}}
98+
{{ui-checkbox label=(t 'All Types') class='ui checkbox' checked=(if showAllTypes 'active') onChange=(action 'clearFilterTypes')}}
99+
<div class="ui form">
100+
<div class="grouped fields">
101+
{{#each model.eventTypes as |eventType|}}
102+
<div class="field">
103+
{{ui-checkbox label=eventType.name class='ui checkbox' checked=(if (eq event_type eventType.name) 'active') onChange=(action 'selectEventType' eventType.name)}}
104+
</div>
105+
{{/each}}
106+
</div>
107+
</div>
103108
</div>
104109
{{/ui-accordion}}
105110
</div>
@@ -110,16 +115,16 @@
110115
{{t 'Ticket Type' }}
111116
</span>
112117
<div class="content menu">
113-
<a href="#"
114-
class="link item {{if (eq ticket_type 'free') 'active'}}"
115-
{{action 'selectTicketType' 'free'}}>
116-
{{t 'Free'}}
117-
</a>
118-
<a href="#"
119-
class="link item {{if (eq ticket_type 'paid') 'active'}}"
120-
{{action 'selectTicketType' 'paid'}}>
121-
{{t 'Paid'}}
122-
</a>
118+
<div class="ui form">
119+
<div class="grouped fields">
120+
<div class="field">
121+
{{ui-checkbox label=(t 'Free') class='ui checkbox' checked=(if (eq ticket_type 'free') true) onChange=(action 'selectTicketType' 'free')}}
122+
</div>
123+
<div class="field">
124+
{{ui-checkbox label=(t 'Paid') class='ui checkbox' checked=(if (eq ticket_type 'paid') true) onChange=(action 'selectTicketType' 'paid')}}
125+
</div>
126+
</div>
127+
</div>
123128
</div>
124129
{{/ui-accordion}}
125130
</div>
@@ -131,16 +136,16 @@
131136
{{t 'Event Call For Speakers' }}
132137
</span>
133138
<div class="content menu">
134-
<a href="#"
135-
class="link item {{if (eq cfs 'open') 'active'}}"
136-
{{action 'selectEventCfs' 'open'}}>
137-
{{t 'Open'}}
138-
</a>
139-
<a href="#"
140-
class="link item {{if (eq cfs 'closed') 'active'}}"
141-
{{action 'selectEventCfs' 'closed'}}>
142-
{{t 'Closed'}}
143-
</a>
139+
<div class="ui form">
140+
<div class="grouped fields">
141+
<div class="field">
142+
{{ui-checkbox label=(t 'Open') checked=(if (eq cfs 'open') 'active') onChange=(action 'selectEventCfs' 'open')}}
143+
</div>
144+
<div class="field">
145+
{{ui-checkbox label=(t 'Closed') class='ui checkbox' checked=(if (eq cfs 'closed') 'active') onChange=(action 'selectEventCfs' 'closed')}}
146+
</div>
147+
</div>
148+
</div>
144149
</div>
145150
{{/ui-accordion}}
146151
</div>

0 commit comments

Comments
 (0)