Updated GLightbox to 3.0.9

CHANGELOG.md

@@ -1,3 +1,9 @@
+# v1.0.6
+##  05/23/2021
+
+1. [](#improved)
+   * Updated GLightbox to 3.0.9
+
 # v1.0.5
 ##  04/10/2021
 

blueprints.yaml

@@ -1,7 +1,7 @@
 name: Shortcode Gallery++
 slug: shortcode-gallery-plusplus
 type: plugin
-version: 1.0.5
+version: 1.0.6
 description: A Shortcode extension to add sweet galleries with a lightbox to your Grav website.
 icon: code
 author:

vendor/glightbox/CHANGELOG.md

@@ -2,6 +2,15 @@
 
 All notable changes to this project will be documented in this file.
 
+## 3.0.9
+
+- Updated: Plyr to 3.6.8
+- Improved: JS error when the description attribute is an invalid selector
+- Fixed: Media Buttons Not responding on Android #233
+- Fixed: When touch is activated images swipe independently of their descriptions #238
+- Fixed: Width / Height data attributes do not work for image types #234
+- Fixed: Adds missing size unit of video description on resize #229
+
 ## 3.0.8
 
 - New: Added Aria-hidden on all root elements except the glightbox-container

vendor/glightbox/glightbox.js

@@ -750,6 +750,7 @@
       this.touchMove = wrapFunc(this.element, option.touchMove || noop);
       this.touchEnd = wrapFunc(this.element, option.touchEnd || noop);
       this.touchCancel = wrapFunc(this.element, option.touchCancel || noop);
+      this.translateContainer = this.element;
       this._cancelAllHandler = this.cancelAll.bind(this);
       window.addEventListener('scroll', this._cancelAllHandler);
       this.delta = null;
@@ -773,6 +774,13 @@
           return;
         }
 
+        var ignoreDragFor = ['a', 'button', 'input'];
+
+        if (evt.target && evt.target.nodeName && ignoreDragFor.indexOf(evt.target.nodeName.toLowerCase()) >= 0) {
+          console.log('ignore drag for this touched element', evt.target.nodeName.toLowerCase());
+          return;
+        }
+
         this.now = Date.now();
         this.x1 = evt.touches[0].pageX;
         this.y1 = evt.touches[0].pageY;
