feat(pagination): add force-ellipses option and boundaryLinkNumbers

- Adds force-ellipsis option for adding ellipses to pagination
- Add boundary-link-numbers option for allowance of the first and last page numbers to always be shown

Closes #2924
Closes #3064
Closes #3565

Author: OzzieOrca

.gitignore

@@ -9,6 +9,7 @@ lib-cov
 *.swp
 *.swo
 .DS_Store
+.idea
 
 pids
 logs

src/pagination/docs/demo.html

@@ -7,13 +7,22 @@ <h4>Default</h4>
     <pre>The selected page no: {{currentPage}}</pre>
     <button type="button" class="btn btn-info" ng-click="setPage(3)">Set current page to: 3</button>
 
+    <hr />
+    <h4>Limit the maximum visible buttons</h4>
+    <h6><code>rotate</code> defaulted to <code>true</code>:</h6>
+    <uib-pagination total-items="bigTotalItems" ng-model="bigCurrentPage" max-size="maxSize" class="pagination-sm" boundary-links="true" num-pages="numPages"></uib-pagination>
+    <h6><code>rotate</code> defaulted to <code>true</code> and <code>force-ellipses</code> set to <code>true</code>:</h6>
+    <uib-pagination total-items="bigTotalItems" ng-model="bigCurrentPage" max-size="maxSize" class="pagination-sm" boundary-links="true" force-ellipses="true"></uib-pagination>
+    <h6><code>rotate</code> set to <code>false</code>:</h6>
+    <uib-pagination total-items="bigTotalItems" ng-model="bigCurrentPage" max-size="maxSize" class="pagination-sm" boundary-links="true" rotate="false"></uib-pagination>
+    <h6><code>boundary-link-numbers</code> set to <code>true</code> and <code>rotate</code> defaulted to <code>true</code>:</h6>
+    <uib-pagination total-items="bigTotalItems" ng-model="bigCurrentPage" max-size="maxSize" class="pagination-sm" boundary-link-numbers="true"></uib-pagination>
+    <h6><code>boundary-link-numbers</code> set to <code>true</code> and <code>rotate</code> set to <code>false</code>:</h6>
+    <uib-pagination total-items="bigTotalItems" ng-model="bigCurrentPage" max-size="maxSize" class="pagination-sm" boundary-link-numbers="true" rotate="false"></uib-pagination>
+    <pre>Page: {{bigCurrentPage}} / {{numPages}}</pre>
+
     <hr />
     <h4>Pager</h4>
     <uib-pager total-items="totalItems" ng-model="currentPage"></uib-pager>
 
-    <hr />
-    <h4>Limit the maximum visible buttons</h4>
-    <uib-pagination total-items="bigTotalItems" ng-model="bigCurrentPage" max-size="maxSize" class="pagination-sm" boundary-links="true"></uib-pagination>
-    <uib-pagination total-items="bigTotalItems" ng-model="bigCurrentPage" max-size="maxSize" class="pagination-sm" boundary-links="true" rotate="false" num-pages="numPages"></uib-pagination>
-    <pre>Page: {{bigCurrentPage}} / {{numPages}}</pre>
 </div>

src/pagination/docs/readme.md

@@ -36,6 +36,10 @@ Settings can be provided as attributes in the `<uib-pagination>` or globally con
  * `rotate`
  	_(Defaults: true)_ :
  	Whether to keep current page in the middle of the visible ones.
+ 	
+ * `force-ellipses`
+ 	_(Defaults: false)_ :
+ 	Also displays ellipses when `rotate` is true and `max-size` is smaller than the number of pages.
 
  * `direction-links`
  	_(Default: true)_ :
@@ -60,6 +64,10 @@ Settings can be provided as attributes in the `<uib-pagination>` or globally con
  * `last-text`
  	_(Default: 'Last')_ :
  	Text for Last button.
+ 	
+ * `boundary-link-numbers`
+ 	_(Default: false)_ :
+ 	Whether to always display the first and last page numbers. If `max-size` is smaller than the number of pages, then the  first and last page numbers are still shown with ellipses in-between as necessary. NOTE: `max-size` refers to the center of the range. This option may add up to 2 more numbers on each side of the displayed range for the end value and what would be an ellipsis but is replaced by a number because it is sequential. 
 
  * `template-url`
   _(Default: 'template/pagination/pagination.html')_ :

src/pagination/pagination.js

@@ -24,7 +24,7 @@ angular.module('ui.bootstrap.pagination', [])
 
     $scope.$watch('totalItems', function(newTotal, oldTotal) {
       if (angular.isDefined(newTotal) || newTotal !== oldTotal) {
-        $scope.totalPages = self.calculateTotalPages();
+      $scope.totalPages = self.calculateTotalPages();
         updatePage();
       }
     });
