update justified gallery lib from 3.6.3 to 3.6.5

1 files changed, 74 insertions, 48 deletions

diff --git a/library/justifiedGallery/jquery.justifiedGallery.js b/library/justifiedGallery/jquery.justifiedGallery.js
index 82445b403..85a4168bd 100644
--- a/library/justifiedGallery/jquery.justifiedGallery.js
+++ b/library/justifiedGallery/jquery.justifiedGallery.js
@@ -1,7 +1,7 @@
 /*!
- * Justified Gallery - v3.6.3
+ * Justified Gallery - v3.6.5
  * http://miromannino.github.io/Justified-Gallery/
- * Copyright (c) 2016 Miro Mannino
+ * Copyright (c) 2018 Miro Mannino
  * Licensed under the MIT license.
  */
 (function($) {
@@ -130,7 +130,7 @@
       if (callback) callback();
     } else {
       $entry.stop().fadeTo(this.settings.imagesAnimationDuration, 1.0, callback);
-      $entry.find('> img, > a > img').stop().fadeTo(this.settings.imagesAnimationDuration, 1.0, callback);
+      $entry.find(this.settings.imgSelector).stop().fadeTo(this.settings.imagesAnimationDuration, 1.0, callback);
     }
   };
 
@@ -149,8 +149,7 @@
 
   /** @returns {jQuery} the image in the given entry */
   JustifiedGallery.prototype.imgFromEntry = function ($entry) {
-    var $img = $entry.find('> img');
-    if ($img.length === 0) $img = $entry.find('> a > img');
+    var $img = $entry.find(this.settings.imgSelector);
     return $img.length === 0 ? null : $img;
   };
 
