Commit 7e94f3d2e9811224e13fccca5e8e41890df584ac
1 parent
87efaa78
Exists in
master
and in
8 other branches
Add filter to ranking page
Showing
8 changed files
with
263 additions
and
42 deletions
Show diff stats
src/app/components/article-service/article.service.js
@@ -100,21 +100,17 @@ | @@ -100,21 +100,17 @@ | ||
100 | 100 | ||
101 | // var url = service.apiArticles + API.articleId.home; | 101 | // var url = service.apiArticles + API.articleId.home; |
102 | 102 | ||
103 | - // var paramsExtended = angular.extend({ | ||
104 | - // // 'fields[]': ['id', 'title', 'slug', 'abstract', 'categories', 'setting', 'children', 'children_count'], | ||
105 | - // 'content_type':'ProposalsDiscussionPlugin::Proposal' | ||
106 | - // }, params); | ||
107 | - | ||
108 | // UtilService.get(url, {params: paramsExtended}).then(function(data){ | 103 | // UtilService.get(url, {params: paramsExtended}).then(function(data){ |
109 | // cbSuccess(data); | 104 | // cbSuccess(data); |
110 | // }).catch(function(error){ | 105 | // }).catch(function(error){ |
111 | // cbError(error); | 106 | // cbError(error); |
112 | // }); | 107 | // }); |
113 | 108 | ||
114 | - // | ||
115 | - searchProposals({ | 109 | + var paramsExtended = angular.extend({ |
116 | query: '' | 110 | query: '' |
117 | - }, cbSuccess, cbError); | 111 | + }, params); |
112 | + | ||
113 | + searchProposals(paramsExtended, cbSuccess, cbError); | ||
118 | } | 114 | } |
119 | 115 | ||
120 | function getProposalById (proposalId, params, cbSuccess, cbError) { | 116 | function getProposalById (proposalId, params, cbSuccess, cbError) { |
src/app/components/category-list/category-list.directive.js
@@ -30,6 +30,12 @@ | @@ -30,6 +30,12 @@ | ||
30 | if(!vm.isCollapsed){ | 30 | if(!vm.isCollapsed){ |
31 | vm.isCollapsed = false; | 31 | vm.isCollapsed = false; |
32 | } | 32 | } |
33 | + | ||
34 | + if(angular.isUndefined(vm.canUnselect) || vm.canUnselect === null){ | ||
35 | + vm.canUnselect = true; | ||
36 | + } else { | ||
37 | + vm.canUnselect = !(vm.canUnselect == 'false'); | ||
38 | + } | ||
33 | }; | 39 | }; |
34 | 40 | ||
35 | CategoryListController.prototype.selectCategory = function(category, $event) { | 41 | CategoryListController.prototype.selectCategory = function(category, $event) { |
@@ -38,11 +44,13 @@ | @@ -38,11 +44,13 @@ | ||
38 | // prevent glitch | 44 | // prevent glitch |
39 | $event.stopPropagation(); | 45 | $event.stopPropagation(); |
40 | 46 | ||
47 | + if(!category && !vm.canUnselect){ | ||
48 | + vm.$log.info('Unselect is disabled.'); | ||
49 | + return; | ||
50 | + } | ||
51 | + | ||
41 | if (category !== vm.selectedCategory) { | 52 | if (category !== vm.selectedCategory) { |
42 | - // selected new filter | ||
43 | vm.selectedCategory = category; | 53 | vm.selectedCategory = category; |
44 | - } else { | ||
45 | - vm.selectedCategory = null; | ||
46 | } | 54 | } |
47 | 55 | ||
48 | // send event to all controllers | 56 | // send event to all controllers |
@@ -65,7 +73,8 @@ | @@ -65,7 +73,8 @@ | ||
65 | templateUrl: 'app/components/category-list/category-list.html', | 73 | templateUrl: 'app/components/category-list/category-list.html', |
66 | scope: { | 74 | scope: { |
67 | categories: '=', | 75 | categories: '=', |
68 | - selectedCategory: '=' | 76 | + selectedCategory: '=', |
77 | + canUnselect: '@' | ||
69 | }, | 78 | }, |
70 | controller: CategoryListController, | 79 | controller: CategoryListController, |
71 | controllerAs: 'vm', | 80 | controllerAs: 'vm', |
src/app/components/dialoga-service/dialoga.service.js
@@ -19,6 +19,7 @@ | @@ -19,6 +19,7 @@ | ||
19 | extendedService.getThemeBySlug = getThemeBySlug; | 19 | extendedService.getThemeBySlug = getThemeBySlug; |
20 | extendedService.getPrograms = getPrograms; | 20 | extendedService.getPrograms = getPrograms; |
21 | extendedService.getProgramBySlug = getProgramBySlug; | 21 | extendedService.getProgramBySlug = getProgramBySlug; |
22 | + extendedService.getProgramsByThemeId = getProgramsByThemeId; | ||
22 | extendedService.getProgramsRandom = getProgramsRandom; | 23 | extendedService.getProgramsRandom = getProgramsRandom; |
23 | extendedService.getEvents = getEvents; // override | 24 | extendedService.getEvents = getEvents; // override |
24 | extendedService.getQuestions = getQuestions; | 25 | extendedService.getQuestions = getQuestions; |
@@ -89,6 +90,7 @@ | @@ -89,6 +90,7 @@ | ||
89 | },cbError); | 90 | },cbError); |
90 | } | 91 | } |
91 | } | 92 | } |
93 | + | ||
92 | function getThemeBySlug (slug, cbSuccess, cbError) { | 94 | function getThemeBySlug (slug, cbSuccess, cbError) { |
93 | if( !!CACHE.themes ){ | 95 | if( !!CACHE.themes ){ |
94 | _getThemeBySlug(CACHE.themes); | 96 | _getThemeBySlug(CACHE.themes); |
@@ -146,6 +148,28 @@ | @@ -146,6 +148,28 @@ | ||
146 | } | 148 | } |
147 | } | 149 | } |
148 | 150 | ||
151 | + function getProgramsByThemeId (themeId, cbSuccess, cbError) { | ||
152 | + | ||
153 | + if( !CACHE.programs ){ | ||
154 | + getPrograms(_getProgramsByThemeId, cbError); | ||
155 | + } else { | ||
156 | + _getProgramsByThemeId(); | ||
157 | + } | ||
158 | + | ||
159 | + function _getProgramsByThemeId(){ | ||
160 | + var result = CACHE.programs.filter(function filterProgramBySlug (program) { | ||
161 | + var category = program.categories[0]; | ||
162 | + | ||
163 | + if(angular.equals(category.id, themeId)) { | ||
164 | + return true; | ||
165 | + } | ||
166 | + return false; | ||
167 | + }); | ||
168 | + | ||
169 | + cbSuccess(result); | ||
170 | + } | ||
171 | + } | ||
172 | + | ||
149 | // Ex.: /api/v1/dialoga_plugin/random_topics/103358 | 173 | // Ex.: /api/v1/dialoga_plugin/random_topics/103358 |
150 | // TODO: get endpoint for production | 174 | // TODO: get endpoint for production |
151 | // TODO: put at cache? | 175 | // TODO: put at cache? |
src/app/components/topics-select/topics-select.directive.js
0 → 100644
@@ -0,0 +1,61 @@ | @@ -0,0 +1,61 @@ | ||
1 | +(function() { | ||
2 | + 'use strict'; | ||
3 | + | ||
4 | + angular | ||
5 | + .module('dialoga') | ||
6 | + .directive('topicsSelect', topicsSelect); | ||
7 | + | ||
8 | + /** @ngInject */ | ||
9 | + function topicsSelect() { | ||
10 | + | ||
11 | + /** @ngInject */ | ||
12 | + function TopicsSelectController($rootScope, $log) { | ||
13 | + $log.debug('TopicsSelectController'); | ||
14 | + | ||
15 | + // alias | ||
16 | + var vm = this; | ||
17 | + | ||
18 | + // dependencies | ||
19 | + vm.$rootScope = $rootScope; | ||
20 | + vm.$log = $log; | ||
21 | + | ||
22 | + // initialization | ||
23 | + vm.init(); | ||
24 | + } | ||
25 | + | ||
26 | + TopicsSelectController.prototype.init = function() { | ||
27 | + var vm = this; | ||
28 | + | ||
29 | + // vm.topics = null; | ||
30 | + // vm.selectedTopic = null; | ||
31 | + vm.topicFilter = vm.selectedTopic; | ||
32 | + }; | ||
33 | + | ||
34 | + TopicsSelectController.prototype.selectTopic = function() { | ||
35 | + var vm = this; | ||
36 | + | ||
37 | + if (vm.topicFilter === null) { | ||
38 | + vm.$log.debug('Default topic selected.'); | ||
39 | + return; | ||
40 | + } | ||
41 | + | ||
42 | + // send event to all controllers | ||
43 | + vm.$rootScope.$broadcast('change-selectedTopic', vm.topicFilter); | ||
44 | + }; | ||
45 | + | ||
46 | + var directive = { | ||
47 | + restrict: 'E', | ||
48 | + templateUrl: 'app/components/topics-select/topics-select.html', | ||
49 | + scope: { | ||
50 | + topics: '=', | ||
51 | + selectedTopic: '=' | ||
52 | + }, | ||
53 | + controller: TopicsSelectController, | ||
54 | + controllerAs: 'vm', | ||
55 | + bindToController: true | ||
56 | + }; | ||
57 | + | ||
58 | + return directive; | ||
59 | + } | ||
60 | + | ||
61 | +})(); |
@@ -0,0 +1,9 @@ | @@ -0,0 +1,9 @@ | ||
1 | +<div class="topics-dropdown"> | ||
2 | + <select | ||
3 | + ng-model="vm.topicFilter" | ||
4 | + ng-change="vm.selectTopic()" | ||
5 | + ng-options="topic.title for topic in vm.topics track by topic.slug" | ||
6 | + class="form-control"> | ||
7 | + <option value="">-- Selecione um programa --</option> | ||
8 | + </select> | ||
9 | +</div> |
src/app/pages/propostas/propostas.controller.js
@@ -22,7 +22,7 @@ | @@ -22,7 +22,7 @@ | ||
22 | 22 | ||
23 | vm.init(); | 23 | vm.init(); |
24 | vm.loadData(); | 24 | vm.loadData(); |
25 | - vm.attachListeners(); | 25 | + // vm.attachListeners(); // attach listeners after load data (SYNC) |
26 | 26 | ||
27 | $log.debug('PropostasPageController'); | 27 | $log.debug('PropostasPageController'); |
28 | } | 28 | } |
@@ -32,6 +32,8 @@ | @@ -32,6 +32,8 @@ | ||
32 | 32 | ||
33 | vm.themes = null; | 33 | vm.themes = null; |
34 | vm.selectedTheme = null; | 34 | vm.selectedTheme = null; |
35 | + vm.filtredPrograms = null; | ||
36 | + vm.selectedProgram = null; | ||
35 | vm.proposals = null; | 37 | vm.proposals = null; |
36 | vm.filtredProposals = null; | 38 | vm.filtredProposals = null; |
37 | vm.query = null; | 39 | vm.query = null; |
@@ -46,30 +48,108 @@ | @@ -46,30 +48,108 @@ | ||
46 | 48 | ||
47 | vm.loading = true; | 49 | vm.loading = true; |
48 | 50 | ||
49 | - // load Proposals | ||
50 | - vm.loadingProposals = true; | ||
51 | - vm.DialogaService.getProposals({}, function(data){ | ||
52 | - vm.proposals = data.articles; | ||
53 | - vm.filtredProposals = vm.proposals; | ||
54 | - vm.loadingProposals = false; | 51 | + // Behaviour: |
52 | + // 1. Load themes | ||
53 | + // 2. Select a Random Theme (T) | ||
54 | + // 3. Load programs of T | ||
55 | + // 4. Select a random program of T | ||
56 | + // 5. Filter the list of proposals | ||
57 | + // END. | ||
58 | + | ||
59 | + // 1. Load themes | ||
60 | + vm.loadingThemes = true; | ||
61 | + vm.DialogaService.getThemes(function(themes){ | ||
62 | + vm.themes = themes; | ||
63 | + vm.loadingThemes = false; | ||
55 | vm.loading = false; | 64 | vm.loading = false; |
65 | + | ||
66 | + // 2. Select a Random Theme (T) | ||
67 | + var selectedTheme = null; | ||
68 | + if(vm.search.tema){ | ||
69 | + | ||
70 | + // vanilla filter | ||
71 | + var results = vm.themes.filter(function(t){ | ||
72 | + return t.slug === vm.search.tema; | ||
73 | + }); | ||
74 | + | ||
75 | + if(results && results.length > 0){ | ||
76 | + selectedTheme = results[0]; | ||
77 | + vm.selectedTheme = selectedTheme; | ||
78 | + } | ||
79 | + } | ||
80 | + | ||
81 | + if(!selectedTheme){ | ||
82 | + vm.selectedTheme = vm.themes[Math.floor(Math.random() * vm.themes.length)]; | ||
83 | + } | ||
84 | + | ||
85 | + // 3. Load programs of T | ||
86 | + // (AND 4) | ||
87 | + var themeId = vm.selectedTheme.id; | ||
88 | + vm.loadPrograms(themeId, function(){ | ||
89 | + vm.loadProposals(); | ||
90 | + }); | ||
56 | }, function (error) { | 91 | }, function (error) { |
57 | vm.error = error; | 92 | vm.error = error; |
58 | vm.$log.error(error); | 93 | vm.$log.error(error); |
59 | - vm.loadingProposals = false; | 94 | + vm.loadingThemes = false; |
60 | vm.loading = false; | 95 | vm.loading = false; |
61 | }); | 96 | }); |
97 | + }; | ||
62 | 98 | ||
63 | - // load themes | ||
64 | - vm.loadingThemes = true; | ||
65 | - vm.DialogaService.getThemes(function(themes){ | ||
66 | - vm.themes = themes; | ||
67 | - vm.loadingThemes = false; | 99 | + PropostasPageController.prototype.loadPrograms = function (themeId, cb) { |
100 | + var vm = this; | ||
101 | + | ||
102 | + vm.DialogaService.getProgramsByThemeId(themeId, function (programs){ | ||
103 | + vm.$log.debug('programs', programs); | ||
104 | + | ||
105 | + vm.filtredPrograms = programs; | ||
106 | + | ||
107 | + // 4. Select a random program of T | ||
108 | + var selectedProgram = null; | ||
109 | + if(vm.search.programa){ | ||
110 | + | ||
111 | + // vanilla filter | ||
112 | + var results = vm.filtredPrograms.filter(function(p){ | ||
113 | + return p.slug === vm.search.programa; | ||
114 | + }); | ||
115 | + | ||
116 | + if(results && results.length > 0){ | ||
117 | + selectedProgram = results[0]; | ||
118 | + vm.selectedProgram = selectedProgram; | ||
119 | + } | ||
120 | + } | ||
121 | + | ||
122 | + if(!selectedProgram){ | ||
123 | + vm.selectedProgram = vm.filtredPrograms[Math.floor(Math.random() * vm.filtredPrograms.length)]; | ||
124 | + } | ||
125 | + | ||
126 | + if(cb){ | ||
127 | + cb(); | ||
128 | + } | ||
129 | + }, function(error){ | ||
130 | + vm.$log.error(error); | ||
131 | + if(cb){ | ||
132 | + cb(); | ||
133 | + } | ||
134 | + }); | ||
135 | + }; | ||
136 | + | ||
137 | + PropostasPageController.prototype.loadProposals = function () { | ||
138 | + var vm = this; | ||
139 | + | ||
140 | + // load Proposals | ||
141 | + vm.loadingProposals = true; | ||
142 | + vm.DialogaService.getProposals({}, function(data){ | ||
143 | + vm.proposals = data.articles; | ||
144 | + vm.filtredProposals = vm.proposals; | ||
145 | + vm.loadingProposals = false; | ||
68 | vm.loading = false; | 146 | vm.loading = false; |
147 | + | ||
148 | + vm.attachListeners(); | ||
69 | }, function (error) { | 149 | }, function (error) { |
70 | vm.error = error; | 150 | vm.error = error; |
71 | vm.$log.error(error); | 151 | vm.$log.error(error); |
72 | - vm.loadingThemes = false; | 152 | + vm.loadingProposals = false; |
73 | vm.loading = false; | 153 | vm.loading = false; |
74 | }); | 154 | }); |
75 | }; | 155 | }; |
@@ -81,12 +161,23 @@ | @@ -81,12 +161,23 @@ | ||
81 | vm.selectedTheme = selectedCategory; | 161 | vm.selectedTheme = selectedCategory; |
82 | }); | 162 | }); |
83 | 163 | ||
84 | - vm.$scope.$watch('pagePropostas.selectedTheme', function(newValue/*, oldValue*/) { | 164 | + vm.$scope.$watch('pagePropostas.selectedTheme', function(newValue, oldValue) { |
85 | vm.search.tema = newValue ? newValue.slug : null; | 165 | vm.search.tema = newValue ? newValue.slug : null; |
86 | vm.$location.search('tema', vm.search.tema); | 166 | vm.$location.search('tema', vm.search.tema); |
87 | vm.filtredProposals = vm.getFiltredProposals(); | 167 | vm.filtredProposals = vm.getFiltredProposals(); |
88 | }); | 168 | }); |
89 | 169 | ||
170 | + vm.$scope.$on('change-selectedTopic', function (event, selectedTopic) { | ||
171 | + vm.selectedProgram = selectedTopic; | ||
172 | + vm.$log.debug('change-selectedTopic', selectedTopic); | ||
173 | + }); | ||
174 | + | ||
175 | + vm.$scope.$watch('pagePropostas.selectedProgram', function(newValue, oldValue) { | ||
176 | + vm.search.programa = newValue ? newValue.slug : null; | ||
177 | + vm.$location.search('programa', vm.search.programa); | ||
178 | + vm.filtredProposals = vm.getFiltredProposals(); | ||
179 | + }); | ||
180 | + | ||
90 | vm.$scope.$watch('pagePropostas.query', function(newValue/*, oldValue*/) { | 181 | vm.$scope.$watch('pagePropostas.query', function(newValue/*, oldValue*/) { |
91 | vm.search.filtro = newValue ? newValue : null; | 182 | vm.search.filtro = newValue ? newValue : null; |
92 | vm.$location.search('filtro', vm.search.filtro); | 183 | vm.$location.search('filtro', vm.search.filtro); |
@@ -94,22 +185,22 @@ | @@ -94,22 +185,22 @@ | ||
94 | }); | 185 | }); |
95 | }; | 186 | }; |
96 | 187 | ||
97 | - PropostasPageController.prototype.filter = function() { | ||
98 | - var vm = this; | 188 | + // PropostasPageController.prototype.filter = function() { |
189 | + // var vm = this; | ||
99 | 190 | ||
100 | - if (vm.search && vm.search.tema) { | ||
101 | - var slug = vm.search.tema; | ||
102 | - vm.$log.debug('filter by theme', slug); | 191 | + // if (vm.search && vm.search.tema) { |
192 | + // var slug = vm.search.tema; | ||
193 | + // vm.$log.debug('filter by theme', slug); | ||
103 | 194 | ||
104 | - vm.DialogaService.getThemeBySlug(slug, function(theme){ | ||
105 | - vm.selectedTheme = theme; | ||
106 | - vm.$log.debug('getThemeBySlug.slug', slug); | ||
107 | - vm.$log.debug('getThemeBySlug.selectedTheme', theme); | ||
108 | - }, function(error){ | ||
109 | - vm.$log.error('Error when try to "getThemeBySlug"', error); | ||
110 | - }); | ||
111 | - } | ||
112 | - }; | 195 | + // vm.DialogaService.getThemeBySlug(slug, function(theme){ |
196 | + // vm.selectedTheme = theme; | ||
197 | + // vm.$log.debug('getThemeBySlug.slug', slug); | ||
198 | + // vm.$log.debug('getThemeBySlug.selectedTheme', theme); | ||
199 | + // }, function(error){ | ||
200 | + // vm.$log.error('Error when try to "getThemeBySlug"', error); | ||
201 | + // }); | ||
202 | + // } | ||
203 | + // }; | ||
113 | 204 | ||
114 | PropostasPageController.prototype.showAllPrograms = function($event) { | 205 | PropostasPageController.prototype.showAllPrograms = function($event) { |
115 | var vm = this; | 206 | var vm = this; |
@@ -141,6 +232,7 @@ | @@ -141,6 +232,7 @@ | ||
141 | var output = input; | 232 | var output = input; |
142 | var query = vm.query; | 233 | var query = vm.query; |
143 | var selectedTheme = vm.selectedTheme; | 234 | var selectedTheme = vm.selectedTheme; |
235 | + var selectedProgram = vm.selectedProgram; | ||
144 | 236 | ||
145 | var filter = vm.$filter('filter'); | 237 | var filter = vm.$filter('filter'); |
146 | 238 | ||
@@ -148,6 +240,10 @@ | @@ -148,6 +240,10 @@ | ||
148 | output = _filterByCategory(output, selectedTheme); | 240 | output = _filterByCategory(output, selectedTheme); |
149 | } | 241 | } |
150 | 242 | ||
243 | + if (selectedProgram) { | ||
244 | + output = _filterByProgram(output, selectedProgram); | ||
245 | + } | ||
246 | + | ||
151 | if (query) { | 247 | if (query) { |
152 | output = filter(output, query, false); | 248 | output = filter(output, query, false); |
153 | } | 249 | } |
@@ -178,4 +274,23 @@ | @@ -178,4 +274,23 @@ | ||
178 | return out; | 274 | return out; |
179 | } | 275 | } |
180 | 276 | ||
277 | + function _filterByProgram (input, program) { | ||
278 | + input = input || []; | ||
279 | + | ||
280 | + if (!program) { | ||
281 | + // no filter | ||
282 | + return input; | ||
283 | + } | ||
284 | + | ||
285 | + var out = []; | ||
286 | + for (var i = 0; i < input.length; i++) { | ||
287 | + var proposal = input[i]; | ||
288 | + if (proposal.parent.id === program.id) { | ||
289 | + out.push(proposal); | ||
290 | + } | ||
291 | + } | ||
292 | + | ||
293 | + return out; | ||
294 | + } | ||
295 | + | ||
181 | })(); | 296 | })(); |
src/app/pages/propostas/propostas.scss
src/app/pages/propostas/ranking.html
@@ -38,7 +38,10 @@ | @@ -38,7 +38,10 @@ | ||
38 | </div> | 38 | </div> |
39 | </div> | 39 | </div> |
40 | <div ng-if="pagePropostas.themes"> | 40 | <div ng-if="pagePropostas.themes"> |
41 | - <category-list categories="pagePropostas.themes" selected-category="pagePropostas.selectedTheme"></category-list> | 41 | + <category-list categories="pagePropostas.themes" selected-category="pagePropostas.selectedTheme" can-unselect="false"></category-list> |
42 | + </div> | ||
43 | + <div ng-if="pagePropostas.filtredPrograms" class="topics-select--wrapper"> | ||
44 | + <topics-select topics="pagePropostas.filtredPrograms" selected-topic="pagePropostas.selectedProgram"></topics-select> | ||
42 | </div> | 45 | </div> |
43 | <div ng-if="!pagePropostas.themes && pagePropostas.loadingThemes"> | 46 | <div ng-if="!pagePropostas.themes && pagePropostas.loadingThemes"> |
44 | <div class="alert alert-info" role="alert"> | 47 | <div class="alert alert-info" role="alert"> |