From 3e07ad765785aca8812840f9b1116caf6b616f66 Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Fri, 24 Feb 2017 22:22:12 +0100
Subject: [PATCH 01/24] Nearly rewrote the gallery. The vertical option no
 longer creates horizontal scrollbars, instead the height is variable for
 better integration in websites. Fixes the flickering issue on resizing and
 the bug where the images get distorted after several resizing events. Also
 improved performance on resizing.

---
 jquery.balanced-gallery.js | 327 ++++++++++++++++++++-----------------
 1 file changed, 181 insertions(+), 146 deletions(-)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index dceb535..cd34ccb 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -12,12 +12,12 @@
             orientation: 'horizontal',
             padding: 5,
             shuffleUnorderedPartitions: true,
-            viewportHeight: null,
-            viewportWidth: null
+            divisor: 4
         },
-        ALL_CHILDREN_LOADED = 'ALL_CHILDREN_LOADED',
         resizeTimeout = null,
-        RADIX = 10;
+        RADIX = 10,
+        THRESHOLD = 1 - 0.00001,    //-0.00001 due to imprecision of floating values
+        overflow = 0;
 
     //this wrapper prevents multiple instantiations of the plugin:
     $.fn[pluginName] = function ( options ) {
@@ -31,34 +31,23 @@
     function BalancedGallery( element, options ) {
         balancedGallery = this; // for contexts when 'this' doesn't refer to the BalancedGallery class.
         this.element = element;
-        this.elementChildren = $(element).children('*');
+        $(this.element).wrapInner('<div class="balanced-gallery-container"></div>');
+        this.container = $(this.element).children()[0];
+        this.elementChildren = $(this.container).children('*');
         this.options = $.extend( {}, defaults, options); // merge arg options and defaults
+        this.options.orientation = (this.options.orientation).toLowerCase();
 
         if(this.options.autoResize) {
-            this.unadulteratedHtml = $(this.element).html();
-            this.unadulteratedCSS = getUnadulteratedCss();
+            this.unadulteratedCSS = {width: $(this.element)[0].style.width};
             this.unadulteratedOptions = $.extend({}, this.options);
             setupAutoResize();
         }
 
+        this.quickResize = false;
         this.init();
         this.createGallery();
     }
 
-    function getUnadulteratedCss() {
-        var $element = $(balancedGallery.element);
-        //only the properties modified by the plugin
-        return {
-            width:  $element[0].style.width,
-            height: $element[0].style.height,
-            background: $element.css('background'),
-            paddingLeft: $element.css('padding-left'),
-            paddingTop: $element.css('padding-top'),
-            overflow: $element.css('overflow'),
-            fontSize: $element.css('font-size')
-        };
-    }
-
     function setupAutoResize() {
         $(window).resize(function() {
             clearTimeout(resizeTimeout);
@@ -70,59 +59,45 @@
     }
 
     BalancedGallery.prototype.recreate = function () {
-        $(this.element).on(ALL_CHILDREN_LOADED, function() {
-            balancedGallery.init();
-            balancedGallery.createGallery();
-        });
-        this.reset();
-    };
-
-    BalancedGallery.prototype.reset = function() {
-        var childCount = this.elementChildren.length;
-
-        $(this.element).html(this.unadulteratedHtml);
-        $(this.element).css(this.unadulteratedCSS);
         this.options = $.extend({}, this.unadulteratedOptions);
-        this.elementChildren = $(this.element).children('*');
+        $(this.element).css(this.unadulteratedCSS); //used to reset width so it's calculated from browser
 
-        var loadedChildren = 0;
-        this.elementChildren.each(function() {
-            $(this).load(function() {
-                if(++loadedChildren === childCount) {
-                    $(balancedGallery.element).trigger(ALL_CHILDREN_LOADED);
-                }
-            });
-        });
+        balancedGallery.quickResize = true;
+        balancedGallery.init();
+        balancedGallery.createGallery();
     };
 
     BalancedGallery.prototype.init = function () {
-        if(this.options.viewportWidth === null) {
-            this.options.viewportWidth = $(this.element).width();
-        }
 
-        if(this.options.viewportHeight === null) {
-            this.options.viewportHeight = $(this.element).height();
+        if(balancedGallery.quickResize === false) {
+            this.elementChildren.each(function() {
+                $(this).css({display: 'inline-block', padding: 0, margin: 0});
+            });
+
+            var padding = this.options.padding + 'px';
+            $(this.container).css({fontSize: 0, paddingTop: padding, paddingLeft: padding});
+
+            if(this.options.background !== null) {
+                $(this.container).css({background: this.options.background});
+            }
         }
 
+        this.options.viewportWidth = $(this.element).width() - this.options.padding;
+
         if(this.options.idealWidth === null) {
-            this.options.idealWidth = $(this.element).width() / 4;
+            this.options.idealWidth = this.options.viewportWidth / this.options.divisor;
         }
 
         if(this.options.idealHeight === null) {
-            this.options.idealHeight = $(this.element).height() / 2;
-        }
-
-        if(this.options.background !== null) {
-            $(this.element).css({background: this.options.background});
+            this.options.idealHeight = this.options.viewportWidth / this.options.divisor;
         }
 
-        this.elementChildren.css({display: 'inline-block', padding: 0, margin: 0});
-        var padding = this.options.padding + 'px';
-        $(this.element).css({fontSize: 0, paddingTop: padding, paddingLeft: padding});
+        //setting explicit width prevents image wrapping on resizing
+        $(this.container).width(this.options.viewportWidth);
     };
 
     BalancedGallery.prototype.createGallery = function() {
-        var orientation = (this.options.orientation).toLowerCase();
+        var orientation = this.options.orientation;
         if(orientation === 'horizontal') {
             createHorizontalGallery();
         } else if(orientation === 'vertical') {
@@ -134,10 +109,10 @@
 
     function createHorizontalGallery() {
         var rows, weights, partitions;
-        rows = getRows();
-        if(rows === 0) {
-            balancedGallery.fallbackToStandardSize();
+        if(balancedGallery.quickResize) {
+            quickResizeHorizontal();
         } else {
+            rows = getRows();
             weights = getWidthWeights();
             partitions = getPartitions(weights, rows);
             resizeHorizontalElements(partitions);
@@ -146,10 +121,10 @@
 
     function createVerticalGallery() {
         var cols, weights, partitions;
-        cols = getColumns();
-        if(cols === 0) {
-            balancedGallery.fallbackToStandardSize();
+        if(balancedGallery.quickResize) {
+            quickResizeVertical();
         } else {
+            cols = getColumns();
             weights = getHeightWeights();
             partitions = getPartitions(weights, cols);
             orientElementsVertically(partitions);
@@ -158,11 +133,21 @@
     }
 
     function getRows () {
-        return Math.round( collectiveIdealWidth() / (balancedGallery.options.viewportWidth - balancedGallery.options.padding) );
+        var rows = Math.round(collectiveIdealWidth() / balancedGallery.options.viewportWidth);
+        if(rows > 0 && rows < 1) { // if it's BETWEEN 0 and 1 means there is at least one image
+            rows = 1;
+        }
+        return rows;
     }
 
     function getColumns() {
-        return Math.round( collectiveIdealHeight() / (balancedGallery.options.viewportHeight - balancedGallery.options.padding) );
+        var cols = Math.round(balancedGallery.options.viewportWidth / balancedGallery.options.idealWidth);
+        var elements = balancedGallery.elementChildren.length;
+        if(cols <= elements) {
+            return cols;
+        } else {
+            return elements;
+        }
     }
 
     function collectiveIdealWidth() {
@@ -173,40 +158,20 @@
         return sum;
     }
 
-    function collectiveIdealHeight() {
-        var sum = 0;
-        balancedGallery.elementChildren.each(function () {
-            sum += idealHeight($(this));
-        });
-        return sum;
-    }
-
     function idealWidth($image) {
-        return aspectRatio($image) * (balancedGallery.options.idealHeight + balancedGallery.options.padding);
-    }
-
-    function idealHeight($image) {
-        return (1/aspectRatio($image)) * (balancedGallery.options.idealWidth + balancedGallery.options.padding);
+        return (aspectRatio($image) * balancedGallery.options.idealHeight) + balancedGallery.options.padding;
     }
 
-    BalancedGallery.prototype.fallbackToStandardSize = function() {
-        var idealHeight = this.options.idealHeight;
-        this.elementChildren.each(function () {
-            $(this).height( idealHeight );
-            $(this).width( balancedGallery.idealWidth($(this)) );
-        });
-    };
-
     function getWidthWeights() {
         return balancedGallery.elementChildren.map(function () {
-            var weight = parseInt( aspectRatio($(this)) * 100, RADIX );
+            var weight = aspectRatio($(this));
             return {element: this, weight: weight };
         });
     }
 
     function getHeightWeights() {
         return balancedGallery.elementChildren.map(function () {
-            var weight = parseInt( (1/aspectRatio($(this))) * 100, RADIX );
+            var weight = 1/aspectRatio($(this));
             return {element: this, weight: weight };
         });
     }
@@ -231,17 +196,14 @@
             return [];
         }
 
-        if(sections >= elementCount) {
-            return weights.map(function(key, value) { return [([value])]; });
-        }
-
         var solution  = createSolutionTable(weights, sections);
         elementCount -= 1;
         sections -= 2;
         var partitions = [];
+        var results = [];
 
         while(sections >= 0) {
-            var results = [];
+            results = [];
             for(var f = (solution[elementCount-1][sections]+1); f < elementCount+1; f++){
                 results.push(weights[f]);
             }
@@ -263,7 +225,7 @@
         var elementCount = weights.length;
 
         var table = [];
-        for (var i = 0; i < elementCount; i++) {
+        for(var i = 0; i < elementCount; i++) {
             var res = [];
             for (var j = 0; j < sections; j++) {
                 res.push(0);
@@ -272,7 +234,7 @@
         }
 
         var solution = [];
-        for (var k = 0; k < elementCount-1; k++) {
+        for(var k = 0; k < elementCount-1; k++) {
             var res2 = [];
             for (var l = 0; l < sections-1; l++) {
                 res2.push(0);
@@ -307,7 +269,7 @@
         var sortedWeights = weights.sort(function(a,b){ return b.weight - a.weight; });
 
         var partitions = new Array(sections);
-        for (var i=0; i <sections; i++) { partitions[i] = []; }
+        for (var i=0; i < sections; i++) { partitions[i] = []; }
 
 
         for(var j = 0; j < sortedWeights.length; j++) {
@@ -343,109 +305,182 @@
     }
 
     function reorderElements(partitions) {
-        $(balancedGallery.element).html(''); //remove all elements
+        $(balancedGallery.container).html(''); //remove all elements
         for(var i = 0; i < partitions.length; i++) {
             var subPartition = partitions[i];
             for(var j = 0; j < subPartition.length; j++) {
-                $(balancedGallery.element).append(subPartition[j].element);
+                $(balancedGallery.container).append(subPartition[j].element);
             }
         }
     }
 
     function resizeHorizontalElements(partitions) {
         var padding = balancedGallery.options.padding;
+        var index = 0;
+        balancedGallery.resizingValue = [];
+
         for(var i = 0; i < partitions.length; i++) {
-            var summedRowRatios = 0;
+            var rowRatio = 0;
             for(var j = 0; j < partitions[i].length; j++) {
-                summedRowRatios += aspectRatio( $(partitions[i][j].element) );
+                rowRatio += partitions[i][j].weight;
             }
+            balancedGallery.resizingValue[i] = {ratio: rowRatio, length: partitions[i].length};
+            overflow = 0;
+            var rowPadding = padding * partitions[i].length;
+            var rawImgHeight = (balancedGallery.options.viewportWidth - rowPadding) / rowRatio;
             for(var k = 0; k < partitions[i].length; k++) {
                 var $image = $(partitions[i][k].element);
-                var rawImgHeight = (balancedGallery.options.viewportWidth - padding) / summedRowRatios  ;
-                var imgHeight = parseInt( rawImgHeight, RADIX );
-                var imgWidth = parseInt( imgHeight * aspectRatio($image), RADIX ) - padding;
+                balancedGallery.elementChildren[index++] = $image;
+                var imgHeight = parseInt(rawImgHeight, RADIX);
+                var imgWidth = rawImgHeight * aspectRatio($image);
+                imgWidth = checkWidthOverflow(imgWidth);
                 $image.width(imgWidth);
                 $image.height(imgHeight);
-                $image.css({margin: 0, marginRight:padding+'px', marginBottom:padding+'px'});
+                $image.css({margin: 0, marginRight: padding+'px', marginBottom: padding+'px'});
             }
         }
 
-        if(balancedGallery.element !== document.body) {
-            $(balancedGallery.element).css({overflow:'scroll'});
+        checkWidth(balancedGallery.options.orientation);
+    }
+
+    function quickResizeHorizontal() {
+        var padding = balancedGallery.options.padding;
+        var index = 0;
+        var imagesPerRow = 0;
+        var rawImgHeight, rowPadding;
+
+        for(var i = 0; i < balancedGallery.elementChildren.length; i++) {
+            if(i == imagesPerRow) {
+                rowPadding = padding * balancedGallery.resizingValue[index].length;
+                rawImgHeight = (balancedGallery.options.viewportWidth - rowPadding) / balancedGallery.resizingValue[index].ratio;
+                imagesPerRow += balancedGallery.resizingValue[index].length;
+                index++;
+                overflow = 0;
+            }
+            var $image = balancedGallery.elementChildren[i];
+            var imgHeight = parseInt(rawImgHeight, RADIX);
+            var imgWidth = rawImgHeight * aspectRatio($image);
+            imgWidth = checkWidthOverflow(imgWidth);
+            $image.width(imgWidth);
+            $image.height(imgHeight);
         }
 
+        checkWidth(balancedGallery.options.orientation);
     }
 
     function resizeVerticalElements(partitions) {
         var padding = balancedGallery.options.padding;
+        var columnRatio = [];
+        var summedColRatios = 0;
+        var index = 0;
+        balancedGallery.resizingValue = [];
+        overflow = 0;
+
         for(var i = 0; i < partitions.length; i++) {
-            var summedColRatios = 0;
+            columnRatio[i] = 0;
             for(var j = 0; j < partitions[i].length; j++) {
-                summedColRatios += 1/aspectRatio( $(partitions[i][j].element) );
+                columnRatio[i] += partitions[i][j].weight;
             }
-            for(var k = 0; k < partitions[i].length; k++) {
-                var $image = $(partitions[i][k].element);
-                var rawImgWidth = (balancedGallery.options.viewportHeight - padding) / summedColRatios  ;
-                var imgWidth = parseInt( rawImgWidth, RADIX );
-                var imgHeight = parseInt( imgWidth * (1/aspectRatio($image)), RADIX ) - padding;
+            // also add ratios from padding bars between each image in a column
+            columnRatio[i] += partitions[i].length * (padding / balancedGallery.options.idealWidth);
+            summedColRatios += columnRatio[i];
+        }
+        balancedGallery.summedColRatios = summedColRatios;
+        var average = summedColRatios / partitions.length;
+        for(var k = 0; k < partitions.length; k++) {
+            var diffToAverage = average - columnRatio[k];
+            var resizingFactor = average + diffToAverage;
+            var columnWidth = (balancedGallery.options.viewportWidth / summedColRatios) * resizingFactor;
+            var rawImgWidth = columnWidth - padding;
+            var imgWidth = checkWidthOverflow(rawImgWidth);
+            var columnHeight = 0;
+            for(var l = 0; l < partitions[k].length; l++) {
+                var $image = $(partitions[k][l].element);
+                balancedGallery.elementChildren[index++] = $image;
+                var imgHeight = Math.round(rawImgWidth * (1/aspectRatio($image)));
+                columnHeight += imgHeight + padding;
                 $image.width(imgWidth);
                 $image.height(imgHeight);
-                $image.css({margin: 0, marginRight:padding+'px', marginBottom:padding+'px'});
+                $image.css({margin: 0, marginRight: padding+'px', marginBottom: padding+'px'});
             }
+            balancedGallery.resizingValue[k] = {ratio: resizingFactor, length: partitions[k].length, columnHeight: columnHeight};
         }
 
-        //Resize Container for horizontal scrolling
-        $('.balanced-gallery-column').css({display:'inline-block', padding: 0, margin: 0});
-        $(balancedGallery.container).width(function() {
-            var sum = 0;
-            $('.balanced-gallery-column').each(function() { sum += ($(this).width()); });
-            return sum;
-        }());
+        checkWidth(balancedGallery.options.orientation);
+    }
 
-        if(balancedGallery.element !== document.body) {
-            $(balancedGallery.element).css({overflowY:'hidden'});
+    function quickResizeVertical() {
+        var padding = balancedGallery.options.padding;
+        var index = -1;
+        var imagesPerCol = 0;
+        overflow = 0;
+        var columnWidth, rawImgWidth, imgWidth;
+
+        for(var i = 0; i < balancedGallery.elementChildren.length; i++) {
+            if(i == imagesPerCol) {
+                index++;
+                balancedGallery.resizingValue[index].columnHeight = 0;
+                columnWidth = (balancedGallery.options.viewportWidth / balancedGallery.summedColRatios) * balancedGallery.resizingValue[index].ratio;
+                rawImgWidth = columnWidth - padding;
+                imgWidth = checkWidthOverflow(rawImgWidth);
+                imagesPerCol += balancedGallery.resizingValue[index].length;
+            }
+            var $image = balancedGallery.elementChildren[i];
+            var imgHeight = parseInt(rawImgWidth * (1/aspectRatio($image)), RADIX);
+            balancedGallery.resizingValue[index].columnHeight += imgHeight + padding;
+            $image.width(imgWidth);
+            $image.height(imgHeight);
         }
 
-        //If there's horizontal overflow the scrollbar causes vertical scrolling
-        if(balancedGallery.options.viewportHeight !== balancedGallery.element.clientHeight) {
-            balancedGallery.options.viewportHeight = balancedGallery.element.clientHeight - balancedGallery.options.padding;
-            $(balancedGallery.element).height(balancedGallery.options.viewportHeight - balancedGallery.options.padding);
-            if(balancedGallery.element === document.body) {
-                resizeVerticalElements(partitions);
-            }
+        checkWidth(balancedGallery.options.orientation);
+    }
+
+    //ensures that the rows or all columns are as wide as the container width
+    function checkWidthOverflow(width) {
+        var parsedWidth = parseInt(width, RADIX);
+        overflow += width - parsedWidth;
+        if(overflow >= THRESHOLD) {
+            parsedWidth += 1;
+            overflow -= 1;
         }
+        return parsedWidth;
     }
 
-    function orientElementsVertically(partitions) {
-        var $element = $(balancedGallery.element),
-            $container;
-        $element.html(''); //clear the images
-        $element.css({overflow: 'scroll'});
-        if(balancedGallery.element !== document.body) {
-            $container = $('<div id="balanced-gallery-col-container"></div>');
-            $element.append($container[0]);
-        } else {
-            $container = $(balancedGallery.element);
+    //if a scrollbar appears or disappears after resizing
+    function checkWidth(orientation) {
+        if((balancedGallery.options.viewportWidth + balancedGallery.options.padding) !== $(balancedGallery.element).width()) {
+            balancedGallery.options.viewportWidth = $(balancedGallery.element).width() - balancedGallery.options.padding;
+            $(balancedGallery.container).width(balancedGallery.options.viewportWidth);
+            if(orientation == 'horizontal') {
+                quickResizeHorizontal();
+            } else if(orientation == 'vertical') {
+                quickResizeVertical();
+            }
         }
-        balancedGallery.container = $container[0];
+    }
 
+    function orientElementsVertically(partitions) {
+        var $container = $(balancedGallery.container);
+        $container.html(''); //clear the images
 
         for(var i = 0; i < partitions.length; i++) {
             var colName = 'balanced-gallery-col'+i;
-            var column = '<div class="balanced-gallery-column" id="'+colName+'"></div>';
+            var column = '<div class="balanced-gallery-column" id="'+colName+'" style="float: left; padding: 0; margin: 0;"></div>';
             $container.append(column);
+            var $col = $($container.find("div#"+colName));
             for(var j = 0; j < partitions[i].length; j++) {
                 var child = partitions[i][j].element;
-                var $col = $($container.find("div#"+colName));
-                $col.append(child).append('<br />');
+                $col.append(child).append('<br/>');
             }
         }
 
+        //add clearing div
+        var clearingDiv = '<div class="balanced-gallery-clearing" style="clear: both;"></div>';
+        $container.append(clearingDiv);
     }
 
     function aspectRatio($image) {
-        var padding = balancedGallery.options.padding;
-        return ($image.width()+padding) / ($image.height()+padding);
+        return $image[0].naturalWidth / $image[0].naturalHeight;
     }
 
     function shuffleArray(array) {

From a7712186016461e3908b6d51281a99b6a3503fa8 Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Sat, 25 Feb 2017 12:20:34 +0100
Subject: [PATCH 02/24] Added fix for Firefox on vertical galleries that
 prevents columns from wrapping

---
 jquery.balanced-gallery.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index cd34ccb..bd178bb 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -470,7 +470,7 @@
             var $col = $($container.find("div#"+colName));
             for(var j = 0; j < partitions[i].length; j++) {
                 var child = partitions[i][j].element;
-                $col.append(child).append('<br/>');
+                $col.append(child).append('<br style="display: block;"/>'); //Fix for Firefox; without 'style="display: block;"' Firefox assigns a width for an <br>-element. Strange!
             }
         }
 

From 3ebb23ddcf64ee19f33a8e6f6ca2a71ca4c1b0fe Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Sat, 25 Feb 2017 13:09:37 +0100
Subject: [PATCH 03/24] Added function to create vertical galleries with the
 exact same height. Now the width and height of the galleries are always an
 exact rectangle.

---
 jquery.balanced-gallery.js | 27 +++++++++++++++++++++++++++
 1 file changed, 27 insertions(+)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index bd178bb..c646050 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -407,6 +407,7 @@
         }
 
         checkWidth(balancedGallery.options.orientation);
+		alignColumnHeights();
     }
 
     function quickResizeVertical() {
@@ -433,6 +434,7 @@
         }
 
         checkWidth(balancedGallery.options.orientation);
+		alignColumnHeights();
     }
 
     //ensures that the rows or all columns are as wide as the container width
@@ -446,6 +448,31 @@
         return parsedWidth;
     }
 
+    //stretch or shrink image by image, pixel by pixel to get exact same column heights
+    function alignColumnHeights() {
+        var averageHeight = 0;
+        var imagesPerCol = 0;
+        for(var i = 0; i < balancedGallery.resizingValue.length; i++) {
+            averageHeight += balancedGallery.resizingValue[i].columnHeight;
+        }
+        averageHeight = Math.round(averageHeight / balancedGallery.resizingValue.length);
+        for(var j = 0; j < balancedGallery.resizingValue.length; j++) {
+            imagesPerCol += balancedGallery.resizingValue[j].length;
+            var counter = Math.sign(averageHeight - balancedGallery.resizingValue[j].columnHeight);
+            //starting with last image in column, because it's more likely to be outside of the current viewport
+            var k = imagesPerCol-1;
+            while(averageHeight != balancedGallery.resizingValue[j].columnHeight) {
+                balancedGallery.elementChildren[k].height(balancedGallery.elementChildren[k].height() + counter);
+                balancedGallery.resizingValue[j].columnHeight += counter;
+                k--;
+				//if all images in a column got streched/shrinked, start iteration again with last image in column till averageHeight matches columnHeight
+                if(k < (imagesPerCol - balancedGallery.resizingValue[j].length)) { 
+                    k = imagesPerCol-1;
+                }
+            }
+        }
+    }
+	
     //if a scrollbar appears or disappears after resizing
     function checkWidth(orientation) {
         if((balancedGallery.options.viewportWidth + balancedGallery.options.padding) !== $(balancedGallery.element).width()) {

From 8f0393eecf690c0d588c0ee750b203cf3f5878cb Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Sat, 25 Feb 2017 14:23:04 +0100
Subject: [PATCH 04/24] Fix for galleries that are directly inside the
 body-element. Some third-party addons place elements in there that cause
 BalancedGallery stop working correctly.

---
 jquery.balanced-gallery.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index c646050..f712438 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -33,7 +33,7 @@
         this.element = element;
         $(this.element).wrapInner('<div class="balanced-gallery-container"></div>');
         this.container = $(this.element).children()[0];
-        this.elementChildren = $(this.container).children('*');
+        this.elementChildren = $(this.container).children('img');
         this.options = $.extend( {}, defaults, options); // merge arg options and defaults
         this.options.orientation = (this.options.orientation).toLowerCase();
 

From b860e64ecf5d428230f0b2423ec9d42addbf5409 Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Sat, 25 Feb 2017 14:41:04 +0100
Subject: [PATCH 05/24] Fix in column ratio calculation on vertical galleries.
 Now the results after resizing are better so less work needs to be done later
 in allignColumnHeights()

---
 jquery.balanced-gallery.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index f712438..6cb975a 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -382,7 +382,7 @@
                 columnRatio[i] += partitions[i][j].weight;
             }
             // also add ratios from padding bars between each image in a column
-            columnRatio[i] += partitions[i].length * (padding / balancedGallery.options.idealWidth);
+            columnRatio[i] += partitions[i].length * (padding / (balancedGallery.options.idealWidth - padding));
             summedColRatios += columnRatio[i];
         }
         balancedGallery.summedColRatios = summedColRatios;

From ad0ba17a2b7af6608833f93007d2c43359c8a8a8 Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Sat, 25 Feb 2017 15:52:44 +0100
Subject: [PATCH 06/24] Bug fix: When the scrollbar disappears after resizing
 and after checkWidth() it appears again, then this would cause an infinite
 loop.

---
 jquery.balanced-gallery.js | 15 ++++-----------
 1 file changed, 4 insertions(+), 11 deletions(-)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index 6cb975a..270d56f 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -68,7 +68,6 @@
     };
 
     BalancedGallery.prototype.init = function () {
-
         if(balancedGallery.quickResize === false) {
             this.elementChildren.each(function() {
                 $(this).css({display: 'inline-block', padding: 0, margin: 0});
@@ -117,6 +116,7 @@
             partitions = getPartitions(weights, rows);
             resizeHorizontalElements(partitions);
         }
+        checkWidth(balancedGallery.options.orientation);
     }
 
     function createVerticalGallery() {
@@ -130,6 +130,8 @@
             orientElementsVertically(partitions);
             resizeVerticalElements(partitions);
         }
+        checkWidth(balancedGallery.options.orientation);
+		alignColumnHeights();
     }
 
     function getRows () {
@@ -339,8 +341,6 @@
                 $image.css({margin: 0, marginRight: padding+'px', marginBottom: padding+'px'});
             }
         }
-
-        checkWidth(balancedGallery.options.orientation);
     }
 
     function quickResizeHorizontal() {
@@ -364,8 +364,6 @@
             $image.width(imgWidth);
             $image.height(imgHeight);
         }
-
-        checkWidth(balancedGallery.options.orientation);
     }
 
     function resizeVerticalElements(partitions) {
@@ -405,9 +403,6 @@
             }
             balancedGallery.resizingValue[k] = {ratio: resizingFactor, length: partitions[k].length, columnHeight: columnHeight};
         }
-
-        checkWidth(balancedGallery.options.orientation);
-		alignColumnHeights();
     }
 
     function quickResizeVertical() {
@@ -432,9 +427,6 @@
             $image.width(imgWidth);
             $image.height(imgHeight);
         }
-
-        checkWidth(balancedGallery.options.orientation);
-		alignColumnHeights();
     }
 
     //ensures that the rows or all columns are as wide as the container width
@@ -452,6 +444,7 @@
     function alignColumnHeights() {
         var averageHeight = 0;
         var imagesPerCol = 0;
+		
         for(var i = 0; i < balancedGallery.resizingValue.length; i++) {
             averageHeight += balancedGallery.resizingValue[i].columnHeight;
         }

From a038bb3a4bf74bd5df59bc42ea6e4ecc7348834f Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Sat, 25 Feb 2017 16:00:56 +0100
Subject: [PATCH 07/24] Updated minified version

---
 jquery.balanced-gallery.min.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/jquery.balanced-gallery.min.js b/jquery.balanced-gallery.min.js
index d98bda0..6422cc4 100644
--- a/jquery.balanced-gallery.min.js
+++ b/jquery.balanced-gallery.min.js
@@ -1 +1 @@
-!function(t,e,n){"use strict";function i(e,n){I=this,this.element=e,this.elementChildren=t(e).children("*"),this.options=t.extend({},T,n),this.options.autoResize&&(this.unadulteratedHtml=t(this.element).html(),this.unadulteratedCSS=r(),this.unadulteratedOptions=t.extend({},this.options),o()),this.init(),this.createGallery()}function r(){var e=t(I.element);return{width:e[0].style.width,height:e[0].style.height,background:e.css("background"),paddingLeft:e.css("padding-left"),paddingTop:e.css("padding-top"),overflow:e.css("overflow"),fontSize:e.css("font-size")}}function o(){t(e).resize(function(){clearTimeout(G),G=setTimeout(function(){I.recreate()},500)})}function a(){var t,e,n;t=h(),0===t?I.fallbackToStandardSize():(e=f(),n=v(e,t),S(n))}function l(){var t,e,n;t=s(),0===t?I.fallbackToStandardSize():(e=g(),n=v(e,t),z(n),k(n))}function h(){return Math.round(d()/(I.options.viewportWidth-I.options.padding))}function s(){return Math.round(u()/(I.options.viewportHeight-I.options.padding))}function d(){var e=0;return I.elementChildren.each(function(){e+=p(t(this))}),e}function u(){var e=0;return I.elementChildren.each(function(){e+=c(t(this))}),e}function p(t){return W(t)*(I.options.idealHeight+I.options.padding)}function c(t){return 1/W(t)*(I.options.idealWidth+I.options.padding)}function f(){return I.elementChildren.map(function(){var e=parseInt(100*W(t(this)),R);return{element:this,weight:e}})}function g(){return I.elementChildren.map(function(){var e=parseInt(100*(1/W(t(this))),R);return{element:this,weight:e}})}function v(t,e){if(I.options.maintainOrder)return m(t,e);var n=y(t,e);return I.options.shuffleUnorderedPartitions&&(n=H(n)),C(n),n}function m(t,e){var n=t.length;if(0>=e)return[];if(e>=n)return t.map(function(t,e){return[[e]]});var i=w(t,e);n-=1,e-=2;for(var r=[];e>=0;){for(var o=[],a=i[n-1][e]+1;n+1>a;a++)o.push(t[a]);r=[o].concat(r),n=i[n-1][e],e-=1}for(var l=[],h=0;n+1>h;h++)l.push(t[h]);return[l].concat(r)}function w(t,e){for(var n=t.length,i=[],r=0;n>r;r++){for(var o=[],a=0;e>a;a++)o.push(0);i.push(o)}for(var l=[],h=0;n-1>h;h++){for(var s=[],d=0;e-1>d;d++)s.push(0);l.push(s)}for(var u=0;n>u;u++)i[u][0]=t[u].weight+(0!==u?i[u-1][0]:0);for(var p=0;e>p;p++)i[0][p]=t[0].weight;for(var c=function(t,e){return t[0]-e[0]},f=1;n>f;f++)for(var g=1;e>g;g++){for(var v=[],m=0;f>m;m++)v.push([Math.max(i[m][g-1],i[f][0]-i[m][0]),m]);var w=v.sort(c)[0];i[f][g]=w[0],l[f-1][g-1]=w[1]}return l}function y(t,e){for(var n=t.sort(function(t,e){return e.weight-t.weight}),i=new Array(e),r=0;e>r;r++)i[r]=[];for(var o=0;o<n.length;o++){for(var a=i[0],l=b(a),h=0;h<i.length;h++){var s=b(i[h]);l>s&&(a=i[h],l=s)}a.push(n[o])}return i}function b(e){var n=0;return t.each(e,function(t,e){n+=e.weight}),n}function H(t){for(var e=0;e<t.length;e++)t[e]=x(t[e]);return x(t)}function C(e){t(I.element).html("");for(var n=0;n<e.length;n++)for(var i=e[n],r=0;r<i.length;r++)t(I.element).append(i[r].element)}function S(e){for(var i=I.options.padding,r=0;r<e.length;r++){for(var o=0,a=0;a<e[r].length;a++)o+=W(t(e[r][a].element));for(var l=0;l<e[r].length;l++){var h=t(e[r][l].element),s=(I.options.viewportWidth-i)/o,d=parseInt(s,R),u=parseInt(d*W(h),R)-i;h.width(u),h.height(d),h.css({margin:0,marginRight:i+"px",marginBottom:i+"px"})}}I.element!==n.body&&t(I.element).css({overflow:"scroll"})}function k(e){for(var i=I.options.padding,r=0;r<e.length;r++){for(var o=0,a=0;a<e[r].length;a++)o+=1/W(t(e[r][a].element));for(var l=0;l<e[r].length;l++){var h=t(e[r][l].element),s=(I.options.viewportHeight-i)/o,d=parseInt(s,R),u=parseInt(d*(1/W(h)),R)-i;h.width(d),h.height(u),h.css({margin:0,marginRight:i+"px",marginBottom:i+"px"})}}t(".balanced-gallery-column").css({display:"inline-block",padding:0,margin:0}),t(I.container).width(function(){var e=0;return t(".balanced-gallery-column").each(function(){e+=t(this).width()}),e}()),I.element!==n.body&&t(I.element).css({overflowY:"hidden"}),I.options.viewportHeight!==I.element.clientHeight&&(I.options.viewportHeight=I.element.clientHeight-I.options.padding,t(I.element).height(I.options.viewportHeight-I.options.padding),I.element===n.body&&k(e))}function z(e){var i,r=t(I.element);r.html(""),r.css({overflow:"scroll"}),I.element!==n.body?(i=t('<div id="balanced-gallery-col-container"></div>'),r.append(i[0])):i=t(I.element),I.container=i[0];for(var o=0;o<e.length;o++){var a="balanced-gallery-col"+o,l='<div class="balanced-gallery-column" id="'+a+'"></div>';i.append(l);for(var h=0;h<e[o].length;h++){var s=e[o][h].element,d=t(i.find("div#"+a));d.append(s).append("<br />")}}}function W(t){var e=I.options.padding;return(t.width()+e)/(t.height()+e)}function x(t){for(var e,n,i=t.length;i--;)n=0|Math.random()*i,e=t[i],t[i]=t[n],t[n]=e;return t}var I,L="BalancedGallery",T={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,viewportHeight:null,viewportWidth:null},O="ALL_CHILDREN_LOADED",G=null,R=10;t.fn[L]=function(e){return this.each(function(){t.data(this,"plugin_"+L)||t.data(this,"plugin_"+L,new i(this,e))})},i.prototype.recreate=function(){t(this.element).on(O,function(){I.init(),I.createGallery()}),this.reset()},i.prototype.reset=function(){var e=this.elementChildren.length;t(this.element).html(this.unadulteratedHtml),t(this.element).css(this.unadulteratedCSS),this.options=t.extend({},this.unadulteratedOptions),this.elementChildren=t(this.element).children("*");var n=0;this.elementChildren.each(function(){t(this).load(function(){++n===e&&t(I.element).trigger(O)})})},i.prototype.init=function(){null===this.options.viewportWidth&&(this.options.viewportWidth=t(this.element).width()),null===this.options.viewportHeight&&(this.options.viewportHeight=t(this.element).height()),null===this.options.idealWidth&&(this.options.idealWidth=t(this.element).width()/4),null===this.options.idealHeight&&(this.options.idealHeight=t(this.element).height()/2),null!==this.options.background&&t(this.element).css({background:this.options.background}),this.elementChildren.css({display:"inline-block",padding:0,margin:0});var e=this.options.padding+"px";t(this.element).css({fontSize:0,paddingTop:e,paddingLeft:e})},i.prototype.createGallery=function(){var t=this.options.orientation.toLowerCase();if("horizontal"===t)a();else{if("vertical"!==t)throw"BalancedGallery: Invalid Orientation.";l()}},i.prototype.fallbackToStandardSize=function(){var e=this.options.idealHeight;this.elementChildren.each(function(){t(this).height(e),t(this).width(I.idealWidth(t(this)))})}}(jQuery,window,document);
\ No newline at end of file
+!function(a,b,c,d){"use strict";function l(b,c){f=this,this.element=b,a(this.element).wrapInner('<div class="balanced-gallery-container"></div>'),this.container=a(this.element).children()[0],this.elementChildren=a(this.container).children("img"),this.options=a.extend({},g,c),this.options.orientation=this.options.orientation.toLowerCase(),this.options.autoResize&&(this.unadulteratedCSS={width:a(this.element)[0].style.width},this.unadulteratedOptions=a.extend({},this.options),m()),this.quickResize=!1,this.init(),this.createGallery()}function m(){a(b).resize(function(){clearTimeout(h),h=setTimeout(function(){f.recreate()},500)})}function n(){var a,b,c;f.quickResize?D():(a=p(),b=t(),c=v(b,a),C(c)),I(f.options.orientation)}function o(){var a,b,c;f.quickResize?F():(a=q(),b=u(),c=v(b,a),J(c),E(c)),I(f.options.orientation),H()}function p(){var a=Math.round(r()/f.options.viewportWidth);return a>0&&a<1&&(a=1),a}function q(){var a=Math.round(f.options.viewportWidth/f.options.idealWidth),b=f.elementChildren.length;return a<=b?a:b}function r(){var b=0;return f.elementChildren.each(function(){b+=s(a(this))}),b}function s(a){return K(a)*f.options.idealHeight+f.options.padding}function t(){return f.elementChildren.map(function(){var b=K(a(this));return{element:this,weight:b}})}function u(){return f.elementChildren.map(function(){var b=1/K(a(this));return{element:this,weight:b}})}function v(a,b){if(f.options.maintainOrder)return w(a,b);var c=y(a,b);return f.options.shuffleUnorderedPartitions&&(c=A(c)),B(c),c}function w(a,b){var c=a.length;if(b<=0)return[];var d=x(a,b);c-=1,b-=2;for(var e=[],f=[];b>=0;){f=[];for(var g=d[c-1][b]+1;g<c+1;g++)f.push(a[g]);e=[f].concat(e),c=d[c-1][b],b-=1}for(var h=[],i=0;i<c+1;i++)h.push(a[i]);return[h].concat(e)}function x(a,b){for(var c=a.length,d=[],e=0;e<c;e++){for(var f=[],g=0;g<b;g++)f.push(0);d.push(f)}for(var h=[],i=0;i<c-1;i++){for(var j=[],k=0;k<b-1;k++)j.push(0);h.push(j)}for(var l=0;l<c;l++)d[l][0]=a[l].weight+(0!==l?d[l-1][0]:0);for(var m=0;m<b;m++)d[0][m]=a[0].weight;for(var n=function(a,b){return a[0]-b[0]},o=1;o<c;o++)for(var p=1;p<b;p++){for(var q=[],r=0;r<o;r++)q.push([Math.max(d[r][p-1],d[o][0]-d[r][0]),r]);var s=q.sort(n)[0];d[o][p]=s[0],h[o-1][p-1]=s[1]}return h}function y(a,b){for(var c=a.sort(function(a,b){return b.weight-a.weight}),d=new Array(b),e=0;e<b;e++)d[e]=[];for(var f=0;f<c.length;f++){for(var g=d[0],h=z(g),i=0;i<d.length;i++){var j=z(d[i]);j<h&&(g=d[i],h=j)}g.push(c[f])}return d}function z(b){var c=0;return a.each(b,function(a,b){c+=b.weight}),c}function A(a){for(var b=0;b<a.length;b++)a[b]=L(a[b]);return L(a)}function B(b){a(f.container).html("");for(var c=0;c<b.length;c++)for(var d=b[c],e=0;e<d.length;e++)a(f.container).append(d[e].element)}function C(b){var c=f.options.padding,d=0;f.resizingValue=[];for(var e=0;e<b.length;e++){for(var g=0,h=0;h<b[e].length;h++)g+=b[e][h].weight;f.resizingValue[e]={ratio:g,length:b[e].length},k=0;for(var j=c*b[e].length,l=(f.options.viewportWidth-j)/g,m=0;m<b[e].length;m++){var n=a(b[e][m].element);f.elementChildren[d++]=n;var o=parseInt(l,i),p=l*K(n);p=G(p),n.width(p),n.height(o),n.css({margin:0,marginRight:c+"px",marginBottom:c+"px"})}}}function D(){for(var d,e,a=f.options.padding,b=0,c=0,g=0;g<f.elementChildren.length;g++){g==c&&(e=a*f.resizingValue[b].length,d=(f.options.viewportWidth-e)/f.resizingValue[b].ratio,c+=f.resizingValue[b].length,b++,k=0);var h=f.elementChildren[g],j=parseInt(d,i),l=d*K(h);l=G(l),h.width(l),h.height(j)}}function E(b){var c=f.options.padding,d=[],e=0,g=0;f.resizingValue=[],k=0;for(var h=0;h<b.length;h++){d[h]=0;for(var i=0;i<b[h].length;i++)d[h]+=b[h][i].weight;d[h]+=b[h].length*(c/(f.options.idealWidth-c)),e+=d[h]}f.summedColRatios=e;for(var j=e/b.length,l=0;l<b.length;l++){for(var m=j-d[l],n=j+m,o=f.options.viewportWidth/e*n,p=o-c,q=G(p),r=0,s=0;s<b[l].length;s++){var t=a(b[l][s].element);f.elementChildren[g++]=t;var u=Math.round(p*(1/K(t)));r+=u+c,t.width(q),t.height(u),t.css({margin:0,marginRight:c+"px",marginBottom:c+"px"})}f.resizingValue[l]={ratio:n,length:b[l].length,columnHeight:r}}}function F(){var a=f.options.padding,b=-1,c=0;k=0;for(var d,e,g,h=0;h<f.elementChildren.length;h++){h==c&&(b++,f.resizingValue[b].columnHeight=0,d=f.options.viewportWidth/f.summedColRatios*f.resizingValue[b].ratio,e=d-a,g=G(e),c+=f.resizingValue[b].length);var j=f.elementChildren[h],l=parseInt(e*(1/K(j)),i);f.resizingValue[b].columnHeight+=l+a,j.width(g),j.height(l)}}function G(a){var b=parseInt(a,i);return k+=a-b,k>=j&&(b+=1,k-=1),b}function H(){for(var a=0,b=0,c=0;c<f.resizingValue.length;c++)a+=f.resizingValue[c].columnHeight;a=Math.round(a/f.resizingValue.length);for(var d=0;d<f.resizingValue.length;d++){b+=f.resizingValue[d].length;for(var e=Math.sign(a-f.resizingValue[d].columnHeight),g=b-1;a!=f.resizingValue[d].columnHeight;)f.elementChildren[g].height(f.elementChildren[g].height()+e),f.resizingValue[d].columnHeight+=e,g--,g<b-f.resizingValue[d].length&&(g=b-1)}}function I(b){f.options.viewportWidth+f.options.padding!==a(f.element).width()&&(f.options.viewportWidth=a(f.element).width()-f.options.padding,a(f.container).width(f.options.viewportWidth),"horizontal"==b?D():"vertical"==b&&F())}function J(b){var c=a(f.container);c.html("");for(var d=0;d<b.length;d++){var e="balanced-gallery-col"+d,g='<div class="balanced-gallery-column" id="'+e+'" style="float: left; padding: 0; margin: 0;"></div>';c.append(g);for(var h=a(c.find("div#"+e)),i=0;i<b[d].length;i++){var j=b[d][i].element;h.append(j).append('<br style="display: block;"/>')}}var k='<div class="balanced-gallery-clearing" style="clear: both;"></div>';c.append(k)}function K(a){return a[0].naturalWidth/a[0].naturalHeight}function L(a){for(var c,d,b=a.length;b--;)d=Math.random()*b|0,c=a[b],a[b]=a[d],a[d]=c;return a}var f,e="BalancedGallery",g={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,divisor:4},h=null,i=10,j=.99999,k=0;a.fn[e]=function(b){return this.each(function(){a.data(this,"plugin_"+e)||a.data(this,"plugin_"+e,new l(this,b))})},l.prototype.recreate=function(){this.options=a.extend({},this.unadulteratedOptions),a(this.element).css(this.unadulteratedCSS),f.quickResize=!0,f.init(),f.createGallery()},l.prototype.init=function(){if(f.quickResize===!1){this.elementChildren.each(function(){a(this).css({display:"inline-block",padding:0,margin:0})});var b=this.options.padding+"px";a(this.container).css({fontSize:0,paddingTop:b,paddingLeft:b}),null!==this.options.background&&a(this.container).css({background:this.options.background})}this.options.viewportWidth=a(this.element).width()-this.options.padding,null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/this.options.divisor),null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.divisor),a(this.container).width(this.options.viewportWidth)},l.prototype.createGallery=function(){var a=this.options.orientation;if("horizontal"===a)n();else{if("vertical"!==a)throw"BalancedGallery: Invalid Orientation.";o()}}}(jQuery,window,document);
\ No newline at end of file

From 792ac6470fa4f5ed4889758e2c89de5f95b22358 Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Sat, 25 Feb 2017 17:27:11 +0100
Subject: [PATCH 08/24] Adjusted documentation

---
 README.md                      | 14 +++++++-------
 demo_small_box.html            |  4 ++--
 jquery.balanced-gallery.js     |  6 +++---
 jquery.balanced-gallery.min.js |  2 +-
 4 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/README.md b/README.md
index 46425de..b4c9c89 100644
--- a/README.md
+++ b/README.md
@@ -29,16 +29,16 @@ Options
 -------
 ``` javascript
 var defaults = {
-            autoResize: true,                   // re-partition and resize the images when the window size changes
+            autoResize: true,                   // resize the images when the window size changes
             background: null,                   // the css properties of the gallery's containing element
-            idealHeight: null,                  // ideal row height, only used for horizontal galleries, defaults to half the containing element's height
-            idealWidth: null,                   // ideal column width, only used for vertical galleries, defaults to 1/4 of the containing element's width
+            idealHeight: null,                  // ideal row height, only used for horizontal galleries, defaults to 1/4 of the container width
+            idealWidth: null,                   // ideal column width, only used for vertical galleries, defaults to 1/4 of the container width
             maintainOrder: true,                // keeps images in their original order, setting to 'false' can create a slightly better balance between rows
-            orientation: 'horizontal',          // 'horizontal' galleries are made of rows and scroll vertically; 'vertical' galleries are made of columns and scroll horizontally
+            orientation: 'horizontal',          // 'horizontal' galleries are made of rows and scroll vertically; 'vertical' galleries are made of columns and also scroll vertically
             padding: 5,                         // pixels between images
-            shuffleUnorderedPartitions: true,   // unordered galleries tend to clump larger images at the begining, this solves that issue at a slight performance cost
-            viewportHeight: null,               // the assumed height of the gallery, defaults to the containing element's height
-            viewportWidth: null                 // the assumed width of the gallery, defaults to the containing element's width
+            shuffleUnorderedPartitions: true,   // unordered galleries tend to clump larger images at the beginning, this solves that issue at a slight performance cost
+            widthDivisor: 4						// used to define idealHeight/idealWidth (when they aren't set) by dividing the elements container width by the given value;
+												// the bigger the widthDivisor value, the smaller the images get; on vertical galleries the value simply defines the number of columns
         };
 ```
 
diff --git a/demo_small_box.html b/demo_small_box.html
index 0408d83..d09b887 100644
--- a/demo_small_box.html
+++ b/demo_small_box.html
@@ -14,13 +14,13 @@
     </style>
     <script type="text/javascript">
         $(window).load(function () {
-          $('#gallery').BalancedGallery({ /* options */ });
+			$('#gallery').BalancedGallery({divisor: 3});
         });
     </script>
 </head>
 <body>
 
-<div id="gallery" style="width: 80%; height: 600px">
+<div id="gallery" style="width: 50%; margin: auto;">
     <img src="http://placekitten.com/335/283" style="padding: 10px; margin: 5px" />
     <img src="http://placekitten.com/325/596" />
     <img src="http://placekitten.com/580/365" />
diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index 270d56f..c2b5832 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -12,7 +12,7 @@
             orientation: 'horizontal',
             padding: 5,
             shuffleUnorderedPartitions: true,
-            divisor: 4
+            widthDivisor: 4
         },
         resizeTimeout = null,
         RADIX = 10,
@@ -84,11 +84,11 @@
         this.options.viewportWidth = $(this.element).width() - this.options.padding;
 
         if(this.options.idealWidth === null) {
-            this.options.idealWidth = this.options.viewportWidth / this.options.divisor;
+            this.options.idealWidth = this.options.viewportWidth / this.options.widthDivisor;
         }
 
         if(this.options.idealHeight === null) {
-            this.options.idealHeight = this.options.viewportWidth / this.options.divisor;
+            this.options.idealHeight = this.options.viewportWidth / this.options.widthDivisor;
         }
 
         //setting explicit width prevents image wrapping on resizing
diff --git a/jquery.balanced-gallery.min.js b/jquery.balanced-gallery.min.js
index 6422cc4..cabbd95 100644
--- a/jquery.balanced-gallery.min.js
+++ b/jquery.balanced-gallery.min.js
@@ -1 +1 @@
-!function(a,b,c,d){"use strict";function l(b,c){f=this,this.element=b,a(this.element).wrapInner('<div class="balanced-gallery-container"></div>'),this.container=a(this.element).children()[0],this.elementChildren=a(this.container).children("img"),this.options=a.extend({},g,c),this.options.orientation=this.options.orientation.toLowerCase(),this.options.autoResize&&(this.unadulteratedCSS={width:a(this.element)[0].style.width},this.unadulteratedOptions=a.extend({},this.options),m()),this.quickResize=!1,this.init(),this.createGallery()}function m(){a(b).resize(function(){clearTimeout(h),h=setTimeout(function(){f.recreate()},500)})}function n(){var a,b,c;f.quickResize?D():(a=p(),b=t(),c=v(b,a),C(c)),I(f.options.orientation)}function o(){var a,b,c;f.quickResize?F():(a=q(),b=u(),c=v(b,a),J(c),E(c)),I(f.options.orientation),H()}function p(){var a=Math.round(r()/f.options.viewportWidth);return a>0&&a<1&&(a=1),a}function q(){var a=Math.round(f.options.viewportWidth/f.options.idealWidth),b=f.elementChildren.length;return a<=b?a:b}function r(){var b=0;return f.elementChildren.each(function(){b+=s(a(this))}),b}function s(a){return K(a)*f.options.idealHeight+f.options.padding}function t(){return f.elementChildren.map(function(){var b=K(a(this));return{element:this,weight:b}})}function u(){return f.elementChildren.map(function(){var b=1/K(a(this));return{element:this,weight:b}})}function v(a,b){if(f.options.maintainOrder)return w(a,b);var c=y(a,b);return f.options.shuffleUnorderedPartitions&&(c=A(c)),B(c),c}function w(a,b){var c=a.length;if(b<=0)return[];var d=x(a,b);c-=1,b-=2;for(var e=[],f=[];b>=0;){f=[];for(var g=d[c-1][b]+1;g<c+1;g++)f.push(a[g]);e=[f].concat(e),c=d[c-1][b],b-=1}for(var h=[],i=0;i<c+1;i++)h.push(a[i]);return[h].concat(e)}function x(a,b){for(var c=a.length,d=[],e=0;e<c;e++){for(var f=[],g=0;g<b;g++)f.push(0);d.push(f)}for(var h=[],i=0;i<c-1;i++){for(var j=[],k=0;k<b-1;k++)j.push(0);h.push(j)}for(var l=0;l<c;l++)d[l][0]=a[l].weight+(0!==l?d[l-1][0]:0);for(var m=0;m<b;m++)d[0][m]=a[0].weight;for(var n=function(a,b){return a[0]-b[0]},o=1;o<c;o++)for(var p=1;p<b;p++){for(var q=[],r=0;r<o;r++)q.push([Math.max(d[r][p-1],d[o][0]-d[r][0]),r]);var s=q.sort(n)[0];d[o][p]=s[0],h[o-1][p-1]=s[1]}return h}function y(a,b){for(var c=a.sort(function(a,b){return b.weight-a.weight}),d=new Array(b),e=0;e<b;e++)d[e]=[];for(var f=0;f<c.length;f++){for(var g=d[0],h=z(g),i=0;i<d.length;i++){var j=z(d[i]);j<h&&(g=d[i],h=j)}g.push(c[f])}return d}function z(b){var c=0;return a.each(b,function(a,b){c+=b.weight}),c}function A(a){for(var b=0;b<a.length;b++)a[b]=L(a[b]);return L(a)}function B(b){a(f.container).html("");for(var c=0;c<b.length;c++)for(var d=b[c],e=0;e<d.length;e++)a(f.container).append(d[e].element)}function C(b){var c=f.options.padding,d=0;f.resizingValue=[];for(var e=0;e<b.length;e++){for(var g=0,h=0;h<b[e].length;h++)g+=b[e][h].weight;f.resizingValue[e]={ratio:g,length:b[e].length},k=0;for(var j=c*b[e].length,l=(f.options.viewportWidth-j)/g,m=0;m<b[e].length;m++){var n=a(b[e][m].element);f.elementChildren[d++]=n;var o=parseInt(l,i),p=l*K(n);p=G(p),n.width(p),n.height(o),n.css({margin:0,marginRight:c+"px",marginBottom:c+"px"})}}}function D(){for(var d,e,a=f.options.padding,b=0,c=0,g=0;g<f.elementChildren.length;g++){g==c&&(e=a*f.resizingValue[b].length,d=(f.options.viewportWidth-e)/f.resizingValue[b].ratio,c+=f.resizingValue[b].length,b++,k=0);var h=f.elementChildren[g],j=parseInt(d,i),l=d*K(h);l=G(l),h.width(l),h.height(j)}}function E(b){var c=f.options.padding,d=[],e=0,g=0;f.resizingValue=[],k=0;for(var h=0;h<b.length;h++){d[h]=0;for(var i=0;i<b[h].length;i++)d[h]+=b[h][i].weight;d[h]+=b[h].length*(c/(f.options.idealWidth-c)),e+=d[h]}f.summedColRatios=e;for(var j=e/b.length,l=0;l<b.length;l++){for(var m=j-d[l],n=j+m,o=f.options.viewportWidth/e*n,p=o-c,q=G(p),r=0,s=0;s<b[l].length;s++){var t=a(b[l][s].element);f.elementChildren[g++]=t;var u=Math.round(p*(1/K(t)));r+=u+c,t.width(q),t.height(u),t.css({margin:0,marginRight:c+"px",marginBottom:c+"px"})}f.resizingValue[l]={ratio:n,length:b[l].length,columnHeight:r}}}function F(){var a=f.options.padding,b=-1,c=0;k=0;for(var d,e,g,h=0;h<f.elementChildren.length;h++){h==c&&(b++,f.resizingValue[b].columnHeight=0,d=f.options.viewportWidth/f.summedColRatios*f.resizingValue[b].ratio,e=d-a,g=G(e),c+=f.resizingValue[b].length);var j=f.elementChildren[h],l=parseInt(e*(1/K(j)),i);f.resizingValue[b].columnHeight+=l+a,j.width(g),j.height(l)}}function G(a){var b=parseInt(a,i);return k+=a-b,k>=j&&(b+=1,k-=1),b}function H(){for(var a=0,b=0,c=0;c<f.resizingValue.length;c++)a+=f.resizingValue[c].columnHeight;a=Math.round(a/f.resizingValue.length);for(var d=0;d<f.resizingValue.length;d++){b+=f.resizingValue[d].length;for(var e=Math.sign(a-f.resizingValue[d].columnHeight),g=b-1;a!=f.resizingValue[d].columnHeight;)f.elementChildren[g].height(f.elementChildren[g].height()+e),f.resizingValue[d].columnHeight+=e,g--,g<b-f.resizingValue[d].length&&(g=b-1)}}function I(b){f.options.viewportWidth+f.options.padding!==a(f.element).width()&&(f.options.viewportWidth=a(f.element).width()-f.options.padding,a(f.container).width(f.options.viewportWidth),"horizontal"==b?D():"vertical"==b&&F())}function J(b){var c=a(f.container);c.html("");for(var d=0;d<b.length;d++){var e="balanced-gallery-col"+d,g='<div class="balanced-gallery-column" id="'+e+'" style="float: left; padding: 0; margin: 0;"></div>';c.append(g);for(var h=a(c.find("div#"+e)),i=0;i<b[d].length;i++){var j=b[d][i].element;h.append(j).append('<br style="display: block;"/>')}}var k='<div class="balanced-gallery-clearing" style="clear: both;"></div>';c.append(k)}function K(a){return a[0].naturalWidth/a[0].naturalHeight}function L(a){for(var c,d,b=a.length;b--;)d=Math.random()*b|0,c=a[b],a[b]=a[d],a[d]=c;return a}var f,e="BalancedGallery",g={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,divisor:4},h=null,i=10,j=.99999,k=0;a.fn[e]=function(b){return this.each(function(){a.data(this,"plugin_"+e)||a.data(this,"plugin_"+e,new l(this,b))})},l.prototype.recreate=function(){this.options=a.extend({},this.unadulteratedOptions),a(this.element).css(this.unadulteratedCSS),f.quickResize=!0,f.init(),f.createGallery()},l.prototype.init=function(){if(f.quickResize===!1){this.elementChildren.each(function(){a(this).css({display:"inline-block",padding:0,margin:0})});var b=this.options.padding+"px";a(this.container).css({fontSize:0,paddingTop:b,paddingLeft:b}),null!==this.options.background&&a(this.container).css({background:this.options.background})}this.options.viewportWidth=a(this.element).width()-this.options.padding,null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/this.options.divisor),null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.divisor),a(this.container).width(this.options.viewportWidth)},l.prototype.createGallery=function(){var a=this.options.orientation;if("horizontal"===a)n();else{if("vertical"!==a)throw"BalancedGallery: Invalid Orientation.";o()}}}(jQuery,window,document);
\ No newline at end of file
+!function(a,b,c,d){"use strict";function l(b,c){f=this,this.element=b,a(this.element).wrapInner('<div class="balanced-gallery-container"></div>'),this.container=a(this.element).children()[0],this.elementChildren=a(this.container).children("img"),this.options=a.extend({},g,c),this.options.orientation=this.options.orientation.toLowerCase(),this.options.autoResize&&(this.unadulteratedCSS={width:a(this.element)[0].style.width},this.unadulteratedOptions=a.extend({},this.options),m()),this.quickResize=!1,this.init(),this.createGallery()}function m(){a(b).resize(function(){clearTimeout(h),h=setTimeout(function(){f.recreate()},500)})}function n(){var a,b,c;f.quickResize?D():(a=p(),b=t(),c=v(b,a),C(c)),I(f.options.orientation)}function o(){var a,b,c;f.quickResize?F():(a=q(),b=u(),c=v(b,a),J(c),E(c)),I(f.options.orientation),H()}function p(){var a=Math.round(r()/f.options.viewportWidth);return a>0&&a<1&&(a=1),a}function q(){var a=Math.round(f.options.viewportWidth/f.options.idealWidth),b=f.elementChildren.length;return a<=b?a:b}function r(){var b=0;return f.elementChildren.each(function(){b+=s(a(this))}),b}function s(a){return K(a)*f.options.idealHeight+f.options.padding}function t(){return f.elementChildren.map(function(){var b=K(a(this));return{element:this,weight:b}})}function u(){return f.elementChildren.map(function(){var b=1/K(a(this));return{element:this,weight:b}})}function v(a,b){if(f.options.maintainOrder)return w(a,b);var c=y(a,b);return f.options.shuffleUnorderedPartitions&&(c=A(c)),B(c),c}function w(a,b){var c=a.length;if(b<=0)return[];var d=x(a,b);c-=1,b-=2;for(var e=[],f=[];b>=0;){f=[];for(var g=d[c-1][b]+1;g<c+1;g++)f.push(a[g]);e=[f].concat(e),c=d[c-1][b],b-=1}for(var h=[],i=0;i<c+1;i++)h.push(a[i]);return[h].concat(e)}function x(a,b){for(var c=a.length,d=[],e=0;e<c;e++){for(var f=[],g=0;g<b;g++)f.push(0);d.push(f)}for(var h=[],i=0;i<c-1;i++){for(var j=[],k=0;k<b-1;k++)j.push(0);h.push(j)}for(var l=0;l<c;l++)d[l][0]=a[l].weight+(0!==l?d[l-1][0]:0);for(var m=0;m<b;m++)d[0][m]=a[0].weight;for(var n=function(a,b){return a[0]-b[0]},o=1;o<c;o++)for(var p=1;p<b;p++){for(var q=[],r=0;r<o;r++)q.push([Math.max(d[r][p-1],d[o][0]-d[r][0]),r]);var s=q.sort(n)[0];d[o][p]=s[0],h[o-1][p-1]=s[1]}return h}function y(a,b){for(var c=a.sort(function(a,b){return b.weight-a.weight}),d=new Array(b),e=0;e<b;e++)d[e]=[];for(var f=0;f<c.length;f++){for(var g=d[0],h=z(g),i=0;i<d.length;i++){var j=z(d[i]);j<h&&(g=d[i],h=j)}g.push(c[f])}return d}function z(b){var c=0;return a.each(b,function(a,b){c+=b.weight}),c}function A(a){for(var b=0;b<a.length;b++)a[b]=L(a[b]);return L(a)}function B(b){a(f.container).html("");for(var c=0;c<b.length;c++)for(var d=b[c],e=0;e<d.length;e++)a(f.container).append(d[e].element)}function C(b){var c=f.options.padding,d=0;f.resizingValue=[];for(var e=0;e<b.length;e++){for(var g=0,h=0;h<b[e].length;h++)g+=b[e][h].weight;f.resizingValue[e]={ratio:g,length:b[e].length},k=0;for(var j=c*b[e].length,l=(f.options.viewportWidth-j)/g,m=0;m<b[e].length;m++){var n=a(b[e][m].element);f.elementChildren[d++]=n;var o=parseInt(l,i),p=l*K(n);p=G(p),n.width(p),n.height(o),n.css({margin:0,marginRight:c+"px",marginBottom:c+"px"})}}}function D(){for(var d,e,a=f.options.padding,b=0,c=0,g=0;g<f.elementChildren.length;g++){g==c&&(e=a*f.resizingValue[b].length,d=(f.options.viewportWidth-e)/f.resizingValue[b].ratio,c+=f.resizingValue[b].length,b++,k=0);var h=f.elementChildren[g],j=parseInt(d,i),l=d*K(h);l=G(l),h.width(l),h.height(j)}}function E(b){var c=f.options.padding,d=[],e=0,g=0;f.resizingValue=[],k=0;for(var h=0;h<b.length;h++){d[h]=0;for(var i=0;i<b[h].length;i++)d[h]+=b[h][i].weight;d[h]+=b[h].length*(c/(f.options.idealWidth-c)),e+=d[h]}f.summedColRatios=e;for(var j=e/b.length,l=0;l<b.length;l++){for(var m=j-d[l],n=j+m,o=f.options.viewportWidth/e*n,p=o-c,q=G(p),r=0,s=0;s<b[l].length;s++){var t=a(b[l][s].element);f.elementChildren[g++]=t;var u=Math.round(p*(1/K(t)));r+=u+c,t.width(q),t.height(u),t.css({margin:0,marginRight:c+"px",marginBottom:c+"px"})}f.resizingValue[l]={ratio:n,length:b[l].length,columnHeight:r}}}function F(){var a=f.options.padding,b=-1,c=0;k=0;for(var d,e,g,h=0;h<f.elementChildren.length;h++){h==c&&(b++,f.resizingValue[b].columnHeight=0,d=f.options.viewportWidth/f.summedColRatios*f.resizingValue[b].ratio,e=d-a,g=G(e),c+=f.resizingValue[b].length);var j=f.elementChildren[h],l=parseInt(e*(1/K(j)),i);f.resizingValue[b].columnHeight+=l+a,j.width(g),j.height(l)}}function G(a){var b=parseInt(a,i);return k+=a-b,k>=j&&(b+=1,k-=1),b}function H(){for(var a=0,b=0,c=0;c<f.resizingValue.length;c++)a+=f.resizingValue[c].columnHeight;a=Math.round(a/f.resizingValue.length);for(var d=0;d<f.resizingValue.length;d++){b+=f.resizingValue[d].length;for(var e=Math.sign(a-f.resizingValue[d].columnHeight),g=b-1;a!=f.resizingValue[d].columnHeight;)f.elementChildren[g].height(f.elementChildren[g].height()+e),f.resizingValue[d].columnHeight+=e,g--,g<b-f.resizingValue[d].length&&(g=b-1)}}function I(b){f.options.viewportWidth+f.options.padding!==a(f.element).width()&&(f.options.viewportWidth=a(f.element).width()-f.options.padding,a(f.container).width(f.options.viewportWidth),"horizontal"==b?D():"vertical"==b&&F())}function J(b){var c=a(f.container);c.html("");for(var d=0;d<b.length;d++){var e="balanced-gallery-col"+d,g='<div class="balanced-gallery-column" id="'+e+'" style="float: left; padding: 0; margin: 0;"></div>';c.append(g);for(var h=a(c.find("div#"+e)),i=0;i<b[d].length;i++){var j=b[d][i].element;h.append(j).append('<br style="display: block;"/>')}}var k='<div class="balanced-gallery-clearing" style="clear: both;"></div>';c.append(k)}function K(a){return a[0].naturalWidth/a[0].naturalHeight}function L(a){for(var c,d,b=a.length;b--;)d=Math.random()*b|0,c=a[b],a[b]=a[d],a[d]=c;return a}var f,e="BalancedGallery",g={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,widthDivisor:4},h=null,i=10,j=.99999,k=0;a.fn[e]=function(b){return this.each(function(){a.data(this,"plugin_"+e)||a.data(this,"plugin_"+e,new l(this,b))})},l.prototype.recreate=function(){this.options=a.extend({},this.unadulteratedOptions),a(this.element).css(this.unadulteratedCSS),f.quickResize=!0,f.init(),f.createGallery()},l.prototype.init=function(){if(f.quickResize===!1){this.elementChildren.each(function(){a(this).css({display:"inline-block",padding:0,margin:0})});var b=this.options.padding+"px";a(this.container).css({fontSize:0,paddingTop:b,paddingLeft:b}),null!==this.options.background&&a(this.container).css({background:this.options.background})}this.options.viewportWidth=a(this.element).width()-this.options.padding,null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/this.options.widthDivisor),null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.widthDivisor),a(this.container).width(this.options.viewportWidth)},l.prototype.createGallery=function(){var a=this.options.orientation;if("horizontal"===a)n();else{if("vertical"!==a)throw"BalancedGallery: Invalid Orientation.";o()}}}(jQuery,window,document);
\ No newline at end of file

From cc74220e03eee5a4b305bf718aef4a01cd4ee86a Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Sat, 11 Mar 2017 16:20:09 +0100
Subject: [PATCH 09/24] Added new orientation: grid

---
 jquery.balanced-gallery.js | 55 ++++++++++++++++++++++++++++++++++++--
 1 file changed, 53 insertions(+), 2 deletions(-)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index c2b5832..3e1500e 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -101,7 +101,10 @@
             createHorizontalGallery();
         } else if(orientation === 'vertical') {
             createVerticalGallery();
-        } else {
+        } else if(orientation === 'grid') {
+			createGridGallery();
+			checkWidth(orientation);
+		} else {
             throw("BalancedGallery: Invalid Orientation.");
         }
     };
@@ -133,6 +136,47 @@
         checkWidth(balancedGallery.options.orientation);
 		alignColumnHeights();
     }
+	
+	function createGridGallery() {
+		var padding = balancedGallery.options.padding;
+		var quadratLength = parseInt(balancedGallery.options.idealWidth) - padding;
+		var wrapper = '<div style="position: relative; display: inline-block; overflow: hidden; width: '+quadratLength+'px; height: '+quadratLength+'px; margin: 0 '+padding+'px '+padding+'px 0;"></div>';
+		var paddingGap = parseInt(((balancedGallery.options.viewportWidth % balancedGallery.options.widthDivisor) / 2), RADIX);
+		
+		//if necessary, increase the padding on the left side of the container so the grid is more centered
+		if(paddingGap > 0) {
+			var increasedPadding = paddingGap + padding;
+			var $container = $(balancedGallery.container);
+			$container.css({paddingLeft: increasedPadding+'px'});
+			$container.width(balancedGallery.options.viewportWidth - paddingGap);
+		}
+
+		balancedGallery.elementChildren.each(function(){
+			var $image = $(this);
+			var ratio = aspectRatio($image);
+			var offset = 0;
+		  
+			if(ratio >= 1) {
+				$image.height(quadratLength);
+				$image.width(quadratLength * ratio);
+				offset = (((quadratLength * ratio) - quadratLength) / 2) * -1;
+				$image.css({left: offset+'px', position: 'absolute'});
+			} else if(ratio < 1) {
+				$image.width(quadratLength);
+				$image.height(quadratLength * (1/ratio));
+				offset = (((quadratLength * (1/ratio)) - quadratLength) / 2) * -1;
+				$image.css({top: offset+'px', position: 'absolute'});
+			}
+			
+			if(balancedGallery.quickResize) {
+				var $div = $image.parent();
+				$div.width(quadratLength);
+				$div.height(quadratLength);
+			} else {
+				$image.wrap(wrapper);
+			}
+		});
+	}
 
     function getRows () {
         var rows = Math.round(collectiveIdealWidth() / balancedGallery.options.viewportWidth);
@@ -475,7 +519,10 @@
                 quickResizeHorizontal();
             } else if(orientation == 'vertical') {
                 quickResizeVertical();
-            }
+            } else if(orientation == 'grid') {
+				balancedGallery.options.idealWidth = balancedGallery.options.viewportWidth / balancedGallery.options.widthDivisor;
+				createGridGallery();
+			}
         }
     }
 
