vendor/assets/javascripts/dataTables.responsive.js in bootswatch_rails-3.3.2.1 vs vendor/assets/javascripts/dataTables.responsive.js in bootswatch_rails-3.3.4.1

- old
+ new

@@ -1,17 +1,17 @@ -/*! Responsive 1.0.2 - * 2014 SpryMedia Ltd - datatables.net/license +/*! Responsive 1.0.5 + * 2014-2015 SpryMedia Ltd - datatables.net/license */ /** * @summary Responsive * @description Responsive tables plug-in for DataTables - * @version 1.0.2 + * @version 1.0.5 * @file dataTables.responsive.js * @author SpryMedia Ltd (www.sprymedia.co.uk) * @contact www.sprymedia.co.uk/contact - * @copyright Copyright 2014 SpryMedia Ltd. + * @copyright Copyright 2014-2015 SpryMedia Ltd. * * This source file is free software, available under the following license: * MIT license - http://datatables.net/license/mit * * This source file is distributed in the hope that it will be useful, but @@ -120,43 +120,56 @@ that._resize(); } ) ); // Destroy event handler dt.on( 'destroy.dtr', function () { - $(window).off( 'resize.dtr orientationchange.dtr' ); + $(window).off( 'resize.dtr orientationchange.dtr draw.dtr' ); } ); // Reorder the breakpoints array here in case they have been added out // of order this.c.breakpoints.sort( function (a, b) { return a.width < b.width ? 1 : a.width > b.width ? -1 : 0; } ); // Determine which columns are already hidden, and should therefore - // remain hidden. TODO - should this be done? See thread 22677 + // remain hidden. todo - should this be done? See thread 22677 // // this.s.alwaysHidden = dt.columns(':hidden').indexes(); this._classLogic(); this._resizeAuto(); - // First pass - draw the table for the current viewport size - this._resize(); - // Details handler var details = this.c.details; if ( details.type ) { that._detailsInit(); this._detailsVis(); dt.on( 'column-visibility.dtr', function () { that._detailsVis(); } ); + // Redraw the details box on each draw. This is used until + // DataTables implements a native `updated` event for rows + dt.on( 'draw.dtr', function () { + dt.rows( {page: 'current'} ).iterator( 'row', function ( settings, idx ) { + var row = dt.row( idx ); + + if ( row.child.isShown() ) { + var info = that.c.details.renderer( dt, idx ); + row.child( info, 'child' ).show(); + } + } ); + } ); + $(dt.table().node()).addClass( 'dtr-'+details.type ); } + + // First pass - draw the table for the current viewport size + this._resize(); }, /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * Private methods @@ -198,29 +211,47 @@ if ( display[i] === true ) { requiredWidth += columns[i].minWidth; } } - // Second pass, use up any remaining width for other columns - var widthAvailable = dt.table().container().offsetWidth; + // Second pass, use up any remaining width for other columns. For + // scrolling tables we need to subtract the width of the scrollbar. It + // may not be requires which makes this sub-optimal, but it would + // require another full redraw to make complete use of those extra few + // pixels + var scrolling = dt.settings()[0].oScroll; + var bar = scrolling.sY || scrolling.sX ? scrolling.iBarWidth : 0; + var widthAvailable = dt.table().container().offsetWidth - bar; var usedWidth = widthAvailable - requiredWidth; + // Control column needs to always be included. This makes it sub- + // optimal in terms of using the available with, but to stop layout + // thrashing or overflow. Also we need to account for the control column + // width first so we know how much width is available for the other + // columns, since the control column might not be the first one shown for ( i=0, ien=display.length ; i<ien ; i++ ) { - // Control column needs to always be included. This makes it sub- - // optimal in terms of using the available with, but to stop layout - // thrashing or overflow if ( columns[i].control ) { usedWidth -= columns[i].minWidth; } - else if ( display[i] === '-' ) { - // Otherwise, remove the width - display[i] = usedWidth - columns[i].minWidth < 0 ? - false : - true; + } - // Continue counting down the width, so a smaller column to the - // left won't be shown + // Allow columns to be shown (counting from the left) until we run out + // of room + var empty = false; + for ( i=0, ien=display.length ; i<ien ; i++ ) { + if ( display[i] === '-' && ! columns[i].control ) { + // Once we've found a column that won't fit we don't let any + // others display either, or columns might disappear in the + // middle of the table + if ( empty || usedWidth - columns[i].minWidth < 0 ) { + empty = true; + display[i] = false; + } + else { + display[i] = true; + } + usedWidth -= columns[i].minWidth; } } // Determine if the 'control' column should be shown (if there is one). @@ -474,15 +505,12 @@ if ( hiddenColumns.length === 0 || ( hiddenColumns.length === 1 && this.s.columns[ hiddenColumns[0] ].control ) ) { haveHidden = false; } if ( haveHidden ) { - // Got hidden columns - $( dt.table().node() ).addClass('collapsed'); - // Show all existing child rows - dt.rows().eq(0).each( function (idx) { + dt.rows( { page: 'current' } ).eq(0).each( function (idx) { var row = dt.row( idx ); if ( row.child() ) { var info = that.c.details.renderer( dt, row[0] ); @@ -495,15 +523,12 @@ } } } ); } else { - // No hidden columns - $( dt.table().node() ).removeClass('collapsed'); - // Hide all existing child rows - dt.rows().eq(0).each( function (idx) { + dt.rows( { page: 'current' } ).eq(0).each( function (idx) { dt.row( idx ).child.hide(); } ); } }, @@ -536,24 +561,39 @@ { var dt = this.s.dt; var width = $(window).width(); var breakpoints = this.c.breakpoints; var breakpoint = breakpoints[0].name; + var columns = this.s.columns; + var i, ien; // Determine what breakpoint we are currently at - for ( var i=breakpoints.length-1 ; i>=0 ; i-- ) { + for ( i=breakpoints.length-1 ; i>=0 ; i-- ) { if ( width <= breakpoints[i].width ) { breakpoint = breakpoints[i].name; break; } } // Show the columns for that break point - var columns = this._columnsVisiblity( breakpoint ); + var columnsVis = this._columnsVisiblity( breakpoint ); + // Set the class before the column visibility is changed so event + // listeners know what the state is. Need to determine if there are + // any columns that are not visible but can be shown + var collapsedClass = false; + for ( i=0, ien=columns.length ; i<ien ; i++ ) { + if ( columnsVis[i] === false && ! columns[i].never ) { + collapsedClass = true; + break; + } + } + + $( dt.table().node() ).toggleClass('collapsed', collapsedClass ); + dt.columns().eq(0).each( function ( colIdx, i ) { - dt.column( colIdx ).visible( columns[i] ); + dt.column( colIdx ).visible( columnsVis[i] ); } ); }, /** @@ -585,10 +625,12 @@ var columnWidths = dt.columns; var clonedTable = dt.table().node().cloneNode( false ); var clonedHeader = $( dt.table().header().cloneNode( false ) ).appendTo( clonedTable ); var clonedBody = $( dt.table().body().cloneNode( false ) ).appendTo( clonedTable ); + $( dt.table().footer() ).clone( false ).appendTo( clonedTable ); + // This is a bit slow, but we need to get a clone of each row that // includes all columns. As such, try to do this as little as possible. dt.rows( { page: 'current' } ).indexes().flatten().each( function ( idx ) { var clone = dt.row( idx ).node().cloneNode( true ); @@ -597,12 +639,16 @@ } $(clone).appendTo( clonedBody ); } ); - var cells = dt.columns().header().to$().clone( false ).wrapAll('tr').appendTo( clonedHeader ); - var inserted = $('<div/>') + var cells = dt.columns().header().to$().clone( false ); + $('<tr/>') + .append( cells ) + .appendTo( clonedHeader ); + + var inserted = $('<div/>') .css( { width: 1, height: 1, overflow: 'hidden' } ) @@ -697,14 +743,18 @@ // this type of data retrieval var dtPrivate = api.settings()[0]; var cellData = dtPrivate.oApi._fnGetCellData( dtPrivate, idx.row, idx.column, 'display' ); + var title = header.text(); + if ( title ) { + title = title + ':'; + } return '<li data-dtr-index="'+idx.column+'">'+ '<span class="dtr-title">'+ - header.text()+':'+ + title+ '</span> '+ '<span class="dtr-data">'+ cellData+ '</span>'+ '</li>'; @@ -730,49 +780,63 @@ // Doesn't do anything - work around for a bug in DT... Not documented Api.register( 'responsive()', function () { return this; } ); -Api.register( 'responsive.recalc()', function () { - this.iterator( 'table', function ( ctx ) { - if ( ctx._responsive ) { - ctx._responsive._resizeAuto(); - ctx._responsive._resize(); - } - } ); -} ); - Api.register( 'responsive.index()', function ( li ) { li = $(li); return { column: li.data('dtr-index'), row: li.parent().data('dtr-index') }; } ); +Api.register( 'responsive.rebuild()', function () { + return this.iterator( 'table', function ( ctx ) { + if ( ctx._responsive ) { + ctx._responsive._classLogic(); + } + } ); +} ); +Api.register( 'responsive.recalc()', function () { + return this.iterator( 'table', function ( ctx ) { + if ( ctx._responsive ) { + ctx._responsive._resizeAuto(); + ctx._responsive._resize(); + } + } ); +} ); + + /** * Version information * * @name Responsive.version * @static */ -Responsive.version = '1.0.2'; +Responsive.version = '1.0.5'; $.fn.dataTable.Responsive = Responsive; $.fn.DataTable.Responsive = Responsive; // Attach a listener to the document which listens for DataTables initialisation // events so we can automatically initialise $(document).on( 'init.dt.dtr', function (e, settings, json) { + if ( e.namespace !== 'dt' ) { + return; + } + if ( $(settings.nTable).hasClass( 'responsive' ) || $(settings.nTable).hasClass( 'dt-responsive' ) || settings.oInit.responsive || DataTable.defaults.responsive ) { + console.log( e.namespace ); + var init = settings.oInit.responsive; if ( init !== false ) { new Responsive( settings, $.isPlainObject( init ) ? init : {} ); } @@ -796,6 +860,5 @@ factory( jQuery, jQuery.fn.dataTable ); } })(window, document); -