Added assets + dependencies

This commit is contained in:
Bill Zimmerman
2015-02-25 14:08:14 +01:00
parent cb37f12f56
commit d5678d622e
748 changed files with 154165 additions and 0 deletions

View File

@@ -0,0 +1,160 @@
/*
* This plug-in adds another pagination option similar to `full_numbers`, except
* it adds ellipses around the page numbers when applicable. You can set how
* many page numbers should be displayed with the iShowPages option.
*
* This plug- in extends the oStdClasses object with the following properties:
* sPageEllipsis, sPageNumber and sPageNumbers.
*
* It also extends the oSettings object with the following properties:
* _iShowPages, _iShowPagesHalf, _iCurrentPage, _iTotalPages, _iFirstPage and
* _iLastPage.
*
* Note that DataTables 1.10 has this ability built in. As such, this plug-ins
* has been marked as deprecated, but may still be useful for if you are using
* an old version of DataTables.
*
* @name Ellipses
* @summary Show ellipses in the pagination control where there is a gap in numbers
* @deprecated
* @author [Dave Kennedy](http://daveden.wordpress.com/)
* @example
* $(document).ready(function() {
* $('#example').dataTable({
* 'sPaginationType': 'ellipses'
* });
* });
*/
$.extend($.fn.dataTableExt.oStdClasses, {
'sPageEllipsis': 'paginate_ellipsis',
'sPageNumber': 'paginate_number',
'sPageNumbers': 'paginate_numbers'
});
$.fn.dataTableExt.oPagination.ellipses = {
'oDefaults': {
'iShowPages': 5
},
'fnClickHandler': function(e) {
var fnCallbackDraw = e.data.fnCallbackDraw,
oSettings = e.data.oSettings,
sPage = e.data.sPage;
if ($(this).is('[disabled]')) {
return false;
}
oSettings.oApi._fnPageChange(oSettings, sPage);
fnCallbackDraw(oSettings);
return true;
},
// fnInit is called once for each instance of pager
'fnInit': function(oSettings, nPager, fnCallbackDraw) {
var oClasses = oSettings.oClasses,
oLang = oSettings.oLanguage.oPaginate,
that = this;
var iShowPages = oSettings.oInit.iShowPages || this.oDefaults.iShowPages,
iShowPagesHalf = Math.floor(iShowPages / 2);
$.extend(oSettings, {
_iShowPages: iShowPages,
_iShowPagesHalf: iShowPagesHalf,
});
var oFirst = $('<a class="' + oClasses.sPageButton + ' ' + oClasses.sPageFirst + '">' + oLang.sFirst + '</a>'),
oPrevious = $('<a class="' + oClasses.sPageButton + ' ' + oClasses.sPagePrevious + '">' + oLang.sPrevious + '</a>'),
oNumbers = $('<span class="' + oClasses.sPageNumbers + '"></span>'),
oNext = $('<a class="' + oClasses.sPageButton + ' ' + oClasses.sPageNext + '">' + oLang.sNext + '</a>'),
oLast = $('<a class="' + oClasses.sPageButton + ' ' + oClasses.sPageLast + '">' + oLang.sLast + '</a>');
oFirst.click({ 'fnCallbackDraw': fnCallbackDraw, 'oSettings': oSettings, 'sPage': 'first' }, that.fnClickHandler);
oPrevious.click({ 'fnCallbackDraw': fnCallbackDraw, 'oSettings': oSettings, 'sPage': 'previous' }, that.fnClickHandler);
oNext.click({ 'fnCallbackDraw': fnCallbackDraw, 'oSettings': oSettings, 'sPage': 'next' }, that.fnClickHandler);
oLast.click({ 'fnCallbackDraw': fnCallbackDraw, 'oSettings': oSettings, 'sPage': 'last' }, that.fnClickHandler);
// Draw
$(nPager).append(oFirst, oPrevious, oNumbers, oNext, oLast);
},
// fnUpdate is only called once while table is rendered
'fnUpdate': function(oSettings, fnCallbackDraw) {
var oClasses = oSettings.oClasses,
that = this;
var tableWrapper = oSettings.nTableWrapper;
// Update stateful properties
this.fnUpdateState(oSettings);
if (oSettings._iCurrentPage === 1) {
$('.' + oClasses.sPageFirst, tableWrapper).attr('disabled', true);
$('.' + oClasses.sPagePrevious, tableWrapper).attr('disabled', true);
} else {
$('.' + oClasses.sPageFirst, tableWrapper).removeAttr('disabled');
$('.' + oClasses.sPagePrevious, tableWrapper).removeAttr('disabled');
}
if (oSettings._iTotalPages === 0 || oSettings._iCurrentPage === oSettings._iTotalPages) {
$('.' + oClasses.sPageNext, tableWrapper).attr('disabled', true);
$('.' + oClasses.sPageLast, tableWrapper).attr('disabled', true);
} else {
$('.' + oClasses.sPageNext, tableWrapper).removeAttr('disabled');
$('.' + oClasses.sPageLast, tableWrapper).removeAttr('disabled');
}
var i, oNumber, oNumbers = $('.' + oClasses.sPageNumbers, tableWrapper);
// Erase
oNumbers.html('');
for (i = oSettings._iFirstPage; i <= oSettings._iLastPage; i++) {
oNumber = $('<a class="' + oClasses.sPageButton + ' ' + oClasses.sPageNumber + '">' + oSettings.fnFormatNumber(i) + '</a>');
if (oSettings._iCurrentPage === i) {
oNumber.attr('active', true).attr('disabled', true);
} else {
oNumber.click({ 'fnCallbackDraw': fnCallbackDraw, 'oSettings': oSettings, 'sPage': i - 1 }, that.fnClickHandler);
}
// Draw
oNumbers.append(oNumber);
}
// Add ellipses
if (1 < oSettings._iFirstPage) {
oNumbers.prepend('<span class="' + oClasses.sPageEllipsis + '">...</span>');
}
if (oSettings._iLastPage < oSettings._iTotalPages) {
oNumbers.append('<span class="' + oClasses.sPageEllipsis + '">...</span>');
}
},
// fnUpdateState used to be part of fnUpdate
// The reason for moving is so we can access current state info before fnUpdate is called
'fnUpdateState': function(oSettings) {
var iCurrentPage = Math.ceil((oSettings._iDisplayStart + 1) / oSettings._iDisplayLength),
iTotalPages = Math.ceil(oSettings.fnRecordsDisplay() / oSettings._iDisplayLength),
iFirstPage = iCurrentPage - oSettings._iShowPagesHalf,
iLastPage = iCurrentPage + oSettings._iShowPagesHalf;
if (iTotalPages < oSettings._iShowPages) {
iFirstPage = 1;
iLastPage = iTotalPages;
} else if (iFirstPage < 1) {
iFirstPage = 1;
iLastPage = oSettings._iShowPages;
} else if (iLastPage > iTotalPages) {
iFirstPage = (iTotalPages - oSettings._iShowPages) + 1;
iLastPage = iTotalPages;
}
$.extend(oSettings, {
_iCurrentPage: iCurrentPage,
_iTotalPages: iTotalPages,
_iFirstPage: iFirstPage,
_iLastPage: iLastPage
});
}
};