@@ -498,6 +545,10 @@
         var clearingDiv = '<div class="balanced-gallery-clearing" style="clear: both;"></div>';
         $container.append(clearingDiv);
     }
+	
+	function wrapImages() {
+
+	}
 
     function aspectRatio($image) {
         return $image[0].naturalWidth / $image[0].naturalHeight;

From 68a28d8a47b68bbc5bc00e2db3014fcf09bf329b Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Sat, 11 Mar 2017 19:27:36 +0100
Subject: [PATCH 10/24] Added new demo files and adjusted documentation

---
 README.md                                   |  2 +-
 balancedgallery.jquery.json                 |  2 +-
 demo.html => demo_grid.html                 |  6 ++-
 demo_small_box.html => demo_horizontal.html |  2 +-
 demo_vertical.html                          | 42 +++++++++++++++++++++
 jquery.balanced-gallery.js                  |  6 +--
 jquery.balanced-gallery.min.js              |  3 +-
 7 files changed, 53 insertions(+), 10 deletions(-)
 rename demo.html => demo_grid.html (91%)
 rename demo_small_box.html => demo_horizontal.html (96%)
 create mode 100644 demo_vertical.html

diff --git a/README.md b/README.md
index b4c9c89..794c421 100644
--- a/README.md
+++ b/README.md
@@ -34,7 +34,7 @@ var defaults = {
             idealHeight: null,                  // ideal row height, only used for horizontal galleries, defaults to 1/4 of the container width
             idealWidth: null,                   // ideal column width, only used for vertical galleries, defaults to 1/4 of the container width
             maintainOrder: true,                // keeps images in their original order, setting to 'false' can create a slightly better balance between rows
-            orientation: 'horizontal',          // 'horizontal' galleries are made of rows and scroll vertically; 'vertical' galleries are made of columns and also scroll vertically
+            orientation: 'horizontal',          // 'horizontal' galleries are made of rows; 'vertical' galleries are made of columns; 'grid' galleries combine both
             padding: 5,                         // pixels between images
             shuffleUnorderedPartitions: true,   // unordered galleries tend to clump larger images at the beginning, this solves that issue at a slight performance cost
             widthDivisor: 4						// used to define idealHeight/idealWidth (when they aren't set) by dividing the elements container width by the given value;
diff --git a/balancedgallery.jquery.json b/balancedgallery.jquery.json
index 105ed16..f6f6414 100644
--- a/balancedgallery.jquery.json
+++ b/balancedgallery.jquery.json
@@ -15,5 +15,5 @@
 "dependencies" : {
     "jquery": ">=1.5"
 },
-"description" : "Balanced Gallery is a jQuery plugin that evenly distributes photos across rows or columns, making the most of the space provided. Photos are scaled based on the size of the 'container' element by default, making Balanced Gallery a great choice for (responsive) websites."
+"description" : "Balanced Gallery is a jQuery plugin that evenly distributes photos across rows, columns or a grid, making the most of the space provided. Photos are scaled based on the size of the 'container' element by default, making Balanced Gallery a great choice for (responsive) websites."
 }
\ No newline at end of file
diff --git a/demo.html b/demo_grid.html
similarity index 91%
rename from demo.html
rename to demo_grid.html
index b51680d..5a98c4f 100644
--- a/demo.html
+++ b/demo_grid.html
@@ -14,11 +14,13 @@
     </style>
     <script type="text/javascript">
         $(window).load(function () {
-           $('body').BalancedGallery({ /* options */ });
+			$('#gallery').BalancedGallery({orientation: 'grid'});
         });
     </script>
 </head>
 <body>
+
+<div id="gallery" style="width: 70%; margin: auto;">
     <img src="http://placekitten.com/335/283" style="padding: 10px; margin: 5px" />
     <img src="http://placekitten.com/325/596" />
     <img src="http://placekitten.com/580/365" />
@@ -33,6 +35,8 @@
     <img src="http://placekitten.com/550/304" />
     <img src="http://placekitten.com/352/204" />
     <img src="http://placekitten.com/400/220" />
+</div>
+
 </body>
 </html>
 
diff --git a/demo_small_box.html b/demo_horizontal.html
similarity index 96%
rename from demo_small_box.html
rename to demo_horizontal.html
index d09b887..8bd126f 100644
--- a/demo_small_box.html
+++ b/demo_horizontal.html
@@ -20,7 +20,7 @@
 </head>
 <body>
 
-<div id="gallery" style="width: 50%; margin: auto;">
+<div id="gallery" style="width: 70%; margin: auto;">
     <img src="http://placekitten.com/335/283" style="padding: 10px; margin: 5px" />
     <img src="http://placekitten.com/325/596" />
     <img src="http://placekitten.com/580/365" />
diff --git a/demo_vertical.html b/demo_vertical.html
new file mode 100644
index 0000000..d8f07fe
--- /dev/null
+++ b/demo_vertical.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Balanced Gallery Demo</title>
+    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
+    <script type="text/javascript" src="jquery.balanced-gallery.js"></script>
+    <style type="text/css">
+        html, body {
+            font-family: helvetica, arial, sans-serif;
+            height: 100%;
+            padding: 0;
+            margin: 0;
+        }
+    </style>
+    <script type="text/javascript">
+        $(window).load(function () {
+			$('#gallery').BalancedGallery({orientation: 'vertical', widthDivisor: 3, maintainOrder: false});
+        });
+    </script>
+</head>
+<body>
+
+<div id="gallery" style="width: 70%; margin: auto;">
+    <img src="http://placekitten.com/335/283" style="padding: 10px; margin: 5px" />
+    <img src="http://placekitten.com/325/596" />
+    <img src="http://placekitten.com/580/365" />
+    <img src="http://placekitten.com/282/581" />
+    <img src="http://placekitten.com/503/319" />
+    <img src="http://placekitten.com/549/577" />
+    <img src="http://placekitten.com/355/493" />
+    <img src="http://placekitten.com/500/150" />
+    <img src="http://placekitten.com/360/529" />
+    <img src="http://placekitten.com/589/361" />
+    <img src="http://placekitten.com/452/462" />
+    <img src="http://placekitten.com/550/304" />
+    <img src="http://placekitten.com/352/204" />
+    <img src="http://placekitten.com/400/220" />
+</div>
+
+</body>
+</html>
+
diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index 3e1500e..418d712 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -139,7 +139,7 @@
 	
 	function createGridGallery() {
 		var padding = balancedGallery.options.padding;
-		var quadratLength = parseInt(balancedGallery.options.idealWidth) - padding;
+		var quadratLength = parseInt(balancedGallery.options.idealWidth, RADIX) - padding;
 		var wrapper = '<div style="position: relative; display: inline-block; overflow: hidden; width: '+quadratLength+'px; height: '+quadratLength+'px; margin: 0 '+padding+'px '+padding+'px 0;"></div>';
 		var paddingGap = parseInt(((balancedGallery.options.viewportWidth % balancedGallery.options.widthDivisor) / 2), RADIX);
 		
@@ -545,10 +545,6 @@
         var clearingDiv = '<div class="balanced-gallery-clearing" style="clear: both;"></div>';
         $container.append(clearingDiv);
     }
-	
-	function wrapImages() {
-
-	}
 
     function aspectRatio($image) {
         return $image[0].naturalWidth / $image[0].naturalHeight;
diff --git a/jquery.balanced-gallery.min.js b/jquery.balanced-gallery.min.js
index cabbd95..ef23998 100644
--- a/jquery.balanced-gallery.min.js
+++ b/jquery.balanced-gallery.min.js
@@ -1 +1,2 @@
-!function(a,b,c,d){"use strict";function l(b,c){f=this,this.element=b,a(this.element).wrapInner('<div class="balanced-gallery-container"></div>'),this.container=a(this.element).children()[0],this.elementChildren=a(this.container).children("img"),this.options=a.extend({},g,c),this.options.orientation=this.options.orientation.toLowerCase(),this.options.autoResize&&(this.unadulteratedCSS={width:a(this.element)[0].style.width},this.unadulteratedOptions=a.extend({},this.options),m()),this.quickResize=!1,this.init(),this.createGallery()}function m(){a(b).resize(function(){clearTimeout(h),h=setTimeout(function(){f.recreate()},500)})}function n(){var a,b,c;f.quickResize?D():(a=p(),b=t(),c=v(b,a),C(c)),I(f.options.orientation)}function o(){var a,b,c;f.quickResize?F():(a=q(),b=u(),c=v(b,a),J(c),E(c)),I(f.options.orientation),H()}function p(){var a=Math.round(r()/f.options.viewportWidth);return a>0&&a<1&&(a=1),a}function q(){var a=Math.round(f.options.viewportWidth/f.options.idealWidth),b=f.elementChildren.length;return a<=b?a:b}function r(){var b=0;return f.elementChildren.each(function(){b+=s(a(this))}),b}function s(a){return K(a)*f.options.idealHeight+f.options.padding}function t(){return f.elementChildren.map(function(){var b=K(a(this));return{element:this,weight:b}})}function u(){return f.elementChildren.map(function(){var b=1/K(a(this));return{element:this,weight:b}})}function v(a,b){if(f.options.maintainOrder)return w(a,b);var c=y(a,b);return f.options.shuffleUnorderedPartitions&&(c=A(c)),B(c),c}function w(a,b){var c=a.length;if(b<=0)return[];var d=x(a,b);c-=1,b-=2;for(var e=[],f=[];b>=0;){f=[];for(var g=d[c-1][b]+1;g<c+1;g++)f.push(a[g]);e=[f].concat(e),c=d[c-1][b],b-=1}for(var h=[],i=0;i<c+1;i++)h.push(a[i]);return[h].concat(e)}function x(a,b){for(var c=a.length,d=[],e=0;e<c;e++){for(var f=[],g=0;g<b;g++)f.push(0);d.push(f)}for(var h=[],i=0;i<c-1;i++){for(var j=[],k=0;k<b-1;k++)j.push(0);h.push(j)}for(var l=0;l<c;l++)d[l][0]=a[l].weight+(0!==l?d[l-1][0]:0);for(var m=0;m<b;m++)d[0][m]=a[0].weight;for(var n=function(a,b){return a[0]-b[0]},o=1;o<c;o++)for(var p=1;p<b;p++){for(var q=[],r=0;r<o;r++)q.push([Math.max(d[r][p-1],d[o][0]-d[r][0]),r]);var s=q.sort(n)[0];d[o][p]=s[0],h[o-1][p-1]=s[1]}return h}function y(a,b){for(var c=a.sort(function(a,b){return b.weight-a.weight}),d=new Array(b),e=0;e<b;e++)d[e]=[];for(var f=0;f<c.length;f++){for(var g=d[0],h=z(g),i=0;i<d.length;i++){var j=z(d[i]);j<h&&(g=d[i],h=j)}g.push(c[f])}return d}function z(b){var c=0;return a.each(b,function(a,b){c+=b.weight}),c}function A(a){for(var b=0;b<a.length;b++)a[b]=L(a[b]);return L(a)}function B(b){a(f.container).html("");for(var c=0;c<b.length;c++)for(var d=b[c],e=0;e<d.length;e++)a(f.container).append(d[e].element)}function C(b){var c=f.options.padding,d=0;f.resizingValue=[];for(var e=0;e<b.length;e++){for(var g=0,h=0;h<b[e].length;h++)g+=b[e][h].weight;f.resizingValue[e]={ratio:g,length:b[e].length},k=0;for(var j=c*b[e].length,l=(f.options.viewportWidth-j)/g,m=0;m<b[e].length;m++){var n=a(b[e][m].element);f.elementChildren[d++]=n;var o=parseInt(l,i),p=l*K(n);p=G(p),n.width(p),n.height(o),n.css({margin:0,marginRight:c+"px",marginBottom:c+"px"})}}}function D(){for(var d,e,a=f.options.padding,b=0,c=0,g=0;g<f.elementChildren.length;g++){g==c&&(e=a*f.resizingValue[b].length,d=(f.options.viewportWidth-e)/f.resizingValue[b].ratio,c+=f.resizingValue[b].length,b++,k=0);var h=f.elementChildren[g],j=parseInt(d,i),l=d*K(h);l=G(l),h.width(l),h.height(j)}}function E(b){var c=f.options.padding,d=[],e=0,g=0;f.resizingValue=[],k=0;for(var h=0;h<b.length;h++){d[h]=0;for(var i=0;i<b[h].length;i++)d[h]+=b[h][i].weight;d[h]+=b[h].length*(c/(f.options.idealWidth-c)),e+=d[h]}f.summedColRatios=e;for(var j=e/b.length,l=0;l<b.length;l++){for(var m=j-d[l],n=j+m,o=f.options.viewportWidth/e*n,p=o-c,q=G(p),r=0,s=0;s<b[l].length;s++){var t=a(b[l][s].element);f.elementChildren[g++]=t;var u=Math.round(p*(1/K(t)));r+=u+c,t.width(q),t.height(u),t.css({margin:0,marginRight:c+"px",marginBottom:c+"px"})}f.resizingValue[l]={ratio:n,length:b[l].length,columnHeight:r}}}function F(){var a=f.options.padding,b=-1,c=0;k=0;for(var d,e,g,h=0;h<f.elementChildren.length;h++){h==c&&(b++,f.resizingValue[b].columnHeight=0,d=f.options.viewportWidth/f.summedColRatios*f.resizingValue[b].ratio,e=d-a,g=G(e),c+=f.resizingValue[b].length);var j=f.elementChildren[h],l=parseInt(e*(1/K(j)),i);f.resizingValue[b].columnHeight+=l+a,j.width(g),j.height(l)}}function G(a){var b=parseInt(a,i);return k+=a-b,k>=j&&(b+=1,k-=1),b}function H(){for(var a=0,b=0,c=0;c<f.resizingValue.length;c++)a+=f.resizingValue[c].columnHeight;a=Math.round(a/f.resizingValue.length);for(var d=0;d<f.resizingValue.length;d++){b+=f.resizingValue[d].length;for(var e=Math.sign(a-f.resizingValue[d].columnHeight),g=b-1;a!=f.resizingValue[d].columnHeight;)f.elementChildren[g].height(f.elementChildren[g].height()+e),f.resizingValue[d].columnHeight+=e,g--,g<b-f.resizingValue[d].length&&(g=b-1)}}function I(b){f.options.viewportWidth+f.options.padding!==a(f.element).width()&&(f.options.viewportWidth=a(f.element).width()-f.options.padding,a(f.container).width(f.options.viewportWidth),"horizontal"==b?D():"vertical"==b&&F())}function J(b){var c=a(f.container);c.html("");for(var d=0;d<b.length;d++){var e="balanced-gallery-col"+d,g='<div class="balanced-gallery-column" id="'+e+'" style="float: left; padding: 0; margin: 0;"></div>';c.append(g);for(var h=a(c.find("div#"+e)),i=0;i<b[d].length;i++){var j=b[d][i].element;h.append(j).append('<br style="display: block;"/>')}}var k='<div class="balanced-gallery-clearing" style="clear: both;"></div>';c.append(k)}function K(a){return a[0].naturalWidth/a[0].naturalHeight}function L(a){for(var c,d,b=a.length;b--;)d=Math.random()*b|0,c=a[b],a[b]=a[d],a[d]=c;return a}var f,e="BalancedGallery",g={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,widthDivisor:4},h=null,i=10,j=.99999,k=0;a.fn[e]=function(b){return this.each(function(){a.data(this,"plugin_"+e)||a.data(this,"plugin_"+e,new l(this,b))})},l.prototype.recreate=function(){this.options=a.extend({},this.unadulteratedOptions),a(this.element).css(this.unadulteratedCSS),f.quickResize=!0,f.init(),f.createGallery()},l.prototype.init=function(){if(f.quickResize===!1){this.elementChildren.each(function(){a(this).css({display:"inline-block",padding:0,margin:0})});var b=this.options.padding+"px";a(this.container).css({fontSize:0,paddingTop:b,paddingLeft:b}),null!==this.options.background&&a(this.container).css({background:this.options.background})}this.options.viewportWidth=a(this.element).width()-this.options.padding,null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/this.options.widthDivisor),null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.widthDivisor),a(this.container).width(this.options.viewportWidth)},l.prototype.createGallery=function(){var a=this.options.orientation;if("horizontal"===a)n();else{if("vertical"!==a)throw"BalancedGallery: Invalid Orientation.";o()}}}(jQuery,window,document);
\ No newline at end of file
+(function(g,E,M,N){function n(a,d){b=this;this.element=a;g(this.element).wrapInner('<div class="balanced-gallery-container"></div>');this.container=g(this.element).children()[0];this.elementChildren=g(this.container).children("img");this.options=g.extend({},F,d);this.options.orientation=this.options.orientation.toLowerCase();this.options.autoResize&&(this.unadulteratedCSS={width:g(this.element)[0].style.width},this.unadulteratedOptions=g.extend({},this.options),G());this.quickResize=!1;this.init();this.createGallery()}function G(){g(E).resize(function(){clearTimeout(t);t=setTimeout(function(){b.recreate()},500)})}function y(){var a=b.options.padding,d=parseInt(b.options.idealWidth,10)-a,f='<div style="position: relative; display: inline-block; overflow: hidden; width: '+d+"px; height: "+d+"px; margin: 0 "+a+"px "+a+'px 0;"></div>',c=parseInt(b.options.viewportWidth%b.options.widthDivisor/2,10);if(0<c){var a=c+a,h=g(b.container);h.css({paddingLeft:a+"px"});h.width(b.options.viewportWidth-c)}b.elementChildren.each(function(){var a=g(this),c=p(a);1<=c?(a.height(d),a.width(d*c),c=(d*c-d)/2*-1,a.css({left:c+"px",position:"absolute"})):1>c&&(a.width(d),a.height(1/c*d),c=(1/c*d-d)/2*-1,a.css({top:c+"px",position:"absolute"}));b.quickResize?(a=a.parent(),a.width(d),a.height(d)):a.wrap(f)})}function H(){var a=0;b.elementChildren.each(function(){a+=p(g(this))*b.options.idealHeight+b.options.padding});return a}function I(){return b.elementChildren.map(function(){return{element:this,weight:p(g(this))}})}function J(){return b.elementChildren.map(function(){return{element:this,weight:1/p(g(this))}})}function z(a,d){if(b.options.maintainOrder){var f;var c=d;f=a.length;if(0>=c)f=[];else{var h=K(a,c);--f;for(var c=c-2,e=[],k;0<=c;){k=[];for(var m=h[f-1][c]+1;m<f+1;m++)k.push(a[m]);e=[k].concat(e);f=h[f-1][c];--c}c=[];for(h=0;h<f+1;h++)c.push(a[h]);f=[c].concat(e)}return f}f=L(a,d);if(b.options.shuffleUnorderedPartitions){for(e=0;e<f.length;e++)f[e]=A(f[e]);f=A(f)}e=f;g(b.container).html("");for(c=0;c<e.length;c++)for(h=e[c],k=0;k<h.length;k++)g(b.container).append(h[k].element);return f}function K(a,b){for(var d=a.length,c=[],h=0;h<d;h++){for(var e=[],k=0;k<b;k++)e.push(0);c.push(e)}h=[];for(e=0;e<d-1;e++){for(var k=[],g=0;g<b-1;g++)k.push(0);h.push(k)}for(e=0;e<d;e++)c[e][0]=a[e].weight+(0!==e?c[e-1][0]:0);for(e=0;e<b;e++)c[0][e]=a[0].weight;e=function(a,b){return a[0]-b[0]};for(k=1;k<d;k++)for(g=1;g<b;g++){for(var l=[],q=0;q<k;q++)l.push([Math.max(c[q][g-1],c[k][0]-c[q][0]),q]);l=l.sort(e)[0];c[k][g]=l[0];h[k-1][g-1]=l[1]}return h}function L(a,b){for(var d=a.sort(function(a,b){return b.weight-a.weight}),c=Array(b),h=0;h<b;h++)c[h]=[];for(h=0;h<d.length;h++){for(var e=c[0],k=B(e),g=0;g<c.length;g++){var l=B(c[g]);l<k&&(e=c[g],k=l)}e.push(d[h])}return c}function B(a){var b=0;g.each(a,function(a,c){b+=c.weight});return b}function C(){for(var a=b.options.padding,d=0,f=0,c,h=0;h<b.elementChildren.length;h++){h==f&&(c=a*b.resizingValue[d].length,c=(b.options.viewportWidth-c)/b.resizingValue[d].ratio,f+=b.resizingValue[d].length,d++,r=0);var e=b.elementChildren[h],k=parseInt(c,10),g=c*p(e),g=v(g);e.width(g);e.height(k)}}function D(){var a=b.options.padding,d=-1,f=0;r=0;for(var c,h,e=0;e<b.elementChildren.length;e++){e==f&&(d++,b.resizingValue[d].columnHeight=0,c=b.options.viewportWidth/b.summedColRatios*b.resizingValue[d].ratio,c-=a,h=v(c),f+=b.resizingValue[d].length);var g=b.elementChildren[e],m=parseInt(c*(1/p(g)),10);b.resizingValue[d].columnHeight+=m+a;g.width(h);g.height(m)}}function v(a){var b=parseInt(a,10);r+=a-b;.99999<=r&&(b+=1,--r);return b}function x(a){b.options.viewportWidth+b.options.padding!==g(b.element).width()&&(b.options.viewportWidth=g(b.element).width()-b.options.padding,g(b.container).width(b.options.viewportWidth),"horizontal"==a?C():"vertical"==a?D():"grid"==a&&(b.options.idealWidth=b.options.viewportWidth/b.options.widthDivisor,y()))}function p(a){return a[0].naturalWidth/a[0].naturalHeight}function A(a){for(var b=a.length,f,c;b--;)c=Math.random()*b|0,f=a[b],a[b]=a[c],a[c]=f;return a}var b,F={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,widthDivisor:4},t=null,r=0;g.fn.BalancedGallery=function(a){return this.each(function(){g.data(this,"plugin_BalancedGallery")||g.data(this,"plugin_BalancedGallery",new n(this,a))})};n.prototype.recreate=function(){this.options=g.extend({},this.unadulteratedOptions);g(this.element).css(this.unadulteratedCSS);b.quickResize=!0;b.init();b.createGallery()};n.prototype.init=function(){if(!1===b.quickResize){this.elementChildren.each(function(){g(this).css({display:"inline-block",padding:0,margin:0})});var a=this.options.padding+"px";g(this.container).css({fontSize:0,paddingTop:a,paddingLeft:a});null!==this.options.background&&g(this.container).css({background:this.options.background})}this.options.viewportWidth=g(this.element).width()-this.options.padding;null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/this.options.widthDivisor);null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.widthDivisor);g(this.container).width(this.options.viewportWidth)};n.prototype.createGallery=function(){var a=this.options.orientation;if("horizontal"===a){var d;if(b.quickResize)C();else{a=Math.round(H()/b.options.viewportWidth);0<a&&1>a&&(a=1);d=I();a=z(d,a);d=b.options.padding;var f=0;b.resizingValue=[];for(var c=0;c<a.length;c++){for(var h=0,e=0;e<a[c].length;e++)h+=a[c][e].weight;b.resizingValue[c]={ratio:h,length:a[c].length};r=0;h=(b.options.viewportWidth-d*a[c].length)/h;for(e=0;e<a[c].length;e++){var k=g(a[c][e].element);b.elementChildren[f++]=k;var m=parseInt(h,10),l=h*p(k),l=v(l);k.width(l);k.height(m);k.css({margin:0,marginRight:d+"px",marginBottom:d+"px"})}}}x(b.options.orientation)}else if("vertical"===a){if(b.quickResize)D();else{a=Math.round(b.options.viewportWidth/b.options.idealWidth);d=b.elementChildren.length;a=a<=d?a:d;d=J();a=z(d,a);d=g(b.container);d.html("");for(f=0;f<a.length;f++)for(c="balanced-gallery-col"+f,d.append('<div class="balanced-gallery-column" id="'+c+'" style="float: left; padding: 0; margin: 0;"></div>'),c=g(d.find("div#"+c)),h=0;h<a[f].length;h++)c.append(a[f][h].element).append('<br style="display: block;"/>');d.append('<div class="balanced-gallery-clearing" style="clear: both;"></div>');d=b.options.padding;f=[];h=c=0;b.resizingValue=[];for(e=r=0;e<a.length;e++){for(k=f[e]=0;k<a[e].length;k++)f[e]+=a[e][k].weight;f[e]+=d/(b.options.idealWidth-d)*a[e].length;c+=f[e]}b.summedColRatios=c;e=c/a.length;for(k=0;k<a.length;k++){for(var m=e+(e-f[k]),l=b.options.viewportWidth/c*m-d,q=v(l),n=0,w=0;w<a[k].length;w++){var u=g(a[k][w].element);b.elementChildren[h++]=u;var t=Math.round(l*(1/p(u))),n=n+(t+d);u.width(q);u.height(t);u.css({margin:0,marginRight:d+"px",marginBottom:d+"px"})}b.resizingValue[k]={ratio:m,length:a[k].length,columnHeight:n}}}x(b.options.orientation);for(f=d=a=0;f<b.resizingValue.length;f++)a+=b.resizingValue[f].columnHeight;a=Math.round(a/b.resizingValue.length);for(f=0;f<b.resizingValue.length;f++)for(d+=b.resizingValue[f].length,c=Math.sign(a-b.resizingValue[f].columnHeight),h=d-1;a!=b.resizingValue[f].columnHeight;)b.elementChildren[h].height(b.elementChildren[h].height()+
+c),b.resizingValue[f].columnHeight+=c,h--,h<d-b.resizingValue[f].length&&(h=d-1)}else if("grid"===a)y(),x(a);else throw"BalancedGallery: Invalid Orientation.";}})(jQuery,window,document);
\ No newline at end of file