@@ -80,12 +80,14 @@ angular.module('ui.bootstrap.pagination', [])
 .constant('uibPaginationConfig', {
   itemsPerPage: 10,
   boundaryLinks: false,
+  boundaryLinkNumbers: false,
   directionLinks: true,
   firstText: 'First',
   previousText: 'Previous',
   nextText: 'Next',
   lastText: 'Last',
-  rotate: true
+  rotate: true,
+  forceEllipses: false
 })
 
 .directive('uibPagination', ['$parse', 'uibPaginationConfig', function($parse, paginationConfig) {
@@ -115,7 +117,9 @@ angular.module('ui.bootstrap.pagination', [])
 
       // Setup configuration parameters
       var maxSize = angular.isDefined(attrs.maxSize) ? scope.$parent.$eval(attrs.maxSize) : paginationConfig.maxSize,
-        rotate = angular.isDefined(attrs.rotate) ? scope.$parent.$eval(attrs.rotate) : paginationConfig.rotate;
+        rotate = angular.isDefined(attrs.rotate) ? scope.$parent.$eval(attrs.rotate) : paginationConfig.rotate,
+        forceEllipses = angular.isDefined(attrs.forceEllipses) ? scope.$parent.$eval(attrs.forceEllipses) : paginationConfig.forceEllipses,
+        boundaryLinkNumbers = angular.isDefined(attrs.boundaryLinkNumbers) ? scope.$parent.$eval(attrs.boundaryLinkNumbers) : paginationConfig.boundaryLinkNumbers;
       scope.boundaryLinks = angular.isDefined(attrs.boundaryLinks) ? scope.$parent.$eval(attrs.boundaryLinks) : paginationConfig.boundaryLinks;
       scope.directionLinks = angular.isDefined(attrs.directionLinks) ? scope.$parent.$eval(attrs.directionLinks) : paginationConfig.directionLinks;
 
@@ -148,7 +152,7 @@ angular.module('ui.bootstrap.pagination', [])
         if (isMaxSized) {
           if (rotate) {
             // Current page is displayed in the middle of the visible ones
-            startPage = Math.max(currentPage - Math.floor(maxSize/2), 1);
+            startPage = Math.max(currentPage - Math.floor(maxSize / 2), 1);
             endPage   = startPage + maxSize - 1;
 
             // Adjust if limit is exceeded
@@ -158,7 +162,7 @@ angular.module('ui.bootstrap.pagination', [])
             }
           } else {
             // Visible pages are paginated with maxSize
-            startPage = ((Math.ceil(currentPage / maxSize) - 1) * maxSize) + 1;
+            startPage = (Math.ceil(currentPage / maxSize) - 1) * maxSize + 1;
 
             // Adjust last page if limit is exceeded
             endPage = Math.min(startPage + maxSize - 1, totalPages);
@@ -172,16 +176,38 @@ angular.module('ui.bootstrap.pagination', [])
         }
 
         // Add links to move between page sets
-        if ( isMaxSized && maxSize > 0 ) {
-          if ( startPage > 1 ) {
+        if (isMaxSized && maxSize > 0 &&  (!rotate || forceEllipses || boundaryLinkNumbers)) {
+          if (startPage > 1) {
+            if (!boundaryLinkNumbers || startPage > 3) { //need ellipsis for all options unless range is too close to beginning
             var previousPageSet = makePage(startPage - 1, '...', false);
             pages.unshift(previousPageSet);
           }
+            if (boundaryLinkNumbers) {
+              if (startPage === 3) { //need to replace ellipsis when the buttons would be sequential
+                var secondPageLink = makePage(2, '2', false);
+                pages.unshift(secondPageLink);
+              }
+              //add the first page
+              var firstPageLink = makePage(1, '1', false);
+              pages.unshift(firstPageLink);
+            }
+          }
 
           if (endPage < totalPages) {
+            if (!boundaryLinkNumbers || endPage < totalPages - 2) { //need ellipsis for all options unless range is too close to end
             var nextPageSet = makePage(endPage + 1, '...', false);
             pages.push(nextPageSet);
           }
+            if (boundaryLinkNumbers) {
+              if (endPage === totalPages - 2) { //need to replace ellipsis when the buttons would be sequential
+                var secondToLastPageLink = makePage(totalPages - 1, totalPages - 1, false);
+                pages.push(secondToLastPageLink);
+              }
+              //add the last page
+              var lastPageLink = makePage(totalPages, totalPages, false);
+              pages.push(lastPageLink);
+            }
+          }
         }
         return pages;
       }