From c0c46b5eccbebbc718bad687d6a8b341d51961c1 Mon Sep 17 00:00:00 2001
From: Leonardo Merlin <leonardo.merlin@gmail.com>
Date: Wed, 16 Sep 2015 21:45:22 -0300
Subject: [PATCH] Refact: paginator is more generic now

---
 src/app/components/app-paginator/app-paginator.directive.js | 28 ++++++++++++++++------------
 src/app/components/app-paginator/app-paginator.html         | 14 +++++++-------
 src/app/components/app-paginator/app-paginator.scss         | 40 ++++++++++++++++++++++++++++++++++++++++
 src/app/components/article-service/article.service.js       | 15 +++------------
 src/app/components/proposal-list/proposal-list.directive.js | 77 ++---------------------------------------------------------------------------
 src/app/components/proposal-list/proposal-list.html         | 24 ++----------------------
 src/app/components/proposal-list/proposal-list.scss         | 41 -----------------------------------------
 src/app/components/social-share/social-share.html           |  3 ++-
 src/app/pages/ranking/ranking.controller.js                 | 19 +++++++++----------
 src/app/pages/ranking/ranking.html                          | 10 ++++++++--
 10 files changed, 89 insertions(+), 182 deletions(-)
 create mode 100644 src/app/components/app-paginator/app-paginator.scss

diff --git a/src/app/components/app-paginator/app-paginator.directive.js b/src/app/components/app-paginator/app-paginator.directive.js
index c679be3..5c59dbd 100644
--- a/src/app/components/app-paginator/app-paginator.directive.js
+++ b/src/app/components/app-paginator/app-paginator.directive.js
@@ -19,31 +19,36 @@
       $log.debug('AppPaginatorController');
     }
 