From fb84234e90aa98a873838d8d7ff228570f86169f Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Mon, 13 Mar 2017 15:21:29 +0100
Subject: [PATCH 11/24] Added autoResize support for multiple galleries on a
 page

---
 jquery.balanced-gallery.js     | 35 ++++++++++++++++++++--------------
 jquery.balanced-gallery.min.js |  3 +--
 2 files changed, 22 insertions(+), 16 deletions(-)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index 418d712..c7d7ae1 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -1,8 +1,9 @@
-;(function ( $, window, document, undefined ) {
+(function ($, window, undefined) {
     "use strict";
 
     var pluginName = 'BalancedGallery',
-        balancedGallery,
+        galleries = [],
+		balancedGallery,
         defaults = {
             autoResize: true,
             background: null,
@@ -20,21 +21,22 @@
         overflow = 0;
 
     //this wrapper prevents multiple instantiations of the plugin:
-    $.fn[pluginName] = function ( options ) {
+    $.fn[pluginName] = function (options) {
         return this.each(function () {
             if (!$.data(this, 'plugin_' + pluginName)) {
-                $.data(this, 'plugin_' + pluginName, new BalancedGallery( this, options ));
+                $.data(this, 'plugin_' + pluginName, new BalancedGallery(this, options));
             }
         });
     };
 
-    function BalancedGallery( element, options ) {
-        balancedGallery = this; // for contexts when 'this' doesn't refer to the BalancedGallery class.
+    function BalancedGallery(element, options) {
+        balancedGallery = this // for contexts when 'this' doesn't refer to the BalancedGallery class.
+		galleries.push(this);
         this.element = element;
         $(this.element).wrapInner('<div class="balanced-gallery-container"></div>');
         this.container = $(this.element).children()[0];
         this.elementChildren = $(this.container).children('img');
-        this.options = $.extend( {}, defaults, options); // merge arg options and defaults
+        this.options = $.extend({}, defaults, options); // merge arg options and defaults
         this.options.orientation = (this.options.orientation).toLowerCase();
 
         if(this.options.autoResize) {
@@ -53,7 +55,12 @@
             clearTimeout(resizeTimeout);
 
             resizeTimeout = setTimeout(function() {
-                balancedGallery.recreate();
+                for(var index = 0; index < galleries.length; index++) {
+					if(galleries[index].options.autoResize) {
+						balancedGallery = galleries[index];
+						galleries[index].recreate();
+					}
+				}
             }, 500);
         });
     }
@@ -62,13 +69,13 @@
         this.options = $.extend({}, this.unadulteratedOptions);
         $(this.element).css(this.unadulteratedCSS); //used to reset width so it's calculated from browser
 
-        balancedGallery.quickResize = true;
-        balancedGallery.init();
-        balancedGallery.createGallery();
+        this.quickResize = true;
+        this.init();
+        this.createGallery();
     };
 
     BalancedGallery.prototype.init = function () {
-        if(balancedGallery.quickResize === false) {
+        if(this.quickResize === false) {
             this.elementChildren.each(function() {
                 $(this).css({display: 'inline-block', padding: 0, margin: 0});
             });
@@ -300,7 +307,7 @@
             for(var q = 1; q < sections; q++) {
                 var results = [];
                 for (var r = 0; r < p; r++) {
-                    results.push([ Math.max( table[r][q - 1], table[p][0]-table[r][0] ), r ]);
+                    results.push([Math.max(table[r][q - 1], table[p][0]-table[r][0]), r]);
                 }
                 var arr = results.sort(subArraySort)[0];
                 table[p][q] = arr[0];
@@ -561,4 +568,4 @@
         return array;
     }
 
-})( jQuery, window, document );
\ No newline at end of file
+}(jQuery, window));
\ No newline at end of file
diff --git a/jquery.balanced-gallery.min.js b/jquery.balanced-gallery.min.js
index ef23998..a18f9d9 100644
--- a/jquery.balanced-gallery.min.js
+++ b/jquery.balanced-gallery.min.js
@@ -1,2 +1 @@
-(function(g,E,M,N){function n(a,d){b=this;this.element=a;g(this.element).wrapInner('<div class="balanced-gallery-container"></div>');this.container=g(this.element).children()[0];this.elementChildren=g(this.container).children("img");this.options=g.extend({},F,d);this.options.orientation=this.options.orientation.toLowerCase();this.options.autoResize&&(this.unadulteratedCSS={width:g(this.element)[0].style.width},this.unadulteratedOptions=g.extend({},this.options),G());this.quickResize=!1;this.init();this.createGallery()}function G(){g(E).resize(function(){clearTimeout(t);t=setTimeout(function(){b.recreate()},500)})}function y(){var a=b.options.padding,d=parseInt(b.options.idealWidth,10)-a,f='<div style="position: relative; display: inline-block; overflow: hidden; width: '+d+"px; height: "+d+"px; margin: 0 "+a+"px "+a+'px 0;"></div>',c=parseInt(b.options.viewportWidth%b.options.widthDivisor/2,10);if(0<c){var a=c+a,h=g(b.container);h.css({paddingLeft:a+"px"});h.width(b.options.viewportWidth-c)}b.elementChildren.each(function(){var a=g(this),c=p(a);1<=c?(a.height(d),a.width(d*c),c=(d*c-d)/2*-1,a.css({left:c+"px",position:"absolute"})):1>c&&(a.width(d),a.height(1/c*d),c=(1/c*d-d)/2*-1,a.css({top:c+"px",position:"absolute"}));b.quickResize?(a=a.parent(),a.width(d),a.height(d)):a.wrap(f)})}function H(){var a=0;b.elementChildren.each(function(){a+=p(g(this))*b.options.idealHeight+b.options.padding});return a}function I(){return b.elementChildren.map(function(){return{element:this,weight:p(g(this))}})}function J(){return b.elementChildren.map(function(){return{element:this,weight:1/p(g(this))}})}function z(a,d){if(b.options.maintainOrder){var f;var c=d;f=a.length;if(0>=c)f=[];else{var h=K(a,c);--f;for(var c=c-2,e=[],k;0<=c;){k=[];for(var m=h[f-1][c]+1;m<f+1;m++)k.push(a[m]);e=[k].concat(e);f=h[f-1][c];--c}c=[];for(h=0;h<f+1;h++)c.push(a[h]);f=[c].concat(e)}return f}f=L(a,d);if(b.options.shuffleUnorderedPartitions){for(e=0;e<f.length;e++)f[e]=A(f[e]);f=A(f)}e=f;g(b.container).html("");for(c=0;c<e.length;c++)for(h=e[c],k=0;k<h.length;k++)g(b.container).append(h[k].element);return f}function K(a,b){for(var d=a.length,c=[],h=0;h<d;h++){for(var e=[],k=0;k<b;k++)e.push(0);c.push(e)}h=[];for(e=0;e<d-1;e++){for(var k=[],g=0;g<b-1;g++)k.push(0);h.push(k)}for(e=0;e<d;e++)c[e][0]=a[e].weight+(0!==e?c[e-1][0]:0);for(e=0;e<b;e++)c[0][e]=a[0].weight;e=function(a,b){return a[0]-b[0]};for(k=1;k<d;k++)for(g=1;g<b;g++){for(var l=[],q=0;q<k;q++)l.push([Math.max(c[q][g-1],c[k][0]-c[q][0]),q]);l=l.sort(e)[0];c[k][g]=l[0];h[k-1][g-1]=l[1]}return h}function L(a,b){for(var d=a.sort(function(a,b){return b.weight-a.weight}),c=Array(b),h=0;h<b;h++)c[h]=[];for(h=0;h<d.length;h++){for(var e=c[0],k=B(e),g=0;g<c.length;g++){var l=B(c[g]);l<k&&(e=c[g],k=l)}e.push(d[h])}return c}function B(a){var b=0;g.each(a,function(a,c){b+=c.weight});return b}function C(){for(var a=b.options.padding,d=0,f=0,c,h=0;h<b.elementChildren.length;h++){h==f&&(c=a*b.resizingValue[d].length,c=(b.options.viewportWidth-c)/b.resizingValue[d].ratio,f+=b.resizingValue[d].length,d++,r=0);var e=b.elementChildren[h],k=parseInt(c,10),g=c*p(e),g=v(g);e.width(g);e.height(k)}}function D(){var a=b.options.padding,d=-1,f=0;r=0;for(var c,h,e=0;e<b.elementChildren.length;e++){e==f&&(d++,b.resizingValue[d].columnHeight=0,c=b.options.viewportWidth/b.summedColRatios*b.resizingValue[d].ratio,c-=a,h=v(c),f+=b.resizingValue[d].length);var g=b.elementChildren[e],m=parseInt(c*(1/p(g)),10);b.resizingValue[d].columnHeight+=m+a;g.width(h);g.height(m)}}function v(a){var b=parseInt(a,10);r+=a-b;.99999<=r&&(b+=1,--r);return b}function x(a){b.options.viewportWidth+b.options.padding!==g(b.element).width()&&(b.options.viewportWidth=g(b.element).width()-b.options.padding,g(b.container).width(b.options.viewportWidth),"horizontal"==a?C():"vertical"==a?D():"grid"==a&&(b.options.idealWidth=b.options.viewportWidth/b.options.widthDivisor,y()))}function p(a){return a[0].naturalWidth/a[0].naturalHeight}function A(a){for(var b=a.length,f,c;b--;)c=Math.random()*b|0,f=a[b],a[b]=a[c],a[c]=f;return a}var b,F={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,widthDivisor:4},t=null,r=0;g.fn.BalancedGallery=function(a){return this.each(function(){g.data(this,"plugin_BalancedGallery")||g.data(this,"plugin_BalancedGallery",new n(this,a))})};n.prototype.recreate=function(){this.options=g.extend({},this.unadulteratedOptions);g(this.element).css(this.unadulteratedCSS);b.quickResize=!0;b.init();b.createGallery()};n.prototype.init=function(){if(!1===b.quickResize){this.elementChildren.each(function(){g(this).css({display:"inline-block",padding:0,margin:0})});var a=this.options.padding+"px";g(this.container).css({fontSize:0,paddingTop:a,paddingLeft:a});null!==this.options.background&&g(this.container).css({background:this.options.background})}this.options.viewportWidth=g(this.element).width()-this.options.padding;null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/this.options.widthDivisor);null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.widthDivisor);g(this.container).width(this.options.viewportWidth)};n.prototype.createGallery=function(){var a=this.options.orientation;if("horizontal"===a){var d;if(b.quickResize)C();else{a=Math.round(H()/b.options.viewportWidth);0<a&&1>a&&(a=1);d=I();a=z(d,a);d=b.options.padding;var f=0;b.resizingValue=[];for(var c=0;c<a.length;c++){for(var h=0,e=0;e<a[c].length;e++)h+=a[c][e].weight;b.resizingValue[c]={ratio:h,length:a[c].length};r=0;h=(b.options.viewportWidth-d*a[c].length)/h;for(e=0;e<a[c].length;e++){var k=g(a[c][e].element);b.elementChildren[f++]=k;var m=parseInt(h,10),l=h*p(k),l=v(l);k.width(l);k.height(m);k.css({margin:0,marginRight:d+"px",marginBottom:d+"px"})}}}x(b.options.orientation)}else if("vertical"===a){if(b.quickResize)D();else{a=Math.round(b.options.viewportWidth/b.options.idealWidth);d=b.elementChildren.length;a=a<=d?a:d;d=J();a=z(d,a);d=g(b.container);d.html("");for(f=0;f<a.length;f++)for(c="balanced-gallery-col"+f,d.append('<div class="balanced-gallery-column" id="'+c+'" style="float: left; padding: 0; margin: 0;"></div>'),c=g(d.find("div#"+c)),h=0;h<a[f].length;h++)c.append(a[f][h].element).append('<br style="display: block;"/>');d.append('<div class="balanced-gallery-clearing" style="clear: both;"></div>');d=b.options.padding;f=[];h=c=0;b.resizingValue=[];for(e=r=0;e<a.length;e++){for(k=f[e]=0;k<a[e].length;k++)f[e]+=a[e][k].weight;f[e]+=d/(b.options.idealWidth-d)*a[e].length;c+=f[e]}b.summedColRatios=c;e=c/a.length;for(k=0;k<a.length;k++){for(var m=e+(e-f[k]),l=b.options.viewportWidth/c*m-d,q=v(l),n=0,w=0;w<a[k].length;w++){var u=g(a[k][w].element);b.elementChildren[h++]=u;var t=Math.round(l*(1/p(u))),n=n+(t+d);u.width(q);u.height(t);u.css({margin:0,marginRight:d+"px",marginBottom:d+"px"})}b.resizingValue[k]={ratio:m,length:a[k].length,columnHeight:n}}}x(b.options.orientation);for(f=d=a=0;f<b.resizingValue.length;f++)a+=b.resizingValue[f].columnHeight;a=Math.round(a/b.resizingValue.length);for(f=0;f<b.resizingValue.length;f++)for(d+=b.resizingValue[f].length,c=Math.sign(a-b.resizingValue[f].columnHeight),h=d-1;a!=b.resizingValue[f].columnHeight;)b.elementChildren[h].height(b.elementChildren[h].height()+
-c),b.resizingValue[f].columnHeight+=c,h--,h<d-b.resizingValue[f].length&&(h=d-1)}else if("grid"===a)y(),x(a);else throw"BalancedGallery: Invalid Orientation.";}})(jQuery,window,document);
\ No newline at end of file
+(function(g,E,M){function p(a,d){b=this;n.push(this);this.element=a;g(this.element).wrapInner('<div class="balanced-gallery-container"></div>');this.container=g(this.element).children()[0];this.elementChildren=g(this.container).children("img");this.options=g.extend({},F,d);this.options.orientation=this.options.orientation.toLowerCase();this.options.autoResize&&(this.unadulteratedCSS={width:g(this.element)[0].style.width},this.unadulteratedOptions=g.extend({},this.options),G());this.quickResize=!1;this.init();this.createGallery()}function G(){g(E).resize(function(){clearTimeout(u);u=setTimeout(function(){for(var a=0;a<n.length;a++)n[a].options.autoResize&&(b=n[a],n[a].recreate())},500)})}function y(){var a=b.options.padding,d=parseInt(b.options.idealWidth,10)-a,f='<div style="position: relative; display: inline-block; overflow: hidden; width: '+d+"px; height: "+d+"px; margin: 0 "+a+"px "+a+'px 0;"></div>',c=parseInt(b.options.viewportWidth%b.options.widthDivisor/2,10);if(0<c){var a=c+a,h=g(b.container);h.css({paddingLeft:a+"px"});h.width(b.options.viewportWidth-c)}b.elementChildren.each(function(){var a=g(this),c=q(a);1<=c?(a.height(d),a.width(d*c),c=(d*c-d)/2*-1,a.css({left:c+"px",position:"absolute"})):1>c&&(a.width(d),a.height(1/c*d),c=(1/c*d-d)/2*-1,a.css({top:c+"px",position:"absolute"}));b.quickResize?(a=a.parent(),a.width(d),a.height(d)):a.wrap(f)})}function H(){var a=0;b.elementChildren.each(function(){a+=q(g(this))*b.options.idealHeight+b.options.padding});return a}function I(){return b.elementChildren.map(function(){return{element:this,weight:q(g(this))}})}function J(){return b.elementChildren.map(function(){return{element:this,weight:1/q(g(this))}})}function z(a,d){if(b.options.maintainOrder){var f;var c=d;f=a.length;if(0>=c)f=[];else{var h=K(a,c);--f;for(var c=c-2,e=[],k;0<=c;){k=[];for(var m=h[f-1][c]+1;m<f+1;m++)k.push(a[m]);e=[k].concat(e);f=h[f-1][c];--c}c=[];for(h=0;h<f+1;h++)c.push(a[h]);f=[c].concat(e)}return f}f=L(a,d);if(b.options.shuffleUnorderedPartitions){for(e=0;e<f.length;e++)f[e]=A(f[e]);f=A(f)}e=f;g(b.container).html("");for(c=0;c<e.length;c++)for(h=e[c],k=0;k<h.length;k++)g(b.container).append(h[k].element);return f}function K(a,b){for(var d=a.length,c=[],h=0;h<d;h++){for(var e=[],k=0;k<b;k++)e.push(0);c.push(e)}h=[];for(e=0;e<d-1;e++){for(var k=[],g=0;g<b-1;g++)k.push(0);h.push(k)}for(e=0;e<d;e++)c[e][0]=a[e].weight+(0!==e?c[e-1][0]:0);for(e=0;e<b;e++)c[0][e]=a[0].weight;e=function(a,c){return a[0]-c[0]};for(k=1;k<d;k++)for(g=1;g<b;g++){for(var l=[],r=0;r<k;r++)l.push([Math.max(c[r][g-1],c[k][0]-c[r][0]),r]);l=l.sort(e)[0];c[k][g]=l[0];h[k-1][g-1]=l[1]}return h}function L(a,b){for(var d=a.sort(function(a,b){return b.weight-a.weight}),c=Array(b),h=0;h<b;h++)c[h]=[];for(h=0;h<d.length;h++){for(var e=c[0],k=B(e),g=0;g<c.length;g++){var l=B(c[g]);l<k&&(e=c[g],k=l)}e.push(d[h])}return c}function B(a){var b=0;g.each(a,function(a,c){b+=c.weight});return b}function C(){for(var a=b.options.padding,d=0,f=0,c,h=0;h<b.elementChildren.length;h++){h==f&&(c=a*b.resizingValue[d].length,c=(b.options.viewportWidth-c)/b.resizingValue[d].ratio,f+=b.resizingValue[d].length,d++,t=0);var e=b.elementChildren[h],k=parseInt(c,10),g=c*q(e),g=w(g);e.width(g);e.height(k)}}function D(){var a=b.options.padding,d=-1,f=0;t=0;for(var c,h,e=0;e<b.elementChildren.length;e++){e==f&&(d++,b.resizingValue[d].columnHeight=0,c=b.options.viewportWidth/b.summedColRatios*b.resizingValue[d].ratio,c-=a,h=w(c),f+=b.resizingValue[d].length);var g=b.elementChildren[e],m=parseInt(c*(1/q(g)),10);b.resizingValue[d].columnHeight+=m+a;g.width(h);g.height(m)}}function w(a){var b=parseInt(a,10);t+=a-b;.99999<=t&&(b+=1,--t);return b}function x(a){b.options.viewportWidth+b.options.padding!==g(b.element).width()&&(b.options.viewportWidth=g(b.element).width()-b.options.padding,g(b.container).width(b.options.viewportWidth),"horizontal"==a?C():"vertical"==a?D():"grid"==a&&(b.options.idealWidth=b.options.viewportWidth/b.options.widthDivisor,y()))}function q(a){return a[0].naturalWidth/a[0].naturalHeight}function A(a){for(var b=a.length,f,c;b--;)c=Math.random()*b|0,f=a[b],a[b]=a[c],a[c]=f;return a}var n=[],b,F={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,widthDivisor:4},u=null,t=0;g.fn.BalancedGallery=function(a){return this.each(function(){g.data(this,"plugin_BalancedGallery")||g.data(this,"plugin_BalancedGallery",new p(this,a))})};p.prototype.recreate=function(){this.options=g.extend({},this.unadulteratedOptions);g(this.element).css(this.unadulteratedCSS);this.quickResize=!0;this.init();this.createGallery()};p.prototype.init=function(){if(!1===this.quickResize){this.elementChildren.each(function(){g(this).css({display:"inline-block",padding:0,margin:0})});var a=this.options.padding+"px";g(this.container).css({fontSize:0,paddingTop:a,paddingLeft:a});null!==this.options.background&&g(this.container).css({background:this.options.background})}this.options.viewportWidth=g(this.element).width()-this.options.padding;null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/this.options.widthDivisor);null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.widthDivisor);g(this.container).width(this.options.viewportWidth)};p.prototype.createGallery=function(){var a=this.options.orientation;if("horizontal"===a){var d;if(b.quickResize)C();else{a=Math.round(H()/b.options.viewportWidth);0<a&&1>a&&(a=1);d=I();a=z(d,a);d=b.options.padding;var f=0;b.resizingValue=[];for(var c=0;c<a.length;c++){for(var h=0,e=0;e<a[c].length;e++)h+=a[c][e].weight;b.resizingValue[c]={ratio:h,length:a[c].length};t=0;h=(b.options.viewportWidth-d*a[c].length)/h;for(e=0;e<a[c].length;e++){var k=g(a[c][e].element);b.elementChildren[f++]=k;var m=parseInt(h,10),l=h*q(k),l=w(l);k.width(l);k.height(m);k.css({margin:0,marginRight:d+"px",marginBottom:d+"px"})}}}x(b.options.orientation)}else if("vertical"===a){if(b.quickResize)D();else{a=Math.round(b.options.viewportWidth/b.options.idealWidth);d=b.elementChildren.length;a=a<=d?a:d;d=J();a=z(d,a);d=g(b.container);d.html("");for(f=0;f<a.length;f++)for(c="balanced-gallery-col"+f,d.append('<div class="balanced-gallery-column" id="'+c+'" style="float: left; padding: 0; margin: 0;"></div>'),c=g(d.find("div#"+c)),h=0;h<a[f].length;h++)c.append(a[f][h].element).append('<br style="display: block;"/>');d.append('<div class="balanced-gallery-clearing" style="clear: both;"></div>');d=b.options.padding;f=[];h=c=0;b.resizingValue=[];for(e=t=0;e<a.length;e++){for(k=f[e]=0;k<a[e].length;k++)f[e]+=a[e][k].weight;f[e]+=d/(b.options.idealWidth-d)*a[e].length;c+=f[e]}b.summedColRatios=c;e=c/a.length;for(k=0;k<a.length;k++){for(var m=e+(e-f[k]),l=b.options.viewportWidth/c*m-d,r=w(l),n=0,p=0;p<a[k].length;p++){var v=g(a[k][p].element);b.elementChildren[h++]=v;var u=Math.round(l*(1/q(v))),n=n+(u+d);v.width(r);v.height(u);v.css({margin:0,marginRight:d+"px",marginBottom:d+"px"})}b.resizingValue[k]={ratio:m,length:a[k].length,columnHeight:n}}}x(b.options.orientation);for(f=d=a=0;f<b.resizingValue.length;f++)a+=b.resizingValue[f].columnHeight;a=Math.round(a/b.resizingValue.length);for(f=0;f<b.resizingValue.length;f++)for(d+=b.resizingValue[f].length,c=Math.sign(a-b.resizingValue[f].columnHeight),h=d-1;a!=b.resizingValue[f].columnHeight;)b.elementChildren[h].height(b.elementChildren[h].height()+c),b.resizingValue[f].columnHeight+=c,h--,h<d-b.resizingValue[f].length&&(h=d-1)}else if("grid"===a)y(),x(a);else throw"BalancedGallery: Invalid Orientation.";}})(jQuery,window);
\ No newline at end of file