View File

@@ -0,0 +1,137 @@
/**
* This pagination plug-in provides pagination controls for DataTables which
* match the style and interaction of the ExtJS library's grid component.
*
* @name ExtJS style
* @summary Pagination in the styling of ExtJS
* @author [Zach Curtis](http://zachariahtimothy.wordpress.com/)
*
* @example
* $(document).ready(function() {
* $('#example').dataTable( {
* "sPaginationType": "extStyle"
* } );
* } );
*/
$.fn.dataTableExt.oApi.fnExtStylePagingInfo = function ( oSettings )
{
return {
"iStart": oSettings._iDisplayStart,
"iEnd": oSettings.fnDisplayEnd(),
"iLength": oSettings._iDisplayLength,
"iTotal": oSettings.fnRecordsTotal(),
"iFilteredTotal": oSettings.fnRecordsDisplay(),
"iPage": oSettings._iDisplayLength === -1 ?
0 : Math.ceil( oSettings._iDisplayStart / oSettings._iDisplayLength ),
"iTotalPages": oSettings._iDisplayLength === -1 ?
0 : Math.ceil( oSettings.fnRecordsDisplay() / oSettings._iDisplayLength )
};
};
$.fn.dataTableExt.oPagination.extStyle = {
"fnInit": function (oSettings, nPaging, fnCallbackDraw) {
var oPaging = oSettings.oInstance.fnExtStylePagingInfo();
nFirst = $('<span/>', { 'class': 'paginate_button first' , text : "<<" });
nPrevious = $('<span/>', { 'class': 'paginate_button previous' , text : "<" });
nNext = $('<span/>', { 'class': 'paginate_button next' , text : ">" });
nLast = $('<span/>', { 'class': 'paginate_button last' , text : ">>" });
nPageTxt = $("<span />", { text: 'Page' });
nPageNumBox = $('<input />', { type: 'text', val: 1, 'class': 'pageinate_input_box' });
nPageOf = $('<span />', { text: '/' });
nTotalPages = $('<span />', { class : "paginate_total" , text : oPaging.iTotalPages });
$(nPaging)
.append(nFirst)
.append(nPrevious)
.append(nPageTxt)
.append(nPageNumBox)
.append(nPageOf)
.append(nTotalPages)
.append(nNext)
.append(nLast);
nFirst.click(function () {
if( $(this).hasClass("disabled") )
return;
oSettings.oApi._fnPageChange(oSettings, "first");
fnCallbackDraw(oSettings);
}).bind('selectstart', function () { return false; });
nPrevious.click(function () {
if( $(this).hasClass("disabled") )
return;
oSettings.oApi._fnPageChange(oSettings, "previous");
fnCallbackDraw(oSettings);
}).bind('selectstart', function () { return false; });
nNext.click(function () {
if( $(this).hasClass("disabled") )
return;
oSettings.oApi._fnPageChange(oSettings, "next");
fnCallbackDraw(oSettings);
}).bind('selectstart', function () { return false; });
nLast.click(function () {
if( $(this).hasClass("disabled") )
return;
oSettings.oApi._fnPageChange(oSettings, "last");
fnCallbackDraw(oSettings);
}).bind('selectstart', function () { return false; });
nPageNumBox.change(function () {
var pageValue = parseInt($(this).val(), 10) - 1 ; // -1 because pages are 0 indexed, but the UI is 1
var oPaging = oSettings.oInstance.fnPagingInfo();
if(pageValue === NaN || pageValue<0 ){
pageValue = 0;
}else if(pageValue >= oPaging.iTotalPages ){
pageValue = oPaging.iTotalPages -1;
}
oSettings.oApi._fnPageChange(oSettings, pageValue);
fnCallbackDraw(oSettings);
});
},
"fnUpdate": function (oSettings, fnCallbackDraw) {
if (!oSettings.aanFeatures.p) {
return;
}
var oPaging = oSettings.oInstance.fnExtStylePagingInfo();
/* Loop over each instance of the pager */
var an = oSettings.aanFeatures.p;
$(an).find('span.paginate_total').html(oPaging.iTotalPages);
$(an).find('.pageinate_input_box').val(oPaging.iPage+1);
$(an).each(function(index,item) {
var $item = $(item);
if (oPaging.iPage == 0) {
var prev = $item.find('span.paginate_button.first').add($item.find('span.paginate_button.previous'));
prev.addClass("disabled");
}else {
var prev = $item.find('span.paginate_button.first').add($item.find('span.paginate_button.previous'));
prev.removeClass("disabled");
}
if (oPaging.iPage+1 == oPaging.iTotalPages) {
var next = $item.find('span.paginate_button.last').add($item.find('span.paginate_button.next'));
next.addClass("disabled");
}else {
var next = $item.find('span.paginate_button.last').add($item.find('span.paginate_button.next'));
next.removeClass("disabled");
}
});
}
};

