tablesorter/dist/js/widgets/widget-scroller.min.js

149 lines
19 KiB
JavaScript
Raw Normal View History

2015-10-31 16:06:09 +00:00
/*! Widget: scroller - updated 10/31/2015 (v2.24.0) */
2015-10-31 15:08:21 +00:00
/*
Copyright (C) 2011 T. Connell & Associates, Inc.
Dual-licensed under the MIT and GPL licenses
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT
LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN
NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
Resizable scroller widget for the jQuery tablesorter plugin
Version 2.0 - modified by Rob Garrison 4/12/2013;
updated 3/5/2015 (v2.22.2) with lots of help from TheSin-
Requires jQuery v1.7+
Requires the tablesorter plugin, v2.8+, available at http://mottie.github.com/tablesorter/docs/
Usage:
$(function() {
$('table.tablesorter').tablesorter({
widgets: ['zebra', 'scroller'],
widgetOptions : {
scroller_height : 300, // height of scroll window
scroller_jumpToHeader : true, // header snap to browser top when scrolling the tbody
scroller_upAfterSort : true, // scroll tbody to top after sorting
scroller_fixedColumns : 0 // set number of fixed columns
}
});
});
Website: www.tconnell.com
*/
/*jshint browser:true, jquery:true, unused:false */
!function(a,b){"use strict";var c=a.tablesorter,d=c.css;a.extend(c.css,{scrollerWrap:"tablesorter-scroller",scrollerHeader:"tablesorter-scroller-header",scrollerTable:"tablesorter-scroller-table",scrollerFooter:"tablesorter-scroller-footer",scrollerFixed:"tablesorter-scroller-fixed",scrollerFixedPanel:"tablesorter-scroller-fixed-panel",scrollerHasFix:"tablesorter-scroller-has-fixed-columns",scrollerHideColumn:"tablesorter-scroller-hidden-column",scrollerHideElement:"tablesorter-scroller-hidden",scrollerSpacerRow:"tablesorter-scroller-spacer",scrollerBarSpacer:"tablesorter-scroller-bar-spacer",scrollerAddedHeight:"tablesorter-scroller-added-height",scrollerHack:"tablesorter-scroller-scrollbar-hack",
// class name on table cannot start with 'tablesorter-' or the
// suffix 'scroller-rtl' will match as a theme name
scrollerRtl:"ts-scroller-rtl"}),c.addWidget({id:"scroller",priority:60,// run after the filter widget
options:{scroller_height:300,
// pop table header into view while scrolling up the page
scroller_jumpToHeader:!0,
// scroll tbody to top after sorting
scroller_upAfterSort:!0,
// set number of fixed columns
scroller_fixedColumns:0,
// add hover highlighting to the fixed column (disable if it causes slowing)
scroller_rowHighlight:"hover",
// add a fixed column overlay for styling
scroller_addFixedOverlay:!1,
// In tablesorter v2.19.0 the scroll bar width is auto-detected
// add a value here to override the auto-detected setting
scroller_barWidth:null},format:function(a,b,d){b.isScrolling||
// initialize here instead of in widget init to give the
// filter widget time to finish building the filter row
c.scroller.setup(b,d)},remove:function(a,b,d){c.scroller.remove(b,d)}}),/* Add window resizeEnd event (also used by columnSelector widget) */
c.window_resize=function(){c.timer_resize&&clearTimeout(c.timer_resize),c.timer_resize=setTimeout(function(){a(b).trigger("resizeEnd")},250)},
// Add extra scroller css
a(function(){var b="<style>."+d.scrollerWrap+" { position: relative; overflow: hidden; }."+d.scrollerWrap+" * { box-sizing: border-box; }."+d.scrollerHeader+", ."+d.scrollerFooter+" { position: relative; overflow: hidden; }."+d.scrollerHeader+" table."+d.table+" { margin-bottom: 0; }."+d.scrollerTable+" { position: relative; overflow: auto; }."+d.scrollerTable+" table."+d.table+" { border-top: 0; margin-top: 0; margin-bottom: 0; overflow: hidden; }."+d.scrollerTable+" tfoot, ."+d.scrollerHideElement+", ."+d.scrollerHideColumn+" { display: none; }."+d.scrollerFixed+", ."+d.scrollerFixed+" ."+d.scrollerFixedPanel+" { pointer-events: none; }."+d.scrollerFixed+" > div { pointer-events: all; }."+d.scrollerWrap+" ."+d.scrollerFixed+" { position: absolute; top: 0; z-index: 1; left: 0 } ."+d.scrollerWrap+" ."+d.scrollerFixed+"."+d.scrollerRtl+" { left: auto; right: 0 } ."+d.scrollerWrap+"."+d.scrollerHasFix+" > ."+d.scrollerTable+" { overflow: auto; }."+d.scrollerFixed+" ."+d.scrollerFooter+" { position: absolute; bottom: 0; }."+d.scrollerFixed+" ."+d.scrollerTable+" { position: relative; left: 0; overflow: auto; -ms-overflow-style: none; }."+d.scrollerFixed+" ."+d.scrollerTable+"::-webkit-scrollbar { display: none; }."+d.scrollerWrap+" ."+d.scrollerFixedPanel+" { position: absolute; top: 0; bottom: 0; z-index: 2; left: 0; right: 0; } </style>";a(b).appendTo("body")}),c.scroller={
// Ugh.. Firefox misbehaves, so it needs to be detected
isFirefox:navigator.userAgent.toLowerCase().indexOf("firefox")>-1,
// old IE needs a wrap to hide the fixed column scrollbar; http://stackoverflow.com/a/24408672/145346
isOldIE:document.all&&!b.atob,isIE:document.all&&!b.atob||navigator.appVersion.indexOf("Trident/")>0,
// http://stackoverflow.com/questions/7944460/detect-safari-browser - needed to position scrolling body
// when the table is set up in RTL direction
isSafari:navigator.userAgent.toLowerCase().indexOf("safari")>-1&&-1===navigator.userAgent.toLowerCase().indexOf("chrome"),hasScrollBar:function(a,b){return b?a.get(0).scrollWidth>a.width():a.get(0).scrollHeight>a.height()},setWidth:function(a,b){a.css({width:b,"min-width":b,"max-width":b})},
// modified from http://davidwalsh.name/detect-scrollbar-width
getBarWidth:function(){var b=a("<div>").css({position:"absolute",top:"-9999px",left:0,width:"100px",height:"100px",overflow:"scroll",visibility:"hidden"}).appendTo("body"),c=b[0],d=c.offsetWidth-c.clientWidth;return b.remove(),d},setup:function(e,f){var g,h,i,j,k,l,m,n,o,p=a(b),q=c.scroller,r=e.namespace+"tsscroller",s=a(),
// c.namespace contains a unique tablesorter ID, per table
t=e.namespace.slice(1)+"tsscroller",u=e.$table;
// force config.widthFixed option - this helps maintain proper alignment across cloned tables
e.widthFixed=!0,f.scroller_calcWidths=[],f.scroller_saved=[0,0],f.scroller_isBusy=!0,
// set scrollbar width to one of the following (1) explicitly set scroller_barWidth option,
// (2) detected scrollbar width or (3) fallback of 15px
null!==f.scroller_barWidth?f.scroller_barSetWidth=f.scroller_barWidth:(o=q.getBarWidth(),f.scroller_barSetWidth=null!==o?o:15),g=f.scroller_height||300,i=a('<table class="'+u.attr("class")+'" cellpadding=0 cellspacing=0>'+u.children("thead")[0].outerHTML+"</table>"),f.scroller_$header=i.addClass(e.namespace.slice(1)+"_extra_table"),j=u.children("tfoot"),j.length&&(s=a('<table class="'+u.attr("class")+'" cellpadding=0 cellspacing=0 style="margin-top:0"></table>').addClass(e.namespace.slice(1)+"_extra_table").append(j.clone(!0)).wrap('<div class="'+d.scrollerFooter+'"/>'),l=s.children("tfoot").eq(0).children("tr").children()),f.scroller_$footer=s,u.wrap('<div id="'+t+'" class="'+d.scrollerWrap+'" />').before(i).find("."+d.filterRow).addClass(d.filterRowHide),f.scroller_$container=u.parent(),s.length&&u.after(s.parent()),k=i.wrap('<div class="'+d.scrollerHeader+'" />').find("."+d.header),u.wrap('<div class="'+d.scrollerTable+'" style="max-height:'+g+'px;" />'),m=u.parent(),c.bindEvents(e.table,k),u.hasClass("hasFilters")&&c.filter.bindSearch(u,i.find("."+d.filter)),u.find("thead").addClass(d.scrollerHideElement),h=m.parent().height(),m.off("scroll"+r).on("scroll"+r,function(){if(f.scroller_jumpToHeader){var b=p.scrollTop()-i.offset().top;0!==a(this).scrollTop()&&h>b&&b>0&&p.scrollTop(i.offset().top)}i.parent().add(s.parent()).scrollLeft(a(this).scrollLeft())}),n=((c.hasWidget(e.table,"filter")?"filterEnd":"tablesorter-initialized updateComplete")+" sortEnd pagerComplete columnUpdate ").split(" ").join(r+" "),u.off(r).on("sortEnd filterEnd".split(" ").join(r+" "),function(a){"sortEnd"===a.type&&f.scroller_upAfterSort?m.animate({scrollTop:0},"fast"):f.scroller_fixedColumns&&setTimeout(function(){m.scrollTop(f.scroller_saved[1]).scrollLeft(f.scroller_saved[0]),q.updateFixed(e,f)},0)}).on("setFixedColumnSize"+r,function(a,b){var c=f.scroller_$container;"undefined"==typeof b||isNaN(b)||(f.scroller_fixedColumns=parseInt(b,10)),q.removeFixed(e,f),b=f.scroller_fixedColumns,b>0&&b<e.columns-1?q.updateFixed(e,f):c.hasClass(d.scrollerHasFix)&&(c.removeClass(d.scrollerHasFix),q.resize(e,f))}).on(n,function(a){c.hasWidget("pager")&&"updateComplete"===a.type||(f.scroller_fixedColumns>0&&q.updateFixed(e,f),q.resize(e,f))}),p.off("resize resizeEnd ".split(" ").join(r+" ")).on("resize"+r,c.window_resize).on("resizeEnd"+r,function(){p.off("resize"+r,c.window_resize),q.resize(e,f),p.on("resize"+r,c.window_resize),m.trigger("scroll"+r)}),e.isScrolling=!0,q.updateFixed(e,f),e.table.hasInitialized&&e.isScrolling&&setTimeout(function(){c.scroller.resize(e,f)},50)},resize:function(e,f){if(!f.scroller_isBusy){var g,h,i,j,k,l,m=c.scroller,n=f.scroller_$container,o=e.$table,p=o.parent(),q=f.scroller_$header,r=f.scroller_$footer,s=e.namespace.slice(1)+"tsscroller",
// Hide other scrollers so we can resize
t=a("div."+d.scrollerWrap+'[id!="'+s+'"]').addClass(d.scrollerHideElement),u='<tr class="'+d.scrollerSpacerRow+" "+e.selectorRemove.slice(1)+'">';for(f.scroller_calcWidths=[],
// Remove fixed so we get proper widths and heights
m.removeFixed(e,f),n.find("."+d.scrollerSpacerRow).remove(),
// remove ts added colgroups
n.find("."+c.css.colgroup).remove(),
// show original table elements to get proper alignment
o.find("."+d.scrollerHideElement).removeClass(d.scrollerHideElement),h=parseInt(o.css("border-left-width"),10),j=e.$headerIndexed,g=0;g<e.columns;g++)k=j[g],i="border-box"===k.css("box-sizing")?k.outerWidth():"collapse"===k.css("border-collapse")?k.length&&b.getComputedStyle?parseFloat(b.getComputedStyle(k[0],null).width):k.outerWidth()-parseFloat(k.css("padding-left"))-parseFloat(k.css("padding-right"))-(parseFloat(k.css("border-width"))||0):k.width(),u+='<td data-column="'+g+'" style="padding:0;margin:0;border:0;height:0;max-height:0;min-height:0;width:'+i+"px;min-width:"+i+"px;max-width:"+i+'px"></td>',f.scroller_calcWidths[g]=i;u+="</tr>",e.$tbodies.eq(0).prepend(u),// tbody
q.children("thead").append(u),r.children("tfoot").append(u),
// include colgroup or alignment is off
c.fixColumnWidth(e.table),u=e.$table.children("colgroup")[0].outerHTML,q.prepend(u),r.prepend(u),l=p.parent().innerWidth()-(m.hasScrollBar(p)?f.scroller_barSetWidth:0),p.width(l),l=(m.hasScrollBar(p)?f.scroller_barSetWidth:0)+h,i=p.innerWidth()-l,q.parent().add(r.parent()).width(i),p.width(i+l),
// hide original table thead
o.children("thead").addClass(d.scrollerHideElement),
// update fixed column sizes
m.updateFixed(e,f),t.removeClass(d.scrollerHideElement),
// restore scrollTop - fixes #926
p.scrollTop(f.scroller_saved[1]),f.scroller_$container.find("."+d.scrollerFixed).find("."+d.scrollerTable).scrollTop(f.scroller_saved[1]),
// update resizable widget handles
setTimeout(function(){e.$table.trigger("resizableUpdate")},100)}},
// Add fixed (frozen) columns (Do not call directly, use updateFixed)
setupFixed:function(a,b){var e,f,g,h,i,j,k,l=a.$table,m=b.scroller_$container,n=b.scroller_fixedColumns;for(j=m.addClass(d.scrollerHasFix).clone().addClass(d.scrollerFixed).removeClass(d.scrollerWrap).attr("id",""),b.scroller_addFixedOverlay&&j.append('<div class="'+d.scrollerFixedPanel+'">'),k=j.find("."+d.scrollerTable),k.children("table").addClass(a.namespace.slice(1)+"_extra_table").attr("id","").children("thead, tfoot").remove(),b.scroller_$fixedColumns=j,l.hasClass(d.scrollerRtl)&&j.addClass(d.scrollerRtl),g=j.find("tr"),h=g.length,e=0;h>e;e++)g.eq(e).children(":gt("+(n-1)+")").remove();
// look for filter widget
if(j.addClass(d.scrollerHideElement).prependTo(m),a.$table.hasClass("hasFilters"))for(g=j.find("."+d.filter).not("."+d.filterDisabled).prop("disabled",!1),c.filter.bindSearch(l,j.find("."+d.filter)),g=m.children("."+d.scrollerHeader).find("."+d.filter),h=g.length,e=0;h>e;e++)
// previously disabled filter; don't mess with it! filterDisabled class added by filter widget
g.eq(e).hasClass(d.filterDisabled||"disabled")||
// disable filters behind fixed column; don't disable visible filters
g.eq(e).prop("disabled",n>e);for(
// disable/enable tab indexes behind fixed column
a.$table.add("."+d.scrollerFooter+" table").children("thead").children("tr."+d.headerRow).children().attr("tabindex",-1),g=b.scroller_$header.add(j.find("."+d.scrollerTable+" table")).children("thead").children("tr."+d.headerRow),h=g.length,e=0;h>e;e++)for(i=g.eq(e).children(),f=0;f<i.length;f++)i.eq(f).attr("tabindex",n>f?-1:0);c.bindEvents(a.table,j.find("."+d.header)),c.scroller.bindFixedColumnEvents(a,b),/*** Scrollbar hack! Since we can't hide the scrollbar with css ***/
(c.scroller.isFirefox||c.scroller.isOldIE)&&k.wrap('<div class="'+d.scrollerHack+'" style="overflow:hidden;">')},bindFixedColumnEvents:function(b,e){
// update thead & tbody in fixed column
var f=c.scroller,g=b.namespace+"tsscrollerFixed",h="scroll"+g,i=e.scroller_$fixedColumns.find("."+d.scrollerTable),j=!0,k=!0;b.$table.parent().off(h).on(h,function(){if(!e.scroller_isBusy&&!e.scroller_isBusy&&(j||!f.isFirefox&&!f.isIE)){k=!1;var b=a(this);i[0].scrollTop=e.scroller_saved[1]=b.scrollTop(),e.scroller_saved[0]=b.scrollLeft(),setTimeout(function(){k=!0},20)}}),
// scroll main along with fixed column
i.off(h).on(h,function(){
// using flags to prevent firing the scroll event excessively leading to slow scrolling in Firefox
if(!e.scroller_isBusy&&(k||!f.isFirefox&&!f.isIE)){j=!1;var c=a(this);b.$table.parent()[0].scrollTop=e.scroller_saved[1]=c.scrollTop(),setTimeout(function(){j=!0},20)}}).scroll(),
// *** ROW HIGHLIGHT ***
""!==e.scroller_rowHighlight&&(h="mouseover mouseleave ".split(" ").join(g+" "),b.$table.off(h,"tbody > tr").on(h,"tbody > tr",function(a){var c=b.$table.children("tbody").children("tr").index(this);i.children("table").children("tbody").children("tr").eq(c).add(this).toggleClass(e.scroller_rowHighlight,"mouseover"===a.type)}),i.find("table").off(h,"tbody > tr").on(h,"tbody > tr",function(a){var c=i.children("table").children("tbody").children("tr"),d=c.index(this);b.$table.children("tbody").children("tr").eq(d).add(this).toggleClass(e.scroller_rowHighlight,"mouseover"===a.type)}))},adjustWidth:function(a,b,e,f,g){var h=b.scroller_$container;
// RTL support (fixes column on right)
h.children("."+d.scrollerTable).css(g?"right":"left",e),h.children("."+d.scrollerHeader+", ."+d.scrollerFooter).css(g?"right":"left",e+(g&&c.scroller.isSafari?f:0))},updateFixed:function(b,e){var f,g,h=e.scroller_$container,i=e.scroller_$header,j=e.scroller_$footer,k=b.$table,l=k.parent(),m=e.scroller_barSetWidth,n=k.hasClass(d.scrollerRtl);if(0===e.scroller_fixedColumns)return e.scroller_isBusy=!1,c.scroller.removeFixed(b,e),f=h.width(),l.width(f),g=c.scroller.hasScrollBar(l)?m:0,void i.parent().add(j.parent()).width(f-g);if(b.isScrolling){e.scroller_isBusy=!0,
// Make sure the wo.scroller_$fixedColumns container exists, if not build it
h.find("."+d.scrollerFixed).length||c.scroller.setupFixed(b,e);
// scroller_fixedColumns
var o,p,q,r,s,t,u,
// source cells for measurement
v=e.scroller_$container.children("."+d.scrollerTable).children("table").children("tbody"),
// variable gets redefined
w=e.scroller_$header.children("thead").children("."+d.headerRow),
// hide fixed column during resize, or we get a FOUC
x=e.scroller_$fixedColumns.addClass(d.scrollerHideElement),
// target cells
y=x.find("."+d.scrollerTable).children("table"),z=y.children("tbody"),
// variables
A=c.scroller,B=e.scroller_fixedColumns,
// get dimensions
C=k.find("tbody td"),D=parseInt(C.css("border-right-width"),10)||1,E=parseInt((C.css("border-spacing")||"").split(/\s/)[0],10)/2||0,F=parseInt(k.css("padding-left"),10)+parseInt(k.css("padding-right"),10)-D,G=e.scroller_calcWidths;
// calculate fixed column width
for(c.scroller.removeFixed(b,e,!1),o=0;B>o;o++)F+=G[o]+E;
// update fixed column tbody content, set cell widths on hidden row
for(F=F+2*D-E,A.setWidth(x.add(x.children()),F),A.setWidth(x.children().children("table"),F),p=0;p<b.$tbodies.length;p++)if(r=v.eq(p),r.length){
// update tbody cells after sort/filtering
for(w=r.children(),u=w.length,t=c.processTbody(y,z.eq(p),!0),t.empty(),q=0;u>q;q++)s=a(w[q].outerHTML),s.children("td, th").slice(B).remove(),t.append(s);
// restore tbody
c.processTbody(y,t,!1)}for(g=c.scroller.hasScrollBar(l)?m:0,(A.isFirefox||A.isOldIE)&&y.css("width",F).parent().css("width",F+g),x.removeClass(d.scrollerHideElement),o=0;B>o;o++)h.children("div").children("table").find("th:nth-child("+(o+1)+"), td:nth-child("+(o+1)+")").addClass(d.scrollerHideColumn);F-=D,f=l.parent().innerWidth()-F,l.width(f),
// RTL support (fixes column on right)
h.children("."+d.scrollerTable).css(n?"right":"left",F),h.children("."+d.scrollerHeader+", ."+d.scrollerFooter).css(n?"right":"left",F+(n&&c.scroller.isSafari?g:0)),i.parent().add(j.parent()).width(f-g),
// fix gap under the tbody for the horizontal scrollbar
f=c.scroller.hasScrollBar(l,!0),g=f?m:0,!x.find("."+d.scrollerBarSpacer).length&&f?(C=a('<div class="'+d.scrollerBarSpacer+'">').css("height",g+"px"),x.find("."+d.scrollerTable).append(C)):f||x.find("."+d.scrollerBarSpacer).remove(),c.scroller.updateRowHeight(b,e),
// set fixed column height (changes with filtering)
x.height(h.height()),x.removeClass(d.scrollerHideElement),e.scroller_isBusy=!1}},fixHeight:function(a,b){var c,e,f,g,h,i=d.scrollerAddedHeight,j=a.length;for(c=0;j>c;c++)g=a.eq(c),h=b.eq(c),e=g.height(),f=h.height(),e>f?h.addClass(i).height(e):f>e&&g.addClass(i).height(f)},updateRowHeight:function(a,b){var e,f,g=b.scroller_$fixedColumns;b.scroller_$container.find("."+d.scrollerAddedHeight).removeClass(d.scrollerAddedHeight).height(""),e=b.scroller_$header.children("thead").children("tr"),f=g.children("."+d.scrollerHeader).children("table").children("thead").children("tr"),c.scroller.fixHeight(e,f),e=b.scroller_$footer.children("tfoot").children("tr"),f=g.children("."+d.scrollerFooter).children("table").children("tfoot").children("tr"),c.scroller.fixHeight(e,f),(c.scroller.isFirefox||c.scroller.isOldIE)&&(g=g.find("."+d.scrollerHack)),e=a.$table.children("tbody").children("tr"),f=g.children("."+d.scrollerTable).children("table").children("tbody").children("tr"),c.scroller.fixHeight(e,f)},removeFixed:function(a,b,c){var e=a.$table,f=b.scroller_$container,g=e.hasClass(d.scrollerRtl);
// remove fixed columns
(c||"undefined"==typeof c)&&f.find("."+d.scrollerFixed).remove(),f.find("."+d.scrollerHideColumn).removeClass(d.scrollerHideColumn),
// RTL support ( fixes column on right )
f.children(":not(."+d.scrollerFixed+")").css(g?"right":"left",0)},remove:function(c,e){var f=e.scroller_$container,g=c.namespace+"tsscroller";c.$table.off(g),a(b).off(g),f&&(c.$table.insertBefore(f).find("thead").removeClass(d.scrollerHideElement).children("tr."+d.headerRow).children().attr("tabindex",0).end().find("."+d.filterRow).removeClass(d.scrollerHideElement+" "+d.filterRowHide),c.$table.find("."+d.filter).not("."+d.filterDisabled).prop("disabled",!1),f.remove(),c.isScrolling=!1)}}}(jQuery,window);