-    AppPaginatorController.prototype.init = function () {
+    AppPaginatorController.prototype.init = function() {
       var vm = this;
 
       vm.page = vm.page || 1;
       vm.perPage = vm.perPage || 20;
       vm.total = vm.total || 0;
+
+      if ((vm.total % vm.perPage) === 0) {
+        vm.pages =  vm.total / vm.perPage;
+      } else {
+        vm.pages =  (vm.total / vm.perPage) + 1;
+      }
+
+      vm.arraypages = new Array(Math.floor(vm.pages));
     };
 
-    AppPaginatorController.prototype.showPage = function (pageIndex) {
+    AppPaginatorController.prototype.showPage = function(pageIndex) {
       var vm = this;
 
-      if (pageIndex < 0) {
-        pageIndex = 0;
+      if (pageIndex < 1) {
+        pageIndex = 1;
       }
 
-      if (pageIndex > (vm.arraypages.length-1)) {
-        pageIndex = vm.arraypages.length-1;
+      if (pageIndex > vm.pages) {
+        pageIndex = vm.pages;
       }
 
-      if(vm.changePage){
-        vm.changePage({pageIndex: (pageIndex + 1 )});
-      }else{
-        vm.proposalsPerPage = vm.getProposalsPerPage(pageIndex);
+      if (vm.changePage) {
+        vm.changePage({pageIndex: pageIndex});
       }
-      vm.currentPageIndex = pageIndex;
     };
 
     var directive = {
@@ -60,7 +65,6 @@
       bindToController: true
     };
 
-
     return directive;
   }
 
diff --git a/src/app/components/app-paginator/app-paginator.html b/src/app/components/app-paginator/app-paginator.html
index e5e0337..e51c418 100644
--- a/src/app/components/app-paginator/app-paginator.html
+++ b/src/app/components/app-paginator/app-paginator.html
@@ -1,15 +1,15 @@
-<nav ng-if="vm.arraypages.length > 1">
+<nav class="app-paginator" ng-if="vm.arraypages.length > 1">
   <ul class="pagination">
-    <li ng-style="{'visibility': (vm.currentPageIndex === 0) ? 'hidden' : 'visible'}">
-      <a  class="btn-pagination" href="#" aria-label="Previous" ng-click="vm.showPage(vm.currentPageIndex-1)">
+    <li ng-style="{'visibility': (vm.page === 1) ? 'hidden' : 'visible'}">
+      <a  class="btn-pagination" href="#" aria-label="Previous" ng-click="vm.showPage(vm.page-1)">
         <span aria-hidden="true" class="glyphicon glyphicon-chevron-left pagination-icon"></span>
       </a>
     </li>
-    <li ng-repeat="paginas in vm.arraypages track by $index" ng-class="{ 'active' : ($index) == vm.currentPageIndex }" >
-      <a class="btn-pagination"  href="#" ng-click="vm.showPage($index)">{{::($index)+1}}</a>
+    <li ng-repeat="paginas in vm.arraypages track by $index" ng-class="{ 'active' : ($index) === (vm.page - 1) }" >
+      <a class="btn-pagination"  href="#" ng-click="vm.showPage($index + 1)">{{::($index)+1}}</a>
     </li>
-    <li ng-style="{'visibility': (vm.currentPageIndex === (vm.arraypages.length -1)) ? 'hidden' : 'visible'}">
-      <a  class="btn-pagination" href="#" aria-label="Next" ng-click="vm.showPage(vm.currentPageIndex+1)">
+    <li ng-style="{'visibility': (vm.page === vm.arraypages.length) ? 'hidden' : 'visible'}">
+      <a  class="btn-pagination" href="#" aria-label="Next" ng-click="vm.showPage(vm.page+1)">
         <span aria-hidden="true" class="glyphicon glyphicon-chevron-right pagination-icon"></span>
       </a>
     </li>
diff --git a/src/app/components/app-paginator/app-paginator.scss b/src/app/components/app-paginator/app-paginator.scss
new file mode 100644
index 0000000..fa4fe62
--- /dev/null
+++ b/src/app/components/app-paginator/app-paginator.scss
@@ -0,0 +1,40 @@
+.app-paginator {
+    text-align: center;
+
+    .btn-pagination {
+        background-color: transparent;
+        border: none;
+        border-radius: 100%;
+        font-weight: bold;
+        font-size: 20px;
+        padding: 0px 8px;
+        width: 28px;
+        height: 28px;
+        text-decoration: underline;
+        color: $defaultblue;
+    }
+
+    .pagination-icon {
+        color: $defaultblue;
+    }
+
+    .pagination > .active > a,
+    .pagination > .active > a:hover,
+    .pagination > .active > a:focus,
+    .pagination > .active > span,
+    .pagination > .active > span:hover,
+    .pagination > .active > span:focus {
+        background-color: $defaultblue;
+        text-decoration: none;
+
+    }
+
+    .pagination > .disabled > span,
+    .pagination > .disabled > span:hover,
+    .pagination > .disabled > span:focus,
+    .pagination > .disabled > a,
+    .pagination > .disabled > a:hover,
+    .pagination > .disabled > a:focus {
+        background-color: transparent;
+    }
+}
diff --git a/src/app/components/article-service/article.service.js b/src/app/components/article-service/article.service.js
index 302ce68..44f3e56 100644
--- a/src/app/components/article-service/article.service.js
+++ b/src/app/components/article-service/article.service.js
@@ -96,16 +96,6 @@
     }
 
     function getProposals (params, cbSuccess, cbError) {
-      // Ex.: /api/v1/articles/103358?fields=
-
-      // var url = service.apiArticles + API.articleId.home;
-
-      // UtilService.get(url, {params: paramsExtended}).then(function(data){
-      //   cbSuccess(data);
-      // }).catch(function(error){
-      //   cbError(error);
-      // });
-
       var paramsExtended = angular.extend({
         query: ''
       }, params);
@@ -253,8 +243,9 @@
       // Ex.: /api/v1/search/article?type=ProposalsDiscussionPlugin::Proposal&query=cisternas
       var url = '/api/v1/search/article';
       var paramsExtended = angular.extend({
-        // 'fields[]': ['id', 'title', 'slug', 'abstract', 'categories', 'setting', 'children_count', 'hits'],
-        'type': 'ProposalsDiscussionPlugin::Proposal'
+        page: 1,
+        per_page: 20,
+        type: 'ProposalsDiscussionPlugin::Proposal'
       }, params);
 
       UtilService.get(url, {params: paramsExtended}).then(function(data){
diff --git a/src/app/components/proposal-list/proposal-list.directive.js b/src/app/components/proposal-list/proposal-list.directive.js
index fd56af3..7594b21 100644
--- a/src/app/components/proposal-list/proposal-list.directive.js
+++ b/src/app/components/proposal-list/proposal-list.directive.js
@@ -9,20 +9,16 @@
   function proposalList() {
 
     /** @ngInject */
-    function ProposalListController(ArticleService, $state, $scope, $element, $timeout, $log) {
+    function ProposalListController($state, $element, $timeout, $log) {
       $log.debug('ProposalListController');
 
       var vm = this;
-      vm.ArticleService = ArticleService;
       vm.$state = $state;
-      vm.$scope = $scope;
       vm.$element = $element;
       vm.$timeout = $timeout;
       vm.$log = $log;
 
       vm.init();
-      vm.loadData();
-      vm.attachListeners();
     }
 
     ProposalListController.prototype.init = function () {
@@ -33,76 +29,11 @@
         throw { name: 'NotDefined', message: 'The attribute "proposals" is undefined.'};
       }
 
-      if(!vm.perPage){
-        vm.perPage = 5;
-      }
-
-      vm.initPorposalList();
-    };
-
-    ProposalListController.prototype.initPorposalList = function () {
-      var vm = this;
-
-      vm.currentPageIndex = 0;
-      vm.proposalsPerPage = vm.getProposalsPerPage(0);
-      vm.proposalsLength = vm.total || vm.proposals.length;
-
-      if ((vm.proposalsLength % vm.perPage) === 0) {
-        vm.pages = vm.proposalsLength / vm.perPage;
-      } else{
-        vm.pages = (vm.proposalsLength / vm.perPage) + 1;
-      }
-
-      // vm.arraypages = new Array(Math.ceil(vm.pages));
-      vm.arraypages = new Array(Math.floor(vm.pages));
-    };
-
-    ProposalListController.prototype.loadData = function () {
-      // async values
-      var vm = this;
-
-      // requeue to wait until DOM be created
       vm.$timeout(function(){
         attachPopover.call(vm);
       }, 1000);
     };
 
-    ProposalListController.prototype.attachListeners = function () {
-      var vm = this;
-
-      vm.$scope.$watch('vm.proposals', function(/*newValue, oldValue*/) {
-        vm.initPorposalList();
-      });
-    };
-
-    ProposalListController.prototype.getProposalsPerPage = function (pageIndex) {
-      var vm = this;
-
-      var initialIndex = pageIndex * vm.perPage;
-      var finalIndex = initialIndex + vm.perPage;
-
-      return vm.proposals.slice(initialIndex, finalIndex);
-    };
-
-    ProposalListController.prototype.showPage = function (pageIndex) {
-      var vm = this;
-
-      if (pageIndex < 0) {
-        pageIndex = 0;
-      }
-
-      if (pageIndex > (vm.arraypages.length-1)) {
-        pageIndex = vm.arraypages.length-1;
-      }
-
-      if(vm.changePage){
-        vm.changePage({pageIndex: (pageIndex + 1 )});
-      }else{
-        vm.proposalsPerPage = vm.getProposalsPerPage(pageIndex);
-      }
-      vm.currentPageIndex = pageIndex;
-    };
-
     ProposalListController.prototype.showContent = function (proposal) {
       var vm = this;
 
@@ -132,11 +63,7 @@
       restrict: 'E',
       templateUrl: 'app/components/proposal-list/proposal-list.html',
       scope: {
-        proposals: '=',
-        page: '=',
-        perPage: '=',
-        total: '=',
-        changePage: '&'
+        proposals: '='
       },
       controller: ProposalListController,
       controllerAs: 'vm',
diff --git a/src/app/components/proposal-list/proposal-list.html b/src/app/components/proposal-list/proposal-list.html
index 74aef24..0433cc0 100644
--- a/src/app/components/proposal-list/proposal-list.html
+++ b/src/app/components/proposal-list/proposal-list.html
@@ -1,8 +1,5 @@
 <div class="proposal-list">
-	<div class="" ng-if="vm.loading">
-		<div class="">Carregando...</div>
-	</div>
-	<div class="" ng-if="!vm.loading && vm.proposalsPerPage">
+	<div class="" ng-if="vm.proposals">
 		<table class="table table-striped">
 			<thead>
 				<tr>
@@ -14,7 +11,7 @@
 				</tr>
 			</thead>
 			<tbody>
-				<tr ng-repeat="proposal in vm.proposalsPerPage">
+				<tr ng-repeat="proposal in vm.proposals">
 					<td class="color-theme-fg">
 						<span class="position">{{::proposal.ranking_position}}º</span>
 					</td>
@@ -38,22 +35,5 @@
 				</tr>
 			</tbody>
 		</table>
-		<nav ng-if="vm.arraypages.length > 1">
-			<ul class="pagination">
-				<li ng-style="{'visibility': (vm.currentPageIndex === 0) ? 'hidden' : 'visible'}">
-					<a  class="btn-pagination" href="#" aria-label="Previous" ng-click="vm.showPage(vm.currentPageIndex-1)">
-						<span aria-hidden="true" class="glyphicon glyphicon-chevron-left pagination-icon"></span>
-					</a>
-				</li>
-				<li ng-repeat="paginas in vm.arraypages track by $index" ng-class="{ 'active' : ($index) == vm.currentPageIndex }" >
-					<a class="btn-pagination"  href="#" ng-click="vm.showPage($index)">{{::($index)+1}}</a>
-				</li>
-				<li ng-style="{'visibility': (vm.currentPageIndex === (vm.arraypages.length -1)) ? 'hidden' : 'visible'}">
-					<a  class="btn-pagination" href="#" aria-label="Next" ng-click="vm.showPage(vm.currentPageIndex+1)">
-						<span aria-hidden="true" class="glyphicon glyphicon-chevron-right pagination-icon"></span>
-					</a>
-				</li>
-			</ul>
-		</nav>
 	</div>
 </div>
diff --git a/src/app/components/proposal-list/proposal-list.scss b/src/app/components/proposal-list/proposal-list.scss
index 4d9c5ca..38caba9 100644
--- a/src/app/components/proposal-list/proposal-list.scss
+++ b/src/app/components/proposal-list/proposal-list.scss
@@ -80,45 +80,4 @@
         }
     }
 
-    .btn-pagination {
-        background-color: transparent;
-        border: none;
-        border-radius: 100%;
-        font-weight: bold;
-        font-size: 20px;
-        padding: 0px 8px;
-        width: 28px;
-        height: 28px;
-        text-decoration: underline;
-        color: $defaultblue;
-    }
-
-    .pagination-icon {
-        color: $defaultblue;
-    }
-
-    .pagination > .active > a,
-    .pagination > .active > a:hover,
-    .pagination > .active > a:focus,
-    .pagination > .active > span,
-    .pagination > .active > span:hover,
-    .pagination > .active > span:focus {
-        background-color: $defaultblue;
-        text-decoration: none;
-
-    }
-
-    .pagination > .disabled > span,
-    .pagination > .disabled > span:hover,
-    .pagination > .disabled > span:focus,
-    .pagination > .disabled > a,
-    .pagination > .disabled > a:hover,
-    .pagination > .disabled > a:focus {
-        background-color: transparent;
-    }
-
-    nav {
-      text-align: center;
-    }
-
 }
diff --git a/src/app/components/social-share/social-share.html b/src/app/components/social-share/social-share.html
index d41fd20..391923e 100644
--- a/src/app/components/social-share/social-share.html
+++ b/src/app/components/social-share/social-share.html
@@ -3,11 +3,12 @@
 </div>
 <ul class="social-share list-inline">
   <li>
+      <!-- socialshare-via="687948707977695" -->
     <a href="#" role="button"
       socialshare
       socialshare-provider="facebook"
       socialshare-type="feed"
-      socialshare-via="687948707977695"
+      socialshare-via="476168325877872"
       socialshare-url="http://dialoga.gov.br"
       socialshare-redirect-uri="https://dialoga.gov.br/"
       socialshare-media="http://dialoga.gov.br/images/logo.png"
diff --git a/src/app/pages/ranking/ranking.controller.js b/src/app/pages/ranking/ranking.controller.js
index 3fc4a68..d6fed87 100644
--- a/src/app/pages/ranking/ranking.controller.js
+++ b/src/app/pages/ranking/ranking.controller.js
@@ -26,7 +26,7 @@
     var vm = this;
 
     vm.page = 1;
-    vm.per_page = 3;
+    vm.per_page = 20;
     vm.themes = null;
     vm.selectedTheme = null;
     vm.filtredPrograms = null;
@@ -135,7 +135,10 @@
 
     // load Proposals
     vm.loadingProposals = true;
-    vm.DialogaService.getProposals({}, function(data){
+    vm.DialogaService.getProposals({
+      page: vm.page,
+      per_page: vm.per_page
+    }, function(data){
       vm.proposals = data.articles;
       vm.filtredProposals = vm.proposals;
       vm.loadingProposals = false;
@@ -155,7 +158,7 @@
       vm.selectedTheme = selectedCategory;
     });
 
-    vm.$scope.$watch('pageRanking.selectedTheme', function(newValue, oldValue) {
+    vm.$scope.$watch('pageRanking.selectedTheme', function(newValue/*, oldValue*/) {
       vm.search.tema = newValue ? newValue.slug : null;
       vm.$location.search('tema', vm.search.tema);
 
@@ -170,7 +173,7 @@
       vm.selectedProgram = selectedTopic;
     });
 
-    vm.$scope.$watch('pageRanking.selectedProgram', function(newValue, oldValue) {
+    vm.$scope.$watch('pageRanking.selectedProgram', function(newValue/*, oldValue*/) {
       vm.search.programa = newValue ? newValue.slug : null;
       vm.$location.search('programa', vm.search.programa);
       vm.filterProposals();
@@ -193,6 +196,7 @@
   RankingPageController.prototype.changePage = function(pageIndex) {
     var vm = this;
 
+    vm.page = pageIndex;
     vm.filterProposals(pageIndex);
   };
 
@@ -206,14 +210,9 @@
 
     var page = _page || vm.page;
     var per_page = _per_page || vm.per_page;
-    var input = vm.proposals;
-    var output = input;
     var query = vm.query;
-    var selectedTheme = vm.selectedTheme;
     var selectedProgram = vm.selectedProgram;
 
-    var filter = vm.$filter('filter');
-
     if (selectedProgram) {
       var params = {
         page: page,
@@ -225,7 +224,7 @@
 
       vm.loadingProposals = true;
       vm.DialogaService.searchProposals(params, function(data){
-        vm.total_proposals = data._obj.headers('total');
+        vm.total_proposals = parseInt(data._obj.headers('total'));
         vm.filtredProposals = data.articles;
         vm.loadingProposals = false;
       }, function (error) {
diff --git a/src/app/pages/ranking/ranking.html b/src/app/pages/ranking/ranking.html
index 7c6c388..368e9a7 100644
--- a/src/app/pages/ranking/ranking.html
+++ b/src/app/pages/ranking/ranking.html
@@ -47,8 +47,14 @@
 					</div>
 
 					<div class="row">
-						<div class="col-sm-12" ng-if="pageRanking.proposals">
-							<proposal-list proposals="pageRanking.filtredProposals" per-page="pageRanking.per_page" total="pageRanking.total_proposals" change-page="pageRanking.changePage(pageIndex)"></proposal-list>
+						<div class="col-sm-12" ng-if="pageRanking.filtredProposals && pageRanking.total_proposals">
+							<proposal-list proposals="pageRanking.filtredProposals" per-page="pageRanking.per_page" total="pageRanking.total_proposals"></proposal-list>
+							<app-paginator
+								page="pageRanking.page"
+								per-page="pageRanking.per_page"
+								total="pageRanking.total_proposals"
+								change-page="pageRanking.changePage(pageIndex)"
+							></app-paginator>
 						</div>
 						<div class="col-sm-12" ng-if="pageRanking.loadingProposals">
 							<div class="alert alert-info" role="alert">
--
libgit2 0.21.2