View File

@@ -0,0 +1,110 @@
/**
* The built-in pagination functions provide either two buttons (forward / back)
* or lots of buttons (forward, back, first, last and individual pages). This
* plug-in meets the two in the middle providing navigation controls for
* forward, back, first and last.
*
* DataTables has this ability built in using the `dt-string full` option of
* the `dt-init pagingType` initialisation option. As such, this plug-in is
* marked as deprecated.
*
* @name Four button navigation
* @summary Display forward, back, first and last buttons.
* @deprecated
* @author [Allan Jardine](http://sprymedia.co.uk)
*
* @example
* $(document).ready(function() {
* $('#example').dataTable( {
* "sPaginationType": "four_button"
* } );
* } );
*/
$.fn.dataTableExt.oPagination.four_button = {
"fnInit": function ( oSettings, nPaging, fnCallbackDraw )
{
var nFirst = document.createElement( 'span' );
var nPrevious = document.createElement( 'span' );
var nNext = document.createElement( 'span' );
var nLast = document.createElement( 'span' );
nFirst.appendChild( document.createTextNode( oSettings.oLanguage.oPaginate.sFirst ) );
nPrevious.appendChild( document.createTextNode( oSettings.oLanguage.oPaginate.sPrevious ) );
nNext.appendChild( document.createTextNode( oSettings.oLanguage.oPaginate.sNext ) );
nLast.appendChild( document.createTextNode( oSettings.oLanguage.oPaginate.sLast ) );
nFirst.className = "paginate_button first";
nPrevious.className = "paginate_button previous";
nNext.className="paginate_button next";
nLast.className = "paginate_button last";
nPaging.appendChild( nFirst );
nPaging.appendChild( nPrevious );
nPaging.appendChild( nNext );
nPaging.appendChild( nLast );
$(nFirst).click( function () {
oSettings.oApi._fnPageChange( oSettings, "first" );
fnCallbackDraw( oSettings );
} );
$(nPrevious).click( function() {
oSettings.oApi._fnPageChange( oSettings, "previous" );
fnCallbackDraw( oSettings );
} );
$(nNext).click( function() {
oSettings.oApi._fnPageChange( oSettings, "next" );
fnCallbackDraw( oSettings );
} );
$(nLast).click( function() {
oSettings.oApi._fnPageChange( oSettings, "last" );
fnCallbackDraw( oSettings );
} );
/* Disallow text selection */
$(nFirst).bind( 'selectstart', function () { return false; } );
$(nPrevious).bind( 'selectstart', function () { return false; } );
$(nNext).bind( 'selectstart', function () { return false; } );
$(nLast).bind( 'selectstart', function () { return false; } );
},
"fnUpdate": function ( oSettings, fnCallbackDraw )
{
if ( !oSettings.aanFeatures.p )
{
return;
}
/* Loop over each instance of the pager */
var an = oSettings.aanFeatures.p;
for ( var i=0, iLen=an.length ; i<iLen ; i++ )
{
var buttons = an[i].getElementsByTagName('span');
if ( oSettings._iDisplayStart === 0 )
{
buttons[0].className = "paginate_disabled_previous";
buttons[1].className = "paginate_disabled_previous";
}
else
{
buttons[0].className = "paginate_enabled_previous";
buttons[1].className = "paginate_enabled_previous";
}
if ( oSettings.fnDisplayEnd() == oSettings.fnRecordsDisplay() )
{
buttons[2].className = "paginate_disabled_next";
buttons[3].className = "paginate_disabled_next";
}
else
{
buttons[2].className = "paginate_enabled_next";
buttons[3].className = "paginate_enabled_next";
}
}
}
};

