Commit c0c46b5eccbebbc718bad687d6a8b341d51961c1
1 parent
ef3b9ec3
Exists in
master
and in
8 other branches
Refact: paginator is more generic now
Showing
10 changed files
with
89 additions
and
182 deletions
Show diff stats
src/app/components/app-paginator/app-paginator.directive.js
| ... | ... | @@ -19,31 +19,36 @@ |
| 19 | 19 | $log.debug('AppPaginatorController'); |
| 20 | 20 | } |
| 21 | 21 | |
| 22 | - AppPaginatorController.prototype.init = function () { | |
| 22 | + AppPaginatorController.prototype.init = function() { | |
| 23 | 23 | var vm = this; |
| 24 | 24 | |
| 25 | 25 | vm.page = vm.page || 1; |
| 26 | 26 | vm.perPage = vm.perPage || 20; |
| 27 | 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 | 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 | 54 | var directive = { |
| ... | ... | @@ -60,7 +65,6 @@ |
| 60 | 65 | bindToController: true |
| 61 | 66 | }; |
| 62 | 67 | |
| 63 | - | |
| 64 | 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 | 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 | 5 | <span aria-hidden="true" class="glyphicon glyphicon-chevron-left pagination-icon"></span> |
| 6 | 6 | </a> |
| 7 | 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 | 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 | 13 | <span aria-hidden="true" class="glyphicon glyphicon-chevron-right pagination-icon"></span> |
| 14 | 14 | </a> |
| 15 | 15 | </li> | ... | ... |
| ... | ... | @@ -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 | 96 | } |
| 97 | 97 | |
| 98 | 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 | 99 | var paramsExtended = angular.extend({ |
| 110 | 100 | query: '' |
| 111 | 101 | }, params); |
| ... | ... | @@ -253,8 +243,9 @@ |
| 253 | 243 | // Ex.: /api/v1/search/article?type=ProposalsDiscussionPlugin::Proposal&query=cisternas |
| 254 | 244 | var url = '/api/v1/search/article'; |
| 255 | 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 | 249 | }, params); |
| 259 | 250 | |
| 260 | 251 | UtilService.get(url, {params: paramsExtended}).then(function(data){ | ... | ... |
src/app/components/proposal-list/proposal-list.directive.js
| ... | ... | @@ -9,20 +9,16 @@ |
| 9 | 9 | function proposalList() { |
| 10 | 10 | |
| 11 | 11 | /** @ngInject */ |
| 12 | - function ProposalListController(ArticleService, $state, $scope, $element, $timeout, $log) { | |
| 12 | + function ProposalListController($state, $element, $timeout, $log) { | |
| 13 | 13 | $log.debug('ProposalListController'); |
| 14 | 14 | |
| 15 | 15 | var vm = this; |
| 16 | - vm.ArticleService = ArticleService; | |
| 17 | 16 | vm.$state = $state; |
| 18 | - vm.$scope = $scope; | |
| 19 | 17 | vm.$element = $element; |
| 20 | 18 | vm.$timeout = $timeout; |
| 21 | 19 | vm.$log = $log; |
| 22 | 20 | |
| 23 | 21 | vm.init(); |
| 24 | - vm.loadData(); | |
| 25 | - vm.attachListeners(); | |
| 26 | 22 | } |
| 27 | 23 | |
| 28 | 24 | ProposalListController.prototype.init = function () { |
| ... | ... | @@ -33,76 +29,11 @@ |
| 33 | 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 | 32 | vm.$timeout(function(){ |
| 66 | 33 | attachPopover.call(vm); |
| 67 | 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 | 37 | ProposalListController.prototype.showContent = function (proposal) { |
| 107 | 38 | var vm = this; |
| 108 | 39 | |
| ... | ... | @@ -132,11 +63,7 @@ |
| 132 | 63 | restrict: 'E', |
| 133 | 64 | templateUrl: 'app/components/proposal-list/proposal-list.html', |
| 134 | 65 | scope: { |
| 135 | - proposals: '=', | |
| 136 | - page: '=', | |
| 137 | - perPage: '=', | |
| 138 | - total: '=', | |
| 139 | - changePage: '&' | |
| 66 | + proposals: '=' | |
| 140 | 67 | }, |
| 141 | 68 | controller: ProposalListController, |
| 142 | 69 | controllerAs: 'vm', | ... | ... |
src/app/components/proposal-list/proposal-list.html
| 1 | 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 | 3 | <table class="table table-striped"> |
| 7 | 4 | <thead> |
| 8 | 5 | <tr> |
| ... | ... | @@ -14,7 +11,7 @@ |
| 14 | 11 | </tr> |
| 15 | 12 | </thead> |
| 16 | 13 | <tbody> |
| 17 | - <tr ng-repeat="proposal in vm.proposalsPerPage"> | |
| 14 | + <tr ng-repeat="proposal in vm.proposals"> | |
| 18 | 15 | <td class="color-theme-fg"> |
| 19 | 16 | <span class="position">{{::proposal.ranking_position}}º</span> |
| 20 | 17 | </td> |
| ... | ... | @@ -38,22 +35,5 @@ |
| 38 | 35 | </tr> |
| 39 | 36 | </tbody> |
| 40 | 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 | 38 | </div> |
| 59 | 39 | </div> | ... | ... |
src/app/components/proposal-list/proposal-list.scss
| ... | ... | @@ -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 | 3 | </div> |
| 4 | 4 | <ul class="social-share list-inline"> |
| 5 | 5 | <li> |
| 6 | + <!-- socialshare-via="687948707977695" --> | |
| 6 | 7 | <a href="#" role="button" |
| 7 | 8 | socialshare |
| 8 | 9 | socialshare-provider="facebook" |
| 9 | 10 | socialshare-type="feed" |
| 10 | - socialshare-via="687948707977695" | |
| 11 | + socialshare-via="476168325877872" | |
| 11 | 12 | socialshare-url="http://dialoga.gov.br" |
| 12 | 13 | socialshare-redirect-uri="https://dialoga.gov.br/" |
| 13 | 14 | socialshare-media="http://dialoga.gov.br/images/logo.png" | ... | ... |
src/app/pages/ranking/ranking.controller.js
| ... | ... | @@ -26,7 +26,7 @@ |
| 26 | 26 | var vm = this; |
| 27 | 27 | |
| 28 | 28 | vm.page = 1; |
| 29 | - vm.per_page = 3; | |
| 29 | + vm.per_page = 20; | |
| 30 | 30 | vm.themes = null; |
| 31 | 31 | vm.selectedTheme = null; |
| 32 | 32 | vm.filtredPrograms = null; |
| ... | ... | @@ -135,7 +135,10 @@ |
| 135 | 135 | |
| 136 | 136 | // load Proposals |
| 137 | 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 | 142 | vm.proposals = data.articles; |
| 140 | 143 | vm.filtredProposals = vm.proposals; |
| 141 | 144 | vm.loadingProposals = false; |
| ... | ... | @@ -155,7 +158,7 @@ |
| 155 | 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 | 162 | vm.search.tema = newValue ? newValue.slug : null; |
| 160 | 163 | vm.$location.search('tema', vm.search.tema); |
| 161 | 164 | |
| ... | ... | @@ -170,7 +173,7 @@ |
| 170 | 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 | 177 | vm.search.programa = newValue ? newValue.slug : null; |
| 175 | 178 | vm.$location.search('programa', vm.search.programa); |
| 176 | 179 | vm.filterProposals(); |
| ... | ... | @@ -193,6 +196,7 @@ |
| 193 | 196 | RankingPageController.prototype.changePage = function(pageIndex) { |
| 194 | 197 | var vm = this; |
| 195 | 198 | |
| 199 | + vm.page = pageIndex; | |
| 196 | 200 | vm.filterProposals(pageIndex); |
| 197 | 201 | }; |
| 198 | 202 | |
| ... | ... | @@ -206,14 +210,9 @@ |
| 206 | 210 | |
| 207 | 211 | var page = _page || vm.page; |
| 208 | 212 | var per_page = _per_page || vm.per_page; |
| 209 | - var input = vm.proposals; | |
| 210 | - var output = input; | |
| 211 | 213 | var query = vm.query; |
| 212 | - var selectedTheme = vm.selectedTheme; | |
| 213 | 214 | var selectedProgram = vm.selectedProgram; |
| 214 | 215 | |
| 215 | - var filter = vm.$filter('filter'); | |
| 216 | - | |
| 217 | 216 | if (selectedProgram) { |
| 218 | 217 | var params = { |
| 219 | 218 | page: page, |
| ... | ... | @@ -225,7 +224,7 @@ |
| 225 | 224 | |
| 226 | 225 | vm.loadingProposals = true; |
| 227 | 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 | 228 | vm.filtredProposals = data.articles; |
| 230 | 229 | vm.loadingProposals = false; |
| 231 | 230 | }, function (error) { | ... | ... |
src/app/pages/ranking/ranking.html
| ... | ... | @@ -47,8 +47,14 @@ |
| 47 | 47 | </div> |
| 48 | 48 | |
| 49 | 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 | 58 | </div> |
| 53 | 59 | <div class="col-sm-12" ng-if="pageRanking.loadingProposals"> |
| 54 | 60 | <div class="alert alert-info" role="alert"> | ... | ... |