Commit c0c46b5eccbebbc718bad687d6a8b341d51961c1

Authored by Leonardo Merlin
1 parent ef3b9ec3

Refact: paginator is more generic now

src/app/components/app-paginator/app-paginator.directive.js
@@ -19,31 +19,36 @@ @@ -19,31 +19,36 @@
19 $log.debug('AppPaginatorController'); 19 $log.debug('AppPaginatorController');
20 } 20 }
21 21
22 - AppPaginatorController.prototype.init = function () { 22 + AppPaginatorController.prototype.init = function() {
23 var vm = this; 23 var vm = this;
24 24
25 vm.page = vm.page || 1; 25 vm.page = vm.page || 1;
26 vm.perPage = vm.perPage || 20; 26 vm.perPage = vm.perPage || 20;
27 vm.total = vm.total || 0; 27 vm.total = vm.total || 0;
  28 +
  29 + if ((vm.total % vm.perPage) === 0) {
  30 + vm.pages = vm.total / vm.perPage;
  31 + } else {
  32 + vm.pages = (vm.total / vm.perPage) + 1;
  33 + }
  34 +
  35 + vm.arraypages = new Array(Math.floor(vm.pages));
28 }; 36 };
29 37
30 - AppPaginatorController.prototype.showPage = function (pageIndex) { 38 + AppPaginatorController.prototype.showPage = function(pageIndex) {
31 var vm = this; 39 var vm = this;
32 40
33 - if (pageIndex < 0) {  
34 - pageIndex = 0; 41 + if (pageIndex < 1) {
  42 + pageIndex = 1;
35 } 43 }
36 44
37 - if (pageIndex > (vm.arraypages.length-1)) {  
38 - pageIndex = vm.arraypages.length-1; 45 + if (pageIndex > vm.pages) {
  46 + pageIndex = vm.pages;
39 } 47 }
40 48
41 - if(vm.changePage){  
42 - vm.changePage({pageIndex: (pageIndex + 1 )});  
43 - }else{  
44 - vm.proposalsPerPage = vm.getProposalsPerPage(pageIndex); 49 + if (vm.changePage) {
  50 + vm.changePage({pageIndex: pageIndex});
45 } 51 }
46 - vm.currentPageIndex = pageIndex;  
47 }; 52 };
48 53
49 var directive = { 54 var directive = {
@@ -60,7 +65,6 @@ @@ -60,7 +65,6 @@
60 bindToController: true 65 bindToController: true
61 }; 66 };
62 67
63 -  
64 return directive; 68 return directive;
65 } 69 }
66 70
src/app/components/app-paginator/app-paginator.html
1 -<nav ng-if="vm.arraypages.length > 1"> 1 +<nav class="app-paginator" ng-if="vm.arraypages.length > 1">
2 <ul class="pagination"> 2 <ul class="pagination">
3 - <li ng-style="{'visibility': (vm.currentPageIndex === 0) ? 'hidden' : 'visible'}">  
4 - <a class="btn-pagination" href="#" aria-label="Previous" ng-click="vm.showPage(vm.currentPageIndex-1)"> 3 + <li ng-style="{'visibility': (vm.page === 1) ? 'hidden' : 'visible'}">
  4 + <a class="btn-pagination" href="#" aria-label="Previous" ng-click="vm.showPage(vm.page-1)">
5 <span aria-hidden="true" class="glyphicon glyphicon-chevron-left pagination-icon"></span> 5 <span aria-hidden="true" class="glyphicon glyphicon-chevron-left pagination-icon"></span>
6 </a> 6 </a>
7 </li> 7 </li>
8 - <li ng-repeat="paginas in vm.arraypages track by $index" ng-class="{ 'active' : ($index) == vm.currentPageIndex }" >  
9 - <a class="btn-pagination" href="#" ng-click="vm.showPage($index)">{{::($index)+1}}</a> 8 + <li ng-repeat="paginas in vm.arraypages track by $index" ng-class="{ 'active' : ($index) === (vm.page - 1) }" >
  9 + <a class="btn-pagination" href="#" ng-click="vm.showPage($index + 1)">{{::($index)+1}}</a>
