123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398 |
- /**
- * simplePagination.js v1.6
- * A simple jQuery pagination plugin.
- * http://flaviusmatis.github.com/simplePagination.js/
- *
- * Copyright 2012, Flavius Matis
- * Released under the MIT license.
- * http://flaviusmatis.github.com/license.html
- */
- (function($){
- var methods = {
- init: function(options) {
- var o = $.extend({
- items: 1,
- itemsOnPage: 1,
- pages: 0,
- displayedPages: 5,
- edges: 2,
- currentPage: 0,
- useAnchors: true,
- hrefTextPrefix: '#page-',
- hrefTextSuffix: '',
- prevText: 'Prev',
- nextText: 'Next',
- ellipseText: '…',
- ellipsePageSet: true,
- cssStyle: 'light-theme',
- listStyle: '',
- labelMap: [],
- selectOnClick: true,
- nextAtFront: false,
- invertPageOrder: false,
- useStartEdge : true,
- useEndEdge : true,
- onPageClick: function(pageNumber, event) {
- // Callback triggered when a page is clicked
- // Page number is given as an optional parameter
- },
- onInit: function() {
- // Callback triggered immediately after initialization
- }
- }, options || {});
- var self = this;
- o.pages = o.pages ? o.pages : Math.ceil(o.items / o.itemsOnPage) ? Math.ceil(o.items / o.itemsOnPage) : 1;
- if (o.currentPage)
- o.currentPage = o.currentPage - 1;
- else
- o.currentPage = !o.invertPageOrder ? 0 : o.pages - 1;
- o.halfDisplayed = o.displayedPages / 2;
- this.each(function() {
- self.addClass(o.cssStyle + ' simple-pagination').data('pagination', o);
- methods._draw.call(self);
- });
- o.onInit();
- return this;
- },
- selectPage: function(page) {
- methods._selectPage.call(this, page - 1);
- return this;
- },
- prevPage: function() {
- var o = this.data('pagination');
- if (!o.invertPageOrder) {
- if (o.currentPage > 0) {
- methods._selectPage.call(this, o.currentPage - 1);
- }
- } else {
- if (o.currentPage < o.pages - 1) {
- methods._selectPage.call(this, o.currentPage + 1);
- }
- }
- return this;
- },
- nextPage: function() {
- var o = this.data('pagination');
- if (!o.invertPageOrder) {
- if (o.currentPage < o.pages - 1) {
- methods._selectPage.call(this, o.currentPage + 1);
- }
- } else {
- if (o.currentPage > 0) {
- methods._selectPage.call(this, o.currentPage - 1);
- }
- }
- return this;
- },
- getPagesCount: function() {
- return this.data('pagination').pages;
- },
- setPagesCount: function(count) {
- this.data('pagination').pages = count;
- },
- getCurrentPage: function () {
- return this.data('pagination').currentPage + 1;
- },
- destroy: function(){
- this.empty();
- return this;
- },
- drawPage: function (page) {
- var o = this.data('pagination');
- o.currentPage = page - 1;
- this.data('pagination', o);
- methods._draw.call(this);
- return this;
- },
- redraw: function(){
- methods._draw.call(this);
- return this;
- },
- disable: function(){
- var o = this.data('pagination');
- o.disabled = true;
- this.data('pagination', o);
- methods._draw.call(this);
- return this;
- },
- enable: function(){
- var o = this.data('pagination');
- o.disabled = false;
- this.data('pagination', o);
- methods._draw.call(this);
- return this;
- },
- updateItems: function (newItems) {
- var o = this.data('pagination');
- o.items = newItems;
- o.pages = methods._getPages(o);
- this.data('pagination', o);
- methods._draw.call(this);
- },
- updateItemsOnPage: function (itemsOnPage) {
- var o = this.data('pagination');
- o.itemsOnPage = itemsOnPage;
- o.pages = methods._getPages(o);
- this.data('pagination', o);
- methods._selectPage.call(this, 0);
- return this;
- },
- getItemsOnPage: function() {
- return this.data('pagination').itemsOnPage;
- },
- _draw: function() {
- var o = this.data('pagination'),
- interval = methods._getInterval(o),
- i,
- tagName;
- methods.destroy.call(this);
- tagName = (typeof this.prop === 'function') ? this.prop('tagName') : this.attr('tagName');
- var $panel = tagName === 'UL' ? this : $('<ul' + (o.listStyle ? ' class="' + o.listStyle + '"' : '') + '></ul>').appendTo(this);
- // Generate Prev link
- if (o.prevText) {
- methods._appendItem.call(this, !o.invertPageOrder ? o.currentPage - 1 : o.currentPage + 1, {text: o.prevText, classes: 'prev'});
- }
- // Generate Next link (if option set for at front)
- if (o.nextText && o.nextAtFront) {
- methods._appendItem.call(this, !o.invertPageOrder ? o.currentPage + 1 : o.currentPage - 1, {text: o.nextText, classes: 'next'});
- }
- // Generate start edges
- if (!o.invertPageOrder) {
- if (interval.start > 0 && o.edges > 0) {
- if(o.useStartEdge) {
- var end = Math.min(o.edges, interval.start);
- for (i = 0; i < end; i++) {
- methods._appendItem.call(this, i);
- }
- }
- if (o.edges < interval.start && (interval.start - o.edges != 1)) {
- $panel.append('<li class="disabled"><span class="ellipse">' + o.ellipseText + '</span></li>');
- } else if (interval.start - o.edges == 1) {
- methods._appendItem.call(this, o.edges);
- }
- }
- } else {
- if (interval.end < o.pages && o.edges > 0) {
- if(o.useStartEdge) {
- var begin = Math.max(o.pages - o.edges, interval.end);
- for (i = o.pages - 1; i >= begin; i--) {
- methods._appendItem.call(this, i);
- }
- }
- if (o.pages - o.edges > interval.end && (o.pages - o.edges - interval.end != 1)) {
- $panel.append('<li class="disabled"><span class="ellipse">' + o.ellipseText + '</span></li>');
- } else if (o.pages - o.edges - interval.end == 1) {
- methods._appendItem.call(this, interval.end);
- }
- }
- }
- // Generate interval links
- if (!o.invertPageOrder) {
- for (i = interval.start; i < interval.end; i++) {
- methods._appendItem.call(this, i);
- }
- } else {
- for (i = interval.end - 1; i >= interval.start; i--) {
- methods._appendItem.call(this, i);
- }
- }
- // Generate end edges
- if (!o.invertPageOrder) {
- if (interval.end < o.pages && o.edges > 0) {
- if (o.pages - o.edges > interval.end && (o.pages - o.edges - interval.end != 1)) {
- $panel.append('<li class="disabled"><span class="ellipse">' + o.ellipseText + '</span></li>');
- } else if (o.pages - o.edges - interval.end == 1) {
- methods._appendItem.call(this, interval.end);
- }
- if(o.useEndEdge) {
- var begin = Math.max(o.pages - o.edges, interval.end);
- for (i = begin; i < o.pages; i++) {
- methods._appendItem.call(this, i);
- }
- }
- }
- } else {
- if (interval.start > 0 && o.edges > 0) {
- if (o.edges < interval.start && (interval.start - o.edges != 1)) {
- $panel.append('<li class="disabled"><span class="ellipse">' + o.ellipseText + '</span></li>');
- } else if (interval.start - o.edges == 1) {
- methods._appendItem.call(this, o.edges);
- }
- if(o.useEndEdge) {
- var end = Math.min(o.edges, interval.start);
- for (i = end - 1; i >= 0; i--) {
- methods._appendItem.call(this, i);
- }
- }
- }
- }
- // Generate Next link (unless option is set for at front)
- if (o.nextText && !o.nextAtFront) {
- methods._appendItem.call(this, !o.invertPageOrder ? o.currentPage + 1 : o.currentPage - 1, {text: o.nextText, classes: 'next'});
- }
- if (o.ellipsePageSet && !o.disabled) {
- methods._ellipseClick.call(this, $panel);
- }
- },
- _getPages: function(o) {
- var pages = Math.ceil(o.items / o.itemsOnPage);
- return pages || 1;
- },
- _getInterval: function(o) {
- return {
- start: Math.ceil(o.currentPage > o.halfDisplayed ? Math.max(Math.min(o.currentPage - o.halfDisplayed, (o.pages - o.displayedPages)), 0) : 0),
- end: Math.ceil(o.currentPage > o.halfDisplayed ? Math.min(o.currentPage + o.halfDisplayed, o.pages) : Math.min(o.displayedPages, o.pages))
- };
- },
- _appendItem: function(pageIndex, opts) {
- var self = this, options, $link, o = self.data('pagination'), $linkWrapper = $('<li></li>'), $ul = self.find('ul');
- pageIndex = pageIndex < 0 ? 0 : (pageIndex < o.pages ? pageIndex : o.pages - 1);
- options = {
- text: pageIndex + 1,
- classes: ''
- };
- if (o.labelMap.length && o.labelMap[pageIndex]) {
- options.text = o.labelMap[pageIndex];
- }
- options = $.extend(options, opts || {});
- if (pageIndex == o.currentPage || o.disabled) {
- if (o.disabled || options.classes === 'prev' || options.classes === 'next') {
- $linkWrapper.addClass('disabled');
- } else {
- $linkWrapper.addClass('active');
- }
- $link = $('<span class="current">' + (options.text) + '</span>');
- } else {
- if (o.useAnchors) {
- $link = $('<a href="' + o.hrefTextPrefix + (pageIndex + 1) + o.hrefTextSuffix + '" class="page-link">' + (options.text) + '</a>');
- } else {
- $link = $('<span >' + (options.text) + '</span>');
- }
- $link.click(function(event){
- return methods._selectPage.call(self, pageIndex, event);
- });
- }
- if (options.classes) {
- $link.addClass(options.classes);
- }
- $linkWrapper.append($link);
- if ($ul.length) {
- $ul.append($linkWrapper);
- } else {
- self.append($linkWrapper);
- }
- },
- _selectPage: function(pageIndex, event) {
- var o = this.data('pagination');
- o.currentPage = pageIndex;
- if (o.selectOnClick) {
- methods._draw.call(this);
- }
- return o.onPageClick(pageIndex + 1, event);
- },
- _ellipseClick: function($panel) {
- var self = this,
- o = this.data('pagination'),
- $ellip = $panel.find('.ellipse');
- $ellip.addClass('clickable').parent().removeClass('disabled');
- $ellip.click(function(event) {
- if (!o.disable) {
- var $this = $(this),
- val = (parseInt($this.parent().prev().text(), 10) || 0) + 1;
- $this
- .html('<input type="number" min="1" max="' + o.pages + '" step="1" value="' + val + '">')
- .find('input')
- .focus()
- .click(function(event) {
- // prevent input number arrows from bubbling a click event on $ellip
- event.stopPropagation();
- })
- .keyup(function(event) {
- var val = $(this).val();
- if (event.which === 13 && val !== '') {
- // enter to accept
- if ((val>0)&&(val<=o.pages))
- methods._selectPage.call(self, val - 1);
- } else if (event.which === 27) {
- // escape to cancel
- $ellip.empty().html(o.ellipseText);
- }
- })
- .bind('blur', function(event) {
- var val = $(this).val();
- if (val !== '') {
- methods._selectPage.call(self, val - 1);
- }
- $ellip.empty().html(o.ellipseText);
- return false;
- });
- }
- return false;
- });
- }
- };
- $.fn.pagination = function(method) {
- // Method calling logic
- if (methods[method] && method.charAt(0) != '_') {
- return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
- } else if (typeof method === 'object' || !method) {
- return methods.init.apply(this, arguments);
- } else {
- $.error('Method ' + method + ' does not exist on jQuery.pagination');
- }
- };
- })(jQuery);
|