@@ -1028,8 +1036,15 @@
 
   function resetSlideMove(slide) {
     var transitionEnd = whichTransitionEvent();
+    var windowWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
     var media = hasClass(slide, 'gslide-media') ? slide : slide.querySelector('.gslide-media');
+    var container = closest(media, '.ginner-container');
     var desc = slide.querySelector('.gslide-description');
+
+    if (windowWidth > 769) {
+      media = container;
+    }
+
     addClass(media, 'greset');
     cssTransform(media, 'translate3d(0, 0, 0)');
     addEvent(transitionEnd, {
@@ -1108,6 +1123,12 @@
             mediaImage = media.querySelector('img');
           }
 
+          var windowWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
+
+          if (windowWidth > 769) {
+            media = currentSlide.querySelector('.ginner-container');
+          }
+
           removeClass(overlay, 'greset');
 
           if (e.pageX > 20 && e.pageX < window.innerWidth - 20) {
@@ -1729,6 +1750,14 @@
       img.setAttribute('aria-describedby', textID);
     }
 
+    if (data.hasOwnProperty('_hasCustomWidth') && data._hasCustomWidth) {
+      img.style.width = data.width;
+    }
+
+    if (data.hasOwnProperty('_hasCustomHeight') && data._hasCustomHeight) {
+      img.style.height = data.height;
+    }
+
     slideMedia.insertBefore(img, slideMedia.firstChild);
     return;
   }
@@ -2061,7 +2090,7 @@
           if (config.trim() !== '') {
             each(data, function (val, key) {
               var str = config;
-              var match = '\s?' + key + '\s?:\s?(.*?)(' + cleanKeys + '\s?:|$)';
+              var match = 's?' + key + 's?:s?(.*?)(' + cleanKeys + 's?:|$)';
               var regex = new RegExp(match);
               var matches = str.match(regex);
 
@@ -2089,27 +2118,48 @@
           }
         }
 
-        if (data.description && data.description.substring(0, 1) == '.' && document.querySelector(data.description)) {
-          data.description = document.querySelector(data.description).innerHTML;
-        } else {
+        if (data.description && data.description.substring(0, 1) === '.') {
+          var description;
+
+          try {
+            description = document.querySelector(data.description).innerHTML;
+          } catch (error) {
+            if (!(error instanceof DOMException)) {
+              throw error;
+            }
+          }
+
+          if (description) {
+            data.description = description;
+          }
+        }
+
+        if (!data.description) {
           var nodeDesc = element.querySelector('.glightbox-desc');
 
           if (nodeDesc) {
             data.description = nodeDesc.innerHTML;
           }
         }
 
-        this.setSize(data, settings);
+        this.setSize(data, settings, element);
         this.slideConfig = data;
         return data;
       }
     }, {
       key: "setSize",
       value: function setSize(data, settings) {
+        var element = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
         var defaultWith = data.type == 'video' ? this.checkSize(settings.videosWidth) : this.checkSize(settings.width);
         var defaultHeight = this.checkSize(settings.height);
         data.width = has(data, 'width') && data.width !== '' ? this.checkSize(data.width) : defaultWith;
         data.height = has(data, 'height') && data.height !== '' ? this.checkSize(data.height) : defaultHeight;
+
+        if (element && data.type == 'image') {
+          data._hasCustomWidth = element.dataset.width ? true : false;
+          data._hasCustomHeight = element.dataset.height ? true : false;
+        }
+
         return data;
       }
     }, {
@@ -2364,7 +2414,7 @@
     return Slide;
   }();
 
-  var _version = '3.0.7';
+  var _version = '3.0.9';
 
   var isMobile$1 = isMobile();
 
@@ -2407,8 +2457,8 @@
     closeOnOutsideClick: true,
     plugins: false,
     plyr: {
-      css: 'https://cdn.plyr.io/3.6.3/plyr.css',
-      js: 'https://cdn.plyr.io/3.6.3/plyr.js',
+      css: 'https://cdn.plyr.io/3.6.8/plyr.css',
+      js: 'https://cdn.plyr.io/3.6.8/plyr.js',
       config: {
         ratio: '16:9',
         fullscreen: {
@@ -2471,6 +2521,7 @@
 
       _classCallCheck(this, GlightboxInit);
 
+      this.customOptions = options;
       this.settings = extend(defaults, options);
       this.effectsClasses = this.getAnimationClasses();
       this.videoPlayers = {};
@@ -2957,8 +3008,10 @@
         }
 
         animateElement(prevSlide, animOut, function () {
+          var container = prevSlide.querySelector('.ginner-container');
           var media = prevSlide.querySelector('.gslide-media');
           var desc = prevSlide.querySelector('.gslide-description');
+          container.style.transform = '';
           media.style.transform = '';
 
           removeClass(media, 'greset');
@@ -3356,7 +3409,6 @@
         if (image) {
           if (winWidth <= 768) {
             var imgNode = image.querySelector('img');
-            imgNode.setAttribute('style', '');
           } else if (descriptionResize) {
             var descHeight = description.offsetHeight;
 
@@ -3419,10 +3471,10 @@
               description.setAttribute('style', "max-width: ".concat(vsize.width, "px;"));
             }
           } else {
-            video.parentNode.style.maxWidth = "".concat(maxWidth);
+            video.parentNode.style.maxWidth = "".concat(videoWidth);
 
             if (descriptionResize) {
-              description.setAttribute('style', "max-width: ".concat(maxWidth, ";"));
+              description.setAttribute('style', "max-width: ".concat(videoWidth, ";"));
             }
           }
         }