10 </li> 10 </li>
11 - <li ng-style="{'visibility': (vm.currentPageIndex === (vm.arraypages.length -1)) ? 'hidden' : 'visible'}">  
12 - <a class="btn-pagination" href="#" aria-label="Next" ng-click="vm.showPage(vm.currentPageIndex+1)"> 11 + <li ng-style="{'visibility': (vm.page === vm.arraypages.length) ? 'hidden' : 'visible'}">
  12 + <a class="btn-pagination" href="#" aria-label="Next" ng-click="vm.showPage(vm.page+1)">
13 <span aria-hidden="true" class="glyphicon glyphicon-chevron-right pagination-icon"></span> 13 <span aria-hidden="true" class="glyphicon glyphicon-chevron-right pagination-icon"></span>
14 </a> 14 </a>
15 </li> 15 </li>
src/app/components/app-paginator/app-paginator.scss 0 → 100644
@@ -0,0 +1,40 @@ @@ -0,0 +1,40 @@
  1 +.app-paginator {
  2 + text-align: center;
  3 +
  4 + .btn-pagination {
  5 + background-color: transparent;
  6 + border: none;
  7 + border-radius: 100%;
  8 + font-weight: bold;
  9 + font-size: 20px;
  10 + padding: 0px 8px;
  11 + width: 28px;
  12 + height: 28px;
  13 + text-decoration: underline;
  14 + color: $defaultblue;
  15 + }
  16 +
  17 + .pagination-icon {
  18 + color: $defaultblue;
  19 + }
  20 +
  21 + .pagination > .active > a,
  22 + .pagination > .active > a:hover,
  23 + .pagination > .active > a:focus,
  24 + .pagination > .active > span,
  25 + .pagination > .active > span:hover,
  26 + .pagination > .active > span:focus {
  27 + background-color: $defaultblue;
  28 + text-decoration: none;
  29 +
  30 + }
  31 +
  32 + .pagination > .disabled > span,
  33 + .pagination > .disabled > span:hover,
  34 + .pagination > .disabled > span:focus,
  35 + .pagination > .disabled > a,
  36 + .pagination > .disabled > a:hover,
  37 + .pagination > .disabled > a:focus {
  38 + background-color: transparent;
  39 + }
  40 +}
