/*
|
* tablesaw: A set of plugins for responsive tables
|
* Stack: switches from column layout to rows with inline labels
|
* Copyright (c) 2013 Filament Group, Inc.
|
* MIT License
|
*/
|
|
;(function( win, $, undefined ){
|
|
var classes = {
|
stackTable: 'tablesaw-stack',
|
cellLabels: 'tablesaw-cell-label',
|
cellContentLabels: 'tablesaw-cell-content'
|
};
|
|
var data = {
|
obj: 'tablesaw-stack'
|
};
|
|
var attrs = {
|
labelless: 'data-tablesaw-no-labels',
|
hideempty: 'data-tablesaw-hide-empty'
|
};
|
|
var Stack = function( element ) {
|
|
this.$table = $( element );
|
|
this.labelless = this.$table.is( '[' + attrs.labelless + ']' );
|
this.hideempty = this.$table.is( '[' + attrs.hideempty + ']' );
|
|
if( !this.labelless ) {
|
// allHeaders references headers, plus all THs in the thead, which may include several rows, or not
|
this.allHeaders = this.$table.find( "th" );
|
}
|
|
this.$table.data( data.obj, this );
|
};
|
|
Stack.prototype.init = function( colstart ) {
|
this.$table.addClass( classes.stackTable );
|
|
if( this.labelless ) {
|
return;
|
}
|
|
// get headers in reverse order so that top-level headers are appended last
|
var reverseHeaders = $( this.allHeaders );
|
var hideempty = this.hideempty;
|
|
// create the hide/show toggles
|
reverseHeaders.each(function(){
|
var $t = $( this ),
|
$cells = $( this.cells ).filter(function() {
|
return !$( this ).parent().is( "[" + attrs.labelless + "]" ) && ( !hideempty || !$( this ).is( ":empty" ) );
|
}),
|
hierarchyClass = $cells.not( this ).filter( "thead th" ).length && " tablesaw-cell-label-top",
|
// TODO reduce coupling with sortable
|
$sortableButton = $t.find( ".tablesaw-sortable-btn" ),
|
html = $sortableButton.length ? $sortableButton.html() : $t.html();
|
|
if( html !== "" ){
|
if( hierarchyClass ){
|
var iteration = parseInt( $( this ).attr( "colspan" ), 10 ),
|
filter = "";
|
|
if( iteration ){
|
filter = "td:nth-child("+ iteration +"n + " + ( colstart ) +")";
|
}
|
$cells.filter( filter ).prepend( "<b class='" + classes.cellLabels + hierarchyClass + "'>" + html + "</b>" );
|
} else {
|
$cells.wrapInner( "<span class='" + classes.cellContentLabels + "'></span>" );
|
$cells.prepend( "<b class='" + classes.cellLabels + "'>" + html + "</b>" );
|
}
|
}
|
});
|
};
|
|
Stack.prototype.destroy = function() {
|
this.$table.removeClass( classes.stackTable );
|
this.$table.find( '.' + classes.cellLabels ).remove();
|
this.$table.find( '.' + classes.cellContentLabels ).each(function() {
|
$( this ).replaceWith( this.childNodes );
|
});
|
};
|
|
// on tablecreate, init
|
$( document ).on( "tablesawcreate", function( e, Tablesaw, colstart ){
|
if( Tablesaw.mode === 'stack' ){
|
var table = new Stack( Tablesaw.table );
|
table.init( colstart );
|
}
|
|
} );
|
|
$( document ).on( "tablesawdestroy", function( e, Tablesaw ){
|
|
if( Tablesaw.mode === 'stack' ){
|
$( Tablesaw.table ).data( data.obj ).destroy();
|
}
|
|
} );
|
|
}( this, jQuery ));
|
