lightgallery 2.3.0 → 2.4.0-beta.0

package/plugins/autoplay/lg-autoplay.umd.js

@@ -1,5 +1,5 @@
 /*!
- * lightgallery | 2.3.0 | October 28th 2021
+ * lightgallery | 2.4.0-beta.0 | December 12th 2021
  * http://www.lightgalleryjs.com/
  * Copyright (c) 2020 Sachin Neravath;
  * @license GPLv3
@@ -66,6 +66,9 @@
         rotateRight: 'lgRotateRight',
         flipHorizontal: 'lgFlipHorizontal',
         flipVertical: 'lgFlipVertical',
+        autoplay: 'lgAutoplay',
+        autoplayStart: 'lgAutoplayStart',
+        autoplayStop: 'lgAutoplayStop',
     };
 
     var autoplaySettings = {
@@ -76,6 +79,7 @@
         forceSlideShowAutoplay: false,
         autoplayControls: true,
         appendAutoplayControlsTo: '.lg-toolbar',
+        autoplayPluginStrings: { toggleAutoplay: 'Toggle Autoplay' },
     };
 
     /**
@@ -111,27 +115,27 @@
             // Start autoplay
             if (this.settings.slideShowAutoplay) {
                 this.core.LGel.once(lGEvents.slideItemLoad + ".autoplay", function () {
-                    _this.startAuto();
+                    _this.startAutoPlay();
                 });
             }
             // cancel interval on touchstart and dragstart
             this.core.LGel.on(lGEvents.dragStart + ".autoplay touchstart.lg.autoplay", function () {
                 if (_this.interval) {
-                    _this.cancelAuto();
+                    _this.stopAutoPlay();
                     _this.pausedOnTouchDrag = true;
                 }
             });
             // restore autoplay if autoplay canceled from touchstart / dragstart
             this.core.LGel.on(lGEvents.dragEnd + ".autoplay touchend.lg.autoplay", function () {
                 if (!_this.interval && _this.pausedOnTouchDrag) {
-                    _this.startAuto();
+                    _this.startAutoPlay();
                     _this.pausedOnTouchDrag = false;
                 }
             });
             this.core.LGel.on(lGEvents.beforeSlide + ".autoplay", function () {
                 _this.showProgressBar();
                 if (!_this.fromAuto && _this.interval) {
-                    _this.cancelAuto();
+                    _this.stopAutoPlay();
                     _this.pausedOnSlideChange = true;
                 }
                 else {
@@ -144,7 +148,7 @@
                 if (_this.pausedOnSlideChange &&
                     !_this.interval &&
                     _this.settings.forceSlideShowAutoplay) {
-                    _this.startAuto();
+                    _this.startAutoPlay();
                     _this.pausedOnSlideChange = false;
                 }
             });
@@ -172,7 +176,7 @@
         // Manage autoplay via play/stop buttons
         Autoplay.prototype.controls = function () {
             var _this = this;
-            var _html = '<button aria-label="Toggle autoplay" type="button" class="lg-autoplay-button lg-icon"></button>';
+            var _html = "<button aria-label=\"" + this.settings.autoplayPluginStrings['toggleAutoplay'] + "\" type=\"button\" class=\"lg-autoplay-button lg-icon\"></button>";
             // Append autoplay controls
             this.core.outer
                 .find(this.settings.appendAutoplayControlsTo)
@@ -182,17 +186,17 @@
                 .first()
                 .on('click.lg.autoplay', function () {
                 if (_this.core.outer.hasClass('lg-show-autoplay')) {
-                    _this.cancelAuto();
+                    _this.stopAutoPlay();
                 }
                 else {
                     if (!_this.interval) {
-                        _this.startAuto();
+                        _this.startAutoPlay();
                     }
                 }
             });
         };
         // Autostart gallery
-        Autoplay.prototype.startAuto = function () {
+        Autoplay.prototype.startAutoPlay = function () {
             var _this = this;
             this.core.outer
                 .find('.lg-progress')
@@ -202,6 +206,9 @@
                 'ms ease 0s');
             this.core.outer.addClass('lg-show-autoplay');
             this.core.outer.find('.lg-progress-bar').addClass('lg-start');
+            this.core.LGel.trigger(lGEvents.autoplayStart, {
+                index: this.core.index,
+            });
             this.interval = setInterval(function () {
                 if (_this.core.index + 1 < _this.core.galleryItems.length) {
                     _this.core.index++;
@@ -209,13 +216,19 @@
                 else {
                     _this.core.index = 0;
                 }
+                _this.core.LGel.trigger(lGEvents.autoplay, {
+                    index: _this.core.index,
+                });
                 _this.fromAuto = true;
                 _this.core.slide(_this.core.index, false, false, 'next');
             }, this.core.settings.speed + this.settings.slideShowInterval);
         };
         // cancel Autostart
-        Autoplay.prototype.cancelAuto = function () {
+        Autoplay.prototype.stopAutoPlay = function () {
             if (this.interval) {
+                this.core.LGel.trigger(lGEvents.autoplayStop, {
+                    index: this.core.index,
+                });
                 this.core.outer.find('.lg-progress').removeAttr('style');
                 this.core.outer.removeClass('lg-show-autoplay');
                 this.core.outer.find('.lg-progress-bar').removeClass('lg-start');
@@ -224,7 +237,7 @@
             this.interval = false;
         };
         Autoplay.prototype.closeGallery = function () {
-            this.cancelAuto();
+            this.stopAutoPlay();
         };
         Autoplay.prototype.destroy = function () {
             if (this.settings.autoplay) {

package/plugins/autoplay/lg-autoplay.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"lg-autoplay.umd.js","sources":["../../../src/lg-events.ts","../../../src/plugins/autoplay/lg-autoplay-settings.ts","../../../src/plugins/autoplay/lg-autoplay.ts"],"sourcesContent":["import { LightGallery } from './lightgallery';\nimport { VideoSource } from './plugins/video/types';\n\n/**\n * List of lightGallery events\n * All events should be documented here\n * Below interfaces are used to build the website documentations\n * */\nexport const lGEvents: {\n    [key: string]: string;\n} = {\n    afterAppendSlide: 'lgAfterAppendSlide',\n    init: 'lgInit',\n    hasVideo: 'lgHasVideo',\n    containerResize: 'lgContainerResize',\n    updateSlides: 'lgUpdateSlides',\n    afterAppendSubHtml: 'lgAfterAppendSubHtml',\n    beforeOpen: 'lgBeforeOpen',\n    afterOpen: 'lgAfterOpen',\n    slideItemLoad: 'lgSlideItemLoad',\n    beforeSlide: 'lgBeforeSlide',\n    afterSlide: 'lgAfterSlide',\n    posterClick: 'lgPosterClick',\n    dragStart: 'lgDragStart',\n    dragMove: 'lgDragMove',\n    dragEnd: 'lgDragEnd',\n    beforeNextSlide: 'lgBeforeNextSlide',\n    beforePrevSlide: 'lgBeforePrevSlide',\n    beforeClose: 'lgBeforeClose',\n    afterClose: 'lgAfterClose',\n    rotateLeft: 'lgRotateLeft',\n    rotateRight: 'lgRotateRight',\n    flipHorizontal: 'lgFlipHorizontal',\n    flipVertical: 'lgFlipVertical',\n};\n\n/**\n * Fired only once when lightGallery is initialized\n * @name lgInit\n * @method onInit\n * @example\n *   const lg = document.getElementById('custom-events-demo');\n *   // Perform any action on lightGallery initialization.\n *   // Init event returns the plugin instance that can be used to call any lightGalley public method\n *   let pluginInstance = null;\n *   lg.addEventListener('lgInit', (event) => {\n *      pluginInstance = event.detail.instance;\n *   });\n *   lightGallery(lg);\n * @see <a href=\"/docs/methods\">Methods<a>\n */\nexport interface InitDetail {\n    /**\n     * lightGallery plugin instance\n     */\n    instance: LightGallery;\n}\n\n/**\n * Fired when the slide content has been inserted into it's slide container.\n * @name lgAfterAppendSlide\n * @method onAfterAppendSlide\n */\nexport interface AfterAppendSlideEventDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired immediately before opening the gallery\n * @name lgBeforeOpen\n * @method onBeforeOpen\n */\nexport interface BeforeOpenDetail {}\n\n/**\n * Fired immediately after opening the gallery\n * @name lgAfterOpen\n * @method onAfterOpen\n */\nexport interface AfterOpenDetail {}\n\n/**\n * Fired once the media inside the slide has been completely loaded .\n * @name lgSlideItemLoad\n * @method onSlideItemLoad\n */\nexport interface SlideItemLoadDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * For the first slide, lightGallery adds some delay for displaying the loaded slide item.\n     * This delay is required for the transition effect when the slide item is displayed\n     * Respect the delay when you use this event\n     */\n    delay: number;\n\n    // Will be true for the first slide\n    isFirstSlide: boolean;\n}\n\n/**\n * Fired immediately before each slide transition.\n * @name lgBeforeSlide\n * @method onBeforeSlide\n * @example\n *   const lg = document.getElementById('custom-events-demo');\n *   // Perform any action before each slide transition\n *   lg.addEventListener('lgBeforeSlide', (event) => {\n *       const { index, prevIndex } = event.detail;\n *       alert(index, prevIndex);\n *   });\n *   lightGallery(lg);\n */\nexport interface BeforeSlideDetail {\n    /**\n     * Index of the previous slide\n     */\n    prevIndex: number;\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n    /**\n     * true if slide function called via thumbnail click\n     */\n    fromThumb: boolean;\n}\n\n/**\n * Fired immediately after each slide transition.\n * @name lgAfterSlide\n * @method onAfterSlide\n */\nexport interface AfterSlideDetail {\n    /**\n     * Index of the previous slide\n     */\n    prevIndex: number;\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n    /**\n     * true if slide function called via thumbnail click\n     */\n    fromThumb: boolean;\n}\n\n/**\n * Fired when the video poster is clicked.\n * @name lgPosterClick\n * @method onPosterClick\n */\nexport interface PosterClickDetail {}\n\n/**\n * Fired when the drag event to move to different slide starts.\n * @name lgDragStart\n * @method onDragStart\n */\nexport interface DragStartDetail {}\n\n/**\n * Fired periodically during the drag operation.\n * @name lgDragMove\n * @method onDragMove\n */\nexport interface DragMoveDetail {}\n\n/**\n * Fired when the user has finished the drag operation\n * @name lgDragEnd\n * @method onDragEnd\n */\nexport interface DragEndDetail {}\n\n/**\n * Fired immediately before the start of the close process.\n * @name lgBeforeClose\n * @method onBeforeClose\n */\nexport interface BeforeCloseDetail {}\n\n/**\n * Fired immediately once lightGallery is closed.\n * @name lgAfterClose\n * @method onAfterClose\n */\nexport interface AfterCloseDetail {\n    /**\n     * lightGallery plugin instance\n     */\n    instance: LightGallery;\n}\n\n/**\n * Fired immediately before each \"next\" slide transition\n * @name lgBeforeNextSlide\n * @method onBeforeNextSlide\n */\nexport interface BeforeNextSlideDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n}\n\n/**\n * Fired immediately before each \"prev\" slide transition\n * @name lgBeforePrevSlide\n * @method onBeforePrevSlide\n */\nexport interface BeforePrevSlideDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n}\n\n/**\n * Fired when the sub-html content (ex : title/ description) has been appended into the slide.\n * @name lgAfterAppendSubHtml\n * @method onAfterAppendSubHtml\n */\nexport interface AfterAppendSubHtmlDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the lightGallery container has been resized.\n * @name lgContainerResize\n * @method onContainerResize\n */\nexport interface ContainerResizeDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when lightGallery detects video slide\n * @name lgHasVideo\n * @method onHasVideo\n */\nexport interface HasVideoDetail {\n    /**\n     * Index of the slide,\n     */\n    index: number;\n    /**\n     * Video source\n     */\n    src: string;\n    /**\n     * HTML5 video source if available\n     * <p>\n       HTML5 video source = source: {\n            src: string;\n            type: string;\n        }[];\n        attributes: HTMLVideoElement;\n     * </p>\n     */\n    html5Video: VideoSource;\n    /**\n     * True if video has poster\n     */\n    hasPoster: boolean;\n}\n","export interface AutoplaySettings {\n    /**\n     * Enable autoplay plugin\n     */\n    autoplay: boolean;\n\n    /**\n     * Enable slideshow autoplay\n     */\n    slideShowAutoplay: boolean;\n\n    /**\n     * The time (in ms) between each auto transition.\n     */\n    slideShowInterval: number;\n\n    /**\n     * Show autoplay progressBar\n     */\n    progressBar: boolean;\n\n    /**\n     * If false autoplay will be stopped after first user action\n     */\n    forceSlideShowAutoplay: boolean;\n\n    /**\n     * Show/hide autoplay controls.\n     */\n    autoplayControls: boolean;\n\n    /**\n     * Specify where the autoplay controls should be appended.\n     */\n    appendAutoplayControlsTo: string;\n}\nexport const autoplaySettings: AutoplaySettings = {\n    autoplay: true,\n    slideShowAutoplay: false,\n    slideShowInterval: 5000,\n    progressBar: true,\n    forceSlideShowAutoplay: false,\n    autoplayControls: true,\n    appendAutoplayControlsTo: '.lg-toolbar',\n};\n","import { lGEvents } from '../../lg-events';\nimport { LightGallery } from '../../lightgallery';\nimport { AutoplaySettings, autoplaySettings } from './lg-autoplay-settings';\n\n/**\n * Creates the autoplay plugin.\n * @param {object} element - lightGallery element\n */\nexport default class Autoplay {\n    core: LightGallery;\n    settings: AutoplaySettings;\n    interval!: any;\n    fromAuto!: boolean;\n    pausedOnTouchDrag!: boolean;\n    pausedOnSlideChange!: boolean;\n\n    constructor(instance: LightGallery) {\n        this.core = instance;\n        // extend module default settings with lightGallery core settings\n        this.settings = { ...autoplaySettings, ...this.core.settings };\n\n        return this;\n    }\n\n    public init(): void {\n        if (!this.settings.autoplay) {\n            return;\n        }\n\n        this.interval = false;\n\n        // Identify if slide happened from autoplay\n        this.fromAuto = true;\n\n        // Identify if autoplay canceled from touch/drag\n        this.pausedOnTouchDrag = false;\n\n        this.pausedOnSlideChange = false;\n\n        // append autoplay controls\n        if (this.settings.autoplayControls) {\n            this.controls();\n        }\n\n        // Create progress bar\n        if (this.settings.progressBar) {\n            this.core.outer.append(\n                '<div class=\"lg-progress-bar\"><div class=\"lg-progress\"></div></div>',\n            );\n        }\n\n        // Start autoplay\n        if (this.settings.slideShowAutoplay) {\n            this.core.LGel.once(`${lGEvents.slideItemLoad}.autoplay`, () => {\n                this.startAuto();\n            });\n        }\n\n        // cancel interval on touchstart and dragstart\n        this.core.LGel.on(\n            `${lGEvents.dragStart}.autoplay touchstart.lg.autoplay`,\n            () => {\n                if (this.interval) {\n                    this.cancelAuto();\n                    this.pausedOnTouchDrag = true;\n                }\n            },\n        );\n\n        // restore autoplay if autoplay canceled from touchstart / dragstart\n        this.core.LGel.on(\n            `${lGEvents.dragEnd}.autoplay touchend.lg.autoplay`,\n            () => {\n                if (!this.interval && this.pausedOnTouchDrag) {\n                    this.startAuto();\n                    this.pausedOnTouchDrag = false;\n                }\n            },\n        );\n\n        this.core.LGel.on(`${lGEvents.beforeSlide}.autoplay`, () => {\n            this.showProgressBar();\n            if (!this.fromAuto && this.interval) {\n                this.cancelAuto();\n                this.pausedOnSlideChange = true;\n            } else {\n                this.pausedOnSlideChange = false;\n            }\n            this.fromAuto = false;\n        });\n\n        // restore autoplay if autoplay canceled from touchstart / dragstart\n        this.core.LGel.on(`${lGEvents.afterSlide}.autoplay`, () => {\n            if (\n                this.pausedOnSlideChange &&\n                !this.interval &&\n                this.settings.forceSlideShowAutoplay\n            ) {\n                this.startAuto();\n                this.pausedOnSlideChange = false;\n            }\n        });\n\n        // set progress\n        this.showProgressBar();\n    }\n\n    private showProgressBar() {\n        if (this.settings.progressBar && this.fromAuto) {\n            const _$progressBar = this.core.outer.find('.lg-progress-bar');\n            const _$progress = this.core.outer.find('.lg-progress');\n            if (this.interval) {\n                _$progress.removeAttr('style');\n                _$progressBar.removeClass('lg-start');\n                setTimeout(() => {\n                    _$progress.css(\n                        'transition',\n                        'width ' +\n                            (this.core.settings.speed +\n                                this.settings.slideShowInterval) +\n                            'ms ease 0s',\n                    );\n                    _$progressBar.addClass('lg-start');\n                }, 20);\n            }\n        }\n    }\n\n    // Manage autoplay via play/stop buttons\n    private controls() {\n        const _html =\n            '<button aria-label=\"Toggle autoplay\" type=\"button\" class=\"lg-autoplay-button lg-icon\"></button>';\n\n        // Append autoplay controls\n        this.core.outer\n            .find(this.settings.appendAutoplayControlsTo)\n            .append(_html);\n\n        this.core.outer\n            .find('.lg-autoplay-button')\n            .first()\n            .on('click.lg.autoplay', () => {\n                if (this.core.outer.hasClass('lg-show-autoplay')) {\n                    this.cancelAuto();\n                } else {\n                    if (!this.interval) {\n                        this.startAuto();\n                    }\n                }\n            });\n    }\n\n    // Autostart gallery\n    public startAuto(): void {\n        this.core.outer\n            .find('.lg-progress')\n            .css(\n                'transition',\n                'width ' +\n                    (this.core.settings.speed +\n                        this.settings.slideShowInterval) +\n                    'ms ease 0s',\n            );\n        this.core.outer.addClass('lg-show-autoplay');\n        this.core.outer.find('.lg-progress-bar').addClass('lg-start');\n\n        this.interval = setInterval(() => {\n            if (this.core.index + 1 < this.core.galleryItems.length) {\n                this.core.index++;\n            } else {\n                this.core.index = 0;\n            }\n\n            this.fromAuto = true;\n            this.core.slide(this.core.index, false, false, 'next');\n        }, this.core.settings.speed + this.settings.slideShowInterval);\n    }\n\n    // cancel Autostart\n    public cancelAuto(): void {\n        if (this.interval) {\n            this.core.outer.find('.lg-progress').removeAttr('style');\n            this.core.outer.removeClass('lg-show-autoplay');\n            this.core.outer.find('.lg-progress-bar').removeClass('lg-start');\n        }\n        clearInterval(this.interval);\n        this.interval = false;\n    }\n\n    public closeGallery(): void {\n        this.cancelAuto();\n    }\n    public destroy(): void {\n        if (this.settings.autoplay) {\n            this.core.outer.find('.lg-progress-bar').remove();\n        }\n        // Remove all event listeners added by autoplay plugin\n        this.core.LGel.off('.lg.autoplay');\n        this.core.LGel.off('.autoplay');\n    }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"lg-autoplay.umd.js","sources":["../../../src/lg-events.ts","../../../src/plugins/autoplay/lg-autoplay-settings.ts","../../../src/plugins/autoplay/lg-autoplay.ts"],"sourcesContent":["import { LightGallery } from './lightgallery';\nimport { VideoSource } from './plugins/video/types';\n\n/**\n * List of lightGallery events\n * All events should be documented here\n * Below interfaces are used to build the website documentations\n * */\nexport const lGEvents: {\n    [key: string]: string;\n} = {\n    afterAppendSlide: 'lgAfterAppendSlide',\n    init: 'lgInit',\n    hasVideo: 'lgHasVideo',\n    containerResize: 'lgContainerResize',\n    updateSlides: 'lgUpdateSlides',\n    afterAppendSubHtml: 'lgAfterAppendSubHtml',\n    beforeOpen: 'lgBeforeOpen',\n    afterOpen: 'lgAfterOpen',\n    slideItemLoad: 'lgSlideItemLoad',\n    beforeSlide: 'lgBeforeSlide',\n    afterSlide: 'lgAfterSlide',\n    posterClick: 'lgPosterClick',\n    dragStart: 'lgDragStart',\n    dragMove: 'lgDragMove',\n    dragEnd: 'lgDragEnd',\n    beforeNextSlide: 'lgBeforeNextSlide',\n    beforePrevSlide: 'lgBeforePrevSlide',\n    beforeClose: 'lgBeforeClose',\n    afterClose: 'lgAfterClose',\n    rotateLeft: 'lgRotateLeft',\n    rotateRight: 'lgRotateRight',\n    flipHorizontal: 'lgFlipHorizontal',\n    flipVertical: 'lgFlipVertical',\n    autoplay: 'lgAutoplay',\n    autoplayStart: 'lgAutoplayStart',\n    autoplayStop: 'lgAutoplayStop',\n};\n\n// Follow the below format for the event documentation\n// @method is the method name when event is used with Angular/React components\n\n/**\n * Fired only once when lightGallery is initialized\n * @name lgInit\n * @method onInit\n * @example\n *   const lg = document.getElementById('custom-events-demo');\n *   // Perform any action on lightGallery initialization.\n *   // Init event returns the plugin instance that can be used to call any lightGalley public method\n *   let pluginInstance = null;\n *   lg.addEventListener('lgInit', (event) => {\n *      pluginInstance = event.detail.instance;\n *   });\n *   lightGallery(lg);\n * @see <a href=\"/docs/methods\">Methods<a>\n */\nexport interface InitDetail {\n    /**\n     * lightGallery plugin instance\n     */\n    instance: LightGallery;\n}\n\n/**\n * Fired when the slide content has been inserted into it's slide container.\n * @name lgAfterAppendSlide\n * @method onAfterAppendSlide\n */\nexport interface AfterAppendSlideEventDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired immediately before opening the gallery\n * @name lgBeforeOpen\n * @method onBeforeOpen\n */\nexport interface BeforeOpenDetail {}\n\n/**\n * Fired immediately after opening the gallery\n * @name lgAfterOpen\n * @method onAfterOpen\n */\nexport interface AfterOpenDetail {}\n\n/**\n * Fired once the media inside the slide has been completely loaded .\n * @name lgSlideItemLoad\n * @method onSlideItemLoad\n */\nexport interface SlideItemLoadDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * For the first slide, lightGallery adds some delay for displaying the loaded slide item.\n     * This delay is required for the transition effect when the slide item is displayed\n     * Respect the delay when you use this event\n     */\n    delay: number;\n\n    // Will be true for the first slide\n    isFirstSlide: boolean;\n}\n\n/**\n * Fired immediately before each slide transition.\n * @name lgBeforeSlide\n * @method onBeforeSlide\n * @example\n *   const lg = document.getElementById('custom-events-demo');\n *   // Perform any action before each slide transition\n *   lg.addEventListener('lgBeforeSlide', (event) => {\n *       const { index, prevIndex } = event.detail;\n *       alert(index, prevIndex);\n *   });\n *   lightGallery(lg);\n */\nexport interface BeforeSlideDetail {\n    /**\n     * Index of the previous slide\n     */\n    prevIndex: number;\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n    /**\n     * true if slide function called via thumbnail click\n     */\n    fromThumb: boolean;\n}\n\n/**\n * Fired immediately after each slide transition.\n * @name lgAfterSlide\n * @method onAfterSlide\n */\nexport interface AfterSlideDetail {\n    /**\n     * Index of the previous slide\n     */\n    prevIndex: number;\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n    /**\n     * true if slide function called via thumbnail click\n     */\n    fromThumb: boolean;\n}\n\n/**\n * Fired when the video poster is clicked.\n * @name lgPosterClick\n * @method onPosterClick\n */\nexport interface PosterClickDetail {}\n\n/**\n * Fired when the drag event to move to different slide starts.\n * @name lgDragStart\n * @method onDragStart\n */\nexport interface DragStartDetail {}\n\n/**\n * Fired periodically during the drag operation.\n * @name lgDragMove\n * @method onDragMove\n */\nexport interface DragMoveDetail {}\n\n/**\n * Fired when the user has finished the drag operation\n * @name lgDragEnd\n * @method onDragEnd\n */\nexport interface DragEndDetail {}\n\n/**\n * Fired immediately before the start of the close process.\n * @name lgBeforeClose\n * @method onBeforeClose\n */\nexport interface BeforeCloseDetail {}\n\n/**\n * Fired immediately once lightGallery is closed.\n * @name lgAfterClose\n * @method onAfterClose\n */\nexport interface AfterCloseDetail {\n    /**\n     * lightGallery plugin instance\n     */\n    instance: LightGallery;\n}\n\n/**\n * Fired immediately before each \"next\" slide transition\n * @name lgBeforeNextSlide\n * @method onBeforeNextSlide\n */\nexport interface BeforeNextSlideDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n}\n\n/**\n * Fired immediately before each \"prev\" slide transition\n * @name lgBeforePrevSlide\n * @method onBeforePrevSlide\n */\nexport interface BeforePrevSlideDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n}\n\n/**\n * Fired when the sub-html content (ex : title/ description) has been appended into the slide.\n * @name lgAfterAppendSubHtml\n * @method onAfterAppendSubHtml\n */\nexport interface AfterAppendSubHtmlDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the lightGallery container has been resized.\n * @name lgContainerResize\n * @method onContainerResize\n */\nexport interface ContainerResizeDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when lightGallery detects video slide\n * @name lgHasVideo\n * @method onHasVideo\n */\nexport interface HasVideoDetail {\n    /**\n     * Index of the slide,\n     */\n    index: number;\n    /**\n     * Video source\n     */\n    src: string;\n    /**\n     * HTML5 video source if available\n     * <p>\n       HTML5 video source = source: {\n            src: string;\n            type: string;\n        }[];\n        attributes: HTMLVideoElement;\n     * </p>\n     */\n    html5Video: VideoSource;\n    /**\n     * True if video has poster\n     */\n    hasPoster: boolean;\n}\n\n/**\n * Fired when the image is rotated in anticlockwise direction\n * @name lgRotateLeft\n * @method onRotateLeft\n */\nexport interface RotateLeftDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the image is rotated in clockwise direction\n * @name lgRotateRight\n * @method onRotateRight\n */\nexport interface RotateRightDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the image is flipped horizontally\n * @name lgFlipHorizontal\n * @method onFlipHorizontal\n */\nexport interface FlipHorizontalDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the image is flipped vertically\n * @name lgFlipVertical\n * @method onFlipVertical\n */\nexport interface FlipVerticalDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n","export interface AutoplaySettings {\n    /**\n     * Enable autoplay plugin\n     */\n    autoplay: boolean;\n\n    /**\n     * Enable slideshow autoplay\n     */\n    slideShowAutoplay: boolean;\n\n    /**\n     * The time (in ms) between each auto transition.\n     */\n    slideShowInterval: number;\n\n    /**\n     * Show autoplay progressBar\n     */\n    progressBar: boolean;\n\n    /**\n     * If false autoplay will be stopped after first user action\n     */\n    forceSlideShowAutoplay: boolean;\n\n    /**\n     * Show/hide autoplay controls.\n     */\n    autoplayControls: boolean;\n\n    /**\n     * Specify where the autoplay controls should be appended.\n     */\n    appendAutoplayControlsTo: string;\n\n    /**\n     * Custom translation strings for aria-labels\n     */\n    autoplayPluginStrings: { [key: string]: string };\n}\nexport const autoplaySettings: AutoplaySettings = {\n    autoplay: true,\n    slideShowAutoplay: false,\n    slideShowInterval: 5000,\n    progressBar: true,\n    forceSlideShowAutoplay: false,\n    autoplayControls: true,\n    appendAutoplayControlsTo: '.lg-toolbar',\n    autoplayPluginStrings: { toggleAutoplay: 'Toggle Autoplay' },\n};\n","import { lGEvents } from '../../lg-events';\nimport { LightGallery } from '../../lightgallery';\nimport { AutoplaySettings, autoplaySettings } from './lg-autoplay-settings';\n\n/**\n * Creates the autoplay plugin.\n * @param {object} element - lightGallery element\n */\nexport default class Autoplay {\n    core: LightGallery;\n    settings: AutoplaySettings;\n    interval!: any;\n    fromAuto!: boolean;\n    pausedOnTouchDrag!: boolean;\n    pausedOnSlideChange!: boolean;\n\n    constructor(instance: LightGallery) {\n        this.core = instance;\n\n        // extend module default settings with lightGallery core settings\n        this.settings = { ...autoplaySettings, ...this.core.settings };\n\n        return this;\n    }\n\n    public init(): void {\n        if (!this.settings.autoplay) {\n            return;\n        }\n\n        this.interval = false;\n\n        // Identify if slide happened from autoplay\n        this.fromAuto = true;\n\n        // Identify if autoplay canceled from touch/drag\n        this.pausedOnTouchDrag = false;\n\n        this.pausedOnSlideChange = false;\n\n        // append autoplay controls\n        if (this.settings.autoplayControls) {\n            this.controls();\n        }\n\n        // Create progress bar\n        if (this.settings.progressBar) {\n            this.core.outer.append(\n                '<div class=\"lg-progress-bar\"><div class=\"lg-progress\"></div></div>',\n            );\n        }\n\n        // Start autoplay\n        if (this.settings.slideShowAutoplay) {\n            this.core.LGel.once(`${lGEvents.slideItemLoad}.autoplay`, () => {\n                this.startAutoPlay();\n            });\n        }\n\n        // cancel interval on touchstart and dragstart\n        this.core.LGel.on(\n            `${lGEvents.dragStart}.autoplay touchstart.lg.autoplay`,\n            () => {\n                if (this.interval) {\n                    this.stopAutoPlay();\n                    this.pausedOnTouchDrag = true;\n                }\n            },\n        );\n\n        // restore autoplay if autoplay canceled from touchstart / dragstart\n        this.core.LGel.on(\n            `${lGEvents.dragEnd}.autoplay touchend.lg.autoplay`,\n            () => {\n                if (!this.interval && this.pausedOnTouchDrag) {\n                    this.startAutoPlay();\n                    this.pausedOnTouchDrag = false;\n                }\n            },\n        );\n\n        this.core.LGel.on(`${lGEvents.beforeSlide}.autoplay`, () => {\n            this.showProgressBar();\n            if (!this.fromAuto && this.interval) {\n                this.stopAutoPlay();\n                this.pausedOnSlideChange = true;\n            } else {\n                this.pausedOnSlideChange = false;\n            }\n            this.fromAuto = false;\n        });\n\n        // restore autoplay if autoplay canceled from touchstart / dragstart\n        this.core.LGel.on(`${lGEvents.afterSlide}.autoplay`, () => {\n            if (\n                this.pausedOnSlideChange &&\n                !this.interval &&\n                this.settings.forceSlideShowAutoplay\n            ) {\n                this.startAutoPlay();\n                this.pausedOnSlideChange = false;\n            }\n        });\n\n        // set progress\n        this.showProgressBar();\n    }\n\n    private showProgressBar() {\n        if (this.settings.progressBar && this.fromAuto) {\n            const _$progressBar = this.core.outer.find('.lg-progress-bar');\n            const _$progress = this.core.outer.find('.lg-progress');\n            if (this.interval) {\n                _$progress.removeAttr('style');\n                _$progressBar.removeClass('lg-start');\n                setTimeout(() => {\n                    _$progress.css(\n                        'transition',\n                        'width ' +\n                            (this.core.settings.speed +\n                                this.settings.slideShowInterval) +\n                            'ms ease 0s',\n                    );\n                    _$progressBar.addClass('lg-start');\n                }, 20);\n            }\n        }\n    }\n\n    // Manage autoplay via play/stop buttons\n    private controls() {\n        const _html = `<button aria-label=\"${this.settings.autoplayPluginStrings['toggleAutoplay']}\" type=\"button\" class=\"lg-autoplay-button lg-icon\"></button>`;\n\n        // Append autoplay controls\n        this.core.outer\n            .find(this.settings.appendAutoplayControlsTo)\n            .append(_html);\n\n        this.core.outer\n            .find('.lg-autoplay-button')\n            .first()\n            .on('click.lg.autoplay', () => {\n                if (this.core.outer.hasClass('lg-show-autoplay')) {\n                    this.stopAutoPlay();\n                } else {\n                    if (!this.interval) {\n                        this.startAutoPlay();\n                    }\n                }\n            });\n    }\n\n    // Autostart gallery\n    public startAutoPlay(): void {\n        this.core.outer\n            .find('.lg-progress')\n            .css(\n                'transition',\n                'width ' +\n                    (this.core.settings.speed +\n                        this.settings.slideShowInterval) +\n                    'ms ease 0s',\n            );\n        this.core.outer.addClass('lg-show-autoplay');\n        this.core.outer.find('.lg-progress-bar').addClass('lg-start');\n        this.core.LGel.trigger(lGEvents.autoplayStart, {\n            index: this.core.index,\n        });\n\n        this.interval = setInterval(() => {\n            if (this.core.index + 1 < this.core.galleryItems.length) {\n                this.core.index++;\n            } else {\n                this.core.index = 0;\n            }\n\n            this.core.LGel.trigger(lGEvents.autoplay, {\n                index: this.core.index,\n            });\n\n            this.fromAuto = true;\n            this.core.slide(this.core.index, false, false, 'next');\n        }, this.core.settings.speed + this.settings.slideShowInterval);\n    }\n\n    // cancel Autostart\n    public stopAutoPlay(): void {\n        if (this.interval) {\n            this.core.LGel.trigger(lGEvents.autoplayStop, {\n                index: this.core.index,\n            });\n            this.core.outer.find('.lg-progress').removeAttr('style');\n            this.core.outer.removeClass('lg-show-autoplay');\n            this.core.outer.find('.lg-progress-bar').removeClass('lg-start');\n        }\n        clearInterval(this.interval);\n        this.interval = false;\n    }\n\n    public closeGallery(): void {\n        this.stopAutoPlay();\n    }\n    public destroy(): void {\n        if (this.settings.autoplay) {\n            this.core.outer.find('.lg-progress-bar').remove();\n        }\n        // Remove all event listeners added by autoplay plugin\n        this.core.LGel.off('.lg.autoplay');\n        this.core.LGel.off('.autoplay');\n    }\n}\n"],"names":[],"mappings":"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"}

