// jQuery Plugin by NOTsu
(function(){
$.fn.paging = function( options ){
var options = $.extend({
// Configuration
parent : 'body',
page : 1,
total : 0,
itemperpage : 10,
showpage : 5,
showwidth : 10,
title : 'ไปหน้า ',
target : '_self',
group : 'default',
pageVariable : 'page',
skipForceTemplate: false,
cache : true,
// Template
showFirst : false,
showLast : false,
templateWrap : '
',
templatePage : '${page}',
templateCurrent : '${page}',
templatePrev : '«',
templateNext : '»',
templateFirst : 'First',
templateLast : 'Last',
// Href Section
href : '',
hrefParams : {},
// Ajax Section
ajax : '',
ajaxable : false,
ajaxParams : {},
ajaxType : 'get',
ajaxDatatype : '',
ajaxBeforeSend : function(){},
ajaxCallback : function(){},
// Jump Trigger
jumpInput : '',
jumpEvent : 'pagingjump' ,
onclick : null
}, options);
var first = true,
elementLength = this.length,
xhr;
// ฟังก์ชัน Replace Template
var tmplD = function( templateName , data ){
var skeleton = options[ templateName ];
$.each( data , function( index , value ){
skeleton = skeleton.replace( '${' + index + '}' , value );
});
return skeleton;
};
// หาจำนวน Object
var size = function(obj) {
var size = 0, key;
for (key in obj) {
if (obj.hasOwnProperty(key)) size++;
}
return size;
};
// ฟังก์ชัน Render Template
var render = function( page_current ){
page_current = parseInt( page_current );
var pages = Math.ceil( options.total / options.itemperpage ),
pages = ( pages != 0 ) ? pages : 1,
collection = '',
hrefParams = '';
// Hack for old version
options.showpage = options.showwidth;
if (!options.skipForceTemplate){
options.templatePrev = '«';
options.templateNext = '»';
}
pageStart = page_current - Math.floor( options.showpage / 2 );
pageStart = ( pageStart < 1 ) ? 1 : pageStart;
pageEnd = ( pageStart - 1 ) + options.showpage;
pageStart -= ( pageEnd > pages ) ? pageEnd - pages : 0;
pageEnd = ( pageEnd > pages ) ? pages : pageEnd;
pageStart = ( pageStart < 1 ) ? 1 : pageStart;
if( size( options.hrefParams ) > 0 )
{
$.each( options.hrefParams, function( index , value ){
hrefParams += '&' + index + '=' + value;
});
}
/*
if( size( options.ajaxParams ) > 0 )
{
$.each( options.ajaxParams, function( index , value ){
ajaxParams += '&' + index + '=' + value;
});
}
*/
if( options.showFirst )
{
collection += tmplD('templateFirst', {
href : options.href + '?' + options.pageVariable + '=' + 1 + hrefParams,
ajax : options.ajax,
target : options.target,
title : options.title + 1,
page : 1,
p : ( 1 ),
onclick : ''
});
}
// ปุ่ม Prev
if( page_current > 1 )
{
collection += ( page_current - options.showpage > 1 ) ? tmplD('templatePrev', {
href : options.href + '?' + options.pageVariable + '=' + ( page_current - 1 ) + hrefParams,
ajax : options.ajax,
target : options.target,
title : options.title + ( page_current - options.showpage ),
page : number_format( page_current - options.showpage ),
p : ( page_current - options.showpage ),
onclick : ''
}) : tmplD('templatePrev', {
href : options.href + '?' + options.pageVariable + '=1' + hrefParams,
ajax : options.ajax,
target : options.target,
title : options.title + 1,
page : 1,
p : 1,
onclick : 'return true;'
});
}
// ปุ่ม 1 2 3 4 5
for( var i = pageStart ; i <= pageEnd && i <= pages ; i++ )
{
collection += ( i != page_current) ? tmplD('templatePage', {
href : options.href + '?' + options.pageVariable + '=' + i + hrefParams,
ajax : options.ajax,
target : options.target,
title : options.title + number_format( i ),
page : number_format( i ),
wb : (( i < 10 ) ? 'w1b' : 'w2b' ),
p : i
}) : tmplD('templateCurrent', {
page : number_format( i ),
wb : (( i < 10 ) ? 'w1b' : 'w2b' ),
p : i
});
}
// ปุ่ม Next
if( page_current < pages )
{
collection += ( page_current + options.showpage < pages ) ? tmplD('templateNext', {
href : options.href + '?' + options.pageVariable + '=' + ( page_current + 1 ) + hrefParams,
ajax : options.ajax,
target : options.target,
title : options.title + ( page_current + options.showpage ),
page : number_format( page_current + options.showpage ),
p : ( page_current + options.showpage ),
onclick : ''
}) : tmplD('templateNext', {
href : options.href + '?' + options.pageVariable + '=' + pages + hrefParams,
ajax : options.ajax,
target : options.target,
title : options.title + pages,
page : number_format( pages ),
p : pages,
onclick : 'return true;'
});
}
if( options.showLast )
{
collection += tmplD('templateLast', {
href : options.href + '?' + options.pageVariable + '=' + ( 1 ) + hrefParams,
ajax : options.ajax,
target : options.target,
title : options.title + number_format( pages ),
page : number_format( pages ),
p : ( pages ),
onclick : ''
});
}
// Conpile ขั้นสุดท้าย
collection = tmplD('templateWrap', {
list : collection,
group : options.group
});
return collection;
};
// Mu onClick adapter
var onClickListener = function (){
$(options.parent + ' ' + '.paging-' + options.group).on ('click' , 'a' , function (){
if (typeof options.onclick === 'function')
{
options.onclick (this);
return true;
}
});
};
var fire = function(){
if( typeof fire.ajaxing == 'undefined' )
ajaxing = true;
$(options.parent + ' ' + '.paging-' + options.group).on( 'click' , 'a' , function(){
var page_name = $(this).attr('page');
var storage_name = options.group + page_name;
if( options.cache && typeof $(options.parent).data( storage_name ) != 'undefined' )
{
options.ajaxCallback( $(options.parent).data( storage_name ) );
$(options.parent + ' ' + '.paging-' + options.group).each(function(){
$(this).parent().empty().append( render( page_name ) );
});
onClickListener ();
fire();
return false;
}
else
{
options.ajaxParams[options.pageVariable] = $(this).attr('page');
options.ajaxBeforeSend();
if( typeof xhr != 'undefined' )
xhr.abort();
xhr = $.ajax({
url : $(this).attr('ajax'),
type : options.ajaxType,
data : options.ajaxParams,
dataType : options.ajaxDatatype,
xhrFields: {
withCredentials: true
},
success: options.ajaxCallback,
complete: ( ( options.cache ) ? function( response ){
$(options.parent).data( storage_name , ( ( options.ajaxDatatype == 'json' ) ? $.parseJSON( response.responseText ) : response.responseText ) );
$(options.parent + ' ' + '.paging-' + options.group).each(function(){
$(this).parent().empty().append( render( page_name ) );
});
onClickListener ();
fire();
} : function(){
$(options.parent + ' ' + '.paging-' + options.group).each(function(){
$(this).parent().empty().append( render( page_name ) );
});
onClickListener ();
fire();
})
});
return false;
}
});
};
return this.each(function(){
var $this = $(this);
$this.empty().append( render( options.page ) );
elementLength--;
if( options.ajaxable && elementLength == 0 )
{
onClickListener ();
fire();
}
});
}
})(jQuery);
function number_format (number, decimals, dec_point, thousands_sep) {
number = (number + '').replace(/[^0-9+\-Ee.]/g, '');
var n = !isFinite(+number) ? 0 : +number,
prec = !isFinite(+decimals) ? 0 : Math.abs(decimals),
sep = (typeof thousands_sep === 'undefined') ? ',' : thousands_sep,
dec = (typeof dec_point === 'undefined') ? '.' : dec_point,
s = '',
toFixedFix = function (n, prec) {
var k = Math.pow(10, prec);
return '' + Math.round(n * k) / k;
};
// Fix for IE parseFloat(0.55).toFixed(0) = 0;
s = (prec ? toFixedFix(n, prec) : '' + Math.round(n)).split('.');
if (s[0].length > 3) {
s[0] = s[0].replace(/\B(?=(?:\d{3})+(?!\d))/g, sep);
}
if ((s[1] || '').length < prec) {
s[1] = s[1] || '';
s[1] += new Array(prec - s[1].length + 1).join('0');
}
return s.join(dec);
}