ngx-pagination.umd.js 28 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606
  1. (function (global, factory) {
  2. typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common')) :
  3. typeof define === 'function' && define.amd ? define(['exports', '@angular/core', '@angular/common'], factory) :
  4. (factory((global.ngxPagination = {}),global.core,global.common));
  5. }(this, (function (exports,core,common) { 'use strict';
  6. var PaginationService = /** @class */ (function () {
  7. function PaginationService() {
  8. this.change = new core.EventEmitter();
  9. this.instances = {};
  10. this.DEFAULT_ID = 'DEFAULT_PAGINATION_ID';
  11. }
  12. PaginationService.prototype.defaultId = function () { return this.DEFAULT_ID; };
  13. PaginationService.prototype.register = function (instance) {
  14. if (instance.id == null) {
  15. instance.id = this.DEFAULT_ID;
  16. }
  17. if (!this.instances[instance.id]) {
  18. this.instances[instance.id] = instance;
  19. this.change.emit(instance.id);
  20. }
  21. else {
  22. var changed = this.updateInstance(instance);
  23. if (changed) {
  24. this.change.emit(instance.id);
  25. }
  26. }
  27. };
  28. /**
  29. * Check each property of the instance and update any that have changed. Return
  30. * true if any changes were made, else return false.
  31. */
  32. PaginationService.prototype.updateInstance = function (instance) {
  33. var changed = false;
  34. for (var prop in this.instances[instance.id]) {
  35. if (instance[prop] !== this.instances[instance.id][prop]) {
  36. this.instances[instance.id][prop] = instance[prop];
  37. changed = true;
  38. }
  39. }
  40. return changed;
  41. };
  42. /**
  43. * Returns the current page number.
  44. */
  45. PaginationService.prototype.getCurrentPage = function (id) {
  46. if (this.instances[id]) {
  47. return this.instances[id].currentPage;
  48. }
  49. };
  50. /**
  51. * Sets the current page number.
  52. */
  53. PaginationService.prototype.setCurrentPage = function (id, page) {
  54. if (this.instances[id]) {
  55. var instance = this.instances[id];
  56. var maxPage = Math.ceil(instance.totalItems / instance.itemsPerPage);
  57. if (page <= maxPage && 1 <= page) {
  58. this.instances[id].currentPage = page;
  59. this.change.emit(id);
  60. }
  61. }
  62. };
  63. /**
  64. * Sets the value of instance.totalItems
  65. */
  66. PaginationService.prototype.setTotalItems = function (id, totalItems) {
  67. if (this.instances[id] && 0 <= totalItems) {
  68. this.instances[id].totalItems = totalItems;
  69. this.change.emit(id);
  70. }
  71. };
  72. /**
  73. * Sets the value of instance.itemsPerPage.
  74. */
  75. PaginationService.prototype.setItemsPerPage = function (id, itemsPerPage) {
  76. if (this.instances[id]) {
  77. this.instances[id].itemsPerPage = itemsPerPage;
  78. this.change.emit(id);
  79. }
  80. };
  81. /**
  82. * Returns a clone of the pagination instance object matching the id. If no
  83. * id specified, returns the instance corresponding to the default id.
  84. */
  85. PaginationService.prototype.getInstance = function (id) {
  86. if (id === void 0) { id = this.DEFAULT_ID; }
  87. if (this.instances[id]) {
  88. return this.clone(this.instances[id]);
  89. }
  90. return {};
  91. };
  92. /**
  93. * Perform a shallow clone of an object.
  94. */
  95. PaginationService.prototype.clone = function (obj) {
  96. var target = {};
  97. for (var i in obj) {
  98. if (obj.hasOwnProperty(i)) {
  99. target[i] = obj[i];
  100. }
  101. }
  102. return target;
  103. };
  104. return PaginationService;
  105. }());
  106. var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
  107. var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  108. if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
  109. else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  110. return c > 3 && r && Object.defineProperty(target, key, r), r;
  111. };
  112. var __metadata = (undefined && undefined.__metadata) || function (k, v) {
  113. if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
  114. };
  115. var LARGE_NUMBER = Number.MAX_SAFE_INTEGER;
  116. var PaginatePipe = /** @class */ (function () {
  117. function PaginatePipe(service) {
  118. this.service = service;
  119. // store the values from the last time the pipe was invoked
  120. this.state = {};
  121. }
  122. PaginatePipe.prototype.transform = function (collection, args) {
  123. // When an observable is passed through the AsyncPipe, it will output
  124. // `null` until the subscription resolves. In this case, we want to
  125. // use the cached data from the `state` object to prevent the NgFor
  126. // from flashing empty until the real values arrive.
  127. if (!(collection instanceof Array)) {
  128. var _id = args.id || this.service.defaultId();
  129. if (this.state[_id]) {
  130. return this.state[_id].slice;
  131. }
  132. else {
  133. return collection;
  134. }
  135. }
  136. var serverSideMode = args.totalItems && args.totalItems !== collection.length;
  137. var instance = this.createInstance(collection, args);
  138. var id = instance.id;
  139. var start, end;
  140. var perPage = instance.itemsPerPage;
  141. this.service.register(instance);
  142. if (!serverSideMode && collection instanceof Array) {
  143. perPage = +perPage || LARGE_NUMBER;
  144. start = (instance.currentPage - 1) * perPage;
  145. end = start + perPage;
  146. var isIdentical = this.stateIsIdentical(id, collection, start, end);
  147. if (isIdentical) {
  148. return this.state[id].slice;
  149. }
  150. else {
  151. var slice = collection.slice(start, end);
  152. this.saveState(id, collection, slice, start, end);
  153. this.service.change.emit(id);
  154. return slice;
  155. }
  156. }
  157. // save the state for server-side collection to avoid null
  158. // flash as new data loads.
  159. this.saveState(id, collection, collection, start, end);
  160. return collection;
  161. };
  162. /**
  163. * Create an PaginationInstance object, using defaults for any optional properties not supplied.
  164. */
  165. PaginatePipe.prototype.createInstance = function (collection, config) {
  166. this.checkConfig(config);
  167. return {
  168. id: config.id != null ? config.id : this.service.defaultId(),
  169. itemsPerPage: +config.itemsPerPage || 0,
  170. currentPage: +config.currentPage || 1,
  171. totalItems: +config.totalItems || collection.length
  172. };
  173. };
  174. /**
  175. * Ensure the argument passed to the filter contains the required properties.
  176. */
  177. PaginatePipe.prototype.checkConfig = function (config) {
  178. var required = ['itemsPerPage', 'currentPage'];
  179. var missing = required.filter(function (prop) { return !(prop in config); });
  180. if (0 < missing.length) {
  181. throw new Error("PaginatePipe: Argument is missing the following required properties: " + missing.join(', '));
  182. }
  183. };
  184. /**
  185. * To avoid returning a brand new array each time the pipe is run, we store the state of the sliced
  186. * array for a given id. This means that the next time the pipe is run on this collection & id, we just
  187. * need to check that the collection, start and end points are all identical, and if so, return the
  188. * last sliced array.
  189. */
  190. PaginatePipe.prototype.saveState = function (id, collection, slice, start, end) {
  191. this.state[id] = {
  192. collection: collection,
  193. size: collection.length,
  194. slice: slice,
  195. start: start,
  196. end: end
  197. };
  198. };
  199. /**
  200. * For a given id, returns true if the collection, size, start and end values are identical.
  201. */
  202. PaginatePipe.prototype.stateIsIdentical = function (id, collection, start, end) {
  203. var state = this.state[id];
  204. if (!state) {
  205. return false;
  206. }
  207. var isMetaDataIdentical = state.size === collection.length &&
  208. state.start === start &&
  209. state.end === end;
  210. if (!isMetaDataIdentical) {
  211. return false;
  212. }
  213. return state.slice.every(function (element, index) { return element === collection[start + index]; });
  214. };
  215. PaginatePipe = __decorate$1([
  216. core.Pipe({
  217. name: 'paginate',
  218. pure: false
  219. }),
  220. __metadata("design:paramtypes", [PaginationService])
  221. ], PaginatePipe);
  222. return PaginatePipe;
  223. }());
  224. /**
  225. * The default template and styles for the pagination links are borrowed directly
  226. * from Zurb Foundation 6: http://foundation.zurb.com/sites/docs/pagination.html
  227. */
  228. var DEFAULT_TEMPLATE = "\n <pagination-template #p=\"paginationApi\"\n [id]=\"id\"\n [maxSize]=\"maxSize\"\n (pageChange)=\"pageChange.emit($event)\">\n <ul class=\"ngx-pagination\" \n role=\"navigation\" \n [attr.aria-label]=\"screenReaderPaginationLabel\" \n [class.responsive]=\"responsive\"\n *ngIf=\"!(autoHide && p.pages.length <= 1)\">\n\n <li class=\"pagination-previous\" [class.disabled]=\"p.isFirstPage()\" *ngIf=\"directionLinks\"> \n <a tabindex=\"0\" *ngIf=\"1 < p.getCurrent()\" (keyup.enter)=\"p.previous()\" (click)=\"p.previous()\" [attr.aria-label]=\"previousLabel + ' ' + screenReaderPageLabel\">\n {{ previousLabel }} <span class=\"show-for-sr\">{{ screenReaderPageLabel }}</span>\n </a>\n <span *ngIf=\"p.isFirstPage()\">\n {{ previousLabel }} <span class=\"show-for-sr\">{{ screenReaderPageLabel }}</span>\n </span>\n </li> \n\n <li class=\"small-screen\">\n {{ p.getCurrent() }} / {{ p.getLastPage() }}\n </li>\n\n <li [class.current]=\"p.getCurrent() === page.value\" \n [class.ellipsis]=\"page.label === '...'\"\n *ngFor=\"let page of p.pages\">\n <a tabindex=\"0\" (keyup.enter)=\"p.setCurrent(page.value)\" (click)=\"p.setCurrent(page.value)\" *ngIf=\"p.getCurrent() !== page.value\">\n <span class=\"show-for-sr\">{{ screenReaderPageLabel }} </span>\n <span>{{ (page.label === '...') ? page.label : (page.label | number:'') }}</span>\n </a>\n <ng-container *ngIf=\"p.getCurrent() === page.value\">\n <span class=\"show-for-sr\">{{ screenReaderCurrentLabel }} </span>\n <span>{{ (page.label === '...') ? page.label : (page.label | number:'') }}</span> \n </ng-container>\n </li>\n\n <li class=\"pagination-next\" [class.disabled]=\"p.isLastPage()\" *ngIf=\"directionLinks\">\n <a tabindex=\"0\" *ngIf=\"!p.isLastPage()\" (keyup.enter)=\"p.next()\" (click)=\"p.next()\" [attr.aria-label]=\"nextLabel + ' ' + screenReaderPageLabel\">\n {{ nextLabel }} <span class=\"show-for-sr\">{{ screenReaderPageLabel }}</span>\n </a>\n <span *ngIf=\"p.isLastPage()\">\n {{ nextLabel }} <span class=\"show-for-sr\">{{ screenReaderPageLabel }}</span>\n </span>\n </li>\n\n </ul>\n </pagination-template>\n ";
  229. var DEFAULT_STYLES = "\n.ngx-pagination {\n margin-left: 0;\n margin-bottom: 1rem; }\n .ngx-pagination::before, .ngx-pagination::after {\n content: ' ';\n display: table; }\n .ngx-pagination::after {\n clear: both; }\n .ngx-pagination li {\n -moz-user-select: none;\n -webkit-user-select: none;\n -ms-user-select: none;\n margin-right: 0.0625rem;\n border-radius: 0; }\n .ngx-pagination li {\n display: inline-block; }\n .ngx-pagination a,\n .ngx-pagination button {\n color: #0a0a0a; \n display: block;\n padding: 0.1875rem 0.625rem;\n border-radius: 0; }\n .ngx-pagination a:hover,\n .ngx-pagination button:hover {\n background: #e6e6e6; }\n .ngx-pagination .current {\n padding: 0.1875rem 0.625rem;\n background: #2199e8;\n color: #fefefe;\n cursor: default; }\n .ngx-pagination .disabled {\n padding: 0.1875rem 0.625rem;\n color: #cacaca;\n cursor: default; } \n .ngx-pagination .disabled:hover {\n background: transparent; }\n .ngx-pagination a, .ngx-pagination button {\n cursor: pointer; }\n\n.ngx-pagination .pagination-previous a::before,\n.ngx-pagination .pagination-previous.disabled::before { \n content: '\u00AB';\n display: inline-block;\n margin-right: 0.5rem; }\n\n.ngx-pagination .pagination-next a::after,\n.ngx-pagination .pagination-next.disabled::after {\n content: '\u00BB';\n display: inline-block;\n margin-left: 0.5rem; }\n\n.ngx-pagination .show-for-sr {\n position: absolute !important;\n width: 1px;\n height: 1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0); }\n.ngx-pagination .small-screen {\n display: none; }\n@media screen and (max-width: 601px) {\n .ngx-pagination.responsive .small-screen {\n display: inline-block; } \n .ngx-pagination.responsive li:not(.small-screen):not(.pagination-previous):not(.pagination-next) {\n display: none; }\n}\n ";
  230. var __decorate$2 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
  231. var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  232. if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
  233. else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  234. return c > 3 && r && Object.defineProperty(target, key, r), r;
  235. };
  236. var __metadata$1 = (undefined && undefined.__metadata) || function (k, v) {
  237. if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
  238. };
  239. function coerceToBoolean(input) {
  240. return !!input && input !== 'false';
  241. }
  242. /**
  243. * The default pagination controls component. Actually just a default implementation of a custom template.
  244. */
  245. var PaginationControlsComponent = /** @class */ (function () {
  246. function PaginationControlsComponent() {
  247. this.maxSize = 7;
  248. this.previousLabel = 'Previous';
  249. this.nextLabel = 'Next';
  250. this.screenReaderPaginationLabel = 'Pagination';
  251. this.screenReaderPageLabel = 'page';
  252. this.screenReaderCurrentLabel = "You're on page";
  253. this.pageChange = new core.EventEmitter();
  254. this._directionLinks = true;
  255. this._autoHide = false;
  256. this._responsive = false;
  257. }
  258. Object.defineProperty(PaginationControlsComponent.prototype, "directionLinks", {
  259. get: function () {
  260. return this._directionLinks;
  261. },
  262. set: function (value) {
  263. this._directionLinks = coerceToBoolean(value);
  264. },
  265. enumerable: true,
  266. configurable: true
  267. });
  268. Object.defineProperty(PaginationControlsComponent.prototype, "autoHide", {
  269. get: function () {
  270. return this._autoHide;
  271. },
  272. set: function (value) {
  273. this._autoHide = coerceToBoolean(value);
  274. },
  275. enumerable: true,
  276. configurable: true
  277. });
  278. Object.defineProperty(PaginationControlsComponent.prototype, "responsive", {
  279. get: function () {
  280. return this._responsive;
  281. },
  282. set: function (value) {
  283. this._responsive = coerceToBoolean(value);
  284. },
  285. enumerable: true,
  286. configurable: true
  287. });
  288. __decorate$2([
  289. core.Input(),
  290. __metadata$1("design:type", String)
  291. ], PaginationControlsComponent.prototype, "id", void 0);
  292. __decorate$2([
  293. core.Input(),
  294. __metadata$1("design:type", Number)
  295. ], PaginationControlsComponent.prototype, "maxSize", void 0);
  296. __decorate$2([
  297. core.Input(),
  298. __metadata$1("design:type", Boolean),
  299. __metadata$1("design:paramtypes", [Boolean])
  300. ], PaginationControlsComponent.prototype, "directionLinks", null);
  301. __decorate$2([
  302. core.Input(),
  303. __metadata$1("design:type", Boolean),
  304. __metadata$1("design:paramtypes", [Boolean])
  305. ], PaginationControlsComponent.prototype, "autoHide", null);
  306. __decorate$2([
  307. core.Input(),
  308. __metadata$1("design:type", Boolean),
  309. __metadata$1("design:paramtypes", [Boolean])
  310. ], PaginationControlsComponent.prototype, "responsive", null);
  311. __decorate$2([
  312. core.Input(),
  313. __metadata$1("design:type", String)
  314. ], PaginationControlsComponent.prototype, "previousLabel", void 0);
  315. __decorate$2([
  316. core.Input(),
  317. __metadata$1("design:type", String)
  318. ], PaginationControlsComponent.prototype, "nextLabel", void 0);
  319. __decorate$2([
  320. core.Input(),
  321. __metadata$1("design:type", String)
  322. ], PaginationControlsComponent.prototype, "screenReaderPaginationLabel", void 0);
  323. __decorate$2([
  324. core.Input(),
  325. __metadata$1("design:type", String)
  326. ], PaginationControlsComponent.prototype, "screenReaderPageLabel", void 0);
  327. __decorate$2([
  328. core.Input(),
  329. __metadata$1("design:type", String)
  330. ], PaginationControlsComponent.prototype, "screenReaderCurrentLabel", void 0);
  331. __decorate$2([
  332. core.Output(),
  333. __metadata$1("design:type", core.EventEmitter)
  334. ], PaginationControlsComponent.prototype, "pageChange", void 0);
  335. PaginationControlsComponent = __decorate$2([
  336. core.Component({
  337. selector: 'pagination-controls',
  338. template: DEFAULT_TEMPLATE,
  339. styles: [DEFAULT_STYLES],
  340. changeDetection: core.ChangeDetectionStrategy.OnPush,
  341. encapsulation: core.ViewEncapsulation.None
  342. })
  343. ], PaginationControlsComponent);
  344. return PaginationControlsComponent;
  345. }());
  346. var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
  347. var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  348. if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
  349. else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  350. return c > 3 && r && Object.defineProperty(target, key, r), r;
  351. };
  352. var __metadata$2 = (undefined && undefined.__metadata) || function (k, v) {
  353. if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
  354. };
  355. /**
  356. * This directive is what powers all pagination controls components, including the default one.
  357. * It exposes an API which is hooked up to the PaginationService to keep the PaginatePipe in sync
  358. * with the pagination controls.
  359. */
  360. var PaginationControlsDirective = /** @class */ (function () {
  361. function PaginationControlsDirective(service, changeDetectorRef) {
  362. var _this = this;
  363. this.service = service;
  364. this.changeDetectorRef = changeDetectorRef;
  365. this.maxSize = 7;
  366. this.pageChange = new core.EventEmitter();
  367. this.pages = [];
  368. this.changeSub = this.service.change
  369. .subscribe(function (id) {
  370. if (_this.id === id) {
  371. _this.updatePageLinks();
  372. _this.changeDetectorRef.markForCheck();
  373. _this.changeDetectorRef.detectChanges();
  374. }
  375. });
  376. }
  377. PaginationControlsDirective.prototype.ngOnInit = function () {
  378. if (this.id === undefined) {
  379. this.id = this.service.defaultId();
  380. }
  381. this.updatePageLinks();
  382. };
  383. PaginationControlsDirective.prototype.ngOnChanges = function (changes) {
  384. this.updatePageLinks();
  385. };
  386. PaginationControlsDirective.prototype.ngOnDestroy = function () {
  387. this.changeSub.unsubscribe();
  388. };
  389. /**
  390. * Go to the previous page
  391. */
  392. PaginationControlsDirective.prototype.previous = function () {
  393. this.checkValidId();
  394. this.setCurrent(this.getCurrent() - 1);
  395. };
  396. /**
  397. * Go to the next page
  398. */
  399. PaginationControlsDirective.prototype.next = function () {
  400. this.checkValidId();
  401. this.setCurrent(this.getCurrent() + 1);
  402. };
  403. /**
  404. * Returns true if current page is first page
  405. */
  406. PaginationControlsDirective.prototype.isFirstPage = function () {
  407. return this.getCurrent() === 1;
  408. };
  409. /**
  410. * Returns true if current page is last page
  411. */
  412. PaginationControlsDirective.prototype.isLastPage = function () {
  413. return this.getLastPage() === this.getCurrent();
  414. };
  415. /**
  416. * Set the current page number.
  417. */
  418. PaginationControlsDirective.prototype.setCurrent = function (page) {
  419. this.pageChange.emit(page);
  420. };
  421. /**
  422. * Get the current page number.
  423. */
  424. PaginationControlsDirective.prototype.getCurrent = function () {
  425. return this.service.getCurrentPage(this.id);
  426. };
  427. /**
  428. * Returns the last page number
  429. */
  430. PaginationControlsDirective.prototype.getLastPage = function () {
  431. var inst = this.service.getInstance(this.id);
  432. if (inst.totalItems < 1) {
  433. // when there are 0 or fewer (an error case) items, there are no "pages" as such,
  434. // but it makes sense to consider a single, empty page as the last page.
  435. return 1;
  436. }
  437. return Math.ceil(inst.totalItems / inst.itemsPerPage);
  438. };
  439. PaginationControlsDirective.prototype.getTotalItems = function () {
  440. return this.service.getInstance(this.id).totalItems;
  441. };
  442. PaginationControlsDirective.prototype.checkValidId = function () {
  443. if (this.service.getInstance(this.id).id == null) {
  444. console.warn("PaginationControlsDirective: the specified id \"" + this.id + "\" does not match any registered PaginationInstance");
  445. }
  446. };
  447. /**
  448. * Updates the page links and checks that the current page is valid. Should run whenever the
  449. * PaginationService.change stream emits a value matching the current ID, or when any of the
  450. * input values changes.
  451. */
  452. PaginationControlsDirective.prototype.updatePageLinks = function () {
  453. var _this = this;
  454. var inst = this.service.getInstance(this.id);
  455. var correctedCurrentPage = this.outOfBoundCorrection(inst);
  456. if (correctedCurrentPage !== inst.currentPage) {
  457. setTimeout(function () {
  458. _this.setCurrent(correctedCurrentPage);
  459. _this.pages = _this.createPageArray(inst.currentPage, inst.itemsPerPage, inst.totalItems, _this.maxSize);
  460. });
  461. }
  462. else {
  463. this.pages = this.createPageArray(inst.currentPage, inst.itemsPerPage, inst.totalItems, this.maxSize);
  464. }
  465. };
  466. /**
  467. * Checks that the instance.currentPage property is within bounds for the current page range.
  468. * If not, return a correct value for currentPage, or the current value if OK.
  469. */
  470. PaginationControlsDirective.prototype.outOfBoundCorrection = function (instance) {
  471. var totalPages = Math.ceil(instance.totalItems / instance.itemsPerPage);
  472. if (totalPages < instance.currentPage && 0 < totalPages) {
  473. return totalPages;
  474. }
  475. else if (instance.currentPage < 1) {
  476. return 1;
  477. }
  478. return instance.currentPage;
  479. };
  480. /**
  481. * Returns an array of Page objects to use in the pagination controls.
  482. */
  483. PaginationControlsDirective.prototype.createPageArray = function (currentPage, itemsPerPage, totalItems, paginationRange) {
  484. // paginationRange could be a string if passed from attribute, so cast to number.
  485. paginationRange = +paginationRange;
  486. var pages = [];
  487. var totalPages = Math.ceil(totalItems / itemsPerPage);
  488. var halfWay = Math.ceil(paginationRange / 2);
  489. var isStart = currentPage <= halfWay;
  490. var isEnd = totalPages - halfWay < currentPage;
  491. var isMiddle = !isStart && !isEnd;
  492. var ellipsesNeeded = paginationRange < totalPages;
  493. var i = 1;
  494. while (i <= totalPages && i <= paginationRange) {
  495. var label = void 0;
  496. var pageNumber = this.calculatePageNumber(i, currentPage, paginationRange, totalPages);
  497. var openingEllipsesNeeded = (i === 2 && (isMiddle || isEnd));
  498. var closingEllipsesNeeded = (i === paginationRange - 1 && (isMiddle || isStart));
  499. if (ellipsesNeeded && (openingEllipsesNeeded || closingEllipsesNeeded)) {
  500. label = '...';
  501. }
  502. else {
  503. label = pageNumber;
  504. }
  505. pages.push({
  506. label: label,
  507. value: pageNumber
  508. });
  509. i++;
  510. }
  511. return pages;
  512. };
  513. /**
  514. * Given the position in the sequence of pagination links [i],
  515. * figure out what page number corresponds to that position.
  516. */
  517. PaginationControlsDirective.prototype.calculatePageNumber = function (i, currentPage, paginationRange, totalPages) {
  518. var halfWay = Math.ceil(paginationRange / 2);
  519. if (i === paginationRange) {
  520. return totalPages;
  521. }
  522. else if (i === 1) {
  523. return i;
  524. }
  525. else if (paginationRange < totalPages) {
  526. if (totalPages - halfWay < currentPage) {
  527. return totalPages - paginationRange + i;
  528. }
  529. else if (halfWay < currentPage) {
  530. return currentPage - halfWay + i;
  531. }
  532. else {
  533. return i;
  534. }
  535. }
  536. else {
  537. return i;
  538. }
  539. };
  540. __decorate$3([
  541. core.Input(),
  542. __metadata$2("design:type", String)
  543. ], PaginationControlsDirective.prototype, "id", void 0);
  544. __decorate$3([
  545. core.Input(),
  546. __metadata$2("design:type", Number)
  547. ], PaginationControlsDirective.prototype, "maxSize", void 0);
  548. __decorate$3([
  549. core.Output(),
  550. __metadata$2("design:type", core.EventEmitter)
  551. ], PaginationControlsDirective.prototype, "pageChange", void 0);
  552. PaginationControlsDirective = __decorate$3([
  553. core.Directive({
  554. selector: 'pagination-template,[pagination-template]',
  555. exportAs: 'paginationApi'
  556. }),
  557. __metadata$2("design:paramtypes", [PaginationService,
  558. core.ChangeDetectorRef])
  559. ], PaginationControlsDirective);
  560. return PaginationControlsDirective;
  561. }());
  562. var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
  563. var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  564. if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
  565. else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  566. return c > 3 && r && Object.defineProperty(target, key, r), r;
  567. };
  568. var NgxPaginationModule = /** @class */ (function () {
  569. function NgxPaginationModule() {
  570. }
  571. NgxPaginationModule = __decorate([
  572. core.NgModule({
  573. imports: [common.CommonModule],
  574. declarations: [
  575. PaginatePipe,
  576. PaginationControlsComponent,
  577. PaginationControlsDirective
  578. ],
  579. providers: [PaginationService],
  580. exports: [PaginatePipe, PaginationControlsComponent, PaginationControlsDirective]
  581. })
  582. ], NgxPaginationModule);
  583. return NgxPaginationModule;
  584. }());
  585. /**
  586. * Generated bundle index. Do not edit.
  587. */
  588. exports.ɵb = DEFAULT_STYLES;
  589. exports.ɵa = DEFAULT_TEMPLATE;
  590. exports.NgxPaginationModule = NgxPaginationModule;
  591. exports.PaginationService = PaginationService;
  592. exports.PaginationControlsComponent = PaginationControlsComponent;
  593. exports.PaginationControlsDirective = PaginationControlsDirective;
  594. exports.PaginatePipe = PaginatePipe;
  595. Object.defineProperty(exports, '__esModule', { value: true });
  596. })));