package/plugins/comment/lg-comment-settings.d.ts

@@ -22,5 +22,11 @@ export interface CommentSettings {
      * Facebook comments default markup
      */
     commentsMarkup: string;
+    /**
+     * Custom translation strings for aria-labels
+     */
+    commentPluginStrings: {
+        [key: string]: string;
+    };
 }
 export declare const commentSettings: CommentSettings;

package/plugins/comment/lg-comment.es5.js

@@ -1,5 +1,5 @@
 /*!
- * lightgallery | 2.3.0 | October 28th 2021
+ * lightgallery | 2.4.0-beta.0 | December 12th 2021
  * http://www.lightgalleryjs.com/
  * Copyright (c) 2020 Sachin Neravath;
  * @license GPLv3
@@ -60,6 +60,9 @@ var lGEvents = {
     rotateRight: 'lgRotateRight',
     flipHorizontal: 'lgFlipHorizontal',
     flipVertical: 'lgFlipVertical',
+    autoplay: 'lgAutoplay',
+    autoplayStart: 'lgAutoplayStart',
+    autoplayStop: 'lgAutoplayStop',
 };
 
 var commentSettings = {
@@ -71,6 +74,7 @@ var commentSettings = {
         language: 'en',
     },
     commentsMarkup: '<div id="lg-comment-box" class="lg-comment-box lg-fb-comment-box"><div class="lg-comment-header"><h3 class="lg-comment-title">Leave a comment.</h3><span class="lg-comment-close lg-icon"></span></div><div class="lg-comment-body"></div></div>',
+    commentPluginStrings: { toggleComments: 'Toggle Comments' },
 };
 
 /**
@@ -108,7 +112,7 @@ var CommentBox = /** @class */ (function () {
     CommentBox.prototype.setMarkup = function () {
         this.core.outer.append(this.settings.commentsMarkup +
             '<div class="lg-comment-overlay"></div>');
-        var commentToggleBtn = '<button type="button" aria-label="Toggle comments" class="lg-comment-toggle lg-icon"></button>';
+        var commentToggleBtn = "<button type=\"button\" aria-label=\"" + this.settings.commentPluginStrings['toggleComments'] + "\" class=\"lg-comment-toggle lg-icon\"></button>";
         this.core.$toolbar.append(commentToggleBtn);
     };
     CommentBox.prototype.toggleCommentBox = function () {

package/plugins/comment/lg-comment.es5.js.map

@@ -1 +1 @@
-{"version":3,"file":"lg-comment.es5.js","sources":["../../../src/lg-events.ts","../../../src/plugins/comment/lg-comment-settings.ts","../../../src/plugins/comment/lg-comment.ts"],"sourcesContent":["import { LightGallery } from './lightgallery';\nimport { VideoSource } from './plugins/video/types';\n\n/**\n * List of lightGallery events\n * All events should be documented here\n * Below interfaces are used to build the website documentations\n * */\nexport const lGEvents: {\n    [key: string]: string;\n} = {\n    afterAppendSlide: 'lgAfterAppendSlide',\n    init: 'lgInit',\n    hasVideo: 'lgHasVideo',\n    containerResize: 'lgContainerResize',\n    updateSlides: 'lgUpdateSlides',\n    afterAppendSubHtml: 'lgAfterAppendSubHtml',\n    beforeOpen: 'lgBeforeOpen',\n    afterOpen: 'lgAfterOpen',\n    slideItemLoad: 'lgSlideItemLoad',\n    beforeSlide: 'lgBeforeSlide',\n    afterSlide: 'lgAfterSlide',\n    posterClick: 'lgPosterClick',\n    dragStart: 'lgDragStart',\n    dragMove: 'lgDragMove',\n    dragEnd: 'lgDragEnd',\n    beforeNextSlide: 'lgBeforeNextSlide',\n    beforePrevSlide: 'lgBeforePrevSlide',\n    beforeClose: 'lgBeforeClose',\n    afterClose: 'lgAfterClose',\n    rotateLeft: 'lgRotateLeft',\n    rotateRight: 'lgRotateRight',\n    flipHorizontal: 'lgFlipHorizontal',\n    flipVertical: 'lgFlipVertical',\n};\n\n/**\n * Fired only once when lightGallery is initialized\n * @name lgInit\n * @method onInit\n * @example\n *   const lg = document.getElementById('custom-events-demo');\n *   // Perform any action on lightGallery initialization.\n *   // Init event returns the plugin instance that can be used to call any lightGalley public method\n *   let pluginInstance = null;\n *   lg.addEventListener('lgInit', (event) => {\n *      pluginInstance = event.detail.instance;\n *   });\n *   lightGallery(lg);\n * @see <a href=\"/docs/methods\">Methods<a>\n */\nexport interface InitDetail {\n    /**\n     * lightGallery plugin instance\n     */\n    instance: LightGallery;\n}\n\n/**\n * Fired when the slide content has been inserted into it's slide container.\n * @name lgAfterAppendSlide\n * @method onAfterAppendSlide\n */\nexport interface AfterAppendSlideEventDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired immediately before opening the gallery\n * @name lgBeforeOpen\n * @method onBeforeOpen\n */\nexport interface BeforeOpenDetail {}\n\n/**\n * Fired immediately after opening the gallery\n * @name lgAfterOpen\n * @method onAfterOpen\n */\nexport interface AfterOpenDetail {}\n\n/**\n * Fired once the media inside the slide has been completely loaded .\n * @name lgSlideItemLoad\n * @method onSlideItemLoad\n */\nexport interface SlideItemLoadDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * For the first slide, lightGallery adds some delay for displaying the loaded slide item.\n     * This delay is required for the transition effect when the slide item is displayed\n     * Respect the delay when you use this event\n     */\n    delay: number;\n\n    // Will be true for the first slide\n    isFirstSlide: boolean;\n}\n\n/**\n * Fired immediately before each slide transition.\n * @name lgBeforeSlide\n * @method onBeforeSlide\n * @example\n *   const lg = document.getElementById('custom-events-demo');\n *   // Perform any action before each slide transition\n *   lg.addEventListener('lgBeforeSlide', (event) => {\n *       const { index, prevIndex } = event.detail;\n *       alert(index, prevIndex);\n *   });\n *   lightGallery(lg);\n */\nexport interface BeforeSlideDetail {\n    /**\n     * Index of the previous slide\n     */\n    prevIndex: number;\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n    /**\n     * true if slide function called via thumbnail click\n     */\n    fromThumb: boolean;\n}\n\n/**\n * Fired immediately after each slide transition.\n * @name lgAfterSlide\n * @method onAfterSlide\n */\nexport interface AfterSlideDetail {\n    /**\n     * Index of the previous slide\n     */\n    prevIndex: number;\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n    /**\n     * true if slide function called via thumbnail click\n     */\n    fromThumb: boolean;\n}\n\n/**\n * Fired when the video poster is clicked.\n * @name lgPosterClick\n * @method onPosterClick\n */\nexport interface PosterClickDetail {}\n\n/**\n * Fired when the drag event to move to different slide starts.\n * @name lgDragStart\n * @method onDragStart\n */\nexport interface DragStartDetail {}\n\n/**\n * Fired periodically during the drag operation.\n * @name lgDragMove\n * @method onDragMove\n */\nexport interface DragMoveDetail {}\n\n/**\n * Fired when the user has finished the drag operation\n * @name lgDragEnd\n * @method onDragEnd\n */\nexport interface DragEndDetail {}\n\n/**\n * Fired immediately before the start of the close process.\n * @name lgBeforeClose\n * @method onBeforeClose\n */\nexport interface BeforeCloseDetail {}\n\n/**\n * Fired immediately once lightGallery is closed.\n * @name lgAfterClose\n * @method onAfterClose\n */\nexport interface AfterCloseDetail {\n    /**\n     * lightGallery plugin instance\n     */\n    instance: LightGallery;\n}\n\n/**\n * Fired immediately before each \"next\" slide transition\n * @name lgBeforeNextSlide\n * @method onBeforeNextSlide\n */\nexport interface BeforeNextSlideDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n}\n\n/**\n * Fired immediately before each \"prev\" slide transition\n * @name lgBeforePrevSlide\n * @method onBeforePrevSlide\n */\nexport interface BeforePrevSlideDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n}\n\n/**\n * Fired when the sub-html content (ex : title/ description) has been appended into the slide.\n * @name lgAfterAppendSubHtml\n * @method onAfterAppendSubHtml\n */\nexport interface AfterAppendSubHtmlDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the lightGallery container has been resized.\n * @name lgContainerResize\n * @method onContainerResize\n */\nexport interface ContainerResizeDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when lightGallery detects video slide\n * @name lgHasVideo\n * @method onHasVideo\n */\nexport interface HasVideoDetail {\n    /**\n     * Index of the slide,\n     */\n    index: number;\n    /**\n     * Video source\n     */\n    src: string;\n    /**\n     * HTML5 video source if available\n     * <p>\n       HTML5 video source = source: {\n            src: string;\n            type: string;\n        }[];\n        attributes: HTMLVideoElement;\n     * </p>\n     */\n    html5Video: VideoSource;\n    /**\n     * True if video has poster\n     */\n    hasPoster: boolean;\n}\n","export interface CommentSettings {\n    /**\n     * Enable comment box\n     */\n    commentBox: boolean;\n    /**\n     * Enable facebook comment box\n     */\n    fbComments: boolean;\n    /**\n     * Enable disqus comment box\n     */\n    disqusComments: boolean;\n\n    /**\n     * Disqus comment config\n     */\n    disqusConfig: {\n        title?: string;\n        language: string;\n    };\n\n    /**\n     * Facebook comments default markup\n     */\n    commentsMarkup: string;\n}\n\nexport const commentSettings: CommentSettings = {\n    commentBox: false,\n    fbComments: false,\n    disqusComments: false,\n    disqusConfig: {\n        title: undefined,\n        language: 'en',\n    },\n    commentsMarkup:\n        '<div id=\"lg-comment-box\" class=\"lg-comment-box lg-fb-comment-box\"><div class=\"lg-comment-header\"><h3 class=\"lg-comment-title\">Leave a comment.</h3><span class=\"lg-comment-close lg-icon\"></span></div><div class=\"lg-comment-body\"></div></div>',\n};\n","/**\n * lightGallery comments module\n * Supports facebook and disqus comments\n *\n * @ref - https://help.disqus.com/customer/portal/articles/472098-javascript-configuration-variables\n * @ref - https://github.com/disqus/DISQUS-API-Recipes/blob/master/snippets/js/disqus-reset/disqus_reset.html\n * @ref - https://css-tricks.com/lazy-loading-disqus-comments/\n * @ref - https://developers.facebook.com/docs/plugins/comments/#comments-plugin\n *\n */\n\nimport { lGEvents } from '../../lg-events';\nimport { LgQuery } from '../../lgQuery';\nimport { LightGallery } from '../../lightgallery';\nimport { commentSettings, CommentSettings } from './lg-comment-settings';\ndeclare let FB: any;\ndeclare let DISQUS: any;\n\nexport default class CommentBox {\n    core: LightGallery;\n    settings: CommentSettings;\n    private $LG!: LgQuery;\n    constructor(instance: LightGallery, $LG: LgQuery) {\n        // get lightGallery core plugin instance\n        this.core = instance;\n        this.$LG = $LG;\n        // extend module default settings with lightGallery core settings\n        this.settings = { ...commentSettings, ...this.core.settings };\n\n        return this;\n    }\n\n    public init(): void {\n        if (!this.settings.commentBox) {\n            return;\n        }\n        this.setMarkup();\n        this.toggleCommentBox();\n        if (this.settings.fbComments) {\n            this.addFbComments();\n        } else if (this.settings.disqusComments) {\n            this.addDisqusComments();\n        }\n    }\n\n    private setMarkup() {\n        this.core.outer.append(\n            this.settings.commentsMarkup +\n                '<div class=\"lg-comment-overlay\"></div>',\n        );\n\n        const commentToggleBtn =\n            '<button type=\"button\" aria-label=\"Toggle comments\" class=\"lg-comment-toggle lg-icon\"></button>';\n        this.core.$toolbar.append(commentToggleBtn);\n    }\n\n    toggleCommentBox(): void {\n        this.core.outer\n            .find('.lg-comment-toggle')\n            .first()\n            .on('click.lg.comment', () => {\n                this.core.outer.toggleClass('lg-comment-active');\n            });\n\n        this.core.outer\n            .find('.lg-comment-overlay')\n            .first()\n            .on('click.lg.comment', () => {\n                this.core.outer.removeClass('lg-comment-active');\n            });\n        this.core.outer\n            .find('.lg-comment-close')\n            .first()\n            .on('click.lg.comment', () => {\n                this.core.outer.removeClass('lg-comment-active');\n            });\n    }\n\n    addFbComments() {\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const _this = this;\n        this.core.LGel.on(`${lGEvents.beforeSlide}.comment`, (event) => {\n            const html = this.core.galleryItems[event.detail.index].fbHtml;\n            this.core.outer.find('.lg-comment-body').html(html as string);\n        });\n        this.core.LGel.on(`${lGEvents.afterSlide}.comment`, function () {\n            try {\n                FB.XFBML.parse();\n            } catch (err) {\n                _this.$LG(window).on('fbAsyncInit', function () {\n                    FB.XFBML.parse();\n                });\n            }\n        });\n    }\n\n    addDisqusComments(): void {\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const _this = this;\n        const $disqusThread = this.$LG('#disqus_thread');\n        $disqusThread.remove();\n        this.core.outer\n            .find('.lg-comment-body')\n            .append('<div id=\"disqus_thread\"></div>');\n\n        this.core.LGel.on(`${lGEvents.beforeSlide}.comment`, () => {\n            $disqusThread.html('');\n        });\n\n        this.core.LGel.on(`${lGEvents.afterSlide}.comment`, (event) => {\n            const { index } = event.detail;\n            // eslint-disable-next-line @typescript-eslint/no-this-alias\n            const _this = this;\n            // DISQUS needs sometime to intialize when lightGallery is opened from direct url(hash plugin).\n            setTimeout(\n                function () {\n                    try {\n                        DISQUS.reset({\n                            reload: true,\n                            config: function () {\n                                this.page.identifier =\n                                    _this.core.galleryItems[\n                                        index\n                                    ].disqusIdentifier;\n                                this.page.url =\n                                    _this.core.galleryItems[index].disqusURL;\n                                this.page.title =\n                                    _this.settings.disqusConfig.title;\n                                this.language =\n                                    _this.settings.disqusConfig.language;\n                            },\n                        });\n                    } catch (err) {\n                        console.error(\n                            'Make sure you have included disqus JavaScript code in your document. Ex - https://lg-disqus.disqus.com/admin/install/platforms/universalcode/',\n                        );\n                    }\n                },\n                _this.core.lGalleryOn ? 0 : 1000,\n            );\n        });\n    }\n\n    destroy(): void {\n        this.core.LGel.off('.lg.comment');\n        this.core.LGel.off('.comment');\n    }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"lg-comment.es5.js","sources":["../../../src/lg-events.ts","../../../src/plugins/comment/lg-comment-settings.ts","../../../src/plugins/comment/lg-comment.ts"],"sourcesContent":["import { LightGallery } from './lightgallery';\nimport { VideoSource } from './plugins/video/types';\n\n/**\n * List of lightGallery events\n * All events should be documented here\n * Below interfaces are used to build the website documentations\n * */\nexport const lGEvents: {\n    [key: string]: string;\n} = {\n    afterAppendSlide: 'lgAfterAppendSlide',\n    init: 'lgInit',\n    hasVideo: 'lgHasVideo',\n    containerResize: 'lgContainerResize',\n    updateSlides: 'lgUpdateSlides',\n    afterAppendSubHtml: 'lgAfterAppendSubHtml',\n    beforeOpen: 'lgBeforeOpen',\n    afterOpen: 'lgAfterOpen',\n    slideItemLoad: 'lgSlideItemLoad',\n    beforeSlide: 'lgBeforeSlide',\n    afterSlide: 'lgAfterSlide',\n    posterClick: 'lgPosterClick',\n    dragStart: 'lgDragStart',\n    dragMove: 'lgDragMove',\n    dragEnd: 'lgDragEnd',\n    beforeNextSlide: 'lgBeforeNextSlide',\n    beforePrevSlide: 'lgBeforePrevSlide',\n    beforeClose: 'lgBeforeClose',\n    afterClose: 'lgAfterClose',\n    rotateLeft: 'lgRotateLeft',\n    rotateRight: 'lgRotateRight',\n    flipHorizontal: 'lgFlipHorizontal',\n    flipVertical: 'lgFlipVertical',\n    autoplay: 'lgAutoplay',\n    autoplayStart: 'lgAutoplayStart',\n    autoplayStop: 'lgAutoplayStop',\n};\n\n// Follow the below format for the event documentation\n// @method is the method name when event is used with Angular/React components\n\n/**\n * Fired only once when lightGallery is initialized\n * @name lgInit\n * @method onInit\n * @example\n *   const lg = document.getElementById('custom-events-demo');\n *   // Perform any action on lightGallery initialization.\n *   // Init event returns the plugin instance that can be used to call any lightGalley public method\n *   let pluginInstance = null;\n *   lg.addEventListener('lgInit', (event) => {\n *      pluginInstance = event.detail.instance;\n *   });\n *   lightGallery(lg);\n * @see <a href=\"/docs/methods\">Methods<a>\n */\nexport interface InitDetail {\n    /**\n     * lightGallery plugin instance\n     */\n    instance: LightGallery;\n}\n\n/**\n * Fired when the slide content has been inserted into it's slide container.\n * @name lgAfterAppendSlide\n * @method onAfterAppendSlide\n */\nexport interface AfterAppendSlideEventDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired immediately before opening the gallery\n * @name lgBeforeOpen\n * @method onBeforeOpen\n */\nexport interface BeforeOpenDetail {}\n\n/**\n * Fired immediately after opening the gallery\n * @name lgAfterOpen\n * @method onAfterOpen\n */\nexport interface AfterOpenDetail {}\n\n/**\n * Fired once the media inside the slide has been completely loaded .\n * @name lgSlideItemLoad\n * @method onSlideItemLoad\n */\nexport interface SlideItemLoadDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * For the first slide, lightGallery adds some delay for displaying the loaded slide item.\n     * This delay is required for the transition effect when the slide item is displayed\n     * Respect the delay when you use this event\n     */\n    delay: number;\n\n    // Will be true for the first slide\n    isFirstSlide: boolean;\n}\n\n/**\n * Fired immediately before each slide transition.\n * @name lgBeforeSlide\n * @method onBeforeSlide\n * @example\n *   const lg = document.getElementById('custom-events-demo');\n *   // Perform any action before each slide transition\n *   lg.addEventListener('lgBeforeSlide', (event) => {\n *       const { index, prevIndex } = event.detail;\n *       alert(index, prevIndex);\n *   });\n *   lightGallery(lg);\n */\nexport interface BeforeSlideDetail {\n    /**\n     * Index of the previous slide\n     */\n    prevIndex: number;\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n    /**\n     * true if slide function called via thumbnail click\n     */\n    fromThumb: boolean;\n}\n\n/**\n * Fired immediately after each slide transition.\n * @name lgAfterSlide\n * @method onAfterSlide\n */\nexport interface AfterSlideDetail {\n    /**\n     * Index of the previous slide\n     */\n    prevIndex: number;\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n    /**\n     * true if slide function called via thumbnail click\n     */\n    fromThumb: boolean;\n}\n\n/**\n * Fired when the video poster is clicked.\n * @name lgPosterClick\n * @method onPosterClick\n */\nexport interface PosterClickDetail {}\n\n/**\n * Fired when the drag event to move to different slide starts.\n * @name lgDragStart\n * @method onDragStart\n */\nexport interface DragStartDetail {}\n\n/**\n * Fired periodically during the drag operation.\n * @name lgDragMove\n * @method onDragMove\n */\nexport interface DragMoveDetail {}\n\n/**\n * Fired when the user has finished the drag operation\n * @name lgDragEnd\n * @method onDragEnd\n */\nexport interface DragEndDetail {}\n\n/**\n * Fired immediately before the start of the close process.\n * @name lgBeforeClose\n * @method onBeforeClose\n */\nexport interface BeforeCloseDetail {}\n\n/**\n * Fired immediately once lightGallery is closed.\n * @name lgAfterClose\n * @method onAfterClose\n */\nexport interface AfterCloseDetail {\n    /**\n     * lightGallery plugin instance\n     */\n    instance: LightGallery;\n}\n\n/**\n * Fired immediately before each \"next\" slide transition\n * @name lgBeforeNextSlide\n * @method onBeforeNextSlide\n */\nexport interface BeforeNextSlideDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n}\n\n/**\n * Fired immediately before each \"prev\" slide transition\n * @name lgBeforePrevSlide\n * @method onBeforePrevSlide\n */\nexport interface BeforePrevSlideDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n}\n\n/**\n * Fired when the sub-html content (ex : title/ description) has been appended into the slide.\n * @name lgAfterAppendSubHtml\n * @method onAfterAppendSubHtml\n */\nexport interface AfterAppendSubHtmlDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the lightGallery container has been resized.\n * @name lgContainerResize\n * @method onContainerResize\n */\nexport interface ContainerResizeDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when lightGallery detects video slide\n * @name lgHasVideo\n * @method onHasVideo\n */\nexport interface HasVideoDetail {\n    /**\n     * Index of the slide,\n     */\n    index: number;\n    /**\n     * Video source\n     */\n    src: string;\n    /**\n     * HTML5 video source if available\n     * <p>\n       HTML5 video source = source: {\n            src: string;\n            type: string;\n        }[];\n        attributes: HTMLVideoElement;\n     * </p>\n     */\n    html5Video: VideoSource;\n    /**\n     * True if video has poster\n     */\n    hasPoster: boolean;\n}\n\n/**\n * Fired when the image is rotated in anticlockwise direction\n * @name lgRotateLeft\n * @method onRotateLeft\n */\nexport interface RotateLeftDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the image is rotated in clockwise direction\n * @name lgRotateRight\n * @method onRotateRight\n */\nexport interface RotateRightDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the image is flipped horizontally\n * @name lgFlipHorizontal\n * @method onFlipHorizontal\n */\nexport interface FlipHorizontalDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the image is flipped vertically\n * @name lgFlipVertical\n * @method onFlipVertical\n */\nexport interface FlipVerticalDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n","export interface CommentSettings {\n    /**\n     * Enable comment box\n     */\n    commentBox: boolean;\n    /**\n     * Enable facebook comment box\n     */\n    fbComments: boolean;\n    /**\n     * Enable disqus comment box\n     */\n    disqusComments: boolean;\n\n    /**\n     * Disqus comment config\n     */\n    disqusConfig: {\n        title?: string;\n        language: string;\n    };\n\n    /**\n     * Facebook comments default markup\n     */\n    commentsMarkup: string;\n\n    /**\n     * Custom translation strings for aria-labels\n     */\n    commentPluginStrings: { [key: string]: string };\n}\n\nexport const commentSettings: CommentSettings = {\n    commentBox: false,\n    fbComments: false,\n    disqusComments: false,\n    disqusConfig: {\n        title: undefined,\n        language: 'en',\n    },\n    commentsMarkup:\n        '<div id=\"lg-comment-box\" class=\"lg-comment-box lg-fb-comment-box\"><div class=\"lg-comment-header\"><h3 class=\"lg-comment-title\">Leave a comment.</h3><span class=\"lg-comment-close lg-icon\"></span></div><div class=\"lg-comment-body\"></div></div>',\n    commentPluginStrings: { toggleComments: 'Toggle Comments' },\n};\n","/**\n * lightGallery comments module\n * Supports facebook and disqus comments\n *\n * @ref - https://help.disqus.com/customer/portal/articles/472098-javascript-configuration-variables\n * @ref - https://github.com/disqus/DISQUS-API-Recipes/blob/master/snippets/js/disqus-reset/disqus_reset.html\n * @ref - https://css-tricks.com/lazy-loading-disqus-comments/\n * @ref - https://developers.facebook.com/docs/plugins/comments/#comments-plugin\n *\n */\n\nimport { lGEvents } from '../../lg-events';\nimport { LgQuery } from '../../lgQuery';\nimport { LightGallery } from '../../lightgallery';\nimport { commentSettings, CommentSettings } from './lg-comment-settings';\n\ndeclare let FB: any;\ndeclare let DISQUS: any;\n\nexport default class CommentBox {\n    core: LightGallery;\n    settings: CommentSettings;\n    private $LG!: LgQuery;\n    constructor(instance: LightGallery, $LG: LgQuery) {\n        // get lightGallery core plugin instance\n        this.core = instance;\n        this.$LG = $LG;\n\n        // extend module default settings with lightGallery core settings\n        this.settings = { ...commentSettings, ...this.core.settings };\n\n        return this;\n    }\n\n    public init(): void {\n        if (!this.settings.commentBox) {\n            return;\n        }\n        this.setMarkup();\n        this.toggleCommentBox();\n        if (this.settings.fbComments) {\n            this.addFbComments();\n        } else if (this.settings.disqusComments) {\n            this.addDisqusComments();\n        }\n    }\n\n    private setMarkup() {\n        this.core.outer.append(\n            this.settings.commentsMarkup +\n                '<div class=\"lg-comment-overlay\"></div>',\n        );\n\n        const commentToggleBtn = `<button type=\"button\" aria-label=\"${this.settings.commentPluginStrings['toggleComments']}\" class=\"lg-comment-toggle lg-icon\"></button>`;\n        this.core.$toolbar.append(commentToggleBtn);\n    }\n\n    toggleCommentBox(): void {\n        this.core.outer\n            .find('.lg-comment-toggle')\n            .first()\n            .on('click.lg.comment', () => {\n                this.core.outer.toggleClass('lg-comment-active');\n            });\n\n        this.core.outer\n            .find('.lg-comment-overlay')\n            .first()\n            .on('click.lg.comment', () => {\n                this.core.outer.removeClass('lg-comment-active');\n            });\n        this.core.outer\n            .find('.lg-comment-close')\n            .first()\n            .on('click.lg.comment', () => {\n                this.core.outer.removeClass('lg-comment-active');\n            });\n    }\n\n    addFbComments() {\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const _this = this;\n        this.core.LGel.on(`${lGEvents.beforeSlide}.comment`, (event) => {\n            const html = this.core.galleryItems[event.detail.index].fbHtml;\n            this.core.outer.find('.lg-comment-body').html(html as string);\n        });\n        this.core.LGel.on(`${lGEvents.afterSlide}.comment`, function () {\n            try {\n                FB.XFBML.parse();\n            } catch (err) {\n                _this.$LG(window).on('fbAsyncInit', function () {\n                    FB.XFBML.parse();\n                });\n            }\n        });\n    }\n\n    addDisqusComments(): void {\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const _this = this;\n        const $disqusThread = this.$LG('#disqus_thread');\n        $disqusThread.remove();\n        this.core.outer\n            .find('.lg-comment-body')\n            .append('<div id=\"disqus_thread\"></div>');\n\n        this.core.LGel.on(`${lGEvents.beforeSlide}.comment`, () => {\n            $disqusThread.html('');\n        });\n\n        this.core.LGel.on(`${lGEvents.afterSlide}.comment`, (event) => {\n            const { index } = event.detail;\n            // eslint-disable-next-line @typescript-eslint/no-this-alias\n            const _this = this;\n            // DISQUS needs sometime to intialize when lightGallery is opened from direct url(hash plugin).\n            setTimeout(\n                function () {\n                    try {\n                        DISQUS.reset({\n                            reload: true,\n                            config: function () {\n                                this.page.identifier =\n                                    _this.core.galleryItems[\n                                        index\n                                    ].disqusIdentifier;\n                                this.page.url =\n                                    _this.core.galleryItems[index].disqusURL;\n                                this.page.title =\n                                    _this.settings.disqusConfig.title;\n                                this.language =\n                                    _this.settings.disqusConfig.language;\n                            },\n                        });\n                    } catch (err) {\n                        console.error(\n                            'Make sure you have included disqus JavaScript code in your document. Ex - https://lg-disqus.disqus.com/admin/install/platforms/universalcode/',\n                        );\n                    }\n                },\n                _this.core.lGalleryOn ? 0 : 1000,\n            );\n        });\n    }\n\n    destroy(): void {\n        this.core.LGel.off('.lg.comment');\n        this.core.LGel.off('.comment');\n    }\n}\n"],"names":[],"mappings":"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"}

package/plugins/comment/lg-comment.min.js

@@ -1,8 +1,8 @@
 /**
- * lightgallery | 2.3.0 | October 28th 2021
+ * lightgallery | 2.4.0-beta.0 | December 12th 2021
  * http://www.lightgalleryjs.com/
  * Copyright (c) 2020 Sachin Neravath;
  * @license GPLv3
  */
 
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).lgComment=e()}(this,(function(){"use strict";var t=function(){return(t=Object.assign||function(t){for(var e,o=1,n=arguments.length;o<n;o++)for(var i in e=arguments[o])Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t}).apply(this,arguments)},e="lgBeforeSlide",o="lgAfterSlide",n={commentBox:!1,fbComments:!1,disqusComments:!1,disqusConfig:{title:void 0,language:"en"},commentsMarkup:'<div id="lg-comment-box" class="lg-comment-box lg-fb-comment-box"><div class="lg-comment-header"><h3 class="lg-comment-title">Leave a comment.</h3><span class="lg-comment-close lg-icon"></span></div><div class="lg-comment-body"></div></div>'};return function(){function i(e,o){return this.core=e,this.$LG=o,this.settings=t(t({},n),this.core.settings),this}return i.prototype.init=function(){this.settings.commentBox&&(this.setMarkup(),this.toggleCommentBox(),this.settings.fbComments?this.addFbComments():this.settings.disqusComments&&this.addDisqusComments())},i.prototype.setMarkup=function(){this.core.outer.append(this.settings.commentsMarkup+'<div class="lg-comment-overlay"></div>');this.core.$toolbar.append('<button type="button" aria-label="Toggle comments" class="lg-comment-toggle lg-icon"></button>')},i.prototype.toggleCommentBox=function(){var t=this;this.core.outer.find(".lg-comment-toggle").first().on("click.lg.comment",(function(){t.core.outer.toggleClass("lg-comment-active")})),this.core.outer.find(".lg-comment-overlay").first().on("click.lg.comment",(function(){t.core.outer.removeClass("lg-comment-active")})),this.core.outer.find(".lg-comment-close").first().on("click.lg.comment",(function(){t.core.outer.removeClass("lg-comment-active")}))},i.prototype.addFbComments=function(){var t=this,n=this;this.core.LGel.on(e+".comment",(function(e){var o=t.core.galleryItems[e.detail.index].fbHtml;t.core.outer.find(".lg-comment-body").html(o)})),this.core.LGel.on(o+".comment",(function(){try{FB.XFBML.parse()}catch(t){n.$LG(window).on("fbAsyncInit",(function(){FB.XFBML.parse()}))}}))},i.prototype.addDisqusComments=function(){var t=this,n=this.$LG("#disqus_thread");n.remove(),this.core.outer.find(".lg-comment-body").append('<div id="disqus_thread"></div>'),this.core.LGel.on(e+".comment",(function(){n.html("")})),this.core.LGel.on(o+".comment",(function(e){var o=e.detail.index,n=t;setTimeout((function(){try{DISQUS.reset({reload:!0,config:function(){this.page.identifier=n.core.galleryItems[o].disqusIdentifier,this.page.url=n.core.galleryItems[o].disqusURL,this.page.title=n.settings.disqusConfig.title,this.language=n.settings.disqusConfig.language}})}catch(t){console.error("Make sure you have included disqus JavaScript code in your document. Ex - https://lg-disqus.disqus.com/admin/install/platforms/universalcode/")}}),n.core.lGalleryOn?0:1e3)}))},i.prototype.destroy=function(){this.core.LGel.off(".lg.comment"),this.core.LGel.off(".comment")},i}()}));
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).lgComment=e()}(this,(function(){"use strict";var t=function(){return(t=Object.assign||function(t){for(var e,o=1,n=arguments.length;o<n;o++)for(var i in e=arguments[o])Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t}).apply(this,arguments)},e="lgBeforeSlide",o="lgAfterSlide",n={commentBox:!1,fbComments:!1,disqusComments:!1,disqusConfig:{title:void 0,language:"en"},commentsMarkup:'<div id="lg-comment-box" class="lg-comment-box lg-fb-comment-box"><div class="lg-comment-header"><h3 class="lg-comment-title">Leave a comment.</h3><span class="lg-comment-close lg-icon"></span></div><div class="lg-comment-body"></div></div>',commentPluginStrings:{toggleComments:"Toggle Comments"}};return function(){function i(e,o){return this.core=e,this.$LG=o,this.settings=t(t({},n),this.core.settings),this}return i.prototype.init=function(){this.settings.commentBox&&(this.setMarkup(),this.toggleCommentBox(),this.settings.fbComments?this.addFbComments():this.settings.disqusComments&&this.addDisqusComments())},i.prototype.setMarkup=function(){this.core.outer.append(this.settings.commentsMarkup+'<div class="lg-comment-overlay"></div>');var t='<button type="button" aria-label="'+this.settings.commentPluginStrings.toggleComments+'" class="lg-comment-toggle lg-icon"></button>';this.core.$toolbar.append(t)},i.prototype.toggleCommentBox=function(){var t=this;this.core.outer.find(".lg-comment-toggle").first().on("click.lg.comment",(function(){t.core.outer.toggleClass("lg-comment-active")})),this.core.outer.find(".lg-comment-overlay").first().on("click.lg.comment",(function(){t.core.outer.removeClass("lg-comment-active")})),this.core.outer.find(".lg-comment-close").first().on("click.lg.comment",(function(){t.core.outer.removeClass("lg-comment-active")}))},i.prototype.addFbComments=function(){var t=this,n=this;this.core.LGel.on(e+".comment",(function(e){var o=t.core.galleryItems[e.detail.index].fbHtml;t.core.outer.find(".lg-comment-body").html(o)})),this.core.LGel.on(o+".comment",(function(){try{FB.XFBML.parse()}catch(t){n.$LG(window).on("fbAsyncInit",(function(){FB.XFBML.parse()}))}}))},i.prototype.addDisqusComments=function(){var t=this,n=this.$LG("#disqus_thread");n.remove(),this.core.outer.find(".lg-comment-body").append('<div id="disqus_thread"></div>'),this.core.LGel.on(e+".comment",(function(){n.html("")})),this.core.LGel.on(o+".comment",(function(e){var o=e.detail.index,n=t;setTimeout((function(){try{DISQUS.reset({reload:!0,config:function(){this.page.identifier=n.core.galleryItems[o].disqusIdentifier,this.page.url=n.core.galleryItems[o].disqusURL,this.page.title=n.settings.disqusConfig.title,this.language=n.settings.disqusConfig.language}})}catch(t){console.error("Make sure you have included disqus JavaScript code in your document. Ex - https://lg-disqus.disqus.com/admin/install/platforms/universalcode/")}}),n.core.lGalleryOn?0:1e3)}))},i.prototype.destroy=function(){this.core.LGel.off(".lg.comment"),this.core.LGel.off(".comment")},i}()}));

package/plugins/comment/lg-comment.umd.js

@@ -1,5 +1,5 @@
 /*!
- * lightgallery | 2.3.0 | October 28th 2021
+ * lightgallery | 2.4.0-beta.0 | December 12th 2021
  * http://www.lightgalleryjs.com/
  * Copyright (c) 2020 Sachin Neravath;
  * @license GPLv3
@@ -66,6 +66,9 @@
         rotateRight: 'lgRotateRight',
         flipHorizontal: 'lgFlipHorizontal',
         flipVertical: 'lgFlipVertical',
+        autoplay: 'lgAutoplay',
+        autoplayStart: 'lgAutoplayStart',
+        autoplayStop: 'lgAutoplayStop',
     };
 
     var commentSettings = {
@@ -77,6 +80,7 @@
             language: 'en',
         },
         commentsMarkup: '<div id="lg-comment-box" class="lg-comment-box lg-fb-comment-box"><div class="lg-comment-header"><h3 class="lg-comment-title">Leave a comment.</h3><span class="lg-comment-close lg-icon"></span></div><div class="lg-comment-body"></div></div>',
+        commentPluginStrings: { toggleComments: 'Toggle Comments' },
     };
 
     /**
@@ -114,7 +118,7 @@
         CommentBox.prototype.setMarkup = function () {
             this.core.outer.append(this.settings.commentsMarkup +
                 '<div class="lg-comment-overlay"></div>');
-            var commentToggleBtn = '<button type="button" aria-label="Toggle comments" class="lg-comment-toggle lg-icon"></button>';
+            var commentToggleBtn = "<button type=\"button\" aria-label=\"" + this.settings.commentPluginStrings['toggleComments'] + "\" class=\"lg-comment-toggle lg-icon\"></button>";
             this.core.$toolbar.append(commentToggleBtn);
         };
         CommentBox.prototype.toggleCommentBox = function () {

package/plugins/comment/lg-comment.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"lg-comment.umd.js","sources":["../../../src/lg-events.ts","../../../src/plugins/comment/lg-comment-settings.ts","../../../src/plugins/comment/lg-comment.ts"],"sourcesContent":["import { LightGallery } from './lightgallery';\nimport { VideoSource } from './plugins/video/types';\n\n/**\n * List of lightGallery events\n * All events should be documented here\n * Below interfaces are used to build the website documentations\n * */\nexport const lGEvents: {\n    [key: string]: string;\n} = {\n    afterAppendSlide: 'lgAfterAppendSlide',\n    init: 'lgInit',\n    hasVideo: 'lgHasVideo',\n    containerResize: 'lgContainerResize',\n    updateSlides: 'lgUpdateSlides',\n    afterAppendSubHtml: 'lgAfterAppendSubHtml',\n    beforeOpen: 'lgBeforeOpen',\n    afterOpen: 'lgAfterOpen',\n    slideItemLoad: 'lgSlideItemLoad',\n    beforeSlide: 'lgBeforeSlide',\n    afterSlide: 'lgAfterSlide',\n    posterClick: 'lgPosterClick',\n    dragStart: 'lgDragStart',\n    dragMove: 'lgDragMove',\n    dragEnd: 'lgDragEnd',\n    beforeNextSlide: 'lgBeforeNextSlide',\n    beforePrevSlide: 'lgBeforePrevSlide',\n    beforeClose: 'lgBeforeClose',\n    afterClose: 'lgAfterClose',\n    rotateLeft: 'lgRotateLeft',\n    rotateRight: 'lgRotateRight',\n    flipHorizontal: 'lgFlipHorizontal',\n    flipVertical: 'lgFlipVertical',\n};\n\n/**\n * Fired only once when lightGallery is initialized\n * @name lgInit\n * @method onInit\n * @example\n *   const lg = document.getElementById('custom-events-demo');\n *   // Perform any action on lightGallery initialization.\n *   // Init event returns the plugin instance that can be used to call any lightGalley public method\n *   let pluginInstance = null;\n *   lg.addEventListener('lgInit', (event) => {\n *      pluginInstance = event.detail.instance;\n *   });\n *   lightGallery(lg);\n * @see <a href=\"/docs/methods\">Methods<a>\n */\nexport interface InitDetail {\n    /**\n     * lightGallery plugin instance\n     */\n    instance: LightGallery;\n}\n\n/**\n * Fired when the slide content has been inserted into it's slide container.\n * @name lgAfterAppendSlide\n * @method onAfterAppendSlide\n */\nexport interface AfterAppendSlideEventDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired immediately before opening the gallery\n * @name lgBeforeOpen\n * @method onBeforeOpen\n */\nexport interface BeforeOpenDetail {}\n\n/**\n * Fired immediately after opening the gallery\n * @name lgAfterOpen\n * @method onAfterOpen\n */\nexport interface AfterOpenDetail {}\n\n/**\n * Fired once the media inside the slide has been completely loaded .\n * @name lgSlideItemLoad\n * @method onSlideItemLoad\n */\nexport interface SlideItemLoadDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * For the first slide, lightGallery adds some delay for displaying the loaded slide item.\n     * This delay is required for the transition effect when the slide item is displayed\n     * Respect the delay when you use this event\n     */\n    delay: number;\n\n    // Will be true for the first slide\n    isFirstSlide: boolean;\n}\n\n/**\n * Fired immediately before each slide transition.\n * @name lgBeforeSlide\n * @method onBeforeSlide\n * @example\n *   const lg = document.getElementById('custom-events-demo');\n *   // Perform any action before each slide transition\n *   lg.addEventListener('lgBeforeSlide', (event) => {\n *       const { index, prevIndex } = event.detail;\n *       alert(index, prevIndex);\n *   });\n *   lightGallery(lg);\n */\nexport interface BeforeSlideDetail {\n    /**\n     * Index of the previous slide\n     */\n    prevIndex: number;\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n    /**\n     * true if slide function called via thumbnail click\n     */\n    fromThumb: boolean;\n}\n\n/**\n * Fired immediately after each slide transition.\n * @name lgAfterSlide\n * @method onAfterSlide\n */\nexport interface AfterSlideDetail {\n    /**\n     * Index of the previous slide\n     */\n    prevIndex: number;\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n    /**\n     * true if slide function called via thumbnail click\n     */\n    fromThumb: boolean;\n}\n\n/**\n * Fired when the video poster is clicked.\n * @name lgPosterClick\n * @method onPosterClick\n */\nexport interface PosterClickDetail {}\n\n/**\n * Fired when the drag event to move to different slide starts.\n * @name lgDragStart\n * @method onDragStart\n */\nexport interface DragStartDetail {}\n\n/**\n * Fired periodically during the drag operation.\n * @name lgDragMove\n * @method onDragMove\n */\nexport interface DragMoveDetail {}\n\n/**\n * Fired when the user has finished the drag operation\n * @name lgDragEnd\n * @method onDragEnd\n */\nexport interface DragEndDetail {}\n\n/**\n * Fired immediately before the start of the close process.\n * @name lgBeforeClose\n * @method onBeforeClose\n */\nexport interface BeforeCloseDetail {}\n\n/**\n * Fired immediately once lightGallery is closed.\n * @name lgAfterClose\n * @method onAfterClose\n */\nexport interface AfterCloseDetail {\n    /**\n     * lightGallery plugin instance\n     */\n    instance: LightGallery;\n}\n\n/**\n * Fired immediately before each \"next\" slide transition\n * @name lgBeforeNextSlide\n * @method onBeforeNextSlide\n */\nexport interface BeforeNextSlideDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n}\n\n/**\n * Fired immediately before each \"prev\" slide transition\n * @name lgBeforePrevSlide\n * @method onBeforePrevSlide\n */\nexport interface BeforePrevSlideDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n}\n\n/**\n * Fired when the sub-html content (ex : title/ description) has been appended into the slide.\n * @name lgAfterAppendSubHtml\n * @method onAfterAppendSubHtml\n */\nexport interface AfterAppendSubHtmlDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the lightGallery container has been resized.\n * @name lgContainerResize\n * @method onContainerResize\n */\nexport interface ContainerResizeDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when lightGallery detects video slide\n * @name lgHasVideo\n * @method onHasVideo\n */\nexport interface HasVideoDetail {\n    /**\n     * Index of the slide,\n     */\n    index: number;\n    /**\n     * Video source\n     */\n    src: string;\n    /**\n     * HTML5 video source if available\n     * <p>\n       HTML5 video source = source: {\n            src: string;\n            type: string;\n        }[];\n        attributes: HTMLVideoElement;\n     * </p>\n     */\n    html5Video: VideoSource;\n    /**\n     * True if video has poster\n     */\n    hasPoster: boolean;\n}\n","export interface CommentSettings {\n    /**\n     * Enable comment box\n     */\n    commentBox: boolean;\n    /**\n     * Enable facebook comment box\n     */\n    fbComments: boolean;\n    /**\n     * Enable disqus comment box\n     */\n    disqusComments: boolean;\n\n    /**\n     * Disqus comment config\n     */\n    disqusConfig: {\n        title?: string;\n        language: string;\n    };\n\n    /**\n     * Facebook comments default markup\n     */\n    commentsMarkup: string;\n}\n\nexport const commentSettings: CommentSettings = {\n    commentBox: false,\n    fbComments: false,\n    disqusComments: false,\n    disqusConfig: {\n        title: undefined,\n        language: 'en',\n    },\n    commentsMarkup:\n        '<div id=\"lg-comment-box\" class=\"lg-comment-box lg-fb-comment-box\"><div class=\"lg-comment-header\"><h3 class=\"lg-comment-title\">Leave a comment.</h3><span class=\"lg-comment-close lg-icon\"></span></div><div class=\"lg-comment-body\"></div></div>',\n};\n","/**\n * lightGallery comments module\n * Supports facebook and disqus comments\n *\n * @ref - https://help.disqus.com/customer/portal/articles/472098-javascript-configuration-variables\n * @ref - https://github.com/disqus/DISQUS-API-Recipes/blob/master/snippets/js/disqus-reset/disqus_reset.html\n * @ref - https://css-tricks.com/lazy-loading-disqus-comments/\n * @ref - https://developers.facebook.com/docs/plugins/comments/#comments-plugin\n *\n */\n\nimport { lGEvents } from '../../lg-events';\nimport { LgQuery } from '../../lgQuery';\nimport { LightGallery } from '../../lightgallery';\nimport { commentSettings, CommentSettings } from './lg-comment-settings';\ndeclare let FB: any;\ndeclare let DISQUS: any;\n\nexport default class CommentBox {\n    core: LightGallery;\n    settings: CommentSettings;\n    private $LG!: LgQuery;\n    constructor(instance: LightGallery, $LG: LgQuery) {\n        // get lightGallery core plugin instance\n        this.core = instance;\n        this.$LG = $LG;\n        // extend module default settings with lightGallery core settings\n        this.settings = { ...commentSettings, ...this.core.settings };\n\n        return this;\n    }\n\n    public init(): void {\n        if (!this.settings.commentBox) {\n            return;\n        }\n        this.setMarkup();\n        this.toggleCommentBox();\n        if (this.settings.fbComments) {\n            this.addFbComments();\n        } else if (this.settings.disqusComments) {\n            this.addDisqusComments();\n        }\n    }\n\n    private setMarkup() {\n        this.core.outer.append(\n            this.settings.commentsMarkup +\n                '<div class=\"lg-comment-overlay\"></div>',\n        );\n\n        const commentToggleBtn =\n            '<button type=\"button\" aria-label=\"Toggle comments\" class=\"lg-comment-toggle lg-icon\"></button>';\n        this.core.$toolbar.append(commentToggleBtn);\n    }\n\n    toggleCommentBox(): void {\n        this.core.outer\n            .find('.lg-comment-toggle')\n            .first()\n            .on('click.lg.comment', () => {\n                this.core.outer.toggleClass('lg-comment-active');\n            });\n\n        this.core.outer\n            .find('.lg-comment-overlay')\n            .first()\n            .on('click.lg.comment', () => {\n                this.core.outer.removeClass('lg-comment-active');\n            });\n        this.core.outer\n            .find('.lg-comment-close')\n            .first()\n            .on('click.lg.comment', () => {\n                this.core.outer.removeClass('lg-comment-active');\n            });\n    }\n\n    addFbComments() {\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const _this = this;\n        this.core.LGel.on(`${lGEvents.beforeSlide}.comment`, (event) => {\n            const html = this.core.galleryItems[event.detail.index].fbHtml;\n            this.core.outer.find('.lg-comment-body').html(html as string);\n        });\n        this.core.LGel.on(`${lGEvents.afterSlide}.comment`, function () {\n            try {\n                FB.XFBML.parse();\n            } catch (err) {\n                _this.$LG(window).on('fbAsyncInit', function () {\n                    FB.XFBML.parse();\n                });\n            }\n        });\n    }\n\n    addDisqusComments(): void {\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const _this = this;\n        const $disqusThread = this.$LG('#disqus_thread');\n        $disqusThread.remove();\n        this.core.outer\n            .find('.lg-comment-body')\n            .append('<div id=\"disqus_thread\"></div>');\n\n        this.core.LGel.on(`${lGEvents.beforeSlide}.comment`, () => {\n            $disqusThread.html('');\n        });\n\n        this.core.LGel.on(`${lGEvents.afterSlide}.comment`, (event) => {\n            const { index } = event.detail;\n            // eslint-disable-next-line @typescript-eslint/no-this-alias\n            const _this = this;\n            // DISQUS needs sometime to intialize when lightGallery is opened from direct url(hash plugin).\n            setTimeout(\n                function () {\n                    try {\n                        DISQUS.reset({\n                            reload: true,\n                            config: function () {\n                                this.page.identifier =\n                                    _this.core.galleryItems[\n                                        index\n                                    ].disqusIdentifier;\n                                this.page.url =\n                                    _this.core.galleryItems[index].disqusURL;\n                                this.page.title =\n                                    _this.settings.disqusConfig.title;\n                                this.language =\n                                    _this.settings.disqusConfig.language;\n                            },\n                        });\n                    } catch (err) {\n                        console.error(\n                            'Make sure you have included disqus JavaScript code in your document. Ex - https://lg-disqus.disqus.com/admin/install/platforms/universalcode/',\n                        );\n                    }\n                },\n                _this.core.lGalleryOn ? 0 : 1000,\n            );\n        });\n    }\n\n    destroy(): void {\n        this.core.LGel.off('.lg.comment');\n        this.core.LGel.off('.comment');\n    }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGA;;;;;IAKO,IAAM,QAAQ,GAEjB;QACA,gBAAgB,EAAE,oBAAoB;QACtC,IAAI,EAAE,QAAQ;QACd,QAAQ,EAAE,YAAY;QACtB,eAAe,EAAE,mBAAmB;QACpC,YAAY,EAAE,gBAAgB;QAC9B,kBAAkB,EAAE,sBAAsB;QAC1C,UAAU,EAAE,cAAc;QAC1B,SAAS,EAAE,aAAa;QACxB,aAAa,EAAE,iBAAiB;QAChC,WAAW,EAAE,eAAe;QAC5B,UAAU,EAAE,cAAc;QAC1B,WAAW,EAAE,eAAe;QAC5B,SAAS,EAAE,aAAa;QACxB,QAAQ,EAAE,YAAY;QACtB,OAAO,EAAE,WAAW;QACpB,eAAe,EAAE,mBAAmB;QACpC,eAAe,EAAE,mBAAmB;QACpC,WAAW,EAAE,eAAe;QAC5B,UAAU,EAAE,cAAc;QAC1B,UAAU,EAAE,cAAc;QAC1B,WAAW,EAAE,eAAe;QAC5B,cAAc,EAAE,kBAAkB;QAClC,YAAY,EAAE,gBAAgB;KACjC;;ICNM,IAAM,eAAe,GAAoB;QAC5C,UAAU,EAAE,KAAK;QACjB,UAAU,EAAE,KAAK;QACjB,cAAc,EAAE,KAAK;QACrB,YAAY,EAAE;YACV,KAAK,EAAE,SAAS;YAChB,QAAQ,EAAE,IAAI;SACjB;QACD,cAAc,EACV,kPAAkP;KACzP;;ICtCD;;;;;;;;;;;QAsBI,oBAAY,QAAsB,EAAE,GAAY;;YAE5C,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAC;YACrB,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;;YAEf,IAAI,CAAC,QAAQ,yBAAQ,eAAe,GAAK,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAE,CAAC;YAE9D,OAAO,IAAI,CAAC;SACf;QAEM,yBAAI,GAAX;YACI,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE;gBAC3B,OAAO;aACV;YACD,IAAI,CAAC,SAAS,EAAE,CAAC;YACjB,IAAI,CAAC,gBAAgB,EAAE,CAAC;YACxB,IAAI,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE;gBAC1B,IAAI,CAAC,aAAa,EAAE,CAAC;aACxB;iBAAM,IAAI,IAAI,CAAC,QAAQ,CAAC,cAAc,EAAE;gBACrC,IAAI,CAAC,iBAAiB,EAAE,CAAC;aAC5B;SACJ;QAEO,8BAAS,GAAjB;YACI,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAClB,IAAI,CAAC,QAAQ,CAAC,cAAc;gBACxB,wCAAwC,CAC/C,CAAC;YAEF,IAAM,gBAAgB,GAClB,gGAAgG,CAAC;YACrG,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC;SAC/C;QAED,qCAAgB,GAAhB;YAAA,mBAoBC;YAnBG,IAAI,CAAC,IAAI,CAAC,KAAK;iBACV,IAAI,CAAC,oBAAoB,CAAC;iBAC1B,KAAK,EAAE;iBACP,EAAE,CAAC,kBAAkB,EAAE;gBACpB,OAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,mBAAmB,CAAC,CAAC;aACpD,CAAC,CAAC;YAEP,IAAI,CAAC,IAAI,CAAC,KAAK;iBACV,IAAI,CAAC,qBAAqB,CAAC;iBAC3B,KAAK,EAAE;iBACP,EAAE,CAAC,kBAAkB,EAAE;gBACpB,OAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,mBAAmB,CAAC,CAAC;aACpD,CAAC,CAAC;YACP,IAAI,CAAC,IAAI,CAAC,KAAK;iBACV,IAAI,CAAC,mBAAmB,CAAC;iBACzB,KAAK,EAAE;iBACP,EAAE,CAAC,kBAAkB,EAAE;gBACpB,OAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,mBAAmB,CAAC,CAAC;aACpD,CAAC,CAAC;SACV;QAED,kCAAa,GAAb;YAAA,mBAgBC;;YAdG,IAAM,KAAK,GAAG,IAAI,CAAC;YACnB,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAI,QAAQ,CAAC,WAAW,aAAU,EAAE,UAAC,KAAK;gBACvD,IAAM,IAAI,GAAG,OAAI,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC;gBAC/D,OAAI,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC,IAAI,CAAC,IAAc,CAAC,CAAC;aACjE,CAAC,CAAC;YACH,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAI,QAAQ,CAAC,UAAU,aAAU,EAAE;gBAChD,IAAI;oBACA,EAAE,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;iBACpB;gBAAC,OAAO,GAAG,EAAE;oBACV,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,aAAa,EAAE;wBAChC,EAAE,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;qBACpB,CAAC,CAAC;iBACN;aACJ,CAAC,CAAC;SACN;QAED,sCAAiB,GAAjB;YAAA,mBA6CC;YA1CG,IAAM,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;YACjD,aAAa,CAAC,MAAM,EAAE,CAAC;YACvB,IAAI,CAAC,IAAI,CAAC,KAAK;iBACV,IAAI,CAAC,kBAAkB,CAAC;iBACxB,MAAM,CAAC,gCAAgC,CAAC,CAAC;YAE9C,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAI,QAAQ,CAAC,WAAW,aAAU,EAAE;gBACjD,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;aAC1B,CAAC,CAAC;YAEH,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAI,QAAQ,CAAC,UAAU,aAAU,EAAE,UAAC,KAAK;gBAC9C,IAAA,KAAK,GAAK,KAAK,CAAC,MAAM,MAAjB,CAAkB;;gBAE/B,IAAM,KAAK,GAAG,OAAI,CAAC;;gBAEnB,UAAU,CACN;oBACI,IAAI;wBACA,MAAM,CAAC,KAAK,CAAC;4BACT,MAAM,EAAE,IAAI;4BACZ,MAAM,EAAE;gCACJ,IAAI,CAAC,IAAI,CAAC,UAAU;oCAChB,KAAK,CAAC,IAAI,CAAC,YAAY,CACnB,KAAK,CACR,CAAC,gBAAgB,CAAC;gCACvB,IAAI,CAAC,IAAI,CAAC,GAAG;oCACT,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC;gCAC7C,IAAI,CAAC,IAAI,CAAC,KAAK;oCACX,KAAK,CAAC,QAAQ,CAAC,YAAY,CAAC,KAAK,CAAC;gCACtC,IAAI,CAAC,QAAQ;oCACT,KAAK,CAAC,QAAQ,CAAC,YAAY,CAAC,QAAQ,CAAC;6BAC5C;yBACJ,CAAC,CAAC;qBACN;oBAAC,OAAO,GAAG,EAAE;wBACV,OAAO,CAAC,KAAK,CACT,+IAA+I,CAClJ,CAAC;qBACL;iBACJ,EACD,KAAK,CAAC,IAAI,CAAC,UAAU,GAAG,CAAC,GAAG,IAAI,CACnC,CAAC;aACL,CAAC,CAAC;SACN;QAED,4BAAO,GAAP;YACI,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;YAClC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;SAClC;QACL,iBAAC;IAAD,CAAC;;;;"}
+{"version":3,"file":"lg-comment.umd.js","sources":["../../../src/lg-events.ts","../../../src/plugins/comment/lg-comment-settings.ts","../../../src/plugins/comment/lg-comment.ts"],"sourcesContent":["import { LightGallery } from './lightgallery';\nimport { VideoSource } from './plugins/video/types';\n\n/**\n * List of lightGallery events\n * All events should be documented here\n * Below interfaces are used to build the website documentations\n * */\nexport const lGEvents: {\n    [key: string]: string;\n} = {\n    afterAppendSlide: 'lgAfterAppendSlide',\n    init: 'lgInit',\n    hasVideo: 'lgHasVideo',\n    containerResize: 'lgContainerResize',\n    updateSlides: 'lgUpdateSlides',\n    afterAppendSubHtml: 'lgAfterAppendSubHtml',\n    beforeOpen: 'lgBeforeOpen',\n    afterOpen: 'lgAfterOpen',\n    slideItemLoad: 'lgSlideItemLoad',\n    beforeSlide: 'lgBeforeSlide',\n    afterSlide: 'lgAfterSlide',\n    posterClick: 'lgPosterClick',\n    dragStart: 'lgDragStart',\n    dragMove: 'lgDragMove',\n    dragEnd: 'lgDragEnd',\n    beforeNextSlide: 'lgBeforeNextSlide',\n    beforePrevSlide: 'lgBeforePrevSlide',\n    beforeClose: 'lgBeforeClose',\n    afterClose: 'lgAfterClose',\n    rotateLeft: 'lgRotateLeft',\n    rotateRight: 'lgRotateRight',\n    flipHorizontal: 'lgFlipHorizontal',\n    flipVertical: 'lgFlipVertical',\n    autoplay: 'lgAutoplay',\n    autoplayStart: 'lgAutoplayStart',\n    autoplayStop: 'lgAutoplayStop',\n};\n\n// Follow the below format for the event documentation\n// @method is the method name when event is used with Angular/React components\n\n/**\n * Fired only once when lightGallery is initialized\n * @name lgInit\n * @method onInit\n * @example\n *   const lg = document.getElementById('custom-events-demo');\n *   // Perform any action on lightGallery initialization.\n *   // Init event returns the plugin instance that can be used to call any lightGalley public method\n *   let pluginInstance = null;\n *   lg.addEventListener('lgInit', (event) => {\n *      pluginInstance = event.detail.instance;\n *   });\n *   lightGallery(lg);\n * @see <a href=\"/docs/methods\">Methods<a>\n */\nexport interface InitDetail {\n    /**\n     * lightGallery plugin instance\n     */\n    instance: LightGallery;\n}\n\n/**\n * Fired when the slide content has been inserted into it's slide container.\n * @name lgAfterAppendSlide\n * @method onAfterAppendSlide\n */\nexport interface AfterAppendSlideEventDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired immediately before opening the gallery\n * @name lgBeforeOpen\n * @method onBeforeOpen\n */\nexport interface BeforeOpenDetail {}\n\n/**\n * Fired immediately after opening the gallery\n * @name lgAfterOpen\n * @method onAfterOpen\n */\nexport interface AfterOpenDetail {}\n\n/**\n * Fired once the media inside the slide has been completely loaded .\n * @name lgSlideItemLoad\n * @method onSlideItemLoad\n */\nexport interface SlideItemLoadDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * For the first slide, lightGallery adds some delay for displaying the loaded slide item.\n     * This delay is required for the transition effect when the slide item is displayed\n     * Respect the delay when you use this event\n     */\n    delay: number;\n\n    // Will be true for the first slide\n    isFirstSlide: boolean;\n}\n\n/**\n * Fired immediately before each slide transition.\n * @name lgBeforeSlide\n * @method onBeforeSlide\n * @example\n *   const lg = document.getElementById('custom-events-demo');\n *   // Perform any action before each slide transition\n *   lg.addEventListener('lgBeforeSlide', (event) => {\n *       const { index, prevIndex } = event.detail;\n *       alert(index, prevIndex);\n *   });\n *   lightGallery(lg);\n */\nexport interface BeforeSlideDetail {\n    /**\n     * Index of the previous slide\n     */\n    prevIndex: number;\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n    /**\n     * true if slide function called via thumbnail click\n     */\n    fromThumb: boolean;\n}\n\n/**\n * Fired immediately after each slide transition.\n * @name lgAfterSlide\n * @method onAfterSlide\n */\nexport interface AfterSlideDetail {\n    /**\n     * Index of the previous slide\n     */\n    prevIndex: number;\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n    /**\n     * true if slide function called via thumbnail click\n     */\n    fromThumb: boolean;\n}\n\n/**\n * Fired when the video poster is clicked.\n * @name lgPosterClick\n * @method onPosterClick\n */\nexport interface PosterClickDetail {}\n\n/**\n * Fired when the drag event to move to different slide starts.\n * @name lgDragStart\n * @method onDragStart\n */\nexport interface DragStartDetail {}\n\n/**\n * Fired periodically during the drag operation.\n * @name lgDragMove\n * @method onDragMove\n */\nexport interface DragMoveDetail {}\n\n/**\n * Fired when the user has finished the drag operation\n * @name lgDragEnd\n * @method onDragEnd\n */\nexport interface DragEndDetail {}\n\n/**\n * Fired immediately before the start of the close process.\n * @name lgBeforeClose\n * @method onBeforeClose\n */\nexport interface BeforeCloseDetail {}\n\n/**\n * Fired immediately once lightGallery is closed.\n * @name lgAfterClose\n * @method onAfterClose\n */\nexport interface AfterCloseDetail {\n    /**\n     * lightGallery plugin instance\n     */\n    instance: LightGallery;\n}\n\n/**\n * Fired immediately before each \"next\" slide transition\n * @name lgBeforeNextSlide\n * @method onBeforeNextSlide\n */\nexport interface BeforeNextSlideDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n}\n\n/**\n * Fired immediately before each \"prev\" slide transition\n * @name lgBeforePrevSlide\n * @method onBeforePrevSlide\n */\nexport interface BeforePrevSlideDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n    /**\n     * true if slide function called via touch event or mouse drag\n     */\n    fromTouch: boolean;\n}\n\n/**\n * Fired when the sub-html content (ex : title/ description) has been appended into the slide.\n * @name lgAfterAppendSubHtml\n * @method onAfterAppendSubHtml\n */\nexport interface AfterAppendSubHtmlDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the lightGallery container has been resized.\n * @name lgContainerResize\n * @method onContainerResize\n */\nexport interface ContainerResizeDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when lightGallery detects video slide\n * @name lgHasVideo\n * @method onHasVideo\n */\nexport interface HasVideoDetail {\n    /**\n     * Index of the slide,\n     */\n    index: number;\n    /**\n     * Video source\n     */\n    src: string;\n    /**\n     * HTML5 video source if available\n     * <p>\n       HTML5 video source = source: {\n            src: string;\n            type: string;\n        }[];\n        attributes: HTMLVideoElement;\n     * </p>\n     */\n    html5Video: VideoSource;\n    /**\n     * True if video has poster\n     */\n    hasPoster: boolean;\n}\n\n/**\n * Fired when the image is rotated in anticlockwise direction\n * @name lgRotateLeft\n * @method onRotateLeft\n */\nexport interface RotateLeftDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the image is rotated in clockwise direction\n * @name lgRotateRight\n * @method onRotateRight\n */\nexport interface RotateRightDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the image is flipped horizontally\n * @name lgFlipHorizontal\n * @method onFlipHorizontal\n */\nexport interface FlipHorizontalDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n\n/**\n * Fired when the image is flipped vertically\n * @name lgFlipVertical\n * @method onFlipVertical\n */\nexport interface FlipVerticalDetail {\n    /**\n     * Index of the slide\n     */\n    index: number;\n}\n","export interface CommentSettings {\n    /**\n     * Enable comment box\n     */\n    commentBox: boolean;\n    /**\n     * Enable facebook comment box\n     */\n    fbComments: boolean;\n    /**\n     * Enable disqus comment box\n     */\n    disqusComments: boolean;\n\n    /**\n     * Disqus comment config\n     */\n    disqusConfig: {\n        title?: string;\n        language: string;\n    };\n\n    /**\n     * Facebook comments default markup\n     */\n    commentsMarkup: string;\n\n    /**\n     * Custom translation strings for aria-labels\n     */\n    commentPluginStrings: { [key: string]: string };\n}\n\nexport const commentSettings: CommentSettings = {\n    commentBox: false,\n    fbComments: false,\n    disqusComments: false,\n    disqusConfig: {\n        title: undefined,\n        language: 'en',\n    },\n    commentsMarkup:\n        '<div id=\"lg-comment-box\" class=\"lg-comment-box lg-fb-comment-box\"><div class=\"lg-comment-header\"><h3 class=\"lg-comment-title\">Leave a comment.</h3><span class=\"lg-comment-close lg-icon\"></span></div><div class=\"lg-comment-body\"></div></div>',\n    commentPluginStrings: { toggleComments: 'Toggle Comments' },\n};\n","/**\n * lightGallery comments module\n * Supports facebook and disqus comments\n *\n * @ref - https://help.disqus.com/customer/portal/articles/472098-javascript-configuration-variables\n * @ref - https://github.com/disqus/DISQUS-API-Recipes/blob/master/snippets/js/disqus-reset/disqus_reset.html\n * @ref - https://css-tricks.com/lazy-loading-disqus-comments/\n * @ref - https://developers.facebook.com/docs/plugins/comments/#comments-plugin\n *\n */\n\nimport { lGEvents } from '../../lg-events';\nimport { LgQuery } from '../../lgQuery';\nimport { LightGallery } from '../../lightgallery';\nimport { commentSettings, CommentSettings } from './lg-comment-settings';\n\ndeclare let FB: any;\ndeclare let DISQUS: any;\n\nexport default class CommentBox {\n    core: LightGallery;\n    settings: CommentSettings;\n    private $LG!: LgQuery;\n    constructor(instance: LightGallery, $LG: LgQuery) {\n        // get lightGallery core plugin instance\n        this.core = instance;\n        this.$LG = $LG;\n\n        // extend module default settings with lightGallery core settings\n        this.settings = { ...commentSettings, ...this.core.settings };\n\n        return this;\n    }\n\n    public init(): void {\n        if (!this.settings.commentBox) {\n            return;\n        }\n        this.setMarkup();\n        this.toggleCommentBox();\n        if (this.settings.fbComments) {\n            this.addFbComments();\n        } else if (this.settings.disqusComments) {\n            this.addDisqusComments();\n        }\n    }\n\n    private setMarkup() {\n        this.core.outer.append(\n            this.settings.commentsMarkup +\n                '<div class=\"lg-comment-overlay\"></div>',\n        );\n\n        const commentToggleBtn = `<button type=\"button\" aria-label=\"${this.settings.commentPluginStrings['toggleComments']}\" class=\"lg-comment-toggle lg-icon\"></button>`;\n        this.core.$toolbar.append(commentToggleBtn);\n    }\n\n    toggleCommentBox(): void {\n        this.core.outer\n            .find('.lg-comment-toggle')\n            .first()\n            .on('click.lg.comment', () => {\n                this.core.outer.toggleClass('lg-comment-active');\n            });\n\n        this.core.outer\n            .find('.lg-comment-overlay')\n            .first()\n            .on('click.lg.comment', () => {\n                this.core.outer.removeClass('lg-comment-active');\n            });\n        this.core.outer\n            .find('.lg-comment-close')\n            .first()\n            .on('click.lg.comment', () => {\n                this.core.outer.removeClass('lg-comment-active');\n            });\n    }\n\n    addFbComments() {\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const _this = this;\n        this.core.LGel.on(`${lGEvents.beforeSlide}.comment`, (event) => {\n            const html = this.core.galleryItems[event.detail.index].fbHtml;\n            this.core.outer.find('.lg-comment-body').html(html as string);\n        });\n        this.core.LGel.on(`${lGEvents.afterSlide}.comment`, function () {\n            try {\n                FB.XFBML.parse();\n            } catch (err) {\n                _this.$LG(window).on('fbAsyncInit', function () {\n                    FB.XFBML.parse();\n                });\n            }\n        });\n    }\n\n    addDisqusComments(): void {\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const _this = this;\n        const $disqusThread = this.$LG('#disqus_thread');\n        $disqusThread.remove();\n        this.core.outer\n            .find('.lg-comment-body')\n            .append('<div id=\"disqus_thread\"></div>');\n\n        this.core.LGel.on(`${lGEvents.beforeSlide}.comment`, () => {\n            $disqusThread.html('');\n        });\n\n        this.core.LGel.on(`${lGEvents.afterSlide}.comment`, (event) => {\n            const { index } = event.detail;\n            // eslint-disable-next-line @typescript-eslint/no-this-alias\n            const _this = this;\n            // DISQUS needs sometime to intialize when lightGallery is opened from direct url(hash plugin).\n            setTimeout(\n                function () {\n                    try {\n                        DISQUS.reset({\n                            reload: true,\n                            config: function () {\n                                this.page.identifier =\n                                    _this.core.galleryItems[\n                                        index\n                                    ].disqusIdentifier;\n                                this.page.url =\n                                    _this.core.galleryItems[index].disqusURL;\n                                this.page.title =\n                                    _this.settings.disqusConfig.title;\n                                this.language =\n                                    _this.settings.disqusConfig.language;\n                            },\n                        });\n                    } catch (err) {\n                        console.error(\n                            'Make sure you have included disqus JavaScript code in your document. Ex - https://lg-disqus.disqus.com/admin/install/platforms/universalcode/',\n                        );\n                    }\n                },\n                _this.core.lGalleryOn ? 0 : 1000,\n            );\n        });\n    }\n\n    destroy(): void {\n        this.core.LGel.off('.lg.comment');\n        this.core.LGel.off('.comment');\n    }\n}\n"],"names":[],"mappings":"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"}

package/plugins/fullscreen/lg-fullscreen-settings.d.ts

@@ -3,5 +3,11 @@ export interface FullscreenSettings {
      * Enable/Disable fullscreen option
      */
     fullScreen: boolean;
+    /**
+     * Custom translation strings for aria-labels
+     */
+    fullscreenPluginStrings: {
+        [key: string]: string;
+    };
 }
 export declare const fullscreenSettings: FullscreenSettings;

package/plugins/fullscreen/lg-fullscreen.es5.js

@@ -1,5 +1,5 @@
 /*!
- * lightgallery | 2.3.0 | October 28th 2021
+ * lightgallery | 2.4.0-beta.0 | December 12th 2021
  * http://www.lightgalleryjs.com/
  * Copyright (c) 2020 Sachin Neravath;
  * @license GPLv3
@@ -33,6 +33,7 @@ var __assign = function() {
 
 var fullscreenSettings = {
     fullScreen: true,
+    fullscreenPluginStrings: { toggleFullscreen: 'Toggle Fullscreen' },
 };
 
 var FullScreen = /** @class */ (function () {
@@ -55,8 +56,7 @@ var FullScreen = /** @class */ (function () {
                 return;
             }
             else {
-                fullScreen =
-                    '<button type="button" aria-label="Toggle fullscreen" class="lg-fullscreen lg-icon"></button>';
+                fullScreen = "<button type=\"button\" aria-label=\"" + this.settings.fullscreenPluginStrings['toggleFullscreen'] + "\" class=\"lg-fullscreen lg-icon\"></button>";
                 this.core.$toolbar.append(fullScreen);
                 this.fullScreen();
             }