app/assets/javascripts/datatables/extensions/Responsive/dataTables.responsive.js in jquery-datatables-1.10.15 vs app/assets/javascripts/datatables/extensions/Responsive/dataTables.responsive.js in jquery-datatables-1.10.16

- old
+ new

@@ -1,17 +1,17 @@ -/*! Responsive 2.1.1 - * 2014-2016 SpryMedia Ltd - datatables.net/license +/*! Responsive 2.2.1-dev + * 2014-2017 SpryMedia Ltd - datatables.net/license */ /** * @summary Responsive * @description Responsive tables plug-in for DataTables - * @version 2.1.1 + * @version 2.2.1-dev * @file dataTables.responsive.js * @author SpryMedia Ltd (www.sprymedia.co.uk) * @contact www.sprymedia.co.uk/contact - * @copyright Copyright 2014-2016 SpryMedia Ltd. + * @copyright Copyright 2014-2017 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 @@ -760,12 +760,17 @@ } $( dt.table().node() ).toggleClass( 'collapsed', collapsedClass ); var changed = false; + var visible = 0; dt.columns().eq(0).each( function ( colIdx, i ) { + if ( columnsVis[i] === true ) { + visible++; + } + if ( columnsVis[i] !== oldVis[i] ) { changed = true; that._setColumnVis( colIdx, columnsVis[i] ); } } ); @@ -773,10 +778,15 @@ if ( changed ) { this._redrawChildren(); // Inform listeners of the change $(dt.table().node()).trigger( 'responsive-resize.dt', [dt, this.s.current] ); + + // If no records, update the "No records" display element + if ( dt.page.info().recordsDisplay === 0 ) { + $('td', dt.table().body()).eq(0).attr('colspan', visible); + } } }, /** @@ -801,10 +811,19 @@ // have classes defined if ( $.inArray( true, $.map( columns, function (c) { return c.auto; } ) ) === -1 ) { return; } + // Need to restore all children. They will be reinstated by a re-render + if ( ! $.isEmptyObject( _childNodeStore ) ) { + $.each( _childNodeStore, function ( key ) { + var idx = key.split('-'); + + _childNodesRestore( dt, idx[0]*1, idx[1]*1 ); + } ); + } + // Clone the table with the current data in it var tableWidth = dt.table().node().offsetWidth; var columnWidths = dt.columns; var clonedTable = dt.table().node().cloneNode( false ); var clonedHeader = $( dt.table().header().cloneNode( false ) ).appendTo( clonedTable ); @@ -862,11 +881,12 @@ var inserted = $('<div/>') .css( { width: 1, height: 1, - overflow: 'hidden' + overflow: 'hidden', + clear: 'both' } ) .append( clonedTable ); inserted.insertBefore( dt.table().node() ); @@ -897,10 +917,17 @@ var display = showHide ? '' : 'none'; // empty string will remove the attr $( dt.column( col ).header() ).css( 'display', display ); $( dt.column( col ).footer() ).css( 'display', display ); dt.column( col ).nodes().to$().css( 'display', display ); + + // If the are child nodes stored, we might need to reinsert them + if ( ! $.isEmptyObject( _childNodeStore ) ) { + dt.cells( null, col ).indexes().each( function (idx) { + _childNodesRestore( dt, idx.row, idx.column ); + } ); + } }, /** * Update the cell tab indexes for keyboard accessibility. This is called on @@ -1058,19 +1085,92 @@ }; } }; +var _childNodeStore = {}; + +function _childNodes( dt, row, col ) { + var name = row+'-'+col; + + if ( _childNodeStore[ name ] ) { + return _childNodeStore[ name ]; + } + + // https://jsperf.com/childnodes-array-slice-vs-loop + var nodes = []; + var children = dt.cell( row, col ).node().childNodes; + for ( var i=0, ien=children.length ; i<ien ; i++ ) { + nodes.push( children[i] ); + } + + _childNodeStore[ name ] = nodes; + + return nodes; +} + +function _childNodesRestore( dt, row, col ) { + var name = row+'-'+col; + + if ( ! _childNodeStore[ name ] ) { + return; + } + + var node = dt.cell( row, col ).node(); + var store = _childNodeStore[ name ]; + var parent = store[0].parentNode; + var parentChildren = parent.childNodes; + var a = []; + + for ( var i=0, ien=parentChildren.length ; i<ien ; i++ ) { + a.push( parentChildren[i] ); + } + + for ( var j=0, jen=a.length ; j<jen ; j++ ) { + node.appendChild( a[j] ); + } + + _childNodeStore[ name ] = undefined; +} + + /** * Display methods - functions which define how the hidden data should be shown * in the table. * * @namespace * @name Responsive.defaults * @static */ Responsive.renderer = { + listHiddenNodes: function () { + return function ( api, rowIdx, columns ) { + var ul = $('<ul data-dtr-index="'+rowIdx+'" class="dtr-details"/>'); + var found = false; + + var data = $.each( columns, function ( i, col ) { + if ( col.hidden ) { + $( + '<li data-dtr-index="'+col.columnIndex+'" data-dt-row="'+col.rowIndex+'" data-dt-column="'+col.columnIndex+'">'+ + '<span class="dtr-title">'+ + col.title+ + '</span> '+ + '</li>' + ) + .append( $('<span class="dtr-data"/>').append( _childNodes( api, col.rowIndex, col.columnIndex ) ) )// api.cell( col.rowIndex, col.columnIndex ).node().childNodes ) ) + .appendTo( ul ); + + found = true; + } + } ); + + return found ? + ul : + false; + }; + }, + listHidden: function () { return function ( api, rowIdx, columns ) { var data = $.map( columns, function ( col ) { return col.hidden ? '<li data-dtr-index="'+col.columnIndex+'" data-dt-row="'+col.rowIndex+'" data-dt-column="'+col.columnIndex+'">'+ @@ -1222,10 +1322,10 @@ * Version information * * @name Responsive.version * @static */ -Responsive.version = '2.1.1'; +Responsive.version = '2.2.1-dev'; $.fn.dataTable.Responsive = Responsive; $.fn.DataTable.Responsive = Responsive;