From cabf1e17d281611abadbe74cff0e0cd680e17c69 Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Tue, 14 Mar 2017 01:07:04 +0100
Subject: [PATCH 12/24] Added option for grid galleries for different aspect
 ratios

---
 README.md                      |  1 +
 jquery.balanced-gallery.js     | 32 +++++++++++++++++---------------
 jquery.balanced-gallery.min.js |  2 +-
 3 files changed, 19 insertions(+), 16 deletions(-)

diff --git a/README.md b/README.md
index 794c421..7065a11 100644
--- a/README.md
+++ b/README.md
@@ -37,6 +37,7 @@ var defaults = {
             orientation: 'horizontal',          // 'horizontal' galleries are made of rows; 'vertical' galleries are made of columns; 'grid' galleries combine both
             padding: 5,                         // pixels between images
             shuffleUnorderedPartitions: true,   // unordered galleries tend to clump larger images at the beginning, this solves that issue at a slight performance cost
+			gridAspectRatio: 1,					// the aspect ratio with which the images are going to be displayed; only used for grid galleries
             widthDivisor: 4						// used to define idealHeight/idealWidth (when they aren't set) by dividing the elements container width by the given value;
 												// the bigger the widthDivisor value, the smaller the images get; on vertical galleries the value simply defines the number of columns
         };
diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index c7d7ae1..6bf1453 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -13,6 +13,7 @@
             orientation: 'horizontal',
             padding: 5,
             shuffleUnorderedPartitions: true,
+			gridAspectRatio: 1,
             widthDivisor: 4
         },
         resizeTimeout = null,
@@ -146,8 +147,10 @@
 	
 	function createGridGallery() {
 		var padding = balancedGallery.options.padding;
-		var quadratLength = parseInt(balancedGallery.options.idealWidth, RADIX) - padding;
-		var wrapper = '<div style="position: relative; display: inline-block; overflow: hidden; width: '+quadratLength+'px; height: '+quadratLength+'px; margin: 0 '+padding+'px '+padding+'px 0;"></div>';
+		var cellRatio = balancedGallery.options.gridAspectRatio;
+		var cellWidth = parseInt(balancedGallery.options.idealWidth - padding, RADIX);
+		var cellHeight = cellWidth * (1 / cellRatio);
+		var wrapper = '<div style="position: relative; display: inline-block; overflow: hidden; width: '+cellWidth+'px; height: '+cellHeight+'px; margin: 0 '+padding+'px '+padding+'px 0;"></div>';
 		var paddingGap = parseInt(((balancedGallery.options.viewportWidth % balancedGallery.options.widthDivisor) / 2), RADIX);
 		
 		//if necessary, increase the padding on the left side of the container so the grid is more centered
@@ -160,25 +163,25 @@
 
 		balancedGallery.elementChildren.each(function(){
 			var $image = $(this);
-			var ratio = aspectRatio($image);
+			var imgRatio = aspectRatio($image);
 			var offset = 0;
 		  
-			if(ratio >= 1) {
-				$image.height(quadratLength);
-				$image.width(quadratLength * ratio);
-				offset = (((quadratLength * ratio) - quadratLength) / 2) * -1;
+			if(imgRatio >= cellRatio) {
+				$image.height(cellHeight);
+				$image.width(cellHeight * imgRatio);
+				offset = (cellWidth - (cellHeight * imgRatio)) / 2;
 				$image.css({left: offset+'px', position: 'absolute'});
-			} else if(ratio < 1) {
-				$image.width(quadratLength);
-				$image.height(quadratLength * (1/ratio));
-				offset = (((quadratLength * (1/ratio)) - quadratLength) / 2) * -1;
+			} else if(imgRatio < cellRatio) {
+				$image.width(cellWidth);
+				$image.height(cellWidth * (1/imgRatio));
+				offset = (cellHeight - (cellWidth * (1/imgRatio))) / 2;
 				$image.css({top: offset+'px', position: 'absolute'});
 			}
 			
 			if(balancedGallery.quickResize) {
 				var $div = $image.parent();
-				$div.width(quadratLength);
-				$div.height(quadratLength);
+				$div.width(cellWidth);
+				$div.height(cellHeight);
 			} else {
 				$image.wrap(wrapper);
 			}
@@ -324,7 +327,6 @@
         var partitions = new Array(sections);
         for (var i=0; i < sections; i++) { partitions[i] = []; }
 
-
         for(var j = 0; j < sortedWeights.length; j++) {
             var shortestPartition = partitions[0];
             var shortestPartitionWeight = getPartitionWeight(shortestPartition);
@@ -338,7 +340,7 @@
             }
             shortestPartition.push(sortedWeights[j]);
         }
-
+		
         return partitions;
     }
 
diff --git a/jquery.balanced-gallery.min.js b/jquery.balanced-gallery.min.js
index a18f9d9..9615521 100644
--- a/jquery.balanced-gallery.min.js
+++ b/jquery.balanced-gallery.min.js
@@ -1 +1 @@
-(function(g,E,M){function p(a,d){b=this;n.push(this);this.element=a;g(this.element).wrapInner('<div class="balanced-gallery-container"></div>');this.container=g(this.element).children()[0];this.elementChildren=g(this.container).children("img");this.options=g.extend({},F,d);this.options.orientation=this.options.orientation.toLowerCase();this.options.autoResize&&(this.unadulteratedCSS={width:g(this.element)[0].style.width},this.unadulteratedOptions=g.extend({},this.options),G());this.quickResize=!1;this.init();this.createGallery()}function G(){g(E).resize(function(){clearTimeout(u);u=setTimeout(function(){for(var a=0;a<n.length;a++)n[a].options.autoResize&&(b=n[a],n[a].recreate())},500)})}function y(){var a=b.options.padding,d=parseInt(b.options.idealWidth,10)-a,f='<div style="position: relative; display: inline-block; overflow: hidden; width: '+d+"px; height: "+d+"px; margin: 0 "+a+"px "+a+'px 0;"></div>',c=parseInt(b.options.viewportWidth%b.options.widthDivisor/2,10);if(0<c){var a=c+a,h=g(b.container);h.css({paddingLeft:a+"px"});h.width(b.options.viewportWidth-c)}b.elementChildren.each(function(){var a=g(this),c=q(a);1<=c?(a.height(d),a.width(d*c),c=(d*c-d)/2*-1,a.css({left:c+"px",position:"absolute"})):1>c&&(a.width(d),a.height(1/c*d),c=(1/c*d-d)/2*-1,a.css({top:c+"px",position:"absolute"}));b.quickResize?(a=a.parent(),a.width(d),a.height(d)):a.wrap(f)})}function H(){var a=0;b.elementChildren.each(function(){a+=q(g(this))*b.options.idealHeight+b.options.padding});return a}function I(){return b.elementChildren.map(function(){return{element:this,weight:q(g(this))}})}function J(){return b.elementChildren.map(function(){return{element:this,weight:1/q(g(this))}})}function z(a,d){if(b.options.maintainOrder){var f;var c=d;f=a.length;if(0>=c)f=[];else{var h=K(a,c);--f;for(var c=c-2,e=[],k;0<=c;){k=[];for(var m=h[f-1][c]+1;m<f+1;m++)k.push(a[m]);e=[k].concat(e);f=h[f-1][c];--c}c=[];for(h=0;h<f+1;h++)c.push(a[h]);f=[c].concat(e)}return f}f=L(a,d);if(b.options.shuffleUnorderedPartitions){for(e=0;e<f.length;e++)f[e]=A(f[e]);f=A(f)}e=f;g(b.container).html("");for(c=0;c<e.length;c++)for(h=e[c],k=0;k<h.length;k++)g(b.container).append(h[k].element);return f}function K(a,b){for(var d=a.length,c=[],h=0;h<d;h++){for(var e=[],k=0;k<b;k++)e.push(0);c.push(e)}h=[];for(e=0;e<d-1;e++){for(var k=[],g=0;g<b-1;g++)k.push(0);h.push(k)}for(e=0;e<d;e++)c[e][0]=a[e].weight+(0!==e?c[e-1][0]:0);for(e=0;e<b;e++)c[0][e]=a[0].weight;e=function(a,c){return a[0]-c[0]};for(k=1;k<d;k++)for(g=1;g<b;g++){for(var l=[],r=0;r<k;r++)l.push([Math.max(c[r][g-1],c[k][0]-c[r][0]),r]);l=l.sort(e)[0];c[k][g]=l[0];h[k-1][g-1]=l[1]}return h}function L(a,b){for(var d=a.sort(function(a,b){return b.weight-a.weight}),c=Array(b),h=0;h<b;h++)c[h]=[];for(h=0;h<d.length;h++){for(var e=c[0],k=B(e),g=0;g<c.length;g++){var l=B(c[g]);l<k&&(e=c[g],k=l)}e.push(d[h])}return c}function B(a){var b=0;g.each(a,function(a,c){b+=c.weight});return b}function C(){for(var a=b.options.padding,d=0,f=0,c,h=0;h<b.elementChildren.length;h++){h==f&&(c=a*b.resizingValue[d].length,c=(b.options.viewportWidth-c)/b.resizingValue[d].ratio,f+=b.resizingValue[d].length,d++,t=0);var e=b.elementChildren[h],k=parseInt(c,10),g=c*q(e),g=w(g);e.width(g);e.height(k)}}function D(){var a=b.options.padding,d=-1,f=0;t=0;for(var c,h,e=0;e<b.elementChildren.length;e++){e==f&&(d++,b.resizingValue[d].columnHeight=0,c=b.options.viewportWidth/b.summedColRatios*b.resizingValue[d].ratio,c-=a,h=w(c),f+=b.resizingValue[d].length);var g=b.elementChildren[e],m=parseInt(c*(1/q(g)),10);b.resizingValue[d].columnHeight+=m+a;g.width(h);g.height(m)}}function w(a){var b=parseInt(a,10);t+=a-b;.99999<=t&&(b+=1,--t);return b}function x(a){b.options.viewportWidth+b.options.padding!==g(b.element).width()&&(b.options.viewportWidth=g(b.element).width()-b.options.padding,g(b.container).width(b.options.viewportWidth),"horizontal"==a?C():"vertical"==a?D():"grid"==a&&(b.options.idealWidth=b.options.viewportWidth/b.options.widthDivisor,y()))}function q(a){return a[0].naturalWidth/a[0].naturalHeight}function A(a){for(var b=a.length,f,c;b--;)c=Math.random()*b|0,f=a[b],a[b]=a[c],a[c]=f;return a}var n=[],b,F={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,widthDivisor:4},u=null,t=0;g.fn.BalancedGallery=function(a){return this.each(function(){g.data(this,"plugin_BalancedGallery")||g.data(this,"plugin_BalancedGallery",new p(this,a))})};p.prototype.recreate=function(){this.options=g.extend({},this.unadulteratedOptions);g(this.element).css(this.unadulteratedCSS);this.quickResize=!0;this.init();this.createGallery()};p.prototype.init=function(){if(!1===this.quickResize){this.elementChildren.each(function(){g(this).css({display:"inline-block",padding:0,margin:0})});var a=this.options.padding+"px";g(this.container).css({fontSize:0,paddingTop:a,paddingLeft:a});null!==this.options.background&&g(this.container).css({background:this.options.background})}this.options.viewportWidth=g(this.element).width()-this.options.padding;null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/this.options.widthDivisor);null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.widthDivisor);g(this.container).width(this.options.viewportWidth)};p.prototype.createGallery=function(){var a=this.options.orientation;if("horizontal"===a){var d;if(b.quickResize)C();else{a=Math.round(H()/b.options.viewportWidth);0<a&&1>a&&(a=1);d=I();a=z(d,a);d=b.options.padding;var f=0;b.resizingValue=[];for(var c=0;c<a.length;c++){for(var h=0,e=0;e<a[c].length;e++)h+=a[c][e].weight;b.resizingValue[c]={ratio:h,length:a[c].length};t=0;h=(b.options.viewportWidth-d*a[c].length)/h;for(e=0;e<a[c].length;e++){var k=g(a[c][e].element);b.elementChildren[f++]=k;var m=parseInt(h,10),l=h*q(k),l=w(l);k.width(l);k.height(m);k.css({margin:0,marginRight:d+"px",marginBottom:d+"px"})}}}x(b.options.orientation)}else if("vertical"===a){if(b.quickResize)D();else{a=Math.round(b.options.viewportWidth/b.options.idealWidth);d=b.elementChildren.length;a=a<=d?a:d;d=J();a=z(d,a);d=g(b.container);d.html("");for(f=0;f<a.length;f++)for(c="balanced-gallery-col"+f,d.append('<div class="balanced-gallery-column" id="'+c+'" style="float: left; padding: 0; margin: 0;"></div>'),c=g(d.find("div#"+c)),h=0;h<a[f].length;h++)c.append(a[f][h].element).append('<br style="display: block;"/>');d.append('<div class="balanced-gallery-clearing" style="clear: both;"></div>');d=b.options.padding;f=[];h=c=0;b.resizingValue=[];for(e=t=0;e<a.length;e++){for(k=f[e]=0;k<a[e].length;k++)f[e]+=a[e][k].weight;f[e]+=d/(b.options.idealWidth-d)*a[e].length;c+=f[e]}b.summedColRatios=c;e=c/a.length;for(k=0;k<a.length;k++){for(var m=e+(e-f[k]),l=b.options.viewportWidth/c*m-d,r=w(l),n=0,p=0;p<a[k].length;p++){var v=g(a[k][p].element);b.elementChildren[h++]=v;var u=Math.round(l*(1/q(v))),n=n+(u+d);v.width(r);v.height(u);v.css({margin:0,marginRight:d+"px",marginBottom:d+"px"})}b.resizingValue[k]={ratio:m,length:a[k].length,columnHeight:n}}}x(b.options.orientation);for(f=d=a=0;f<b.resizingValue.length;f++)a+=b.resizingValue[f].columnHeight;a=Math.round(a/b.resizingValue.length);for(f=0;f<b.resizingValue.length;f++)for(d+=b.resizingValue[f].length,c=Math.sign(a-b.resizingValue[f].columnHeight),h=d-1;a!=b.resizingValue[f].columnHeight;)b.elementChildren[h].height(b.elementChildren[h].height()+c),b.resizingValue[f].columnHeight+=c,h--,h<d-b.resizingValue[f].length&&(h=d-1)}else if("grid"===a)y(),x(a);else throw"BalancedGallery: Invalid Orientation.";}})(jQuery,window);
\ No newline at end of file
+(function(g,E,M){function p(a,f){b=this;n.push(this);this.element=a;g(this.element).wrapInner('<div class="balanced-gallery-container"></div>');this.container=g(this.element).children()[0];this.elementChildren=g(this.container).children("img");this.options=g.extend({},F,f);this.options.orientation=this.options.orientation.toLowerCase();this.options.autoResize&&(this.unadulteratedCSS={width:g(this.element)[0].style.width},this.unadulteratedOptions=g.extend({},this.options),G());this.quickResize=!1;this.init();this.createGallery()}function G(){g(E).resize(function(){clearTimeout(u);u=setTimeout(function(){for(var a=0;a<n.length;a++)n[a].options.autoResize&&(b=n[a],n[a].recreate())},500)})}function y(){var a=b.options.padding,f=b.options.gridAspectRatio,e=parseInt(b.options.idealWidth-a,10),d=1/f*e,k='<div style="position: relative; display: inline-block; overflow: hidden; width: '+e+"px; height: "+d+"px; margin: 0 "+a+"px "+a+'px 0;"></div>',c=parseInt(b.options.viewportWidth%b.options.widthDivisor/2,10);if(0<c){var a=c+a,h=g(b.container);h.css({paddingLeft:a+"px"});h.width(b.options.viewportWidth-c)}b.elementChildren.each(function(){var a=g(this),c=q(a);c>=f?(a.height(d),a.width(d*c),c=(e-d*c)/2,a.css({left:c+"px",position:"absolute"})):c<f&&(a.width(e),a.height(1/c*e),c=(d-1/c*e)/2,a.css({top:c+"px",position:"absolute"}));b.quickResize?(a=a.parent(),a.width(e),a.height(d)):a.wrap(k)})}function H(){var a=0;b.elementChildren.each(function(){a+=q(g(this))*b.options.idealHeight+b.options.padding});return a}function I(){return b.elementChildren.map(function(){return{element:this,weight:q(g(this))}})}function J(){return b.elementChildren.map(function(){return{element:this,weight:1/q(g(this))}})}function z(a,f){if(b.options.maintainOrder){var e;var d=f;e=a.length;if(0>=d)e=[];else{var k=K(a,d);--e;for(var d=d-2,c=[],h;0<=d;){h=[];for(var l=k[e-1][d]+1;l<e+1;l++)h.push(a[l]);c=[h].concat(c);e=k[e-1][d];--d}d=[];for(k=0;k<e+1;k++)d.push(a[k]);e=[d].concat(c)}return e}e=L(a,f);if(b.options.shuffleUnorderedPartitions){for(c=0;c<e.length;c++)e[c]=A(e[c]);e=A(e)}c=e;g(b.container).html("");for(d=0;d<c.length;d++)for(k=c[d],h=0;h<k.length;h++)g(b.container).append(k[h].element);return e}function K(a,b){for(var e=a.length,d=[],f=0;f<e;f++){for(var c=[],h=0;h<b;h++)c.push(0);d.push(c)}f=[];for(c=0;c<e-1;c++){for(var h=[],g=0;g<b-1;g++)h.push(0);f.push(h)}for(c=0;c<e;c++)d[c][0]=a[c].weight+(0!==c?d[c-1][0]:0);for(c=0;c<b;c++)d[0][c]=a[0].weight;c=function(a,b){return a[0]-b[0]};for(h=1;h<e;h++)for(g=1;g<b;g++){for(var m=[],r=0;r<h;r++)m.push([Math.max(d[r][g-1],d[h][0]-d[r][0]),r]);m=m.sort(c)[0];d[h][g]=m[0];f[h-1][g-1]=m[1]}return f}function L(a,b){for(var e=a.sort(function(a,b){return b.weight-a.weight}),d=Array(b),f=0;f<b;f++)d[f]=[];for(f=0;f<e.length;f++){for(var c=d[0],h=B(c),g=0;g<d.length;g++){var m=B(d[g]);m<h&&(c=d[g],h=m)}c.push(e[f])}return d}function B(a){var b=0;g.each(a,function(a,d){b+=d.weight});return b}function C(){for(var a=b.options.padding,f=0,e=0,d,g=0;g<b.elementChildren.length;g++){g==e&&(d=a*b.resizingValue[f].length,d=(b.options.viewportWidth-d)/b.resizingValue[f].ratio,e+=b.resizingValue[f].length,f++,t=0);var c=b.elementChildren[g],h=parseInt(d,10),l=d*q(c),l=w(l);c.width(l);c.height(h)}}function D(){var a=b.options.padding,f=-1,e=0;t=0;for(var d,g,c=0;c<b.elementChildren.length;c++){c==e&&(f++,b.resizingValue[f].columnHeight=0,d=b.options.viewportWidth/b.summedColRatios*b.resizingValue[f].ratio,d-=a,g=w(d),e+=b.resizingValue[f].length);var h=b.elementChildren[c],l=parseInt(d*(1/q(h)),10);b.resizingValue[f].columnHeight+=l+a;h.width(g);h.height(l)}}function w(a){var b=parseInt(a,10);t+=a-b;.99999<=t&&(b+=1,--t);return b}function x(a){b.options.viewportWidth+b.options.padding!==g(b.element).width()&&(b.options.viewportWidth=g(b.element).width()-b.options.padding,g(b.container).width(b.options.viewportWidth),"horizontal"==a?C():"vertical"==a?D():"grid"==a&&(b.options.idealWidth=b.options.viewportWidth/b.options.widthDivisor,y()))}function q(a){return a[0].naturalWidth/a[0].naturalHeight}function A(a){for(var b=a.length,e,d;b--;)d=Math.random()*b|0,e=a[b],a[b]=a[d],a[d]=e;return a}var n=[],b,F={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,gridAspectRatio:1,widthDivisor:4},u=null,t=0;g.fn.BalancedGallery=function(a){return this.each(function(){g.data(this,"plugin_BalancedGallery")||g.data(this,"plugin_BalancedGallery",new p(this,a))})};p.prototype.recreate=function(){this.options=g.extend({},this.unadulteratedOptions);g(this.element).css(this.unadulteratedCSS);this.quickResize=!0;this.init();this.createGallery()};p.prototype.init=function(){if(!1===this.quickResize){this.elementChildren.each(function(){g(this).css({display:"inline-block",padding:0,margin:0})});var a=this.options.padding+"px";g(this.container).css({fontSize:0,paddingTop:a,paddingLeft:a});null!==this.options.background&&g(this.container).css({background:this.options.background})}this.options.viewportWidth=g(this.element).width()-this.options.padding;null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/this.options.widthDivisor);null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.widthDivisor);g(this.container).width(this.options.viewportWidth)};p.prototype.createGallery=function(){var a=this.options.orientation;if("horizontal"===a){var f;if(b.quickResize)C();else{a=Math.round(H()/b.options.viewportWidth);0<a&&1>a&&(a=1);f=I();a=z(f,a);f=b.options.padding;var e=0;b.resizingValue=[];for(var d=0;d<a.length;d++){for(var k=0,c=0;c<a[d].length;c++)k+=a[d][c].weight;b.resizingValue[d]={ratio:k,length:a[d].length};t=0;k=(b.options.viewportWidth-f*a[d].length)/k;for(c=0;c<a[d].length;c++){var h=g(a[d][c].element);b.elementChildren[e++]=h;var l=parseInt(k,10),m=k*q(h),m=w(m);h.width(m);h.height(l);h.css({margin:0,marginRight:f+"px",marginBottom:f+"px"})}}}x(b.options.orientation)}else if("vertical"===a){if(b.quickResize)D();else{a=Math.round(b.options.viewportWidth/b.options.idealWidth);f=b.elementChildren.length;a=a<=f?a:f;f=J();a=z(f,a);f=g(b.container);f.html("");for(e=0;e<a.length;e++)for(d="balanced-gallery-col"+e,f.append('<div class="balanced-gallery-column" id="'+d+'" style="float: left; padding: 0; margin: 0;"></div>'),d=g(f.find("div#"+d)),k=0;k<a[e].length;k++)d.append(a[e][k].element).append('<br style="display: block;"/>');f.append('<div class="balanced-gallery-clearing" style="clear: both;"></div>');f=b.options.padding;e=[];k=d=0;b.resizingValue=[];for(c=t=0;c<a.length;c++){for(h=e[c]=0;h<a[c].length;h++)e[c]+=a[c][h].weight;e[c]+=f/(b.options.idealWidth-f)*a[c].length;d+=e[c]}b.summedColRatios=d;c=d/a.length;for(h=0;h<a.length;h++){for(var l=c+(c-e[h]),m=b.options.viewportWidth/d*l-f,r=w(m),n=0,p=0;p<a[h].length;p++){var v=g(a[h][p].element);b.elementChildren[k++]=v;var u=Math.round(m*(1/q(v))),n=n+(u+f);v.width(r);v.height(u);v.css({margin:0,marginRight:f+"px",marginBottom:f+"px"})}b.resizingValue[h]={ratio:l,length:a[h].length,columnHeight:n}}}x(b.options.orientation);for(e=f=a=0;e<b.resizingValue.length;e++)a+=b.resizingValue[e].columnHeight;a=Math.round(a/b.resizingValue.length);for(e=0;e<b.resizingValue.length;e++)for(f+=b.resizingValue[e].length,d=Math.sign(a-b.resizingValue[e].columnHeight),k=f-1;a!=b.resizingValue[e].columnHeight;)b.elementChildren[k].height(b.elementChildren[k].height()+d),b.resizingValue[e].columnHeight+=d,k--,k<f-b.resizingValue[e].length&&(k=f-1)}else if("grid"===a)y(),x(a);else throw"BalancedGallery: Invalid Orientation.";}})(jQuery,window);
\ No newline at end of file

From b6b043db5bb13de96c5ea703cd20b4cac2b848bf Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Tue, 21 Mar 2017 15:39:48 +0100
Subject: [PATCH 13/24] Refactoring

---
 jquery.balanced-gallery.js     | 78 +++++++++++++++++-----------------
 jquery.balanced-gallery.min.js | 16 ++++++-
 2 files changed, 54 insertions(+), 40 deletions(-)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index 6bf1453..5ee49d2 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -30,18 +30,18 @@
         });
     };
 
