1/** 2 * stacktable.js 3 * Author & copyright (c) 2012: John Polacek 4 * CardTable by: Justin McNally (2015) 5 * Dual MIT & GPL license 6 * 7 * Page: http://johnpolacek.github.com/stacktable.js 8 * Repo: https://github.com/johnpolacek/stacktable.js/ 9 * 10 * jQuery plugin for stacking tables on small screens 11 * 12 */ 13;(function($) { 14 $.fn.cardtable = function(options) { 15 var $tables = this, 16 defaults = {id:'stacktable small-only',hideOriginal:true,headIndex:0}, 17 settings = $.extend({}, defaults, options); 18 19 // checking the "headIndex" option presence... or defaults it to 0 20 if(options && options.headIndex) 21 headIndex = options.headIndex; 22 else 23 headIndex = 0; 24 25 return $tables.each(function() { 26 $table = $(this); 27 if ($table.hasClass('stacktable')) { 28 return; 29 } 30 var table_css = $(this).prop('class'); 31 var $stacktable = $('<div></div>'); 32 if (typeof settings.myClass !== 'undefined') $stacktable.addClass(settings.myClass); 33 var markup = ''; 34 35 36 $table.addClass('stacktable large-only'); 37 $caption = $table.find("caption").clone(); 38 $topRow = $table.find('tr').eq(0); 39 40 // using rowIndex and cellIndex in order to reduce ambiguity 41 $table.find('tbody tr').each(function(rowIndex,value) { 42 43 // declaring headMarkup and bodyMarkup, to be used for separately head and body of single records 44 headMarkup = ''; 45 bodyMarkup = ''; 46 tr_class = $(this).prop('class'); 47 tr_data = $(this).attr('data-item'); 48 tr_type = $(this).attr('data-type'); 49 tr_product = $(this).attr('data-product'); 50 // for the first row, "headIndex" cell is the head of the table 51 // for the other rows, put the "headIndex" cell as the head for that row 52 // then iterate through the key/values 53 $(this).find('td,th').each(function(cellIndex,value) { 54 if ($(this).html() !== ''){ 55 bodyMarkup += '<tr class="' + tr_class +'">'; 56 if ($topRow.find('td,th').eq(cellIndex).html()){ 57 bodyMarkup += '<td class="st-key">'+$table.find('thead th').eq(cellIndex).html()+'</td>'; 58 } else { 59 bodyMarkup += '<td class="st-key"></td>'; 60 } 61 bodyMarkup += '<td class="st-val '+$(this).prop('class') +'">'+$(this).html()+'</td>'; 62 bodyMarkup += '</tr>'; 63 } 64 }); 65 66 markup += '<table class=" '+ table_css +' '+settings.id+'"><tbody>' + headMarkup + bodyMarkup + '</tbody></table>'; 67 }); 68 69 $table.find('tfoot tr td').each(function(rowIndex,value) { 70 if ($.trim($(value).text()) !== '') { 71 markup += '<table class="'+ table_css + ' ' +settings.id+'"><tbody><tr><td>' + $(value).html() + '</td></tr></tbody></table>'; 72 } 73 }); 74 75 $stacktable.prepend($caption); 76 $stacktable.append($(markup)); 77 $table.before($stacktable); 78 if (!settings.hideOriginal) $table.show(); 79 }); 80 }; 81 82 $.fn.stacktable = function(options) { 83 var $tables = this, 84 defaults = {id:'stacktable small-only',hideOriginal:true,headIndex:0}, 85 settings = $.extend({}, defaults, options); 86 87 // checking the "headIndex" option presence... or defaults it to 0 88 if(options && options.headIndex) 89 headIndex = options.headIndex; 90 else 91 headIndex = 0; 92 93 return $tables.each(function() { 94 var table_css = $(this).prop('class'); 95 var $stacktable = $('<table class="'+ table_css +' '+settings.id+'"><tbody></tbody></table>'); 96 if (typeof settings.myClass !== 'undefined') $stacktable.addClass(settings.myClass); 97 var markup = ''; 98 99 $table = $(this); 100 $table.addClass('stacktable large-only'); 101 $caption = $table.find("caption").clone(); 102 $topRow = $table.find('tr').eq(0); 103 104 // using rowIndex and cellIndex in order to reduce ambiguity 105 $table.find('tr').each(function(rowIndex,value) { 106 // declaring headMarkup and bodyMarkup, to be used for separately head and body of single records 107 headMarkup = ''; 108 bodyMarkup = ''; 109 tr_class = $(this).prop('class'); 110 tr_data = $(this).attr('data-item'); 111 tr_type = $(this).attr('data-type'); 112 tr_product = $(this).attr('data-product'); 113 tr_confirm = $(this).attr('data-confirm'); 114 // for the first row, "headIndex" cell is the head of the table 115 if (rowIndex === 0) { 116 // the main heading goes into the markup variable 117 markup += '<tr class=" '+tr_class +' " ' + ((tr_data)?'data-item = "'+tr_data+'"':'') +' ' + ((tr_type)?'data-type = "'+tr_type+'"':'') +' ' + ((tr_product)?'data-product = "'+tr_product+'"':'') +' ' + ((tr_confirm)?'data-confirm = "'+tr_confirm+'"'
117:'') +'><th class="st-head-row st-head-row-main" colspan="2">'+$(this).find('th,td').eq(headIndex).html()+'</th></tr>'; 118 } 119 else { 120 // for the other rows, put the "headIndex" cell as the head for that row 121 // then iterate through the key/values 122 $(this).find('td,th').each(function(cellIndex,value) { 123 if (cellIndex === headIndex) { 124 headMarkup = '<tr class="'+ tr_class+'" ' + ((tr_data)?'data-item = "'+tr_data+'"':'') +' ' + ((tr_type)?'data-type = "'+tr_type+'"':'') +' ' + ((tr_product)?'data-product = "'+tr_product+'"':'') +' ' + ((tr_confirm)?'data-confirm = "'+tr_confirm+'"':'') +'><th class="st-head-row" colspan="2">'+$(this).html()+'</th></tr>'; 125 } else { 126 if ($(this).html() !== ''){ 127 bodyMarkup += '<tr class="' + tr_class +'" ' + ((tr_data)?'data-item = "'+tr_data+'"':'') +' ' + ((tr_type)?'data-type = "'+tr_type+'"':'') +' ' + ((tr_product)?'data-product = "'+tr_product+'"':'') +' ' + ((tr_confirm)?'data-confirm = "'+tr_confirm+'"':'') +'>'; 128 if ($topRow.find('td,th').eq(cellIndex).html()){ 129 bodyMarkup += '<td class="st-key">'+$topRow.find('td,th').eq(cellIndex).html()+'</td>'; 130 } else { 131 bodyMarkup += '<td class="st-key"></td>'; 132 } 133 bodyMarkup += '<td class="st-val '+$(this).prop('class') +'">'+$(this).html()+'</td>'; 134 bodyMarkup += '</tr>'; 135 } 136 } 137 }); 138 139 markup += headMarkup + bodyMarkup; 140 } 141 }); 142 143 $stacktable.prepend($caption); 144 $stacktable.append($(markup)); 145 $table.before($stacktable); 146 if (!settings.hideOriginal) $table.show(); 147 }); 148 }; 149 150 $.fn.stackcolumns = function(options) { 151 var $tables = this, 152 defaults = {id:'stacktable small-only',hideOriginal:true}, 153 settings = $.extend({}, defaults, options); 154 155 return $tables.each(function() { 156 $table = $(this); 157 var num_cols = $table.find('tr').eq(0).find('td,th').length; //first table <tr> must not contain colspans, or add sum(colspan-1) here. 158 if(num_cols<3) //stackcolumns has no effect on tables with less than 3 columns 159 return; 160 161 var $stackcolumns = $('<table class="'+settings.id+'"></table>'); 162 if (typeof settings.myClass !== 'undefined') $stackcolumns.addClass(settings.myClass); 163 $table.addClass('stacktable large-only'); 164 var tb = $('<tbody></tbody>'); 165 var col_i = 1; //col index starts at 0 -> start copy at second column. 166 167 while (col_i < num_cols) { 168 $table.find('tr').each(function(index,value) { 169 var tem = $('<tr></tr>'); // todo opt. copy styles of $this; todo check if parent is thead or tfoot to handle accordingly 170 if(index === 0) tem.addClass("st-head-row st-head-row-main"); 171 first = $(this).find('td,th').eq(0).clone().addClass("st-key"); 172 var target = col_i; 173 // if colspan apply, recompute target for second cell. 174 if ($(this).find("*[colspan]").length) { 175 var i =0; 176 $(this).find('td,th').each(function(index,value) { 177 var cs = $(this).attr("colspan"); 178 if (cs) { 179 cs = parseInt(cs, 10); 180 target -= cs-1; 181 if ((i+cs) > (col_i)) //out of current bounds 182 target += i + cs - col_i -1; 183 i += cs; 184 } 185 else 186 i++; 187 188 if (i > col_i) 189 return false; //target is set; break. 190 }); 191 } 192 second = $(this).find('td,th').eq(target).clone().addClass("st-val").removeAttr("colspan"); 193 tem.append(first, second); 194 tb.append(tem); 195 }); 196 ++col_i; 197 } 198 199 $stackcolumns.append($(tb)); 200 $table.before($stackcolumns); 201 if (!(settings.hideOriginal)) { 202 $table.show(); 203 } 204 }); 205 }; 206 207}(jQuery));
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.