@@ -320,6 +319,15 @@
   };
 
   /**
+   * Clear the building row data to be used for a new row
+   */
+  JustifiedGallery.prototype.clearBuildingRow = function () {
+    this.buildingRow.entriesBuff = [];
+    this.buildingRow.aspectRatio = 0;
+    this.buildingRow.width = 0;
+  };
+
+  /**
    * Justify the building row, preparing it to
    *
    * @param isLastRow
@@ -381,15 +389,6 @@
   };
 
   /**
-   * Clear the building row data to be used for a new row
-   */
-  JustifiedGallery.prototype.clearBuildingRow = function () {
-    this.buildingRow.entriesBuff = [];
-    this.buildingRow.aspectRatio = 0;
-    this.buildingRow.width = 0;
-  };
-
-  /**
    * Flush a row: justify it, modify the gallery height accordingly to the row height
    *
    * @param isLastRow
@@ -404,16 +403,12 @@
       return;
     }
 
-    if (this.maxRowHeight) {
-      if (this.maxRowHeight.isPercentage && this.maxRowHeight.value * settings.rowHeight < this.buildingRow.height) {
-        this.buildingRow.height = this.maxRowHeight.value * settings.rowHeight;
-      } else if (this.maxRowHeight.value >= settings.rowHeight && this.maxRowHeight.value < this.buildingRow.height) {
-        this.buildingRow.height = this.maxRowHeight.value;
-      }
+    if(this.maxRowHeight) {
+      if(this.maxRowHeight < this.buildingRow.height)  this.buildingRow.height = this.maxRowHeight;
     }
 
     //Align last (unjustified) row
-    if (settings.lastRow === 'center' || settings.lastRow === 'right') {
+    if (isLastRow && (settings.lastRow === 'center' || settings.lastRow === 'right')) {
       var availableWidth = this.galleryWidth - 2 * this.border - (this.buildingRow.entriesBuff.length - 1) * settings.margins;
 
       for (i = 0; i < this.buildingRow.entriesBuff.length; i++) {
@@ -427,15 +422,16 @@
         offX += availableWidth;
     }
 
-    for (i = 0; i < this.buildingRow.entriesBuff.length; i++) {
-      $entry = this.buildingRow.entriesBuff[i];
+    var lastEntryIdx = this.buildingRow.entriesBuff.length - 1;
+    for (i = 0; i <= lastEntryIdx; i++) {
+      $entry = this.buildingRow.entriesBuff[ this.settings.rtl ? lastEntryIdx - i : i ];
       this.displayEntry($entry, offX, this.offY, $entry.data('jg.jwidth'), $entry.data('jg.jheight'), this.buildingRow.height);
       offX += $entry.data('jg.jwidth') + settings.margins;
     }
 
     //Gallery Height
     this.galleryHeightToSet = this.offY + this.buildingRow.height + this.border;
-    this.$gallery.height(this.galleryHeightToSet + this.getSpinnerHeight());
+    this.setGalleryTempHeight(this.galleryHeightToSet + this.getSpinnerHeight());
 
     if (!isLastRow || (this.buildingRow.height <= settings.rowHeight && buildingRowRes)) {
       //Ready for a new row
@@ -446,18 +442,45 @@
     }
   };
 
+
+  // Scroll position not restoring: https://github.com/miromannino/Justified-Gallery/issues/221 
+  var galleryPrevStaticHeight = 0;
+
+  JustifiedGallery.prototype.rememberGalleryHeight = function () {
+    galleryPrevStaticHeight = this.$gallery.height();
+    this.$gallery.height(galleryPrevStaticHeight);
+  };
+
+  // grow only
+  JustifiedGallery.prototype.setGalleryTempHeight = function (height) {
+    galleryPrevStaticHeight = Math.max(height, galleryPrevStaticHeight);
+    this.$gallery.height(galleryPrevStaticHeight);
+  };
+
+  JustifiedGallery.prototype.setGalleryFinalHeight = function (height) {
+    galleryPrevStaticHeight = height;
+    this.$gallery.height(height);
+  };
+
+
   /**
    * Checks the width of the gallery container, to know if a new justification is needed
    */
   var scrollBarOn = false;
   JustifiedGallery.prototype.checkWidth = function () {
     this.checkWidthIntervalId = setInterval($.proxy(function () {
+      
+      // if the gallery is not currently visible, abort.
+      if (!this.$gallery.is(":visible")) return;
+
       var galleryWidth = parseFloat(this.$gallery.width());
       if (hasScrollBar() === scrollBarOn) {
         if (Math.abs(galleryWidth - this.galleryWidth) > this.settings.refreshSensitivity) {
           this.galleryWidth = galleryWidth;
           this.rewind();
 
+          this.rememberGalleryHeight();
+
           // Restart to analyze
           this.startImgAnalyzer(true);
         }
@@ -488,7 +511,7 @@
   JustifiedGallery.prototype.stopLoadingSpinnerAnimation = function () {
     clearInterval(this.spinner.intervalId);
     this.spinner.intervalId = null;
-    this.$gallery.height(this.$gallery.height() - this.getSpinnerHeight());
+    this.setGalleryTempHeight(this.$gallery.height() - this.getSpinnerHeight());
     this.spinner.$el.detach();
   };
 
@@ -500,7 +523,7 @@
     var $spinnerPoints = spinnerContext.$el.find('span');
     clearInterval(spinnerContext.intervalId);
     this.$gallery.append(spinnerContext.$el);
-    this.$gallery.height(this.offY + this.buildingRow.height + this.getSpinnerHeight());
+    this.setGalleryTempHeight(this.offY + this.buildingRow.height + this.getSpinnerHeight());
     spinnerContext.intervalId = setInterval(function () {
       if (spinnerContext.phase < $spinnerPoints.length) {
         $spinnerPoints.eq(spinnerContext.phase).fadeTo(spinnerContext.timeSlot, 1);
@@ -636,7 +659,7 @@
       // Filter using the passed function
       var filteredArr = a.filter(settings.filter);
       for (var i = 0; i < a.length; i++) {
-        if (filteredArr.indexOf(a[i]) == -1) {
+        if (filteredArr.indexOf(a[i]) === -1) {
           $(a[i]).addClass('jg-filtered').removeClass('jg-visible');
         } else {
           $(a[i]).removeClass('jg-filtered');
@@ -710,6 +733,7 @@
         var imgAspectRatio = $entry.data('jg.width') / $entry.data('jg.height');
         if (availableWidth / (this.buildingRow.aspectRatio + imgAspectRatio) < this.settings.rowHeight) {
           this.flushRow(false);
+
           if(++this.yield.flushed >= this.yield.every) {
             this.startImgAnalyzer(isForResize);
             return;
@@ -741,7 +765,7 @@
 
     //On complete callback
     this.$gallery.trigger(isForResize ? 'jg.resize' : 'jg.complete');
-    this.$gallery.height(this.galleryHeightToSet);
+    this.setGalleryFinalHeight(this.galleryHeightToSet);
   };
 
   /**
@@ -749,7 +773,10 @@
    */
   JustifiedGallery.prototype.stopImgAnalyzerStarter = function () {
     this.yield.flushed = 0;
-    if (this.imgAnalyzerTimeout !== null) clearTimeout(this.imgAnalyzerTimeout);
+    if (this.imgAnalyzerTimeout !== null) {
+      clearTimeout(this.imgAnalyzerTimeout);
+      this.imgAnalyzerTimeout = null;
+    }
   };
 
   /**
@@ -822,8 +849,8 @@
           /* If we have the height and the width, we don't wait that the image is loaded, but we start directly
            * with the justification */
           if (that.settings.waitThumbnailsLoad === false) {
-            var width = parseFloat($image.attr('width'));
-            var height = parseFloat($image.attr('height'));
+            var width = parseFloat($image.prop('width'));
+            var height = parseFloat($image.prop('height'));
             if (!isNaN(width) && !isNaN(height)) {
               $entry.data('jg.width', width);
               $entry.data('jg.height', height);
@@ -915,36 +942,33 @@
 
   /**
    * check and convert the maxRowHeight setting
+   * requires rowHeight to be already set
+   * TODO: should be always called when only rowHeight is changed
+   * @return number or null
    */
   JustifiedGallery.prototype.retrieveMaxRowHeight = function () {
-    var newMaxRowHeight = { };
+    var newMaxRowHeight = null;
+    var rowHeight = this.settings.rowHeight;
 
     if ($.type(this.settings.maxRowHeight) === 'string') {
       if (this.settings.maxRowHeight.match(/^[0-9]+%$/)) {
-        newMaxRowHeight.value = parseFloat(this.settings.maxRowHeight.match(/^([0-9]+)%$/)[1]) / 100;
-        newMaxRowHeight.isPercentage = false;
+        newMaxRowHeight = rowHeight * parseFloat(this.settings.maxRowHeight.match(/^([0-9]+)%$/)[1]) / 100;
       } else {
-        newMaxRowHeight.value = parseFloat(this.settings.maxRowHeight);
-        newMaxRowHeight.isPercentage = true;
+        newMaxRowHeight = parseFloat(this.settings.maxRowHeight);
       }
     } else if ($.type(this.settings.maxRowHeight) === 'number') {
-      newMaxRowHeight.value = this.settings.maxRowHeight;
-      newMaxRowHeight.isPercentage = false;
-    } else if (this.settings.maxRowHeight === false ||
-        this.settings.maxRowHeight === null ||
-        typeof this.settings.maxRowHeight == 'undefined') {
+      newMaxRowHeight = this.settings.maxRowHeight;
+    } else if (this.settings.maxRowHeight === false || this.settings.maxRowHeight == null) {
       return null;
     } else {
       throw 'maxRowHeight must be a number or a percentage';
     }
 
     // check if the converted value is not a number
-    if (isNaN(newMaxRowHeight.value)) throw 'invalid number for maxRowHeight';
+    if (isNaN(newMaxRowHeight)) throw 'invalid number for maxRowHeight';
 
-    // check values
-    if (newMaxRowHeight.isPercentage) {
-      if (newMaxRowHeight.value < 100) newMaxRowHeight.value = 100;
-    }
+    // check values, maxRowHeight must be >= rowHeight
+    if (newMaxRowHeight < rowHeight) newMaxRowHeight = rowHeight;
 
     return newMaxRowHeight;
   };
@@ -1102,7 +1126,7 @@
     thumbnailPath: undefined, /* If defined, sizeRangeSuffixes is not used, and this function is used to determine the
     path relative to a specific thumbnail size. The function should accept respectively three arguments:
     current path, width and height */
-    rowHeight: 120,
+    rowHeight: 120, // required? required to be > 0?
     maxRowHeight: false, // false or negative value to deactivate. Positive number to express the value in pixels,
                          // A string '[0-9]+%' to express in percentage (e.g. 300% means that the row height
                          // can't exceed 3 * rowHeight)
@@ -1128,6 +1152,7 @@
     refreshTime: 200, // time interval (in ms) to check if the page changes its width
     refreshSensitivity: 0, // change in width allowed (in px) without re-building the gallery
     randomize: false,
+    rtl: false, // right-to-left mode
     sort: false, /*
       - false: to do not sort
       - function: to sort them using the function as comparator (see Array.prototype.sort())
@@ -1139,7 +1164,8 @@
       - a function: invoked with arguments (entry, index, array). Return true to keep the entry, false otherwise.
                     It follows the specifications of the Array.prototype.filter() function of JavaScript.
     */
-    selector: 'a, div:not(.spinner)' // The selector that is used to know what are the entries of the gallery
+    selector: 'a, div:not(.spinner)', // The selector that is used to know what are the entries of the gallery
+    imgSelector: '> img, > a > img' // The selector that is used to know what are the images of each entry
   };
 
 }(jQuery));