Commit adbfb276b4c05fadb01d18e990fb9bee7166f55b
1 parent
e88dfaf9
Exists in
master
and in
8 other branches
Fix reload on home page (and others small improvements)
Showing
7 changed files
with
194 additions
and
79 deletions
Show diff stats
src/app/components/programa/programa.scss
... | ... | @@ -181,11 +181,15 @@ $darken: 15%; |
181 | 181 | -o-transform: scale($scale); /* prefixo para opera */ |
182 | 182 | transform: scale($scale); |
183 | 183 | } |
184 | + | |
185 | + .contraste & { | |
186 | + background-color: #262626; | |
187 | + } | |
184 | 188 | } |
185 | 189 | } |
186 | 190 | |
187 | 191 | .program-preview { |
188 | 192 | .program-banner { |
189 | - | |
193 | + | |
190 | 194 | } |
191 | 195 | } | ... | ... |
src/app/components/programas/programas.directive.js
... | ... | @@ -3,15 +3,13 @@ |
3 | 3 | |
4 | 4 | angular |
5 | 5 | .module('dialoga') |
6 | - .filter('filterByCategory', filterByCategory) | |
7 | - .filter('filterByCriteria', filterByCriteria) | |
8 | 6 | .directive('programaList', programaList); |
9 | 7 | |
10 | 8 | /** @ngInject */ |
11 | 9 | function programaList() { |
12 | 10 | |
13 | 11 | /** @ngInject */ |
14 | - function ProgramaListController($scope, $location, $log) { | |
12 | + function ProgramaListController($scope, $location, $filter, $log) { | |
15 | 13 | $log.debug('ProgramaListController'); |
16 | 14 | |
17 | 15 | // alias |
... | ... | @@ -20,6 +18,7 @@ |
20 | 18 | // dependencies |
21 | 19 | vm.$scope = $scope; |
22 | 20 | vm.$location = $location; |
21 | + vm.$filter = $filter; | |
23 | 22 | vm.$log = $log; |
24 | 23 | |
25 | 24 | // initialization |
... | ... | @@ -36,34 +35,51 @@ |
36 | 35 | |
37 | 36 | vm.categories = vm.article.categories; |
38 | 37 | vm.programs = vm.article.children; |
39 | - vm.filtredProgramList = []; | |
40 | 38 | vm.orderCriteries = [ |
41 | - { label: 'Título', name: 'title' }, | |
42 | - { label: 'Tema', name: 'category' } | |
43 | - // , { label: 'Mais participações', name: 'more_participants' } | |
39 | + { label: 'Aleatório', name: 'aleatorio' }, | |
40 | + { label: 'Título', name: 'titulo' }, | |
41 | + { label: 'Tema', name: 'tema' } | |
44 | 42 | ]; |
45 | 43 | |
44 | + vm.filtredProgramList = vm.getFiltredPrograms(); | |
46 | 45 | vm.search = vm.$location.search(); |
47 | 46 | |
48 | 47 | // Add initial values for the filter |
49 | 48 | vm.query = (vm.search && vm.search.filtro) ? vm.search.filtro : null; |
50 | - vm.limitTo = (vm.search && vm.search.limite) ? parseInt(vm.search.limite, 10) : 4; | |
51 | - vm.categoryFilter = (vm.search && vm.search.tema) ? vm.filterByCategorySlug(vm.search.tema) : null; | |
49 | + vm.limitTo = (vm.search && vm.search.limite) ? parseInt(vm.search.limite, 10) : null; | |
50 | + vm.categoryFilter = (vm.search && vm.search.tema) ? vm.getCategoryBySlug(vm.search.tema) : null; | |
51 | + vm.orderCriteria = (vm.search && vm.search.ordem) ? { name: vm.search.ordem } : null; | |
52 | + vm.reverse = (vm.search && vm.search.reverso) ? true : false; | |
52 | 53 | |
53 | 54 | // update window location params |
54 | 55 | vm.$scope.$watch('vm.query', function(newValue, oldValue){ |
55 | - vm.search.filtro = newValue; | |
56 | - vm.$location.search(vm.search); | |
56 | + vm.search.filtro = newValue ? newValue : null; | |
57 | + vm.$location.search('filtro', vm.search.filtro); | |
58 | + vm.filtredProgramList = vm.getFiltredPrograms(); | |
57 | 59 | }); |
58 | 60 | |
59 | 61 | vm.$scope.$watch('vm.limitTo', function(newValue, oldValue){ |
60 | - vm.search.limite = newValue; | |
61 | - vm.$location.search(vm.search); | |
62 | + vm.search.limite = newValue ? newValue : null; | |
63 | + vm.$location.search('limite', vm.search.limite); | |
64 | + vm.filtredProgramList = vm.getFiltredPrograms(); | |
62 | 65 | }); |
63 | 66 | |
64 | 67 | vm.$scope.$watch('vm.categoryFilter', function(newValue, oldValue){ |
65 | 68 | vm.search.tema = newValue ? newValue.slug : null; |
66 | - vm.$location.search(vm.search); | |
69 | + vm.$location.search('tema', vm.search.tema); | |
70 | + vm.filtredProgramList = vm.getFiltredPrograms(); | |
71 | + }); | |
72 | + | |
73 | + vm.$scope.$watch('vm.orderCriteria', function(newValue, oldValue){ | |
74 | + vm.search.ordem = (newValue && newValue.name) ? newValue.name : null; | |
75 | + vm.$location.search('ordem', vm.search.ordem); | |
76 | + vm.filtredProgramList = vm.getFiltredPrograms(); | |
77 | + }); | |
78 | + | |
79 | + vm.$scope.$watch('vm.reverse', function(newValue, oldValue){ | |
80 | + vm.search.reverso = newValue ? newValue : null; | |
81 | + vm.$location.search('reverso', vm.search.reverso); | |
82 | + vm.filtredProgramList = vm.getFiltredPrograms(); | |
67 | 83 | }); |
68 | 84 | |
69 | 85 | }; |
... | ... | @@ -72,8 +88,9 @@ |
72 | 88 | var vm = this; |
73 | 89 | |
74 | 90 | vm.query = null; |
75 | - vm.limitTo = 4; | |
91 | + vm.limitTo = null; | |
76 | 92 | vm.categoryFilter = null; |
93 | + vm.orderCriteria = null; | |
77 | 94 | }; |
78 | 95 | |
79 | 96 | ProgramaListController.prototype.getIconClasses = function (category) { |
... | ... | @@ -83,7 +100,7 @@ |
83 | 100 | return 'glyphicon glyphicon-exclamation-sign'; |
84 | 101 | }; |
85 | 102 | |
86 | - ProgramaListController.prototype.filterByCategorySlug = function (categorySlug) { | |
103 | + ProgramaListController.prototype.getCategoryBySlug = function (categorySlug) { | |
87 | 104 | var vm = this; |
88 | 105 | var result = null; |
89 | 106 | |
... | ... | @@ -119,16 +136,108 @@ |
119 | 136 | vm.limitTo = vm.programs.length; |
120 | 137 | }; |
121 | 138 | |
122 | - // function ProgramaListLinker (scope, element, attrs) { | |
139 | + ProgramaListController.prototype.getFiltredPrograms = function () { | |
140 | + var vm = this; | |
141 | + | |
142 | + var input = vm.programs; | |
143 | + var output = input; | |
144 | + var query = vm.query; | |
145 | + var categoryFilter = vm.categoryFilter; | |
146 | + var orderCriteria = vm.orderCriteria ? vm.orderCriteria : { name : 'aleatorio'}; | |
147 | + var filter = vm.$filter('filter'); | |
148 | + var orderBy = vm.$filter('orderBy'); | |
149 | + var limitTo = vm.$filter('limitTo'); | |
150 | + var limit = vm.limitTo ? vm.limitTo : 4; | |
151 | + | |
152 | + if(categoryFilter){ | |
153 | + output = _filterByCategory(output, categoryFilter); | |
154 | + } | |
155 | + | |
156 | + if(query){ | |
157 | + output = filter(output, query, false); | |
158 | + } | |
159 | + | |
160 | + switch(orderCriteria.name) { | |
161 | + case 'titulo': | |
162 | + output = orderBy(output, 'title', vm.reverse); | |
163 | + break; | |
164 | + case 'tema': | |
165 | + output = orderBy(output, 'categories[0].name', vm.reverse); | |
166 | + break; | |
167 | + case 'more_participants': | |
168 | + $log.info('Criteria not handled yet: ', orderCriteria); | |
169 | + break; | |
170 | + case 'aleatorio': | |
171 | + default: | |
172 | + // shuffling | |
173 | + // if(!vm._isShuffled){ | |
174 | + output = vm.filterShuffle(output); | |
175 | + // vm._isShuffled = true; | |
176 | + // } | |
177 | + | |
178 | + if(vm.reverse){ | |
179 | + output = output.slice().reverse(); | |
180 | + } | |
181 | + | |
182 | + break; | |
183 | + } | |
184 | + | |
185 | + output = limitTo(output, limit); | |
186 | + | |
187 | + return output; | |
188 | + }; | |
189 | + | |
190 | + ProgramaListController.prototype.filterShuffle = function (input) { | |
191 | + var result = []; | |
192 | + var resultByCategory = {}; | |
123 | 193 | |
124 | - // scope.$watch('article', function(newValue, oldValue){ | |
125 | - // if(!newValue){ | |
126 | - // return; | |
127 | - // } | |
128 | - // scope.vm.categories = scope.vm.article.categories; | |
129 | - // scope.vm.programs = scope.vm.article.children; | |
130 | - // }); | |
131 | - // } | |
194 | + // divide by categories | |
195 | + for (var i = 0; i < input.length; i++) { | |
196 | + var program = input[i]; | |
197 | + var categorySlug = program.categories[0].slug; | |
198 | + | |
199 | + if(!resultByCategory[categorySlug]){ | |
200 | + resultByCategory[categorySlug] = []; | |
201 | + } | |
202 | + | |
203 | + resultByCategory[categorySlug].push(program); | |
204 | + } | |
205 | + | |
206 | + // shuffle each array | |
207 | + for (var prop in resultByCategory){ | |
208 | + if( resultByCategory.hasOwnProperty( prop ) ) { | |
209 | + var categoryWithPrograms = resultByCategory[prop]; | |
210 | + resultByCategory[prop] = shuffle(categoryWithPrograms); | |
211 | + } | |
212 | + } | |
213 | + | |
214 | + // Concat all into result array | |
215 | + // > while has program at Lists on resultByCategory | |
216 | + var hasProgram = true; | |
217 | + while (hasProgram) { | |
218 | + | |
219 | + var foundProgram = false; | |
220 | + // each categoryList with array of program | |
221 | + for (var prop in resultByCategory){ | |
222 | + | |
223 | + if( resultByCategory.hasOwnProperty( prop ) ) { | |
224 | + var categoryWithPrograms = resultByCategory[prop]; | |
225 | + | |
226 | + if (categoryWithPrograms.length > 0 ) { | |
227 | + var pivotProgram = categoryWithPrograms.pop(); | |
228 | + result.push(pivotProgram); | |
229 | + foundProgram = true; | |
230 | + } | |
231 | + } | |
232 | + } | |
233 | + | |
234 | + if(!foundProgram){ | |
235 | + hasProgram = false; | |
236 | + } | |
237 | + } | |
238 | + | |
239 | + return result; | |
240 | + } | |
132 | 241 | |
133 | 242 | var directive = { |
134 | 243 | restrict: 'E', |
... | ... | @@ -138,75 +247,62 @@ |
138 | 247 | }, |
139 | 248 | controller: ProgramaListController, |
140 | 249 | controllerAs: 'vm', |
141 | - bindToController: true, | |
142 | - // link: ProgramaListLinker | |
250 | + bindToController: true | |
143 | 251 | }; |
144 | 252 | |
145 | - | |
146 | 253 | return directive; |
147 | 254 | } |
148 | 255 | |
149 | - function filterByCategory(){ | |
150 | - return function (input, category){ | |
151 | - input = input || []; | |
256 | + function _filterByCategory (input, category){ | |
257 | + input = input || []; | |
152 | 258 | |
153 | - if(!category){ | |
154 | - // no filter | |
155 | - return input; | |
156 | - } | |
259 | + if(!category){ | |
260 | + // no filter | |
261 | + return input; | |
262 | + } | |
157 | 263 | |
158 | - var out = []; | |
159 | - for (var i = 0; i < input.length; i++) { | |
160 | - var program = input[i]; | |
161 | - if(program.categories[0].slug === category.slug){ | |
162 | - out.push(program); | |
163 | - } | |
264 | + var out = []; | |
265 | + for (var i = 0; i < input.length; i++) { | |
266 | + var program = input[i]; | |
267 | + if(program.categories[0].slug === category.slug){ | |
268 | + out.push(program); | |
164 | 269 | } |
270 | + } | |
165 | 271 | |
166 | - return out; | |
167 | - }; | |
272 | + return out; | |
168 | 273 | } |
169 | 274 | |
170 | - /** @ngInject */ | |
171 | - function filterByCriteria($filter, $log){ | |
172 | - var orderBy = $filter('orderBy'); | |
275 | + function _filterByCriteria (input, criteria, reverse){ | |
276 | + var vm = this; | |
277 | + input = input || []; | |
278 | + criteria = criteria || {}; | |
279 | + reverse = reverse || false; | |
173 | 280 | |
174 | - return function (input, criteria, reverse){ | |
175 | - input = input || []; | |
176 | - criteria = criteria || {}; | |
177 | - reverse = reverse || false; | |
281 | + var out = []; | |
178 | 282 | |
179 | - var out = []; | |
180 | - // for (var i = 0; i < input.length; i++) { | |
181 | - // var program = input[i]; | |
283 | + | |
182 | 284 | |
183 | - // // todo ordering | |
184 | - // out.push(program); | |
185 | - // } | |
285 | + return out; | |
286 | + } | |
186 | 287 | |
187 | - switch(criteria.name){ | |
188 | - case 'title': | |
189 | - out = orderBy(input, 'title', reverse); | |
190 | - break; | |
191 | - case 'category': | |
192 | - out = orderBy(input, 'categories[0].name', reverse); | |
193 | - break; | |
194 | - case 'more_participants': | |
195 | - // break; | |
196 | - default: | |
197 | - $log.info('Criteria not handled yet: ', criteria); | |
288 | + // -> Fisher–Yates shuffle algorithm | |
289 | + function shuffle (array) { | |
290 | + var currentIndex = array.length, temporaryValue, randomIndex ; | |
198 | 291 | |
199 | - if(reverse){ | |
200 | - out = input.slice().reverse(); | |
201 | - }else{ | |
202 | - out = input; | |
203 | - } | |
204 | - break; | |
205 | - } | |
292 | + // While there remain elements to shuffle... | |
293 | + while (0 !== currentIndex) { | |
206 | 294 | |
295 | + // Pick a remaining element... | |
296 | + randomIndex = Math.floor(Math.random() * currentIndex); | |
297 | + currentIndex -= 1; | |
207 | 298 | |
208 | - return out; | |
209 | - }; | |
299 | + // And swap it with the current element. | |
300 | + temporaryValue = array[currentIndex]; | |
301 | + array[currentIndex] = array[randomIndex]; | |
302 | + array[randomIndex] = temporaryValue; | |
303 | + } | |
304 | + | |
305 | + return array; | |
210 | 306 | } |
211 | 307 | |
212 | 308 | ... | ... |
src/app/components/programas/programas.html
... | ... | @@ -46,7 +46,7 @@ |
46 | 46 | |
47 | 47 | <div class="checkbox"> |
48 | 48 | <label> |
49 | - <input type="checkbox" ng-model="orderReverse"> | |
49 | + <input type="checkbox" ng-model="vm.reverse"> | |
50 | 50 | Reverso |
51 | 51 | </label> |
52 | 52 | </div> |
... | ... | @@ -57,7 +57,8 @@ |
57 | 57 | </div> |
58 | 58 | </aside> |
59 | 59 | </div> |
60 | - <div ng-repeat="program in vm.programs | filterByCategory:vm.categoryFilter | filterByCriteria:vm.orderCriteria:orderReverse | filter:vm.query | limitTo:vm.limitTo as results"> | |
60 | + | |
61 | + <div ng-repeat="program in vm.filtredProgramList as results"> | |
61 | 62 | <programa-box program="program" display="'box'" class="col-xs-12 col-sm-6"></programa-box> |
62 | 63 | <div ng-if="$odd" class="clearfix"></div> |
63 | 64 | </div> | ... | ... |
src/app/index.config.js
... | ... | @@ -4,6 +4,7 @@ |
4 | 4 | angular |
5 | 5 | .module('dialoga') |
6 | 6 | .config(configAuthInterceptor) |
7 | + .config(configLocationProvider) | |
7 | 8 | .config(config); |
8 | 9 | |
9 | 10 | /** @ngInject */ |
... | ... | @@ -27,7 +28,13 @@ |
27 | 28 | return $injector.get('AuthInterceptor'); |
28 | 29 | } |
29 | 30 | ]); |
31 | + } | |
30 | 32 | |
33 | + /** @ngInject */ | |
34 | + function configLocationProvider ($locationProvider, Modernizr) { | |
35 | + if (Modernizr.history) { | |
36 | + $locationProvider.html5Mode(true); | |
37 | + } | |
31 | 38 | } |
32 | 39 | |
33 | 40 | /** @ngInject */ | ... | ... |
src/app/index.route.js
src/app/partials/inicio/inicio.scss
src/index.html