From 1032ab922a2811f1d24727be488d85a9d1910757 Mon Sep 17 00:00:00 2001 From: Rebecca Close Date: Thu, 3 Oct 2013 16:46:54 -0700 Subject: [PATCH 1/3] enable use of fuzzypos class .fuzzypos marks an element as having a fuzzy position - the element can be pushed around if it doesn't fit where it was originally placed --- src/jquery.columnizer.js | 20 +++++++++++++++++++- 1 file changed, 19 insertions(+), 1 deletion(-) diff --git a/src/jquery.columnizer.js b/src/jquery.columnizer.js index 1790ecb..65e65c2 100644 --- a/src/jquery.columnizer.js +++ b/src/jquery.columnizer.js @@ -150,7 +150,25 @@ return; } $putInHere.append(node); - } + + // skip this node if too big and fuzzypos + if(!manualBreaks && $(node).hasClass(prefixTheClassName("fuzzypos")) && ($parentColumn.height() > targetHeight) && $pullOutHere[0].childNodes.length) { + var skip = []; + do { + //move fuzzy element to skip array + skip.unshift($(node)); + //use next node instead + node = $pullOutHere[0].childNodes[0]; + $putInHere.append(node); + + } while($(node).hasClass(prefixTheClassName("fuzzypos")) && ($parentColumn.height() > targetHeight) && $pullOutHere[0].childNodes.length); + //put fuzzy items back in the queue + $.each(skip, function(k, v) { + $pullOutHere.prepend(v); + }); + } + + } if($putInHere[0].childNodes.length === 0) return; // now we're too tall, so undo the last one From 706f4c027b2280f526f11c56572ed251dfa3307f Mon Sep 17 00:00:00 2001 From: Rebecca Close Date: Tue, 15 Oct 2013 19:16:47 -0700 Subject: [PATCH 2/3] fix fuzzypos logic for figures in overflow with split text --- src/jquery.columnizer.js | 31 +++++++++++++++++++++++-------- 1 file changed, 23 insertions(+), 8 deletions(-) diff --git a/src/jquery.columnizer.js b/src/jquery.columnizer.js index 65e65c2..f9f8a3d 100644 --- a/src/jquery.columnizer.js +++ b/src/jquery.columnizer.js @@ -130,6 +130,8 @@ * @param targetHeight, the ideal height for the column, get as close as we can to this height */ function columnize($putInHere, $pullOutHere, $parentColumn, targetHeight){ + //allow fuzzypos skipping + var $skip = $('
'); // // add as many nodes to the column as we can, // but stop once our height is too tall @@ -152,20 +154,18 @@ $putInHere.append(node); // skip this node if too big and fuzzypos - if(!manualBreaks && $(node).hasClass(prefixTheClassName("fuzzypos")) && ($parentColumn.height() > targetHeight) && $pullOutHere[0].childNodes.length) { - var skip = []; + if(!manualBreaks && $(node).hasClass(prefixTheClassName("fuzzypos")) && ($parentColumn.height() > targetHeight) && $pullOutHere[0].childNodes.length && ($putInHere[0].childNodes.length > 1)) { do { - //move fuzzy element to skip array - skip.unshift($(node)); + //move fuzzy element to $skip + $skip.prepend($(node)); //use next node instead node = $pullOutHere[0].childNodes[0]; $putInHere.append(node); - } while($(node).hasClass(prefixTheClassName("fuzzypos")) && ($parentColumn.height() > targetHeight) && $pullOutHere[0].childNodes.length); //put fuzzy items back in the queue - $.each(skip, function(k, v) { + /*$.each(skip, function(k, v) { $pullOutHere.prepend(v); - }); + });*/ } } @@ -177,6 +177,11 @@ $putInHere[0].removeChild(lastKid); var $item = $(lastKid); + //put fuzzy items back in the queue + $skip.contents().each(function() { + $pullOutHere.prepend($(this)); + }); + // now lets try to split that last node // to fit as much of it as we can into this column if($item[0].nodeType == 3){ @@ -222,6 +227,7 @@ } } + //add split content back to queue if($pullOutHere.contents().length){ $pullOutHere.prepend($item); }else{ @@ -248,6 +254,7 @@ } if($pullOutHere.contents().length){ var $cloneMe = $pullOutHere.contents(":first"); + var $fuzzypos = $cloneMe.next('.fuzzypos'); // // make sure we're splitting an element if( typeof $cloneMe.get(0) == 'undefined' || $cloneMe.get(0).nodeType != 1 ) return; @@ -292,6 +299,7 @@ // the node in the column we're building, and start splitting // it in half, leaving some of it in pullOutHere $clone.empty(); + if(!columnize($clone, $cloneMe, $parentColumn, targetHeight)){ // this node still has non-text nodes to split // add the split class and then recur @@ -306,11 +314,18 @@ if($cloneMe.children().length){ split($clone, $cloneMe, $parentColumn, targetHeight); } + }else{ // this node only has text node children left, add the // split class and move on. $cloneMe.addClass(prefixTheClassName("split")); - } + } + + //precede split element with fuzzypos, if there + if($fuzzypos.size()) { + $pullOutHere.prepend($fuzzypos); + } + if($clone.get(0).childNodes.length === 0){ // it was split, but nothing is in it :( $clone.remove(); From c516d7e06e0beb1cd5116a255e7e4314350492a4 Mon Sep 17 00:00:00 2001 From: Rebecca Close Date: Thu, 31 Oct 2013 16:06:30 -0700 Subject: [PATCH 3/3] fix: fill last line of split text node --- src/jquery.columnizer.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/jquery.columnizer.js b/src/jquery.columnizer.js index f9f8a3d..e622f26 100644 --- a/src/jquery.columnizer.js +++ b/src/jquery.columnizer.js @@ -192,7 +192,7 @@ counter2 = options.accuracy; var columnText; var latestTextNode = null; - while($parentColumn.height() < targetHeight && oText.length){ + while($parentColumn.height() <= (targetHeight + 20) && oText.length){ // // it's been brought up that this won't work for chinese // or other languages that don't have the same use of whitespace