/* TableSorter 2.0 Widgets */ (function($){ // Add jQuery UI theme widget // ************************** $.tablesorter.addWidget({ id: "uitheme", format: function(table) { var time, klass, rmv, c = table.config, // ["up/down arrow (cssHeaders, unsorted)", "down arrow (cssDesc, descending)", "up arrow (cssAsc, ascending)" ] icons = ["ui-icon-arrowthick-2-n-s", "ui-icon-arrowthick-1-s", "ui-icon-arrowthick-1-n"]; if (c.widgetUitheme && c.widgetUitheme.hasOwnProperty('css')) { icons = c.widgetUitheme.css || icons; } rmv = icons.join(' '); if (c.debug) { time = new Date(); } if (!$(table).is('.ui-theme')) { $(table).addClass('ui-widget ui-widget-content ui-corner-all ui-theme'); $.each(c.headerList, function(){ $(this) // using "ui-theme" class in case the user adds their own ui-icon using onRenderHeader .addClass('ui-widget-header ui-corner-all') .append('') .hover(function(){ $(this).addClass('ui-state-hover'); }, function(){ $(this).removeClass('ui-state-hover'); }); }); } $.each(c.headerList, function(i){ if (c.headers[i] && c.headers[i].sorter === false) { // no sort arrows for disabled columns! $(this).find('span.ui-icon').removeClass(rmv + ' ui-icon'); } else { klass = ($(this).is('.' + c.cssAsc)) ? icons[1] : ($(this).is('.' + c.cssDesc)) ? icons[2] : $(this).is('.' + c.cssHeader) ? icons[0] : ''; $(this)[klass === icons[0] ? 'removeClass' : 'addClass']('ui-state-active') .find('span.ui-icon').removeClass(rmv).addClass(klass); } }); if (c.debug) { $.tablesorter.benchmark("Applying uitheme widget", time); } } }); // Add Column styles widget // ************************** $.tablesorter.addWidget({ id: "columns", format: function(table) { var $td, time, i, last, rmv, c = table.config, list = c.sortList, len = list.length, css = [ "primary", "secondary", "tertiary" ]; if (c.widgetColumns && c.widgetColumns.hasOwnProperty('css')) { css = c.widgetColumns.css || css; } last = css.length-1; rmv = css.join(' '); if (c.debug) { time = new Date(); } // check if there is a sort (on initialization there may not be one) if (list && list[0]) { // loop through the visible rows $("tr:visible", table.tBodies[0]).each(function (i) { $td = $(this).children().removeClass(rmv); // primary sort column class $td.eq(list[0][0]).addClass(css[0]); if (len > 1) { for (i=1; i= 0) { r = (r) ? true : false; } else if (v[i] !== '') { r = false; } } $(this)[r ? 'show' : 'hide'](); }); } tbl.trigger('applyWidgets'); // make sure zebra widget is applied }); c.filtering = true; if (c.debug) { $.tablesorter.benchmark("Applying Filter widget", time); } } } }); // Sticky header widget // based on this awesome article: // http://css-tricks.com/13465-persistent-headers/ // ************************** $.tablesorter.addWidget({ id: "stickyHeaders", format: function(table) { if ($(table).find('.stickyHeader').length) { return; } var win = $(window), header = $(table).find('thead'), hdrCells = header.find('tr').children(), sticky = header.find('tr').clone() .addClass('stickyHeader') .css({ width : header.width(), position : 'fixed', top : 0, visibility : 'hidden' }), stkyCells = sticky.children(); // update sticky header class names to match real header $(table).bind('sortEnd', function(e,t){ var th = $(t).find('thead tr'), sh = th.filter('.stickyHeader').children(); th.filter(':not(.stickyHeader)').children().each(function(i){ sh.eq(i).attr('class', $(this).attr('class')); }); }); // set sticky header cell width and link clicks to real header hdrCells.each(function(i){ var t = $(this), s = stkyCells.eq(i) // set cell widths .width( t.width() ) // clicking on sticky will trigger sort .bind('click', function(e){ t.trigger(e); }) // prevent sticky header text selection .bind('mousedown', function(){ this.onselectstart = function(){ return false; }; return false; }); }); header.prepend( sticky ); // make it sticky! win.scroll(function(){ var $t = $(table), offset = $t.offset(), sTop = win.scrollTop(), sticky = $t.find('.stickyHeader'), vis = ((sTop > offset.top) && (sTop < offset.top + $t.height())) ? 'visible' : 'hidden'; sticky.css('visibility', vis); }); } }); })(jQuery);