Download as
Browse Code »

Commit e49eeeba9a4c15ebaee533a96d9808d5fba510c0

Authored by Leonardo Merlin
1 parent 3a6dd5ca
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

Add filter and search into programas page

Showing 5 changed files with 208 additions and 16 deletions   Show diff stats
src/app/components/dialoga-service/dialoga.service.js
  Diff comments   View file @e49eeeb
@@ -16,6 +16,7 @@ @@ -16,6 +16,7 @@
16 extendedService.getAbout = getAbout; 16 extendedService.getAbout = getAbout;
17 extendedService.getTerms = getTerms; 17 extendedService.getTerms = getTerms;
18 extendedService.getThemes = getThemes; 18 extendedService.getThemes = getThemes;
  19 + extendedService.getThemeBySlug = getThemeBySlug;
19 extendedService.getPrograms = getPrograms; 20 extendedService.getPrograms = getPrograms;
20 extendedService.getProgramBySlug = getProgramBySlug; 21 extendedService.getProgramBySlug = getProgramBySlug;
21 extendedService.getProgramsRandom = getProgramsRandom; 22 extendedService.getProgramsRandom = getProgramsRandom;
@@ -88,6 +89,28 @@ @@ -88,6 +89,28 @@
88 },cbError); 89 },cbError);
89 } 90 }
90 } 91 }
  92 + function getThemeBySlug (slug, cbSuccess, cbError) {
  93 + if( !!CACHE.themes ){
  94 + _getThemeBySlug(CACHE.themes);
  95 + }else{
  96 + getThemes(_getThemeBySlug, cbError);
  97 + }
  98 +
  99 + function _getThemeBySlug () {
  100 + var result = null;
  101 +
  102 + for (var i = CACHE.themes.length - 1; i >= 0; i--) {
  103 + var theme = CACHE.themes[i];
  104 +
  105 + if(theme && theme.slug && theme.slug === slug){
  106 + result = theme;
  107 + break;
  108 + }
  109 + }
  110 +
  111 + cbSuccess(result);
  112 + }
  113 + }
