Download as
Browse Code »

Commit adbfb276b4c05fadb01d18e990fb9bee7166f55b

Authored by Leonardo Merlin
1 parent e88dfaf9
Exists in master and in 8 other branches css-list, feature-captcha, feature-proposal-vote, feature-respostas, production, rafael, staging, the_glorious_return_of_piwik

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
  Diff comments   View file @adbfb27
... ... @@ -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
  Diff comments   View file @adbfb27
... ... @@ -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
  Diff comments   View file @adbfb27
... ... @@ -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
  Diff comments   View file @adbfb27
... ... @@ -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
  Diff comments   View file @adbfb27
... ... @@ -10,6 +10,7 @@
10 10 $stateProvider
11 11 .state('inicio', {
12 12 url: '/?limite&tema',
  13 + reloadOnSearch: false,
13 14 views: {
14 15 'header': { templateUrl: 'app/partials/header/header.html' },
15 16 'main': {
... ...
src/app/partials/inicio/inicio.scss
  Diff comments   View file @adbfb27
1 1 .section-gray {
2 2 background-color: $gray;
  3 +
  4 + .contraste & {
  5 + color: #fff;
  6 + background-color: #000;
  7 + }
3 8 }
4 9  
5 10 .video-wrapper {
... ...
src/index.html
  Diff comments   View file @adbfb27
... ... @@ -5,6 +5,7 @@
5 5 <meta charset="utf-8">
6 6 <title>Dialoga Brasil</title>
7 7 <meta name="description" content="">
  8 + <base href="/">
8 9 <meta name="viewport" content="width=device-width">
9 10 <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
10 11  
... ...