src/app/components/article-service/article.service.js
@@ -96,16 +96,6 @@ @@ -96,16 +96,6 @@
96 } 96 }
97 97
98 function getProposals (params, cbSuccess, cbError) { 98 function getProposals (params, cbSuccess, cbError) {
99 - // Ex.: /api/v1/articles/103358?fields=  
100 -  
101 - // var url = service.apiArticles + API.articleId.home;  
102 -  
103 - // UtilService.get(url, {params: paramsExtended}).then(function(data){  
104 - // cbSuccess(data);  
105 - // }).catch(function(error){  
106 - // cbError(error);  
107 - // });  
108 -  
109 var paramsExtended = angular.extend({ 99 var paramsExtended = angular.extend({
110 query: '' 100 query: ''
111 }, params); 101 }, params);
@@ -253,8 +243,9 @@ @@ -253,8 +243,9 @@
253 // Ex.: /api/v1/search/article?type=ProposalsDiscussionPlugin::Proposal&query=cisternas 243 // Ex.: /api/v1/search/article?type=ProposalsDiscussionPlugin::Proposal&query=cisternas
254 var url = '/api/v1/search/article'; 244 var url = '/api/v1/search/article';
255 var paramsExtended = angular.extend({ 245 var paramsExtended = angular.extend({
256 - // 'fields[]': ['id', 'title', 'slug', 'abstract', 'categories', 'setting', 'children_count', 'hits'],  
257 - 'type': 'ProposalsDiscussionPlugin::Proposal' 246 + page: 1,
  247 + per_page: 20,
  248 + type: 'ProposalsDiscussionPlugin::Proposal'
258 }, params); 249 }, params);
259 250
260 UtilService.get(url, {params: paramsExtended}).then(function(data){ 251 UtilService.get(url, {params: paramsExtended}).then(function(data){
src/app/components/proposal-list/proposal-list.directive.js
@@ -9,20 +9,16 @@ @@ -9,20 +9,16 @@
9 function proposalList() { 9 function proposalList() {
10 10
11 /** @ngInject */ 11 /** @ngInject */
12 - function ProposalListController(ArticleService, $state, $scope, $element, $timeout, $log) { 12 + function ProposalListController($state, $element, $timeout, $log) {
13 $log.debug('ProposalListController'); 13 $log.debug('ProposalListController');
14 14
15 var vm = this; 15 var vm = this;
16 - vm.ArticleService = ArticleService;  
17 vm.$state = $state; 16 vm.$state = $state;
18 - vm.$scope = $scope;  
19 vm.$element = $element; 17 vm.$element = $element;
20 vm.$timeout = $timeout; 18 vm.$timeout = $timeout;
21 vm.$log = $log; 19 vm.$log = $log;
22 20
23 vm.init(); 21 vm.init();
24 - vm.loadData();  
25 - vm.attachListeners();  
26 } 22 }
27 23
28 ProposalListController.prototype.init = function () { 24 ProposalListController.prototype.init = function () {
@@ -33,76 +29,11 @@ @@ -33,76 +29,11 @@
33 throw { name: 'NotDefined', message: 'The attribute "proposals" is undefined.'}; 29 throw { name: 'NotDefined', message: 'The attribute "proposals" is undefined.'};
34 } 30 }
35 31
36 - if(!vm.perPage){  
37 - vm.perPage = 5;  
38 - }  
39 -  
40 - vm.initPorposalList();  
41 - };  
42 -  
43 - ProposalListController.prototype.initPorposalList = function () {  
44 - var vm = this;  
45 -  
46 - vm.currentPageIndex = 0;  
47 - vm.proposalsPerPage = vm.getProposalsPerPage(0);  
48 - vm.proposalsLength = vm.total || vm.proposals.length;  
49 -  
50 - if ((vm.proposalsLength % vm.perPage) === 0) {  
51 - vm.pages = vm.proposalsLength / vm.perPage;  
52 - } else{  
53 - vm.pages = (vm.proposalsLength / vm.perPage) + 1;  
54 - }  
55 -  
56 - // vm.arraypages = new Array(Math.ceil(vm.pages));  
57 - vm.arraypages = new Array(Math.floor(vm.pages));  
58 - };  
59 -  
60 - ProposalListController.prototype.loadData = function () {  
61 - // async values  
62 - var vm = this;  
63 -  
64 - // requeue to wait until DOM be created  
65 vm.$timeout(function(){ 32 vm.$timeout(function(){
66 attachPopover.call(vm); 33 attachPopover.call(vm);
67 }, 1000); 34 }, 1000);
68 }; 35 };
69 36
70 - ProposalListController.prototype.attachListeners = function () {  
71 - var vm = this;  
72 -  
73 - vm.$scope.$watch('vm.proposals', function(/*newValue, oldValue*/) {  
74 - vm.initPorposalList();  
75 - });  
76 - };  
77 -  
78 - ProposalListController.prototype.getProposalsPerPage = function (pageIndex) {  
79 - var vm = this;  
80 -  
81 - var initialIndex = pageIndex * vm.perPage;  
82 - var finalIndex = initialIndex + vm.perPage;  
83 -  
84 - return vm.proposals.slice(initialIndex, finalIndex);  
85 - };  
86 -  
87 - ProposalListController.prototype.showPage = function (pageIndex) {  
88 - var vm = this;  
89 -  
90 - if (pageIndex < 0) {  
91 - pageIndex = 0;  
92 - }  
93 -  
94 - if (pageIndex > (vm.arraypages.length-1)) {  
95 - pageIndex = vm.arraypages.length-1;  
96 - }  
97 -  
98 - if(vm.changePage){  
99 - vm.changePage({pageIndex: (pageIndex + 1 )});  
100 - }else{  
101 - vm.proposalsPerPage = vm.getProposalsPerPage(pageIndex);  
102 - }  
103 - vm.currentPageIndex = pageIndex;  
104 - };  
105 -  
106 ProposalListController.prototype.showContent = function (proposal) { 37 ProposalListController.prototype.showContent = function (proposal) {
107 var vm = this; 38 var vm = this;
108 39
@@ -132,11 +63,7 @@ @@ -132,11 +63,7 @@
132 restrict: 'E', 63 restrict: 'E',
133 templateUrl: 'app/components/proposal-list/proposal-list.html', 64 templateUrl: 'app/components/proposal-list/proposal-list.html',
134 scope: { 65 scope: {
135 - proposals: '=',  
136 - page: '=',  
137 - perPage: '=',  
138 - total: '=',  
139 - changePage: '&' 66 + proposals: '='
140 }, 67 },
141 controller: ProposalListController, 68 controller: ProposalListController,
142 controllerAs: 'vm', 69 controllerAs: 'vm',
src/app/components/proposal-list/proposal-list.html
1 <div class="proposal-list"> 1 <div class="proposal-list">
2 - <div class="" ng-if="vm.loading">  
3 - <div class="">Carregando...</div>  
4 - </div>  
5 - <div class="" ng-if="!vm.loading && vm.proposalsPerPage"> 2 + <div class="" ng-if="vm.proposals">
6 <table class="table table-striped"> 3 <table class="table table-striped">
7 <thead> 4 <thead>
8 <tr> 5 <tr>
@@ -14,7 +11,7 @@ @@ -14,7 +11,7 @@
14 </tr> 11 </tr>
15 </thead> 12 </thead>
16 <tbody> 13 <tbody>
17 - <tr ng-repeat="proposal in vm.proposalsPerPage"> 14 + <tr ng-repeat="proposal in vm.proposals">
18 <td class="color-theme-fg"> 15 <td class="color-theme-fg">
19 <span class="position">{{::proposal.ranking_position}}º</span> 16 <span class="position">{{::proposal.ranking_position}}º</span>
20 </td> 17 </td>
@@ -38,22 +35,5 @@ @@ -38,22 +35,5 @@
38 </tr> 35 </tr>
39 </tbody> 36 </tbody>
40 </table> 37 </table>
41 - <nav ng-if="vm.arraypages.length > 1">  
42 - <ul class="pagination">  
43 - <li ng-style="{'visibility': (vm.currentPageIndex === 0) ? 'hidden' : 'visible'}">  
44 - <a class="btn-pagination" href="#" aria-label="Previous" ng-click="vm.showPage(vm.currentPageIndex-1)">  
45 - <span aria-hidden="true" class="glyphicon glyphicon-chevron-left pagination-icon"></span>  
46 - </a>  
47 - </li>  
48 - <li ng-repeat="paginas in vm.arraypages track by $index" ng-class="{ 'active' : ($index) == vm.currentPageIndex }" >  
49 - <a class="btn-pagination" href="#" ng-click="vm.showPage($index)">{{::($index)+1}}</a>  
50 - </li>  
51 - <li ng-style="{'visibility': (vm.currentPageIndex === (vm.arraypages.length -1)) ? 'hidden' : 'visible'}">  
52 - <a class="btn-pagination" href="#" aria-label="Next" ng-click="vm.showPage(vm.currentPageIndex+1)">  
53 - <span aria-hidden="true" class="glyphicon glyphicon-chevron-right pagination-icon"></span>  
54 - </a>  
55 - </li>  
56 - </ul>  
57 - </nav>  
58 </div> 38 </div>
59 </div> 39 </div>
src/app/components/proposal-list/proposal-list.scss
@@ -80,45 +80,4 @@ @@ -80,45 +80,4 @@
80 } 80 }
81 } 81 }
82 82
83 - .btn-pagination {  
84 - background-color: transparent;  
85 - border: none;  
86 - border-radius: 100%;  
87 - font-weight: bold;  
88 - font-size: 20px;  
89 - padding: 0px 8px;  
90 - width: 28px;  
91 - height: 28px;  
92 - text-decoration: underline;  
93 - color: $defaultblue;  
94 - }  
95 -  
96 - .pagination-icon {  
97 - color: $defaultblue;  
98 - }  
99 -  
100 - .pagination > .active > a,  
101 - .pagination > .active > a:hover,  
102 - .pagination > .active > a:focus,  
103 - .pagination > .active > span,  
104 - .pagination > .active > span:hover,  
105 - .pagination > .active > span:focus {  
106 - background-color: $defaultblue;  
107 - text-decoration: none;  
108 -  
109 - }  
110 -  
111 - .pagination > .disabled > span,  
112 - .pagination > .disabled > span:hover,  
113 - .pagination > .disabled > span:focus,  
114 - .pagination > .disabled > a,  
115 - .pagination > .disabled > a:hover,  
116 - .pagination > .disabled > a:focus {  
117 - background-color: transparent;  
118 - }  
119 -  
120 - nav {  
121 - text-align: center;  
122 - }  
123 -  
124 } 83 }
src/app/components/social-share/social-share.html
@@ -3,11 +3,12 @@ @@ -3,11 +3,12 @@
3 </div> 3 </div>
4 <ul class="social-share list-inline"> 4 <ul class="social-share list-inline">
5 <li> 5 <li>
  6 + <!-- socialshare-via="687948707977695" -->
6 <a href="#" role="button" 7 <a href="#" role="button"
7 socialshare 8 socialshare
8 socialshare-provider="facebook" 9 socialshare-provider="facebook"
9 socialshare-type="feed" 10 socialshare-type="feed"
10 - socialshare-via="687948707977695" 11 + socialshare-via="476168325877872"
11 socialshare-url="http://dialoga.gov.br" 12 socialshare-url="http://dialoga.gov.br"
12 socialshare-redirect-uri="https://dialoga.gov.br/" 13 socialshare-redirect-uri="https://dialoga.gov.br/"
13 socialshare-media="http://dialoga.gov.br/images/logo.png" 14 socialshare-media="http://dialoga.gov.br/images/logo.png"
src/app/pages/ranking/ranking.controller.js
@@ -26,7 +26,7 @@ @@ -26,7 +26,7 @@
26 var vm = this; 26 var vm = this;
27 27
28 vm.page = 1; 28 vm.page = 1;
29 - vm.per_page = 3; 29 + vm.per_page = 20;
30 vm.themes = null; 30 vm.themes = null;
31 vm.selectedTheme = null; 31 vm.selectedTheme = null;
32 vm.filtredPrograms = null; 32 vm.filtredPrograms = null;
@@ -135,7 +135,10 @@ @@ -135,7 +135,10 @@
135 135
136 // load Proposals 136 // load Proposals
137 vm.loadingProposals = true; 137 vm.loadingProposals = true;
138 - vm.DialogaService.getProposals({}, function(data){ 138 + vm.DialogaService.getProposals({
  139 + page: vm.page,
  140 + per_page: vm.per_page
  141 + }, function(data){
139 vm.proposals = data.articles; 142 vm.proposals = data.articles;
140 vm.filtredProposals = vm.proposals; 143 vm.filtredProposals = vm.proposals;
141 vm.loadingProposals = false; 144 vm.loadingProposals = false;
@@ -155,7 +158,7 @@ @@ -155,7 +158,7 @@
155 vm.selectedTheme = selectedCategory; 158 vm.selectedTheme = selectedCategory;
156 }); 159 });
157 160
158 - vm.$scope.$watch('pageRanking.selectedTheme', function(newValue, oldValue) { 161 + vm.$scope.$watch('pageRanking.selectedTheme', function(newValue/*, oldValue*/) {
159 vm.search.tema = newValue ? newValue.slug : null; 162 vm.search.tema = newValue ? newValue.slug : null;
160 vm.$location.search('tema', vm.search.tema); 163 vm.$location.search('tema', vm.search.tema);
161 164
@@ -170,7 +173,7 @@ @@ -170,7 +173,7 @@
170 vm.selectedProgram = selectedTopic; 173 vm.selectedProgram = selectedTopic;
171 }); 174 });
172 175
173 - vm.$scope.$watch('pageRanking.selectedProgram', function(newValue, oldValue) { 176 + vm.$scope.$watch('pageRanking.selectedProgram', function(newValue/*, oldValue*/) {
174 vm.search.programa = newValue ? newValue.slug : null; 177 vm.search.programa = newValue ? newValue.slug : null;
175 vm.$location.search('programa', vm.search.programa); 178 vm.$location.search('programa', vm.search.programa);
176 vm.filterProposals(); 179 vm.filterProposals();
@@ -193,6 +196,7 @@ @@ -193,6 +196,7 @@
193 RankingPageController.prototype.changePage = function(pageIndex) { 196 RankingPageController.prototype.changePage = function(pageIndex) {
194 var vm = this; 197 var vm = this;
195 198
  199 + vm.page = pageIndex;
196 vm.filterProposals(pageIndex); 200 vm.filterProposals(pageIndex);
197 }; 201 };
198 202
@@ -206,14 +210,9 @@ @@ -206,14 +210,9 @@
206 210
207 var page = _page || vm.page; 211 var page = _page || vm.page;
208 var per_page = _per_page || vm.per_page; 212 var per_page = _per_page || vm.per_page;
209 - var input = vm.proposals;  
210 - var output = input;  
211 var query = vm.query; 213 var query = vm.query;
212 - var selectedTheme = vm.selectedTheme;  
213 var selectedProgram = vm.selectedProgram; 214 var selectedProgram = vm.selectedProgram;
214 215
215 - var filter = vm.$filter('filter');  
216 -  
217 if (selectedProgram) { 216 if (selectedProgram) {
218 var params = { 217 var params = {
219 page: page, 218 page: page,
@@ -225,7 +224,7 @@ @@ -225,7 +224,7 @@
225 224
226 vm.loadingProposals = true; 225 vm.loadingProposals = true;
227 vm.DialogaService.searchProposals(params, function(data){ 226 vm.DialogaService.searchProposals(params, function(data){
228 - vm.total_proposals = data._obj.headers('total'); 227 + vm.total_proposals = parseInt(data._obj.headers('total'));
229 vm.filtredProposals = data.articles; 228 vm.filtredProposals = data.articles;
230 vm.loadingProposals = false; 229 vm.loadingProposals = false;
231 }, function (error) { 230 }, function (error) {
src/app/pages/ranking/ranking.html
@@ -47,8 +47,14 @@ @@ -47,8 +47,14 @@
47 </div> 47 </div>
48 48
49 <div class="row"> 49 <div class="row">
50 - <div class="col-sm-12" ng-if="pageRanking.proposals">  
51 - <proposal-list proposals="pageRanking.filtredProposals" per-page="pageRanking.per_page" total="pageRanking.total_proposals" change-page="pageRanking.changePage(pageIndex)"></proposal-list> 50 + <div class="col-sm-12" ng-if="pageRanking.filtredProposals && pageRanking.total_proposals">
  51 + <proposal-list proposals="pageRanking.filtredProposals" per-page="pageRanking.per_page" total="pageRanking.total_proposals"></proposal-list>
  52 + <app-paginator
  53 + page="pageRanking.page"
  54 + per-page="pageRanking.per_page"
  55 + total="pageRanking.total_proposals"
  56 + change-page="pageRanking.changePage(pageIndex)"
  57 + ></app-paginator>
52 </div> 58 </div>
53 <div class="col-sm-12" ng-if="pageRanking.loadingProposals"> 59 <div class="col-sm-12" ng-if="pageRanking.loadingProposals">
54 <div class="alert alert-info" role="alert"> 60 <div class="alert alert-info" role="alert">