91 114
92 function getPrograms (cbSuccess, cbError) { 115 function getPrograms (cbSuccess, cbError) {
93 if( !!CACHE.programs ){ 116 if( !!CACHE.programs ){
src/app/index.route.js
  Diff comments   View file @e49eeeb
@@ -9,7 +9,7 @@ @@ -9,7 +9,7 @@
9 function routeConfig($stateProvider, $urlRouterProvider) { 9 function routeConfig($stateProvider, $urlRouterProvider) {
10 $stateProvider 10 $stateProvider
11 .state('inicio', { 11 .state('inicio', {
12 - url: '/?limite&tema', 12 + url: '/?tema&query',
13 ncyBreadcrumb: {label: 'Home'}, 13 ncyBreadcrumb: {label: 'Home'},
14 reloadOnSearch: false, 14 reloadOnSearch: false,
15 views: { 15 views: {
src/app/pages/inicio/inicio.controller.js
  Diff comments   View file @e49eeeb
@@ -37,18 +37,14 @@ @@ -37,18 +37,14 @@
37 37
38 vm.loadData(); 38 vm.loadData();
39 vm.attachListeners(); 39 vm.attachListeners();
40 - vm.filter();  
41 }; 40 };
42 41
43 InicioPageController.prototype.loadData = function() { 42 InicioPageController.prototype.loadData = function() {
44 var vm = this; 43 var vm = this;
45 44
46 - vm.loading = true;  
47 - vm.loadingEvents = true;  
48 - vm.loadingThemes = true;  
49 - vm.loadingPrograms = true;  
50 45
51 // Load main content 46 // Load main content
  47 + vm.loading = true;
52 vm.DialogaService.getHome(function(data) { 48 vm.DialogaService.getHome(function(data) {
53 vm.article = data.article; 49 vm.article = data.article;
54 50
@@ -64,6 +60,7 @@ @@ -64,6 +60,7 @@
64 }); 60 });
65 61
66 // Load event list 62 // Load event list
  63 + vm.loadingEvents = true;
67 vm.DialogaService.getEvents({}, function(events) { 64 vm.DialogaService.getEvents({}, function(events) {
68 vm.events = events; 65 vm.events = events;
69 vm.loadingEvents = false; 66 vm.loadingEvents = false;
@@ -76,6 +73,7 @@ @@ -76,6 +73,7 @@
76 function _loadAfterHome () { 73 function _loadAfterHome () {
77 74
78 // Load theme list 75 // Load theme list
  76 + vm.loadingThemes = true;
79 vm.DialogaService.getThemes(function(data) { 77 vm.DialogaService.getThemes(function(data) {
80 vm.themes = data; 78 vm.themes = data;
81 vm.loadingThemes = false; 79 vm.loadingThemes = false;
@@ -84,6 +82,7 @@ @@ -84,6 +82,7 @@
84 }); 82 });
85 83
86 // Load program list 84 // Load program list
  85 + vm.loadingPrograms = true;
87 vm.DialogaService.getProgramsRandom({}, function(data) { 86 vm.DialogaService.getProgramsRandom({}, function(data) {
88 vm.programs = vm.article.children; 87 vm.programs = vm.article.children;
89 vm.filtredPrograms = data.articles; 88 vm.filtredPrograms = data.articles;
@@ -91,6 +90,8 @@ @@ -91,6 +90,8 @@
91 }, function(error) { 90 }, function(error) {
92 vm.$log.error('Error on getPrograms.', error); 91 vm.$log.error('Error on getPrograms.', error);
93 }); 92 });
  93 +
  94 + vm.filter();
94 } 95 }
95 96
96 }; 97 };
@@ -138,10 +139,14 @@ @@ -138,10 +139,14 @@
138 139
139 if (vm.search && vm.search.tema) { 140 if (vm.search && vm.search.tema) {
140 var slug = vm.search.tema; 141 var slug = vm.search.tema;
141 - vm.ArticleService.getCategoryBySlug(slug, function(category){  
142 - vm.selectedTheme = category; 142 + vm.$log.debug('filter by theme', slug);
  143 +
  144 + vm.DialogaService.getThemeBySlug(slug, function(theme){
  145 + vm.selectedTheme = theme;
  146 + vm.$log.debug('getThemeBySlug.slug', slug);
  147 + vm.$log.debug('getThemeBySlug.selectedTheme', theme);
143 }, function(error){ 148 }, function(error){
144 - vm.$log.error('Error when try to "getCategoryBySlug"', error); 149 + vm.$log.error('Error when try to "getThemeBySlug"', error);
145 }); 150 });
146 } 151 }
147 }; 152 };
src/app/pages/programas/programas.controller.js
  Diff comments   View file @e49eeeb
@@ -6,39 +6,42 @@ @@ -6,39 +6,42 @@
6 .controller('ProgramasPageController', ProgramasPageController); 6 .controller('ProgramasPageController', ProgramasPageController);
7 7
8 /** @ngInject */ 8 /** @ngInject */
9 - function ProgramasPageController(DialogaService, $log) { 9 + function ProgramasPageController(DialogaService, $scope, $location, $filter, $log) {
10 var vm = this; 10 var vm = this;
11 11
12 vm.DialogaService = DialogaService; 12 vm.DialogaService = DialogaService;
  13 + vm.$scope = $scope;
  14 + vm.$location = $location;
  15 + vm.$filter = $filter;
13 vm.$log = $log; 16 vm.$log = $log;
14 17
15 vm.init(); 18 vm.init();
  19 + vm.loadData();
  20 + vm.attachListeners();
  21 +
16 $log.debug('ProgramasPageController'); 22 $log.debug('ProgramasPageController');
17 } 23 }
18 24
19 ProgramasPageController.prototype.init = function () { 25 ProgramasPageController.prototype.init = function () {
20 var vm = this; 26 var vm = this;
21 27
22 - vm.article = null;  
23 vm.themes = null; 28 vm.themes = null;
24 vm.selectedTheme = null; 29 vm.selectedTheme = null;
25 vm.programs = null; 30 vm.programs = null;
26 vm.filtredPrograms = null; 31 vm.filtredPrograms = null;
27 vm.query = null; 32 vm.query = null;
  33 + vm.search = vm.$location.search();
28 34
29 vm.loading = null; 35 vm.loading = null;
30 vm.error = null; 36 vm.error = null;
31 -  
32 - vm.loadData();  
33 }; 37 };
34 38
35 -  
36 ProgramasPageController.prototype.loadData = function () { 39 ProgramasPageController.prototype.loadData = function () {
37 var vm = this; 40 var vm = this;
38 41
39 vm.loading = true; 42 vm.loading = true;
40 43
41 - // load Programs 44 + // // load Programs
42 vm.loadingPrograms = true; 45 vm.loadingPrograms = true;
43 vm.DialogaService.getPrograms(function(programs){ 46 vm.DialogaService.getPrograms(function(programs){
44 vm.programs = programs; 47 vm.programs = programs;
@@ -61,4 +64,165 @@ @@ -61,4 +64,165 @@
61 vm.loadingThemes = false; 64 vm.loadingThemes = false;
62 }); 65 });
63 }; 66 };
  67 +
  68 + ProgramasPageController.prototype.attachListeners = function() {
  69 + var vm = this;
  70 +
  71 + vm.$scope.$on('change-selectedCategory', function (event, selectedCategory) {
  72 + vm.selectedTheme = selectedCategory;
  73 + vm.$log.debug('vm.selectedTheme', vm.selectedTheme);
  74 + });
  75 +
  76 + vm.$scope.$watch('pageProgramas.selectedTheme', function(newValue/*, oldValue*/) {
  77 + vm.search.tema = newValue ? newValue.slug : null;
  78 + vm.$location.search('tema', vm.search.tema);
  79 + vm.filtredPrograms = vm.getFiltredPrograms();
  80 + });
  81 +
  82 + vm.$scope.$watch('pageProgramas.query', function(newValue/*, oldValue*/) {
  83 + vm.search.filtro = newValue ? newValue : null;
  84 + vm.$location.search('filtro', vm.search.filtro);
  85 + vm.filtredPrograms = vm.getFiltredPrograms();
  86 + });
  87 + };
  88 +
  89 + ProgramasPageController.prototype.filter = function() {
  90 + var vm = this;
  91 +
  92 + if (vm.search && vm.search.tema) {
  93 + var slug = vm.search.tema;
  94 + vm.$log.debug('filter by theme', slug);
  95 +
  96 + vm.DialogaService.getThemeBySlug(slug, function(theme){
  97 + vm.selectedTheme = theme;
  98 + vm.$log.debug('getThemeBySlug.slug', slug);
  99 + vm.$log.debug('getThemeBySlug.selectedTheme', theme);
  100 + }, function(error){
  101 + vm.$log.error('Error when try to "getThemeBySlug"', error);
  102 + });
  103 + }
  104 + };
  105 +
  106 + ProgramasPageController.prototype.showAllPrograms = function($event) {
  107 + var vm = this;
  108 + $event.stopPropagation();
  109 +
  110 + vm.resetFilterValues();
  111 +
  112 + vm._showAllFlag = true;
  113 +
  114 + vm.filtredPrograms = vm.getFiltredPrograms();
  115 + };
  116 +
  117 + ProgramasPageController.prototype.resetFilterValues = function() {
  118 + var vm = this;
  119 +
  120 + vm.query = null;
  121 + vm.selectedTheme = null;
  122 + };
  123 +
  124 + ProgramasPageController.prototype.getFiltredPrograms = function() {
  125 + var vm = this;
  126 +
  127 + if(!vm.programs){
  128 + vm.$log.warn('No programs loaded yet. Abort.');
  129 + return null;
  130 + }
  131 +
  132 + var input = vm.programs;
  133 + var output = input;
  134 + var query = vm.query;
  135 + var selectedTheme = vm.selectedTheme;
  136 +
  137 + var filter = vm.$filter('filter');
  138 +
  139 + if (selectedTheme) {
  140 + output = _filterByCategory(output, selectedTheme);
  141 + }
  142 +
  143 + if (query) {
  144 + output = filter(output, query, false);
  145 + }
  146 +
  147 + if(!query && !selectedTheme && vm._showAllFlag){
  148 + output = _balanceByCategory(output);
  149 + }
  150 +
  151 + return output;
  152 + };
  153 +
  154 + function _filterByCategory (input, category) {
  155 + input = input || [];
  156 +
  157 + if (!category) {
  158 + // no filter
  159 + return input;
  160 + }
  161 +
  162 + var out = [];
  163 + for (var i = 0; i < input.length; i++) {
  164 + var program = input[i];
  165 + if (program.categories[0].slug === category.slug) {
  166 + out.push(program);
  167 + }
  168 + }
  169 +
  170 + return out;
  171 + }
  172 +
  173 + function _balanceByCategory (input) {
  174 + var result = [];
  175 + var resultByCategory = {};
  176 +
  177 + // divide by categories
  178 + for (var i = 0; i < input.length; i++) {
  179 + var program = input[i];
  180 + var categorySlug = program.categories[0].slug;
  181 +
  182 + if (!resultByCategory[categorySlug]) {
  183 + resultByCategory[categorySlug] = [];
  184 + }
  185 +
  186 + resultByCategory[categorySlug].push(program);
  187 + }
  188 +
  189 + // shuffle each array
  190 + var prop = null;
  191 + var categoryWithPrograms = null;
  192 + // for (prop in resultByCategory) {
  193 + // if (resultByCategory.hasOwnProperty(prop)) {
  194 + // categoryWithPrograms = resultByCategory[prop];
  195 + // resultByCategory[prop] = shuffle(categoryWithPrograms);
  196 + // }
  197 + // }
  198 +
  199 + // Concat all into result array
  200 + // > while has program at Lists on resultByCategory
  201 + var hasProgram = true;
  202 + while (hasProgram) {
  203 +
  204 + var foundProgram = false;
  205 + // each categoryList with array of program
  206 + prop = null;
  207 + categoryWithPrograms = null;
  208 + for (prop in resultByCategory) {
  209 +
  210 + if (resultByCategory.hasOwnProperty(prop)) {
  211 + categoryWithPrograms = resultByCategory[prop];
  212 +
  213 + if (categoryWithPrograms.length > 0) {
  214 + var pivotProgram = categoryWithPrograms.pop();
  215 + result.push(pivotProgram);
  216 + foundProgram = true;
  217 + }
  218 + }
  219 + }
  220 +
  221 + if (!foundProgram) {
  222 + hasProgram = false;
  223 + }
  224 + }
  225 +
  226 + return result;
  227 + }
64 })(); 228 })();
src/app/pages/programas/programas.html
  Diff comments   View file @e49eeeb
@@ -72,7 +72,7 @@ @@ -72,7 +72,7 @@
72 <div class="col-sm-12"> 72 <div class="col-sm-12">
73 <header class="header"> 73 <header class="header">
74 <h2>Conheça os programas</h2> 74 <h2>Conheça os programas</h2>
75 - <button type="button" class="btn btn-link" ng-click="pageProgramas.showAll($event)"> 75 + <button type="button" class="btn btn-link" ng-click="pageProgramas.showAllPrograms($event)">
76 <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> Ver todos os {{::pageProgramas.programs.length}} programas 76 <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> Ver todos os {{::pageProgramas.programs.length}} programas
77 </button> 77 </button>
78 </header> 78 </header>