lightgallery 2.5.0-beta.3 → 2.5.0-beta.4

package/lightgallery.es5.js

@@ -1,5 +1,5 @@
 /*!
- * lightgallery | 2.5.0-beta.3 | April 23rd 2022
+ * lightgallery | 2.5.0-beta.4 | May 9th 2022
  * http://www.lightgalleryjs.com/
  * Copyright (c) 2020 Sachin Neravath;
  * @license GPLv3
@@ -96,6 +96,8 @@ var lightGalleryCoreSettings = {
     defaultCaptionHeight: 0,
     ariaLabelledby: '',
     ariaDescribedby: '',
+    resetScrollPosition: true,
+    hideScrollbar: false,
     closable: true,
     swipeToClose: true,
     closeOnTap: true,
@@ -832,6 +834,7 @@ var LightGallery = /** @class */ (function () {
         this.currentItemsInDom = [];
         // Scroll top value before lightGallery is opened
         this.prevScrollTop = 0;
+        this.bodyPaddingRight = 0;
         this.isDummyImageRemoved = false;
         this.dragOrSwipeEnabled = false;
         this.mediaContainerPosition = {
@@ -1179,6 +1182,27 @@ var LightGallery = /** @class */ (function () {
             return this.settings.dynamicEl || [];
         }
     };
+    LightGallery.prototype.shouldHideScrollbar = function () {
+        return (this.settings.hideScrollbar &&
+            document.body === this.settings.container);
+    };
+    LightGallery.prototype.hideScrollbar = function () {
+        if (!this.shouldHideScrollbar()) {
+            return;
+        }
+        this.bodyPaddingRight = parseFloat($LG('body').style().paddingRight);
+        var bodyRect = document.documentElement.getBoundingClientRect();
+        var scrollbarWidth = window.innerWidth - bodyRect.width;
+        $LG(document.body).css('padding-right', scrollbarWidth + this.bodyPaddingRight + 'px');
+        $LG(document.body).addClass('lg-overlay-open');
+    };
+    LightGallery.prototype.resetScrollBar = function () {
+        if (!this.shouldHideScrollbar()) {
+            return;
+        }
+        $LG(document.body).css('padding-right', this.bodyPaddingRight + 'px');
+        $LG(document.body).removeClass('lg-overlay-open');
+    };
     /**
      * Open lightGallery.
      * Open gallery with specific slide by passing index of the slide as parameter.
@@ -1215,6 +1239,7 @@ var LightGallery = /** @class */ (function () {
             return;
         this.lgOpened = true;
         this.outer.removeClass('lg-hide-items');
+        this.hideScrollbar();
         // Add display block, but still has opacity 0
         this.$container.addClass('lg-show');
         var itemsToBeInsertedToDom = this.getItemsToBeInsertedToDom(index, index);
@@ -2456,7 +2481,9 @@ var LightGallery = /** @class */ (function () {
     };
     LightGallery.prototype.trapFocus = function () {
         var _this = this;
-        this.$container.get().focus();
+        this.$container.get().focus({
+            preventScroll: true,
+        });
         $LG(window).on("keydown.lg.global" + this.lgId, function (e) {
             if (!_this.lgOpened) {
                 return;
@@ -2532,7 +2559,9 @@ var LightGallery = /** @class */ (function () {
             return 0;
         }
         this.LGel.trigger(lGEvents.beforeClose);
-        $LG(window).scrollTop(this.prevScrollTop);
+        if (this.settings.resetScrollPosition && !this.settings.hideScrollbar) {
+            $LG(window).scrollTop(this.prevScrollTop);
+        }
         var currentItem = this.items[this.index];
         var transform;
         if (this.zoomFromOrigin && currentItem) {
@@ -2577,6 +2606,8 @@ var LightGallery = /** @class */ (function () {
                 _this.outer.removeClass('lg-zoom-from-image');
             }
             _this.$container.removeClass('lg-show');
+            // Reset scrollbar
+            _this.resetScrollBar();
             // Need to remove inline opacity as it is used in the stylesheet as well
             _this.$backdrop
                 .removeAttr('style')