From 8de88348b72e7b0366edb5cfd242ad6472434acd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Esben=20Agerb=C3=A6k=20Black?= <esben@BlackBookTo.local>
Date: Tue, 18 Apr 2017 21:45:12 +0200
Subject: [PATCH 1/2] Image box with corrected to be based on image width

---
 flex-images.js | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/flex-images.js b/flex-images.js
index 3afa085..69d9364 100644
--- a/flex-images.js
+++ b/flex-images.js
@@ -62,9 +62,11 @@ var flexImages = (function(){
             o.margin = (parseInt(s.marginLeft) || 0) + (parseInt(s.marginRight) || 0) + (Math.round(parseFloat(s.borderLeftWidth)) || 0) + (Math.round(parseFloat(s.borderRightWidth)) || 0);
             for (var j=0;j<containers.length;j++) {
                 var c = containers[j],
-                    w = parseInt(c.getAttribute('data-w')),
-                    norm_w = w*(o.rowHeight/parseInt(c.getAttribute('data-h'))), // normalized width
-                    obj = c.querySelector(o.object);
+                    w = parseInt(c.getAttribute('data-w')), 
+                    obj = c.querySelector(o.object),
+                    objWidth = obj.width,
+                    objHeight = obj.height,
+                    norm_w = objWidth*(o.rowHeight/objHeight);// normalized width
                 items.push([c, w, norm_w, obj, obj.getAttribute('data-src')]);
             }
             makeGrid(grid, items, o);

From a6d5c692542a89701e99b9e175f6fcd7f6e5eb52 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Esben=20Agerb=C3=A6k=20Black?= <esben@BlackBookTo.local>
Date: Tue, 18 Apr 2017 23:11:48 +0200
Subject: [PATCH 2/2] added support for flexible row height based on screen
 width

---
 flex-images.js | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/flex-images.js b/flex-images.js
index 69d9364..426d195 100644
--- a/flex-images.js
+++ b/flex-images.js
@@ -3,7 +3,7 @@
     Copyright (c) 2014 Simon Steinberger / Pixabay
     GitHub: https://github.com/Pixabay/JavaScript-flexImages
     License: http://www.opensource.org/licenses/mit-license.php
-*/
+    */
 
 var flexImages = (function(){
     // "use strict";
@@ -29,7 +29,9 @@ var flexImages = (function(){
                 row_width += items[i][2] + o.margin;
                 if (row_width >= max_w) {
                     var margins_in_row = row.length * o.margin;
-                    ratio = (max_w-margins_in_row) / (row_width-margins_in_row), row_h = Math.ceil(o.rowHeight*ratio), exact_w = 0, new_w;
+                    var ratio = (max_w-margins_in_row) / (row_width-margins_in_row);
+                    var row_h = Math.ceil(o.rowHeight*ratio);
+                    var exact_w = 0, new_w;
                     for (x=0; x<row.length; x++) {
                         new_w = Math.ceil(row[x][2]*ratio);
                         exact_w += new_w + o.margin;
@@ -57,6 +59,9 @@ var flexImages = (function(){
 
         for (var i=0;i<grids.length;i++) {
             var grid = grids[i], containers = grid.querySelectorAll(o.container), items = [], t = new Date().getTime();
+            if (options['rowHeight'] == 'fluid'){
+                grid.clientWidth > 900 ? o['rowHeight'] = Math.floor(grid.clientWidth / 5) : o['rowHeight'] = 180;
+            }
             if (!containers.length) continue;
             var s = window.getComputedStyle ? getComputedStyle(containers[0], null) : containers[0].currentStyle;
             o.margin = (parseInt(s.marginLeft) || 0) + (parseInt(s.marginRight) || 0) + (Math.round(parseFloat(s.borderLeftWidth)) || 0) + (Math.round(parseFloat(s.borderRightWidth)) || 0);
@@ -92,3 +97,4 @@ var flexImages = (function(){
     else
         window.flexImages = flexImages;
 })();
+