/* * FooTable v3 - FooTable is a jQuery plugin that aims to make HTML tables on smaller devices look awesome. * @version 3.1.4 * @link http://fooplugins.com * @copyright Steven Usher & Brad Vincent 2015 * @license Released under the GPLv3 license. */ (function($, F){ F.Pager = F.Class.extend(/** @lends FooTable.Pager */{ /** * The pager object contains the page number and direction to page to. * @constructs * @extends FooTable.Class * @param {number} total - The total number of pages available. * @param {number} current - The current page number. * @param {number} size - The number of rows per page. * @param {number} page - The page number to goto. * @param {boolean} forward - A boolean indicating the direction of paging, TRUE = forward, FALSE = back. * @returns {FooTable.Pager} */ construct: function(total, current, size, page, forward){ /** * The total number of pages available. * @type {number} */ this.total = total; /** * The current page number. * @type {number} */ this.current = current; /** * The number of rows per page. * @type {number} */ this.size = size; /** * The page number to goto. * @type {number} */ this.page = page; /** * A boolean indicating the direction of paging, TRUE = forward, FALSE = back. * @type {boolean} */ this.forward = forward; } }); })(jQuery, FooTable); (function($, F){ F.Paging = F.Component.extend(/** @lends FooTable.Paging */{ /** * The paging component adds a pagination control to the table allowing users to navigate table rows via pages. * @constructs * @extends FooTable.Component * @param {FooTable.Table} table - The parent {@link FooTable.Table} object for the component. * @returns {FooTable.Filtering} */ construct: function(table){ // call the base constructor this._super(table, table.o.paging.enabled); /* PROTECTED */ /** * An object containing the strings used by the paging buttons. * @type {{ first: string, prev: string, next: string, last: string }} */ this.strings = table.o.paging.strings; /* PUBLIC */ /** * The current page number to display. * @instance * @type {number} */ this.current = table.o.paging.current; /** * The number of rows to display per page. * @instance * @type {number} */ this.size = table.o.paging.size; /** * The maximum number of page links to display at once. * @instance * @type {number} */ this.limit = table.o.paging.limit; /** * The position of the pagination control within the paging rows cell. * @instance * @type {string} */ this.position = table.o.paging.position; /** * The format string used to generate the text displayed under the pagination control. * @instance * @type {string} */ this.countFormat = table.o.paging.countFormat; /** * The total number of pages. * @instance * @type {number} */ this.total = -1; /** * The number of rows in the {@link FooTable.Rows#array} before paging is applied. * @instance * @type {number} */ this.totalRows = 0; /** * A number indicating the previous page displayed. * @instance * @type {number} */ this.previous = -1; /** * The count string generated using the {@link FooTable.Filtering#countFormat} option. This value is only set after the first call to the {@link FooTable.Filtering#predraw} method. * @instance * @type {string} */ this.formattedCount = null; /** * The jQuery row object that contains all the paging specific elements. * @instance * @type {jQuery} */ this.$row = null; /** * The jQuery cell object that contains the pagination control and total count. * @instance * @type {jQuery} */ this.$cell = null; /** * The jQuery object that contains the links for the pagination control. * @instance * @type {jQuery} */ this.$pagination = null; /** * The jQuery object that contains the row count. * @instance * @type {jQuery} */ this.$count = null; /** * Whether or not the pagination row is detached from the table. * @instance * @type {boolean} */ this.detached = true; /* PRIVATE */ /** * Used to hold the number of page links created. * @instance * @type {number} * @private */ this._createdLinks = 0; }, /* PROTECTED */ /** * Checks the supplied data and options for the paging component. * @instance * @protected * @param {object} data - The jQuery data object from the parent table. * @fires FooTable.Paging#"preinit.ft.paging" */ preinit: function(data){ var self = this; /** * The preinit.ft.paging event is raised before the UI is created and provides the tables jQuery data object for additional options parsing. * Calling preventDefault on this event will disable the component. * @event FooTable.Paging#"preinit.ft.paging" * @param {jQuery.Event} e - The jQuery.Event object for the event. * @param {FooTable.Table} ft - The instance of the plugin raising the event. * @param {object} data - The jQuery data object of the table raising the event. */ this.ft.raise('preinit.ft.paging', [data]).then(function(){ if (self.ft.$el.hasClass('footable-paging')) self.enabled = true; self.enabled = F.is.boolean(data.paging) ? data.paging : self.enabled; if (!self.enabled) return; self.size = F.is.number(data.pagingSize) ? data.pagingSize : self.size; self.current = F.is.number(data.pagingCurrent) ? data.pagingCurrent : self.current; self.limit = F.is.number(data.pagingLimit) ? data.pagingLimit : self.limit; if (self.ft.$el.hasClass('footable-paging-left')) self.position = 'left'; if (self.ft.$el.hasClass('footable-paging-center')) self.position = 'center'; if (self.ft.$el.hasClass('footable-paging-right')) self.position = 'right'; self.position = F.is.string(data.pagingPosition) ? data.pagingPosition : self.position; self.countFormat = F.is.string(data.pagingCountFormat) ? data.pagingCountFormat : self.countFormat; self.total = Math.ceil(self.ft.rows.all.length / self.size); }, function(){ self.enabled = false; }); }, /** * Initializes the paging component for the plugin using the supplied table and options. * @instance * @protected * @fires FooTable.Paging#"init.ft.paging" */ init: function(){ /** * The init.ft.paging event is raised before its UI is generated. * Calling preventDefault on this event will disable the component. * @event FooTable.Paging#"init.ft.paging" * @param {jQuery.Event} e - The jQuery.Event object for the event. * @param {FooTable.Table} ft - The instance of the plugin raising the event. */ var self = this; this.ft.raise('init.ft.paging').then(function(){ self.$create(); }, function(){ self.enabled = false; }); }, /** * Destroys the paging component removing any UI generated from the table. * @instance * @protected * @fires FooTable.Paging#"destroy.ft.paging" */ destroy: function () { /** * The destroy.ft.paging event is raised before its UI is removed. * Calling preventDefault on this event will prevent the component from being destroyed. * @event FooTable.Paging#"destroy.ft.paging" * @param {jQuery.Event} e - The jQuery.Event object for the event. * @param {FooTable.Table} ft - The instance of the plugin raising the event. */ var self = this; this.ft.raise('destroy.ft.paging').then(function(){ self.ft.$el.removeClass('footable-paging') .find('tfoot > tr.footable-paging').remove(); self.detached = true; self._createdLinks = 0; }); }, /** * Performs the actual paging against the {@link FooTable.Rows#current} array removing all rows that are not on the current visible page. * @instance * @protected */ predraw: function(){ this.total = Math.ceil(this.ft.rows.array.length / this.size); this.current = this.current > this.total ? this.total : (this.current < 1 ? 1 : this.current); this.totalRows = this.ft.rows.array.length; if (this.totalRows > this.size){ this.ft.rows.array = this.ft.rows.array.splice((this.current - 1) * this.size, this.size); } this.formattedCount = this.format(this.countFormat); }, /** * Updates the paging UI setting the state of the pagination control. * @instance * @protected */ draw: function(){ if (this.total <= 1){ if (!this.detached){ this.$row.detach(); this.detached = true; } } else { if (this.detached){ var $tfoot = this.ft.$el.children('tfoot'); if ($tfoot.length == 0){ $tfoot = $(''); this.ft.$el.append($tfoot); } this.$row.appendTo($tfoot); this.detached = false; } this.$cell.attr('colspan', this.ft.columns.visibleColspan); this._createLinks(); this._setVisible(this.current, this.current > this.previous); this._setNavigation(true); this.$count.text(this.formattedCount); } }, /** * Creates the paging UI from the current options setting the various jQuery properties of this component. * @instance * @protected */ $create: function(){ this._createdLinks = 0; var position = 'footable-paging-center'; switch (this.position){ case 'left': position = 'footable-paging-left'; break; case 'right': position = 'footable-paging-right'; break; } this.ft.$el.addClass('footable-paging').addClass(position); this.$cell = $('').attr('colspan', this.ft.columns.visibleColspan); var $tfoot = this.ft.$el.children('tfoot'); if ($tfoot.length == 0){ $tfoot = $(''); this.ft.$el.append($tfoot); } this.$row = $('', { 'class': 'footable-paging' }).append(this.$cell).appendTo($tfoot); this.$pagination = $('