lightgallery/plugins/pager/lg-pager.min.js

lightGallery is a feature-rich, modular JavaScript gallery plugin for building beautiful image and video galleries for the web and the mobile

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).lgPager=t()}(this,function(){"use strict";const e="lgUpdateSlides",t="lgBeforeSlide",r={pager:!0};var s=Object.defineProperty,a=Object.getOwnPropertySymbols,i=Object.prototype.hasOwnProperty,l=Object.prototype.propertyIsEnumerable,o=(e,t,r)=>t in e?s(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r,n=(e,t)=>{for(var r in t||(t={}))i.call(t,r)&&o(e,r,t[r]);if(a)for(var r of a(t))l.call(t,r)&&o(e,r,t[r]);return e};return class{constructor(e,t){return this.core=e,this.$LG=t,this.settings=n(n({},r),this.core.settings),this}getPagerHtml(e){let t="";for(let r=0;r<e.length;r++)t+=`<span data-lg-item-id="${r}" class="lg-pager-cont">\n                    <span data-lg-item-id="${r}" class="lg-pager"></span>\n                    <div class="lg-pager-thumb-cont"><span class="lg-caret"></span> <img src="${e[r].thumb}" alt="${e[r].alt||""}" /></div>\n                    </span>`;return t}init(){if(!this.settings.pager)return;let r;this.core.$lgComponents.prepend('<div class="lg-pager-outer"></div>');const s=this.core.outer.find(".lg-pager-outer");s.html(this.getPagerHtml(this.core.galleryItems)),s.first().on("click.lg touchend.lg",e=>{const t=this.$LG(e.target);if(!t.hasAttribute("data-lg-item-id"))return;const r=parseInt(t.attr("data-lg-item-id"));this.core.slide(r,!1,!0,!1)}),s.first().on("mouseover.lg",()=>{clearTimeout(r),s.addClass("lg-pager-hover")}),s.first().on("mouseout.lg",()=>{r=setTimeout(()=>{s.removeClass("lg-pager-hover")})}),this.core.LGel.on(`${t}.pager`,e=>{const{index:t}=e.detail;this.manageActiveClass.call(this,t)}),this.core.LGel.on(`${e}.pager`,()=>{s.empty(),s.html(this.getPagerHtml(this.core.galleryItems)),this.manageActiveClass(this.core.index)})}manageActiveClass(e){const t=this.core.outer.find(".lg-pager-cont");t.removeClass("lg-pager-active"),t.eq(e).addClass("lg-pager-active")}destroy(){this.core.outer.find(".lg-pager-outer").remove(),this.core.LGel.off(".lg.pager"),this.core.LGel.off(".pager")}}});