View File

@@ -0,0 +1,33 @@
<h2>Custom pagination types</h2>
<p>The style of the pagination options that Datatables presents to the end-user can greatly effect the look and feel of your table, as well as, of course, the interaction behaviour. Through the plug-in options you can define your own paging function to create the interaction that you are looking for.</p>
<ul>
<li><a href="#how_to">How to use DataTables plug-in pagination functions</a></li>
<li><a href="#functions">Plug-in pagination functions</a></li>
</ul>
<a name="how_to"></a>
<h3>How to use DataTables plug-in pagination functions</h3>
<p>To use a pagination plug-in, you must include the pagination plug-in code from the plug-ins available below, after you load the DataTables library, but before you initialise the DataTable. When initialising the DataTable, you must also tell it to make use of this plug-in, rather than using the default built-in types, by setting the 'sPaginationType' to the value required by the plug-in. As an example the code below makes use of the <a href="#scrolling">scrolling pagination plug-in</a> saved into a file (<a href="/examples/plug-ins/paging_plugin.html">live example</a>):</p>
<pre class="brush: html">&lt;script type="text/javascript" src="jquery.dataTables.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="dataTables.scrollingPagination.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;
$(document).ready(function() {
$('#example').dataTable( {
"sPaginationType": "scrolling"
} );
} );
&lt;/script&gt;
</pre>
<a name="functions"></a>
<h3>Plug-in pagination functions</h3>
include(`build.1.inc')

View File

@@ -0,0 +1,220 @@
/**
* Sometimes for quick navigation, it can be useful to allow an end user to
* enter which page they wish to jump to manually. This paging control uses a
* text input box to accept new paging numbers (arrow keys are also allowed
* for), and four standard navigation buttons are also presented to the end
* user.
*
* @name Navigation with text input
* @summary Shows an input element into which the user can type a page number
* @author [Allan Jardine](http://sprymedia.co.uk)
*
* @example
* $(document).ready(function() {
* $('#example').dataTable( {
* "sPaginationType": "input"
* } );
* } );
*/
$.fn.dataTableExt.oPagination.input = {
"fnInit": function ( oSettings, nPaging, fnCallbackDraw )
{
var nFirst = document.createElement( 'span' );
var nPrevious = document.createElement( 'span' );
var nNext = document.createElement( 'span' );
var nLast = document.createElement( 'span' );
var nInput = document.createElement( 'input' );
var nPage = document.createElement( 'span' );
var nOf = document.createElement( 'span' );
nFirst.innerHTML = oSettings.oLanguage.oPaginate.sFirst;
nPrevious.innerHTML = oSettings.oLanguage.oPaginate.sPrevious;
nNext.innerHTML = oSettings.oLanguage.oPaginate.sNext;
nLast.innerHTML = oSettings.oLanguage.oPaginate.sLast;
nFirst.className = "paginate_button first disabled";
nPrevious.className = "paginate_button previous disabled";
nNext.className="paginate_button next";
nLast.className = "paginate_button last";
nOf.className = "paginate_of";
nPage.className = "paginate_page";
nInput.className = "paginate_input";
if ( oSettings.sTableId !== '' )
{
nPaging.setAttribute( 'id', oSettings.sTableId+'_paginate' );
nPrevious.setAttribute( 'id', oSettings.sTableId+'_previous' );
nPrevious.setAttribute( 'id', oSettings.sTableId+'_previous' );
nNext.setAttribute( 'id', oSettings.sTableId+'_next' );
nLast.setAttribute( 'id', oSettings.sTableId+'_last' );
}
nInput.type = "text";
nPage.innerHTML = "Page ";
nPaging.appendChild( nFirst );
nPaging.appendChild( nPrevious );
nPaging.appendChild( nPage );
nPaging.appendChild( nInput );
nPaging.appendChild( nOf );
nPaging.appendChild( nNext );
nPaging.appendChild( nLast );
$(nFirst).click( function ()
{
var iCurrentPage = Math.ceil(oSettings._iDisplayStart / oSettings._iDisplayLength) + 1;
if (iCurrentPage != 1)
{
oSettings.oApi._fnPageChange( oSettings, "first" );
fnCallbackDraw( oSettings );
$(nFirst).addClass('disabled');
$(nPrevious).addClass('disabled');
$(nNext).removeClass('disabled');
$(nLast).removeClass('disabled');
}
} );
$(nPrevious).click( function()
{
var iCurrentPage = Math.ceil(oSettings._iDisplayStart / oSettings._iDisplayLength) + 1;
if (iCurrentPage != 1)
{
oSettings.oApi._fnPageChange(oSettings, "previous");
fnCallbackDraw(oSettings);
if (iCurrentPage == 2)
{
$(nFirst).addClass('disabled');
$(nPrevious).addClass('disabled');
}
$(nNext).removeClass('disabled');
$(nLast).removeClass('disabled');
}
} );
$(nNext).click( function()
{
var iCurrentPage = Math.ceil(oSettings._iDisplayStart / oSettings._iDisplayLength) + 1;
if (iCurrentPage != Math.ceil((oSettings.fnRecordsDisplay() / oSettings._iDisplayLength)))
{
oSettings.oApi._fnPageChange(oSettings, "next");
fnCallbackDraw(oSettings);
if (iCurrentPage == (Math.ceil((oSettings.fnRecordsDisplay() - 1) / oSettings._iDisplayLength) - 1))
{
$(nNext).addClass('disabled');
$(nLast).addClass('disabled');
}
$(nFirst).removeClass('disabled');
$(nPrevious).removeClass('disabled');
}
} );
$(nLast).click( function()
{
var iCurrentPage = Math.ceil(oSettings._iDisplayStart / oSettings._iDisplayLength) + 1;
if (iCurrentPage != Math.ceil((oSettings.fnRecordsDisplay() / oSettings._iDisplayLength)))
{
oSettings.oApi._fnPageChange(oSettings, "last");
fnCallbackDraw(oSettings);
$(nFirst).removeClass('disabled');
$(nPrevious).removeClass('disabled');
$(nNext).addClass('disabled');
$(nLast).addClass('disabled');
}
} );
$(nInput).keyup( function (e) {
// 38 = up arrow, 39 = right arrow
if ( e.which == 38 || e.which == 39 )
{
this.value++;
}
// 37 = left arrow, 40 = down arrow
else if ( (e.which == 37 || e.which == 40) && this.value > 1 )
{
this.value--;
}
if ( this.value === "" || this.value.match(/[^0-9]/) )
{
/* Nothing entered or non-numeric character */
this.value = this.value.replace(/[^\d]/g, ''); // don't even allow anything but digits
return;
}
var iNewStart = oSettings._iDisplayLength * (this.value - 1);
if (iNewStart < 0)
{
iNewStart = 0;
}
if (iNewStart > oSettings.fnRecordsDisplay())
{
iNewStart = (Math.ceil((oSettings.fnRecordsDisplay() - 1) / oSettings._iDisplayLength) - 1) * oSettings._iDisplayLength;
}
if (iNewStart === 0)
{
$(nFirst).addClass('disabled');
$(nPrevious).addClass('disabled');
$(nNext).removeClass('disabled');
$(nLast).removeClass('disabled');
}
else if (iNewStart == ((Math.ceil((oSettings.fnRecordsDisplay() - 1) / oSettings._iDisplayLength) - 1) * oSettings._iDisplayLength))
{
$(nNext).addClass('disabled');
$(nLast).addClass('disabled');
$(nFirst).removeClass('disabled');
$(nPrevious).removeClass('disabled');
}
else
{
$(nFirst).removeClass('disabled');
$(nPrevious).removeClass('disabled');
$(nNext).removeClass('disabled');
$(nLast).removeClass('disabled');
}
oSettings._iDisplayStart = iNewStart;
fnCallbackDraw( oSettings );
} );
/* Take the brutal approach to cancelling text selection */
$('span', nPaging).bind( 'mousedown', function () { return false; } );
$('span', nPaging).bind( 'selectstart', function () { return false; } );
// If we can't page anyway, might as well not show it
var iPages = Math.ceil((oSettings.fnRecordsDisplay()) / oSettings._iDisplayLength);
if(iPages <= 1)
{
$(nPaging).hide();
}
},
"fnUpdate": function ( oSettings, fnCallbackDraw )
{
if ( !oSettings.aanFeatures.p )
{
return;
}
var iPages = Math.ceil((oSettings.fnRecordsDisplay()) / oSettings._iDisplayLength);
var iCurrentPage = Math.ceil(oSettings._iDisplayStart / oSettings._iDisplayLength) + 1;
var an = oSettings.aanFeatures.p;
if (iPages <= 1) // hide paging when we can't page
{
$(an).hide();
}
else
{
/* Loop over each instance of the pager */
for (var i = 0, iLen = an.length ; i < iLen ; i++)
{
var spans = an[i].getElementsByTagName('span');
var inputs = an[i].getElementsByTagName('input');
spans[3].innerHTML = " of " + iPages;
inputs[0].value = iCurrentPage;
}
}
}
};

View File

@@ -0,0 +1,76 @@
/**
* jQuery DataTables jPaginator plugin v1.0 - integration between DataTables and
* jPaginator
* by Ernani Azevedo <azevedo@intellinews.com.br>
*
* You'll need jQuery DataTables (http://datatables.net/) and jPaginator
* (http://remylab.github.com/jpaginator/) loaded before load this one.
*
* Full description is available here:
* http://www.intellinews.com.br/blog/2012/10/26/jquery-datatables-integration-with-jpaginator-4/
*
* @license GPL v3.0.
* @example
* // Initialise DataTables with jPaginator paging
* $('#example').dataTable ( {
* 'sPaginationType': 'jPaginator'
* } );
*/
// API method to get paging information (Got idea from Twitter Bootstrap plugin):
$.fn.dataTableExt.oApi.fnPagingInfo = function ( oSettings)
{
if ( oSettings)
{
return {
"iStart": oSettings._iDisplayStart,
"iEnd": oSettings.fnDisplayEnd (),
"iLength": oSettings._iDisplayLength,
"iTotal": oSettings.fnRecordsTotal (),
"iFilteredTotal": oSettings.fnRecordsDisplay (),
"iPage": Math.ceil ( oSettings._iDisplayStart / oSettings._iDisplayLength),
"iTotalPages": Math.ceil ( oSettings.fnRecordsDisplay () / oSettings._iDisplayLength)};
} else {
return {
"iStart": 0,
"iEnd": 0,
"iLength": 0,
"iTotal": 0,
"iFilteredTotal": 0,
"iPage": 0,
"iTotalPages": 0
}
}
};
// Extends DataTable to support jPaginator pagination style:
$.fn.dataTableExt.oPagination.jPaginator = {
'paginator': $('<span>').html ( '<nav id="m_left"></nav><nav id="o_left"></nav><div class="paginator_p_wrap"><div class="paginator_p_bloc"><!--<a class="paginator_p"></a>--></div></div><nav id="o_right"></nav><nav id="m_right"></nav><div class="paginator_slider ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><a class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>'),
'fnInit': function ( oSettings, nPaging, fnCallbackDraw) {
$(nPaging).prepend ( this.paginator);
$(this.paginator).jPaginator ( {
selectedPage: 1,
nbPages: 1,
nbVisible: 6,
overBtnLeft: '#o_left',
overBtnRight: '#o_right',
maxBtnLeft: '#m_left',
maxBtnRight: '#m_right',
minSlidesForSlider: 2,
onPageClicked: function ( a, num) {
if ( num - 1 == Math.ceil ( oSettings._iDisplayStart / oSettings._iDisplayLength)) {
return;
}
oSettings._iDisplayStart = ( num - 1) * oSettings._iDisplayLength;
fnCallbackDraw ( oSettings);
}
}).addClass ( 'jPaginator');
},
'fnUpdate': function ( oSettings, fnCallbackDraw) {
if ( ! oSettings.aanFeatures.p) {
return;
}
var oPaging = oSettings.oInstance.fnPagingInfo ();
$(this.paginator).trigger ( 'reset', { nbVisible: 6, selectedPage: oPaging.iPage + 1, nbPages: oPaging.iTotalPages});
}
};

View File

@@ -0,0 +1,130 @@
/**
* This modification of DataTables' standard two button pagination controls
* adds a little animation effect to the paging action by redrawing the table
* multiple times for each event, each draw progressing by one row until the
* required point in the table is reached.
*
* @name Scrolling navigation
* @summary Show page changes as a redraw of the table, scrolling records.
* @author [Allan Jardine](http://sprymedia.co.uk)
*
* @example
* $(document).ready(function() {
* $('#example').dataTable( {
* "sPaginationType": "scrolling"
* } );
* } );
*/
/* Time between each scrolling frame */
$.fn.dataTableExt.oPagination.iTweenTime = 100;
$.fn.dataTableExt.oPagination.scrolling = {
"fnInit": function ( oSettings, nPaging, fnCallbackDraw )
{
var oLang = oSettings.oLanguage.oPaginate;
var oClasses = oSettings.oClasses;
var fnClickHandler = function ( e ) {
if ( oSettings.oApi._fnPageChange( oSettings, e.data.action ) )
{
fnCallbackDraw( oSettings );
}
};
var sAppend = (!oSettings.bJUI) ?
'<a class="'+oSettings.oClasses.sPagePrevDisabled+'" tabindex="'+oSettings.iTabIndex+'" role="button">'+oLang.sPrevious+'</a>'+
'<a class="'+oSettings.oClasses.sPageNextDisabled+'" tabindex="'+oSettings.iTabIndex+'" role="button">'+oLang.sNext+'</a>'
:
'<a class="'+oSettings.oClasses.sPagePrevDisabled+'" tabindex="'+oSettings.iTabIndex+'" role="button"><span class="'+oSettings.oClasses.sPageJUIPrev+'"></span></a>'+
'<a class="'+oSettings.oClasses.sPageNextDisabled+'" tabindex="'+oSettings.iTabIndex+'" role="button"><span class="'+oSettings.oClasses.sPageJUINext+'"></span></a>';
$(nPaging).append( sAppend );
var els = $('a', nPaging);
var nPrevious = els[0],
nNext = els[1];
oSettings.oApi._fnBindAction( nPrevious, {action: "previous"}, function() {
/* Disallow paging event during a current paging event */
if ( typeof oSettings.iPagingLoopStart != 'undefined' && oSettings.iPagingLoopStart != -1 )
{
return;
}
oSettings.iPagingLoopStart = oSettings._iDisplayStart;
oSettings.iPagingEnd = oSettings._iDisplayStart - oSettings._iDisplayLength;
/* Correct for underrun */
if ( oSettings.iPagingEnd < 0 )
{
oSettings.iPagingEnd = 0;
}
var iTween = $.fn.dataTableExt.oPagination.iTweenTime;
var innerLoop = function () {
if ( oSettings.iPagingLoopStart > oSettings.iPagingEnd ) {
oSettings.iPagingLoopStart--;
oSettings._iDisplayStart = oSettings.iPagingLoopStart;
fnCallbackDraw( oSettings );
setTimeout( function() { innerLoop(); }, iTween );
} else {
oSettings.iPagingLoopStart = -1;
}
};
innerLoop();
} );
oSettings.oApi._fnBindAction( nNext, {action: "next"}, function() {
/* Disallow paging event during a current paging event */
if ( typeof oSettings.iPagingLoopStart != 'undefined' && oSettings.iPagingLoopStart != -1 )
{
return;
}
oSettings.iPagingLoopStart = oSettings._iDisplayStart;
/* Make sure we are not over running the display array */
if ( oSettings._iDisplayStart + oSettings._iDisplayLength < oSettings.fnRecordsDisplay() )
{
oSettings.iPagingEnd = oSettings._iDisplayStart + oSettings._iDisplayLength;
}
var iTween = $.fn.dataTableExt.oPagination.iTweenTime;
var innerLoop = function () {
if ( oSettings.iPagingLoopStart < oSettings.iPagingEnd ) {
oSettings.iPagingLoopStart++;
oSettings._iDisplayStart = oSettings.iPagingLoopStart;
fnCallbackDraw( oSettings );
setTimeout( function() { innerLoop(); }, iTween );
} else {
oSettings.iPagingLoopStart = -1;
}
};
innerLoop();
} );
},
"fnUpdate": function ( oSettings, fnCallbackDraw )
{
if ( !oSettings.aanFeatures.p )
{
return;
}
/* Loop over each instance of the pager */
var an = oSettings.aanFeatures.p;
for ( var i=0, iLen=an.length ; i<iLen ; i++ )
{
if ( an[i].childNodes.length !== 0 )
{
an[i].childNodes[0].className =
( oSettings._iDisplayStart === 0 ) ?
oSettings.oClasses.sPagePrevDisabled : oSettings.oClasses.sPagePrevEnabled;
an[i].childNodes[1].className =
( oSettings.fnDisplayEnd() == oSettings.fnRecordsDisplay() ) ?
oSettings.oClasses.sPageNextDisabled : oSettings.oClasses.sPageNextEnabled;
}
}
}
};

View File

@@ -0,0 +1,97 @@
/**
* This pagination plug-in provides a `dt-tag select` menu with the list of the page
* numbers that are available for viewing.
*
* @name Select list
* @summary Show a `dt-tag select` list of pages the user can pick from.
* @author _jneilliii_
*
* @example
* $(document).ready(function() {
* $('#example').dataTable( {
* "sPaginationType": "listbox"
* } );
* } );
*/
$.fn.dataTableExt.oPagination.listbox = {
/*
* Function: oPagination.listbox.fnInit
* Purpose: Initalise dom elements required for pagination with listbox input
* Returns: -
* Inputs: object:oSettings - dataTables settings object
* node:nPaging - the DIV which contains this pagination control
* function:fnCallbackDraw - draw function which must be called on update
*/
"fnInit": function (oSettings, nPaging, fnCallbackDraw) {
var nInput = document.createElement('select');
var nPage = document.createElement('span');
var nOf = document.createElement('span');
nOf.className = "paginate_of";
nPage.className = "paginate_page";
if (oSettings.sTableId !== '') {
nPaging.setAttribute('id', oSettings.sTableId + '_paginate');
}
nInput.style.display = "inline";
nPage.innerHTML = "Page ";
nPaging.appendChild(nPage);
nPaging.appendChild(nInput);
nPaging.appendChild(nOf);
$(nInput).change(function (e) { // Set DataTables page property and redraw the grid on listbox change event.
window.scroll(0,0); //scroll to top of page
if (this.value === "" || this.value.match(/[^0-9]/)) { /* Nothing entered or non-numeric character */
return;
}
var iNewStart = oSettings._iDisplayLength * (this.value - 1);
if (iNewStart > oSettings.fnRecordsDisplay()) { /* Display overrun */
oSettings._iDisplayStart = (Math.ceil((oSettings.fnRecordsDisplay() - 1) / oSettings._iDisplayLength) - 1) * oSettings._iDisplayLength;
fnCallbackDraw(oSettings);
return;
}
oSettings._iDisplayStart = iNewStart;
fnCallbackDraw(oSettings);
}); /* Take the brutal approach to cancelling text selection */
$('span', nPaging).bind('mousedown', function () {
return false;
});
$('span', nPaging).bind('selectstart', function () {
return false;
});
},
/*
* Function: oPagination.listbox.fnUpdate
* Purpose: Update the listbox element
* Returns: -
* Inputs: object:oSettings - dataTables settings object
* function:fnCallbackDraw - draw function which must be called on update
*/
"fnUpdate": function (oSettings, fnCallbackDraw) {
if (!oSettings.aanFeatures.p) {
return;
}
var iPages = Math.ceil((oSettings.fnRecordsDisplay()) / oSettings._iDisplayLength);
var iCurrentPage = Math.ceil(oSettings._iDisplayStart / oSettings._iDisplayLength) + 1; /* Loop over each instance of the pager */
var an = oSettings.aanFeatures.p;
for (var i = 0, iLen = an.length; i < iLen; i++) {
var spans = an[i].getElementsByTagName('span');
var inputs = an[i].getElementsByTagName('select');
var elSel = inputs[0];
if(elSel.options.length != iPages) {
elSel.options.length = 0; //clear the listbox contents
for (var j = 0; j < iPages; j++) { //add the pages
var oOption = document.createElement('option');
oOption.text = j + 1;
oOption.value = j + 1;
try {
elSel.add(oOption, null); // standards compliant; doesn't work in IE
} catch (ex) {
elSel.add(oOption); // IE only
}
}
spans[1].innerHTML = "&nbsp;of&nbsp;" + iPages;
}
elSel.value = iCurrentPage;
}
}
};