From 031de90ca6a151469b6831ef54a65cc56876baf1 Mon Sep 17 00:00:00 2001 From: BoRyan Eberhard Date: Sun, 6 Dec 2015 12:20:57 -0800 Subject: [PATCH 01/17] Correctly test for whitespace-only nodeValues As written, a nodeValue of "test test" will return True which appears to be the incorrect behavior. I believe only empty nodeValues and nodes that only have whitespace characters should return True. This fix looks for any non-whitespace characters in nodeValue and only returns True if none are found. --- src/jquery.columnizer.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/jquery.columnizer.js b/src/jquery.columnizer.js index b63a410..2a9d515 100644 --- a/src/jquery.columnizer.js +++ b/src/jquery.columnizer.js @@ -348,9 +348,9 @@ var onlyNode = $clone.get(0).childNodes[0]; if(onlyNode.nodeType == 3){ // text node - var whitespace = /\s/; + var nonwhitespace = /\S/; var str = onlyNode.nodeValue; - if(whitespace.test(str)){ + if(!nonwhitespace.test(str)){ // yep, only a whitespace textnode $clone.remove(); $cloneMe.removeClass(prefixTheClassName("split")); From 2df055350395b0f5dc5a73e680bf1b9420dcda91 Mon Sep 17 00:00:00 2001 From: Christian Stuff Date: Tue, 26 Jan 2016 21:48:44 +0100 Subject: [PATCH 02/17] Implemented uncolumnize function. --- samples/index.html | 3 +- samples/sample-uncolumnize.html | 80 +++++++++++++++++++++++++++++++++ src/jquery.columnizer.js | 67 +++++++++++++++++---------- src/jquery.columnizer.min.js | 6 +-- 4 files changed, 128 insertions(+), 28 deletions(-) create mode 100644 samples/sample-uncolumnize.html diff --git a/samples/index.html b/samples/index.html index 3e12ddb..3cdc164 100644 --- a/samples/index.html +++ b/samples/index.html @@ -1,6 +1,6 @@

Columnizer JQuery Plugin

About

-

Columnizer will automatically split your 1 div of content into as many columns as will fit the user's browser! If +

Columnizer will automatically split your 1 div of content into as many columns as will fit the user's browser! If the browser is resized, columns will be automatically added or removed appropriately.

For documentation, samples, and latest news, visit the project homepage at http://welcome.totheinter.net/columnizer-jquery-plugin/

@@ -22,6 +22,7 @@

About

sample 12 - shows mix of automatic columns and manual column breaks.

sample 13 - shows only manual column breaks.

sample 14 - shows column break inside of a dontsplit item.

+

sample uncolumnize - shows uncolumnize function based on sample 1.

 

GitHub Issues

diff --git a/samples/sample-uncolumnize.html b/samples/sample-uncolumnize.html new file mode 100644 index 0000000..d4881b1 --- /dev/null +++ b/samples/sample-uncolumnize.html @@ -0,0 +1,80 @@ + + + + + Columnizer JQuery Plugin sample page + + + + + + + + +
+
+

Lorem ipsum ne justo

+

Bonorum has. His ut cibo quas tantas, vis ut probo adhuc definiebas, has at meis debet vulputate. No sed velit essent suavitate, in pro decore ceteros temporibus, usu in odio offendit theophrastus. Mel labore indoctum cu, ad soleat admodum delicatissimi sed, mei viris tritani ullamcorper eu. Ut vim simul aperiam.

+

Eu eleifend repudiandae has. Mea eu ridens aliquam. Nisl aeque sit ut, posse dolor utinam cum in. Ad timeam sapientem eos, et eripuit inermis nam. Eos integre voluptaria ne, iriure concludaturque ut eum.

+

Vis erant intellegat in. Soleat legere no ius, usu ex laoreet molestie. Sit eu sint inermis. Ea zzril scribentur pro.

+

Tempor essent appetere

+

Ius mutat commune expetendis in. Nam et quas sensibus reprimique, vix no erat soluta suavitate. At mel eius dictas latine. Corrumpit inciderint reformidans sed no, no usu omnis utinam noluisse.

+

Sit et, an ius nihil apeirian. Eu posse tempor iuvaret cum. No diam dolor sea, postea mnesarchum ne ius, vel no utinam ignota dolores. Malis suscipit accusamus his ne, utinam assentior prodesset ea eam, facer partem antiopam et cum.

+

Probo debet quaestio an eos, no mel assum iracundia delicatissimi, rebum facete utroque sed ex. Eu melius invidunt repudiandae vix, eu paulo reformidans deterruisset duo, solum voluptaria efficiantur ea mel. Qui summo zzril alienum et. Eu est ferri iuvaret, mazim epicurei sententiae ut cum, modo reque intellegat ex vix. Vim eu tibique accusamus, quot electram at qui.

+

Ex iisque eleifend periculis has. Sit aeterno virtute partiendo ei, eam nonumy bonorum adolescens ad. Ut nec suas vocent ornatus, cetero legendos constituam mea ea, pri cu delenit iracundia. Mundi decore nec te.

+

Soleat civibus in pri

+

In petentium erroribus percipitur per. Takimata accommodare ius ut, eam no postulant urbanitas. Qui ei tantas consectetuer, quis dictas euripidis duo ei. Quaeque democritum concludaturque has ne.

+

Blandit insolens constituto vix an. Has diam wisi in, eum unum repudiare no. Sit at virtute rationibus, qui vitae explicari cu. Vim ne singulis voluptatum, sed puto accusata salutandi ei. Ad mel civibus adversarium.

+

Per ne solum vivendo, fabulas dolorem vivendo in pro. Nec duis ignota cotidieque no, an per possit nostrum. Pro detraxit definitionem eu. Vivendo officiis no nam, eu has reque maiestatis percipitur, dolore reprimique accommodare cum ad. No utinam voluptua oportere pri, augue sonet dicant ei sea.

+

Sit et, an ius nihil apeirian. Eu posse tempor iuvaret cum. No diam dolor sea, postea mnesarchum ne ius, vel no utinam ignota dolores. Malis suscipit accusamus his ne, utinam assentior prodesset ea eam, facer partem antiopam et cum.

+
+
+

Lorem ipsum ne justo

+

Bonorum has. His ut cibo quas tantas, vis ut probo adhuc definiebas, has at meis debet vulputate. No sed velit essent suavitate, in pro decore ceteros temporibus, usu in odio offendit theophrastus. Mel labore indoctum cu, ad soleat admodum delicatissimi sed, mei viris tritani ullamcorper eu. Ut vim simul aperiam.

+

Blandit insolens constituto vix an. Has diam wisi in, eum unum repudiare no. Sit at virtute rationibus, qui vitae explicari cu. Vim ne singulis voluptatum, sed puto accusata salutandi ei. Ad mel civibus adversarium.

+

Ius mutat commune expetendis in. Nam et quas sensibus reprimique, vix no erat soluta suavitate. At mel eius dictas latine. Corrumpit inciderint reformidans sed no, no usu omnis utinam noluisse.

+

Probo debet quaestio an eos, no mel assum iracundia delicatissimi, rebum facete utroque sed ex. Eu melius invidunt repudiandae vix, eu paulo reformidans deterruisset duo, solum voluptaria efficiantur ea mel. Qui summo zzril alienum et. Eu est ferri iuvaret, mazim epicurei sententiae ut cum, modo reque intellegat ex vix. Vim eu tibique accusamus, quot electram at qui.

+

Eu eleifend repudiandae has. Mea eu ridens aliquam. Nisl aeque sit ut, posse dolor utinam cum in. Ad timeam sapientem eos, et eripuit inermis nam. Eos integre voluptaria ne, iriure concludaturque ut eum.

+

Sit et, an ius nihil apeirian. Eu posse tempor iuvaret cum. No diam dolor sea, postea mnesarchum ne ius, vel no utinam ignota dolores. Malis suscipit accusamus his ne, utinam assentior prodesset ea eam, facer partem antiopam et cum.

+

Vis erant intellegat in. Soleat legere no ius, usu ex laoreet molestie. Sit eu sint inermis. Ea zzril scribentur pro.

+

Tempor essent appetere

+

Ius mutat commune expetendis in. Nam et quas sensibus reprimique, vix no erat soluta suavitate. At mel eius dictas latine. Corrumpit inciderint reformidans sed no, no usu omnis utinam noluisse.

+

Sit et, an ius nihil apeirian. Eu posse tempor iuvaret cum. No diam dolor sea, postea mnesarchum ne ius, vel no utinam ignota dolores. Malis suscipit accusamus his ne, utinam assentior prodesset ea eam, facer partem antiopam et cum.

+

Blandit insolens constituto vix an. Has diam wisi in, eum unum repudiare no. Sit at virtute rationibus, qui vitae explicari cu. Vim ne singulis voluptatum, sed puto accusata salutandi ei. Ad mel civibus adversarium.

+

Per ne solum vivendo, fabulas dolorem vivendo in pro. Nec duis ignota cotidieque no, an per possit nostrum. Pro detraxit definitionem eu. Vivendo officiis no nam, eu has reque maiestatis percipitur, dolore reprimique accommodare cum ad. No utinam voluptua oportere pri, augue sonet dicant ei sea.

+

Probo debet quaestio an eos, no mel assum iracundia delicatissimi, rebum facete utroque sed ex. Eu melius invidunt repudiandae vix, eu paulo reformidans deterruisset duo, solum voluptaria efficiantur ea mel. Qui summo zzril alienum et. Eu est ferri iuvaret, mazim epicurei sententiae ut cum, modo reque intellegat ex vix. Vim eu tibique accusamus, quot electram at qui.

+

Ex iisque eleifend periculis has. Sit aeterno virtute partiendo ei, eam nonumy bonorum adolescens ad. Ut nec suas vocent ornatus, cetero legendos constituam mea ea, pri cu delenit iracundia. Mundi decore nec te.

+

Soleat civibus in pri

+

In petentium erroribus percipitur per. Takimata accommodare ius ut, eam no postulant urbanitas. Qui ei tantas consectetuer, quis dictas euripidis duo ei. Quaeque democritum concludaturque has ne.

+

Blandit insolens constituto vix an. Has diam wisi in, eum unum repudiare no. Sit at virtute rationibus, qui vitae explicari cu. Vim ne singulis voluptatum, sed puto accusata salutandi ei. Ad mel civibus adversarium.

+

Ius mutat commune expetendis in. Nam et quas sensibus reprimique, vix no erat soluta suavitate. At mel eius dictas latine. Corrumpit inciderint reformidans sed no, no usu omnis utinam noluisse.

+

Sit et, an ius nihil apeirian. Eu posse tempor iuvaret cum. No diam dolor sea, postea mnesarchum ne ius, vel no utinam ignota dolores. Malis suscipit accusamus his ne, utinam assentior prodesset ea eam, facer partem antiopam et cum.

+

Per ne solum vivendo, fabulas dolorem vivendo in pro. Nec duis ignota cotidieque no, an per possit nostrum. Pro detraxit definitionem eu. Vivendo officiis no nam, eu has reque maiestatis percipitur, dolore reprimique accommodare cum ad. No utinam voluptua oportere pri, augue sonet dicant ei sea.

+

Sit et, an ius nihil apeirian. Eu posse tempor iuvaret cum. No diam dolor sea, postea mnesarchum ne ius, vel no utinam ignota dolores. Malis suscipit accusamus his ne, utinam assentior prodesset ea eam, facer partem antiopam et cum.

+
+ + +
+ + diff --git a/src/jquery.columnizer.js b/src/jquery.columnizer.js index 2a9d515..6e94a29 100644 --- a/src/jquery.columnizer.js +++ b/src/jquery.columnizer.js @@ -3,14 +3,21 @@ // created by: Adam Wulf @adamwulf, adam.wulf@gmail.com (function($){ + var DATA_ORIGINAL_DOM_KEY = 'columnizer-original-dom'; $.fn.columnize = function(options) { - this.cols =[]; - this.offset= 0; + // save original DOM clone as data + this.each(function() { + var $el = $(this); + $el.data(DATA_ORIGINAL_DOM_KEY, $el.clone(true, true)); + }); + + this.cols =[]; + this.offset= 0; this.before=[]; - this.lastOther=0; + this.lastOther=0; this.prevMax =0; - this.debug=0; + this.debug=0; this.setColumnStart =null; this.elipsisText=''; @@ -27,7 +34,7 @@ overflow : false, // this function is called after content is columnized doneFunc : function(){}, - // if the content should be columnized into a + // if the content should be columnized into a // container node other than it's own node target : false, // re-columnizing when images reload might make things @@ -80,7 +87,7 @@ }; } } - + /** * appending a text node to a will * cause a jquery crash. @@ -165,7 +172,7 @@ * is a text node, then it will try to split that text node. otherwise * it will leave the node in $pullOutHere and return with a height * smaller than targetHeight. - * + * * Returns a boolean on whether we did some splitting successfully at a text point * (so we know we don't need to split a real element). return false if the caller should * split a node if possible to end this column. @@ -260,7 +267,7 @@ } /** - * Split up an element, which is more complex than splitting text. We need to create + * Split up an element, which is more complex than splitting text. We need to create * two copies of the element with it's contents divided between each */ function split($putInHere, $pullOutHere, $parentColumn, targetHeight){ @@ -311,7 +318,7 @@ }else if($clone.is("img") || $cloneMe.hasClass(prefixTheClassName("dontsplit"))){ // // it's either an image that's too tall, or an unsplittable node - // that's too tall. leave it in the pullOutHere and we'll add it to the + // that's too tall. leave it in the pullOutHere and we'll add it to the // next column $clone.remove(); }else{ @@ -324,13 +331,13 @@ // this node may still have non-text nodes to split // add the split class and then recur $cloneMe.addClass(prefixTheClassName("split")); - + //if this node was ol element, the child should continue the number ordering if($cloneMe.get(0).tagName == 'OL'){ var startWith = $clone.get(0).childElementCount + $clone.get(0).start; $cloneMe.attr('start',startWith+1); } - + if($cloneMe.children().length){ split($clone, $cloneMe, $parentColumn, targetHeight); } @@ -492,7 +499,7 @@ } // - // We loop as we try and workout a good height to use. We know it initially as an average + // We loop as we try and workout a good height to use. We know it initially as an average // but if the last column is higher than the first ones (which can happen, depending on split // points) we need to raise 'adjustment'. We try this over a few iterations until we're 'solid'. // @@ -572,7 +579,7 @@ } if(options.overflow && !scrollHorizontally){ var IE6 = false; - /*@cc_on + /*@cc_on @if (@_jscript_version < 5.7) IE6 = true; @end @@ -687,6 +694,18 @@ }); }; +$.fn.uncolumnize = function() { + // revert to initial DOM + this.each(function() { + var $el = $(this), + $clone; + + if($clone = $el.data(DATA_ORIGINAL_DOM_KEY)) { + $el.replaceWith($clone); + } + }); +}; + $.fn.renumberByJS=function($searchTag, $colno, $targetId, $targetClass ) { this.setList = function($cols, $list, $tag1) { var $parents = this.before.parents(); @@ -711,8 +730,8 @@ $.fn.renumberByJS=function($searchTag, $colno, $targetId, $targetClass ) { // if the first LI in the current column is split, decrement, as we want the same number/key if( $($cols[this.offset]).find($tag1+':first li.split').length ) { var $whereElipsis=$($cols[this.offset-1]).find($tag1+':last li:last'); - if( this.elipsisText==='' || - $($cols[this.offset-1]).find($tag1+':last ~ div').length || + if( this.elipsisText==='' || + $($cols[this.offset-1]).find($tag1+':last ~ div').length || $($cols[this.offset-1]).find($tag1+':last ~ p').length ) { ; } else { @@ -735,7 +754,7 @@ $.fn.renumberByJS=function($searchTag, $colno, $targetId, $targetClass ) { } // an item in split between two columns. it only holds one key... if($($cols[this.offset]).find($tag1+':first >li.split >'+$tag1).length==0) { - $tint--; + $tint--; } } if($rest==1) { @@ -747,7 +766,7 @@ $.fn.renumberByJS=function($searchTag, $colno, $targetId, $targetClass ) { console.log("Supposed to be a nested list...decr"); } $tint--; -// some how, id previous list starts split, need secins decrement, +// some how, id previous list starts split, need secins decrement, // if "split" is now correct, reference this var $tt = $($cols[this.offset -1]).find($tag1+':first li.split:first'); if($tt.length>0) { @@ -796,7 +815,7 @@ $.fn.renumberByJS=function($searchTag, $colno, $targetId, $targetClass ) { $list.attr('start', $tint); } } - return 0; + return 0; } if(typeof $targetId === 'undefined') { $targetId=false; } @@ -807,7 +826,7 @@ $.fn.renumberByJS=function($searchTag, $colno, $targetId, $targetClass ) { var $target =''; this.prevMax =1; - + if($targetClass) { $target ="."+$targetClass; } else { @@ -815,7 +834,7 @@ $.fn.renumberByJS=function($searchTag, $colno, $targetId, $targetClass ) { } var $tag1 = $searchTag.toLowerCase(); var $tag2 = $searchTag.toUpperCase(); - + this.cols = $($target); if(this.debug) { console.log("There are "+this.cols.length+" items, looking for "+$tag1); @@ -830,7 +849,7 @@ $.fn.renumberByJS=function($searchTag, $colno, $targetId, $targetClass ) { console.log("iterating "+this.offset+"...[of "+this.cols.length+"]"); } // if the first column again, nothing to the left of you, do nothing... - if(this.offset % $colno==0) { + if(this.offset % $colno==0) { if(this.debug) { console.log("First column (in theory..)"); } @@ -838,7 +857,7 @@ $.fn.renumberByJS=function($searchTag, $colno, $targetId, $targetClass ) { this.prevMax = 1; continue; } - + this.before = $(this.cols[this.offset-1]).find($tag1+':last'); // if there are no occurences of the searchTag, do nothing if(this.before.length) { @@ -863,7 +882,7 @@ $.fn.renumberByJS=function($searchTag, $colno, $targetId, $targetClass ) { break; } } - + this.nest =1; if($(this.cols[this.offset]).find(">"+$tag1+':first li '+$tag1+":first").length) { this.nest = 2; @@ -873,7 +892,7 @@ $.fn.renumberByJS=function($searchTag, $colno, $targetId, $targetClass ) { $list = $(this.cols[this.offset]).find($tag1+':first li '+$tag1+":first"); if($list.length) { // I hope the two columns have same nesting, or its busted - + this.before= $(this.cols[this.offset-1]).find(">"+$tag1+':last li '+$tag1+":last"); this.prevMax= 0; this.nest =1; diff --git a/src/jquery.columnizer.min.js b/src/jquery.columnizer.min.js index b6b5da1..a4b6fa8 100644 --- a/src/jquery.columnizer.min.js +++ b/src/jquery.columnizer.min.js @@ -1,5 +1,5 @@ -(function($){$.fn.columnize=function(options){this.cols=[];this.offset=0;this.before=[];this.lastOther=0;this.prevMax=0;this.debug=0;this.setColumnStart=null;this.elipsisText='';var defaults={width:400,columns:false,buildOnce:false,overflow:false,doneFunc:function(){},target:false,ignoreImageLoading:true,columnFloat:"left",lastNeverTallest:false,accuracy:false,precise:false,manualBreaks:false,cssClassPrefix:"",elipsisText:'...',debug:0};options=$.extend(defaults,options);if(typeof(options.width)=="string"){options.width=parseInt(options.width,10);if(isNaN(options.width)){options.width=defaults.width;}} +(function($){var DATA_ORIGINAL_DOM_KEY='columnizer-original-dom';$.fn.columnize=function(options){this.each(function(){var $el=$(this);$el.data(DATA_ORIGINAL_DOM_KEY,$el.clone(true,true));});this.cols=[];this.offset=0;this.before=[];this.lastOther=0;this.prevMax=0;this.debug=0;this.setColumnStart=null;this.elipsisText='';var defaults={width:400,columns:false,buildOnce:false,overflow:false,doneFunc:function(){},target:false,ignoreImageLoading:true,columnFloat:"left",lastNeverTallest:false,accuracy:false,precise:false,manualBreaks:false,cssClassPrefix:"",elipsisText:'...',debug:0};options=$.extend(defaults,options);if(typeof(options.width)=="string"){options.width=parseInt(options.width,10);if(isNaN(options.width)){options.width=defaults.width;}} if(typeof options.setColumnStart=='function'){this.setColumnStart=options.setColumnStart;} if(typeof options.elipsisText=='string'){this.elipsisText=options.elipsisText;} if(options.debug){this.debug=options.debug;} @@ -25,7 +25,7 @@ function split($putInHere,$pullOutHere,$parentColumn,targetHeight){if($putInHere if($putInHere.contents(":last").hasClass(prefixTheClassName("columnbreak"))){return;} if($pullOutHere.contents().length){var $cloneMe=$pullOutHere.contents(":first");if(typeof $cloneMe.get(0)=='undefined'||$cloneMe.get(0).nodeType!=1)return;var $clone=$cloneMe.clone(true);if($cloneMe.hasClass(prefixTheClassName("columnbreak"))){appendSafe($putInHere,$clone);$cloneMe.remove();}else if(manualBreaks){appendSafe($putInHere,$clone);$cloneMe.remove();}else if($clone.get(0).nodeType==1&&!$clone.hasClass(prefixTheClassName("dontend"))){appendSafe($putInHere,$clone);if($clone.is("img")&&$parentColumn.height()
"));} $inBox.find(prefixTheClassName("column",true)).find(":first"+prefixTheClassName("removeiffirst",true)).remove();$inBox.find(prefixTheClassName("column",true)).find(':last'+prefixTheClassName("removeiflast",true)).remove();$inBox.find(prefixTheClassName("split",true)).find(":first"+prefixTheClassName("removeiffirst",true)).remove();$inBox.find(prefixTheClassName("split",true)).find(':last'+prefixTheClassName("removeiflast",true)).remove();$inBox.data("columnizing",false);if(options.overflow){options.overflow.doneFunc();} -options.doneFunc();}});};$.fn.renumberByJS=function($searchTag,$colno,$targetId,$targetClass){this.setList=function($cols,$list,$tag1){var $parents=this.before.parents();var $rest;$rest=$($cols[this.offset-1]).find('>*');if(($rest.last())[0].tagName!=$tag1.toUpperCase()){if(this.debug){console.log("Last item in previous column, isn't a list...");} +options.doneFunc();}});};$.fn.uncolumnize=function(){this.each(function(){var $el=$(this),$clone;if($clone=$el.data(DATA_ORIGINAL_DOM_KEY)){$el.replaceWith($clone);}});};$.fn.renumberByJS=function($searchTag,$colno,$targetId,$targetClass){this.setList=function($cols,$list,$tag1){var $parents=this.before.parents();var $rest;$rest=$($cols[this.offset-1]).find('>*');if(($rest.last())[0].tagName!=$tag1.toUpperCase()){if(this.debug){console.log("Last item in previous column, isn't a list...");} return 0;} $rest=$rest.length;var $tint=1;if(this.lastOther<=0){$tint=this.before.children().length+1;}else{$tint=$($parents[this.lastOther]).children().length+1;} if($($cols[this.offset]).find($tag1+':first li.split').length){var $whereElipsis=$($cols[this.offset-1]).find($tag1+':last li:last');if(this.elipsisText===''||$($cols[this.offset-1]).find($tag1+':last ~ div').length||$($cols[this.offset-1]).find($tag1+':last ~ p').length){;}else{if($($whereElipsis).find('ul, ol, dl').length==0){var $txt=$whereElipsis.last().text();var $len=$txt.length;if($txt.substring($len-1)==';'){if($txt.substring($len-4)!=this.elipsisText+';'){$txt=$txt.substring(0,$len-1)+this.elipsisText+';';}}else{if($txt.substring($len-3)!=this.elipsisText){$txt+=this.elipsisText;}} From 73040f590623c3bcd46a35281a388ae00ede7a76 Mon Sep 17 00:00:00 2001 From: Christian Stuff Date: Tue, 26 Jan 2016 21:51:50 +0100 Subject: [PATCH 03/17] Added uncolumnize function to Readme --- README.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/README.md b/README.md index 4bcc6ae..2ea97f4 100644 --- a/README.md +++ b/README.md @@ -119,6 +119,11 @@ Columnizer does not add default "dontsplit" or "dontend" classes to your content $yourContent.find('h1, h2, h3, h4, h5, h6').addClass('dontend'); $yourContent.find('br').addClass('removeiflast').addClass('removeiffirst'); +### Uncolumnize + +You can revert your columnized DOM by using the "uncolumnize" function. + + $('selector').uncolumnize(); ## Troubleshooting From 3f102c0544a70ae538b0cccce7ed9297847fe56f Mon Sep 17 00:00:00 2001 From: Adam Wulf Date: Wed, 13 Apr 2016 22:55:41 -0500 Subject: [PATCH 04/17] npm... probably #212 --- package.json | 26 ++++++++++++++++++++++++++ 1 file changed, 26 insertions(+) create mode 100644 package.json diff --git a/package.json b/package.json new file mode 100644 index 0000000..94adc92 --- /dev/null +++ b/package.json @@ -0,0 +1,26 @@ +{ + "name": "jquery-columnizer", + "version": "1.6.2", + "description": "The Columnizer jQuery Plugin will automatically layout your content in newspaper column format. You can specify either column width or a static number of columns.", + "main": "src/jquery.columnizer.js", + "scripts": { + "test": "echo \"Error: no test specified\" && exit 1" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/adamwulf/Columnizer-jQuery-Plugin.git" + }, + "keywords": [ + "jquery", + "columns", + "columnizer", + "text", + "layout" + ], + "author": "Adam Wulf", + "license": "SEE LICENSE IN LICENSE", + "bugs": { + "url": "https://github.com/adamwulf/Columnizer-jQuery-Plugin/issues" + }, + "homepage": "https://github.com/adamwulf/Columnizer-jQuery-Plugin#readme" +} From 5870d0b7216a2df95edd6b92147ab4945cc43ee4 Mon Sep 17 00:00:00 2001 From: Adam Wulf Date: Thu, 14 Apr 2016 15:31:40 -0500 Subject: [PATCH 05/17] keywords #212 --- package.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index 94adc92..c914cf1 100644 --- a/package.json +++ b/package.json @@ -15,7 +15,8 @@ "columns", "columnizer", "text", - "layout" + "layout", + "jquery-plugin" ], "author": "Adam Wulf", "license": "SEE LICENSE IN LICENSE", From d2f088c75801054477aca2fd539ad30168f1fcc7 Mon Sep 17 00:00:00 2001 From: Adam Wulf Date: Thu, 14 Apr 2016 15:33:37 -0500 Subject: [PATCH 06/17] keywords --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index c914cf1..aba52f2 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "jquery-columnizer", - "version": "1.6.2", + "version": "1.6.3", "description": "The Columnizer jQuery Plugin will automatically layout your content in newspaper column format. You can specify either column width or a static number of columns.", "main": "src/jquery.columnizer.js", "scripts": { From 5df8934c7093e21b3f1ec3ab91ca43d6aab18639 Mon Sep 17 00:00:00 2001 From: Jan Grzegorowski Date: Sat, 7 Jan 2017 14:30:38 +0100 Subject: [PATCH 07/17] feat: add disableSingle option --- src/jquery.columnizer.js | 5 ++++- src/jquery.columnizer.min.js | 6 +++--- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/src/jquery.columnizer.js b/src/jquery.columnizer.js index 6e94a29..0df4a09 100644 --- a/src/jquery.columnizer.js +++ b/src/jquery.columnizer.js @@ -53,6 +53,9 @@ precise : false, // don't automatically layout columns, only use manual columnbreak manualBreaks : false, + // disable single column layout when container width < columnWidth + // (useful for horizontally scrollable columns in mobile view) + disableSingle : false, // previx for all the CSS classes used by this plugin // default to empty string for backwards compatibility cssClassPrefix : "", @@ -471,7 +474,7 @@ // if ($inBox.data("columnized") && numCols == $inBox.children().length) { // return; // } - if(numCols <= 1){ + if(numCols <= 1 && ! options.disableSingle){ return singleColumnizeIt(); } if($inBox.data("columnizing")) return; diff --git a/src/jquery.columnizer.min.js b/src/jquery.columnizer.min.js index a4b6fa8..51f5aad 100644 --- a/src/jquery.columnizer.min.js +++ b/src/jquery.columnizer.min.js @@ -1,5 +1,5 @@ -(function($){var DATA_ORIGINAL_DOM_KEY='columnizer-original-dom';$.fn.columnize=function(options){this.each(function(){var $el=$(this);$el.data(DATA_ORIGINAL_DOM_KEY,$el.clone(true,true));});this.cols=[];this.offset=0;this.before=[];this.lastOther=0;this.prevMax=0;this.debug=0;this.setColumnStart=null;this.elipsisText='';var defaults={width:400,columns:false,buildOnce:false,overflow:false,doneFunc:function(){},target:false,ignoreImageLoading:true,columnFloat:"left",lastNeverTallest:false,accuracy:false,precise:false,manualBreaks:false,cssClassPrefix:"",elipsisText:'...',debug:0};options=$.extend(defaults,options);if(typeof(options.width)=="string"){options.width=parseInt(options.width,10);if(isNaN(options.width)){options.width=defaults.width;}} +(function($){var DATA_ORIGINAL_DOM_KEY='columnizer-original-dom';$.fn.columnize=function(options){this.each(function(){var $el=$(this);$el.data(DATA_ORIGINAL_DOM_KEY,$el.clone(true,true));});this.cols=[];this.offset=0;this.before=[];this.lastOther=0;this.prevMax=0;this.debug=0;this.setColumnStart=null;this.elipsisText='';var defaults={width:400,columns:false,buildOnce:false,overflow:false,doneFunc:function(){},target:false,ignoreImageLoading:true,columnFloat:"left",lastNeverTallest:false,accuracy:false,precise:false,manualBreaks:false,disableSingle:false,cssClassPrefix:"",elipsisText:'...',debug:0};options=$.extend(defaults,options);if(typeof(options.width)=="string"){options.width=parseInt(options.width,10);if(isNaN(options.width)){options.width=defaults.width;}} if(typeof options.setColumnStart=='function'){this.setColumnStart=options.setColumnStart;} if(typeof options.elipsisText=='string'){this.elipsisText=options.elipsisText;} if(options.debug){this.debug=options.debug;} @@ -42,7 +42,7 @@ function checkDontEndColumn(dom){if(dom.nodeType==3){if(/^\s+$/.test(dom.nodeVal return false;} if(dom.nodeType!=1)return false;if($(dom).hasClass(prefixTheClassName("dontend")))return true;if(dom.childNodes.length===0)return false;return checkDontEndColumn(dom.childNodes[dom.childNodes.length-1]);} function columnizeIt(){adjustment=0;if(lastWidth==$inBox.width())return;lastWidth=$inBox.width();var numCols=Math.round($inBox.width()/options.width);var optionWidth=options.width;var optionHeight=options.height;if(options.columns)numCols=options.columns;if(manualBreaks){numCols=$cache.find(prefixTheClassName("columnbreak",true)).length+1;optionWidth=false;} -if(numCols<=1){return singleColumnizeIt();} +if(numCols<=1&&!disableSingle){return singleColumnizeIt();} if($inBox.data("columnizing"))return;$inBox.data("columnized",true);$inBox.data("columnizing",true);$inBox.empty();$inBox.append($("
"));$col=$inBox.children(":last");appendSafe($col,$cache.clone());maxHeight=$col.height();$inBox.empty();var targetHeight=maxHeight/numCols;var firstTime=true;var maxLoops=3;var scrollHorizontally=false;if(options.overflow){maxLoops=1;targetHeight=options.overflow.height;}else if(optionHeight&&optionWidth){maxLoops=1;targetHeight=optionHeight;scrollHorizontally=true;} for(var loopCount=0;loopCount<20;loopCount++){$inBox.empty();var $destroyable,className,$col,$lastKid;try{$destroyable=$cache.clone(true);}catch(e){$destroyable=$cache.clone();} $destroyable.css("visibility","hidden");for(var i=0;i
"));} @@ -87,4 +87,4 @@ var $parents=this.before.parents();this.lastOther=0;var $found=false;for(;this.l this.nest=1;if($(this.cols[this.offset]).find(">"+$tag1+':first li '+$tag1+":first").length){this.nest=2;} this.setList(this.cols,$list,$tag1);this.lastOther--;$list=$(this.cols[this.offset]).find($tag1+':first li '+$tag1+":first");if($list.length){this.before=$(this.cols[this.offset-1]).find(">"+$tag1+':last li '+$tag1+":last");this.prevMax=0;this.nest=1;this.setList(this.cols,$list,$tag1);} var $reset=$(this.cols[this.offset-1]).find(">"+$tag1+':last');this.prevMax=$reset.children().length;}} -return 0;};})(jQuery); \ No newline at end of file +return 0;};})(jQuery); From 5a8a290b06fe003446c677ca23c811245baf137a Mon Sep 17 00:00:00 2001 From: Jan Grzegorowski Date: Sat, 7 Jan 2017 14:38:53 +0100 Subject: [PATCH 08/17] docs: add disableSingle option description --- README.md | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/README.md b/README.md index 2ea97f4..4e046a2 100644 --- a/README.md +++ b/README.md @@ -67,6 +67,12 @@ Columnizer will add CSS classes to the columns it creates. Each column will have
+ + +. Default is false. + +
manualBreaks Defaults to false. Set to true if you only want to create columns with manual column breaks. If true, then width, height, columns options are ignored.
disableSingle +Disables single column layout if number of columns is less or equal to 1. Useful to force columns scrolling horizontally on small screens. See demo 5 for an example.
From 25f3c88c7ce6e3456a3ac6ecac00efa429e320d4 Mon Sep 17 00:00:00 2001 From: simonmeadows Date: Fri, 31 Mar 2017 14:13:25 +0100 Subject: [PATCH 09/17] Added preserving thead and tfoot in tables In the columnize function we can check weather we are in a table by testing the first child of $pullOutHere If we are in a table we can clone a copy of the and if they exist and store thim in the columnize function that is operating on the table. When we get to splitting the last element we add the and back to the table in the content source element $pullOutHere --- src/jquery.columnizer.js | 36 ++++++++++++++++++++++++++++++++++++ 1 file changed, 36 insertions(+) diff --git a/src/jquery.columnizer.js b/src/jquery.columnizer.js index 0df4a09..00ee7f5 100644 --- a/src/jquery.columnizer.js +++ b/src/jquery.columnizer.js @@ -186,6 +186,12 @@ * @param targetHeight, the ideal height for the column, get as close as we can to this height */ function columnize($putInHere, $pullOutHere, $parentColumn, targetHeight){ + + // Variables for dealing with and when splitting tables + // As we split a table we need to keep copies of the and to place on each column + var $thead; + var $tfoot; + // // add as many nodes to the column as we can, // but stop once our height is too tall @@ -205,6 +211,25 @@ // our column is on a column break, so just end here return; } + + // If we enter a element make a copy of and + // to use each time the
splits + if (node.nodeName=='TABLE'){ + // Check if the table has a header and clone it + if ($(node).find('thead').length>0){ + this.$thead = $(node).find('thead').clone(); + } else { + this.$thead = undefined; + } + // Check if the table has a footer and clone it + if ($(node).find('tfoot').length>0){ + this.$tfoot = $(node).find('tfoot').clone(); + } else { + this.$tfoot = undefined; + } + } + + appendSafe($putInHere, $(node)); } if($putInHere[0].childNodes.length === 0) return; @@ -370,6 +395,17 @@ } } } + // If we are in the process of splitting a table, add the and + // clones back to $pullOutHere so they are available to move into the next column + if($pullOutHere.prop('tagName') == 'TABLE'){ + if (this.$thead){ + $pullOutHere.prepend(this.$tfoot); + } + if (this.$thead) { + $pullOutHere.prepend(this.$thead); + } + } + } From 0d20d114748802f5cf854dfc9f9cd17ef393504e Mon Sep 17 00:00:00 2001 From: Simon Meadows Date: Sat, 1 Apr 2017 01:17:02 +0100 Subject: [PATCH 10/17] Added test pages for thead and tfoot --- test/nested_thead_tfoot.html | 1437 ++++++++++++++++++++++++++++++++++ test/thead_tfoot.html | 637 +++++++++++++++ 2 files changed, 2074 insertions(+) create mode 100644 test/nested_thead_tfoot.html create mode 100644 test/thead_tfoot.html diff --git a/test/nested_thead_tfoot.html b/test/nested_thead_tfoot.html new file mode 100644 index 0000000..a83d86d --- /dev/null +++ b/test/nested_thead_tfoot.html @@ -0,0 +1,1437 @@ + + + + + + Columnizer JQuery Plugin thead tfoot test page + + + + + + + + +
+
+

Columnize nested tables with repeating thead and tfoot

+

This is a test page to show how columnizing works with repeating thead and tfoot in nested tables

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
-- Header 1 ---- Header 2 ---- Header 3 --
-- Footer 1 ---- Footer 2 ---- Footer 3 --
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Header AHeader BHeader CHeader D
Footer AFooter BFooter CFooter D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
-- Header Only X ---- Header Only Y --
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
Column XColumn Y
+
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
Column AColumn BColumn CColumn D
+ + + + +
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
+ + + + + + + \ No newline at end of file diff --git a/test/thead_tfoot.html b/test/thead_tfoot.html new file mode 100644 index 0000000..e30e0de --- /dev/null +++ b/test/thead_tfoot.html @@ -0,0 +1,637 @@ + + + + + + Columnizer JQuery Plugin thead tfoot test page + + + + + + + + +
+
+

Columnize with repeating thead and tfoot

+

This is a test page to show how columnizing works with repeating thead and tfoot

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
-- Header 1 ---- Header 2 ---- Header 3 --
-- Footer 1 ---- Footer 2 ---- Footer 3 --
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
Column 1Column 2Column 3
+
+ + +
+ + + \ No newline at end of file From 54dec55cf1610271851d92a4827bd4028b622960 Mon Sep 17 00:00:00 2001 From: Simon Meadows Date: Sat, 1 Apr 2017 01:17:48 +0100 Subject: [PATCH 11/17] Re-Worked to allow for nested tables --- src/jquery.columnizer.js | 83 ++++++++++++++++++++++++++++++++-------- 1 file changed, 67 insertions(+), 16 deletions(-) diff --git a/src/jquery.columnizer.js b/src/jquery.columnizer.js index 00ee7f5..c8bdc39 100644 --- a/src/jquery.columnizer.js +++ b/src/jquery.columnizer.js @@ -64,6 +64,67 @@ }; options = $.extend(defaults, options); + // Variable array for holding and from each table + // As we split a table we need to keep copies of the and to place on each column + var tables = new Array(); + + // Find all the table elements in the page + $('table').each(function () { + // Check if we have not already saved the and + if (!$(this).hasClass('tableSaved')) { + // Mark the found table by adding the .tableSaved class + $(this).addClass('tableSaved') + // Give the table a unique ID so we can re-add its elements later + $(this).addClass('tableID-' + tables.length) + // Save the tables unique ID, , and as an object in our tables array + tables.push({ + tableID: 'tableID-' + tables.length, + thead: $(this).find('thead:first').clone(), + tfoot: $(this).find('tfoot:first').clone() + }); + } + }); + + // Function to add and to all tables in $pullOutHere + // This function should be called anywhere split() returns as + // that is the point where a column is complete and the remaining content + // is not going to change until the next columnize() is called + function fixTables($pullOutHere) { + // Iterate through all of our saved tables + for (i = 0; i < tables.length; i++) { + // Check if the root element is a table + if ($pullOutHere.is("table")) { + // Check if the root element has any elements and + // is the current table id for this loop + if ($pullOutHere.children('tfoot').length == 0 && + $pullOutHere.hasClass(tables[i].tableID)) { + // Add the to the table + $(tables[i].tfoot).clone().prependTo($pullOutHere); + } + // Check if the root element has any elements and + // is the current table id for this loop + if ($pullOutHere.children('thead').length == 0 && + $pullOutHere.hasClass(tables[i].tableID)) { + // Add the to the table + $(tables[i].thead).clone().prependTo($pullOutHere); + } + } + // Check if there are any child tables to the root element with the current table ID + $pullOutHere.find('table .' + tables[i].tableID).each(function () { + // Check if the child table has no + if ($(this).children('tfoot').length == 0) { + // Add the to the table + $(tables[i].tfoot).clone().prependTo(this); + } + // Check if the child table has no + if ($(this).children('thead').length == 0) { + // Add the to the table + $(tables[i].thead).clone().prependTo(this); + } + }); + } + } + if(typeof(options.width) == "string"){ options.width = parseInt(options.width,10); if(isNaN(options.width)){ @@ -187,11 +248,6 @@ */ function columnize($putInHere, $pullOutHere, $parentColumn, targetHeight){ - // Variables for dealing with and when splitting tables - // As we split a table we need to keep copies of the and to place on each column - var $thead; - var $tfoot; - // // add as many nodes to the column as we can, // but stop once our height is too tall @@ -300,11 +356,15 @@ */ function split($putInHere, $pullOutHere, $parentColumn, targetHeight){ if($putInHere.contents(":last").find(prefixTheClassName("columnbreak", true)).length){ + // Fix any tables that have had their and moved + fixTables($pullOutHere); // // our column is on a column break, so just end here return; } if($putInHere.contents(":last").hasClass(prefixTheClassName("columnbreak"))){ + // Fix any tables that have had their and moved + fixTables($pullOutHere); // // our column is on a column break, so just end here return; @@ -395,17 +455,8 @@ } } } - // If we are in the process of splitting a table, add the and - // clones back to $pullOutHere so they are available to move into the next column - if($pullOutHere.prop('tagName') == 'TABLE'){ - if (this.$thead){ - $pullOutHere.prepend(this.$tfoot); - } - if (this.$thead) { - $pullOutHere.prepend(this.$thead); - } - } - + // Fix any tables that have had their and moved + fixTables($pullOutHere); } From 2cf78b7f30e89afcbcebf43d2518628fa5f161f2 Mon Sep 17 00:00:00 2001 From: Simon Meadows Date: Sat, 1 Apr 2017 01:23:36 +0100 Subject: [PATCH 12/17] moved test to samples --- test/nested_thead_tfoot.html => samples/nested_table_headers.html | 0 test/thead_tfoot.html => samples/table_headers.html | 0 2 files changed, 0 insertions(+), 0 deletions(-) rename test/nested_thead_tfoot.html => samples/nested_table_headers.html (100%) rename test/thead_tfoot.html => samples/table_headers.html (100%) diff --git a/test/nested_thead_tfoot.html b/samples/nested_table_headers.html similarity index 100% rename from test/nested_thead_tfoot.html rename to samples/nested_table_headers.html diff --git a/test/thead_tfoot.html b/samples/table_headers.html similarity index 100% rename from test/thead_tfoot.html rename to samples/table_headers.html From ac92a9ca34091a416bc7d91e4b24b5258756d446 Mon Sep 17 00:00:00 2001 From: Simon Meadows Date: Sat, 1 Apr 2017 01:39:27 +0100 Subject: [PATCH 13/17] removed non required bit I missed --- src/jquery.columnizer.js | 18 ------------------ 1 file changed, 18 deletions(-) diff --git a/src/jquery.columnizer.js b/src/jquery.columnizer.js index c8bdc39..4aaf455 100644 --- a/src/jquery.columnizer.js +++ b/src/jquery.columnizer.js @@ -268,24 +268,6 @@ return; } - // If we enter a element make a copy of and - // to use each time the
splits - if (node.nodeName=='TABLE'){ - // Check if the table has a header and clone it - if ($(node).find('thead').length>0){ - this.$thead = $(node).find('thead').clone(); - } else { - this.$thead = undefined; - } - // Check if the table has a footer and clone it - if ($(node).find('tfoot').length>0){ - this.$tfoot = $(node).find('tfoot').clone(); - } else { - this.$tfoot = undefined; - } - } - - appendSafe($putInHere, $(node)); } if($putInHere[0].childNodes.length === 0) return; From 7b6a532f034c98d9cd6fa3b64533b59391d39a08 Mon Sep 17 00:00:00 2001 From: Daniel Heffner Date: Mon, 19 Aug 2019 11:04:20 -0400 Subject: [PATCH 14/17] master: Fix for jQuery deprecation of event shorthand: resize --- src/jquery.columnizer.js | 2 +- src/jquery.columnizer.min.js | 21 ++++++++++++++------- 2 files changed, 15 insertions(+), 8 deletions(-) diff --git a/src/jquery.columnizer.js b/src/jquery.columnizer.js index 4aaf455..7536e0b 100644 --- a/src/jquery.columnizer.js +++ b/src/jquery.columnizer.js @@ -212,7 +212,7 @@ columnizeIt(); if(!options.buildOnce){ - $(window).resize(function() { + $(window).on('resize', function() { if(!options.buildOnce){ if($inBox.data("timeout")){ clearTimeout($inBox.data("timeout")); diff --git a/src/jquery.columnizer.min.js b/src/jquery.columnizer.min.js index 51f5aad..ea7d311 100644 --- a/src/jquery.columnizer.min.js +++ b/src/jquery.columnizer.min.js @@ -1,5 +1,11 @@ -(function($){var DATA_ORIGINAL_DOM_KEY='columnizer-original-dom';$.fn.columnize=function(options){this.each(function(){var $el=$(this);$el.data(DATA_ORIGINAL_DOM_KEY,$el.clone(true,true));});this.cols=[];this.offset=0;this.before=[];this.lastOther=0;this.prevMax=0;this.debug=0;this.setColumnStart=null;this.elipsisText='';var defaults={width:400,columns:false,buildOnce:false,overflow:false,doneFunc:function(){},target:false,ignoreImageLoading:true,columnFloat:"left",lastNeverTallest:false,accuracy:false,precise:false,manualBreaks:false,disableSingle:false,cssClassPrefix:"",elipsisText:'...',debug:0};options=$.extend(defaults,options);if(typeof(options.width)=="string"){options.width=parseInt(options.width,10);if(isNaN(options.width)){options.width=defaults.width;}} +(function($){var DATA_ORIGINAL_DOM_KEY='columnizer-original-dom';$.fn.columnize=function(options){this.each(function(){var $el=$(this);$el.data(DATA_ORIGINAL_DOM_KEY,$el.clone(true,true));});this.cols=[];this.offset=0;this.before=[];this.lastOther=0;this.prevMax=0;this.debug=0;this.setColumnStart=null;this.elipsisText='';var defaults={width:400,columns:false,buildOnce:false,overflow:false,doneFunc:function(){},target:false,ignoreImageLoading:true,columnFloat:"left",lastNeverTallest:false,accuracy:false,precise:false,manualBreaks:false,disableSingle:false,cssClassPrefix:"",elipsisText:'...',debug:0};options=$.extend(defaults,options);var tables=new Array();$('table').each(function(){if(!$(this).hasClass('tableSaved')){$(this).addClass('tableSaved') +$(this).addClass('tableID-'+tables.length) +tables.push({tableID:'tableID-'+tables.length,thead:$(this).find('thead:first').clone(),tfoot:$(this).find('tfoot:first').clone()});}});function fixTables($pullOutHere){for(i=0;i');var lastWidth=0;var columnizing=false;var manualBreaks=options.manualBreaks;var cssClassPrefix=defaults.cssClassPrefix;if(typeof(options.cssClassPrefix)=="string"){cssClassPrefix=options.cssClassPrefix;} var adjustment=0;appendSafe($cache,$(this).contents().clone(true));if(!options.ignoreImageLoading&&!options.target){if(!$inBox.data("imageLoaded")){$inBox.data("imageLoaded",true);if($(this).find("img").length>0){var func=function($inBox,$cache){return function(){if(!$inBox.data("firstImageLoaded")){$inBox.data("firstImageLoaded","true");appendSafe($inBox.empty(),$cache.children().clone(true));$inBox.columnize(options);}};}($(this),$cache);$(this).find("img").one("load",func);$(this).find("img").one("abort",func);return;}}} -$inBox.empty();columnizeIt();if(!options.buildOnce){$(window).resize(function(){if(!options.buildOnce){if($inBox.data("timeout")){clearTimeout($inBox.data("timeout"));} +$inBox.empty();columnizeIt();if(!options.buildOnce){$(window).on('resize',function(){if(!options.buildOnce){if($inBox.data("timeout")){clearTimeout($inBox.data("timeout"));} $inBox.data("timeout",setTimeout(columnizeIt,200));}});} function prefixTheClassName(className,withDot){var dot=withDot?".":"";if(cssClassPrefix.length){return dot+cssClassPrefix+"-"+className;} return dot+className;} @@ -21,11 +27,12 @@ if($parentColumn.height()>=targetHeight&&latestTextNode!==null){$putInHere[0].re if(oText.length){$item[0].nodeValue=oText;}else{return false;}} if($pullOutHere.contents().length){$pullOutHere.prepend($item);}else{appendSafe($pullOutHere,$item);} return $item[0].nodeType==3;} -function split($putInHere,$pullOutHere,$parentColumn,targetHeight){if($putInHere.contents(":last").find(prefixTheClassName("columnbreak",true)).length){return;} -if($putInHere.contents(":last").hasClass(prefixTheClassName("columnbreak"))){return;} +function split($putInHere,$pullOutHere,$parentColumn,targetHeight){if($putInHere.contents(":last").find(prefixTheClassName("columnbreak",true)).length){fixTables($pullOutHere);return;} +if($putInHere.contents(":last").hasClass(prefixTheClassName("columnbreak"))){fixTables($pullOutHere);return;} if($pullOutHere.contents().length){var $cloneMe=$pullOutHere.contents(":first");if(typeof $cloneMe.get(0)=='undefined'||$cloneMe.get(0).nodeType!=1)return;var $clone=$cloneMe.clone(true);if($cloneMe.hasClass(prefixTheClassName("columnbreak"))){appendSafe($putInHere,$clone);$cloneMe.remove();}else if(manualBreaks){appendSafe($putInHere,$clone);$cloneMe.remove();}else if($clone.get(0).nodeType==1&&!$clone.hasClass(prefixTheClassName("dontend"))){appendSafe($putInHere,$clone);if($clone.is("img")&&$parentColumn.height()
"));$col=$inBox.children(":last");appendSafe($col,$cache.clone());maxHeight=$col.height();$inBox.empty();var targetHeight=maxHeight/numCols;var firstTime=true;var maxLoops=3;var scrollHorizontally=false;if(options.overflow){maxLoops=1;targetHeight=options.overflow.height;}else if(optionHeight&&optionWidth){maxLoops=1;targetHeight=optionHeight;scrollHorizontally=true;} for(var loopCount=0;loopCount<20;loopCount++){$inBox.empty();var $destroyable,className,$col,$lastKid;try{$destroyable=$cache.clone(true);}catch(e){$destroyable=$cache.clone();} $destroyable.css("visibility","hidden");for(var i=0;i
"));} @@ -87,4 +94,4 @@ var $parents=this.before.parents();this.lastOther=0;var $found=false;for(;this.l this.nest=1;if($(this.cols[this.offset]).find(">"+$tag1+':first li '+$tag1+":first").length){this.nest=2;} this.setList(this.cols,$list,$tag1);this.lastOther--;$list=$(this.cols[this.offset]).find($tag1+':first li '+$tag1+":first");if($list.length){this.before=$(this.cols[this.offset-1]).find(">"+$tag1+':last li '+$tag1+":last");this.prevMax=0;this.nest=1;this.setList(this.cols,$list,$tag1);} var $reset=$(this.cols[this.offset-1]).find(">"+$tag1+':last');this.prevMax=$reset.children().length;}} -return 0;};})(jQuery); +return 0;};})(jQuery); \ No newline at end of file From b2d64e775ae279c04ecb4b450c8ca567a566aea3 Mon Sep 17 00:00:00 2001 From: Adam Wulf Date: Tue, 20 Aug 2019 02:03:31 -0500 Subject: [PATCH 15/17] Proper php tag --- tools/compress.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tools/compress.php b/tools/compress.php index a59c1c7..961856b 100644 --- a/tools/compress.php +++ b/tools/compress.php @@ -1,4 +1,4 @@ - Date: Sun, 11 Apr 2021 00:02:29 -0500 Subject: [PATCH 16/17] github sponsorship --- .github/FUNDING.yml | 12 ++++++++++++ 1 file changed, 12 insertions(+) create mode 100644 .github/FUNDING.yml diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml new file mode 100644 index 0000000..854756b --- /dev/null +++ b/.github/FUNDING.yml @@ -0,0 +1,12 @@ +# These are supported funding model platforms + +github: adamwulf +patreon: # Replace with a single Patreon username +open_collective: # Replace with a single Open Collective username +ko_fi: # Replace with a single Ko-fi username +tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel +community_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry +liberapay: # Replace with a single Liberapay username +issuehunt: # Replace with a single IssueHunt username +otechie: # Replace with a single Otechie username +custom: # Replace with up to 4 custom sponsorship URLs e.g., ['link1', 'link2'] From 9292f215c1eadb7e41abf39a3c56d73d7ae82083 Mon Sep 17 00:00:00 2001 From: Adam Wulf Date: Sun, 11 Apr 2021 00:41:16 -0500 Subject: [PATCH 17/17] updated readme --- README.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/README.md b/README.md index 4e046a2..cd1970e 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,7 @@ +## Support + +Has Columnizer saved you hours? Become a [Github Sponsor](https://github.com/sponsors/adamwulf) and buy me a coffee ☕️ 😄 + ## Documentation ### CSS Classes for Created Columns