-    function BalancedGallery(element, options) {
+    function BalancedGallery(container, options) {
         balancedGallery = this // for contexts when 'this' doesn't refer to the BalancedGallery class.
 		galleries.push(this);
-        this.element = element;
-        $(this.element).wrapInner('<div class="balanced-gallery-container"></div>');
-        this.container = $(this.element).children()[0];
-        this.elementChildren = $(this.container).children('img');
+        this.container = container;
+        $(this.container).wrapInner('<div class="balanced-gallery-wrapper"></div>');
+        this.wrapper = $(this.container).children()[0];
+        this.elements = $(this.wrapper).children('img');
         this.options = $.extend({}, defaults, options); // merge arg options and defaults
         this.options.orientation = (this.options.orientation).toLowerCase();
 
         if(this.options.autoResize) {
-            this.unadulteratedCSS = {width: $(this.element)[0].style.width};
+            this.unadulteratedCSS = {width: $(this.container)[0].style.width};
             this.unadulteratedOptions = $.extend({}, this.options);
             setupAutoResize();
         }
@@ -68,7 +68,7 @@
 
     BalancedGallery.prototype.recreate = function () {
         this.options = $.extend({}, this.unadulteratedOptions);
-        $(this.element).css(this.unadulteratedCSS); //used to reset width so it's calculated from browser
+        $(this.container).css(this.unadulteratedCSS); //used to reset width so it's calculated from browser
 
         this.quickResize = true;
         this.init();
@@ -77,19 +77,19 @@
 
     BalancedGallery.prototype.init = function () {
         if(this.quickResize === false) {
-            this.elementChildren.each(function() {
+            this.elements.each(function() {
                 $(this).css({display: 'inline-block', padding: 0, margin: 0});
             });
 
             var padding = this.options.padding + 'px';
-            $(this.container).css({fontSize: 0, paddingTop: padding, paddingLeft: padding});
+            $(this.wrapper).css({fontSize: 0, paddingTop: padding, paddingLeft: padding});
 
             if(this.options.background !== null) {
-                $(this.container).css({background: this.options.background});
+                $(this.wrapper).css({background: this.options.background});
             }
         }
 
-        this.options.viewportWidth = $(this.element).width() - this.options.padding;
+        this.options.viewportWidth = $(this.container).width() - this.options.padding;
 
         if(this.options.idealWidth === null) {
             this.options.idealWidth = this.options.viewportWidth / this.options.widthDivisor;
@@ -100,7 +100,7 @@
         }
 
         //setting explicit width prevents image wrapping on resizing
-        $(this.container).width(this.options.viewportWidth);
+        $(this.wrapper).width(this.options.viewportWidth);
     };
 
     BalancedGallery.prototype.createGallery = function() {
@@ -153,15 +153,15 @@
 		var wrapper = '<div style="position: relative; display: inline-block; overflow: hidden; width: '+cellWidth+'px; height: '+cellHeight+'px; margin: 0 '+padding+'px '+padding+'px 0;"></div>';
 		var paddingGap = parseInt(((balancedGallery.options.viewportWidth % balancedGallery.options.widthDivisor) / 2), RADIX);
 		
-		//if necessary, increase the padding on the left side of the container so the grid is more centered
+		//if necessary, increase the padding on the left side of the wrapper so the grid is more centered
 		if(paddingGap > 0) {
 			var increasedPadding = paddingGap + padding;
-			var $container = $(balancedGallery.container);
-			$container.css({paddingLeft: increasedPadding+'px'});
-			$container.width(balancedGallery.options.viewportWidth - paddingGap);
+			var $wrapper = $(balancedGallery.wrapper);
+			$wrapper.css({paddingLeft: increasedPadding+'px'});
+			$wrapper.width(balancedGallery.options.viewportWidth - paddingGap);
 		}
 
-		balancedGallery.elementChildren.each(function(){
+		balancedGallery.elements.each(function(){
 			var $image = $(this);
 			var imgRatio = aspectRatio($image);
 			var offset = 0;
@@ -198,7 +198,7 @@
 
     function getColumns() {
         var cols = Math.round(balancedGallery.options.viewportWidth / balancedGallery.options.idealWidth);
-        var elements = balancedGallery.elementChildren.length;
+        var elements = balancedGallery.elements.length;
         if(cols <= elements) {
             return cols;
         } else {
@@ -208,7 +208,7 @@
 
     function collectiveIdealWidth() {
         var sum = 0;
-        balancedGallery.elementChildren.each(function () {
+        balancedGallery.elements.each(function () {
             sum += idealWidth($(this));
         });
         return sum;
@@ -219,14 +219,14 @@
     }
 
     function getWidthWeights() {
-        return balancedGallery.elementChildren.map(function () {
+        return balancedGallery.elements.map(function () {
             var weight = aspectRatio($(this));
             return {element: this, weight: weight };
         });
     }
 
     function getHeightWeights() {
-        return balancedGallery.elementChildren.map(function () {
+        return balancedGallery.elements.map(function () {
             var weight = 1/aspectRatio($(this));
             return {element: this, weight: weight };
         });
@@ -360,11 +360,11 @@
     }
 
     function reorderElements(partitions) {
-        $(balancedGallery.container).html(''); //remove all elements
+        $(balancedGallery.wrapper).html(''); //remove all elements
         for(var i = 0; i < partitions.length; i++) {
             var subPartition = partitions[i];
             for(var j = 0; j < subPartition.length; j++) {
-                $(balancedGallery.container).append(subPartition[j].element);
+                $(balancedGallery.wrapper).append(subPartition[j].element);
             }
         }
     }
@@ -385,7 +385,7 @@
             var rawImgHeight = (balancedGallery.options.viewportWidth - rowPadding) / rowRatio;
             for(var k = 0; k < partitions[i].length; k++) {
                 var $image = $(partitions[i][k].element);
-                balancedGallery.elementChildren[index++] = $image;
+                balancedGallery.elements[index++] = $image;
                 var imgHeight = parseInt(rawImgHeight, RADIX);
                 var imgWidth = rawImgHeight * aspectRatio($image);
                 imgWidth = checkWidthOverflow(imgWidth);
@@ -402,7 +402,7 @@
         var imagesPerRow = 0;
         var rawImgHeight, rowPadding;
 
-        for(var i = 0; i < balancedGallery.elementChildren.length; i++) {
+        for(var i = 0; i < balancedGallery.elements.length; i++) {
             if(i == imagesPerRow) {
                 rowPadding = padding * balancedGallery.resizingValue[index].length;
                 rawImgHeight = (balancedGallery.options.viewportWidth - rowPadding) / balancedGallery.resizingValue[index].ratio;
@@ -410,7 +410,7 @@
                 index++;
                 overflow = 0;
             }
-            var $image = balancedGallery.elementChildren[i];
+            var $image = balancedGallery.elements[i];
             var imgHeight = parseInt(rawImgHeight, RADIX);
             var imgWidth = rawImgHeight * aspectRatio($image);
             imgWidth = checkWidthOverflow(imgWidth);
@@ -447,7 +447,7 @@
             var columnHeight = 0;
             for(var l = 0; l < partitions[k].length; l++) {
                 var $image = $(partitions[k][l].element);
-                balancedGallery.elementChildren[index++] = $image;
+                balancedGallery.elements[index++] = $image;
                 var imgHeight = Math.round(rawImgWidth * (1/aspectRatio($image)));
                 columnHeight += imgHeight + padding;
                 $image.width(imgWidth);
@@ -465,7 +465,7 @@
         overflow = 0;
         var columnWidth, rawImgWidth, imgWidth;
 
-        for(var i = 0; i < balancedGallery.elementChildren.length; i++) {
+        for(var i = 0; i < balancedGallery.elements.length; i++) {
             if(i == imagesPerCol) {
                 index++;
                 balancedGallery.resizingValue[index].columnHeight = 0;
@@ -474,7 +474,7 @@
                 imgWidth = checkWidthOverflow(rawImgWidth);
                 imagesPerCol += balancedGallery.resizingValue[index].length;
             }
-            var $image = balancedGallery.elementChildren[i];
+            var $image = balancedGallery.elements[i];
             var imgHeight = parseInt(rawImgWidth * (1/aspectRatio($image)), RADIX);
             balancedGallery.resizingValue[index].columnHeight += imgHeight + padding;
             $image.width(imgWidth);
@@ -482,7 +482,7 @@
         }
     }
 
-    //ensures that the rows or all columns are as wide as the container width
+    //ensures that the rows or all columns are as wide as the wrapper width
     function checkWidthOverflow(width) {
         var parsedWidth = parseInt(width, RADIX);
         overflow += width - parsedWidth;
@@ -508,7 +508,7 @@
             //starting with last image in column, because it's more likely to be outside of the current viewport
             var k = imagesPerCol-1;
             while(averageHeight != balancedGallery.resizingValue[j].columnHeight) {
-                balancedGallery.elementChildren[k].height(balancedGallery.elementChildren[k].height() + counter);
+                balancedGallery.elements[k].height(balancedGallery.elements[k].height() + counter);
                 balancedGallery.resizingValue[j].columnHeight += counter;
                 k--;
 				//if all images in a column got streched/shrinked, start iteration again with last image in column till averageHeight matches columnHeight
@@ -521,9 +521,9 @@
 	
     //if a scrollbar appears or disappears after resizing
     function checkWidth(orientation) {
-        if((balancedGallery.options.viewportWidth + balancedGallery.options.padding) !== $(balancedGallery.element).width()) {
-            balancedGallery.options.viewportWidth = $(balancedGallery.element).width() - balancedGallery.options.padding;
-            $(balancedGallery.container).width(balancedGallery.options.viewportWidth);
+        if((balancedGallery.options.viewportWidth + balancedGallery.options.padding) !== $(balancedGallery.container).width()) {
+            balancedGallery.options.viewportWidth = $(balancedGallery.container).width() - balancedGallery.options.padding;
+            $(balancedGallery.wrapper).width(balancedGallery.options.viewportWidth);
             if(orientation == 'horizontal') {
                 quickResizeHorizontal();
             } else if(orientation == 'vertical') {
@@ -536,14 +536,14 @@
     }
 
     function orientElementsVertically(partitions) {
-        var $container = $(balancedGallery.container);
-        $container.html(''); //clear the images
+        var $wrapper = $(balancedGallery.wrapper);
+        $wrapper.html(''); //clear the images
 
         for(var i = 0; i < partitions.length; i++) {
             var colName = 'balanced-gallery-col'+i;
             var column = '<div class="balanced-gallery-column" id="'+colName+'" style="float: left; padding: 0; margin: 0;"></div>';
-            $container.append(column);
-            var $col = $($container.find("div#"+colName));
+            $wrapper.append(column);
+            var $col = $($wrapper.find("div#"+colName));
             for(var j = 0; j < partitions[i].length; j++) {
                 var child = partitions[i][j].element;
                 $col.append(child).append('<br style="display: block;"/>'); //Fix for Firefox; without 'style="display: block;"' Firefox assigns a width for an <br>-element. Strange!
@@ -552,7 +552,7 @@
 
         //add clearing div
         var clearingDiv = '<div class="balanced-gallery-clearing" style="clear: both;"></div>';
-        $container.append(clearingDiv);
+        $wrapper.append(clearingDiv);
     }
 
     function aspectRatio($image) {
diff --git a/jquery.balanced-gallery.min.js b/jquery.balanced-gallery.min.js
index 9615521..90f8959 100644
--- a/jquery.balanced-gallery.min.js
+++ b/jquery.balanced-gallery.min.js
@@ -1 +1,15 @@
-(function(g,E,M){function p(a,f){b=this;n.push(this);this.element=a;g(this.element).wrapInner('<div class="balanced-gallery-container"></div>');this.container=g(this.element).children()[0];this.elementChildren=g(this.container).children("img");this.options=g.extend({},F,f);this.options.orientation=this.options.orientation.toLowerCase();this.options.autoResize&&(this.unadulteratedCSS={width:g(this.element)[0].style.width},this.unadulteratedOptions=g.extend({},this.options),G());this.quickResize=!1;this.init();this.createGallery()}function G(){g(E).resize(function(){clearTimeout(u);u=setTimeout(function(){for(var a=0;a<n.length;a++)n[a].options.autoResize&&(b=n[a],n[a].recreate())},500)})}function y(){var a=b.options.padding,f=b.options.gridAspectRatio,e=parseInt(b.options.idealWidth-a,10),d=1/f*e,k='<div style="position: relative; display: inline-block; overflow: hidden; width: '+e+"px; height: "+d+"px; margin: 0 "+a+"px "+a+'px 0;"></div>',c=parseInt(b.options.viewportWidth%b.options.widthDivisor/2,10);if(0<c){var a=c+a,h=g(b.container);h.css({paddingLeft:a+"px"});h.width(b.options.viewportWidth-c)}b.elementChildren.each(function(){var a=g(this),c=q(a);c>=f?(a.height(d),a.width(d*c),c=(e-d*c)/2,a.css({left:c+"px",position:"absolute"})):c<f&&(a.width(e),a.height(1/c*e),c=(d-1/c*e)/2,a.css({top:c+"px",position:"absolute"}));b.quickResize?(a=a.parent(),a.width(e),a.height(d)):a.wrap(k)})}function H(){var a=0;b.elementChildren.each(function(){a+=q(g(this))*b.options.idealHeight+b.options.padding});return a}function I(){return b.elementChildren.map(function(){return{element:this,weight:q(g(this))}})}function J(){return b.elementChildren.map(function(){return{element:this,weight:1/q(g(this))}})}function z(a,f){if(b.options.maintainOrder){var e;var d=f;e=a.length;if(0>=d)e=[];else{var k=K(a,d);--e;for(var d=d-2,c=[],h;0<=d;){h=[];for(var l=k[e-1][d]+1;l<e+1;l++)h.push(a[l]);c=[h].concat(c);e=k[e-1][d];--d}d=[];for(k=0;k<e+1;k++)d.push(a[k]);e=[d].concat(c)}return e}e=L(a,f);if(b.options.shuffleUnorderedPartitions){for(c=0;c<e.length;c++)e[c]=A(e[c]);e=A(e)}c=e;g(b.container).html("");for(d=0;d<c.length;d++)for(k=c[d],h=0;h<k.length;h++)g(b.container).append(k[h].element);return e}function K(a,b){for(var e=a.length,d=[],f=0;f<e;f++){for(var c=[],h=0;h<b;h++)c.push(0);d.push(c)}f=[];for(c=0;c<e-1;c++){for(var h=[],g=0;g<b-1;g++)h.push(0);f.push(h)}for(c=0;c<e;c++)d[c][0]=a[c].weight+(0!==c?d[c-1][0]:0);for(c=0;c<b;c++)d[0][c]=a[0].weight;c=function(a,b){return a[0]-b[0]};for(h=1;h<e;h++)for(g=1;g<b;g++){for(var m=[],r=0;r<h;r++)m.push([Math.max(d[r][g-1],d[h][0]-d[r][0]),r]);m=m.sort(c)[0];d[h][g]=m[0];f[h-1][g-1]=m[1]}return f}function L(a,b){for(var e=a.sort(function(a,b){return b.weight-a.weight}),d=Array(b),f=0;f<b;f++)d[f]=[];for(f=0;f<e.length;f++){for(var c=d[0],h=B(c),g=0;g<d.length;g++){var m=B(d[g]);m<h&&(c=d[g],h=m)}c.push(e[f])}return d}function B(a){var b=0;g.each(a,function(a,d){b+=d.weight});return b}function C(){for(var a=b.options.padding,f=0,e=0,d,g=0;g<b.elementChildren.length;g++){g==e&&(d=a*b.resizingValue[f].length,d=(b.options.viewportWidth-d)/b.resizingValue[f].ratio,e+=b.resizingValue[f].length,f++,t=0);var c=b.elementChildren[g],h=parseInt(d,10),l=d*q(c),l=w(l);c.width(l);c.height(h)}}function D(){var a=b.options.padding,f=-1,e=0;t=0;for(var d,g,c=0;c<b.elementChildren.length;c++){c==e&&(f++,b.resizingValue[f].columnHeight=0,d=b.options.viewportWidth/b.summedColRatios*b.resizingValue[f].ratio,d-=a,g=w(d),e+=b.resizingValue[f].length);var h=b.elementChildren[c],l=parseInt(d*(1/q(h)),10);b.resizingValue[f].columnHeight+=l+a;h.width(g);h.height(l)}}function w(a){var b=parseInt(a,10);t+=a-b;.99999<=t&&(b+=1,--t);return b}function x(a){b.options.viewportWidth+b.options.padding!==g(b.element).width()&&(b.options.viewportWidth=g(b.element).width()-b.options.padding,g(b.container).width(b.options.viewportWidth),"horizontal"==a?C():"vertical"==a?D():"grid"==a&&(b.options.idealWidth=b.options.viewportWidth/b.options.widthDivisor,y()))}function q(a){return a[0].naturalWidth/a[0].naturalHeight}function A(a){for(var b=a.length,e,d;b--;)d=Math.random()*b|0,e=a[b],a[b]=a[d],a[d]=e;return a}var n=[],b,F={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,gridAspectRatio:1,widthDivisor:4},u=null,t=0;g.fn.BalancedGallery=function(a){return this.each(function(){g.data(this,"plugin_BalancedGallery")||g.data(this,"plugin_BalancedGallery",new p(this,a))})};p.prototype.recreate=function(){this.options=g.extend({},this.unadulteratedOptions);g(this.element).css(this.unadulteratedCSS);this.quickResize=!0;this.init();this.createGallery()};p.prototype.init=function(){if(!1===this.quickResize){this.elementChildren.each(function(){g(this).css({display:"inline-block",padding:0,margin:0})});var a=this.options.padding+"px";g(this.container).css({fontSize:0,paddingTop:a,paddingLeft:a});null!==this.options.background&&g(this.container).css({background:this.options.background})}this.options.viewportWidth=g(this.element).width()-this.options.padding;null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/this.options.widthDivisor);null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.widthDivisor);g(this.container).width(this.options.viewportWidth)};p.prototype.createGallery=function(){var a=this.options.orientation;if("horizontal"===a){var f;if(b.quickResize)C();else{a=Math.round(H()/b.options.viewportWidth);0<a&&1>a&&(a=1);f=I();a=z(f,a);f=b.options.padding;var e=0;b.resizingValue=[];for(var d=0;d<a.length;d++){for(var k=0,c=0;c<a[d].length;c++)k+=a[d][c].weight;b.resizingValue[d]={ratio:k,length:a[d].length};t=0;k=(b.options.viewportWidth-f*a[d].length)/k;for(c=0;c<a[d].length;c++){var h=g(a[d][c].element);b.elementChildren[e++]=h;var l=parseInt(k,10),m=k*q(h),m=w(m);h.width(m);h.height(l);h.css({margin:0,marginRight:f+"px",marginBottom:f+"px"})}}}x(b.options.orientation)}else if("vertical"===a){if(b.quickResize)D();else{a=Math.round(b.options.viewportWidth/b.options.idealWidth);f=b.elementChildren.length;a=a<=f?a:f;f=J();a=z(f,a);f=g(b.container);f.html("");for(e=0;e<a.length;e++)for(d="balanced-gallery-col"+e,f.append('<div class="balanced-gallery-column" id="'+d+'" style="float: left; padding: 0; margin: 0;"></div>'),d=g(f.find("div#"+d)),k=0;k<a[e].length;k++)d.append(a[e][k].element).append('<br style="display: block;"/>');f.append('<div class="balanced-gallery-clearing" style="clear: both;"></div>');f=b.options.padding;e=[];k=d=0;b.resizingValue=[];for(c=t=0;c<a.length;c++){for(h=e[c]=0;h<a[c].length;h++)e[c]+=a[c][h].weight;e[c]+=f/(b.options.idealWidth-f)*a[c].length;d+=e[c]}b.summedColRatios=d;c=d/a.length;for(h=0;h<a.length;h++){for(var l=c+(c-e[h]),m=b.options.viewportWidth/d*l-f,r=w(m),n=0,p=0;p<a[h].length;p++){var v=g(a[h][p].element);b.elementChildren[k++]=v;var u=Math.round(m*(1/q(v))),n=n+(u+f);v.width(r);v.height(u);v.css({margin:0,marginRight:f+"px",marginBottom:f+"px"})}b.resizingValue[h]={ratio:l,length:a[h].length,columnHeight:n}}}x(b.options.orientation);for(e=f=a=0;e<b.resizingValue.length;e++)a+=b.resizingValue[e].columnHeight;a=Math.round(a/b.resizingValue.length);for(e=0;e<b.resizingValue.length;e++)for(f+=b.resizingValue[e].length,d=Math.sign(a-b.resizingValue[e].columnHeight),k=f-1;a!=b.resizingValue[e].columnHeight;)b.elementChildren[k].height(b.elementChildren[k].height()+d),b.resizingValue[e].columnHeight+=d,k--,k<f-b.resizingValue[e].length&&(k=f-1)}else if("grid"===a)y(),x(a);else throw"BalancedGallery: Invalid Orientation.";}})(jQuery,window);
\ No newline at end of file
+(function(g,E,M){function p(a,f){b=this;n.push(this);this.container=a;g(this.container).wrapInner('<div class="balanced-gallery-wrapper"></div>');this.wrapper=g(this.container).children()[0];this.elements=g(this.wrapper).children("img");this.options=g.extend({},F,f);this.options.orientation=this.options.orientation.toLowerCase();this.options.autoResize&&(this.unadulteratedCSS={width:g(this.container)[0].style.width},this.unadulteratedOptions=g.extend({},this.options),G());this.quickResize=!1;this.init();
+this.createGallery()}function G(){g(E).resize(function(){clearTimeout(u);u=setTimeout(function(){for(var a=0;a<n.length;a++)n[a].options.autoResize&&(b=n[a],n[a].recreate())},500)})}function y(){var a=b.options.padding,f=b.options.gridAspectRatio,e=parseInt(b.options.idealWidth-a,10),d=1/f*e,k='<div style="position: relative; display: inline-block; overflow: hidden; width: '+e+"px; height: "+d+"px; margin: 0 "+a+"px "+a+'px 0;"></div>',c=parseInt(b.options.viewportWidth%b.options.widthDivisor/2,10);
+if(0<c){var a=c+a,h=g(b.wrapper);h.css({paddingLeft:a+"px"});h.width(b.options.viewportWidth-c)}b.elements.each(function(){var a=g(this),c=q(a);c>=f?(a.height(d),a.width(d*c),c=(e-d*c)/2,a.css({left:c+"px",position:"absolute"})):c<f&&(a.width(e),a.height(1/c*e),c=(d-1/c*e)/2,a.css({top:c+"px",position:"absolute"}));b.quickResize?(a=a.parent(),a.width(e),a.height(d)):a.wrap(k)})}function H(){var a=0;b.elements.each(function(){a+=q(g(this))*b.options.idealHeight+b.options.padding});return a}function I(){return b.elements.map(function(){return{element:this,
+weight:q(g(this))}})}function J(){return b.elements.map(function(){return{element:this,weight:1/q(g(this))}})}function z(a,f){if(b.options.maintainOrder){var e;var d=f;e=a.length;if(0>=d)e=[];else{var k=K(a,d);--e;for(var d=d-2,c=[],h;0<=d;){h=[];for(var l=k[e-1][d]+1;l<e+1;l++)h.push(a[l]);c=[h].concat(c);e=k[e-1][d];--d}d=[];for(k=0;k<e+1;k++)d.push(a[k]);e=[d].concat(c)}return e}e=L(a,f);if(b.options.shuffleUnorderedPartitions){for(c=0;c<e.length;c++)e[c]=A(e[c]);e=A(e)}c=e;g(b.wrapper).html("");
+for(d=0;d<c.length;d++)for(k=c[d],h=0;h<k.length;h++)g(b.wrapper).append(k[h].element);return e}function K(a,b){for(var e=a.length,d=[],f=0;f<e;f++){for(var c=[],h=0;h<b;h++)c.push(0);d.push(c)}f=[];for(c=0;c<e-1;c++){for(var h=[],g=0;g<b-1;g++)h.push(0);f.push(h)}for(c=0;c<e;c++)d[c][0]=a[c].weight+(0!==c?d[c-1][0]:0);for(c=0;c<b;c++)d[0][c]=a[0].weight;c=function(a,b){return a[0]-b[0]};for(h=1;h<e;h++)for(g=1;g<b;g++){for(var m=[],r=0;r<h;r++)m.push([Math.max(d[r][g-1],d[h][0]-d[r][0]),r]);m=m.sort(c)[0];
+d[h][g]=m[0];f[h-1][g-1]=m[1]}return f}function L(a,b){for(var e=a.sort(function(a,b){return b.weight-a.weight}),d=Array(b),f=0;f<b;f++)d[f]=[];for(f=0;f<e.length;f++){for(var c=d[0],h=B(c),g=0;g<d.length;g++){var m=B(d[g]);m<h&&(c=d[g],h=m)}c.push(e[f])}return d}function B(a){var b=0;g.each(a,function(a,d){b+=d.weight});return b}function C(){for(var a=b.options.padding,f=0,e=0,d,g=0;g<b.elements.length;g++){g==e&&(d=a*b.resizingValue[f].length,d=(b.options.viewportWidth-d)/b.resizingValue[f].ratio,
+e+=b.resizingValue[f].length,f++,t=0);var c=b.elements[g],h=parseInt(d,10),l=d*q(c),l=w(l);c.width(l);c.height(h)}}function D(){var a=b.options.padding,f=-1,e=0;t=0;for(var d,g,c=0;c<b.elements.length;c++){c==e&&(f++,b.resizingValue[f].columnHeight=0,d=b.options.viewportWidth/b.summedColRatios*b.resizingValue[f].ratio,d-=a,g=w(d),e+=b.resizingValue[f].length);var h=b.elements[c],l=parseInt(d*(1/q(h)),10);b.resizingValue[f].columnHeight+=l+a;h.width(g);h.height(l)}}function w(a){var b=parseInt(a,10);
+t+=a-b;.99999<=t&&(b+=1,--t);return b}function x(a){b.options.viewportWidth+b.options.padding!==g(b.container).width()&&(b.options.viewportWidth=g(b.container).width()-b.options.padding,g(b.wrapper).width(b.options.viewportWidth),"horizontal"==a?C():"vertical"==a?D():"grid"==a&&(b.options.idealWidth=b.options.viewportWidth/b.options.widthDivisor,y()))}function q(a){return a[0].naturalWidth/a[0].naturalHeight}function A(a){for(var b=a.length,e,d;b--;)d=Math.random()*b|0,e=a[b],a[b]=a[d],a[d]=e;return a}
+var n=[],b,F={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,gridAspectRatio:1,widthDivisor:4},u=null,t=0;g.fn.BalancedGallery=function(a){return this.each(function(){g.data(this,"plugin_BalancedGallery")||g.data(this,"plugin_BalancedGallery",new p(this,a))})};p.prototype.recreate=function(){this.options=g.extend({},this.unadulteratedOptions);g(this.container).css(this.unadulteratedCSS);this.quickResize=
+!0;this.init();this.createGallery()};p.prototype.init=function(){if(!1===this.quickResize){this.elements.each(function(){g(this).css({display:"inline-block",padding:0,margin:0})});var a=this.options.padding+"px";g(this.wrapper).css({fontSize:0,paddingTop:a,paddingLeft:a});null!==this.options.background&&g(this.wrapper).css({background:this.options.background})}this.options.viewportWidth=g(this.container).width()-this.options.padding;null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/
+this.options.widthDivisor);null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.widthDivisor);g(this.wrapper).width(this.options.viewportWidth)};p.prototype.createGallery=function(){var a=this.options.orientation;if("horizontal"===a){var f;if(b.quickResize)C();else{a=Math.round(H()/b.options.viewportWidth);0<a&&1>a&&(a=1);f=I();a=z(f,a);f=b.options.padding;var e=0;b.resizingValue=[];for(var d=0;d<a.length;d++){for(var k=0,c=0;c<a[d].length;c++)k+=a[d][c].weight;
+b.resizingValue[d]={ratio:k,length:a[d].length};t=0;k=(b.options.viewportWidth-f*a[d].length)/k;for(c=0;c<a[d].length;c++){var h=g(a[d][c].element);b.elements[e++]=h;var l=parseInt(k,10),m=k*q(h),m=w(m);h.width(m);h.height(l);h.css({margin:0,marginRight:f+"px",marginBottom:f+"px"})}}}x(b.options.orientation)}else if("vertical"===a){if(b.quickResize)D();else{a=Math.round(b.options.viewportWidth/b.options.idealWidth);f=b.elements.length;a=a<=f?a:f;f=J();a=z(f,a);f=g(b.wrapper);f.html("");for(e=0;e<
+a.length;e++)for(d="balanced-gallery-col"+e,f.append('<div class="balanced-gallery-column" id="'+d+'" style="float: left; padding: 0; margin: 0;"></div>'),d=g(f.find("div#"+d)),k=0;k<a[e].length;k++)d.append(a[e][k].element).append('<br style="display: block;"/>');f.append('<div class="balanced-gallery-clearing" style="clear: both;"></div>');f=b.options.padding;e=[];k=d=0;b.resizingValue=[];for(c=t=0;c<a.length;c++){for(h=e[c]=0;h<a[c].length;h++)e[c]+=a[c][h].weight;e[c]+=f/(b.options.idealWidth-
+f)*a[c].length;d+=e[c]}b.summedColRatios=d;c=d/a.length;for(h=0;h<a.length;h++){for(var l=c+(c-e[h]),m=b.options.viewportWidth/d*l-f,r=w(m),n=0,p=0;p<a[h].length;p++){var v=g(a[h][p].element);b.elements[k++]=v;var u=Math.round(m*(1/q(v))),n=n+(u+f);v.width(r);v.height(u);v.css({margin:0,marginRight:f+"px",marginBottom:f+"px"})}b.resizingValue[h]={ratio:l,length:a[h].length,columnHeight:n}}}x(b.options.orientation);for(e=f=a=0;e<b.resizingValue.length;e++)a+=b.resizingValue[e].columnHeight;a=Math.round(a/
+b.resizingValue.length);for(e=0;e<b.resizingValue.length;e++)for(f+=b.resizingValue[e].length,d=Math.sign(a-b.resizingValue[e].columnHeight),k=f-1;a!=b.resizingValue[e].columnHeight;)b.elements[k].height(b.elements[k].height()+d),b.resizingValue[e].columnHeight+=d,k--,k<f-b.resizingValue[e].length&&(k=f-1)}else if("grid"===a)y(),x(a);else throw"BalancedGallery: Invalid Orientation.";}})(jQuery,window);
\ No newline at end of file

From 48ca0dd04428312ce9a126564372ff9fcff65490 Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Tue, 21 Mar 2017 19:23:16 +0100
Subject: [PATCH 14/24] Added compatibility for 'Lightbox' libraries like
 Fullsizable or Magnific Popup

---
 jquery.balanced-gallery.js | 39 ++++++++++++++++++++------------------
 1 file changed, 21 insertions(+), 18 deletions(-)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index 5ee49d2..72abbd9 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -36,7 +36,13 @@
         this.container = container;
         $(this.container).wrapInner('<div class="balanced-gallery-wrapper"></div>');
         this.wrapper = $(this.container).children()[0];
-        this.elements = $(this.wrapper).children('img');
+        this.elements = $(this.wrapper).children().map(function(){
+            var img = $(this).find('img')[0];
+            if(img === undefined) {
+                img = this;
+            }
+            return {element: this, image: $(img)};
+        });
         this.options = $.extend({}, defaults, options); // merge arg options and defaults
         this.options.orientation = (this.options.orientation).toLowerCase();
 
@@ -78,7 +84,7 @@
     BalancedGallery.prototype.init = function () {
         if(this.quickResize === false) {
             this.elements.each(function() {
-                $(this).css({display: 'inline-block', padding: 0, margin: 0});
+                $(this.element).css({display: 'inline-block', padding: 0, margin: 0});
             });
 
             var padding = this.options.padding + 'px';
@@ -162,7 +168,7 @@
 		}
 
 		balancedGallery.elements.each(function(){
-			var $image = $(this);
+			var $image = this.image;
 			var imgRatio = aspectRatio($image);
 			var offset = 0;
 		  
@@ -209,7 +215,7 @@
     function collectiveIdealWidth() {
         var sum = 0;
         balancedGallery.elements.each(function () {
-            sum += idealWidth($(this));
+            sum += idealWidth(this.image);
         });
         return sum;
     }
@@ -220,15 +226,15 @@
 
     function getWidthWeights() {
         return balancedGallery.elements.map(function () {
-            var weight = aspectRatio($(this));
-            return {element: this, weight: weight };
+            var weight = aspectRatio(this.image);
+            return {element: this.element, image: this.image, weight: weight };
         });
     }
 
     function getHeightWeights() {
         return balancedGallery.elements.map(function () {
-            var weight = 1/aspectRatio($(this));
-            return {element: this, weight: weight };
+            var weight = 1/aspectRatio(this.image);
+            return {element: this.element, image: this.image, weight: weight };
         });
     }
 
@@ -360,7 +366,6 @@
     }
 
     function reorderElements(partitions) {
-        $(balancedGallery.wrapper).html(''); //remove all elements
         for(var i = 0; i < partitions.length; i++) {
             var subPartition = partitions[i];
             for(var j = 0; j < subPartition.length; j++) {
@@ -384,8 +389,8 @@
             var rowPadding = padding * partitions[i].length;
             var rawImgHeight = (balancedGallery.options.viewportWidth - rowPadding) / rowRatio;
             for(var k = 0; k < partitions[i].length; k++) {
-                var $image = $(partitions[i][k].element);
-                balancedGallery.elements[index++] = $image;
+                var $image = partitions[i][k].image;
+                balancedGallery.elements[index++] = {element: partitions[i][k].element, image: $image};
                 var imgHeight = parseInt(rawImgHeight, RADIX);
                 var imgWidth = rawImgHeight * aspectRatio($image);
                 imgWidth = checkWidthOverflow(imgWidth);
@@ -410,7 +415,7 @@
                 index++;
                 overflow = 0;
             }
-            var $image = balancedGallery.elements[i];
+            var $image = balancedGallery.elements[i].image;
             var imgHeight = parseInt(rawImgHeight, RADIX);
             var imgWidth = rawImgHeight * aspectRatio($image);
             imgWidth = checkWidthOverflow(imgWidth);
@@ -446,8 +451,8 @@
             var imgWidth = checkWidthOverflow(rawImgWidth);
             var columnHeight = 0;
             for(var l = 0; l < partitions[k].length; l++) {
-                var $image = $(partitions[k][l].element);
-                balancedGallery.elements[index++] = $image;
+                var $image = partitions[k][l].image;
+                balancedGallery.elements[index++] = {element: partitions[k][l].element, image: $image};
                 var imgHeight = Math.round(rawImgWidth * (1/aspectRatio($image)));
                 columnHeight += imgHeight + padding;
                 $image.width(imgWidth);
@@ -474,7 +479,7 @@
                 imgWidth = checkWidthOverflow(rawImgWidth);
                 imagesPerCol += balancedGallery.resizingValue[index].length;
             }
-            var $image = balancedGallery.elements[i];
+            var $image = balancedGallery.elements[i].image;
             var imgHeight = parseInt(rawImgWidth * (1/aspectRatio($image)), RADIX);
             balancedGallery.resizingValue[index].columnHeight += imgHeight + padding;
             $image.width(imgWidth);
@@ -508,7 +513,7 @@
             //starting with last image in column, because it's more likely to be outside of the current viewport
             var k = imagesPerCol-1;
             while(averageHeight != balancedGallery.resizingValue[j].columnHeight) {
-                balancedGallery.elements[k].height(balancedGallery.elements[k].height() + counter);
+                balancedGallery.elements[k].image.height(balancedGallery.elements[k].image.height() + counter);
                 balancedGallery.resizingValue[j].columnHeight += counter;
                 k--;
 				//if all images in a column got streched/shrinked, start iteration again with last image in column till averageHeight matches columnHeight
@@ -537,8 +542,6 @@
 
     function orientElementsVertically(partitions) {
         var $wrapper = $(balancedGallery.wrapper);
-        $wrapper.html(''); //clear the images
-
         for(var i = 0; i < partitions.length; i++) {
             var colName = 'balanced-gallery-col'+i;
             var column = '<div class="balanced-gallery-column" id="'+colName+'" style="float: left; padding: 0; margin: 0;"></div>';

From 71f90d85a915e9f2b92979e2ccb085382446e916 Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Tue, 21 Mar 2017 19:42:02 +0100
Subject: [PATCH 15/24] Small improvement on vertical mode.

---
 jquery.balanced-gallery.js     | 139 ++++++++++++++++-----------------
 jquery.balanced-gallery.min.js |  31 ++++----
 2 files changed, 85 insertions(+), 85 deletions(-)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index 72abbd9..21e5c7c 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -3,7 +3,7 @@
 
     var pluginName = 'BalancedGallery',
         galleries = [],
-		balancedGallery,
+        balancedGallery,
         defaults = {
             autoResize: true,
             background: null,
@@ -13,7 +13,7 @@
             orientation: 'horizontal',
             padding: 5,
             shuffleUnorderedPartitions: true,
-			gridAspectRatio: 1,
+            gridAspectRatio: 1,
             widthDivisor: 4
         },
         resizeTimeout = null,
@@ -32,7 +32,7 @@
 
     function BalancedGallery(container, options) {
         balancedGallery = this // for contexts when 'this' doesn't refer to the BalancedGallery class.
-		galleries.push(this);
+        galleries.push(this);
         this.container = container;
         $(this.container).wrapInner('<div class="balanced-gallery-wrapper"></div>');
         this.wrapper = $(this.container).children()[0];
@@ -63,11 +63,11 @@
 
             resizeTimeout = setTimeout(function() {
                 for(var index = 0; index < galleries.length; index++) {
-					if(galleries[index].options.autoResize) {
-						balancedGallery = galleries[index];
-						galleries[index].recreate();
-					}
-				}
+                    if(galleries[index].options.autoResize) {
+                        balancedGallery = galleries[index];
+                        galleries[index].recreate();
+                    }
+                }
             }, 500);
         });
     }
@@ -83,8 +83,12 @@
 
     BalancedGallery.prototype.init = function () {
         if(this.quickResize === false) {
+            var displayMode = 'inline-block';
+            if(this.options.orientation == 'vertical') {
+                displayMode = 'block';
+            }
             this.elements.each(function() {
-                $(this.element).css({display: 'inline-block', padding: 0, margin: 0});
+                $(this.element).css({display: displayMode, padding: 0, margin: 0});
             });
 
             var padding = this.options.padding + 'px';
@@ -116,9 +120,9 @@
         } else if(orientation === 'vertical') {
             createVerticalGallery();
         } else if(orientation === 'grid') {
-			createGridGallery();
-			checkWidth(orientation);
-		} else {
+            createGridGallery();
+            checkWidth(orientation);
+        } else {
             throw("BalancedGallery: Invalid Orientation.");
         }
     };
@@ -148,51 +152,51 @@
             resizeVerticalElements(partitions);
         }
         checkWidth(balancedGallery.options.orientation);
-		alignColumnHeights();
+        alignColumnHeights();
+    }
+    
+    function createGridGallery() {
+        var padding = balancedGallery.options.padding;
+        var cellRatio = balancedGallery.options.gridAspectRatio;
+        var cellWidth = parseInt(balancedGallery.options.idealWidth - padding, RADIX);
+        var cellHeight = cellWidth * (1 / cellRatio);
+        var wrapper = '<div style="position: relative; display: inline-block; overflow: hidden; width: '+cellWidth+'px; height: '+cellHeight+'px; margin: 0 '+padding+'px '+padding+'px 0;"></div>';
+        var paddingGap = parseInt(((balancedGallery.options.viewportWidth % balancedGallery.options.widthDivisor) / 2), RADIX);
+        
+        //if necessary, increase the padding on the left side of the wrapper so the grid is more centered
+        if(paddingGap > 0) {
+            var increasedPadding = paddingGap + padding;
+            var $wrapper = $(balancedGallery.wrapper);
+            $wrapper.css({paddingLeft: increasedPadding+'px'});
+            $wrapper.width(balancedGallery.options.viewportWidth - paddingGap);
+        }
+
+        balancedGallery.elements.each(function(){
+            var $image = this.image;
+            var imgRatio = aspectRatio($image);
+            var offset = 0;
+          
+            if(imgRatio >= cellRatio) {
+                $image.height(cellHeight);
+                $image.width(cellHeight * imgRatio);
+                offset = (cellWidth - (cellHeight * imgRatio)) / 2;
+                $image.css({left: offset+'px', position: 'absolute'});
+            } else if(imgRatio < cellRatio) {
+                $image.width(cellWidth);
+                $image.height(cellWidth * (1/imgRatio));
+                offset = (cellHeight - (cellWidth * (1/imgRatio))) / 2;
+                $image.css({top: offset+'px', position: 'absolute'});
+            }
+            
+            if(balancedGallery.quickResize) {
+                var $div = $image.parent();
+                $div.width(cellWidth);
+                $div.height(cellHeight);
+            } else {
+                $image.wrap(wrapper);
+            }
+        });
     }
-	
-	function createGridGallery() {
-		var padding = balancedGallery.options.padding;
-		var cellRatio = balancedGallery.options.gridAspectRatio;
-		var cellWidth = parseInt(balancedGallery.options.idealWidth - padding, RADIX);
-		var cellHeight = cellWidth * (1 / cellRatio);
-		var wrapper = '<div style="position: relative; display: inline-block; overflow: hidden; width: '+cellWidth+'px; height: '+cellHeight+'px; margin: 0 '+padding+'px '+padding+'px 0;"></div>';
-		var paddingGap = parseInt(((balancedGallery.options.viewportWidth % balancedGallery.options.widthDivisor) / 2), RADIX);
-		
-		//if necessary, increase the padding on the left side of the wrapper so the grid is more centered
-		if(paddingGap > 0) {
-			var increasedPadding = paddingGap + padding;
-			var $wrapper = $(balancedGallery.wrapper);
-			$wrapper.css({paddingLeft: increasedPadding+'px'});
-			$wrapper.width(balancedGallery.options.viewportWidth - paddingGap);
-		}
-
-		balancedGallery.elements.each(function(){
-			var $image = this.image;
-			var imgRatio = aspectRatio($image);
-			var offset = 0;
-		  
-			if(imgRatio >= cellRatio) {
-				$image.height(cellHeight);
-				$image.width(cellHeight * imgRatio);
-				offset = (cellWidth - (cellHeight * imgRatio)) / 2;
-				$image.css({left: offset+'px', position: 'absolute'});
-			} else if(imgRatio < cellRatio) {
-				$image.width(cellWidth);
-				$image.height(cellWidth * (1/imgRatio));
-				offset = (cellHeight - (cellWidth * (1/imgRatio))) / 2;
-				$image.css({top: offset+'px', position: 'absolute'});
-			}
-			
-			if(balancedGallery.quickResize) {
-				var $div = $image.parent();
-				$div.width(cellWidth);
-				$div.height(cellHeight);
-			} else {
-				$image.wrap(wrapper);
-			}
-		});
-	}
 
     function getRows () {
         var rows = Math.round(collectiveIdealWidth() / balancedGallery.options.viewportWidth);
@@ -346,7 +350,7 @@
             }
             shortestPartition.push(sortedWeights[j]);
         }
-		
+        
         return partitions;
     }
 
@@ -502,7 +506,7 @@
     function alignColumnHeights() {
         var averageHeight = 0;
         var imagesPerCol = 0;
-		
+        
         for(var i = 0; i < balancedGallery.resizingValue.length; i++) {
             averageHeight += balancedGallery.resizingValue[i].columnHeight;
         }
@@ -516,14 +520,14 @@
                 balancedGallery.elements[k].image.height(balancedGallery.elements[k].image.height() + counter);
                 balancedGallery.resizingValue[j].columnHeight += counter;
                 k--;
-				//if all images in a column got streched/shrinked, start iteration again with last image in column till averageHeight matches columnHeight
+                //if all images in a column got streched/shrinked, start iteration again with last image in column till averageHeight matches columnHeight
                 if(k < (imagesPerCol - balancedGallery.resizingValue[j].length)) { 
                     k = imagesPerCol-1;
                 }
             }
         }
     }
-	
+    
     //if a scrollbar appears or disappears after resizing
     function checkWidth(orientation) {
         if((balancedGallery.options.viewportWidth + balancedGallery.options.padding) !== $(balancedGallery.container).width()) {
@@ -534,9 +538,9 @@
             } else if(orientation == 'vertical') {
                 quickResizeVertical();
             } else if(orientation == 'grid') {
-				balancedGallery.options.idealWidth = balancedGallery.options.viewportWidth / balancedGallery.options.widthDivisor;
-				createGridGallery();
-			}
+                balancedGallery.options.idealWidth = balancedGallery.options.viewportWidth / balancedGallery.options.widthDivisor;
+                createGridGallery();
+            }
         }
     }
 
@@ -544,18 +548,13 @@
         var $wrapper = $(balancedGallery.wrapper);
         for(var i = 0; i < partitions.length; i++) {
             var colName = 'balanced-gallery-col'+i;
-            var column = '<div class="balanced-gallery-column" id="'+colName+'" style="float: left; padding: 0; margin: 0;"></div>';
+            var column = '<div class="balanced-gallery-column" id="'+colName+'" style="display: inline-block; padding: 0; margin: 0;"></div>';
             $wrapper.append(column);
             var $col = $($wrapper.find("div#"+colName));
             for(var j = 0; j < partitions[i].length; j++) {
-                var child = partitions[i][j].element;
-                $col.append(child).append('<br style="display: block;"/>'); //Fix for Firefox; without 'style="display: block;"' Firefox assigns a width for an <br>-element. Strange!
+                $col.append(partitions[i][j].element);
             }
         }
-
-        //add clearing div
-        var clearingDiv = '<div class="balanced-gallery-clearing" style="clear: both;"></div>';
-        $wrapper.append(clearingDiv);
     }
 
     function aspectRatio($image) {
diff --git a/jquery.balanced-gallery.min.js b/jquery.balanced-gallery.min.js
index 90f8959..d6b79f8 100644
--- a/jquery.balanced-gallery.min.js
+++ b/jquery.balanced-gallery.min.js
@@ -1,15 +1,16 @@
-(function(g,E,M){function p(a,f){b=this;n.push(this);this.container=a;g(this.container).wrapInner('<div class="balanced-gallery-wrapper"></div>');this.wrapper=g(this.container).children()[0];this.elements=g(this.wrapper).children("img");this.options=g.extend({},F,f);this.options.orientation=this.options.orientation.toLowerCase();this.options.autoResize&&(this.unadulteratedCSS={width:g(this.container)[0].style.width},this.unadulteratedOptions=g.extend({},this.options),G());this.quickResize=!1;this.init();
-this.createGallery()}function G(){g(E).resize(function(){clearTimeout(u);u=setTimeout(function(){for(var a=0;a<n.length;a++)n[a].options.autoResize&&(b=n[a],n[a].recreate())},500)})}function y(){var a=b.options.padding,f=b.options.gridAspectRatio,e=parseInt(b.options.idealWidth-a,10),d=1/f*e,k='<div style="position: relative; display: inline-block; overflow: hidden; width: '+e+"px; height: "+d+"px; margin: 0 "+a+"px "+a+'px 0;"></div>',c=parseInt(b.options.viewportWidth%b.options.widthDivisor/2,10);
-if(0<c){var a=c+a,h=g(b.wrapper);h.css({paddingLeft:a+"px"});h.width(b.options.viewportWidth-c)}b.elements.each(function(){var a=g(this),c=q(a);c>=f?(a.height(d),a.width(d*c),c=(e-d*c)/2,a.css({left:c+"px",position:"absolute"})):c<f&&(a.width(e),a.height(1/c*e),c=(d-1/c*e)/2,a.css({top:c+"px",position:"absolute"}));b.quickResize?(a=a.parent(),a.width(e),a.height(d)):a.wrap(k)})}function H(){var a=0;b.elements.each(function(){a+=q(g(this))*b.options.idealHeight+b.options.padding});return a}function I(){return b.elements.map(function(){return{element:this,
-weight:q(g(this))}})}function J(){return b.elements.map(function(){return{element:this,weight:1/q(g(this))}})}function z(a,f){if(b.options.maintainOrder){var e;var d=f;e=a.length;if(0>=d)e=[];else{var k=K(a,d);--e;for(var d=d-2,c=[],h;0<=d;){h=[];for(var l=k[e-1][d]+1;l<e+1;l++)h.push(a[l]);c=[h].concat(c);e=k[e-1][d];--d}d=[];for(k=0;k<e+1;k++)d.push(a[k]);e=[d].concat(c)}return e}e=L(a,f);if(b.options.shuffleUnorderedPartitions){for(c=0;c<e.length;c++)e[c]=A(e[c]);e=A(e)}c=e;g(b.wrapper).html("");
-for(d=0;d<c.length;d++)for(k=c[d],h=0;h<k.length;h++)g(b.wrapper).append(k[h].element);return e}function K(a,b){for(var e=a.length,d=[],f=0;f<e;f++){for(var c=[],h=0;h<b;h++)c.push(0);d.push(c)}f=[];for(c=0;c<e-1;c++){for(var h=[],g=0;g<b-1;g++)h.push(0);f.push(h)}for(c=0;c<e;c++)d[c][0]=a[c].weight+(0!==c?d[c-1][0]:0);for(c=0;c<b;c++)d[0][c]=a[0].weight;c=function(a,b){return a[0]-b[0]};for(h=1;h<e;h++)for(g=1;g<b;g++){for(var m=[],r=0;r<h;r++)m.push([Math.max(d[r][g-1],d[h][0]-d[r][0]),r]);m=m.sort(c)[0];
-d[h][g]=m[0];f[h-1][g-1]=m[1]}return f}function L(a,b){for(var e=a.sort(function(a,b){return b.weight-a.weight}),d=Array(b),f=0;f<b;f++)d[f]=[];for(f=0;f<e.length;f++){for(var c=d[0],h=B(c),g=0;g<d.length;g++){var m=B(d[g]);m<h&&(c=d[g],h=m)}c.push(e[f])}return d}function B(a){var b=0;g.each(a,function(a,d){b+=d.weight});return b}function C(){for(var a=b.options.padding,f=0,e=0,d,g=0;g<b.elements.length;g++){g==e&&(d=a*b.resizingValue[f].length,d=(b.options.viewportWidth-d)/b.resizingValue[f].ratio,
-e+=b.resizingValue[f].length,f++,t=0);var c=b.elements[g],h=parseInt(d,10),l=d*q(c),l=w(l);c.width(l);c.height(h)}}function D(){var a=b.options.padding,f=-1,e=0;t=0;for(var d,g,c=0;c<b.elements.length;c++){c==e&&(f++,b.resizingValue[f].columnHeight=0,d=b.options.viewportWidth/b.summedColRatios*b.resizingValue[f].ratio,d-=a,g=w(d),e+=b.resizingValue[f].length);var h=b.elements[c],l=parseInt(d*(1/q(h)),10);b.resizingValue[f].columnHeight+=l+a;h.width(g);h.height(l)}}function w(a){var b=parseInt(a,10);
-t+=a-b;.99999<=t&&(b+=1,--t);return b}function x(a){b.options.viewportWidth+b.options.padding!==g(b.container).width()&&(b.options.viewportWidth=g(b.container).width()-b.options.padding,g(b.wrapper).width(b.options.viewportWidth),"horizontal"==a?C():"vertical"==a?D():"grid"==a&&(b.options.idealWidth=b.options.viewportWidth/b.options.widthDivisor,y()))}function q(a){return a[0].naturalWidth/a[0].naturalHeight}function A(a){for(var b=a.length,e,d;b--;)d=Math.random()*b|0,e=a[b],a[b]=a[d],a[d]=e;return a}
-var n=[],b,F={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,gridAspectRatio:1,widthDivisor:4},u=null,t=0;g.fn.BalancedGallery=function(a){return this.each(function(){g.data(this,"plugin_BalancedGallery")||g.data(this,"plugin_BalancedGallery",new p(this,a))})};p.prototype.recreate=function(){this.options=g.extend({},this.unadulteratedOptions);g(this.container).css(this.unadulteratedCSS);this.quickResize=
-!0;this.init();this.createGallery()};p.prototype.init=function(){if(!1===this.quickResize){this.elements.each(function(){g(this).css({display:"inline-block",padding:0,margin:0})});var a=this.options.padding+"px";g(this.wrapper).css({fontSize:0,paddingTop:a,paddingLeft:a});null!==this.options.background&&g(this.wrapper).css({background:this.options.background})}this.options.viewportWidth=g(this.container).width()-this.options.padding;null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/
-this.options.widthDivisor);null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.widthDivisor);g(this.wrapper).width(this.options.viewportWidth)};p.prototype.createGallery=function(){var a=this.options.orientation;if("horizontal"===a){var f;if(b.quickResize)C();else{a=Math.round(H()/b.options.viewportWidth);0<a&&1>a&&(a=1);f=I();a=z(f,a);f=b.options.padding;var e=0;b.resizingValue=[];for(var d=0;d<a.length;d++){for(var k=0,c=0;c<a[d].length;c++)k+=a[d][c].weight;
-b.resizingValue[d]={ratio:k,length:a[d].length};t=0;k=(b.options.viewportWidth-f*a[d].length)/k;for(c=0;c<a[d].length;c++){var h=g(a[d][c].element);b.elements[e++]=h;var l=parseInt(k,10),m=k*q(h),m=w(m);h.width(m);h.height(l);h.css({margin:0,marginRight:f+"px",marginBottom:f+"px"})}}}x(b.options.orientation)}else if("vertical"===a){if(b.quickResize)D();else{a=Math.round(b.options.viewportWidth/b.options.idealWidth);f=b.elements.length;a=a<=f?a:f;f=J();a=z(f,a);f=g(b.wrapper);f.html("");for(e=0;e<
-a.length;e++)for(d="balanced-gallery-col"+e,f.append('<div class="balanced-gallery-column" id="'+d+'" style="float: left; padding: 0; margin: 0;"></div>'),d=g(f.find("div#"+d)),k=0;k<a[e].length;k++)d.append(a[e][k].element).append('<br style="display: block;"/>');f.append('<div class="balanced-gallery-clearing" style="clear: both;"></div>');f=b.options.padding;e=[];k=d=0;b.resizingValue=[];for(c=t=0;c<a.length;c++){for(h=e[c]=0;h<a[c].length;h++)e[c]+=a[c][h].weight;e[c]+=f/(b.options.idealWidth-
-f)*a[c].length;d+=e[c]}b.summedColRatios=d;c=d/a.length;for(h=0;h<a.length;h++){for(var l=c+(c-e[h]),m=b.options.viewportWidth/d*l-f,r=w(m),n=0,p=0;p<a[h].length;p++){var v=g(a[h][p].element);b.elements[k++]=v;var u=Math.round(m*(1/q(v))),n=n+(u+f);v.width(r);v.height(u);v.css({margin:0,marginRight:f+"px",marginBottom:f+"px"})}b.resizingValue[h]={ratio:l,length:a[h].length,columnHeight:n}}}x(b.options.orientation);for(e=f=a=0;e<b.resizingValue.length;e++)a+=b.resizingValue[e].columnHeight;a=Math.round(a/
-b.resizingValue.length);for(e=0;e<b.resizingValue.length;e++)for(f+=b.resizingValue[e].length,d=Math.sign(a-b.resizingValue[e].columnHeight),k=f-1;a!=b.resizingValue[e].columnHeight;)b.elements[k].height(b.elements[k].height()+d),b.resizingValue[e].columnHeight+=d,k--,k<f-b.resizingValue[e].length&&(k=f-1)}else if("grid"===a)y(),x(a);else throw"BalancedGallery: Invalid Orientation.";}})(jQuery,window);
\ No newline at end of file
+(function(h,E,F){function m(a,f){b=this;n.push(this);this.container=a;h(this.container).wrapInner('<div class="balanced-gallery-wrapper"></div>');this.wrapper=h(this.container).children()[0];this.elements=h(this.wrapper).children().map(function(){var a=h(this).find("img")[0];a===F&&(a=this);return{element:this,image:h(a)}});this.options=h.extend({},G,f);this.options.orientation=this.options.orientation.toLowerCase();this.options.autoResize&&(this.unadulteratedCSS={width:h(this.container)[0].style.width},
+this.unadulteratedOptions=h.extend({},this.options),H());this.quickResize=!1;this.init();this.createGallery()}function H(){h(E).resize(function(){clearTimeout(u);u=setTimeout(function(){for(var a=0;a<n.length;a++)n[a].options.autoResize&&(b=n[a],n[a].recreate())},500)})}function y(){var a=b.options.padding,f=b.options.gridAspectRatio,e=parseInt(b.options.idealWidth-a,10),d=1/f*e,k='<div style="position: relative; display: inline-block; overflow: hidden; width: '+e+"px; height: "+d+"px; margin: 0 "+
+a+"px "+a+'px 0;"></div>',c=parseInt(b.options.viewportWidth%b.options.widthDivisor/2,10);if(0<c){var a=c+a,g=h(b.wrapper);g.css({paddingLeft:a+"px"});g.width(b.options.viewportWidth-c)}b.elements.each(function(){var a=this.image,c=q(a);c>=f?(a.height(d),a.width(d*c),c=(e-d*c)/2,a.css({left:c+"px",position:"absolute"})):c<f&&(a.width(e),a.height(1/c*e),c=(d-1/c*e)/2,a.css({top:c+"px",position:"absolute"}));b.quickResize?(a=a.parent(),a.width(e),a.height(d)):a.wrap(k)})}function I(){var a=0;b.elements.each(function(){a+=
+q(this.image)*b.options.idealHeight+b.options.padding});return a}function J(){return b.elements.map(function(){var a=q(this.image);return{element:this.element,image:this.image,weight:a}})}function K(){return b.elements.map(function(){var a=1/q(this.image);return{element:this.element,image:this.image,weight:a}})}function z(a,f){if(b.options.maintainOrder){var e;var d=f;e=a.length;if(0>=d)e=[];else{var k=L(a,d);--e;for(var d=d-2,c=[],g;0<=d;){g=[];for(var l=k[e-1][d]+1;l<e+1;l++)g.push(a[l]);c=[g].concat(c);
+e=k[e-1][d];--d}d=[];for(k=0;k<e+1;k++)d.push(a[k]);e=[d].concat(c)}return e}e=M(a,f);if(b.options.shuffleUnorderedPartitions){for(c=0;c<e.length;c++)e[c]=A(e[c]);e=A(e)}c=e;for(d=0;d<c.length;d++)for(k=c[d],g=0;g<k.length;g++)h(b.wrapper).append(k[g].element);return e}function L(a,b){for(var e=a.length,d=[],f=0;f<e;f++){for(var c=[],g=0;g<b;g++)c.push(0);d.push(c)}f=[];for(c=0;c<e-1;c++){for(var g=[],l=0;l<b-1;l++)g.push(0);f.push(g)}for(c=0;c<e;c++)d[c][0]=a[c].weight+(0!==c?d[c-1][0]:0);for(c=
+0;c<b;c++)d[0][c]=a[0].weight;c=function(a,b){return a[0]-b[0]};for(g=1;g<e;g++)for(l=1;l<b;l++){for(var h=[],r=0;r<g;r++)h.push([Math.max(d[r][l-1],d[g][0]-d[r][0]),r]);h=h.sort(c)[0];d[g][l]=h[0];f[g-1][l-1]=h[1]}return f}function M(a,b){for(var e=a.sort(function(a,b){return b.weight-a.weight}),d=Array(b),f=0;f<b;f++)d[f]=[];for(f=0;f<e.length;f++){for(var c=d[0],g=B(c),h=0;h<d.length;h++){var p=B(d[h]);p<g&&(c=d[h],g=p)}c.push(e[f])}return d}function B(a){var b=0;h.each(a,function(a,d){b+=d.weight});
+return b}function C(){for(var a=b.options.padding,f=0,e=0,d,h=0;h<b.elements.length;h++){h==e&&(d=a*b.resizingValue[f].length,d=(b.options.viewportWidth-d)/b.resizingValue[f].ratio,e+=b.resizingValue[f].length,f++,t=0);var c=b.elements[h].image,g=parseInt(d,10),l=d*q(c),l=w(l);c.width(l);c.height(g)}}function D(){var a=b.options.padding,f=-1,e=0;t=0;for(var d,h,c=0;c<b.elements.length;c++){c==e&&(f++,b.resizingValue[f].columnHeight=0,d=b.options.viewportWidth/b.summedColRatios*b.resizingValue[f].ratio,
+d-=a,h=w(d),e+=b.resizingValue[f].length);var g=b.elements[c].image,l=parseInt(d*(1/q(g)),10);b.resizingValue[f].columnHeight+=l+a;g.width(h);g.height(l)}}function w(a){var b=parseInt(a,10);t+=a-b;.99999<=t&&(b+=1,--t);return b}function x(a){b.options.viewportWidth+b.options.padding!==h(b.container).width()&&(b.options.viewportWidth=h(b.container).width()-b.options.padding,h(b.wrapper).width(b.options.viewportWidth),"horizontal"==a?C():"vertical"==a?D():"grid"==a&&(b.options.idealWidth=b.options.viewportWidth/
+b.options.widthDivisor,y()))}function q(a){return a[0].naturalWidth/a[0].naturalHeight}function A(a){for(var b=a.length,e,d;b--;)d=Math.random()*b|0,e=a[b],a[b]=a[d],a[d]=e;return a}var n=[],b,G={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,gridAspectRatio:1,widthDivisor:4},u=null,t=0;h.fn.BalancedGallery=function(a){return this.each(function(){h.data(this,"plugin_BalancedGallery")||h.data(this,"plugin_BalancedGallery",
+new m(this,a))})};m.prototype.recreate=function(){this.options=h.extend({},this.unadulteratedOptions);h(this.container).css(this.unadulteratedCSS);this.quickResize=!0;this.init();this.createGallery()};m.prototype.init=function(){if(!1===this.quickResize){var a="inline-block";"vertical"==this.options.orientation&&(a="block");this.elements.each(function(){h(this.element).css({display:a,padding:0,margin:0})});var b=this.options.padding+"px";h(this.wrapper).css({fontSize:0,paddingTop:b,paddingLeft:b});
+null!==this.options.background&&h(this.wrapper).css({background:this.options.background})}this.options.viewportWidth=h(this.container).width()-this.options.padding;null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/this.options.widthDivisor);null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.widthDivisor);h(this.wrapper).width(this.options.viewportWidth)};m.prototype.createGallery=function(){var a=this.options.orientation;
+if("horizontal"===a){var f;if(b.quickResize)C();else{a=Math.round(I()/b.options.viewportWidth);0<a&&1>a&&(a=1);f=J();a=z(f,a);f=b.options.padding;var e=0;b.resizingValue=[];for(var d=0;d<a.length;d++){for(var k=0,c=0;c<a[d].length;c++)k+=a[d][c].weight;b.resizingValue[d]={ratio:k,length:a[d].length};t=0;k=(b.options.viewportWidth-f*a[d].length)/k;for(c=0;c<a[d].length;c++){var g=a[d][c].image;b.elements[e++]={element:a[d][c].element,image:g};var l=parseInt(k,10),p=k*q(g),p=w(p);g.width(p);g.height(l);
+g.css({margin:0,marginRight:f+"px",marginBottom:f+"px"})}}}x(b.options.orientation)}else if("vertical"===a){if(b.quickResize)D();else{a=Math.round(b.options.viewportWidth/b.options.idealWidth);f=b.elements.length;a=a<=f?a:f;f=K();a=z(f,a);f=h(b.wrapper);for(e=0;e<a.length;e++)for(d="balanced-gallery-col"+e,f.append('<div class="balanced-gallery-column" id="'+d+'" style="display: inline-block; padding: 0; margin: 0;"></div>'),d=h(f.find("div#"+d)),k=0;k<a[e].length;k++)d.append(a[e][k].element);f=
+b.options.padding;e=[];k=d=0;b.resizingValue=[];for(c=t=0;c<a.length;c++){for(g=e[c]=0;g<a[c].length;g++)e[c]+=a[c][g].weight;e[c]+=f/(b.options.idealWidth-f)*a[c].length;d+=e[c]}b.summedColRatios=d;c=d/a.length;for(g=0;g<a.length;g++){for(var l=c+(c-e[g]),p=b.options.viewportWidth/d*l-f,r=w(p),n=0,m=0;m<a[g].length;m++){var v=a[g][m].image;b.elements[k++]={element:a[g][m].element,image:v};var u=Math.round(p*(1/q(v))),n=n+(u+f);v.width(r);v.height(u);v.css({margin:0,marginRight:f+"px",marginBottom:f+
+"px"})}b.resizingValue[g]={ratio:l,length:a[g].length,columnHeight:n}}}x(b.options.orientation);for(e=f=a=0;e<b.resizingValue.length;e++)a+=b.resizingValue[e].columnHeight;a=Math.round(a/b.resizingValue.length);for(e=0;e<b.resizingValue.length;e++)for(f+=b.resizingValue[e].length,d=Math.sign(a-b.resizingValue[e].columnHeight),k=f-1;a!=b.resizingValue[e].columnHeight;)b.elements[k].image.height(b.elements[k].image.height()+d),b.resizingValue[e].columnHeight+=d,k--,k<f-b.resizingValue[e].length&&(k=
+f-1)}else if("grid"===a)y(),x(a);else throw"BalancedGallery: Invalid Orientation.";}})(jQuery,window);
\ No newline at end of file

From 7314d38631248000709ea42787f25a4d3d621178 Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Tue, 21 Mar 2017 20:27:15 +0100
Subject: [PATCH 16/24] Set padding/margin of image in init to 0 and set css
 properties via function and not in string

---
 jquery.balanced-gallery.js     |  4 +++-
 jquery.balanced-gallery.min.js | 17 +----------------
 2 files changed, 4 insertions(+), 17 deletions(-)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index 21e5c7c..74e1680 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -89,6 +89,7 @@
             }
             this.elements.each(function() {
                 $(this.element).css({display: displayMode, padding: 0, margin: 0});
+                this.image.css({display: displayMode, padding: 0, margin: 0});
             });
 
             var padding = this.options.padding + 'px';
@@ -160,7 +161,7 @@
         var cellRatio = balancedGallery.options.gridAspectRatio;
         var cellWidth = parseInt(balancedGallery.options.idealWidth - padding, RADIX);
         var cellHeight = cellWidth * (1 / cellRatio);
-        var wrapper = '<div style="position: relative; display: inline-block; overflow: hidden; width: '+cellWidth+'px; height: '+cellHeight+'px; margin: 0 '+padding+'px '+padding+'px 0;"></div>';
+        var wrapper = '<div></div>';
         var paddingGap = parseInt(((balancedGallery.options.viewportWidth % balancedGallery.options.widthDivisor) / 2), RADIX);
         
         //if necessary, increase the padding on the left side of the wrapper so the grid is more centered
@@ -194,6 +195,7 @@
                 $div.height(cellHeight);
             } else {
                 $image.wrap(wrapper);
+                $($image[0].parentNode).css({position: 'relative', display: 'inline-block', overflow: 'hidden', width: cellWidth+'px', height: cellHeight+'px', margin: 0, marginRight: padding+'px', marginBottom: padding+'px'});
             }
         });
     }
diff --git a/jquery.balanced-gallery.min.js b/jquery.balanced-gallery.min.js
index d6b79f8..ca0f171 100644
--- a/jquery.balanced-gallery.min.js
+++ b/jquery.balanced-gallery.min.js
@@ -1,16 +1 @@
-(function(h,E,F){function m(a,f){b=this;n.push(this);this.container=a;h(this.container).wrapInner('<div class="balanced-gallery-wrapper"></div>');this.wrapper=h(this.container).children()[0];this.elements=h(this.wrapper).children().map(function(){var a=h(this).find("img")[0];a===F&&(a=this);return{element:this,image:h(a)}});this.options=h.extend({},G,f);this.options.orientation=this.options.orientation.toLowerCase();this.options.autoResize&&(this.unadulteratedCSS={width:h(this.container)[0].style.width},
-this.unadulteratedOptions=h.extend({},this.options),H());this.quickResize=!1;this.init();this.createGallery()}function H(){h(E).resize(function(){clearTimeout(u);u=setTimeout(function(){for(var a=0;a<n.length;a++)n[a].options.autoResize&&(b=n[a],n[a].recreate())},500)})}function y(){var a=b.options.padding,f=b.options.gridAspectRatio,e=parseInt(b.options.idealWidth-a,10),d=1/f*e,k='<div style="position: relative; display: inline-block; overflow: hidden; width: '+e+"px; height: "+d+"px; margin: 0 "+
-a+"px "+a+'px 0;"></div>',c=parseInt(b.options.viewportWidth%b.options.widthDivisor/2,10);if(0<c){var a=c+a,g=h(b.wrapper);g.css({paddingLeft:a+"px"});g.width(b.options.viewportWidth-c)}b.elements.each(function(){var a=this.image,c=q(a);c>=f?(a.height(d),a.width(d*c),c=(e-d*c)/2,a.css({left:c+"px",position:"absolute"})):c<f&&(a.width(e),a.height(1/c*e),c=(d-1/c*e)/2,a.css({top:c+"px",position:"absolute"}));b.quickResize?(a=a.parent(),a.width(e),a.height(d)):a.wrap(k)})}function I(){var a=0;b.elements.each(function(){a+=
-q(this.image)*b.options.idealHeight+b.options.padding});return a}function J(){return b.elements.map(function(){var a=q(this.image);return{element:this.element,image:this.image,weight:a}})}function K(){return b.elements.map(function(){var a=1/q(this.image);return{element:this.element,image:this.image,weight:a}})}function z(a,f){if(b.options.maintainOrder){var e;var d=f;e=a.length;if(0>=d)e=[];else{var k=L(a,d);--e;for(var d=d-2,c=[],g;0<=d;){g=[];for(var l=k[e-1][d]+1;l<e+1;l++)g.push(a[l]);c=[g].concat(c);
-e=k[e-1][d];--d}d=[];for(k=0;k<e+1;k++)d.push(a[k]);e=[d].concat(c)}return e}e=M(a,f);if(b.options.shuffleUnorderedPartitions){for(c=0;c<e.length;c++)e[c]=A(e[c]);e=A(e)}c=e;for(d=0;d<c.length;d++)for(k=c[d],g=0;g<k.length;g++)h(b.wrapper).append(k[g].element);return e}function L(a,b){for(var e=a.length,d=[],f=0;f<e;f++){for(var c=[],g=0;g<b;g++)c.push(0);d.push(c)}f=[];for(c=0;c<e-1;c++){for(var g=[],l=0;l<b-1;l++)g.push(0);f.push(g)}for(c=0;c<e;c++)d[c][0]=a[c].weight+(0!==c?d[c-1][0]:0);for(c=
-0;c<b;c++)d[0][c]=a[0].weight;c=function(a,b){return a[0]-b[0]};for(g=1;g<e;g++)for(l=1;l<b;l++){for(var h=[],r=0;r<g;r++)h.push([Math.max(d[r][l-1],d[g][0]-d[r][0]),r]);h=h.sort(c)[0];d[g][l]=h[0];f[g-1][l-1]=h[1]}return f}function M(a,b){for(var e=a.sort(function(a,b){return b.weight-a.weight}),d=Array(b),f=0;f<b;f++)d[f]=[];for(f=0;f<e.length;f++){for(var c=d[0],g=B(c),h=0;h<d.length;h++){var p=B(d[h]);p<g&&(c=d[h],g=p)}c.push(e[f])}return d}function B(a){var b=0;h.each(a,function(a,d){b+=d.weight});
-return b}function C(){for(var a=b.options.padding,f=0,e=0,d,h=0;h<b.elements.length;h++){h==e&&(d=a*b.resizingValue[f].length,d=(b.options.viewportWidth-d)/b.resizingValue[f].ratio,e+=b.resizingValue[f].length,f++,t=0);var c=b.elements[h].image,g=parseInt(d,10),l=d*q(c),l=w(l);c.width(l);c.height(g)}}function D(){var a=b.options.padding,f=-1,e=0;t=0;for(var d,h,c=0;c<b.elements.length;c++){c==e&&(f++,b.resizingValue[f].columnHeight=0,d=b.options.viewportWidth/b.summedColRatios*b.resizingValue[f].ratio,
-d-=a,h=w(d),e+=b.resizingValue[f].length);var g=b.elements[c].image,l=parseInt(d*(1/q(g)),10);b.resizingValue[f].columnHeight+=l+a;g.width(h);g.height(l)}}function w(a){var b=parseInt(a,10);t+=a-b;.99999<=t&&(b+=1,--t);return b}function x(a){b.options.viewportWidth+b.options.padding!==h(b.container).width()&&(b.options.viewportWidth=h(b.container).width()-b.options.padding,h(b.wrapper).width(b.options.viewportWidth),"horizontal"==a?C():"vertical"==a?D():"grid"==a&&(b.options.idealWidth=b.options.viewportWidth/
-b.options.widthDivisor,y()))}function q(a){return a[0].naturalWidth/a[0].naturalHeight}function A(a){for(var b=a.length,e,d;b--;)d=Math.random()*b|0,e=a[b],a[b]=a[d],a[d]=e;return a}var n=[],b,G={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,gridAspectRatio:1,widthDivisor:4},u=null,t=0;h.fn.BalancedGallery=function(a){return this.each(function(){h.data(this,"plugin_BalancedGallery")||h.data(this,"plugin_BalancedGallery",
-new m(this,a))})};m.prototype.recreate=function(){this.options=h.extend({},this.unadulteratedOptions);h(this.container).css(this.unadulteratedCSS);this.quickResize=!0;this.init();this.createGallery()};m.prototype.init=function(){if(!1===this.quickResize){var a="inline-block";"vertical"==this.options.orientation&&(a="block");this.elements.each(function(){h(this.element).css({display:a,padding:0,margin:0})});var b=this.options.padding+"px";h(this.wrapper).css({fontSize:0,paddingTop:b,paddingLeft:b});
-null!==this.options.background&&h(this.wrapper).css({background:this.options.background})}this.options.viewportWidth=h(this.container).width()-this.options.padding;null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/this.options.widthDivisor);null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.widthDivisor);h(this.wrapper).width(this.options.viewportWidth)};m.prototype.createGallery=function(){var a=this.options.orientation;
-if("horizontal"===a){var f;if(b.quickResize)C();else{a=Math.round(I()/b.options.viewportWidth);0<a&&1>a&&(a=1);f=J();a=z(f,a);f=b.options.padding;var e=0;b.resizingValue=[];for(var d=0;d<a.length;d++){for(var k=0,c=0;c<a[d].length;c++)k+=a[d][c].weight;b.resizingValue[d]={ratio:k,length:a[d].length};t=0;k=(b.options.viewportWidth-f*a[d].length)/k;for(c=0;c<a[d].length;c++){var g=a[d][c].image;b.elements[e++]={element:a[d][c].element,image:g};var l=parseInt(k,10),p=k*q(g),p=w(p);g.width(p);g.height(l);
-g.css({margin:0,marginRight:f+"px",marginBottom:f+"px"})}}}x(b.options.orientation)}else if("vertical"===a){if(b.quickResize)D();else{a=Math.round(b.options.viewportWidth/b.options.idealWidth);f=b.elements.length;a=a<=f?a:f;f=K();a=z(f,a);f=h(b.wrapper);for(e=0;e<a.length;e++)for(d="balanced-gallery-col"+e,f.append('<div class="balanced-gallery-column" id="'+d+'" style="display: inline-block; padding: 0; margin: 0;"></div>'),d=h(f.find("div#"+d)),k=0;k<a[e].length;k++)d.append(a[e][k].element);f=
-b.options.padding;e=[];k=d=0;b.resizingValue=[];for(c=t=0;c<a.length;c++){for(g=e[c]=0;g<a[c].length;g++)e[c]+=a[c][g].weight;e[c]+=f/(b.options.idealWidth-f)*a[c].length;d+=e[c]}b.summedColRatios=d;c=d/a.length;for(g=0;g<a.length;g++){for(var l=c+(c-e[g]),p=b.options.viewportWidth/d*l-f,r=w(p),n=0,m=0;m<a[g].length;m++){var v=a[g][m].image;b.elements[k++]={element:a[g][m].element,image:v};var u=Math.round(p*(1/q(v))),n=n+(u+f);v.width(r);v.height(u);v.css({margin:0,marginRight:f+"px",marginBottom:f+
-"px"})}b.resizingValue[g]={ratio:l,length:a[g].length,columnHeight:n}}}x(b.options.orientation);for(e=f=a=0;e<b.resizingValue.length;e++)a+=b.resizingValue[e].columnHeight;a=Math.round(a/b.resizingValue.length);for(e=0;e<b.resizingValue.length;e++)for(f+=b.resizingValue[e].length,d=Math.sign(a-b.resizingValue[e].columnHeight),k=f-1;a!=b.resizingValue[e].columnHeight;)b.elements[k].image.height(b.elements[k].image.height()+d),b.resizingValue[e].columnHeight+=d,k--,k<f-b.resizingValue[e].length&&(k=
-f-1)}else if("grid"===a)y(),x(a);else throw"BalancedGallery: Invalid Orientation.";}})(jQuery,window);
\ No newline at end of file
+(function(h,E,F){function m(a,g){b=this;n.push(this);this.container=a;h(this.container).wrapInner('<div class="balanced-gallery-wrapper"></div>');this.wrapper=h(this.container).children()[0];this.elements=h(this.wrapper).children().map(function(){var a=h(this).find("img")[0];a===F&&(a=this);return{element:this,image:h(a)}});this.options=h.extend({},G,g);this.options.orientation=this.options.orientation.toLowerCase();this.options.autoResize&&(this.unadulteratedCSS={width:h(this.container)[0].style.width},this.unadulteratedOptions=h.extend({},this.options),H());this.quickResize=!1;this.init();this.createGallery()}function H(){h(E).resize(function(){clearTimeout(u);u=setTimeout(function(){for(var a=0;a<n.length;a++)n[a].options.autoResize&&(b=n[a],n[a].recreate())},500)})}function y(){var a=b.options.padding,g=b.options.gridAspectRatio,e=parseInt(b.options.idealWidth-a,10),d=1/g*e,f=parseInt(b.options.viewportWidth%b.options.widthDivisor/2,10);if(0<f){var c=f+a,k=h(b.wrapper);k.css({paddingLeft:c+"px"});k.width(b.options.viewportWidth-f)}b.elements.each(function(){var c=this.image,f=q(c);f>=g?(c.height(d),c.width(d*f),f=(e-d*f)/2,c.css({left:f+"px",position:"absolute"})):f<g&&(c.width(e),c.height(1/f*e),f=(d-1/f*e)/2,c.css({top:f+"px",position:"absolute"}));b.quickResize?(c=c.parent(),c.width(e),c.height(d)):(c.wrap("<div></div>"),h(c[0].parentNode).css({position:"relative",display:"inline-block",overflow:"hidden",width:e+"px",height:d+"px",margin:0,marginRight:a+"px",marginBottom:a+"px"}))})}function I(){var a=0;b.elements.each(function(){a+=q(this.image)*b.options.idealHeight+b.options.padding});return a}function J(){return b.elements.map(function(){var a=q(this.image);return{element:this.element,image:this.image,weight:a}})}function K(){return b.elements.map(function(){var a=1/q(this.image);return{element:this.element,image:this.image,weight:a}})}function z(a,g){if(b.options.maintainOrder){var e;var d=g;e=a.length;if(0>=d)e=[];else{var f=L(a,d);--e;for(var d=d-2,c=[],k;0<=d;){k=[];for(var l=f[e-1][d]+1;l<e+1;l++)k.push(a[l]);c=[k].concat(c);e=f[e-1][d];--d}d=[];for(f=0;f<e+1;f++)d.push(a[f]);e=[d].concat(c)}return e}e=M(a,g);if(b.options.shuffleUnorderedPartitions){for(c=0;c<e.length;c++)e[c]=A(e[c]);e=A(e)}c=e;for(d=0;d<c.length;d++)for(f=c[d],k=0;k<f.length;k++)h(b.wrapper).append(f[k].element);return e}function L(a,b){for(var e=a.length,d=[],f=0;f<e;f++){for(var c=[],g=0;g<b;g++)c.push(0);d.push(c)}f=[];for(c=0;c<e-1;c++){for(var g=[],l=0;l<b-1;l++)g.push(0);f.push(g)}for(c=0;c<e;c++)d[c][0]=a[c].weight+(0!==c?d[c-1][0]:0);for(c=0;c<b;c++)d[0][c]=a[0].weight;c=function(a,b){return a[0]-b[0]};for(g=1;g<e;g++)for(l=1;l<b;l++){for(var h=[],r=0;r<g;r++)h.push([Math.max(d[r][l-1],d[g][0]-d[r][0]),r]);h=h.sort(c)[0];d[g][l]=h[0];f[g-1][l-1]=h[1]}return f}function M(a,b){for(var g=a.sort(function(a,b){return b.weight-a.weight}),d=Array(b),f=0;f<b;f++)d[f]=[];for(f=0;f<g.length;f++){for(var c=d[0],k=B(c),h=0;h<d.length;h++){var p=B(d[h]);p<k&&(c=d[h],k=p)}c.push(g[f])}return d}function B(a){var b=0;h.each(a,function(a,d){b+=d.weight});return b}function C(){for(var a=b.options.padding,g=0,e=0,d,f=0;f<b.elements.length;f++){f==e&&(d=a*b.resizingValue[g].length,d=(b.options.viewportWidth-d)/b.resizingValue[g].ratio,e+=b.resizingValue[g].length,g++,t=0);var c=b.elements[f].image,h=parseInt(d,10),l=d*q(c),l=w(l);c.width(l);c.height(h)}}function D(){var a=b.options.padding,g=-1,e=0;t=0;for(var d,f,c=0;c<b.elements.length;c++){c==e&&(g++,b.resizingValue[g].columnHeight=0,d=b.options.viewportWidth/b.summedColRatios*b.resizingValue[g].ratio,d-=a,f=w(d),e+=b.resizingValue[g].length);var h=b.elements[c].image,l=parseInt(d*(1/q(h)),10);b.resizingValue[g].columnHeight+=l+a;h.width(f);h.height(l)}}function w(a){var b=parseInt(a,10);t+=a-b;.99999<=t&&(b+=1,--t);return b}function x(a){b.options.viewportWidth+b.options.padding!==h(b.container).width()&&(b.options.viewportWidth=h(b.container).width()-b.options.padding,h(b.wrapper).width(b.options.viewportWidth),"horizontal"==a?C():"vertical"==a?D():"grid"==a&&(b.options.idealWidth=b.options.viewportWidth/b.options.widthDivisor,y()))}function q(a){return a[0].naturalWidth/a[0].naturalHeight}function A(a){for(var b=a.length,e,d;b--;)d=Math.random()*b|0,e=a[b],a[b]=a[d],a[d]=e;return a}var n=[],b,G={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,gridAspectRatio:1,widthDivisor:4},u=null,t=0;h.fn.BalancedGallery=function(a){return this.each(function(){h.data(this,"plugin_BalancedGallery")||h.data(this,"plugin_BalancedGallery",new m(this,a))})};m.prototype.recreate=function(){this.options=h.extend({},this.unadulteratedOptions);h(this.container).css(this.unadulteratedCSS);this.quickResize=!0;this.init();this.createGallery()};m.prototype.init=function(){if(!1===this.quickResize){var a="inline-block";"vertical"==this.options.orientation&&(a="block");this.elements.each(function(){h(this.element).css({display:a,padding:0,margin:0});this.image.css({display:a,padding:0,margin:0})});var b=this.options.padding+"px";h(this.wrapper).css({fontSize:0,paddingTop:b,paddingLeft:b});null!==this.options.background&&h(this.wrapper).css({background:this.options.background})}this.options.viewportWidth=h(this.container).width()-this.options.padding;null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/this.options.widthDivisor);null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.widthDivisor);h(this.wrapper).width(this.options.viewportWidth)};m.prototype.createGallery=function(){var a=this.options.orientation;if("horizontal"===a){var g;if(b.quickResize)C();else{a=Math.round(I()/b.options.viewportWidth);0<a&&1>a&&(a=1);g=J();a=z(g,a);g=b.options.padding;var e=0;b.resizingValue=[];for(var d=0;d<a.length;d++){for(var f=0,c=0;c<a[d].length;c++)f+=a[d][c].weight;b.resizingValue[d]={ratio:f,length:a[d].length};t=0;f=(b.options.viewportWidth-g*a[d].length)/f;for(c=0;c<a[d].length;c++){var k=a[d][c].image;b.elements[e++]={element:a[d][c].element,image:k};var l=parseInt(f,10),p=f*q(k),p=w(p);k.width(p);k.height(l);k.css({margin:0,marginRight:g+"px",marginBottom:g+"px"})}}}x(b.options.orientation)}else if("vertical"===a){if(b.quickResize)D();else{a=Math.round(b.options.viewportWidth/b.options.idealWidth);g=b.elements.length;a=a<=g?a:g;g=K();a=z(g,a);g=h(b.wrapper);for(e=0;e<a.length;e++)for(d="balanced-gallery-col"+e,g.append('<div class="balanced-gallery-column" id="'+d+'" style="display: inline-block; padding: 0; margin: 0;"></div>'),d=h(g.find("div#"+d)),f=0;f<a[e].length;f++)d.append(a[e][f].element);g=b.options.padding;e=[];f=d=0;b.resizingValue=[];for(c=t=0;c<a.length;c++){for(k=e[c]=0;k<a[c].length;k++)e[c]+=a[c][k].weight;e[c]+=g/(b.options.idealWidth-g)*a[c].length;d+=e[c]}b.summedColRatios=d;c=d/a.length;for(k=0;k<a.length;k++){for(var l=c+(c-e[k]),p=b.options.viewportWidth/d*l-g,r=w(p),n=0,m=0;m<a[k].length;m++){var v=a[k][m].image;b.elements[f++]={element:a[k][m].element,image:v};var u=Math.round(p*(1/q(v))),n=n+(u+g);v.width(r);v.height(u);v.css({margin:0,marginRight:g+"px",marginBottom:g+"px"})}b.resizingValue[k]={ratio:l,length:a[k].length,columnHeight:n}}}x(b.options.orientation);for(e=g=a=0;e<b.resizingValue.length;e++)a+=b.resizingValue[e].columnHeight;a=Math.round(a/b.resizingValue.length);for(e=0;e<b.resizingValue.length;e++)for(g+=b.resizingValue[e].length,d=Math.sign(a-b.resizingValue[e].columnHeight),f=g-1;a!=b.resizingValue[e].columnHeight;)b.elements[f].image.height(b.elements[f].image.height()+d),b.resizingValue[e].columnHeight+=d,f--,f<g-b.resizingValue[e].length&&(f=g-1)}else if("grid"===a)y(),x(a);else throw"BalancedGallery: Invalid Orientation.";}})(jQuery,window);
\ No newline at end of file

From b66fc8b3ea4bd17816bb9f3573898a0034ce7d0d Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Sat, 9 Sep 2017 11:30:31 +0200
Subject: [PATCH 17/24] Makes a grid gallery more robust in foreign
 environments

---
 demo_grid.html             |  4 ++++
 jquery.balanced-gallery.js | 10 +++++-----
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/demo_grid.html b/demo_grid.html
index 5a98c4f..6692c1a 100644
--- a/demo_grid.html
+++ b/demo_grid.html
@@ -10,6 +10,10 @@
             height: 100%;
             padding: 0;
             margin: 0;
+            line-height: 12px;
+        }
+        img {
+          max-width: 100%;
         }
     </style>
     <script type="text/javascript">
diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index 74e1680..1ae7209 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -161,7 +161,6 @@
         var cellRatio = balancedGallery.options.gridAspectRatio;
         var cellWidth = parseInt(balancedGallery.options.idealWidth - padding, RADIX);
         var cellHeight = cellWidth * (1 / cellRatio);
-        var wrapper = '<div></div>';
         var paddingGap = parseInt(((balancedGallery.options.viewportWidth % balancedGallery.options.widthDivisor) / 2), RADIX);
         
         //if necessary, increase the padding on the left side of the wrapper so the grid is more centered
@@ -181,12 +180,12 @@
                 $image.height(cellHeight);
                 $image.width(cellHeight * imgRatio);
                 offset = (cellWidth - (cellHeight * imgRatio)) / 2;
-                $image.css({left: offset+'px', position: 'absolute'});
+                $image.css({left: offset+'px', position: 'absolute', maxWidth: 'none'});
             } else if(imgRatio < cellRatio) {
                 $image.width(cellWidth);
                 $image.height(cellWidth * (1/imgRatio));
                 offset = (cellHeight - (cellWidth * (1/imgRatio))) / 2;
-                $image.css({top: offset+'px', position: 'absolute'});
+                $image.css({top: offset+'px', position: 'absolute', maxWidth: 'none'});
             }
             
             if(balancedGallery.quickResize) {
@@ -194,10 +193,11 @@
                 $div.width(cellWidth);
                 $div.height(cellHeight);
             } else {
-                $image.wrap(wrapper);
-                $($image[0].parentNode).css({position: 'relative', display: 'inline-block', overflow: 'hidden', width: cellWidth+'px', height: cellHeight+'px', margin: 0, marginRight: padding+'px', marginBottom: padding+'px'});
+                $image.wrap('<div></div>');
+                $($image[0].parentNode).css({position: 'relative', 'float': 'left', 'overflow': 'hidden', width: cellWidth+'px', height: cellHeight+'px', margin: 0, marginRight: padding+'px', marginBottom: padding+'px'});
             }
         });
+        $(balancedGallery.wrapper).append('<div style="clear: both;"></div>');
     }
 
     function getRows () {

From 22eeaaf901de0797d675f4382c9aef8548d2e34c Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Sun, 10 Sep 2017 15:52:43 +0200
Subject: [PATCH 18/24] Directly save and use JQuery objects of container
 elements instead of recreating them always again

---
 jquery.balanced-gallery.js     | 40 ++++++++++++++++------------------
 jquery.balanced-gallery.min.js |  2 +-
 2 files changed, 20 insertions(+), 22 deletions(-)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index 1ae7209..4d261f4 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -33,10 +33,10 @@
     function BalancedGallery(container, options) {
         balancedGallery = this // for contexts when 'this' doesn't refer to the BalancedGallery class.
         galleries.push(this);
-        this.container = container;
-        $(this.container).wrapInner('<div class="balanced-gallery-wrapper"></div>');
-        this.wrapper = $(this.container).children()[0];
-        this.elements = $(this.wrapper).children().map(function(){
+        this.container = $(container);
+        this.container.wrapInner('<div class="balanced-gallery-wrapper"></div>');
+        this.wrapper = $(this.container.children()[0]);
+        this.elements = this.wrapper.children().map(function(){
             var img = $(this).find('img')[0];
             if(img === undefined) {
                 img = this;
@@ -47,7 +47,7 @@
         this.options.orientation = (this.options.orientation).toLowerCase();
 
         if(this.options.autoResize) {
-            this.unadulteratedCSS = {width: $(this.container)[0].style.width};
+            this.unadulteratedCSS = {width: this.container[0].style.width};
             this.unadulteratedOptions = $.extend({}, this.options);
             setupAutoResize();
         }
@@ -74,7 +74,7 @@
 
     BalancedGallery.prototype.recreate = function () {
         this.options = $.extend({}, this.unadulteratedOptions);
-        $(this.container).css(this.unadulteratedCSS); //used to reset width so it's calculated from browser
+        this.container.css(this.unadulteratedCSS); //used to reset width so it's calculated from browser
 
         this.quickResize = true;
         this.init();
@@ -93,14 +93,14 @@
             });
 
             var padding = this.options.padding + 'px';
-            $(this.wrapper).css({fontSize: 0, paddingTop: padding, paddingLeft: padding});
+            this.wrapper.css({fontSize: 0, paddingTop: padding, paddingLeft: padding});
 
             if(this.options.background !== null) {
-                $(this.wrapper).css({background: this.options.background});
+                this.wrapper.css({background: this.options.background});
             }
         }
 
-        this.options.viewportWidth = $(this.container).width() - this.options.padding;
+        this.options.viewportWidth = this.container.width() - this.options.padding;
 
         if(this.options.idealWidth === null) {
             this.options.idealWidth = this.options.viewportWidth / this.options.widthDivisor;
@@ -111,7 +111,7 @@
         }
 
         //setting explicit width prevents image wrapping on resizing
-        $(this.wrapper).width(this.options.viewportWidth);
+        this.wrapper.width(this.options.viewportWidth);
     };
 
     BalancedGallery.prototype.createGallery = function() {
@@ -166,9 +166,8 @@
         //if necessary, increase the padding on the left side of the wrapper so the grid is more centered
         if(paddingGap > 0) {
             var increasedPadding = paddingGap + padding;
-            var $wrapper = $(balancedGallery.wrapper);
-            $wrapper.css({paddingLeft: increasedPadding+'px'});
-            $wrapper.width(balancedGallery.options.viewportWidth - paddingGap);
+            balancedGallery.wrapper.css({paddingLeft: increasedPadding+'px'});
+            balancedGallery.wrapper.width(balancedGallery.options.viewportWidth - paddingGap);
         }
 
         balancedGallery.elements.each(function(){
@@ -197,7 +196,7 @@
                 $($image[0].parentNode).css({position: 'relative', 'float': 'left', 'overflow': 'hidden', width: cellWidth+'px', height: cellHeight+'px', margin: 0, marginRight: padding+'px', marginBottom: padding+'px'});
             }
         });
-        $(balancedGallery.wrapper).append('<div style="clear: both;"></div>');
+        balancedGallery.wrapper.append('<div style="clear: both;"></div>');
     }
 
     function getRows () {
@@ -375,7 +374,7 @@
         for(var i = 0; i < partitions.length; i++) {
             var subPartition = partitions[i];
             for(var j = 0; j < subPartition.length; j++) {
-                $(balancedGallery.wrapper).append(subPartition[j].element);
+                balancedGallery.wrapper.append(subPartition[j].element);
             }
         }
     }
@@ -532,9 +531,9 @@
     
     //if a scrollbar appears or disappears after resizing
     function checkWidth(orientation) {
-        if((balancedGallery.options.viewportWidth + balancedGallery.options.padding) !== $(balancedGallery.container).width()) {
-            balancedGallery.options.viewportWidth = $(balancedGallery.container).width() - balancedGallery.options.padding;
-            $(balancedGallery.wrapper).width(balancedGallery.options.viewportWidth);
+        if((balancedGallery.options.viewportWidth + balancedGallery.options.padding) !== balancedGallery.container.width()) {
+            balancedGallery.options.viewportWidth = balancedGallery.container.width() - balancedGallery.options.padding;
+            balancedGallery.wrapper.width(balancedGallery.options.viewportWidth);
             if(orientation == 'horizontal') {
                 quickResizeHorizontal();
             } else if(orientation == 'vertical') {
@@ -547,12 +546,11 @@
     }
 
     function orientElementsVertically(partitions) {
-        var $wrapper = $(balancedGallery.wrapper);
         for(var i = 0; i < partitions.length; i++) {
             var colName = 'balanced-gallery-col'+i;
             var column = '<div class="balanced-gallery-column" id="'+colName+'" style="display: inline-block; padding: 0; margin: 0;"></div>';
-            $wrapper.append(column);
-            var $col = $($wrapper.find("div#"+colName));
+            balancedGallery.wrapper.append(column);
+            var $col = $(balancedGallery.wrapper.find("div#"+colName));
             for(var j = 0; j < partitions[i].length; j++) {
                 $col.append(partitions[i][j].element);
             }
diff --git a/jquery.balanced-gallery.min.js b/jquery.balanced-gallery.min.js
index ca0f171..5eebfcf 100644
--- a/jquery.balanced-gallery.min.js
+++ b/jquery.balanced-gallery.min.js
@@ -1 +1 @@
-(function(h,E,F){function m(a,g){b=this;n.push(this);this.container=a;h(this.container).wrapInner('<div class="balanced-gallery-wrapper"></div>');this.wrapper=h(this.container).children()[0];this.elements=h(this.wrapper).children().map(function(){var a=h(this).find("img")[0];a===F&&(a=this);return{element:this,image:h(a)}});this.options=h.extend({},G,g);this.options.orientation=this.options.orientation.toLowerCase();this.options.autoResize&&(this.unadulteratedCSS={width:h(this.container)[0].style.width},this.unadulteratedOptions=h.extend({},this.options),H());this.quickResize=!1;this.init();this.createGallery()}function H(){h(E).resize(function(){clearTimeout(u);u=setTimeout(function(){for(var a=0;a<n.length;a++)n[a].options.autoResize&&(b=n[a],n[a].recreate())},500)})}function y(){var a=b.options.padding,g=b.options.gridAspectRatio,e=parseInt(b.options.idealWidth-a,10),d=1/g*e,f=parseInt(b.options.viewportWidth%b.options.widthDivisor/2,10);if(0<f){var c=f+a,k=h(b.wrapper);k.css({paddingLeft:c+"px"});k.width(b.options.viewportWidth-f)}b.elements.each(function(){var c=this.image,f=q(c);f>=g?(c.height(d),c.width(d*f),f=(e-d*f)/2,c.css({left:f+"px",position:"absolute"})):f<g&&(c.width(e),c.height(1/f*e),f=(d-1/f*e)/2,c.css({top:f+"px",position:"absolute"}));b.quickResize?(c=c.parent(),c.width(e),c.height(d)):(c.wrap("<div></div>"),h(c[0].parentNode).css({position:"relative",display:"inline-block",overflow:"hidden",width:e+"px",height:d+"px",margin:0,marginRight:a+"px",marginBottom:a+"px"}))})}function I(){var a=0;b.elements.each(function(){a+=q(this.image)*b.options.idealHeight+b.options.padding});return a}function J(){return b.elements.map(function(){var a=q(this.image);return{element:this.element,image:this.image,weight:a}})}function K(){return b.elements.map(function(){var a=1/q(this.image);return{element:this.element,image:this.image,weight:a}})}function z(a,g){if(b.options.maintainOrder){var e;var d=g;e=a.length;if(0>=d)e=[];else{var f=L(a,d);--e;for(var d=d-2,c=[],k;0<=d;){k=[];for(var l=f[e-1][d]+1;l<e+1;l++)k.push(a[l]);c=[k].concat(c);e=f[e-1][d];--d}d=[];for(f=0;f<e+1;f++)d.push(a[f]);e=[d].concat(c)}return e}e=M(a,g);if(b.options.shuffleUnorderedPartitions){for(c=0;c<e.length;c++)e[c]=A(e[c]);e=A(e)}c=e;for(d=0;d<c.length;d++)for(f=c[d],k=0;k<f.length;k++)h(b.wrapper).append(f[k].element);return e}function L(a,b){for(var e=a.length,d=[],f=0;f<e;f++){for(var c=[],g=0;g<b;g++)c.push(0);d.push(c)}f=[];for(c=0;c<e-1;c++){for(var g=[],l=0;l<b-1;l++)g.push(0);f.push(g)}for(c=0;c<e;c++)d[c][0]=a[c].weight+(0!==c?d[c-1][0]:0);for(c=0;c<b;c++)d[0][c]=a[0].weight;c=function(a,b){return a[0]-b[0]};for(g=1;g<e;g++)for(l=1;l<b;l++){for(var h=[],r=0;r<g;r++)h.push([Math.max(d[r][l-1],d[g][0]-d[r][0]),r]);h=h.sort(c)[0];d[g][l]=h[0];f[g-1][l-1]=h[1]}return f}function M(a,b){for(var g=a.sort(function(a,b){return b.weight-a.weight}),d=Array(b),f=0;f<b;f++)d[f]=[];for(f=0;f<g.length;f++){for(var c=d[0],k=B(c),h=0;h<d.length;h++){var p=B(d[h]);p<k&&(c=d[h],k=p)}c.push(g[f])}return d}function B(a){var b=0;h.each(a,function(a,d){b+=d.weight});return b}function C(){for(var a=b.options.padding,g=0,e=0,d,f=0;f<b.elements.length;f++){f==e&&(d=a*b.resizingValue[g].length,d=(b.options.viewportWidth-d)/b.resizingValue[g].ratio,e+=b.resizingValue[g].length,g++,t=0);var c=b.elements[f].image,h=parseInt(d,10),l=d*q(c),l=w(l);c.width(l);c.height(h)}}function D(){var a=b.options.padding,g=-1,e=0;t=0;for(var d,f,c=0;c<b.elements.length;c++){c==e&&(g++,b.resizingValue[g].columnHeight=0,d=b.options.viewportWidth/b.summedColRatios*b.resizingValue[g].ratio,d-=a,f=w(d),e+=b.resizingValue[g].length);var h=b.elements[c].image,l=parseInt(d*(1/q(h)),10);b.resizingValue[g].columnHeight+=l+a;h.width(f);h.height(l)}}function w(a){var b=parseInt(a,10);t+=a-b;.99999<=t&&(b+=1,--t);return b}function x(a){b.options.viewportWidth+b.options.padding!==h(b.container).width()&&(b.options.viewportWidth=h(b.container).width()-b.options.padding,h(b.wrapper).width(b.options.viewportWidth),"horizontal"==a?C():"vertical"==a?D():"grid"==a&&(b.options.idealWidth=b.options.viewportWidth/b.options.widthDivisor,y()))}function q(a){return a[0].naturalWidth/a[0].naturalHeight}function A(a){for(var b=a.length,e,d;b--;)d=Math.random()*b|0,e=a[b],a[b]=a[d],a[d]=e;return a}var n=[],b,G={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,gridAspectRatio:1,widthDivisor:4},u=null,t=0;h.fn.BalancedGallery=function(a){return this.each(function(){h.data(this,"plugin_BalancedGallery")||h.data(this,"plugin_BalancedGallery",new m(this,a))})};m.prototype.recreate=function(){this.options=h.extend({},this.unadulteratedOptions);h(this.container).css(this.unadulteratedCSS);this.quickResize=!0;this.init();this.createGallery()};m.prototype.init=function(){if(!1===this.quickResize){var a="inline-block";"vertical"==this.options.orientation&&(a="block");this.elements.each(function(){h(this.element).css({display:a,padding:0,margin:0});this.image.css({display:a,padding:0,margin:0})});var b=this.options.padding+"px";h(this.wrapper).css({fontSize:0,paddingTop:b,paddingLeft:b});null!==this.options.background&&h(this.wrapper).css({background:this.options.background})}this.options.viewportWidth=h(this.container).width()-this.options.padding;null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/this.options.widthDivisor);null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.widthDivisor);h(this.wrapper).width(this.options.viewportWidth)};m.prototype.createGallery=function(){var a=this.options.orientation;if("horizontal"===a){var g;if(b.quickResize)C();else{a=Math.round(I()/b.options.viewportWidth);0<a&&1>a&&(a=1);g=J();a=z(g,a);g=b.options.padding;var e=0;b.resizingValue=[];for(var d=0;d<a.length;d++){for(var f=0,c=0;c<a[d].length;c++)f+=a[d][c].weight;b.resizingValue[d]={ratio:f,length:a[d].length};t=0;f=(b.options.viewportWidth-g*a[d].length)/f;for(c=0;c<a[d].length;c++){var k=a[d][c].image;b.elements[e++]={element:a[d][c].element,image:k};var l=parseInt(f,10),p=f*q(k),p=w(p);k.width(p);k.height(l);k.css({margin:0,marginRight:g+"px",marginBottom:g+"px"})}}}x(b.options.orientation)}else if("vertical"===a){if(b.quickResize)D();else{a=Math.round(b.options.viewportWidth/b.options.idealWidth);g=b.elements.length;a=a<=g?a:g;g=K();a=z(g,a);g=h(b.wrapper);for(e=0;e<a.length;e++)for(d="balanced-gallery-col"+e,g.append('<div class="balanced-gallery-column" id="'+d+'" style="display: inline-block; padding: 0; margin: 0;"></div>'),d=h(g.find("div#"+d)),f=0;f<a[e].length;f++)d.append(a[e][f].element);g=b.options.padding;e=[];f=d=0;b.resizingValue=[];for(c=t=0;c<a.length;c++){for(k=e[c]=0;k<a[c].length;k++)e[c]+=a[c][k].weight;e[c]+=g/(b.options.idealWidth-g)*a[c].length;d+=e[c]}b.summedColRatios=d;c=d/a.length;for(k=0;k<a.length;k++){for(var l=c+(c-e[k]),p=b.options.viewportWidth/d*l-g,r=w(p),n=0,m=0;m<a[k].length;m++){var v=a[k][m].image;b.elements[f++]={element:a[k][m].element,image:v};var u=Math.round(p*(1/q(v))),n=n+(u+g);v.width(r);v.height(u);v.css({margin:0,marginRight:g+"px",marginBottom:g+"px"})}b.resizingValue[k]={ratio:l,length:a[k].length,columnHeight:n}}}x(b.options.orientation);for(e=g=a=0;e<b.resizingValue.length;e++)a+=b.resizingValue[e].columnHeight;a=Math.round(a/b.resizingValue.length);for(e=0;e<b.resizingValue.length;e++)for(g+=b.resizingValue[e].length,d=Math.sign(a-b.resizingValue[e].columnHeight),f=g-1;a!=b.resizingValue[e].columnHeight;)b.elements[f].image.height(b.elements[f].image.height()+d),b.resizingValue[e].columnHeight+=d,f--,f<g-b.resizingValue[e].length&&(f=g-1)}else if("grid"===a)y(),x(a);else throw"BalancedGallery: Invalid Orientation.";}})(jQuery,window);
\ No newline at end of file
+(function(l,E,F){function m(a,f){b=this;n.push(this);this.container=l(a);this.container.wrapInner('<div class="balanced-gallery-wrapper"></div>');this.wrapper=l(this.container.children()[0]);this.elements=this.wrapper.children().map(function(){var a=l(this).find("img")[0];a===F&&(a=this);return{element:this,image:l(a)}});this.options=l.extend({},G,f);this.options.orientation=this.options.orientation.toLowerCase();this.options.autoResize&&(this.unadulteratedCSS={width:this.container[0].style.width},this.unadulteratedOptions=l.extend({},this.options),H());this.quickResize=!1;this.init();this.createGallery()}function H(){l(E).resize(function(){clearTimeout(u);u=setTimeout(function(){for(var a=0;a<n.length;a++)n[a].options.autoResize&&(b=n[a],n[a].recreate())},500)})}function y(){var a=b.options.padding,f=b.options.gridAspectRatio,e=parseInt(b.options.idealWidth-a,10),d=1/f*e,h=parseInt(b.options.viewportWidth%b.options.widthDivisor/2,10);0<h&&(b.wrapper.css({paddingLeft:h+a+"px"}),b.wrapper.width(b.options.viewportWidth-h));b.elements.each(function(){var c=this.image,g=p(c);g>=f?(c.height(d),c.width(d*g),g=(e-d*g)/2,c.css({left:g+"px",position:"absolute",maxWidth:"none"})):g<f&&(c.width(e),c.height(1/g*e),g=(d-1/g*e)/2,c.css({top:g+"px",position:"absolute",maxWidth:"none"}));b.quickResize?(c=c.parent(),c.width(e),c.height(d)):(c.wrap("<div></div>"),l(c[0].parentNode).css({position:"relative","float":"left",overflow:"hidden",width:e+"px",height:d+"px",margin:0,marginRight:a+"px",marginBottom:a+"px"}))});b.wrapper.append('<div style="clear: both;"></div>')}function I(){var a=0;b.elements.each(function(){a+=p(this.image)*b.options.idealHeight+b.options.padding});return a}function J(){return b.elements.map(function(){var a=p(this.image);return{element:this.element,image:this.image,weight:a}})}function K(){return b.elements.map(function(){var a=1/p(this.image);return{element:this.element,image:this.image,weight:a}})}function z(a,f){if(b.options.maintainOrder){var e=f;var d=a.length;if(0>=e)d=[];else{var h=L(a,e);--d;e-=2;for(var c=[],g;0<=e;){g=[];for(var k=h[d-1][e]+1;k<d+1;k++)g.push(a[k]);c=[g].concat(c);d=h[d-1][e];--e}e=[];for(h=0;h<d+1;h++)e.push(a[h]);d=[e].concat(c)}return d}d=M(a,f);if(b.options.shuffleUnorderedPartitions){for(c=0;c<d.length;c++)d[c]=A(d[c]);d=A(d)}c=d;for(e=0;e<c.length;e++)for(h=c[e],g=0;g<h.length;g++)b.wrapper.append(h[g].element);return d}function L(a,b){for(var e=a.length,d=[],f=0;f<e;f++){for(var c=[],g=0;g<b;g++)c.push(0);d.push(c)}f=[];for(c=0;c<e-1;c++){g=[];for(var k=0;k<b-1;k++)g.push(0);f.push(g)}for(c=0;c<e;c++)d[c][0]=a[c].weight+(0!==c?d[c-1][0]:0);for(c=0;c<b;c++)d[0][c]=a[0].weight;c=function(a,b){return a[0]-b[0]};for(g=1;g<e;g++)for(k=1;k<b;k++){for(var l=[],q=0;q<g;q++)l.push([Math.max(d[q][k-1],d[g][0]-d[q][0]),q]);l=l.sort(c)[0];d[g][k]=l[0];f[g-1][k-1]=l[1]}return f}function M(a,b){for(var f=a.sort(function(a,b){return b.weight-a.weight}),d=Array(b),h=0;h<b;h++)d[h]=[];for(h=0;h<f.length;h++){for(var c=d[0],g=B(c),k=0;k<d.length;k++){var l=B(d[k]);l<g&&(c=d[k],g=l)}c.push(f[h])}return d}function B(a){var b=0;l.each(a,function(a,d){b+=d.weight});return b}function C(){for(var a=b.options.padding,f=0,e=0,d,h=0;h<b.elements.length;h++){h==e&&(d=a*b.resizingValue[f].length,d=(b.options.viewportWidth-d)/b.resizingValue[f].ratio,e+=b.resizingValue[f].length,f++,r=0);var c=b.elements[h].image,g=parseInt(d,10),k=d*p(c);k=w(k);c.width(k);c.height(g)}}function D(){var a=b.options.padding,f=-1,e=0;r=0;for(var d,h,c=0;c<b.elements.length;c++){c==e&&(f++,b.resizingValue[f].columnHeight=0,d=b.options.viewportWidth/b.summedColRatios*b.resizingValue[f].ratio,d-=a,h=w(d),e+=b.resizingValue[f].length);var g=b.elements[c].image,k=parseInt(d*(1/p(g)),10);b.resizingValue[f].columnHeight+=k+a;g.width(h);g.height(k)}}function w(a){var b=parseInt(a,10);r+=a-b;.99999<=r&&(b+=1,--r);return b}function x(a){b.options.viewportWidth+b.options.padding!==b.container.width()&&(b.options.viewportWidth=b.container.width()-b.options.padding,b.wrapper.width(b.options.viewportWidth),"horizontal"==a?C():"vertical"==a?D():"grid"==a&&(b.options.idealWidth=b.options.viewportWidth/b.options.widthDivisor,y()))}function p(a){return a[0].naturalWidth/a[0].naturalHeight}function A(a){for(var b=a.length,e,d;b--;)d=Math.random()*b|0,e=a[b],a[b]=a[d],a[d]=e;return a}var n=[],b,G={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,gridAspectRatio:1,widthDivisor:4},u=null,r=0;l.fn.BalancedGallery=function(a){return this.each(function(){l.data(this,"plugin_BalancedGallery")||l.data(this,"plugin_BalancedGallery",new m(this,a))})};m.prototype.recreate=function(){this.options=l.extend({},this.unadulteratedOptions);this.container.css(this.unadulteratedCSS);this.quickResize=!0;this.init();this.createGallery()};m.prototype.init=function(){if(!1===this.quickResize){var a="inline-block";"vertical"==this.options.orientation&&(a="block");this.elements.each(function(){l(this.element).css({display:a,padding:0,margin:0});this.image.css({display:a,padding:0,margin:0})});var b=this.options.padding+"px";this.wrapper.css({fontSize:0,paddingTop:b,paddingLeft:b});null!==this.options.background&&this.wrapper.css({background:this.options.background})}this.options.viewportWidth=this.container.width()-this.options.padding;null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/this.options.widthDivisor);null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.widthDivisor);this.wrapper.width(this.options.viewportWidth)};m.prototype.createGallery=function(){var a=this.options.orientation;if("horizontal"===a){if(b.quickResize)C();else{a=Math.round(I()/b.options.viewportWidth);0<a&&1>a&&(a=1);var f=J();a=z(f,a);f=b.options.padding;var e=0;b.resizingValue=[];for(var d=0;d<a.length;d++){for(var h=0,c=0;c<a[d].length;c++)h+=a[d][c].weight;b.resizingValue[d]={ratio:h,length:a[d].length};r=0;h=(b.options.viewportWidth-f*a[d].length)/h;for(c=0;c<a[d].length;c++){var g=a[d][c].image;b.elements[e++]={element:a[d][c].element,image:g};var k=parseInt(h,10),t=h*p(g);t=w(t);g.width(t);g.height(k);g.css({margin:0,marginRight:f+"px",marginBottom:f+"px"})}}}x(b.options.orientation)}else if("vertical"===a){if(b.quickResize)D();else{a=Math.round(b.options.viewportWidth/b.options.idealWidth);f=b.elements.length;a=a<=f?a:f;f=K();a=z(f,a);for(f=0;f<a.length;f++)for(e="balanced-gallery-col"+f,b.wrapper.append('<div class="balanced-gallery-column" id="'+e+'" style="display: inline-block; padding: 0; margin: 0;"></div>'),e=l(b.wrapper.find("div#"+e)),d=0;d<a[f].length;d++)e.append(a[f][d].element);f=b.options.padding;e=[];h=d=0;b.resizingValue=[];for(c=r=0;c<a.length;c++){for(g=e[c]=0;g<a[c].length;g++)e[c]+=a[c][g].weight;e[c]+=f/(b.options.idealWidth-f)*a[c].length;d+=e[c]}b.summedColRatios=d;c=d/a.length;for(g=0;g<a.length;g++){k=c+(c-e[g]);t=b.options.viewportWidth/d*k-f;for(var q=w(t),n=0,m=0;m<a[g].length;m++){var v=a[g][m].image;b.elements[h++]={element:a[g][m].element,image:v};var u=Math.round(t*(1/p(v)));n+=u+f;v.width(q);v.height(u);v.css({margin:0,marginRight:f+"px",marginBottom:f+"px"})}b.resizingValue[g]={ratio:k,length:a[g].length,columnHeight:n}}}x(b.options.orientation);for(e=f=a=0;e<b.resizingValue.length;e++)a+=b.resizingValue[e].columnHeight;a=Math.round(a/b.resizingValue.length);for(e=0;e<b.resizingValue.length;e++)for(f+=b.resizingValue[e].length,d=Math.sign(a-b.resizingValue[e].columnHeight),h=f-1;a!=b.resizingValue[e].columnHeight;)b.elements[h].image.height(b.elements[h].image.height()+d),b.resizingValue[e].columnHeight+=d,h--,h<f-b.resizingValue[e].length&&(h=f-1)}else if("grid"===a)y(),x(a);else throw"BalancedGallery: Invalid Orientation.";}})(jQuery,window);
\ No newline at end of file

From 4ec4dbf72a63ea1148ca2270982b00166a198ef5 Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Wed, 13 Sep 2017 23:12:19 +0200
Subject: [PATCH 19/24] Small logic bug

---
 jquery.balanced-gallery.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index 4d261f4..e8448a2 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -200,11 +200,11 @@
     }
 
     function getRows () {
-        var rows = Math.round(collectiveIdealWidth() / balancedGallery.options.viewportWidth);
+        var rows = collectiveIdealWidth() / balancedGallery.options.viewportWidth;
         if(rows > 0 && rows < 1) { // if it's BETWEEN 0 and 1 means there is at least one image
             rows = 1;
         }
-        return rows;
+        return Math.round(rows);
     }
 
     function getColumns() {

From 92f99add13b933f3f0582e4470c2f0958f2a88f5 Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Thu, 14 Sep 2017 00:38:19 +0200
Subject: [PATCH 20/24] Added random order for images in grid mode through the
 options maintainOrder and shuffleUnoreredPartition

---
 jquery.balanced-gallery.js | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index e8448a2..00d99ae 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -60,7 +60,6 @@
     function setupAutoResize() {
         $(window).resize(function() {
             clearTimeout(resizeTimeout);
-
             resizeTimeout = setTimeout(function() {
                 for(var index = 0; index < galleries.length; index++) {
                     if(galleries[index].options.autoResize) {
@@ -122,7 +121,6 @@
             createVerticalGallery();
         } else if(orientation === 'grid') {
             createGridGallery();
-            checkWidth(orientation);
         } else {
             throw("BalancedGallery: Invalid Orientation.");
         }
@@ -157,6 +155,17 @@
     }
     
     function createGridGallery() {
+        if(!balancedGallery.quickResize && !balancedGallery.options.maintainOrder && balancedGallery.options.shuffleUnorderedPartitions) {
+            shuffleArray(balancedGallery.elements);
+            for(var i = 0; i < balancedGallery.elements.length; i++) {
+                balancedGallery.wrapper.append(balancedGallery.elements[i].element);
+            }
+        }
+        resizeGridElements();
+        checkWidth(balancedGallery.options.orientation);
+    }
+    
+    function resizeGridElements() {
         var padding = balancedGallery.options.padding;
         var cellRatio = balancedGallery.options.gridAspectRatio;
         var cellWidth = parseInt(balancedGallery.options.idealWidth - padding, RADIX);
@@ -540,7 +549,7 @@
                 quickResizeVertical();
             } else if(orientation == 'grid') {
                 balancedGallery.options.idealWidth = balancedGallery.options.viewportWidth / balancedGallery.options.widthDivisor;
-                createGridGallery();
+                resizeGridElements();
             }
         }
     }

From 0378d219b750d51c286c73d6684d9572958a68d0 Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Thu, 14 Sep 2017 00:49:33 +0200
Subject: [PATCH 21/24] Bugfix: clearing div was added several times

---
 jquery.balanced-gallery.js | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index 00d99ae..857d05b 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -155,11 +155,14 @@
     }
     
     function createGridGallery() {
-        if(!balancedGallery.quickResize && !balancedGallery.options.maintainOrder && balancedGallery.options.shuffleUnorderedPartitions) {
-            shuffleArray(balancedGallery.elements);
-            for(var i = 0; i < balancedGallery.elements.length; i++) {
-                balancedGallery.wrapper.append(balancedGallery.elements[i].element);
+        if(!balancedGallery.quickResize) {
+            if(!balancedGallery.options.maintainOrder && balancedGallery.options.shuffleUnorderedPartitions) {
+                shuffleArray(balancedGallery.elements);
+                for(var i = 0; i < balancedGallery.elements.length; i++) {
+                    balancedGallery.wrapper.append(balancedGallery.elements[i].element);
+                }
             }
+            balancedGallery.wrapper.append('<div style="clear: both;"></div>');
         }
         resizeGridElements();
         checkWidth(balancedGallery.options.orientation);
@@ -205,7 +208,6 @@
                 $($image[0].parentNode).css({position: 'relative', 'float': 'left', 'overflow': 'hidden', width: cellWidth+'px', height: cellHeight+'px', margin: 0, marginRight: padding+'px', marginBottom: padding+'px'});
             }
         });
-        balancedGallery.wrapper.append('<div style="clear: both;"></div>');
     }
 
     function getRows () {

From b9f0c36d7a4a1674d9c39de9330afaa8c3e80ee3 Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Thu, 14 Sep 2017 11:41:37 +0200
Subject: [PATCH 22/24] Reorder functions

---
 jquery.balanced-gallery.js | 86 +++++++++++++++++++-------------------
 1 file changed, 43 insertions(+), 43 deletions(-)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index 857d05b..70290f8 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -254,6 +254,10 @@
         });
     }
 
+    function aspectRatio($image) {
+        return $image[0].naturalWidth / $image[0].naturalHeight;
+    }
+
     function getPartitions(weights, sections) {
         if(balancedGallery.options.maintainOrder) {
             return getOrderedPartition(weights, sections);
@@ -390,6 +394,29 @@
         }
     }
 
+    function shuffleArray(array) {
+        var counter = array.length, temp, index;
+        while (counter--) {
+            index = (Math.random() * counter) | 0; //not a typo
+            temp = array[counter];
+            array[counter] = array[index];
+            array[index] = temp;
+        }
+        return array;
+    }
+
+    function orientElementsVertically(partitions) {
+        for(var i = 0; i < partitions.length; i++) {
+            var colName = 'balanced-gallery-col'+i;
+            var column = '<div class="balanced-gallery-column" id="'+colName+'" style="display: inline-block; padding: 0; margin: 0;"></div>';
+            balancedGallery.wrapper.append(column);
+            var $col = $(balancedGallery.wrapper.find("div#"+colName));
+            for(var j = 0; j < partitions[i].length; j++) {
+                $col.append(partitions[i][j].element);
+            }
+        }
+    }
+
     function resizeHorizontalElements(partitions) {
         var padding = balancedGallery.options.padding;
         var index = 0;
@@ -513,6 +540,22 @@
         }
         return parsedWidth;
     }
+    
+    //if a scrollbar appears or disappears after resizing
+    function checkWidth(orientation) {
+        if((balancedGallery.options.viewportWidth + balancedGallery.options.padding) !== balancedGallery.container.width()) {
+            balancedGallery.options.viewportWidth = balancedGallery.container.width() - balancedGallery.options.padding;
+            balancedGallery.wrapper.width(balancedGallery.options.viewportWidth);
+            if(orientation == 'horizontal') {
+                quickResizeHorizontal();
+            } else if(orientation == 'vertical') {
+                quickResizeVertical();
+            } else if(orientation == 'grid') {
+                balancedGallery.options.idealWidth = balancedGallery.options.viewportWidth / balancedGallery.options.widthDivisor;
+                resizeGridElements();
+            }
+        }
+    }
 
     //stretch or shrink image by image, pixel by pixel to get exact same column heights
     function alignColumnHeights() {
@@ -539,48 +582,5 @@
             }
         }
     }
-    
-    //if a scrollbar appears or disappears after resizing
-    function checkWidth(orientation) {
-        if((balancedGallery.options.viewportWidth + balancedGallery.options.padding) !== balancedGallery.container.width()) {
-            balancedGallery.options.viewportWidth = balancedGallery.container.width() - balancedGallery.options.padding;
-            balancedGallery.wrapper.width(balancedGallery.options.viewportWidth);
-            if(orientation == 'horizontal') {
-                quickResizeHorizontal();
-            } else if(orientation == 'vertical') {
-                quickResizeVertical();
-            } else if(orientation == 'grid') {
-                balancedGallery.options.idealWidth = balancedGallery.options.viewportWidth / balancedGallery.options.widthDivisor;
-                resizeGridElements();
-            }
-        }
-    }
-
-    function orientElementsVertically(partitions) {
-        for(var i = 0; i < partitions.length; i++) {
-            var colName = 'balanced-gallery-col'+i;
-            var column = '<div class="balanced-gallery-column" id="'+colName+'" style="display: inline-block; padding: 0; margin: 0;"></div>';
-            balancedGallery.wrapper.append(column);
-            var $col = $(balancedGallery.wrapper.find("div#"+colName));
-            for(var j = 0; j < partitions[i].length; j++) {
-                $col.append(partitions[i][j].element);
-            }
-        }
-    }
-
-    function aspectRatio($image) {
-        return $image[0].naturalWidth / $image[0].naturalHeight;
-    }
-
-    function shuffleArray(array) {
-        var counter = array.length, temp, index;
-        while (counter--) {
-            index = (Math.random() * counter) | 0; //not a typo
-            temp = array[counter];
-            array[counter] = array[index];
-            array[index] = temp;
-        }
-        return array;
-    }
 
 }(jQuery, window));
\ No newline at end of file

From 8af7e2bd4b667f5fc26f08aca5aca6fe2afc3a39 Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Sat, 16 Sep 2017 13:49:12 +0200
Subject: [PATCH 23/24] Use more Vanilla JS

---
 jquery.balanced-gallery.js | 144 +++++++++++++++++++------------------
 1 file changed, 76 insertions(+), 68 deletions(-)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index 70290f8..aa0e29a 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -34,21 +34,25 @@
         balancedGallery = this // for contexts when 'this' doesn't refer to the BalancedGallery class.
         galleries.push(this);
         this.container = $(container);
-        this.container.wrapInner('<div class="balanced-gallery-wrapper"></div>');
-        this.wrapper = $(this.container.children()[0]);
-        this.elements = this.wrapper.children().map(function(){
-            var img = $(this).find('img')[0];
-            if(img === undefined) {
-                img = this;
+        this.container[0].innerHTML = '<div class="balanced-gallery-wrapper">' + this.container[0].innerHTML + '</div>';
+        this.wrapper = $(this.container[0].children[0]);
+        this.elements = [];
+
+        var children = this.wrapper[0].children;
+        for(var i = 0; i < children.length; i++) {
+            var img = children[i].querySelector('img');
+            if(img === null) {
+                img = children[i];
             }
-            return {element: this, image: $(img)};
-        });
-        this.options = $.extend({}, defaults, options); // merge arg options and defaults
+            this.elements.push({element: children[i], image: $(img)});
+        }
+
+        this.options = extend(defaults, options); // merge arg options and defaults
         this.options.orientation = (this.options.orientation).toLowerCase();
 
         if(this.options.autoResize) {
             this.unadulteratedCSS = {width: this.container[0].style.width};
-            this.unadulteratedOptions = $.extend({}, this.options);
+            this.unadulteratedOptions = extend(this.options);
             setupAutoResize();
         }
 
@@ -57,6 +61,19 @@
         this.createGallery();
     }
 
+    function extend() {
+        var extended = {};
+        for(var key in arguments) {
+            var argument = arguments[key];
+            for (var prop in argument) {
+                if (argument.hasOwnProperty(prop)) {
+                    extended[prop] = argument[prop];
+                }
+            }
+        }
+        return extended;
+    }
+
     function setupAutoResize() {
         $(window).resize(function() {
             clearTimeout(resizeTimeout);
@@ -72,7 +89,7 @@
     }
 
     BalancedGallery.prototype.recreate = function () {
-        this.options = $.extend({}, this.unadulteratedOptions);
+        this.options = extend(this.unadulteratedOptions);
         this.container.css(this.unadulteratedCSS); //used to reset width so it's calculated from browser
 
         this.quickResize = true;
@@ -86,10 +103,10 @@
             if(this.options.orientation == 'vertical') {
                 displayMode = 'block';
             }
-            this.elements.each(function() {
-                $(this.element).css({display: displayMode, padding: 0, margin: 0});
-                this.image.css({display: displayMode, padding: 0, margin: 0});
-            });
+            for(var i = 0; i < this.elements.length; i++) {
+                $(this.elements[i].element).css({display: displayMode, padding: 0, margin: 0});
+                this.elements[i].image.css({display: displayMode, padding: 0, margin: 0});
+            }
 
             var padding = this.options.padding + 'px';
             this.wrapper.css({fontSize: 0, paddingTop: padding, paddingLeft: padding});
@@ -110,7 +127,7 @@
         }
 
         //setting explicit width prevents image wrapping on resizing
-        this.wrapper.width(this.options.viewportWidth);
+        this.wrapper[0].style.width = this.options.viewportWidth + 'px';
     };
 
     BalancedGallery.prototype.createGallery = function() {
@@ -178,36 +195,33 @@
         //if necessary, increase the padding on the left side of the wrapper so the grid is more centered
         if(paddingGap > 0) {
             var increasedPadding = paddingGap + padding;
-            balancedGallery.wrapper.css({paddingLeft: increasedPadding+'px'});
-            balancedGallery.wrapper.width(balancedGallery.options.viewportWidth - paddingGap);
+            balancedGallery.wrapper.css({paddingLeft: increasedPadding+'px', width: (balancedGallery.options.viewportWidth - paddingGap)+'px'});
         }
 
-        balancedGallery.elements.each(function(){
-            var $image = this.image;
+        for(var i = 0; i < balancedGallery.elements.length; i++) {
+            var $image = balancedGallery.elements[i].image;
             var imgRatio = aspectRatio($image);
             var offset = 0;
           
             if(imgRatio >= cellRatio) {
-                $image.height(cellHeight);
-                $image.width(cellHeight * imgRatio);
                 offset = (cellWidth - (cellHeight * imgRatio)) / 2;
-                $image.css({left: offset+'px', position: 'absolute', maxWidth: 'none'});
+                $image.css({left: offset+'px', position: 'absolute', maxWidth: 'none', height: cellHeight+'px', width: (cellHeight * imgRatio)+'px'});
             } else if(imgRatio < cellRatio) {
-                $image.width(cellWidth);
-                $image.height(cellWidth * (1/imgRatio));
                 offset = (cellHeight - (cellWidth * (1/imgRatio))) / 2;
-                $image.css({top: offset+'px', position: 'absolute', maxWidth: 'none'});
+                $image.css({top: offset+'px', position: 'absolute', maxWidth: 'none', width: cellWidth, height: (cellWidth * (1/imgRatio))+'px'});
             }
             
             if(balancedGallery.quickResize) {
-                var $div = $image.parent();
-                $div.width(cellWidth);
-                $div.height(cellHeight);
+                var imgWrapper = $image[0].parentNode;
+                imgWrapper.style.width = cellWidth + 'px';
+                imgWrapper.style.height = cellHeight + 'px';
             } else {
-                $image.wrap('<div></div>');
+                var div = document.createElement('div');
+                $image[0].parentNode.insertBefore(div, $image[0]);
+                div.appendChild($image[0]);
                 $($image[0].parentNode).css({position: 'relative', 'float': 'left', 'overflow': 'hidden', width: cellWidth+'px', height: cellHeight+'px', margin: 0, marginRight: padding+'px', marginBottom: padding+'px'});
             }
-        });
+        }
     }
 
     function getRows () {
@@ -220,19 +234,19 @@
 
     function getColumns() {
         var cols = Math.round(balancedGallery.options.viewportWidth / balancedGallery.options.idealWidth);
-        var elements = balancedGallery.elements.length;
-        if(cols <= elements) {
+        var numberOfElements = balancedGallery.elements.length;
+        if(cols <= numberOfElements) {
             return cols;
         } else {
-            return elements;
+            return numberOfElements;
         }
     }
 
     function collectiveIdealWidth() {
         var sum = 0;
-        balancedGallery.elements.each(function () {
-            sum += idealWidth(this.image);
-        });
+        for(var i = 0; i < balancedGallery.elements.length; i++) {
+            sum += idealWidth(balancedGallery.elements[i].image);
+        }
         return sum;
     }
 
@@ -241,16 +255,14 @@
     }
 
     function getWidthWeights() {
-        return balancedGallery.elements.map(function () {
-            var weight = aspectRatio(this.image);
-            return {element: this.element, image: this.image, weight: weight };
+        return balancedGallery.elements.map(function (currentValue, index, array) {
+            return {element: currentValue.element, image: currentValue.image, weight: aspectRatio(currentValue.image)};
         });
     }
 
     function getHeightWeights() {
-        return balancedGallery.elements.map(function () {
-            var weight = 1/aspectRatio(this.image);
-            return {element: this.element, image: this.image, weight: weight };
+        return balancedGallery.elements.map(function (currentValue, index, array) {
+            return {element: currentValue.element, image: currentValue.image, weight: 1/aspectRatio(currentValue.image)};
         });
     }
 
@@ -372,9 +384,9 @@
 
     function getPartitionWeight(partition) {
         var weight = 0;
-        $.each(partition, function(index, value) {
-            weight += value.weight;
-        });
+        for(var i = 0; i < partition.length; i++) {
+            weight += partition[i].weight;
+        }
         return weight;
     }
 
@@ -385,15 +397,6 @@
         return shuffleArray(partitions);
     }
 
-    function reorderElements(partitions) {
-        for(var i = 0; i < partitions.length; i++) {
-            var subPartition = partitions[i];
-            for(var j = 0; j < subPartition.length; j++) {
-                balancedGallery.wrapper.append(subPartition[j].element);
-            }
-        }
-    }
-
     function shuffleArray(array) {
         var counter = array.length, temp, index;
         while (counter--) {
@@ -405,12 +408,21 @@
         return array;
     }
 
+    function reorderElements(partitions) {
+        for(var i = 0; i < partitions.length; i++) {
+            var subPartition = partitions[i];
+            for(var j = 0; j < subPartition.length; j++) {
+                balancedGallery.wrapper.append(subPartition[j].element);
+            }
+        }
+    }
+
     function orientElementsVertically(partitions) {
         for(var i = 0; i < partitions.length; i++) {
             var colName = 'balanced-gallery-col'+i;
             var column = '<div class="balanced-gallery-column" id="'+colName+'" style="display: inline-block; padding: 0; margin: 0;"></div>';
             balancedGallery.wrapper.append(column);
-            var $col = $(balancedGallery.wrapper.find("div#"+colName));
+            var $col = $(balancedGallery.wrapper[0].querySelector("div#"+colName));
             for(var j = 0; j < partitions[i].length; j++) {
                 $col.append(partitions[i][j].element);
             }
@@ -437,9 +449,7 @@
                 var imgHeight = parseInt(rawImgHeight, RADIX);
                 var imgWidth = rawImgHeight * aspectRatio($image);
                 imgWidth = checkWidthOverflow(imgWidth);
-                $image.width(imgWidth);
-                $image.height(imgHeight);
-                $image.css({margin: 0, marginRight: padding+'px', marginBottom: padding+'px'});
+                $image.css({width: imgWidth+'px', height: imgHeight+'px', margin: 0, marginRight: padding+'px', marginBottom: padding+'px'});
             }
         }
     }
@@ -462,8 +472,8 @@
             var imgHeight = parseInt(rawImgHeight, RADIX);
             var imgWidth = rawImgHeight * aspectRatio($image);
             imgWidth = checkWidthOverflow(imgWidth);
-            $image.width(imgWidth);
-            $image.height(imgHeight);
+            $image[0].style.width = imgWidth + 'px';
+            $image[0].style.height = imgHeight + 'px';
         }
     }
 
@@ -498,9 +508,7 @@
                 balancedGallery.elements[index++] = {element: partitions[k][l].element, image: $image};
                 var imgHeight = Math.round(rawImgWidth * (1/aspectRatio($image)));
                 columnHeight += imgHeight + padding;
-                $image.width(imgWidth);
-                $image.height(imgHeight);
-                $image.css({margin: 0, marginRight: padding+'px', marginBottom: padding+'px'});
+                $image.css({width: imgWidth+'px', height: imgHeight+'px', margin: 0, marginRight: padding+'px', marginBottom: padding+'px'});
             }
             balancedGallery.resizingValue[k] = {ratio: resizingFactor, length: partitions[k].length, columnHeight: columnHeight};
         }
@@ -525,8 +533,8 @@
             var $image = balancedGallery.elements[i].image;
             var imgHeight = parseInt(rawImgWidth * (1/aspectRatio($image)), RADIX);
             balancedGallery.resizingValue[index].columnHeight += imgHeight + padding;
-            $image.width(imgWidth);
-            $image.height(imgHeight);
+            $image[0].style.width = imgWidth + 'px';
+            $image[0].style.height = imgHeight + 'px';
         }
     }
 
@@ -545,7 +553,7 @@
     function checkWidth(orientation) {
         if((balancedGallery.options.viewportWidth + balancedGallery.options.padding) !== balancedGallery.container.width()) {
             balancedGallery.options.viewportWidth = balancedGallery.container.width() - balancedGallery.options.padding;
-            balancedGallery.wrapper.width(balancedGallery.options.viewportWidth);
+            balancedGallery.wrapper[0].style.width = balancedGallery.options.viewportWidth + 'px';
             if(orientation == 'horizontal') {
                 quickResizeHorizontal();
             } else if(orientation == 'vertical') {
@@ -572,7 +580,7 @@
             //starting with last image in column, because it's more likely to be outside of the current viewport
             var k = imagesPerCol-1;
             while(averageHeight != balancedGallery.resizingValue[j].columnHeight) {
-                balancedGallery.elements[k].image.height(balancedGallery.elements[k].image.height() + counter);
+                balancedGallery.elements[k].image[0].style.height = (balancedGallery.elements[k].image.height() + counter) + 'px';
                 balancedGallery.resizingValue[j].columnHeight += counter;
                 k--;
                 //if all images in a column got streched/shrinked, start iteration again with last image in column till averageHeight matches columnHeight

From 7e619fbf89547b8403bc7762f49894dd13a6d907 Mon Sep 17 00:00:00 2001
From: Timo Kosse <timo-kosse@web.de>
Date: Sat, 16 Sep 2017 14:29:51 +0200
Subject: [PATCH 24/24] Adding colName as a class instead of an id is more
 sematically correct as there could be several galleries on one page with the
 colName

---
 jquery.balanced-gallery.js     | 4 ++--
 jquery.balanced-gallery.min.js | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/jquery.balanced-gallery.js b/jquery.balanced-gallery.js
index aa0e29a..a730437 100644
--- a/jquery.balanced-gallery.js
+++ b/jquery.balanced-gallery.js
@@ -420,9 +420,9 @@
     function orientElementsVertically(partitions) {
         for(var i = 0; i < partitions.length; i++) {
             var colName = 'balanced-gallery-col'+i;
-            var column = '<div class="balanced-gallery-column" id="'+colName+'" style="display: inline-block; padding: 0; margin: 0;"></div>';
+            var column = '<div class="balanced-gallery-column '+colName+'" style="display: inline-block; padding: 0; margin: 0;"></div>';
             balancedGallery.wrapper.append(column);
-            var $col = $(balancedGallery.wrapper[0].querySelector("div#"+colName));
+            var $col = $(balancedGallery.wrapper[0].querySelector("div."+colName));
             for(var j = 0; j < partitions[i].length; j++) {
                 $col.append(partitions[i][j].element);
             }
diff --git a/jquery.balanced-gallery.min.js b/jquery.balanced-gallery.min.js
index 5eebfcf..2b64c2e 100644
--- a/jquery.balanced-gallery.min.js
+++ b/jquery.balanced-gallery.min.js
@@ -1 +1 @@
-(function(l,E,F){function m(a,f){b=this;n.push(this);this.container=l(a);this.container.wrapInner('<div class="balanced-gallery-wrapper"></div>');this.wrapper=l(this.container.children()[0]);this.elements=this.wrapper.children().map(function(){var a=l(this).find("img")[0];a===F&&(a=this);return{element:this,image:l(a)}});this.options=l.extend({},G,f);this.options.orientation=this.options.orientation.toLowerCase();this.options.autoResize&&(this.unadulteratedCSS={width:this.container[0].style.width},this.unadulteratedOptions=l.extend({},this.options),H());this.quickResize=!1;this.init();this.createGallery()}function H(){l(E).resize(function(){clearTimeout(u);u=setTimeout(function(){for(var a=0;a<n.length;a++)n[a].options.autoResize&&(b=n[a],n[a].recreate())},500)})}function y(){var a=b.options.padding,f=b.options.gridAspectRatio,e=parseInt(b.options.idealWidth-a,10),d=1/f*e,h=parseInt(b.options.viewportWidth%b.options.widthDivisor/2,10);0<h&&(b.wrapper.css({paddingLeft:h+a+"px"}),b.wrapper.width(b.options.viewportWidth-h));b.elements.each(function(){var c=this.image,g=p(c);g>=f?(c.height(d),c.width(d*g),g=(e-d*g)/2,c.css({left:g+"px",position:"absolute",maxWidth:"none"})):g<f&&(c.width(e),c.height(1/g*e),g=(d-1/g*e)/2,c.css({top:g+"px",position:"absolute",maxWidth:"none"}));b.quickResize?(c=c.parent(),c.width(e),c.height(d)):(c.wrap("<div></div>"),l(c[0].parentNode).css({position:"relative","float":"left",overflow:"hidden",width:e+"px",height:d+"px",margin:0,marginRight:a+"px",marginBottom:a+"px"}))});b.wrapper.append('<div style="clear: both;"></div>')}function I(){var a=0;b.elements.each(function(){a+=p(this.image)*b.options.idealHeight+b.options.padding});return a}function J(){return b.elements.map(function(){var a=p(this.image);return{element:this.element,image:this.image,weight:a}})}function K(){return b.elements.map(function(){var a=1/p(this.image);return{element:this.element,image:this.image,weight:a}})}function z(a,f){if(b.options.maintainOrder){var e=f;var d=a.length;if(0>=e)d=[];else{var h=L(a,e);--d;e-=2;for(var c=[],g;0<=e;){g=[];for(var k=h[d-1][e]+1;k<d+1;k++)g.push(a[k]);c=[g].concat(c);d=h[d-1][e];--e}e=[];for(h=0;h<d+1;h++)e.push(a[h]);d=[e].concat(c)}return d}d=M(a,f);if(b.options.shuffleUnorderedPartitions){for(c=0;c<d.length;c++)d[c]=A(d[c]);d=A(d)}c=d;for(e=0;e<c.length;e++)for(h=c[e],g=0;g<h.length;g++)b.wrapper.append(h[g].element);return d}function L(a,b){for(var e=a.length,d=[],f=0;f<e;f++){for(var c=[],g=0;g<b;g++)c.push(0);d.push(c)}f=[];for(c=0;c<e-1;c++){g=[];for(var k=0;k<b-1;k++)g.push(0);f.push(g)}for(c=0;c<e;c++)d[c][0]=a[c].weight+(0!==c?d[c-1][0]:0);for(c=0;c<b;c++)d[0][c]=a[0].weight;c=function(a,b){return a[0]-b[0]};for(g=1;g<e;g++)for(k=1;k<b;k++){for(var l=[],q=0;q<g;q++)l.push([Math.max(d[q][k-1],d[g][0]-d[q][0]),q]);l=l.sort(c)[0];d[g][k]=l[0];f[g-1][k-1]=l[1]}return f}function M(a,b){for(var f=a.sort(function(a,b){return b.weight-a.weight}),d=Array(b),h=0;h<b;h++)d[h]=[];for(h=0;h<f.length;h++){for(var c=d[0],g=B(c),k=0;k<d.length;k++){var l=B(d[k]);l<g&&(c=d[k],g=l)}c.push(f[h])}return d}function B(a){var b=0;l.each(a,function(a,d){b+=d.weight});return b}function C(){for(var a=b.options.padding,f=0,e=0,d,h=0;h<b.elements.length;h++){h==e&&(d=a*b.resizingValue[f].length,d=(b.options.viewportWidth-d)/b.resizingValue[f].ratio,e+=b.resizingValue[f].length,f++,r=0);var c=b.elements[h].image,g=parseInt(d,10),k=d*p(c);k=w(k);c.width(k);c.height(g)}}function D(){var a=b.options.padding,f=-1,e=0;r=0;for(var d,h,c=0;c<b.elements.length;c++){c==e&&(f++,b.resizingValue[f].columnHeight=0,d=b.options.viewportWidth/b.summedColRatios*b.resizingValue[f].ratio,d-=a,h=w(d),e+=b.resizingValue[f].length);var g=b.elements[c].image,k=parseInt(d*(1/p(g)),10);b.resizingValue[f].columnHeight+=k+a;g.width(h);g.height(k)}}function w(a){var b=parseInt(a,10);r+=a-b;.99999<=r&&(b+=1,--r);return b}function x(a){b.options.viewportWidth+b.options.padding!==b.container.width()&&(b.options.viewportWidth=b.container.width()-b.options.padding,b.wrapper.width(b.options.viewportWidth),"horizontal"==a?C():"vertical"==a?D():"grid"==a&&(b.options.idealWidth=b.options.viewportWidth/b.options.widthDivisor,y()))}function p(a){return a[0].naturalWidth/a[0].naturalHeight}function A(a){for(var b=a.length,e,d;b--;)d=Math.random()*b|0,e=a[b],a[b]=a[d],a[d]=e;return a}var n=[],b,G={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,gridAspectRatio:1,widthDivisor:4},u=null,r=0;l.fn.BalancedGallery=function(a){return this.each(function(){l.data(this,"plugin_BalancedGallery")||l.data(this,"plugin_BalancedGallery",new m(this,a))})};m.prototype.recreate=function(){this.options=l.extend({},this.unadulteratedOptions);this.container.css(this.unadulteratedCSS);this.quickResize=!0;this.init();this.createGallery()};m.prototype.init=function(){if(!1===this.quickResize){var a="inline-block";"vertical"==this.options.orientation&&(a="block");this.elements.each(function(){l(this.element).css({display:a,padding:0,margin:0});this.image.css({display:a,padding:0,margin:0})});var b=this.options.padding+"px";this.wrapper.css({fontSize:0,paddingTop:b,paddingLeft:b});null!==this.options.background&&this.wrapper.css({background:this.options.background})}this.options.viewportWidth=this.container.width()-this.options.padding;null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/this.options.widthDivisor);null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.widthDivisor);this.wrapper.width(this.options.viewportWidth)};m.prototype.createGallery=function(){var a=this.options.orientation;if("horizontal"===a){if(b.quickResize)C();else{a=Math.round(I()/b.options.viewportWidth);0<a&&1>a&&(a=1);var f=J();a=z(f,a);f=b.options.padding;var e=0;b.resizingValue=[];for(var d=0;d<a.length;d++){for(var h=0,c=0;c<a[d].length;c++)h+=a[d][c].weight;b.resizingValue[d]={ratio:h,length:a[d].length};r=0;h=(b.options.viewportWidth-f*a[d].length)/h;for(c=0;c<a[d].length;c++){var g=a[d][c].image;b.elements[e++]={element:a[d][c].element,image:g};var k=parseInt(h,10),t=h*p(g);t=w(t);g.width(t);g.height(k);g.css({margin:0,marginRight:f+"px",marginBottom:f+"px"})}}}x(b.options.orientation)}else if("vertical"===a){if(b.quickResize)D();else{a=Math.round(b.options.viewportWidth/b.options.idealWidth);f=b.elements.length;a=a<=f?a:f;f=K();a=z(f,a);for(f=0;f<a.length;f++)for(e="balanced-gallery-col"+f,b.wrapper.append('<div class="balanced-gallery-column" id="'+e+'" style="display: inline-block; padding: 0; margin: 0;"></div>'),e=l(b.wrapper.find("div#"+e)),d=0;d<a[f].length;d++)e.append(a[f][d].element);f=b.options.padding;e=[];h=d=0;b.resizingValue=[];for(c=r=0;c<a.length;c++){for(g=e[c]=0;g<a[c].length;g++)e[c]+=a[c][g].weight;e[c]+=f/(b.options.idealWidth-f)*a[c].length;d+=e[c]}b.summedColRatios=d;c=d/a.length;for(g=0;g<a.length;g++){k=c+(c-e[g]);t=b.options.viewportWidth/d*k-f;for(var q=w(t),n=0,m=0;m<a[g].length;m++){var v=a[g][m].image;b.elements[h++]={element:a[g][m].element,image:v};var u=Math.round(t*(1/p(v)));n+=u+f;v.width(q);v.height(u);v.css({margin:0,marginRight:f+"px",marginBottom:f+"px"})}b.resizingValue[g]={ratio:k,length:a[g].length,columnHeight:n}}}x(b.options.orientation);for(e=f=a=0;e<b.resizingValue.length;e++)a+=b.resizingValue[e].columnHeight;a=Math.round(a/b.resizingValue.length);for(e=0;e<b.resizingValue.length;e++)for(f+=b.resizingValue[e].length,d=Math.sign(a-b.resizingValue[e].columnHeight),h=f-1;a!=b.resizingValue[e].columnHeight;)b.elements[h].image.height(b.elements[h].image.height()+d),b.resizingValue[e].columnHeight+=d,h--,h<f-b.resizingValue[e].length&&(h=f-1)}else if("grid"===a)y(),x(a);else throw"BalancedGallery: Invalid Orientation.";}})(jQuery,window);
\ No newline at end of file
+(function(l,E,L){function p(b,f){a=this;q.push(this);this.container=l(b);this.container[0].innerHTML='<div class="balanced-gallery-wrapper">'+this.container[0].innerHTML+"</div>";this.wrapper=l(this.container[0].children[0]);this.elements=[];for(var d=this.wrapper[0].children,c=0;c<d.length;c++){var h=d[c].querySelector("img");null===h&&(h=d[c]);this.elements.push({element:d[c],image:l(h)})}this.options=r(F,f);this.options.orientation=this.options.orientation.toLowerCase();this.options.autoResize&&(this.unadulteratedCSS={width:this.container[0].style.width},this.unadulteratedOptions=r(this.options),G());this.quickResize=!1;this.init();this.createGallery()}function r(){var b={},a;for(a in arguments){var d=arguments[a],c;for(c in d)d.hasOwnProperty(c)&&(b[c]=d[c])}return b}function G(){l(E).resize(function(){clearTimeout(u);u=setTimeout(function(){for(var b=0;b<q.length;b++)q[b].options.autoResize&&(a=q[b],q[b].recreate())},500)})}function z(){var b=a.options.padding,f=a.options.gridAspectRatio,d=parseInt(a.options.idealWidth-b,10),c=1/f*d,h=parseInt(a.options.viewportWidth%a.options.widthDivisor/2,10);0<h&&a.wrapper.css({paddingLeft:h+b+"px",width:a.options.viewportWidth-h+"px"});for(h=0;h<a.elements.length;h++){var e=a.elements[h].image,g=n(e);if(g>=f){var k=(d-c*g)/2;e.css({left:k+"px",position:"absolute",maxWidth:"none",height:c+"px",width:c*g+"px"})}else g<f&&(k=(c-1/g*d)/2,e.css({top:k+"px",position:"absolute",maxWidth:"none",width:d,height:1/g*d+"px"}));a.quickResize?(e=e[0].parentNode,e.style.width=d+"px",e.style.height=c+"px"):(g=document.createElement("div"),e[0].parentNode.insertBefore(g,e[0]),g.appendChild(e[0]),l(e[0].parentNode).css({position:"relative","float":"left",overflow:"hidden",width:d+"px",height:c+"px",margin:0,marginRight:b+"px",marginBottom:b+"px"}))}}function H(){return a.elements.map(function(b,a,d){return{element:b.element,image:b.image,weight:n(b.image)}})}function I(){return a.elements.map(function(b,a,d){return{element:b.element,image:b.image,weight:1/n(b.image)}})}function n(b){return b[0].naturalWidth/b[0].naturalHeight}function A(b,f){if(a.options.maintainOrder){var d=f;var c=b.length;if(0>=d)c=[];else{var h=J(b,d);--c;d-=2;for(var e=[],g;0<=d;){g=[];for(var k=h[c-1][d]+1;k<c+1;k++)g.push(b[k]);e=[g].concat(e);c=h[c-1][d];--d}d=[];for(h=0;h<c+1;h++)d.push(b[h]);c=[d].concat(e)}return c}c=K(b,f);if(a.options.shuffleUnorderedPartitions){for(e=0;e<c.length;e++)c[e]=x(c[e]);c=x(c)}e=c;for(d=0;d<e.length;d++)for(h=e[d],g=0;g<h.length;g++)a.wrapper.append(h[g].element);return c}function J(b,a){for(var d=b.length,c=[],f=0;f<d;f++){for(var e=[],g=0;g<a;g++)e.push(0);c.push(e)}f=[];for(e=0;e<d-1;e++){g=[];for(var k=0;k<a-1;k++)g.push(0);f.push(g)}for(e=0;e<d;e++)c[e][0]=b[e].weight+(0!==e?c[e-1][0]:0);for(e=0;e<a;e++)c[0][e]=b[0].weight;e=function(b,a){return b[0]-a[0]};for(g=1;g<d;g++)for(k=1;k<a;k++){for(var m=[],l=0;l<g;l++)m.push([Math.max(c[l][k-1],c[g][0]-c[l][0]),l]);m=m.sort(e)[0];c[g][k]=m[0];f[g-1][k-1]=m[1]}return f}function K(b,a){for(var d=b.sort(function(b,a){return a.weight-b.weight}),c=Array(a),f=0;f<a;f++)c[f]=[];for(f=0;f<d.length;f++){for(var e=c[0],g=B(e),k=0;k<c.length;k++){var l=B(c[k]);l<g&&(e=c[k],g=l)}e.push(d[f])}return c}function B(b){for(var a=0,d=0;d<b.length;d++)a+=b[d].weight;return a}function x(b){for(var a=b.length,d,c;a--;)c=Math.random()*a|0,d=b[a],b[a]=b[c],b[c]=d;return b}function C(){for(var b=a.options.padding,f=0,d=0,c,h=0;h<a.elements.length;h++){h==d&&(c=b*a.resizingValue[f].length,c=(a.options.viewportWidth-c)/a.resizingValue[f].ratio,d+=a.resizingValue[f].length,f++,t=0);var e=a.elements[h].image,g=parseInt(c,10),k=c*n(e);k=w(k);e[0].style.width=k+"px";e[0].style.height=g+"px"}}function D(){var b=a.options.padding,f=-1,d=0;t=0;for(var c,h,e=0;e<a.elements.length;e++){e==d&&(f++,a.resizingValue[f].columnHeight=0,c=a.options.viewportWidth/a.summedColRatios*a.resizingValue[f].ratio,c-=b,h=w(c),d+=a.resizingValue[f].length);var g=a.elements[e].image,k=parseInt(c*(1/n(g)),10);a.resizingValue[f].columnHeight+=k+b;g[0].style.width=h+"px";g[0].style.height=k+"px"}}function w(b){var a=parseInt(b,10);t+=b-a;.99999<=t&&(a+=1,--t);return a}function y(b){a.options.viewportWidth+a.options.padding!==a.container.width()&&(a.options.viewportWidth=a.container.width()-a.options.padding,a.wrapper[0].style.width=a.options.viewportWidth+"px","horizontal"==b?C():"vertical"==b?D():"grid"==b&&(a.options.idealWidth=a.options.viewportWidth/a.options.widthDivisor,z()))}var q=[],a,F={autoResize:!0,background:null,idealHeight:null,idealWidth:null,maintainOrder:!0,orientation:"horizontal",padding:5,shuffleUnorderedPartitions:!0,gridAspectRatio:1,widthDivisor:4},u=null,t=0;l.fn.BalancedGallery=function(b){return this.each(function(){l.data(this,"plugin_BalancedGallery")||l.data(this,"plugin_BalancedGallery",new p(this,b))})};p.prototype.recreate=function(){this.options=r(this.unadulteratedOptions);this.container.css(this.unadulteratedCSS);this.quickResize=!0;this.init();this.createGallery()};p.prototype.init=function(){if(!1===this.quickResize){var b="inline-block";"vertical"==this.options.orientation&&(b="block");for(var a=0;a<this.elements.length;a++)l(this.elements[a].element).css({display:b,padding:0,margin:0}),this.elements[a].image.css({display:b,padding:0,margin:0});b=this.options.padding+"px";this.wrapper.css({fontSize:0,paddingTop:b,paddingLeft:b});null!==this.options.background&&this.wrapper.css({background:this.options.background})}this.options.viewportWidth=this.container.width()-this.options.padding;null===this.options.idealWidth&&(this.options.idealWidth=this.options.viewportWidth/this.options.widthDivisor);null===this.options.idealHeight&&(this.options.idealHeight=this.options.viewportWidth/this.options.widthDivisor);this.wrapper[0].style.width=this.options.viewportWidth+"px"};p.prototype.createGallery=function(){var b=this.options.orientation;if("horizontal"===b){var f;if(a.quickResize)C();else{for(f=b=0;f<a.elements.length;f++)b+=n(a.elements[f].image)*a.options.idealHeight+a.options.padding;b/=a.options.viewportWidth;0<b&&1>b&&(b=1);b=Math.round(b);f=H();b=A(f,b);f=a.options.padding;var d=0;a.resizingValue=[];for(var c=0;c<b.length;c++){for(var h=0,e=0;e<b[c].length;e++)h+=b[c][e].weight;a.resizingValue[c]={ratio:h,length:b[c].length};t=0;h=(a.options.viewportWidth-f*b[c].length)/h;for(e=0;e<b[c].length;e++){var g=b[c][e].image;a.elements[d++]={element:b[c][e].element,image:g};var k=parseInt(h,10),m=h*n(g);m=w(m);g.css({width:m+"px",height:k+"px",margin:0,marginRight:f+"px",marginBottom:f+"px"})}}}y(a.options.orientation)}else if("vertical"===b){if(a.quickResize)D();else{b=Math.round(a.options.viewportWidth/a.options.idealWidth);f=a.elements.length;b=b<=f?b:f;f=I();b=A(f,b);for(f=0;f<b.length;f++)for(d="balanced-gallery-col"+f,a.wrapper.append('<div class="balanced-gallery-column '+d+'" style="display: inline-block; padding: 0; margin: 0;"></div>'),d=l(a.wrapper[0].querySelector("div."+d)),c=0;c<b[f].length;c++)d.append(b[f][c].element);f=a.options.padding;d=[];h=c=0;a.resizingValue=[];for(e=t=0;e<b.length;e++){for(g=d[e]=0;g<b[e].length;g++)d[e]+=b[e][g].weight;d[e]+=f/(a.options.idealWidth-f)*b[e].length;c+=d[e]}a.summedColRatios=c;e=c/b.length;for(g=0;g<b.length;g++){k=e+(e-d[g]);m=a.options.viewportWidth/c*k-f;for(var q=w(m),p=0,v=0;v<b[g].length;v++){var r=b[g][v].image;a.elements[h++]={element:b[g][v].element,image:r};var u=Math.round(m*(1/n(r)));p+=u+f;r.css({width:q+"px",height:u+"px",margin:0,marginRight:f+"px",marginBottom:f+"px"})}a.resizingValue[g]={ratio:k,length:b[g].length,columnHeight:p}}}y(a.options.orientation);for(d=f=b=0;d<a.resizingValue.length;d++)b+=a.resizingValue[d].columnHeight;b=Math.round(b/a.resizingValue.length);for(d=0;d<a.resizingValue.length;d++)for(f+=a.resizingValue[d].length,c=Math.sign(b-a.resizingValue[d].columnHeight),h=f-1;b!=a.resizingValue[d].columnHeight;)a.elements[h].image[0].style.height=a.elements[h].image.height()+c+"px",a.resizingValue[d].columnHeight+=c,h--,h<f-a.resizingValue[d].length&&(h=f-1)}else if("grid"===b){if(!a.quickResize){if(!a.options.maintainOrder&&a.options.shuffleUnorderedPartitions)for(x(a.elements),b=0;b<a.elements.length;b++)a.wrapper.append(a.elements[b].element);a.wrapper.append('<div style="clear: both;"></div>')}z();y(a.options.orientation)}else throw"BalancedGallery: Invalid Orientation.";}})(jQuery,window);