photoswipe
Advanced tools
Comparing version 5.2.4 to 5.2.5
| /*! | ||
| * PhotoSwipe Lightbox 5.2.4 - https://photoswipe.com | ||
| * PhotoSwipe Lightbox 5.2.5 - https://photoswipe.com | ||
| * (c) 2022 Dmytro Semenov | ||
| */ | ||
| /** @typedef {import("../photoswipe").Point} Point */ | ||
| /** @typedef {undefined | null | false | '' | 0} Falsy */ | ||
| /** @typedef {keyof HTMLElementTagNameMap} HTMLElementTagName */ | ||
| /** | ||
| * Creates element and optionally appends it to another. | ||
| * | ||
| * @param {String} className | ||
| * @param {String|NULL} tagName | ||
| * @param {Element|NULL} appendToEl | ||
| */ | ||
| * @template {HTMLElementTagName | Falsy} [T="div"] | ||
| * @template {Node | undefined} [NodeToAppendElementTo=undefined] | ||
| * @param {string=} className | ||
| * @param {T=} [tagName] | ||
| * @param {NodeToAppendElementTo=} appendToEl | ||
| * @returns {T extends HTMLElementTagName ? HTMLElementTagNameMap[T] : HTMLElementTagNameMap['div']} | ||
| */ | ||
| function createElement(className, tagName, appendToEl) { | ||
@@ -20,2 +26,3 @@ const el = document.createElement(tagName || 'div'); | ||
| } | ||
| // @ts-expect-error | ||
| return el; | ||
@@ -27,5 +34,5 @@ } | ||
| * | ||
| * @param {Number} x | ||
| * @param {Number|null} y | ||
| * @param {Number|null} scale | ||
| * @param {number} x | ||
| * @param {number=} y | ||
| * @param {number=} scale | ||
| */ | ||
@@ -48,2 +55,6 @@ function toTransformString(x, y, scale) { | ||
| * Apply width and height CSS properties to element | ||
| * | ||
| * @param {HTMLElement} el | ||
| * @param {string | number} w | ||
| * @param {string | number} h | ||
| */ | ||
@@ -55,2 +66,4 @@ function setWidthHeight(el, w, h) { | ||
| /** @typedef {LOAD_STATE[keyof LOAD_STATE]} LoadState */ | ||
| /** @type {{ IDLE: 'idle'; LOADING: 'loading'; LOADED: 'loaded'; ERROR: 'error' }} */ | ||
| const LOAD_STATE = { | ||
@@ -68,3 +81,3 @@ IDLE: 'idle', | ||
| * | ||
| * @param {Event} e | ||
| * @param {MouseEvent | KeyboardEvent} e | ||
| */ | ||
@@ -80,8 +93,9 @@ function specialKeyUsed(e) { | ||
| * | ||
| * @param {Element|NodeList|String} option | ||
| * @param {String|null} legacySelector | ||
| * @param {Element|null} parent | ||
| * @returns Element[] | ||
| * @param {HTMLElement | NodeListOf<HTMLElement> | string} option | ||
| * @param {string=} legacySelector | ||
| * @param {HTMLElement | Document} [parent] | ||
| * @returns HTMLElement[] | ||
| */ | ||
| function getElementsFromOption(option, legacySelector, parent = document) { | ||
| /** @type {HTMLElement[]} */ | ||
| let elements = []; | ||
@@ -106,4 +120,3 @@ | ||
| * | ||
| * @param {*} fn | ||
| * @returns Boolean | ||
| * @param {any} fn | ||
| */ | ||
@@ -116,6 +129,209 @@ function isPswpClass(fn) { | ||
| /** @typedef {import("../lightbox/lightbox").default} PhotoSwipeLightbox */ | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {import("../photoswipe").DataSource} DataSource */ | ||
| /** @typedef {import("../ui/ui-element").UIElementData} UIElementData */ | ||
| /** @typedef {import("../slide/content").default} ContentDefault */ | ||
| /** @typedef {import("../slide/slide").default} Slide */ | ||
| /** @typedef {import("../slide/slide").SlideData} SlideData */ | ||
| /** @typedef {import("../slide/zoom-level").default} ZoomLevel */ | ||
| /** @typedef {import("../slide/get-thumb-bounds").Bounds} Bounds */ | ||
| /** | ||
| * Allow adding an arbitrary props to the Content | ||
| * https://photoswipe.com/custom-content/#using-webp-image-format | ||
| * @typedef {ContentDefault & Record<string, any>} Content | ||
| */ | ||
| /** @typedef {{ x?: number; y?: number }} Point */ | ||
| /** | ||
| * @typedef {Object} PhotoSwipeEventsMap https://photoswipe.com/events/ | ||
| * | ||
| * | ||
| * https://photoswipe.com/adding-ui-elements/ | ||
| * | ||
| * @prop {undefined} uiRegister | ||
| * @prop {{ data: UIElementData }} uiElementCreate | ||
| * | ||
| * | ||
| * https://photoswipe.com/events/#initialization-events | ||
| * | ||
| * @prop {undefined} beforeOpen | ||
| * @prop {undefined} firstUpdate | ||
| * @prop {undefined} initialLayout | ||
| * @prop {undefined} change | ||
| * @prop {undefined} afterInit | ||
| * @prop {undefined} bindEvents | ||
| * | ||
| * | ||
| * https://photoswipe.com/events/#opening-or-closing-transition-events | ||
| * | ||
| * @prop {undefined} openingAnimationStart | ||
| * @prop {undefined} openingAnimationEnd | ||
| * @prop {undefined} closingAnimationStart | ||
| * @prop {undefined} closingAnimationEnd | ||
| * | ||
| * | ||
| * https://photoswipe.com/events/#closing-events | ||
| * | ||
| * @prop {undefined} close | ||
| * @prop {undefined} destroy | ||
| * | ||
| * | ||
| * https://photoswipe.com/events/#pointer-and-gesture-events | ||
| * | ||
| * @prop {{ originalEvent: PointerEvent }} pointerDown | ||
| * @prop {{ originalEvent: PointerEvent }} pointerMove | ||
| * @prop {{ originalEvent: PointerEvent }} pointerUp | ||
| * @prop {{ bgOpacity: number }} pinchClose can be default prevented | ||
| * @prop {{ panY: number }} verticalDrag can be default prevented | ||
| * | ||
| * | ||
| * https://photoswipe.com/events/#slide-content-events | ||
| * | ||
| * @prop {{ content: Content }} contentInit | ||
| * @prop {{ content: Content; isLazy: boolean }} contentLoad can be default prevented | ||
| * @prop {{ content: Content; isLazy: boolean }} contentLoadImage can be default prevented | ||
| * @prop {{ content: Content; slide: Slide; isError?: boolean }} loadComplete | ||
| * @prop {{ content: Content; slide: Slide }} loadError | ||
| * @prop {{ content: Content; width: number; height: number }} contentResize can be default prevented | ||
| * @prop {{ content: Content; width: number; height: number; slide: Slide }} imageSizeChange | ||
| * @prop {{ content: Content }} contentLazyLoad can be default prevented | ||
| * @prop {{ content: Content }} contentAppend can be default prevented | ||
| * @prop {{ content: Content }} contentActivate can be default prevented | ||
| * @prop {{ content: Content }} contentDeactivate can be default prevented | ||
| * @prop {{ content: Content }} contentRemove can be default prevented | ||
| * @prop {{ content: Content }} contentDestroy can be default prevented | ||
| * | ||
| * | ||
| * undocumented | ||
| * | ||
| * @prop {{ point: Point; originalEvent: PointerEvent }} imageClickAction can be default prevented | ||
| * @prop {{ point: Point; originalEvent: PointerEvent }} bgClickAction can be default prevented | ||
| * @prop {{ point: Point; originalEvent: PointerEvent }} tapAction can be default prevented | ||
| * @prop {{ point: Point; originalEvent: PointerEvent }} doubleTapAction can be default prevented | ||
| * | ||
| * @prop {{ originalEvent: KeyboardEvent }} keydown can be default prevented | ||
| * @prop {{ x: number; dragging: boolean }} moveMainScroll | ||
| * @prop {{ slide: Slide }} firstZoomPan | ||
| * @prop {{ slide: Slide, data: SlideData, index: number }} gettingData | ||
| * @prop {undefined} beforeResize | ||
| * @prop {undefined} resize | ||
| * @prop {undefined} viewportSize | ||
| * @prop {undefined} updateScrollOffset | ||
| * @prop {{ slide: Slide }} slideInit | ||
| * @prop {{ slide: Slide }} afterSetContent | ||
| * @prop {{ slide: Slide }} slideLoad | ||
| * @prop {{ slide: Slide }} appendHeavy can be default prevented | ||
| * @prop {{ slide: Slide }} appendHeavyContent | ||
| * @prop {{ slide: Slide }} slideActivate | ||
| * @prop {{ slide: Slide }} slideDeactivate | ||
| * @prop {{ slide: Slide }} slideDestroy | ||
| * @prop {{ destZoomLevel: number, centerPoint: Point, transitionDuration: number | false }} beforeZoomTo | ||
| * @prop {{ slide: Slide }} zoomPanUpdate | ||
| * @prop {{ slide: Slide }} initialZoomPan | ||
| * @prop {{ slide: Slide }} calcSlideSize | ||
| * @prop {undefined} resolutionChanged | ||
| * @prop {{ originalEvent: WheelEvent }} wheel can be default prevented | ||
| * @prop {{ content: Content }} contentAppendImage can be default prevented | ||
| * @prop {{ index: number; itemData: SlideData }} lazyLoadSlide can be default prevented | ||
| * @prop {undefined} lazyLoad | ||
| * @prop {{ slide: Slide }} calcBounds | ||
| * @prop {{ zoomLevels: ZoomLevel, slideData: SlideData }} zoomLevelsUpdate | ||
| * | ||
| * | ||
| * legacy | ||
| * | ||
| * @prop {undefined} init | ||
| * @prop {undefined} initialZoomIn | ||
| * @prop {undefined} initialZoomOut | ||
| * @prop {undefined} initialZoomInEnd | ||
| * @prop {undefined} initialZoomOutEnd | ||
| * @prop {{ dataSource: DataSource, numItems: number }} numItems | ||
| * @prop {{ itemData: SlideData; index: number }} itemData | ||
| * @prop {{ index: number, itemData: SlideData, instance: PhotoSwipe }} thumbBounds | ||
| */ | ||
| /** | ||
| * @typedef {Object} PhotoSwipeFiltersMap https://photoswipe.com/filters/ | ||
| * | ||
| * @prop {(numItems: number, dataSource: DataSource) => number} numItems | ||
| * Modify the total amount of slides. Example on Data sources page. | ||
| * https://photoswipe.com/filters/#numitems | ||
| * | ||
| * @prop {(itemData: SlideData, index: number) => SlideData} itemData | ||
| * Modify slide item data. Example on Data sources page. | ||
| * https://photoswipe.com/filters/#itemdata | ||
| * | ||
| * @prop {(itemData: SlideData, element: HTMLElement, linkEl: HTMLAnchorElement) => SlideData} domItemData | ||
| * Modify item data when it's parsed from DOM element. Example on Data sources page. | ||
| * https://photoswipe.com/filters/#domitemdata | ||
| * | ||
| * @prop {(clickedIndex: number, e: MouseEvent, instance: PhotoSwipeLightbox) => number} clickedIndex | ||
| * Modify clicked gallery item index. | ||
| * https://photoswipe.com/filters/#clickedindex | ||
| * | ||
| * @prop {(placeholderSrc: string | false, content: Content) => string | false} placeholderSrc | ||
| * Modify placeholder image source. | ||
| * https://photoswipe.com/filters/#placeholdersrc | ||
| * | ||
| * @prop {(isContentLoading: boolean, content: Content) => boolean} isContentLoading | ||
| * Modify if the content is currently loading. | ||
| * https://photoswipe.com/filters/#iscontentloading | ||
| * | ||
| * @prop {(isContentZoomable: boolean, content: Content) => boolean} isContentZoomable | ||
| * Modify if the content can be zoomed. | ||
| * https://photoswipe.com/filters/#iscontentzoomable | ||
| * | ||
| * @prop {(useContentPlaceholder: boolean, content: Content) => boolean} useContentPlaceholder | ||
| * Modify if the placeholder should be used for the content. | ||
| * https://photoswipe.com/filters/#usecontentplaceholder | ||
| * | ||
| * @prop {(isKeepingPlaceholder: boolean, content: Content) => boolean} isKeepingPlaceholder | ||
| * Modify if the placeholder should be kept after the content is loaded. | ||
| * https://photoswipe.com/filters/#iskeepingplaceholder | ||
| * | ||
| * | ||
| * @prop {(contentErrorElement: HTMLElement, content: Content) => HTMLElement} contentErrorElement | ||
| * Modify an element when the content has error state (for example, if image cannot be loaded). | ||
| * https://photoswipe.com/filters/#contenterrorelement | ||
| * | ||
| * @prop {(element: HTMLElement, data: UIElementData) => HTMLElement} uiElement | ||
| * Modify a UI element that's being created. | ||
| * https://photoswipe.com/filters/#uielement | ||
| * | ||
| * @prop {(thumbnail: HTMLElement, itemData: SlideData, index: number) => HTMLElement} thumbEl | ||
| * Modify the thubmnail element from which opening zoom animation starts or ends. | ||
| * https://photoswipe.com/filters/#thumbel | ||
| * | ||
| * @prop {(thumbBounds: Bounds, itemData: SlideData, index: number) => Bounds} thumbBounds | ||
| * Modify the thubmnail bounds from which opening zoom animation starts or ends. | ||
| * https://photoswipe.com/filters/#thumbbounds | ||
| */ | ||
| /** | ||
| * @template {keyof PhotoSwipeFiltersMap} T | ||
| * @typedef {{ fn: PhotoSwipeFiltersMap[T], priority: number }} Filter<T> | ||
| */ | ||
| /** | ||
| * @template {keyof PhotoSwipeEventsMap} T | ||
| * @typedef {PhotoSwipeEventsMap[T] extends undefined ? PhotoSwipeEvent<T> : PhotoSwipeEvent<T> & PhotoSwipeEventsMap[T]} AugmentedEvent | ||
| */ | ||
| /** | ||
| * @template {keyof PhotoSwipeEventsMap} T | ||
| * @typedef {(event: AugmentedEvent<T>) => void} EventCallback<T> | ||
| */ | ||
| /** | ||
| * Base PhotoSwipe event object | ||
| * | ||
| * @template {keyof PhotoSwipeEventsMap} T | ||
| */ | ||
| class PhotoSwipeEvent { | ||
| /** | ||
| * @param {T} type | ||
| * @param {PhotoSwipeEventsMap[T]} [details] | ||
| */ | ||
| constructor(type, details) { | ||
@@ -139,6 +355,22 @@ this.type = type; | ||
| constructor() { | ||
| /** | ||
| * @type {{ [T in keyof PhotoSwipeEventsMap]?: ((event: AugmentedEvent<T>) => void)[] }} | ||
| */ | ||
| this._listeners = {}; | ||
| /** | ||
| * @type {{ [T in keyof PhotoSwipeFiltersMap]?: Filter<T>[] }} | ||
| */ | ||
| this._filters = {}; | ||
| /** @type {PhotoSwipe=} */ | ||
| this.pswp = undefined; | ||
| } | ||
| /** | ||
| * @template {keyof PhotoSwipeFiltersMap} T | ||
| * @param {T} name | ||
| * @param {PhotoSwipeFiltersMap[T]} fn | ||
| * @param {number} priority | ||
| */ | ||
| addFilter(name, fn, priority = 100) { | ||
@@ -157,4 +389,10 @@ if (!this._filters[name]) { | ||
| /** | ||
| * @template {keyof PhotoSwipeFiltersMap} T | ||
| * @param {T} name | ||
| * @param {PhotoSwipeFiltersMap[T]} fn | ||
| */ | ||
| removeFilter(name, fn) { | ||
| if (this._filters[name]) { | ||
| // @ts-expect-error | ||
| this._filters[name] = this._filters[name].filter(filter => (filter.fn !== fn)); | ||
@@ -168,5 +406,12 @@ } | ||
| /** | ||
| * @template {keyof PhotoSwipeFiltersMap} T | ||
| * @param {T} name | ||
| * @param {Parameters<PhotoSwipeFiltersMap[T]>} args | ||
| * @returns {Parameters<PhotoSwipeFiltersMap[T]>[0]} | ||
| */ | ||
| applyFilters(name, ...args) { | ||
| if (this._filters[name]) { | ||
| this._filters[name].forEach((filter) => { | ||
| // @ts-expect-error | ||
| args[0] = filter.fn.apply(this, args); | ||
@@ -178,2 +423,7 @@ }); | ||
| /** | ||
| * @template {keyof PhotoSwipeEventsMap} T | ||
| * @param {T} name | ||
| * @param {EventCallback<T>} fn | ||
| */ | ||
| on(name, fn) { | ||
@@ -193,4 +443,10 @@ if (!this._listeners[name]) { | ||
| /** | ||
| * @template {keyof PhotoSwipeEventsMap} T | ||
| * @param {T} name | ||
| * @param {EventCallback<T>} fn | ||
| */ | ||
| off(name, fn) { | ||
| if (this._listeners[name]) { | ||
| // @ts-expect-error | ||
| this._listeners[name] = this._listeners[name].filter(listener => (fn !== listener)); | ||
@@ -204,2 +460,8 @@ } | ||
| /** | ||
| * @template {keyof PhotoSwipeEventsMap} T | ||
| * @param {T} name | ||
| * @param {PhotoSwipeEventsMap[T]} [details] | ||
| * @returns {AugmentedEvent<T>} | ||
| */ | ||
| dispatch(name, details) { | ||
@@ -210,3 +472,3 @@ if (this.pswp) { | ||
| const event = new PhotoSwipeEvent(name, details); | ||
| const event = /** @type {AugmentedEvent<T>} */ (new PhotoSwipeEvent(name, details)); | ||
@@ -229,4 +491,4 @@ if (!this._listeners) { | ||
| /** | ||
| * @param {String|false} imageSrc | ||
| * @param {Element} container | ||
| * @param {string | false} imageSrc | ||
| * @param {HTMLElement} container | ||
| */ | ||
@@ -243,5 +505,8 @@ constructor(imageSrc, container) { | ||
| if (imageSrc) { | ||
| this.element.decoding = 'async'; | ||
| this.element.alt = ''; | ||
| this.element.src = imageSrc; | ||
| /** @type {HTMLImageElement} */ | ||
| (this.element).decoding = 'async'; | ||
| /** @type {HTMLImageElement} */ | ||
| (this.element).alt = ''; | ||
| /** @type {HTMLImageElement} */ | ||
| (this.element).src = imageSrc; | ||
| this.element.setAttribute('role', 'presentation'); | ||
@@ -253,2 +518,6 @@ } | ||
| /** | ||
| * @param {number} width | ||
| * @param {number} height | ||
| */ | ||
| setDisplayedSize(width, height) { | ||
@@ -279,9 +548,15 @@ if (!this.element) { | ||
| /** @typedef {import("./slide").default} Slide */ | ||
| /** @typedef {import("./slide").SlideData} SlideData */ | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {import("../util/util").LoadState} LoadState */ | ||
| class Content { | ||
| /** @type {HTMLImageElement | HTMLDivElement} */ | ||
| element; | ||
| /** | ||
| * @param {Object} itemData Slide data | ||
| * @param {PhotoSwipeBase} instance PhotoSwipe or PhotoSwipeLightbox instance | ||
| * @param {Slide|undefined} slide Slide that requested the image, | ||
| * can be undefined if image was requested by something else | ||
| * (for example by lazy-loader) | ||
| * @param {SlideData} itemData Slide data | ||
| * @param {PhotoSwipe} instance PhotoSwipe or PhotoSwipeLightbox instance | ||
| * @param {number} index | ||
| */ | ||
@@ -298,2 +573,3 @@ constructor(itemData, instance, index) { | ||
| this.hasSlide = false; | ||
| /** @type {LoadState} */ | ||
| this.state = LOAD_STATE.IDLE; | ||
@@ -327,3 +603,4 @@ | ||
| * | ||
| * @param {Boolean} isLazy | ||
| * @param {boolean=} isLazy | ||
| * @param {boolean=} reload | ||
| */ | ||
@@ -368,6 +645,7 @@ load(isLazy, reload) { | ||
| * | ||
| * @param {Boolean} isLazy | ||
| * @param {boolean} isLazy | ||
| */ | ||
| loadImage(isLazy) { | ||
| this.element = createElement('pswp__img', 'img'); | ||
| const imageElement = createElement('pswp__img', 'img'); | ||
| this.element = imageElement; | ||
@@ -379,19 +657,19 @@ if (this.instance.dispatch('contentLoadImage', { content: this, isLazy }).defaultPrevented) { | ||
| if (this.data.srcset) { | ||
| this.element.srcset = this.data.srcset; | ||
| imageElement.srcset = this.data.srcset; | ||
| } | ||
| this.element.src = this.data.src; | ||
| imageElement.src = this.data.src; | ||
| this.element.alt = this.data.alt || ''; | ||
| imageElement.alt = this.data.alt || ''; | ||
| this.state = LOAD_STATE.LOADING; | ||
| if (this.element.complete) { | ||
| if (imageElement.complete) { | ||
| this.onLoaded(); | ||
| } else { | ||
| this.element.onload = () => { | ||
| imageElement.onload = () => { | ||
| this.onLoaded(); | ||
| }; | ||
| this.element.onerror = () => { | ||
| imageElement.onerror = () => { | ||
| this.onError(); | ||
@@ -464,3 +742,3 @@ }; | ||
| /** | ||
| * @returns {Boolean} If the content is image | ||
| * @returns {boolean} If the content is image | ||
| */ | ||
@@ -486,2 +764,3 @@ isImageContent() { | ||
| // eslint-disable-next-line max-len | ||
| if (this.instance.dispatch('contentResize', { content: this, width, height }).defaultPrevented) { | ||
@@ -494,3 +773,4 @@ return; | ||
| if (this.isImageContent() && !this.isError()) { | ||
| const image = this.element; | ||
| const image = /** @type HTMLImageElement */ (this.element); | ||
| // Handle srcset sizes attribute. | ||
@@ -502,8 +782,10 @@ // | ||
| if (image.srcset | ||
| && (!image.dataset.largestUsedSize || width > image.dataset.largestUsedSize)) { | ||
| // eslint-disable-next-line max-len | ||
| && (!image.dataset.largestUsedSize || width > parseInt(image.dataset.largestUsedSize, 10))) { | ||
| image.sizes = width + 'px'; | ||
| image.dataset.largestUsedSize = width; | ||
| image.dataset.largestUsedSize = String(width); | ||
| } | ||
| if (this.slide) { | ||
| // eslint-disable-next-line max-len | ||
| this.instance.dispatch('imageSizeChange', { slide: this.slide, width, height, content: this }); | ||
@@ -515,3 +797,3 @@ } | ||
| /** | ||
| * @returns {Boolean} If the content can be zoomed | ||
| * @returns {boolean} If the content can be zoomed | ||
| */ | ||
@@ -527,3 +809,3 @@ isZoomable() { | ||
| /** | ||
| * @returns {Boolean} If content should use a placeholder (from msrc by default) | ||
| * @returns {boolean} If content should use a placeholder (from msrc by default) | ||
| */ | ||
@@ -540,4 +822,2 @@ usePlaceholder() { | ||
| * Preload content with lazy-loading param | ||
| * | ||
| * @param {Boolean} isLazy | ||
| */ | ||
@@ -553,3 +833,3 @@ lazyLoad() { | ||
| /** | ||
| * @returns {Boolean} If placeholder should be kept after content is loaded | ||
| * @returns {boolean} If placeholder should be kept after content is loaded | ||
| */ | ||
@@ -589,2 +869,3 @@ keepPlaceholder() { | ||
| if (this.slide) { | ||
| /** @type {HTMLElement} */ | ||
| let errorMsgEl = createElement('pswp__error-msg'); | ||
@@ -641,3 +922,4 @@ errorMsgEl.innerText = this.instance.options.errorMsg; | ||
| if (this.element && this.element.tagName === 'IMG') { | ||
| this.element.decode().then(() => { | ||
| /** @type {HTMLImageElement} */ | ||
| (this.element).decode().then(() => { | ||
| this.isDecoding = false; | ||
@@ -654,3 +936,5 @@ requestAnimationFrame(() => { | ||
| if (this.placeholder | ||
| && (this.state === LOAD_STATE.LOADED || this.state === LOAD_STATE.ERROR)) { | ||
| // eslint-disable-next-line max-len | ||
| && (this.state === LOAD_STATE.LOADED || /** @type {LoadState} */ (this.state) === LOAD_STATE.ERROR) | ||
| ) { | ||
| this.removePlaceholder(); | ||
@@ -733,2 +1017,6 @@ } | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {import("../photoswipe").PhotoSwipeOptions} PhotoSwipeOptions */ | ||
| /** @typedef {import("../slide/slide").SlideData} SlideData */ | ||
| /** | ||
@@ -738,7 +1026,10 @@ * PhotoSwipe base class that can retrieve data about every slide. | ||
| */ | ||
| class PhotoSwipeBase extends Eventable { | ||
| /** @type {PhotoSwipeOptions} */ | ||
| options; | ||
| class PhotoSwipeBase extends Eventable { | ||
| /** | ||
| * Get total number of slides | ||
| * | ||
| * @returns {number} | ||
| */ | ||
@@ -750,6 +1041,6 @@ getNumItems() { | ||
| numItems = 0; | ||
| } else if (dataSource.length) { | ||
| } else if ('length' in dataSource) { | ||
| // may be an array or just object with length property | ||
| numItems = dataSource.length; | ||
| } else if (dataSource.gallery) { | ||
| } else if ('gallery' in dataSource) { | ||
| // query DOM elements | ||
@@ -773,3 +1064,8 @@ if (!dataSource.items) { | ||
| /** | ||
| * @param {SlideData} slideData | ||
| * @param {number} index | ||
| */ | ||
| createContentFromData(slideData, index) { | ||
| // @ts-expect-error | ||
| return new Content(slideData, this, index); | ||
@@ -785,3 +1081,3 @@ } | ||
| * | ||
| * @param {Integer} index | ||
| * @param {number} index | ||
| */ | ||
@@ -797,3 +1093,3 @@ getItemData(index) { | ||
| // thus it was created by Lightbox, based on | ||
| // gallerySelecor and childSelector options | ||
| // gallery and children options | ||
@@ -828,3 +1124,3 @@ // query DOM elements | ||
| * | ||
| * @param {Element} galleryElement | ||
| * @param {HTMLElement} galleryElement | ||
| */ | ||
@@ -846,6 +1142,7 @@ _getGalleryDOMElements(galleryElement) { | ||
| * | ||
| * @param {Element} element DOM element | ||
| * @param {HTMLElement} element DOM element | ||
| */ | ||
| // eslint-disable-next-line class-methods-use-this | ||
| _domElementToItemData(element) { | ||
| /** @type {SlideData} */ | ||
| const itemData = { | ||
@@ -855,3 +1152,4 @@ element | ||
| const linkEl = element.tagName === 'A' ? element : element.querySelector('a'); | ||
| // eslint-disable-next-line max-len | ||
| const linkEl = /** @type {HTMLAnchorElement} */ (element.tagName === 'A' ? element : element.querySelector('a')); | ||
@@ -898,2 +1196,10 @@ if (linkEl) { | ||
| /** @typedef {import("../photoswipe").PhotoSwipeOptions} PhotoSwipeOptions */ | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {import("../slide/slide").SlideData} SlideData */ | ||
| /** | ||
| * @param {PhotoSwipeOptions} options | ||
| * @param {PhotoSwipe} pswp | ||
| */ | ||
| function getViewportSize(options, pswp) { | ||
@@ -946,10 +1252,11 @@ if (options.getViewportSizeFn) { | ||
| * | ||
| * @param {String} prop 'left', 'top', 'bottom', 'right' | ||
| * @param {Object} options PhotoSwipe options | ||
| * @param {Object} viewportSize PhotoSwipe viewport size, for example: { x:800, y:600 } | ||
| * @param {Object} itemData Data about the slide | ||
| * @param {Integer} index Slide index | ||
| * @returns {Number} | ||
| * @param {'left' | 'top' | 'bottom' | 'right'} prop | ||
| * @param {PhotoSwipeOptions} options PhotoSwipe options | ||
| * @param {{ x?: number; y?: number }} viewportSize PhotoSwipe viewport size, for example: { x:800, y:600 } | ||
| * @param {SlideData} itemData Data about the slide | ||
| * @param {number} index Slide index | ||
| * @returns {number} | ||
| */ | ||
| function parsePaddingOption(prop, options, viewportSize, itemData, index) { | ||
| /** @type {number} */ | ||
| let paddingValue; | ||
@@ -963,3 +1270,5 @@ | ||
| const legacyPropName = 'padding' + prop[0].toUpperCase() + prop.slice(1); | ||
| // @ts-expect-error | ||
| if (options[legacyPropName]) { | ||
| // @ts-expect-error | ||
| paddingValue = options[legacyPropName]; | ||
@@ -972,3 +1281,8 @@ } | ||
| /** | ||
| * @param {PhotoSwipeOptions} options | ||
| * @param {{ x?: number; y?: number }} viewportSize | ||
| * @param {SlideData} itemData | ||
| * @param {number} index | ||
| */ | ||
| function getPanAreaSize(options, viewportSize, itemData, index) { | ||
@@ -985,2 +1299,10 @@ return { | ||
| const MAX_IMAGE_WIDTH = 4000; | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {import("../photoswipe").PhotoSwipeOptions} PhotoSwipeOptions */ | ||
| /** @typedef {import("../slide/slide").SlideData} SlideData */ | ||
| /** @typedef {'fit' | 'fill' | number | ((zoomLevelObject: ZoomLevel) => number)} ZoomLevelOption */ | ||
| /** | ||
@@ -990,11 +1312,8 @@ * Calculates zoom levels for specific slide. | ||
| */ | ||
| const MAX_IMAGE_WIDTH = 4000; | ||
| class ZoomLevel { | ||
| /** | ||
| * @param {Object} options PhotoSwipe options | ||
| * @param {Object} itemData Slide data | ||
| * @param {Integer} index Slide index | ||
| * @param {PhotoSwipe|undefined} pswp PhotoSwipe instance, can be undefined if not initialized yet | ||
| * @param {PhotoSwipeOptions} options PhotoSwipe options | ||
| * @param {SlideData} itemData Slide data | ||
| * @param {number} index Slide index | ||
| * @param {PhotoSwipe=} pswp PhotoSwipe instance, can be undefined if not initialized yet | ||
| */ | ||
@@ -1013,3 +1332,5 @@ constructor(options, itemData, index, pswp) { | ||
| * | ||
| * @param {Slide} slide | ||
| * @param {number} maxWidth | ||
| * @param {number} maxHeight | ||
| * @param {{ x?: number; y?: number }} panAreaSize | ||
| */ | ||
@@ -1056,9 +1377,9 @@ update(maxWidth, maxHeight, panAreaSize) { | ||
| * | ||
| * @param {Mixed} optionPrefix Zoom level option prefix (initial, secondary, max) | ||
| * @private | ||
| * @param {'initial' | 'secondary' | 'max'} optionPrefix Zoom level option prefix (initial, secondary, max) | ||
| */ | ||
| _parseZoomLevelOption(optionPrefix) { | ||
| // zoom.initial | ||
| // zoom.secondary | ||
| // zoom.max | ||
| const optionValue = this.options[optionPrefix + 'ZoomLevel']; | ||
| // eslint-disable-next-line max-len | ||
| const optionName = /** @type {'initialZoomLevel' | 'secondaryZoomLevel' | 'maxZoomLevel'} */ (optionPrefix + 'ZoomLevel'); | ||
| const optionValue = this.options[optionName]; | ||
@@ -1090,3 +1411,4 @@ if (!optionValue) { | ||
| * | ||
| * @return {Number} | ||
| * @private | ||
| * @return {number} | ||
| */ | ||
@@ -1113,3 +1435,4 @@ _getSecondary() { | ||
| * | ||
| * @return {Number} | ||
| * @private | ||
| * @return {number} | ||
| */ | ||
@@ -1125,3 +1448,4 @@ _getInitial() { | ||
| * | ||
| * @return {Number} | ||
| * @private | ||
| * @return {number} | ||
| */ | ||
@@ -1146,6 +1470,6 @@ _getMax() { | ||
| * | ||
| * @param {Object} itemData Data about the slide | ||
| * @param {PhotoSwipeBase} instance PhotoSwipe or PhotoSwipeLightbox | ||
| * @param {Integer} index | ||
| * @returns {Object|Boolean} Image that is being decoded or false. | ||
| * @param {SlideData} itemData Data about the slide | ||
| * @param {PhotoSwipe | PhotoSwipeLightbox} instance PhotoSwipe or PhotoSwipeLightbox | ||
| * @param {number} index | ||
| * @returns Image that is being decoded or false. | ||
| */ | ||
@@ -1164,3 +1488,4 @@ function lazyLoadData(itemData, instance, index) { | ||
| // as it might use srcset and we need to define sizes | ||
| const viewportSize = instance.viewportSize || getViewportSize(options); | ||
| // @ts-expect-error should provide pswp instance? | ||
| const viewportSize = instance.viewportSize || getViewportSize(options, instance); | ||
| const panAreaSize = getPanAreaSize(options, viewportSize, itemData, index); | ||
@@ -1188,4 +1513,4 @@ | ||
| * | ||
| * @param {Integer} index Slide index | ||
| * @param {Object} instance PhotoSwipe or PhotoSwipeLightbox eventable instance | ||
| * @param {number} index Slide index | ||
| * @param {PhotoSwipe | PhotoSwipeLightbox} instance PhotoSwipe or PhotoSwipeLightbox eventable instance | ||
| */ | ||
@@ -1203,3 +1528,20 @@ function lazyLoadSlide(index, instance) { | ||
| /** | ||
| * PhotoSwipe lightbox | ||
| * @template T | ||
| * @typedef {import("../types").Type<T>} Type<T> | ||
| */ | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {import("../photoswipe").PhotoSwipeOptions} PhotoSwipeOptions */ | ||
| /** @typedef {import("../photoswipe").DataSource} DataSource */ | ||
| /** @typedef {import("../slide/content").default} Content */ | ||
| /** @typedef {import("../core/eventable").PhotoSwipeEventsMap} PhotoSwipeEventsMap */ | ||
| /** @typedef {import("../core/eventable").PhotoSwipeFiltersMap} PhotoSwipeFiltersMap */ | ||
| /** | ||
| * @template T | ||
| * @typedef {import("../core/eventable").EventCallback<T>} EventCallback<T> | ||
| */ | ||
| /** | ||
| * PhotoSwipe Lightbox | ||
| * | ||
@@ -1218,6 +1560,9 @@ * - If user has unsupported browser it falls back to default browser action (just opens URL) | ||
| */ | ||
| class PhotoSwipeLightbox extends PhotoSwipeBase { | ||
| /** | ||
| * @param {PhotoSwipeOptions} options | ||
| */ | ||
| constructor(options) { | ||
| super(); | ||
| /** @type {PhotoSwipeOptions} */ | ||
| this.options = options || {}; | ||
@@ -1227,2 +1572,6 @@ this._uid = 0; | ||
| /** | ||
| * Initialize lightbox, should be called only once. | ||
| * It's not included in the main constructor, so you may bind events before it. | ||
| */ | ||
| init() { | ||
@@ -1238,2 +1587,5 @@ this.onThumbnailsClick = this.onThumbnailsClick.bind(this); | ||
| /** | ||
| * @param {MouseEvent} e | ||
| */ | ||
| onThumbnailsClick(e) { | ||
@@ -1263,3 +1615,3 @@ // Exit and allow default browser action if: | ||
| const dataSource = { | ||
| gallery: e.currentTarget | ||
| gallery: /** @type {HTMLElement} */ (e.currentTarget) | ||
| }; | ||
@@ -1276,3 +1628,3 @@ | ||
| * | ||
| * @param {Event} e click event | ||
| * @param {MouseEvent} e click event | ||
| */ | ||
@@ -1285,7 +1637,7 @@ getClickedIndex(e) { | ||
| const clickedTarget = e.target; | ||
| const clickedTarget = /** @type {HTMLElement} */ (e.target); | ||
| const childElements = getElementsFromOption( | ||
| this.options.children, | ||
| this.options.childSelector, | ||
| e.currentTarget | ||
| /** @type {HTMLElement} */ (e.currentTarget) | ||
| ); | ||
@@ -1310,5 +1662,5 @@ const clickedChildIndex = childElements.findIndex( | ||
| * | ||
| * @param {Integer} index | ||
| * @param {Array|Object|null} dataSource | ||
| * @param {Point|null} initialPoint | ||
| * @param {number} index | ||
| * @param {DataSource=} dataSource | ||
| * @param {{ x?: number; y?: number }} [initialPoint] | ||
| */ | ||
@@ -1335,3 +1687,4 @@ loadAndOpen(index, dataSource, initialPoint) { | ||
| * | ||
| * @param {Integer} index | ||
| * @param {number} index | ||
| * @param {DataSource=} dataSource | ||
| */ | ||
@@ -1346,2 +1699,3 @@ preload(index, dataSource) { | ||
| // Add the main module | ||
| /** @type {Promise<Type<PhotoSwipe>>[]} */ | ||
| const promiseArray = []; | ||
@@ -1351,7 +1705,7 @@ | ||
| if (isPswpClass(options.pswpModule)) { | ||
| promiseArray.push(options.pswpModule); | ||
| promiseArray.push(Promise.resolve(/** @type {Type<PhotoSwipe>} */ (options.pswpModule))); | ||
| } else if (pswpModuleType === 'string') { | ||
| throw new Error('pswpModule as string is no longer supported'); | ||
| } else if (pswpModuleType === 'function') { | ||
| promiseArray.push(options.pswpModule()); | ||
| promiseArray.push(/** @type {() => Promise<Type<PhotoSwipe>>} */ (options.pswpModule)()); | ||
| } else { | ||
@@ -1381,2 +1735,7 @@ throw new Error('pswpModule is not valid'); | ||
| /** | ||
| * @private | ||
| * @param {Type<PhotoSwipe> | { default: Type<PhotoSwipe> }} module | ||
| * @param {number} uid | ||
| */ | ||
| _openPhotoswipe(module, uid) { | ||
@@ -1399,3 +1758,7 @@ // Cancel opening if UID doesn't match the current one | ||
| // Pass data to PhotoSwipe and open init | ||
| /** | ||
| * Pass data to PhotoSwipe and open init | ||
| * | ||
| * @type {PhotoSwipe} | ||
| */ | ||
| const pswp = typeof module === 'object' | ||
@@ -1409,5 +1772,6 @@ ? new module.default(this.options) // eslint-disable-line | ||
| // map listeners from Lightbox to PhotoSwipe Core | ||
| Object.keys(this._listeners).forEach((name) => { | ||
| /** @type {(keyof PhotoSwipeEventsMap)[]} */ | ||
| (Object.keys(this._listeners)).forEach((name) => { | ||
| this._listeners[name].forEach((fn) => { | ||
| pswp.on(name, fn); | ||
| pswp.on(name, /** @type {EventCallback<typeof name>} */(fn)); | ||
| }); | ||
@@ -1417,3 +1781,4 @@ }); | ||
| // same with filters | ||
| Object.keys(this._filters).forEach((name) => { | ||
| /** @type {(keyof PhotoSwipeFiltersMap)[]} */ | ||
| (Object.keys(this._filters)).forEach((name) => { | ||
| this._filters[name].forEach((filter) => { | ||
@@ -1438,2 +1803,5 @@ pswp.addFilter(name, filter.fn, filter.priority); | ||
| /** | ||
| * Unbinds all events, closes PhotoSwipe if it's open. | ||
| */ | ||
| destroy() { | ||
@@ -1454,3 +1822,3 @@ if (this.pswp) { | ||
| export default PhotoSwipeLightbox; | ||
| export { PhotoSwipeLightbox as default }; | ||
| //# sourceMappingURL=photoswipe-lightbox.esm.js.map |
| /*! | ||
| * PhotoSwipe Lightbox 5.2.4 - https://photoswipe.com | ||
| * PhotoSwipe Lightbox 5.2.5 - https://photoswipe.com | ||
| * (c) 2022 Dmytro Semenov | ||
| */ | ||
| function t(t,i,s){const h=document.createElement(i||"div");return t&&(h.className=t),s&&s.appendChild(h),h}function i(t,i,s){t.style.width="number"==typeof i?i+"px":i,t.style.height="number"==typeof s?s+"px":s}const s="idle",h="loading",e="loaded",n="error";function o(t,i,s=document){let h=[];if(t instanceof Element)h=[t];else if(t instanceof NodeList||Array.isArray(t))h=Array.from(t);else{const e="string"==typeof t?t:i;e&&(h=Array.from(s.querySelectorAll(e)))}return h}class r{constructor(t,i){this.type=t,i&&Object.assign(this,i)}preventDefault(){this.defaultPrevented=!0}}class a{constructor(i,s){this.element=t("pswp__img pswp__img--placeholder",i?"img":"",s),i&&(this.element.decoding="async",this.element.alt="",this.element.src=i,this.element.setAttribute("role","presentation")),this.element.setAttribute("aria-hiden","true")}setDisplayedSize(t,s){this.element&&("IMG"===this.element.tagName?(i(this.element,250,"auto"),this.element.style.transformOrigin="0 0",this.element.style.transform=function(t,i,s){let h="translate3d("+t+"px,"+(i||0)+"px,0)";return void 0!==s&&(h+=" scale3d("+s+","+s+",1)"),h}(0,0,t/250)):i(this.element,t,s))}destroy(){this.element.parentNode&&this.element.remove(),this.element=null}}class c{constructor(t,i,h){this.instance=i,this.data=t,this.index=h,this.width=Number(this.data.w)||Number(this.data.width)||0,this.height=Number(this.data.h)||Number(this.data.height)||0,this.isAttached=!1,this.hasSlide=!1,this.state=s,this.data.type?this.type=this.data.type:this.data.src?this.type="image":this.type="html",this.instance.dispatch("contentInit",{content:this})}removePlaceholder(){this.placeholder&&!this.keepPlaceholder()&&setTimeout((()=>{this.placeholder&&(this.placeholder.destroy(),this.placeholder=null)}),500)}load(i,s){if(!this.placeholder&&this.slide&&this.usePlaceholder()){const t=this.instance.applyFilters("placeholderSrc",!(!this.data.msrc||!this.slide.isFirstSlide)&&this.data.msrc,this);this.placeholder=new a(t,this.slide.container)}this.element&&!s||this.instance.dispatch("contentLoad",{content:this,isLazy:i}).defaultPrevented||(this.isImageContent()?this.loadImage(i):(this.element=t("pswp__content"),this.element.innerHTML=this.data.html||""),s&&this.slide&&this.slide.updateContentSize(!0))}loadImage(i){this.element=t("pswp__img","img"),this.instance.dispatch("contentLoadImage",{content:this,isLazy:i}).defaultPrevented||(this.data.srcset&&(this.element.srcset=this.data.srcset),this.element.src=this.data.src,this.element.alt=this.data.alt||"",this.state=h,this.element.complete?this.onLoaded():(this.element.onload=()=>{this.onLoaded()},this.element.onerror=()=>{this.onError()}))}setSlide(t){this.slide=t,this.hasSlide=!0,this.instance=t.pswp}onLoaded(){this.state=e,this.slide&&(this.instance.dispatch("loadComplete",{slide:this.slide,content:this}),this.slide.isActive&&this.slide.heavyAppended&&!this.element.parentNode&&(this.slide.container.innerHTML="",this.append(),this.slide.updateContentSize(!0)))}onError(){this.state=n,this.slide&&(this.displayError(),this.instance.dispatch("loadComplete",{slide:this.slide,isError:!0,content:this}),this.instance.dispatch("loadError",{slide:this.slide,content:this}))}isLoading(){return this.instance.applyFilters("isContentLoading",this.state===h,this)}isError(){return this.state===n}isImageContent(){return"image"===this.type}setDisplayedSize(t,s){if(this.element&&(this.placeholder&&this.placeholder.setDisplayedSize(t,s),!this.instance.dispatch("contentResize",{content:this,width:t,height:s}).defaultPrevented&&(i(this.element,t,s),this.isImageContent()&&!this.isError()))){const i=this.element;i.srcset&&(!i.dataset.largestUsedSize||t>i.dataset.largestUsedSize)&&(i.sizes=t+"px",i.dataset.largestUsedSize=t),this.slide&&this.instance.dispatch("imageSizeChange",{slide:this.slide,width:t,height:s,content:this})}}isZoomable(){return this.instance.applyFilters("isContentZoomable",this.isImageContent()&&this.state!==n,this)}usePlaceholder(){return this.instance.applyFilters("useContentPlaceholder",this.isImageContent(),this)}lazyLoad(){this.instance.dispatch("contentLazyLoad",{content:this}).defaultPrevented||this.load(!0)}keepPlaceholder(){return this.instance.applyFilters("isKeepingPlaceholder",this.isLoading(),this)}destroy(){this.hasSlide=!1,this.slide=null,this.instance.dispatch("contentDestroy",{content:this}).defaultPrevented||(this.remove(),this.isImageContent()&&this.element&&(this.element.onload=null,this.element.onerror=null,this.element=null))}displayError(){if(this.slide){let i=t("pswp__error-msg");i.innerText=this.instance.options.errorMsg,i=this.instance.applyFilters("contentErrorElement",i,this),this.element=t("pswp__content pswp__error-msg-container"),this.element.appendChild(i),this.slide.container.innerHTML="",this.slide.container.appendChild(this.element),this.slide.updateContentSize(!0),this.removePlaceholder()}}append(){this.isAttached=!0,this.state!==n?this.instance.dispatch("contentAppend",{content:this}).defaultPrevented||(this.isImageContent()?this.slide&&!this.slide.isActive&&"decode"in this.element?(this.isDecoding=!0,requestAnimationFrame((()=>{this.element&&"IMG"===this.element.tagName&&this.element.decode().then((()=>{this.isDecoding=!1,requestAnimationFrame((()=>{this.appendImage()}))})).catch((()=>{this.isDecoding=!1}))}))):(!this.placeholder||this.state!==e&&this.state!==n||this.removePlaceholder(),this.appendImage()):this.element&&!this.element.parentNode&&this.slide.container.appendChild(this.element)):this.displayError()}activate(){this.instance.dispatch("contentActivate",{content:this}).defaultPrevented||this.slide&&(this.isImageContent()&&this.isDecoding?this.appendImage():this.isError()&&this.load(!1,!0))}deactivate(){this.instance.dispatch("contentDeactivate",{content:this})}remove(){this.isAttached=!1,this.instance.dispatch("contentRemove",{content:this}).defaultPrevented||this.element&&this.element.parentNode&&this.element.remove()}appendImage(){this.isAttached&&(this.instance.dispatch("contentAppendImage",{content:this}).defaultPrevented||this.slide&&this.element&&!this.element.parentNode&&(this.slide.container.appendChild(this.element),!this.placeholder||this.state!==e&&this.state!==n||this.removePlaceholder()))}}function l(t,i,s,h,e){let n;if(i.paddingFn)n=i.paddingFn(s,h,e)[t];else if(i.padding)n=i.padding[t];else{const s="padding"+t[0].toUpperCase()+t.slice(1);i[s]&&(n=i[s])}return n||0}class u{constructor(t,i,s,h){this.pswp=h,this.options=t,this.itemData=i,this.index=s}update(t,i,s){this.elementSize={x:t,y:i},this.panAreaSize=s;const h=this.panAreaSize.x/this.elementSize.x,e=this.panAreaSize.y/this.elementSize.y;this.fit=Math.min(1,h<e?h:e),this.fill=Math.min(1,h>e?h:e),this.vFill=Math.min(1,e),this.initial=this.t(),this.secondary=this.i(),this.max=Math.max(this.initial,this.secondary,this.o()),this.min=Math.min(this.fit,this.initial,this.secondary),this.pswp&&this.pswp.dispatch("zoomLevelsUpdate",{zoomLevels:this,slideData:this.itemData})}l(t){const i=this.options[t+"ZoomLevel"];if(i)return"function"==typeof i?i(this):"fill"===i?this.fill:"fit"===i?this.fit:Number(i)}i(){let t=this.l("secondary");return t||(t=Math.min(1,3*this.fit),t*this.elementSize.x>4e3&&(t=4e3/this.elementSize.x),t)}t(){return this.l("initial")||this.fit}o(){const t=this.l("max");return t||Math.max(1,4*this.fit)}}function d(t,i,s){const h=i.createContentFromData(t,s);if(!h||!h.lazyLoad)return;const{options:e}=i,n=i.viewportSize||function(t,i){if(t.getViewportSizeFn){const s=t.getViewportSizeFn(t,i);if(s)return s}return{x:document.documentElement.clientWidth,y:window.innerHeight}}(e),o=function(t,i,s,h){return{x:i.x-l("left",t,i,s,h)-l("right",t,i,s,h),y:i.y-l("top",t,i,s,h)-l("bottom",t,i,s,h)}}(e,n,t,s),r=new u(e,t,-1);return r.update(h.width,h.height,o),h.lazyLoad(),h.setDisplayedSize(Math.ceil(h.width*r.initial),Math.ceil(h.height*r.initial)),h}export default class extends class extends class{constructor(){this.u={},this.m={}}addFilter(t,i,s=100){this.m[t]||(this.m[t]=[]),this.m[t].push({fn:i,priority:s}),this.m[t].sort(((t,i)=>t.priority-i.priority)),this.pswp&&this.pswp.addFilter(t,i,s)}removeFilter(t,i){this.m[t]&&(this.m[t]=this.m[t].filter((t=>t.fn!==i))),this.pswp&&this.pswp.removeFilter(t,i)}applyFilters(t,...i){return this.m[t]&&this.m[t].forEach((t=>{i[0]=t.fn.apply(this,i)})),i[0]}on(t,i){this.u[t]||(this.u[t]=[]),this.u[t].push(i),this.pswp&&this.pswp.on(t,i)}off(t,i){this.u[t]&&(this.u[t]=this.u[t].filter((t=>i!==t))),this.pswp&&this.pswp.off(t,i)}dispatch(t,i){if(this.pswp)return this.pswp.dispatch(t,i);const s=new r(t,i);return this.u?(this.u[t]&&this.u[t].forEach((t=>{t.call(this,s)})),s):s}}{getNumItems(){let t;const{dataSource:i}=this.options;i?i.length?t=i.length:i.gallery&&(i.items||(i.items=this.p(i.gallery)),i.items&&(t=i.items.length)):t=0;const s=this.dispatch("numItems",{dataSource:i,numItems:t});return this.applyFilters("numItems",s.numItems,i)}createContentFromData(t,i){return new c(t,this,i)}getItemData(t){const{dataSource:i}=this.options;let s;Array.isArray(i)?s=i[t]:i&&i.gallery&&(i.items||(i.items=this.p(i.gallery)),s=i.items[t]);let h=s;h instanceof Element&&(h=this.g(h));const e=this.dispatch("itemData",{itemData:h||{},index:t});return this.applyFilters("itemData",e.itemData,t)}p(t){return this.options.children||this.options.childSelector?o(this.options.children,this.options.childSelector,t)||[]:[t]}g(t){const i={element:t},s="A"===t.tagName?t:t.querySelector("a");if(s){i.src=s.dataset.pswpSrc||s.href,s.dataset.pswpSrcset&&(i.srcset=s.dataset.pswpSrcset),i.width=parseInt(s.dataset.pswpWidth,10),i.height=parseInt(s.dataset.pswpHeight,10),i.w=i.width,i.h=i.height,s.dataset.pswpType&&(i.type=s.dataset.pswpType);const h=t.querySelector("img");h&&(i.msrc=h.currentSrc||h.src,i.alt=h.getAttribute("alt")),(s.dataset.pswpCropped||s.dataset.cropped)&&(i.thumbCropped=!0)}return this.applyFilters("domItemData",i,t,s),i}}{constructor(t){super(),this.options=t||{},this._=0}init(){this.onThumbnailsClick=this.onThumbnailsClick.bind(this),o(this.options.gallery,this.options.gallerySelector).forEach((t=>{t.addEventListener("click",this.onThumbnailsClick,!1)}))}onThumbnailsClick(t){if(function(t){if(2===t.which||t.ctrlKey||t.metaKey||t.altKey||t.shiftKey)return!0}(t)||window.pswp||!1===window.navigator.onLine)return;let i={x:t.clientX,y:t.clientY};i.x||i.y||(i=null);let s=this.getClickedIndex(t);s=this.applyFilters("clickedIndex",s,t,this);const h={gallery:t.currentTarget};s>=0&&(t.preventDefault(),this.loadAndOpen(s,h,i))}getClickedIndex(t){if(this.options.getClickedIndexFn)return this.options.getClickedIndexFn.call(this,t);const i=t.target,s=o(this.options.children,this.options.childSelector,t.currentTarget).findIndex((t=>t===i||t.contains(i)));return-1!==s?s:this.options.children||this.options.childSelector?-1:0}loadAndOpen(t,i,s){return!window.pswp&&(this.options.index=t,this.options.initialPointerPos=s,this.shouldOpen=!0,this.preload(t,i),!0)}preload(t,i){const{options:s}=this;i&&(s.dataSource=i);const h=[],e=typeof s.pswpModule;if("function"==typeof(n=s.pswpModule)&&n.prototype&&n.prototype.goTo)h.push(s.pswpModule);else{if("string"===e)throw new Error("pswpModule as string is no longer supported");if("function"!==e)throw new Error("pswpModule is not valid");h.push(s.pswpModule())}var n;"function"==typeof s.openPromise&&h.push(s.openPromise()),!1!==s.preloadFirstSlide&&t>=0&&(this.I=function(t,i){const s=i.getItemData(t);if(!i.dispatch("lazyLoadSlide",{index:t,itemData:s}).defaultPrevented)return d(s,i,t)}(t,this));const o=++this._;Promise.all(h).then((t=>{if(this.shouldOpen){const i=t[0];this.v(i,o)}}))}v(t,i){if(i!==this._&&this.shouldOpen)return;if(this.shouldOpen=!1,window.pswp)return;const s="object"==typeof t?new t.default(this.options):new t(this.options);this.pswp=s,window.pswp=s,Object.keys(this.u).forEach((t=>{this.u[t].forEach((i=>{s.on(t,i)}))})),Object.keys(this.m).forEach((t=>{this.m[t].forEach((i=>{s.addFilter(t,i.fn,i.priority)}))})),this.I&&(s.contentLoader.addToCache(this.I),this.I=null),s.on("destroy",(()=>{this.pswp=null,window.pswp=null})),s.init()}destroy(){this.pswp&&this.pswp.destroy(),this.shouldOpen=!1,this.u=null,o(this.options.gallery,this.options.gallerySelector).forEach((t=>{t.removeEventListener("click",this.onThumbnailsClick,!1)}))}} | ||
| function t(t,i,s){const h=document.createElement(i||"div");return t&&(h.className=t),s&&s.appendChild(h),h}function i(t,i,s){t.style.width="number"==typeof i?i+"px":i,t.style.height="number"==typeof s?s+"px":s}const s="idle",h="loading",e="loaded",n="error";function o(t,i,s=document){let h=[];if(t instanceof Element)h=[t];else if(t instanceof NodeList||Array.isArray(t))h=Array.from(t);else{const e="string"==typeof t?t:i;e&&(h=Array.from(s.querySelectorAll(e)))}return h}class r{constructor(t,i){this.type=t,i&&Object.assign(this,i)}preventDefault(){this.defaultPrevented=!0}}class a{constructor(i,s){this.element=t("pswp__img pswp__img--placeholder",i?"img":"",s),i&&(this.element.decoding="async",this.element.alt="",this.element.src=i,this.element.setAttribute("role","presentation")),this.element.setAttribute("aria-hiden","true")}setDisplayedSize(t,s){this.element&&("IMG"===this.element.tagName?(i(this.element,250,"auto"),this.element.style.transformOrigin="0 0",this.element.style.transform=function(t,i,s){let h="translate3d("+t+"px,"+(i||0)+"px,0)";return void 0!==s&&(h+=" scale3d("+s+","+s+",1)"),h}(0,0,t/250)):i(this.element,t,s))}destroy(){this.element.parentNode&&this.element.remove(),this.element=null}}class c{element;constructor(t,i,h){this.instance=i,this.data=t,this.index=h,this.width=Number(this.data.w)||Number(this.data.width)||0,this.height=Number(this.data.h)||Number(this.data.height)||0,this.isAttached=!1,this.hasSlide=!1,this.state=s,this.data.type?this.type=this.data.type:this.data.src?this.type="image":this.type="html",this.instance.dispatch("contentInit",{content:this})}removePlaceholder(){this.placeholder&&!this.keepPlaceholder()&&setTimeout((()=>{this.placeholder&&(this.placeholder.destroy(),this.placeholder=null)}),500)}load(i,s){if(!this.placeholder&&this.slide&&this.usePlaceholder()){const t=this.instance.applyFilters("placeholderSrc",!(!this.data.msrc||!this.slide.isFirstSlide)&&this.data.msrc,this);this.placeholder=new a(t,this.slide.container)}this.element&&!s||this.instance.dispatch("contentLoad",{content:this,isLazy:i}).defaultPrevented||(this.isImageContent()?this.loadImage(i):(this.element=t("pswp__content"),this.element.innerHTML=this.data.html||""),s&&this.slide&&this.slide.updateContentSize(!0))}loadImage(i){const s=t("pswp__img","img");this.element=s,this.instance.dispatch("contentLoadImage",{content:this,isLazy:i}).defaultPrevented||(this.data.srcset&&(s.srcset=this.data.srcset),s.src=this.data.src,s.alt=this.data.alt||"",this.state=h,s.complete?this.onLoaded():(s.onload=()=>{this.onLoaded()},s.onerror=()=>{this.onError()}))}setSlide(t){this.slide=t,this.hasSlide=!0,this.instance=t.pswp}onLoaded(){this.state=e,this.slide&&(this.instance.dispatch("loadComplete",{slide:this.slide,content:this}),this.slide.isActive&&this.slide.heavyAppended&&!this.element.parentNode&&(this.slide.container.innerHTML="",this.append(),this.slide.updateContentSize(!0)))}onError(){this.state=n,this.slide&&(this.displayError(),this.instance.dispatch("loadComplete",{slide:this.slide,isError:!0,content:this}),this.instance.dispatch("loadError",{slide:this.slide,content:this}))}isLoading(){return this.instance.applyFilters("isContentLoading",this.state===h,this)}isError(){return this.state===n}isImageContent(){return"image"===this.type}setDisplayedSize(t,s){if(this.element&&(this.placeholder&&this.placeholder.setDisplayedSize(t,s),!this.instance.dispatch("contentResize",{content:this,width:t,height:s}).defaultPrevented&&(i(this.element,t,s),this.isImageContent()&&!this.isError()))){const i=this.element;i.srcset&&(!i.dataset.largestUsedSize||t>parseInt(i.dataset.largestUsedSize,10))&&(i.sizes=t+"px",i.dataset.largestUsedSize=String(t)),this.slide&&this.instance.dispatch("imageSizeChange",{slide:this.slide,width:t,height:s,content:this})}}isZoomable(){return this.instance.applyFilters("isContentZoomable",this.isImageContent()&&this.state!==n,this)}usePlaceholder(){return this.instance.applyFilters("useContentPlaceholder",this.isImageContent(),this)}lazyLoad(){this.instance.dispatch("contentLazyLoad",{content:this}).defaultPrevented||this.load(!0)}keepPlaceholder(){return this.instance.applyFilters("isKeepingPlaceholder",this.isLoading(),this)}destroy(){this.hasSlide=!1,this.slide=null,this.instance.dispatch("contentDestroy",{content:this}).defaultPrevented||(this.remove(),this.isImageContent()&&this.element&&(this.element.onload=null,this.element.onerror=null,this.element=null))}displayError(){if(this.slide){let i=t("pswp__error-msg");i.innerText=this.instance.options.errorMsg,i=this.instance.applyFilters("contentErrorElement",i,this),this.element=t("pswp__content pswp__error-msg-container"),this.element.appendChild(i),this.slide.container.innerHTML="",this.slide.container.appendChild(this.element),this.slide.updateContentSize(!0),this.removePlaceholder()}}append(){this.isAttached=!0,this.state!==n?this.instance.dispatch("contentAppend",{content:this}).defaultPrevented||(this.isImageContent()?this.slide&&!this.slide.isActive&&"decode"in this.element?(this.isDecoding=!0,requestAnimationFrame((()=>{this.element&&"IMG"===this.element.tagName&&this.element.decode().then((()=>{this.isDecoding=!1,requestAnimationFrame((()=>{this.appendImage()}))})).catch((()=>{this.isDecoding=!1}))}))):(!this.placeholder||this.state!==e&&this.state!==n||this.removePlaceholder(),this.appendImage()):this.element&&!this.element.parentNode&&this.slide.container.appendChild(this.element)):this.displayError()}activate(){this.instance.dispatch("contentActivate",{content:this}).defaultPrevented||this.slide&&(this.isImageContent()&&this.isDecoding?this.appendImage():this.isError()&&this.load(!1,!0))}deactivate(){this.instance.dispatch("contentDeactivate",{content:this})}remove(){this.isAttached=!1,this.instance.dispatch("contentRemove",{content:this}).defaultPrevented||this.element&&this.element.parentNode&&this.element.remove()}appendImage(){this.isAttached&&(this.instance.dispatch("contentAppendImage",{content:this}).defaultPrevented||this.slide&&this.element&&!this.element.parentNode&&(this.slide.container.appendChild(this.element),!this.placeholder||this.state!==e&&this.state!==n||this.removePlaceholder()))}}function l(t,i,s,h,e){let n;if(i.paddingFn)n=i.paddingFn(s,h,e)[t];else if(i.padding)n=i.padding[t];else{const s="padding"+t[0].toUpperCase()+t.slice(1);i[s]&&(n=i[s])}return n||0}class u{constructor(t,i,s,h){this.pswp=h,this.options=t,this.itemData=i,this.index=s}update(t,i,s){this.elementSize={x:t,y:i},this.panAreaSize=s;const h=this.panAreaSize.x/this.elementSize.x,e=this.panAreaSize.y/this.elementSize.y;this.fit=Math.min(1,h<e?h:e),this.fill=Math.min(1,h>e?h:e),this.vFill=Math.min(1,e),this.initial=this.t(),this.secondary=this.i(),this.max=Math.max(this.initial,this.secondary,this.o()),this.min=Math.min(this.fit,this.initial,this.secondary),this.pswp&&this.pswp.dispatch("zoomLevelsUpdate",{zoomLevels:this,slideData:this.itemData})}l(t){const i=t+"ZoomLevel",s=this.options[i];if(s)return"function"==typeof s?s(this):"fill"===s?this.fill:"fit"===s?this.fit:Number(s)}i(){let t=this.l("secondary");return t||(t=Math.min(1,3*this.fit),t*this.elementSize.x>4e3&&(t=4e3/this.elementSize.x),t)}t(){return this.l("initial")||this.fit}o(){const t=this.l("max");return t||Math.max(1,4*this.fit)}}function d(t,i,s){const h=i.createContentFromData(t,s);if(!h||!h.lazyLoad)return;const{options:e}=i,n=i.viewportSize||function(t,i){if(t.getViewportSizeFn){const s=t.getViewportSizeFn(t,i);if(s)return s}return{x:document.documentElement.clientWidth,y:window.innerHeight}}(e,i),o=function(t,i,s,h){return{x:i.x-l("left",t,i,s,h)-l("right",t,i,s,h),y:i.y-l("top",t,i,s,h)-l("bottom",t,i,s,h)}}(e,n,t,s),r=new u(e,t,-1);return r.update(h.width,h.height,o),h.lazyLoad(),h.setDisplayedSize(Math.ceil(h.width*r.initial),Math.ceil(h.height*r.initial)),h}class m extends class extends class{constructor(){this.u={},this.m={},this.pswp=void 0}addFilter(t,i,s=100){this.m[t]||(this.m[t]=[]),this.m[t].push({fn:i,priority:s}),this.m[t].sort(((t,i)=>t.priority-i.priority)),this.pswp&&this.pswp.addFilter(t,i,s)}removeFilter(t,i){this.m[t]&&(this.m[t]=this.m[t].filter((t=>t.fn!==i))),this.pswp&&this.pswp.removeFilter(t,i)}applyFilters(t,...i){return this.m[t]&&this.m[t].forEach((t=>{i[0]=t.fn.apply(this,i)})),i[0]}on(t,i){this.u[t]||(this.u[t]=[]),this.u[t].push(i),this.pswp&&this.pswp.on(t,i)}off(t,i){this.u[t]&&(this.u[t]=this.u[t].filter((t=>i!==t))),this.pswp&&this.pswp.off(t,i)}dispatch(t,i){if(this.pswp)return this.pswp.dispatch(t,i);const s=new r(t,i);return this.u?(this.u[t]&&this.u[t].forEach((t=>{t.call(this,s)})),s):s}}{options;getNumItems(){let t;const{dataSource:i}=this.options;i?"length"in i?t=i.length:"gallery"in i&&(i.items||(i.items=this.p(i.gallery)),i.items&&(t=i.items.length)):t=0;const s=this.dispatch("numItems",{dataSource:i,numItems:t});return this.applyFilters("numItems",s.numItems,i)}createContentFromData(t,i){return new c(t,this,i)}getItemData(t){const{dataSource:i}=this.options;let s;Array.isArray(i)?s=i[t]:i&&i.gallery&&(i.items||(i.items=this.p(i.gallery)),s=i.items[t]);let h=s;h instanceof Element&&(h=this.g(h));const e=this.dispatch("itemData",{itemData:h||{},index:t});return this.applyFilters("itemData",e.itemData,t)}p(t){return this.options.children||this.options.childSelector?o(this.options.children,this.options.childSelector,t)||[]:[t]}g(t){const i={element:t},s="A"===t.tagName?t:t.querySelector("a");if(s){i.src=s.dataset.pswpSrc||s.href,s.dataset.pswpSrcset&&(i.srcset=s.dataset.pswpSrcset),i.width=parseInt(s.dataset.pswpWidth,10),i.height=parseInt(s.dataset.pswpHeight,10),i.w=i.width,i.h=i.height,s.dataset.pswpType&&(i.type=s.dataset.pswpType);const h=t.querySelector("img");h&&(i.msrc=h.currentSrc||h.src,i.alt=h.getAttribute("alt")),(s.dataset.pswpCropped||s.dataset.cropped)&&(i.thumbCropped=!0)}return this.applyFilters("domItemData",i,t,s),i}}{constructor(t){super(),this.options=t||{},this.I=0}init(){this.onThumbnailsClick=this.onThumbnailsClick.bind(this),o(this.options.gallery,this.options.gallerySelector).forEach((t=>{t.addEventListener("click",this.onThumbnailsClick,!1)}))}onThumbnailsClick(t){if(function(t){if(2===t.which||t.ctrlKey||t.metaKey||t.altKey||t.shiftKey)return!0}(t)||window.pswp||!1===window.navigator.onLine)return;let i={x:t.clientX,y:t.clientY};i.x||i.y||(i=null);let s=this.getClickedIndex(t);s=this.applyFilters("clickedIndex",s,t,this);const h={gallery:t.currentTarget};s>=0&&(t.preventDefault(),this.loadAndOpen(s,h,i))}getClickedIndex(t){if(this.options.getClickedIndexFn)return this.options.getClickedIndexFn.call(this,t);const i=t.target,s=o(this.options.children,this.options.childSelector,t.currentTarget).findIndex((t=>t===i||t.contains(i)));return-1!==s?s:this.options.children||this.options.childSelector?-1:0}loadAndOpen(t,i,s){return!window.pswp&&(this.options.index=t,this.options.initialPointerPos=s,this.shouldOpen=!0,this.preload(t,i),!0)}preload(t,i){const{options:s}=this;i&&(s.dataSource=i);const h=[],e=typeof s.pswpModule;if("function"==typeof(n=s.pswpModule)&&n.prototype&&n.prototype.goTo)h.push(Promise.resolve(s.pswpModule));else{if("string"===e)throw new Error("pswpModule as string is no longer supported");if("function"!==e)throw new Error("pswpModule is not valid");h.push(s.pswpModule())}var n;"function"==typeof s.openPromise&&h.push(s.openPromise()),!1!==s.preloadFirstSlide&&t>=0&&(this._=function(t,i){const s=i.getItemData(t);if(!i.dispatch("lazyLoadSlide",{index:t,itemData:s}).defaultPrevented)return d(s,i,t)}(t,this));const o=++this.I;Promise.all(h).then((t=>{if(this.shouldOpen){const i=t[0];this.v(i,o)}}))}v(t,i){if(i!==this.I&&this.shouldOpen)return;if(this.shouldOpen=!1,window.pswp)return;const s="object"==typeof t?new t.default(this.options):new t(this.options);this.pswp=s,window.pswp=s,Object.keys(this.u).forEach((t=>{this.u[t].forEach((i=>{s.on(t,i)}))})),Object.keys(this.m).forEach((t=>{this.m[t].forEach((i=>{s.addFilter(t,i.fn,i.priority)}))})),this._&&(s.contentLoader.addToCache(this._),this._=null),s.on("destroy",(()=>{this.pswp=null,window.pswp=null})),s.init()}destroy(){this.pswp&&this.pswp.destroy(),this.shouldOpen=!1,this.u=null,o(this.options.gallery,this.options.gallerySelector).forEach((t=>{t.removeEventListener("click",this.onThumbnailsClick,!1)}))}}export{m as default}; |
| /*! | ||
| * PhotoSwipe 5.2.4 - https://photoswipe.com | ||
| * PhotoSwipe 5.2.5 - https://photoswipe.com | ||
| * (c) 2022 Dmytro Semenov | ||
| */ | ||
| function t(t,i,s){const h=document.createElement(i||"div");return t&&(h.className=t),s&&s.appendChild(h),h}function i(t,i){return t.x=i.x,t.y=i.y,void 0!==i.id&&(t.id=i.id),t}function s(t){t.x=Math.round(t.x),t.y=Math.round(t.y)}function h(t,i){const s=Math.abs(t.x-i.x),h=Math.abs(t.y-i.y);return Math.sqrt(s*s+h*h)}function e(t,i){return t.x===i.x&&t.y===i.y}function n(t,i,s){return Math.min(Math.max(t,i),s)}function o(t,i,s){let h="translate3d("+t+"px,"+(i||0)+"px,0)";return void 0!==s&&(h+=" scale3d("+s+","+s+",1)"),h}function r(t,i,s,h){t.style.transform=o(i,s,h)}function a(t,i,s,h){t.style.transition=i?i+" "+s+"ms "+(h||"cubic-bezier(.4,0,.22,1)"):"none"}function c(t,i,s){t.style.width="number"==typeof i?i+"px":i,t.style.height="number"==typeof s?s+"px":s}const l="idle",p="loading",u="loaded",d="error";let m=!1;try{window.addEventListener("test",null,Object.defineProperty({},"passive",{get:()=>{m=!0}}))}catch(t){}class f{constructor(){this.t=[]}add(t,i,s,h){this.i(t,i,s,h)}remove(t,i,s,h){this.i(t,i,s,h,!0)}removeAll(){this.t.forEach((t=>{this.i(t.target,t.type,t.listener,t.passive,!0,!0)})),this.t=[]}i(t,i,s,h,e,n){if(!t)return;const o=(e?"remove":"add")+"EventListener";(i=i.split(" ")).forEach((i=>{if(i){n||(e?this.t=this.t.filter((h=>h.type!==i||h.listener!==s||h.target!==t)):this.t.push({target:t,type:i,listener:s,passive:h}));const r=!!m&&{passive:h||!1};t[o](i,s,r)}}))}}function w(t,i){if(t.getViewportSizeFn){const s=t.getViewportSizeFn(t,i);if(s)return s}return{x:document.documentElement.clientWidth,y:window.innerHeight}}function g(t,i,s,h,e){let n;if(i.paddingFn)n=i.paddingFn(s,h,e)[t];else if(i.padding)n=i.padding[t];else{const s="padding"+t[0].toUpperCase()+t.slice(1);i[s]&&(n=i[s])}return n||0}function _(t,i,s,h){return{x:i.x-g("left",t,i,s,h)-g("right",t,i,s,h),y:i.y-g("top",t,i,s,h)-g("bottom",t,i,s,h)}}class v{constructor(t){this.slide=t,this.currZoomLevel=1,this.center={},this.max={},this.min={},this.reset()}update(t){this.currZoomLevel=t,this.slide.width?(this.o("x"),this.o("y"),this.slide.pswp.dispatch("calcBounds",{slide:this.slide})):this.reset()}o(t){const{pswp:i}=this.slide,s=this.slide["x"===t?"width":"height"]*this.currZoomLevel,h=g("x"===t?"left":"top",i.options,i.viewportSize,this.slide.data,this.slide.index),e=this.slide.panAreaSize[t];this.center[t]=Math.round((e-s)/2)+h,this.max[t]=s>e?Math.round(e-s)+h:this.center[t],this.min[t]=s>e?h:this.center[t]}reset(){this.center.x=0,this.center.y=0,this.max.x=0,this.max.y=0,this.min.x=0,this.min.y=0}correctPan(t,i){return n(i,this.max[t],this.min[t])}}class y{constructor(t,i,s,h){this.pswp=h,this.options=t,this.itemData=i,this.index=s}update(t,i,s){this.elementSize={x:t,y:i},this.panAreaSize=s;const h=this.panAreaSize.x/this.elementSize.x,e=this.panAreaSize.y/this.elementSize.y;this.fit=Math.min(1,h<e?h:e),this.fill=Math.min(1,h>e?h:e),this.vFill=Math.min(1,e),this.initial=this.l(),this.secondary=this.p(),this.max=Math.max(this.initial,this.secondary,this.u()),this.min=Math.min(this.fit,this.initial,this.secondary),this.pswp&&this.pswp.dispatch("zoomLevelsUpdate",{zoomLevels:this,slideData:this.itemData})}m(t){const i=this.options[t+"ZoomLevel"];if(i)return"function"==typeof i?i(this):"fill"===i?this.fill:"fit"===i?this.fit:Number(i)}p(){let t=this.m("secondary");return t||(t=Math.min(1,3*this.fit),t*this.elementSize.x>4e3&&(t=4e3/this.elementSize.x),t)}l(){return this.m("initial")||this.fit}u(){const t=this.m("max");return t||Math.max(1,4*this.fit)}}class b{constructor(i,s,h){this.data=i,this.index=s,this.pswp=h,this.isActive=s===h.currIndex,this.currentResolution=0,this.panAreaSize={},this.isFirstSlide=this.isActive&&!h.opener.isOpen,this.zoomLevels=new y(h.options,i,s,h),this.pswp.dispatch("gettingData",{slide:this,data:this.data,index:s}),this.pan={x:0,y:0},this.content=this.pswp.contentLoader.getContentBySlide(this),this.container=t("pswp__zoom-wrap"),this.currZoomLevel=1,this.width=this.content.width,this.height=this.content.height,this.bounds=new v(this),this.prevDisplayedWidth=-1,this.prevDisplayedHeight=-1,this.pswp.dispatch("slideInit",{slide:this})}setIsActive(t){t&&!this.isActive?this.activate():!t&&this.isActive&&this.deactivate()}append(t){this.holderElement=t,this.data?(this.calculateSize(),this.container.transformOrigin="0 0",this.load(),this.appendHeavy(),this.updateContentSize(),this.holderElement.innerHTML="",this.holderElement.appendChild(this.container),this.zoomAndPanToInitial(),this.pswp.dispatch("firstZoomPan",{slide:this}),this.applyCurrentZoomPan(),this.pswp.dispatch("afterSetContent",{slide:this}),this.isActive&&this.activate()):this.holderElement.innerHTML=""}load(){this.content.load(),this.pswp.dispatch("slideLoad",{slide:this})}appendHeavy(){const{pswp:t}=this;!this.heavyAppended&&t.opener.isOpen&&!t.mainScroll.isShifted()&&(this.isActive,1)&&(this.pswp.dispatch("appendHeavy",{slide:this}).defaultPrevented||(this.heavyAppended=!0,this.content.append(),this.pswp.dispatch("appendHeavyContent",{slide:this})))}activate(){this.isActive=!0,this.appendHeavy(),this.content.activate(),this.pswp.dispatch("slideActivate",{slide:this})}deactivate(){this.isActive=!1,this.content.deactivate(),this.currentResolution=0,this.zoomAndPanToInitial(),this.applyCurrentZoomPan(),this.updateContentSize(),this.pswp.dispatch("slideDeactivate",{slide:this})}destroy(){this.content.hasSlide=!1,this.content.remove(),this.pswp.dispatch("slideDestroy",{slide:this})}resize(){this.currZoomLevel!==this.zoomLevels.initial&&this.isActive?(this.calculateSize(),this.bounds.update(this.currZoomLevel),this.panTo(this.pan.x,this.pan.y)):(this.calculateSize(),this.currentResolution=0,this.zoomAndPanToInitial(),this.applyCurrentZoomPan(),this.updateContentSize())}updateContentSize(t){const i=this.currentResolution||this.zoomLevels.initial;if(!i)return;const s=Math.round(this.width*i)||this.pswp.viewportSize.x,h=Math.round(this.height*i)||this.pswp.viewportSize.y;(this.sizeChanged(s,h)||t)&&this.content.setDisplayedSize(s,h)}sizeChanged(t,i){return(t!==this.prevDisplayedWidth||i!==this.prevDisplayedHeight)&&(this.prevDisplayedWidth=t,this.prevDisplayedHeight=i,!0)}getPlaceholderElement(){if(this.content.placeholder)return this.content.placeholder.element}zoomTo(t,i,h,e){const{pswp:o}=this;if(!this.isZoomable()||o.mainScroll.isShifted())return;o.dispatch("beforeZoomTo",{destZoomLevel:t,centerPoint:i,transitionDuration:h}),o.animations.stopAllPan();const r=this.currZoomLevel;e||(t=n(t,this.zoomLevels.min,this.zoomLevels.max)),this.setZoomLevel(t),this.pan.x=this.calculateZoomToPanOffset("x",i,r),this.pan.y=this.calculateZoomToPanOffset("y",i,r),s(this.pan);const a=()=>{this.g(t),this.applyCurrentZoomPan()};h?o.animations.startTransition({isPan:!0,name:"zoomTo",target:this.container,transform:this.getCurrentTransform(),onComplete:a,duration:h,easing:o.options.easing}):a()}toggleZoom(t){this.zoomTo(this.currZoomLevel===this.zoomLevels.initial?this.zoomLevels.secondary:this.zoomLevels.initial,t,this.pswp.options.zoomAnimationDuration)}setZoomLevel(t){this.currZoomLevel=t,this.bounds.update(this.currZoomLevel)}calculateZoomToPanOffset(t,i,s){if(0===this.bounds.max[t]-this.bounds.min[t])return this.bounds.center[t];i||(i=this.pswp.getViewportCenterPoint());const h=this.currZoomLevel/s;return this.bounds.correctPan(t,(this.pan[t]-i[t])*h+i[t])}panTo(t,i){this.pan.x=this.bounds.correctPan("x",t),this.pan.y=this.bounds.correctPan("y",i),this.applyCurrentZoomPan()}isPannable(){return this.width&&this.currZoomLevel>this.zoomLevels.fit}isZoomable(){return this.width&&this.content.isZoomable()}applyCurrentZoomPan(){this._(this.pan.x,this.pan.y,this.currZoomLevel),this===this.pswp.currSlide&&this.pswp.dispatch("zoomPanUpdate",{slide:this})}zoomAndPanToInitial(){this.currZoomLevel=this.zoomLevels.initial,this.bounds.update(this.currZoomLevel),i(this.pan,this.bounds.center),this.pswp.dispatch("initialZoomPan",{slide:this})}_(t,i,s){s/=this.currentResolution||this.zoomLevels.initial,r(this.container,t,i,s)}calculateSize(){const{pswp:t}=this;i(this.panAreaSize,_(t.options,t.viewportSize,this.data,this.index)),this.zoomLevels.update(this.width,this.height,this.panAreaSize),t.dispatch("calcSlideSize",{slide:this})}getCurrentTransform(){const t=this.currZoomLevel/(this.currentResolution||this.zoomLevels.initial);return o(this.pan.x,this.pan.y,t)}g(t){t!==this.currentResolution&&(this.currentResolution=t,this.updateContentSize(),this.pswp.dispatch("resolutionChanged"))}}class x{constructor(t){this.gestures=t,this.pswp=t.pswp,this.startPan={}}start(){i(this.startPan,this.pswp.currSlide.pan),this.pswp.animations.stopAll()}change(){const{p1:t,prevP1:i,dragAxis:h,pswp:e}=this.gestures,{currSlide:n}=e;if("y"===h&&e.options.closeOnVerticalDrag&&n.currZoomLevel<=n.zoomLevels.fit&&!this.gestures.isMultitouch){const s=n.pan.y+(t.y-i.y);if(!e.dispatch("verticalDrag",{panY:s}).defaultPrevented){this.v("y",s,.6);const t=1-Math.abs(this.M(n.pan.y));e.applyBgOpacity(t),n.applyCurrentZoomPan()}}else{this.S("x")||(this.S("y"),s(n.pan),n.applyCurrentZoomPan())}}end(){const{pswp:t,velocity:i}=this.gestures,{mainScroll:s}=t;let h=0;if(t.animations.stopAll(),s.isShifted()){const e=(s.x-s.getCurrSlideX())/t.viewportSize.x;i.x<-.5&&e<0||i.x<.1&&e<-.5?(h=1,i.x=Math.min(i.x,0)):(i.x>.5&&e>0||i.x>-.1&&e>.5)&&(h=-1,i.x=Math.max(i.x,0)),s.moveIndexBy(h,!0,i.x)}t.currSlide.currZoomLevel>t.currSlide.zoomLevels.max||this.gestures.isMultitouch?this.gestures.zoomLevels.correctZoomPan(!0):(this.P("x"),this.P("y"))}P(t){const{pswp:i}=this,{currSlide:s}=i,{velocity:h}=this.gestures,{pan:e,bounds:o}=s,r=e[t],a=i.bgOpacity<1&&"y"===t,c=r+function(t,i){return t*i/(1-i)}(h[t],.995);if(a){const t=this.M(r),s=this.M(c);if(t<0&&s<-.4||t>0&&s>.4)return void i.close()}const l=o.correctPan(t,c);if(r===l)return;const p=l===c?1:.82,u=i.bgOpacity,d=l-r;i.animations.startSpring({name:"panGesture"+t,isPan:!0,start:r,end:l,velocity:h[t],dampingRatio:p,onUpdate:h=>{if(a&&i.bgOpacity<1){const t=1-(l-h)/d;i.applyBgOpacity(n(u+(1-u)*t,0,1))}e[t]=Math.floor(h),s.applyCurrentZoomPan()}})}S(t){const{p1:i,pswp:s,dragAxis:h,prevP1:e,isMultitouch:n}=this.gestures,{currSlide:o,mainScroll:r}=s,a=i[t]-e[t],c=r.x+a;if(!a)return;if("x"===t&&!o.isPannable()&&!n)return r.moveTo(c,!0),!0;const{bounds:l}=o,p=o.pan[t]+a;if(s.options.allowPanToNext&&"x"===h&&"x"===t&&!n){const i=r.getCurrSlideX(),s=r.x-i,h=a>0,e=!h;if(p>l.min[t]&&h){if(l.min[t]<=this.startPan[t])return r.moveTo(c,!0),!0;this.v(t,p)}else if(p<l.max[t]&&e){if(this.startPan[t]<=l.max[t])return r.moveTo(c,!0),!0;this.v(t,p)}else if(0!==s){if(s>0)return r.moveTo(Math.max(c,i),!0),!0;if(s<0)return r.moveTo(Math.min(c,i),!0),!0}else this.v(t,p)}else"y"===t&&(r.isShifted()||l.min.y===l.max.y)||this.v(t,p)}M(t){return(t-this.pswp.currSlide.bounds.center.y)/(this.pswp.viewportSize.y/3)}v(t,i,s){const{pan:h,bounds:e}=this.pswp.currSlide;if(e.correctPan(t,i)!==i||s){const e=Math.round(i-h[t]);h[t]+=e*(s||.35)}else h[t]=i}}function M(t,i,s){return t.x=(i.x+s.x)/2,t.y=(i.y+s.y)/2,t}class S{constructor(t){this.gestures=t,this.pswp=this.gestures.pswp,this.C={},this.T={},this.D={}}start(){this.A=this.pswp.currSlide.currZoomLevel,i(this.C,this.pswp.currSlide.pan),this.pswp.animations.stopAllPan(),this.I=!1}change(){const{p1:t,startP1:i,p2:s,startP2:e,pswp:n}=this.gestures,{currSlide:o}=n,r=o.zoomLevels.min,a=o.zoomLevels.max;if(!o.isZoomable()||n.mainScroll.isShifted())return;M(this.T,i,e),M(this.D,t,s);let c=1/h(i,e)*h(t,s)*this.A;if(c>o.zoomLevels.initial+o.zoomLevels.initial/15&&(this.I=!0),c<r)if(n.options.pinchToClose&&!this.I&&this.A<=o.zoomLevels.initial){const t=1-(r-c)/(r/1.2);n.dispatch("pinchClose",{bgOpacity:t}).defaultPrevented||n.applyBgOpacity(t)}else c=r-.15*(r-c);else c>a&&(c=a+.05*(c-a));o.pan.x=this.L("x",c),o.pan.y=this.L("y",c),o.setZoomLevel(c),o.applyCurrentZoomPan()}end(){const{pswp:t}=this,{currSlide:i}=t;i.currZoomLevel<i.zoomLevels.initial&&!this.I&&t.options.pinchToClose?t.close():this.correctZoomPan()}L(t,i){const s=i/this.A;return this.D[t]-(this.T[t]-this.C[t])*s}correctZoomPan(t){const{pswp:s}=this,{currSlide:h}=s;if(!h.isZoomable())return;void 0===this.D.x&&(t=!0);const o=h.currZoomLevel;let r,a=!0;o<h.zoomLevels.initial?r=h.zoomLevels.initial:o>h.zoomLevels.max?r=h.zoomLevels.max:(a=!1,r=o);const c=s.bgOpacity,l=s.bgOpacity<1,p=i({},h.pan);let u=i({},p);t&&(this.D.x=0,this.D.y=0,this.T.x=0,this.T.y=0,this.A=o,i(this.C,p)),a&&(u={x:this.L("x",r),y:this.L("y",r)}),h.setZoomLevel(r),u={x:h.bounds.correctPan("x",u.x),y:h.bounds.correctPan("y",u.y)},h.setZoomLevel(o);let d=!0;if(e(u,p)&&(d=!1),!d&&!a&&!l)return h.g(r),void h.applyCurrentZoomPan();s.animations.stopAllPan(),s.animations.startSpring({isPan:!0,start:0,end:1e3,velocity:0,dampingRatio:1,naturalFrequency:40,onUpdate:t=>{if(t/=1e3,d||a){if(d&&(h.pan.x=p.x+(u.x-p.x)*t,h.pan.y=p.y+(u.y-p.y)*t),a){const i=o+(r-o)*t;h.setZoomLevel(i)}h.applyCurrentZoomPan()}l&&s.bgOpacity<1&&s.applyBgOpacity(n(c+(1-c)*t,0,1))},onComplete:()=>{h.g(r),h.applyCurrentZoomPan()}})}}function z(t){return!!t.target.closest(".pswp__container")}class P{constructor(t){this.gestures=t}click(t,i){const s=i.target.classList,h=s.contains("pswp__img"),e=s.contains("pswp__item")||s.contains("pswp__zoom-wrap");h?this.k("imageClick",t,i):e&&this.k("bgClick",t,i)}tap(t,i){z(i)&&this.k("tap",t,i)}doubleTap(t,i){z(i)&&this.k("doubleTap",t,i)}k(t,i,s){const{pswp:h}=this.gestures,{currSlide:e}=h,n=h.options[t+"Action"];if(!h.dispatch(t+"Action",{point:i,originalEvent:s}).defaultPrevented)if("function"!=typeof n)switch(n){case"close":case"next":h[n]();break;case"zoom":e.toggleZoom(i);break;case"zoom-or-close":e.isZoomable()&&e.zoomLevels.secondary!==e.zoomLevels.initial?e.toggleZoom(i):h.options.clickToCloseNonZoomable&&h.close();break;case"toggle-controls":this.gestures.pswp.element.classList.toggle("pswp--ui-visible")}else n.call(h,i,s)}}class C{constructor(t){this.pswp=t,this.p1={},this.p2={},this.prevP1={},this.prevP2={},this.startP1={},this.startP2={},this.velocity={},this.Z={},this.F={},this.O=0,this.B=[],this.R="ontouchstart"in window,this.N=!!window.PointerEvent,this.supportsTouch=this.R||this.N&&navigator.maxTouchPoints>1,this.supportsTouch||(t.options.allowPanToNext=!1),this.drag=new x(this),this.zoomLevels=new S(this),this.tapHandler=new P(this),t.on("bindEvents",(()=>{t.events.add(t.scrollWrap,"click",(t=>this.G(t))),this.N?this.V("pointer","down","up","cancel"):this.R?(this.V("touch","start","end","cancel"),t.scrollWrap.ontouchmove=()=>{},t.scrollWrap.ontouchend=()=>{}):this.V("mouse","down","up")}))}V(t,i,s,h){const{pswp:e}=this,{events:n}=e,o=h?t+h:"";n.add(e.scrollWrap,t+i,this.onPointerDown.bind(this)),n.add(window,t+"move",this.onPointerMove.bind(this)),n.add(window,t+s,this.onPointerUp.bind(this)),o&&n.add(e.scrollWrap,o,this.onPointerUp.bind(this))}onPointerDown(t){let s;if("mousedown"!==t.type&&"mouse"!==t.pointerType||(s=!0),s&&t.button>0)return;const{pswp:h}=this;h.opener.isOpen?h.dispatch("pointerDown",{originalEvent:t}).defaultPrevented||(s&&(h.mouseDetected(),this.U(t)),h.animations.stopAll(),this.q(t,"down"),this.pointerDown=!0,1===this.O&&(this.dragAxis=null,i(this.startP1,this.p1)),this.O>1?(this.H(),this.isMultitouch=!0):this.isMultitouch=!1):t.preventDefault()}onPointerMove(t){t.preventDefault(),this.O&&(this.q(t,"move"),this.pswp.dispatch("pointerMove",{originalEvent:t}).defaultPrevented||(1!==this.O||this.isDragging?this.O>1&&!this.isZooming&&(this.K(),this.isZooming=!0,this.W(),this.zoomLevels.start(),this.j(),this.X()):(this.dragAxis||this.Y(),this.dragAxis&&!this.isDragging&&(this.isZooming&&(this.isZooming=!1,this.zoomLevels.end()),this.isDragging=!0,this.H(),this.W(),this.$=Date.now(),this.J=!1,i(this.F,this.p1),this.velocity.x=0,this.velocity.y=0,this.drag.start(),this.j(),this.X()))))}K(){this.isDragging&&(this.isDragging=!1,this.J||this.tt(!0),this.drag.end(),this.dragAxis=null)}onPointerUp(t){this.O&&(this.q(t,"up"),this.pswp.dispatch("pointerUp",{originalEvent:t}).defaultPrevented||(0===this.O&&(this.pointerDown=!1,this.j(),this.isDragging?this.K():this.isZooming||this.isMultitouch||this.it(t)),this.O<2&&this.isZooming&&(this.isZooming=!1,this.zoomLevels.end(),1===this.O&&(this.dragAxis=null,this.W()))))}X(){(this.isDragging||this.isZooming)&&(this.tt(),this.isDragging?e(this.p1,this.prevP1)||this.drag.change():e(this.p1,this.prevP1)&&e(this.p2,this.prevP2)||this.zoomLevels.change(),this.st(),this.raf=requestAnimationFrame(this.X.bind(this)))}tt(t){const s=Date.now(),h=s-this.$;h<50&&!t||(this.velocity.x=this.ht("x",h),this.velocity.y=this.ht("y",h),this.$=s,i(this.F,this.p1),this.J=!0)}it(t){const{mainScroll:s}=this.pswp;if(s.isShifted())return void s.moveIndexBy(0,!0);if(t.type.indexOf("cancel")>0)return;if("mouseup"===t.type||"mouse"===t.pointerType)return void this.tapHandler.click(this.startP1,t);const e=this.pswp.options.doubleTapAction?300:0;this.et?(this.H(),h(this.Z,this.startP1)<25&&this.tapHandler.doubleTap(this.startP1,t)):(i(this.Z,this.startP1),this.et=setTimeout((()=>{this.tapHandler.tap(this.startP1,t),this.H()}),e))}H(){this.et&&(clearTimeout(this.et),this.et=null)}ht(t,i){const s=this.p1[t]-this.F[t];return Math.abs(s)>1&&i>5?s/i:0}j(){this.raf&&(cancelAnimationFrame(this.raf),this.raf=null)}U(t){return t.preventDefault(),!0}q(t,s){if(this.N){const h=this.B.findIndex((i=>i.id===t.pointerId));"up"===s&&h>-1?this.B.splice(h,1):"down"===s&&-1===h?this.B.push(this.nt(t,{})):h>-1&&this.nt(t,this.B[h]),this.O=this.B.length,this.O>0&&i(this.p1,this.B[0]),this.O>1&&i(this.p2,this.B[1])}else this.O=0,t.type.indexOf("touch")>-1?t.touches&&t.touches.length>0&&(this.nt(t.touches[0],this.p1),this.O++,t.touches.length>1&&(this.nt(t.touches[1],this.p2),this.O++)):(this.nt(t,this.p1),"up"===s?this.O=0:this.O++)}st(){i(this.prevP1,this.p1),i(this.prevP2,this.p2)}W(){i(this.startP1,this.p1),i(this.startP2,this.p2),this.st()}Y(){if(this.pswp.mainScroll.isShifted())this.dragAxis="x";else{const t=Math.abs(this.p1.x-this.startP1.x)-Math.abs(this.p1.y-this.startP1.y);if(0!==t){const i=t>0?"x":"y";Math.abs(this.p1[i]-this.startP1[i])>=10&&(this.dragAxis=i)}}}nt(t,i){return i.x=t.pageX-this.pswp.offset.x,i.y=t.pageY-this.pswp.offset.y,void 0!==t.pointerId?i.id=t.pointerId:void 0!==t.identifier&&(i.id=t.identifier),i}G(t){this.pswp.mainScroll.isShifted()&&(t.preventDefault(),t.stopPropagation())}}class T{constructor(t){this.pswp=t,this.x=0,this.resetPosition()}resize(t){const{pswp:i}=this,s=Math.round(i.viewportSize.x+i.viewportSize.x*i.options.spacing),h=s!==this.slideWidth;h&&(this.slideWidth=s,this.moveTo(this.getCurrSlideX())),this.itemHolders.forEach(((i,s)=>{h&&r(i.el,(s+this.ot)*this.slideWidth),t&&i.slide&&i.slide.resize()}))}resetPosition(){this.rt=0,this.at=0,this.slideWidth=0,this.ot=-1}appendHolders(){this.itemHolders=[];for(let i=0;i<3;i++){const s=t("pswp__item",!1,this.pswp.container);s.style.display=1===i?"block":"none",this.itemHolders.push({el:s})}}canBeSwiped(){return this.pswp.getNumItems()>1}moveIndexBy(t,i,s){const{pswp:h}=this;let e=h.potentialIndex+t;const n=h.getNumItems();if(h.canLoop()){e=h.getLoopedIndex(e);const i=(t+n)%n;t=i<=n/2?i:i-n}else e<0?e=0:e>=n&&(e=n-1),t=e-h.potentialIndex;h.potentialIndex=e,this.rt-=t,h.animations.stopMainScroll();const o=this.getCurrSlideX();if(i){h.animations.startSpring({isMainScroll:!0,start:this.x,end:o,velocity:s||0,naturalFrequency:30,dampingRatio:1,onUpdate:t=>{this.moveTo(t)},onComplete:()=>{this.updateCurrItem(),h.appendHeavy()}});let t=h.potentialIndex-h.currIndex;if(h.canLoop()){const i=(t+n)%n;t=i<=n/2?i:i-n}Math.abs(t)>1&&this.updateCurrItem()}else this.moveTo(o),this.updateCurrItem();if(t)return!0}getCurrSlideX(){return this.slideWidth*this.rt}isShifted(){return this.x!==this.getCurrSlideX()}updateCurrItem(){const{pswp:t}=this,i=this.at-this.rt;if(!i)return;this.at=this.rt,t.currIndex=t.potentialIndex;let s,h=Math.abs(i);h>=3&&(this.ot+=i+(i>0?-3:3),h=3);for(let e=0;e<h;e++)i>0?(s=this.itemHolders.shift(),this.itemHolders[2]=s,this.ot++,r(s.el,(this.ot+2)*this.slideWidth),t.setContent(s,t.currIndex-h+e+2)):(s=this.itemHolders.pop(),this.itemHolders.unshift(s),this.ot--,r(s.el,this.ot*this.slideWidth),t.setContent(s,t.currIndex+h-e-2));Math.abs(this.ot)>50&&!this.isShifted()&&(this.resetPosition(),this.resize()),t.animations.stopAllPan(),this.itemHolders.forEach(((t,i)=>{t.slide&&t.slide.setIsActive(1===i)})),t.currSlide=this.itemHolders[1].slide,t.contentLoader.updateLazy(i),t.currSlide.applyCurrentZoomPan(),t.dispatch("change")}moveTo(t,i){let s,h;!this.pswp.canLoop()&&i&&(s=(this.slideWidth*this.rt-t)/this.slideWidth,s+=this.pswp.currIndex,h=Math.round(t-this.x),(s<0&&h>0||s>=this.pswp.getNumItems()-1&&h<0)&&(t=this.x+.35*h)),this.x=t,r(this.pswp.container,t),this.pswp.dispatch("moveMainScroll",{x:t,dragging:i})}}class D{constructor(t){this.pswp=t,t.on("bindEvents",(()=>{t.options.initialPointerPos||this.ct(),t.events.add(document,"focusin",this.lt.bind(this)),t.events.add(document,"keydown",this.ut.bind(this))}));const i=document.activeElement;t.on("destroy",(()=>{t.options.returnFocus&&i&&this.dt&&i.focus()}))}ct(){this.dt||(this.pswp.element.focus(),this.dt=!0)}ut(t){const{pswp:i}=this;if(i.dispatch("keydown",{originalEvent:t}).defaultPrevented)return;if(function(t){if(2===t.which||t.ctrlKey||t.metaKey||t.altKey||t.shiftKey)return!0}(t))return;let s,h,e;switch(t.keyCode){case 27:i.options.escKey&&(s="close");break;case 90:s="toggleZoom";break;case 37:h="x";break;case 38:h="y";break;case 39:h="x",e=!0;break;case 40:e=!0,h="y";break;case 9:this.ct()}if(h){t.preventDefault();const{currSlide:n}=i;i.options.arrowKeys&&"x"===h&&i.getNumItems()>1?s=e?"next":"prev":n&&n.currZoomLevel>n.zoomLevels.fit&&(n.pan[h]+=e?-80:80,n.panTo(n.pan.x,n.pan.y))}s&&(t.preventDefault(),i[s]())}lt(t){const{template:i}=this.pswp;document===t.target||i===t.target||i.contains(t.target)||i.focus()}}class A{constructor(t){this.props=t;const{target:i,onComplete:s,transform:h}=t;let{duration:e,easing:n}=t;const o=h?"transform":"opacity",r=t[o];this.ft=i,this.wt=s,e=e||333,n=n||"cubic-bezier(.4,0,.22,1)",this.gt=this.gt.bind(this),this._t=setTimeout((()=>{a(i,o,e,n),this._t=setTimeout((()=>{i.addEventListener("transitionend",this.gt,!1),i.addEventListener("transitioncancel",this.gt,!1),i.style[o]=r}),30)}),0)}gt(t){t.target===this.ft&&this.vt()}vt(){this.yt||(this.yt=!0,this.onFinish(),this.wt&&this.wt())}destroy(){this._t&&clearTimeout(this._t),a(this.ft),this.ft.removeEventListener("transitionend",this.gt,!1),this.ft.removeEventListener("transitioncancel",this.gt,!1),this.yt||this.vt()}}class I{constructor(t,i,s){this.velocity=1e3*t,this.bt=i||.75,this.xt=s||12,this.bt<1&&(this.Mt=this.xt*Math.sqrt(1-this.bt*this.bt))}easeFrame(t,i){let s,h=0;i/=1e3;const e=Math.E**(-this.bt*this.xt*i);if(1===this.bt)s=this.velocity+this.xt*t,h=(t+s*i)*e,this.velocity=h*-this.xt+s*e;else if(this.bt<1){s=1/this.Mt*(this.bt*this.xt*t+this.velocity);const n=Math.cos(this.Mt*i),o=Math.sin(this.Mt*i);h=e*(t*n+s*o),this.velocity=h*-this.xt*this.bt+e*(-this.Mt*t*o+this.Mt*s*n)}return h}}class E{constructor(t){this.props=t;const{start:i,end:s,velocity:h,onUpdate:e,onComplete:n,onFinish:o,dampingRatio:r,naturalFrequency:a}=t,c=new I(h,r,a);let l=Date.now(),p=i-s;this.St=o;const u=()=>{this.zt&&(p=c.easeFrame(p,Date.now()-l),Math.abs(p)<1&&Math.abs(c.velocity)<50?(e(s),n&&n(),this.onFinish()):(l=Date.now(),e(p+s),this.zt=requestAnimationFrame(u)))};this.zt=requestAnimationFrame(u)}destroy(){this.zt>=0&&cancelAnimationFrame(this.zt),this.zt=null}}class L{constructor(){this.activeAnimations=[]}startSpring(t){this.Pt(t,!0)}startTransition(t){this.Pt(t)}Pt(t,i){let s;return s=i?new E(t):new A(t),this.activeAnimations.push(s),s.onFinish=()=>this.stop(s),s}stop(t){t.destroy();const i=this.activeAnimations.indexOf(t);i>-1&&this.activeAnimations.splice(i,1)}stopAll(){this.activeAnimations.forEach((t=>{t.destroy()})),this.activeAnimations=[]}stopAllPan(){this.activeAnimations=this.activeAnimations.filter((t=>!t.props.isPan||(t.destroy(),!1)))}stopMainScroll(){this.activeAnimations=this.activeAnimations.filter((t=>!t.props.isMainScroll||(t.destroy(),!1)))}isPanRunning(){return this.activeAnimations.some((t=>t.props.isPan))}}class k{constructor(t){this.pswp=t,t.events.add(t.element,"wheel",this.Ct.bind(this))}Ct(t){t.preventDefault();const{currSlide:i}=this.pswp;let{deltaX:s,deltaY:h}=t;if(i&&!this.pswp.dispatch("wheel",{originalEvent:t}).defaultPrevented)if(t.ctrlKey||this.pswp.options.wheelToZoom){if(i.isZoomable()){let s=-h;1===t.deltaMode?s*=.05:s*=t.deltaMode?1:.002,s=2**s;const e=i.currZoomLevel*s;i.zoomTo(e,{x:t.clientX,y:t.clientY})}}else i.isPannable()&&(1===t.deltaMode&&(s*=18,h*=18),i.panTo(i.pan.x-s,i.pan.y-h))}}class Z{constructor(i,s){const h=s.name||s.className;let e=s.html;if(!1===i.options[h])return;"string"==typeof i.options[h+"SVG"]&&(e=i.options[h+"SVG"]),i.dispatch("uiElementCreate",{data:s});let n,o="";s.isButton?(o+="pswp__button ",o+=s.className||`pswp__button--${s.name}`):o+=s.className||`pswp__${s.name}`;let r=s.isButton?s.tagName||"button":s.tagName||"div";if(r=r.toLowerCase(),n=t(o,r),s.isButton){n=t(o,r),"button"===r&&(n.type="button");let{title:e}=s;const{ariaLabel:a}=s;"string"==typeof i.options[h+"Title"]&&(e=i.options[h+"Title"]),e&&(n.title=e),(a||e)&&n.setAttribute("aria-label",a||e)}n.innerHTML=function(t){if("string"==typeof t)return t;if(!t||!t.isCustomSVG)return"";const i=t;let s='<svg aria-hidden="true" class="pswp__icn" viewBox="0 0 %d %d" width="%d" height="%d">';return s=s.split("%d").join(i.size||32),i.outlineID&&(s+='<use class="pswp__icn-shadow" xlink:href="#'+i.outlineID+'"/>'),s+=i.inner,s+="</svg>",s}(e),s.onInit&&s.onInit(n,i),s.onClick&&(n.onclick=t=>{"string"==typeof s.onClick?i[s.onClick]():s.onClick(t,n,i)});const a=s.appendTo||"bar";let c;"bar"===a?(i.topBar||(i.topBar=t("pswp__top-bar pswp__hide-on-close",!1,i.scrollWrap)),c=i.topBar):(n.classList.add("pswp__hide-on-close"),c="wrapper"===a?i.scrollWrap:i.element),c.appendChild(i.applyFilters("uiElement",n,s))}}function F(t,i,s){t.classList.add("pswp__button--arrow"),i.on("change",(()=>{i.options.loop||(t.disabled=s?!(i.currIndex<i.getNumItems()-1):!(i.currIndex>0))}))}const O={name:"arrowPrev",className:"pswp__button--arrow--prev",title:"Previous",order:10,isButton:!0,appendTo:"wrapper",html:{isCustomSVG:!0,size:60,inner:'<path d="M29 43l-3 3-16-16 16-16 3 3-13 13 13 13z" id="pswp__icn-arrow"/>',outlineID:"pswp__icn-arrow"},onClick:"prev",onInit:F},B={name:"arrowNext",className:"pswp__button--arrow--next",title:"Next",order:11,isButton:!0,appendTo:"wrapper",html:{isCustomSVG:!0,size:60,inner:'<use xlink:href="#pswp__icn-arrow"/>',outlineID:"pswp__icn-arrow"},onClick:"next",onInit:(t,i)=>{F(t,i,!0)}},R={name:"close",title:"Close",order:20,isButton:!0,html:{isCustomSVG:!0,inner:'<path d="M24 10l-2-2-6 6-6-6-2 2 6 6-6 6 2 2 6-6 6 6 2-2-6-6z" id="pswp__icn-close"/>',outlineID:"pswp__icn-close"},onClick:"close"},N={name:"zoom",title:"Zoom",order:10,isButton:!0,html:{isCustomSVG:!0,inner:'<path d="M17.426 19.926a6 6 0 1 1 1.5-1.5L23 22.5 21.5 24l-4.074-4.074z" id="pswp__icn-zoom"/><path fill="currentColor" class="pswp__zoom-icn-bar-h" d="M11 16v-2h6v2z"/><path fill="currentColor" class="pswp__zoom-icn-bar-v" d="M13 12h2v6h-2z"/>',outlineID:"pswp__icn-zoom"},onClick:"toggleZoom"},G={name:"preloader",appendTo:"bar",order:7,html:{isCustomSVG:!0,inner:'<path fill-rule="evenodd" clip-rule="evenodd" d="M21.2 16a5.2 5.2 0 1 1-5.2-5.2V8a8 8 0 1 0 8 8h-2.8Z" id="pswp__icn-loading"/>',outlineID:"pswp__icn-loading"},onInit:(t,i)=>{let s,h;const e=i=>{var h,e;s!==i&&(s=i,h="active",e=i,t.classList[e?"add":"remove"]("pswp__preloader--"+h))},n=()=>{if(!i.currSlide.content.isLoading())return e(!1),void(h&&(clearTimeout(h),h=null));h||(h=setTimeout((()=>{e(i.currSlide.content.isLoading()),h=null}),i.options.preloaderDelay))};i.on("change",n),i.on("loadComplete",(t=>{i.currSlide===t.slide&&n()})),i.ui.updatePreloaderVisibility=n}},V={name:"counter",order:5,onInit:(t,i)=>{i.on("change",(()=>{t.innerText=i.currIndex+1+i.options.indexIndicatorSep+i.getNumItems()}))}};function U(t,i){t.classList[i?"add":"remove"]("pswp--zoomed-in")}class q{constructor(t){this.pswp=t}init(){const{pswp:t}=this;this.isRegistered=!1,this.uiElementsData=[R,O,B,N,G,V],t.dispatch("uiRegister"),this.uiElementsData.sort(((t,i)=>(t.order||0)-(i.order||0))),this.items=[],this.isRegistered=!0,this.uiElementsData.forEach((t=>{this.registerElement(t)})),t.on("change",(()=>{t.element.classList[1===t.getNumItems()?"add":"remove"]("pswp--one-slide")})),t.on("zoomPanUpdate",(()=>this.Tt()))}registerElement(t){this.isRegistered?this.items.push(new Z(this.pswp,t)):this.uiElementsData.push(t)}Tt(){const{template:t,currSlide:i,options:s}=this.pswp;let{currZoomLevel:h}=i;if(this.pswp.opener.isClosing)return;if(this.pswp.opener.isOpen||(h=i.zoomLevels.initial),h===this.Dt)return;this.Dt=h;const e=i.zoomLevels.initial-i.zoomLevels.secondary;if(Math.abs(e)<.01||!i.isZoomable())return U(t,!1),void t.classList.remove("pswp--zoom-allowed");t.classList.add("pswp--zoom-allowed");const n=e<0;h===i.zoomLevels.secondary?U(t,n):h>i.zoomLevels.secondary?U(t,!0):U(t,!1),"zoom"!==s.imageClickAction&&"zoom-or-close"!==s.imageClickAction||t.classList.add("pswp--click-to-zoom")}}class H{constructor(t,i){this.type=t,i&&Object.assign(this,i)}preventDefault(){this.defaultPrevented=!0}}class K{constructor(i,s){this.element=t("pswp__img pswp__img--placeholder",i?"img":"",s),i&&(this.element.decoding="async",this.element.alt="",this.element.src=i,this.element.setAttribute("role","presentation")),this.element.setAttribute("aria-hiden","true")}setDisplayedSize(t,i){this.element&&("IMG"===this.element.tagName?(c(this.element,250,"auto"),this.element.style.transformOrigin="0 0",this.element.style.transform=o(0,0,t/250)):c(this.element,t,i))}destroy(){this.element.parentNode&&this.element.remove(),this.element=null}}class W{constructor(t,i,s){this.instance=i,this.data=t,this.index=s,this.width=Number(this.data.w)||Number(this.data.width)||0,this.height=Number(this.data.h)||Number(this.data.height)||0,this.isAttached=!1,this.hasSlide=!1,this.state=l,this.data.type?this.type=this.data.type:this.data.src?this.type="image":this.type="html",this.instance.dispatch("contentInit",{content:this})}removePlaceholder(){this.placeholder&&!this.keepPlaceholder()&&setTimeout((()=>{this.placeholder&&(this.placeholder.destroy(),this.placeholder=null)}),500)}load(i,s){if(!this.placeholder&&this.slide&&this.usePlaceholder()){const t=this.instance.applyFilters("placeholderSrc",!(!this.data.msrc||!this.slide.isFirstSlide)&&this.data.msrc,this);this.placeholder=new K(t,this.slide.container)}this.element&&!s||this.instance.dispatch("contentLoad",{content:this,isLazy:i}).defaultPrevented||(this.isImageContent()?this.loadImage(i):(this.element=t("pswp__content"),this.element.innerHTML=this.data.html||""),s&&this.slide&&this.slide.updateContentSize(!0))}loadImage(i){this.element=t("pswp__img","img"),this.instance.dispatch("contentLoadImage",{content:this,isLazy:i}).defaultPrevented||(this.data.srcset&&(this.element.srcset=this.data.srcset),this.element.src=this.data.src,this.element.alt=this.data.alt||"",this.state=p,this.element.complete?this.onLoaded():(this.element.onload=()=>{this.onLoaded()},this.element.onerror=()=>{this.onError()}))}setSlide(t){this.slide=t,this.hasSlide=!0,this.instance=t.pswp}onLoaded(){this.state=u,this.slide&&(this.instance.dispatch("loadComplete",{slide:this.slide,content:this}),this.slide.isActive&&this.slide.heavyAppended&&!this.element.parentNode&&(this.slide.container.innerHTML="",this.append(),this.slide.updateContentSize(!0)))}onError(){this.state=d,this.slide&&(this.displayError(),this.instance.dispatch("loadComplete",{slide:this.slide,isError:!0,content:this}),this.instance.dispatch("loadError",{slide:this.slide,content:this}))}isLoading(){return this.instance.applyFilters("isContentLoading",this.state===p,this)}isError(){return this.state===d}isImageContent(){return"image"===this.type}setDisplayedSize(t,i){if(this.element&&(this.placeholder&&this.placeholder.setDisplayedSize(t,i),!this.instance.dispatch("contentResize",{content:this,width:t,height:i}).defaultPrevented&&(c(this.element,t,i),this.isImageContent()&&!this.isError()))){const s=this.element;s.srcset&&(!s.dataset.largestUsedSize||t>s.dataset.largestUsedSize)&&(s.sizes=t+"px",s.dataset.largestUsedSize=t),this.slide&&this.instance.dispatch("imageSizeChange",{slide:this.slide,width:t,height:i,content:this})}}isZoomable(){return this.instance.applyFilters("isContentZoomable",this.isImageContent()&&this.state!==d,this)}usePlaceholder(){return this.instance.applyFilters("useContentPlaceholder",this.isImageContent(),this)}lazyLoad(){this.instance.dispatch("contentLazyLoad",{content:this}).defaultPrevented||this.load(!0)}keepPlaceholder(){return this.instance.applyFilters("isKeepingPlaceholder",this.isLoading(),this)}destroy(){this.hasSlide=!1,this.slide=null,this.instance.dispatch("contentDestroy",{content:this}).defaultPrevented||(this.remove(),this.isImageContent()&&this.element&&(this.element.onload=null,this.element.onerror=null,this.element=null))}displayError(){if(this.slide){let i=t("pswp__error-msg");i.innerText=this.instance.options.errorMsg,i=this.instance.applyFilters("contentErrorElement",i,this),this.element=t("pswp__content pswp__error-msg-container"),this.element.appendChild(i),this.slide.container.innerHTML="",this.slide.container.appendChild(this.element),this.slide.updateContentSize(!0),this.removePlaceholder()}}append(){this.isAttached=!0,this.state!==d?this.instance.dispatch("contentAppend",{content:this}).defaultPrevented||(this.isImageContent()?this.slide&&!this.slide.isActive&&"decode"in this.element?(this.isDecoding=!0,requestAnimationFrame((()=>{this.element&&"IMG"===this.element.tagName&&this.element.decode().then((()=>{this.isDecoding=!1,requestAnimationFrame((()=>{this.appendImage()}))})).catch((()=>{this.isDecoding=!1}))}))):(!this.placeholder||this.state!==u&&this.state!==d||this.removePlaceholder(),this.appendImage()):this.element&&!this.element.parentNode&&this.slide.container.appendChild(this.element)):this.displayError()}activate(){this.instance.dispatch("contentActivate",{content:this}).defaultPrevented||this.slide&&(this.isImageContent()&&this.isDecoding?this.appendImage():this.isError()&&this.load(!1,!0))}deactivate(){this.instance.dispatch("contentDeactivate",{content:this})}remove(){this.isAttached=!1,this.instance.dispatch("contentRemove",{content:this}).defaultPrevented||this.element&&this.element.parentNode&&this.element.remove()}appendImage(){this.isAttached&&(this.instance.dispatch("contentAppendImage",{content:this}).defaultPrevented||this.slide&&this.element&&!this.element.parentNode&&(this.slide.container.appendChild(this.element),!this.placeholder||this.state!==u&&this.state!==d||this.removePlaceholder()))}}class j{constructor(t){this.pswp=t,this.isClosed=!0,this.At=this.At.bind(this),t.on("firstZoomPan",this.At)}open(){this.At(),this.Pt()}close(){if(this.isClosed||this.isClosing||this.isOpening)return!1;const t=this.pswp.currSlide;return this.isOpen=!1,this.isOpening=!1,this.isClosing=!0,this.It=this.pswp.options.hideAnimationDuration,t&&t.currZoomLevel*t.width>=this.pswp.options.maxWidthToAnimate&&(this.It=0),this.Et(),setTimeout((()=>{this.Pt()}),this.Lt?30:0),!0}At(){if(this.pswp.off("firstZoomPan",this.At),!this.isOpening){const t=this.pswp.currSlide;this.isOpening=!0,this.isClosing=!1,this.It=this.pswp.options.showAnimationDuration,t&&t.zoomLevels.initial*t.width>=this.pswp.options.maxWidthToAnimate&&(this.It=0),this.Et()}}Et(){const{pswp:t}=this,i=this.pswp.currSlide,{options:s}=t;if("fade"===s.showHideAnimationType?(s.showHideOpacity=!0,this.kt=!1):"none"===s.showHideAnimationType?(s.showHideOpacity=!1,this.It=0,this.kt=!1):this.isOpening&&t.Zt?this.kt=t.Zt:this.kt=this.pswp.getThumbBounds(),this.Ft=i.getPlaceholderElement(),t.animations.stopAll(),this.Ot=this.It>50,this.Bt=Boolean(this.kt)&&i.content&&i.content.usePlaceholder()&&(!this.isClosing||!t.mainScroll.isShifted()),this.Bt?this.Rt=s.showHideOpacity:(this.Rt=!0,this.isOpening&&(i.zoomAndPanToInitial(),i.applyCurrentZoomPan())),this.Nt=!this.Rt&&this.pswp.options.bgOpacity>.003,this.Gt=this.Rt?t.element:t.bg,!this.Ot)return this.It=0,this.Bt=!1,this.Nt=!1,this.Rt=!0,void(this.isOpening&&(t.element.style.opacity=.003,t.applyBgOpacity(1)));this.Bt&&this.kt.innerRect?(this.Lt=!0,this.Vt=this.pswp.container,this.Ut=this.pswp.currSlide.holderElement,t.container.style.overflow="hidden",t.container.style.width=t.viewportSize.x+"px"):this.Lt=!1,this.isOpening?(this.Rt?(t.element.style.opacity=.003,t.applyBgOpacity(1)):(this.Nt&&(t.bg.style.opacity=.003),t.element.style.opacity=1),this.Bt&&(this.qt(),this.Ft&&(this.Ft.willChange="transform",this.Ft.style.opacity=.003))):this.isClosing&&(t.mainScroll.itemHolders[0].el.style.display="none",t.mainScroll.itemHolders[2].el.style.display="none",this.Lt&&0!==t.mainScroll.x&&(t.mainScroll.resetPosition(),t.mainScroll.resize()))}Pt(){this.isOpening&&this.Ot&&this.Ft&&"IMG"===this.Ft.tagName?new Promise((t=>{let i=!1,s=!0;var h;(h=this.Ft,"decode"in h?h.decode():h.complete?Promise.resolve(h):new Promise(((t,i)=>{h.onload=()=>t(h),h.onerror=i}))).finally((()=>{i=!0,s||t()})),setTimeout((()=>{s=!1,i&&t()}),50),setTimeout(t,250)})).finally((()=>this.Ht())):this.Ht()}Ht(){this.pswp.element.style.setProperty("--pswp-transition-duration",this.It+"ms"),this.pswp.dispatch(this.isOpening?"openingAnimationStart":"closingAnimationStart"),this.pswp.dispatch("initialZoom"+(this.isOpening?"In":"Out")),this.pswp.element.classList[this.isOpening?"add":"remove"]("pswp--ui-visible"),this.isOpening?(this.Ft&&(this.Ft.style.opacity=1),this.Kt()):this.isClosing&&this.Wt(),this.Ot||this.jt()}jt(){const{pswp:t}=this;this.isOpen=this.isOpening,this.isClosed=this.isClosing,this.isOpening=!1,this.isClosing=!1,t.dispatch(this.isOpen?"openingAnimationEnd":"closingAnimationEnd"),t.dispatch("initialZoom"+(this.isOpen?"InEnd":"OutEnd")),this.isClosed?t.destroy():this.isOpen&&(this.Bt&&(t.container.style.overflow="visible",t.container.style.width="100%"),t.currSlide.applyCurrentZoomPan())}Kt(){const{pswp:t}=this;this.Bt&&(this.Lt&&(this.Xt(this.Vt,"transform","translate3d(0,0,0)"),this.Xt(this.Ut,"transform","none")),t.currSlide.zoomAndPanToInitial(),this.Xt(t.currSlide.container,"transform",t.currSlide.getCurrentTransform())),this.Nt&&this.Xt(t.bg,"opacity",t.options.bgOpacity),this.Rt&&this.Xt(t.element,"opacity",1)}Wt(){const{pswp:t}=this;this.Bt&&this.qt(!0),this.Nt&&t.bgOpacity>.01&&this.Xt(t.bg,"opacity",0),this.Rt&&this.Xt(t.element,"opacity",0)}qt(t){const{pswp:s}=this,{innerRect:h}=this.kt,{currSlide:e,viewportSize:n}=s;if(this.Lt){const i=-n.x+(this.kt.x-h.x)+h.w,s=-n.y+(this.kt.y-h.y)+h.h,e=n.x-h.w,a=n.y-h.h;t?(this.Xt(this.Vt,"transform",o(i,s)),this.Xt(this.Ut,"transform",o(e,a))):(r(this.Vt,i,s),r(this.Ut,e,a))}i(e.pan,h||this.kt),e.currZoomLevel=this.kt.w/e.width,t?this.Xt(e.container,"transform",e.getCurrentTransform()):e.applyCurrentZoomPan()}Xt(t,i,s){if(!this.It)return void(t.style[i]=s);const{animations:h}=this.pswp,e={duration:this.It,easing:this.pswp.options.easing,onComplete:()=>{h.activeAnimations.length||this.jt()},target:t};e[i]=s,h.startTransition(e)}}function X(t,i){const s=i.getItemData(t);if(!i.dispatch("lazyLoadSlide",{index:t,itemData:s}).defaultPrevented)return function(t,i,s){const h=i.createContentFromData(t,s);if(!h||!h.lazyLoad)return;const{options:e}=i,n=_(e,i.viewportSize||w(e),t,s),o=new y(e,t,-1);return o.update(h.width,h.height,n),h.lazyLoad(),h.setDisplayedSize(Math.ceil(h.width*o.initial),Math.ceil(h.height*o.initial)),h}(s,i,t)}class Y{constructor(t){this.pswp=t,this.limit=Math.max(t.options.preload[0]+t.options.preload[1]+1,5),this.Yt=[]}updateLazy(t){const{pswp:i}=this;if(i.dispatch("lazyLoad").defaultPrevented)return;const{preload:s}=i.options,h=void 0===t||t>=0;let e;for(e=0;e<=s[1];e++)this.loadSlideByIndex(i.currIndex+(h?e:-e));for(e=1;e<=s[0];e++)this.loadSlideByIndex(i.currIndex+(h?-e:e))}loadSlideByIndex(t){t=this.pswp.getLoopedIndex(t);let i=this.getContentByIndex(t);i||(i=X(t,this.pswp),i&&this.addToCache(i))}getContentBySlide(t){let i=this.getContentByIndex(t.index);return i||(i=this.pswp.createContentFromData(t.data,t.index),i&&this.addToCache(i)),i&&i.setSlide(t),i}addToCache(t){if(this.removeByIndex(t.index),this.Yt.push(t),this.Yt.length>this.limit){const t=this.Yt.findIndex((t=>!t.isAttached&&!t.hasSlide));if(-1!==t){this.Yt.splice(t,1)[0].destroy()}}}removeByIndex(t){const i=this.Yt.findIndex((i=>i.index===t));-1!==i&&this.Yt.splice(i,1)}getContentByIndex(t){return this.Yt.find((i=>i.index===t))}destroy(){this.Yt.forEach((t=>t.destroy())),this.Yt=null}}const $={allowPanToNext:!0,spacing:.1,loop:!0,pinchToClose:!0,closeOnVerticalDrag:!0,hideAnimationDuration:333,showAnimationDuration:333,zoomAnimationDuration:333,escKey:!0,arrowKeys:!0,returnFocus:!0,maxWidthToAnimate:4e3,clickToCloseNonZoomable:!0,imageClickAction:"zoom-or-close",bgClickAction:"close",tapAction:"toggle-controls",doubleTapAction:"zoom",indexIndicatorSep:" / ",preloaderDelay:2e3,bgOpacity:.8,index:0,errorMsg:"The image cannot be loaded",preload:[1,2],easing:"cubic-bezier(.4,0,.22,1)"};export default class extends class extends class{constructor(){this.$t={},this.Jt={}}addFilter(t,i,s=100){this.Jt[t]||(this.Jt[t]=[]),this.Jt[t].push({fn:i,priority:s}),this.Jt[t].sort(((t,i)=>t.priority-i.priority)),this.pswp&&this.pswp.addFilter(t,i,s)}removeFilter(t,i){this.Jt[t]&&(this.Jt[t]=this.Jt[t].filter((t=>t.fn!==i))),this.pswp&&this.pswp.removeFilter(t,i)}applyFilters(t,...i){return this.Jt[t]&&this.Jt[t].forEach((t=>{i[0]=t.fn.apply(this,i)})),i[0]}on(t,i){this.$t[t]||(this.$t[t]=[]),this.$t[t].push(i),this.pswp&&this.pswp.on(t,i)}off(t,i){this.$t[t]&&(this.$t[t]=this.$t[t].filter((t=>i!==t))),this.pswp&&this.pswp.off(t,i)}dispatch(t,i){if(this.pswp)return this.pswp.dispatch(t,i);const s=new H(t,i);return this.$t?(this.$t[t]&&this.$t[t].forEach((t=>{t.call(this,s)})),s):s}}{getNumItems(){let t;const{dataSource:i}=this.options;i?i.length?t=i.length:i.gallery&&(i.items||(i.items=this.Qt(i.gallery)),i.items&&(t=i.items.length)):t=0;const s=this.dispatch("numItems",{dataSource:i,numItems:t});return this.applyFilters("numItems",s.numItems,i)}createContentFromData(t,i){return new W(t,this,i)}getItemData(t){const{dataSource:i}=this.options;let s;Array.isArray(i)?s=i[t]:i&&i.gallery&&(i.items||(i.items=this.Qt(i.gallery)),s=i.items[t]);let h=s;h instanceof Element&&(h=this.ti(h));const e=this.dispatch("itemData",{itemData:h||{},index:t});return this.applyFilters("itemData",e.itemData,t)}Qt(t){return this.options.children||this.options.childSelector?function(t,i,s=document){let h=[];if(t instanceof Element)h=[t];else if(t instanceof NodeList||Array.isArray(t))h=Array.from(t);else{const e="string"==typeof t?t:i;e&&(h=Array.from(s.querySelectorAll(e)))}return h}(this.options.children,this.options.childSelector,t)||[]:[t]}ti(t){const i={element:t},s="A"===t.tagName?t:t.querySelector("a");if(s){i.src=s.dataset.pswpSrc||s.href,s.dataset.pswpSrcset&&(i.srcset=s.dataset.pswpSrcset),i.width=parseInt(s.dataset.pswpWidth,10),i.height=parseInt(s.dataset.pswpHeight,10),i.w=i.width,i.h=i.height,s.dataset.pswpType&&(i.type=s.dataset.pswpType);const h=t.querySelector("img");h&&(i.msrc=h.currentSrc||h.src,i.alt=h.getAttribute("alt")),(s.dataset.pswpCropped||s.dataset.cropped)&&(i.thumbCropped=!0)}return this.applyFilters("domItemData",i,t,s),i}}{constructor(t){super(),this.ii(t),this.offset={},this.si={},this.viewportSize={},this.bgOpacity=1,this.events=new f,this.animations=new L,this.mainScroll=new T(this),this.gestures=new C(this),this.opener=new j(this),this.keyboard=new D(this),this.contentLoader=new Y(this)}init(){if(this.isOpen||this.isDestroying)return;this.isOpen=!0,this.dispatch("init"),this.dispatch("beforeOpen"),this.hi();let t="pswp--open";return this.gestures.supportsTouch&&(t+=" pswp--touch"),this.options.mainClass&&(t+=" "+this.options.mainClass),this.element.className+=" "+t,this.currIndex=this.options.index||0,this.potentialIndex=this.currIndex,this.dispatch("firstUpdate"),this.scrollWheel=new k(this),(Number.isNaN(this.currIndex)||this.currIndex<0||this.currIndex>=this.getNumItems())&&(this.currIndex=0),this.gestures.supportsTouch||this.mouseDetected(),this.updateSize(),this.offset.y=window.pageYOffset,this.ei=this.getItemData(this.currIndex),this.dispatch("gettingData",this.currIndex,this.ei,!0),this.Zt=this.getThumbBounds(),this.dispatch("initialLayout"),this.on("openingAnimationEnd",(()=>{this.setContent(this.mainScroll.itemHolders[0],this.currIndex-1),this.setContent(this.mainScroll.itemHolders[2],this.currIndex+1),this.mainScroll.itemHolders[0].el.style.display="block",this.mainScroll.itemHolders[2].el.style.display="block",this.appendHeavy(),this.contentLoader.updateLazy(),this.events.add(window,"resize",this.ni.bind(this)),this.events.add(window,"scroll",this.oi.bind(this)),this.dispatch("bindEvents")})),this.setContent(this.mainScroll.itemHolders[1],this.currIndex),this.dispatch("change"),this.opener.open(),this.dispatch("afterInit"),!0}getLoopedIndex(t){const i=this.getNumItems();return this.options.loop&&(t>i-1&&(t-=i),t<0&&(t+=i)),t=n(t,0,i-1)}appendHeavy(){this.mainScroll.itemHolders.forEach((t=>{t.slide&&t.slide.appendHeavy()}))}goTo(t){this.mainScroll.moveIndexBy(this.getLoopedIndex(t)-this.potentialIndex)}next(){this.goTo(this.potentialIndex+1)}prev(){this.goTo(this.potentialIndex-1)}zoomTo(...t){this.currSlide.zoomTo(...t)}toggleZoom(){this.currSlide.toggleZoom()}close(){this.opener.isOpen&&!this.isDestroying&&(this.isDestroying=!0,this.dispatch("close"),this.events.removeAll(),this.opener.close())}destroy(){if(!this.isDestroying)return this.options.showHideAnimationType="none",void this.close();this.dispatch("destroy"),this.listeners=null,this.scrollWrap.ontouchmove=null,this.scrollWrap.ontouchend=null,this.element.remove(),this.mainScroll.itemHolders.forEach((t=>{t.slide&&t.slide.destroy()})),this.contentLoader.destroy(),this.events.removeAll()}refreshSlideContent(t){this.contentLoader.removeByIndex(t),this.mainScroll.itemHolders.forEach(((i,s)=>{let h=this.currSlide.index-1+s;this.canLoop()&&(h=this.getLoopedIndex(h)),h===t&&(this.setContent(i,t,!0),1===s&&(this.currSlide=i.slide,i.slide.setIsActive(!0)))})),this.dispatch("change")}setContent(t,i,s){if(this.canLoop()&&(i=this.getLoopedIndex(i)),t.slide){if(t.slide.index===i&&!s)return;t.slide.destroy(),t.slide=null}if(!this.canLoop()&&(i<0||i>=this.getNumItems()))return;const h=this.getItemData(i);t.slide=new b(h,i,this),i===this.currIndex&&(this.currSlide=t.slide),t.slide.append(t.el)}getViewportCenterPoint(){return{x:this.viewportSize.x/2,y:this.viewportSize.y/2}}updateSize(t){if(this.isDestroying)return;const s=w(this.options,this);!t&&e(s,this.si)||(i(this.si,s),this.dispatch("beforeResize"),i(this.viewportSize,this.si),this.oi(),this.dispatch("viewportSize"),this.mainScroll.resize(this.opener.isOpen),!this.hasMouse&&window.matchMedia("(any-hover: hover)").matches&&this.mouseDetected(),this.dispatch("resize"))}applyBgOpacity(t){this.bgOpacity=Math.max(t,0),this.bg.style.opacity=this.bgOpacity*this.options.bgOpacity}mouseDetected(){this.hasMouse||(this.hasMouse=!0,this.element.classList.add("pswp--has_mouse"))}ni(){this.updateSize(),/iPhone|iPad|iPod/i.test(window.navigator.userAgent)&&setTimeout((()=>{this.updateSize()}),500)}oi(){this.setScrollOffset(0,window.pageYOffset)}setScrollOffset(t,i){this.offset.x=t,this.offset.y=i,this.dispatch("updateScrollOffset")}hi(){this.element=t("pswp"),this.element.setAttribute("tabindex",-1),this.element.setAttribute("role","dialog"),this.template=this.element,this.bg=t("pswp__bg",!1,this.element),this.scrollWrap=t("pswp__scroll-wrap",!1,this.element),this.container=t("pswp__container",!1,this.scrollWrap),this.mainScroll.appendHolders(),this.ui=new q(this),this.ui.init(),(this.options.appendToEl||document.body).appendChild(this.element)}getThumbBounds(){return function(t,i,s){const h=s.dispatch("thumbBounds",{index:t,itemData:i,instance:s});if(h.thumbBounds)return h.thumbBounds;const{element:e}=i;let n,o;if(e&&!1!==s.options.thumbSelector){const t=s.options.thumbSelector||"img";o=e.matches(t)?e:e.querySelector(t)}return o=s.applyFilters("thumbEl",o,i,t),o&&(n=i.thumbCropped?function(t,i,s){const h=t.getBoundingClientRect(),e=h.width/i,n=h.height/s,o=e>n?e:n,r=(h.width-i*o)/2,a=(h.height-s*o)/2,c={x:h.left+r,y:h.top+a,w:i*o};return c.innerRect={w:h.width,h:h.height,x:r,y:a},c}(o,i.w,i.h):function(t){const i=t.getBoundingClientRect();return{x:i.left,y:i.top,w:i.width}}(o)),s.applyFilters("thumbBounds",n,i,t)}(this.currIndex,this.currSlide?this.currSlide.data:this.ei,this)}canLoop(){return this.options.loop&&this.getNumItems()>2}ii(t){window.matchMedia("(prefers-reduced-motion), (update: slow)").matches&&(t.showHideAnimationType="none",t.zoomAnimationDuration=0),this.options={...$,...t}}} | ||
| function t(t,i,s){const h=document.createElement(i||"div");return t&&(h.className=t),s&&s.appendChild(h),h}function i(t,i){return t.x=i.x,t.y=i.y,void 0!==i.id&&(t.id=i.id),t}function s(t){t.x=Math.round(t.x),t.y=Math.round(t.y)}function h(t,i){const s=Math.abs(t.x-i.x),h=Math.abs(t.y-i.y);return Math.sqrt(s*s+h*h)}function e(t,i){return t.x===i.x&&t.y===i.y}function n(t,i,s){return Math.min(Math.max(t,i),s)}function o(t,i,s){let h="translate3d("+t+"px,"+(i||0)+"px,0)";return void 0!==s&&(h+=" scale3d("+s+","+s+",1)"),h}function r(t,i,s,h){t.style.transform=o(i,s,h)}function a(t,i,s,h){t.style.transition=i?i+" "+s+"ms "+(h||"cubic-bezier(.4,0,.22,1)"):"none"}function c(t,i,s){t.style.width="number"==typeof i?i+"px":i,t.style.height="number"==typeof s?s+"px":s}const l="idle",p="loading",u="loaded",d="error";let m=!1;try{window.addEventListener("test",null,Object.defineProperty({},"passive",{get:()=>{m=!0}}))}catch(t){}class f{constructor(){this.t=[]}add(t,i,s,h){this.i(t,i,s,h)}remove(t,i,s,h){this.i(t,i,s,h,!0)}removeAll(){this.t.forEach((t=>{this.i(t.target,t.type,t.listener,t.passive,!0,!0)})),this.t=[]}i(t,i,s,h,e,n){if(!t)return;const o=e?"removeEventListener":"addEventListener";i.split(" ").forEach((i=>{if(i){n||(e?this.t=this.t.filter((h=>h.type!==i||h.listener!==s||h.target!==t)):this.t.push({target:t,type:i,listener:s,passive:h}));const r=!!m&&{passive:h||!1};t[o](i,s,r)}}))}}function w(t,i){if(t.getViewportSizeFn){const s=t.getViewportSizeFn(t,i);if(s)return s}return{x:document.documentElement.clientWidth,y:window.innerHeight}}function g(t,i,s,h,e){let n;if(i.paddingFn)n=i.paddingFn(s,h,e)[t];else if(i.padding)n=i.padding[t];else{const s="padding"+t[0].toUpperCase()+t.slice(1);i[s]&&(n=i[s])}return n||0}function _(t,i,s,h){return{x:i.x-g("left",t,i,s,h)-g("right",t,i,s,h),y:i.y-g("top",t,i,s,h)-g("bottom",t,i,s,h)}}class v{constructor(t){this.slide=t,this.currZoomLevel=1,this.center={},this.max={},this.min={},this.reset()}update(t){this.currZoomLevel=t,this.slide.width?(this.o("x"),this.o("y"),this.slide.pswp.dispatch("calcBounds",{slide:this.slide})):this.reset()}o(t){const{pswp:i}=this.slide,s=this.slide["x"===t?"width":"height"]*this.currZoomLevel,h=g("x"===t?"left":"top",i.options,i.viewportSize,this.slide.data,this.slide.index),e=this.slide.panAreaSize[t];this.center[t]=Math.round((e-s)/2)+h,this.max[t]=s>e?Math.round(e-s)+h:this.center[t],this.min[t]=s>e?h:this.center[t]}reset(){this.center.x=0,this.center.y=0,this.max.x=0,this.max.y=0,this.min.x=0,this.min.y=0}correctPan(t,i){return n(i,this.max[t],this.min[t])}}class y{constructor(t,i,s,h){this.pswp=h,this.options=t,this.itemData=i,this.index=s}update(t,i,s){this.elementSize={x:t,y:i},this.panAreaSize=s;const h=this.panAreaSize.x/this.elementSize.x,e=this.panAreaSize.y/this.elementSize.y;this.fit=Math.min(1,h<e?h:e),this.fill=Math.min(1,h>e?h:e),this.vFill=Math.min(1,e),this.initial=this.l(),this.secondary=this.p(),this.max=Math.max(this.initial,this.secondary,this.u()),this.min=Math.min(this.fit,this.initial,this.secondary),this.pswp&&this.pswp.dispatch("zoomLevelsUpdate",{zoomLevels:this,slideData:this.itemData})}m(t){const i=t+"ZoomLevel",s=this.options[i];if(s)return"function"==typeof s?s(this):"fill"===s?this.fill:"fit"===s?this.fit:Number(s)}p(){let t=this.m("secondary");return t||(t=Math.min(1,3*this.fit),t*this.elementSize.x>4e3&&(t=4e3/this.elementSize.x),t)}l(){return this.m("initial")||this.fit}u(){const t=this.m("max");return t||Math.max(1,4*this.fit)}}class b{constructor(i,s,h){this.data=i,this.index=s,this.pswp=h,this.isActive=s===h.currIndex,this.currentResolution=0,this.panAreaSize={},this.isFirstSlide=this.isActive&&!h.opener.isOpen,this.zoomLevels=new y(h.options,i,s,h),this.pswp.dispatch("gettingData",{slide:this,data:this.data,index:s}),this.pan={x:0,y:0},this.content=this.pswp.contentLoader.getContentBySlide(this),this.container=t("pswp__zoom-wrap"),this.currZoomLevel=1,this.width=this.content.width,this.height=this.content.height,this.bounds=new v(this),this.prevDisplayedWidth=-1,this.prevDisplayedHeight=-1,this.pswp.dispatch("slideInit",{slide:this})}setIsActive(t){t&&!this.isActive?this.activate():!t&&this.isActive&&this.deactivate()}append(t){this.holderElement=t,this.data?(this.calculateSize(),this.container.style.transformOrigin="0 0",this.load(),this.appendHeavy(),this.updateContentSize(),this.holderElement.innerHTML="",this.holderElement.appendChild(this.container),this.zoomAndPanToInitial(),this.pswp.dispatch("firstZoomPan",{slide:this}),this.applyCurrentZoomPan(),this.pswp.dispatch("afterSetContent",{slide:this}),this.isActive&&this.activate()):this.holderElement.innerHTML=""}load(){this.content.load(),this.pswp.dispatch("slideLoad",{slide:this})}appendHeavy(){const{pswp:t}=this;!this.heavyAppended&&t.opener.isOpen&&!t.mainScroll.isShifted()&&(this.isActive,1)&&(this.pswp.dispatch("appendHeavy",{slide:this}).defaultPrevented||(this.heavyAppended=!0,this.content.append(),this.pswp.dispatch("appendHeavyContent",{slide:this})))}activate(){this.isActive=!0,this.appendHeavy(),this.content.activate(),this.pswp.dispatch("slideActivate",{slide:this})}deactivate(){this.isActive=!1,this.content.deactivate(),this.currentResolution=0,this.zoomAndPanToInitial(),this.applyCurrentZoomPan(),this.updateContentSize(),this.pswp.dispatch("slideDeactivate",{slide:this})}destroy(){this.content.hasSlide=!1,this.content.remove(),this.pswp.dispatch("slideDestroy",{slide:this})}resize(){this.currZoomLevel!==this.zoomLevels.initial&&this.isActive?(this.calculateSize(),this.bounds.update(this.currZoomLevel),this.panTo(this.pan.x,this.pan.y)):(this.calculateSize(),this.currentResolution=0,this.zoomAndPanToInitial(),this.applyCurrentZoomPan(),this.updateContentSize())}updateContentSize(t){const i=this.currentResolution||this.zoomLevels.initial;if(!i)return;const s=Math.round(this.width*i)||this.pswp.viewportSize.x,h=Math.round(this.height*i)||this.pswp.viewportSize.y;(this.sizeChanged(s,h)||t)&&this.content.setDisplayedSize(s,h)}sizeChanged(t,i){return(t!==this.prevDisplayedWidth||i!==this.prevDisplayedHeight)&&(this.prevDisplayedWidth=t,this.prevDisplayedHeight=i,!0)}getPlaceholderElement(){if(this.content.placeholder)return this.content.placeholder.element}zoomTo(t,i,h,e){const{pswp:o}=this;if(!this.isZoomable()||o.mainScroll.isShifted())return;o.dispatch("beforeZoomTo",{destZoomLevel:t,centerPoint:i,transitionDuration:h}),o.animations.stopAllPan();const r=this.currZoomLevel;e||(t=n(t,this.zoomLevels.min,this.zoomLevels.max)),this.setZoomLevel(t),this.pan.x=this.calculateZoomToPanOffset("x",i,r),this.pan.y=this.calculateZoomToPanOffset("y",i,r),s(this.pan);const a=()=>{this.g(t),this.applyCurrentZoomPan()};h?o.animations.startTransition({isPan:!0,name:"zoomTo",target:this.container,transform:this.getCurrentTransform(),onComplete:a,duration:h,easing:o.options.easing}):a()}toggleZoom(t){this.zoomTo(this.currZoomLevel===this.zoomLevels.initial?this.zoomLevels.secondary:this.zoomLevels.initial,t,this.pswp.options.zoomAnimationDuration)}setZoomLevel(t){this.currZoomLevel=t,this.bounds.update(this.currZoomLevel)}calculateZoomToPanOffset(t,i,s){if(0===this.bounds.max[t]-this.bounds.min[t])return this.bounds.center[t];i||(i=this.pswp.getViewportCenterPoint());const h=this.currZoomLevel/s;return this.bounds.correctPan(t,(this.pan[t]-i[t])*h+i[t])}panTo(t,i){this.pan.x=this.bounds.correctPan("x",t),this.pan.y=this.bounds.correctPan("y",i),this.applyCurrentZoomPan()}isPannable(){return this.width&&this.currZoomLevel>this.zoomLevels.fit}isZoomable(){return this.width&&this.content.isZoomable()}applyCurrentZoomPan(){this._(this.pan.x,this.pan.y,this.currZoomLevel),this===this.pswp.currSlide&&this.pswp.dispatch("zoomPanUpdate",{slide:this})}zoomAndPanToInitial(){this.currZoomLevel=this.zoomLevels.initial,this.bounds.update(this.currZoomLevel),i(this.pan,this.bounds.center),this.pswp.dispatch("initialZoomPan",{slide:this})}_(t,i,s){s/=this.currentResolution||this.zoomLevels.initial,r(this.container,t,i,s)}calculateSize(){const{pswp:t}=this;i(this.panAreaSize,_(t.options,t.viewportSize,this.data,this.index)),this.zoomLevels.update(this.width,this.height,this.panAreaSize),t.dispatch("calcSlideSize",{slide:this})}getCurrentTransform(){const t=this.currZoomLevel/(this.currentResolution||this.zoomLevels.initial);return o(this.pan.x,this.pan.y,t)}g(t){t!==this.currentResolution&&(this.currentResolution=t,this.updateContentSize(),this.pswp.dispatch("resolutionChanged"))}}class x{constructor(t){this.gestures=t,this.pswp=t.pswp,this.startPan={}}start(){i(this.startPan,this.pswp.currSlide.pan),this.pswp.animations.stopAll()}change(){const{p1:t,prevP1:i,dragAxis:h,pswp:e}=this.gestures,{currSlide:n}=e;if("y"===h&&e.options.closeOnVerticalDrag&&n.currZoomLevel<=n.zoomLevels.fit&&!this.gestures.isMultitouch){const s=n.pan.y+(t.y-i.y);if(!e.dispatch("verticalDrag",{panY:s}).defaultPrevented){this.v("y",s,.6);const t=1-Math.abs(this.S(n.pan.y));e.applyBgOpacity(t),n.applyCurrentZoomPan()}}else{this.M("x")||(this.M("y"),s(n.pan),n.applyCurrentZoomPan())}}end(){const{pswp:t,velocity:i}=this.gestures,{mainScroll:s}=t;let h=0;if(t.animations.stopAll(),s.isShifted()){const e=(s.x-s.getCurrSlideX())/t.viewportSize.x;i.x<-.5&&e<0||i.x<.1&&e<-.5?(h=1,i.x=Math.min(i.x,0)):(i.x>.5&&e>0||i.x>-.1&&e>.5)&&(h=-1,i.x=Math.max(i.x,0)),s.moveIndexBy(h,!0,i.x)}t.currSlide.currZoomLevel>t.currSlide.zoomLevels.max||this.gestures.isMultitouch?this.gestures.zoomLevels.correctZoomPan(!0):(this.P("x"),this.P("y"))}P(t){const{pswp:i}=this,{currSlide:s}=i,{velocity:h}=this.gestures,{pan:e,bounds:o}=s,r=e[t],a=i.bgOpacity<1&&"y"===t,c=r+function(t,i){return t*i/(1-i)}(h[t],.995);if(a){const t=this.S(r),s=this.S(c);if(t<0&&s<-.4||t>0&&s>.4)return void i.close()}const l=o.correctPan(t,c);if(r===l)return;const p=l===c?1:.82,u=i.bgOpacity,d=l-r;i.animations.startSpring({name:"panGesture"+t,isPan:!0,start:r,end:l,velocity:h[t],dampingRatio:p,onUpdate:h=>{if(a&&i.bgOpacity<1){const t=1-(l-h)/d;i.applyBgOpacity(n(u+(1-u)*t,0,1))}e[t]=Math.floor(h),s.applyCurrentZoomPan()}})}M(t){const{p1:i,pswp:s,dragAxis:h,prevP1:e,isMultitouch:n}=this.gestures,{currSlide:o,mainScroll:r}=s,a=i[t]-e[t],c=r.x+a;if(!a)return;if("x"===t&&!o.isPannable()&&!n)return r.moveTo(c,!0),!0;const{bounds:l}=o,p=o.pan[t]+a;if(s.options.allowPanToNext&&"x"===h&&"x"===t&&!n){const i=r.getCurrSlideX(),s=r.x-i,h=a>0,e=!h;if(p>l.min[t]&&h){if(l.min[t]<=this.startPan[t])return r.moveTo(c,!0),!0;this.v(t,p)}else if(p<l.max[t]&&e){if(this.startPan[t]<=l.max[t])return r.moveTo(c,!0),!0;this.v(t,p)}else if(0!==s){if(s>0)return r.moveTo(Math.max(c,i),!0),!0;if(s<0)return r.moveTo(Math.min(c,i),!0),!0}else this.v(t,p)}else"y"===t&&(r.isShifted()||l.min.y===l.max.y)||this.v(t,p)}S(t){return(t-this.pswp.currSlide.bounds.center.y)/(this.pswp.viewportSize.y/3)}v(t,i,s){const{pan:h,bounds:e}=this.pswp.currSlide;if(e.correctPan(t,i)!==i||s){const e=Math.round(i-h[t]);h[t]+=e*(s||.35)}else h[t]=i}}function S(t,i,s){return t.x=(i.x+s.x)/2,t.y=(i.y+s.y)/2,t}class M{constructor(t){this.gestures=t,this.pswp=this.gestures.pswp,this.C={},this.T={},this.D={}}start(){this.I=this.pswp.currSlide.currZoomLevel,i(this.C,this.pswp.currSlide.pan),this.pswp.animations.stopAllPan(),this.A=!1}change(){const{p1:t,startP1:i,p2:s,startP2:e,pswp:n}=this.gestures,{currSlide:o}=n,r=o.zoomLevels.min,a=o.zoomLevels.max;if(!o.isZoomable()||n.mainScroll.isShifted())return;S(this.T,i,e),S(this.D,t,s);let c=1/h(i,e)*h(t,s)*this.I;if(c>o.zoomLevels.initial+o.zoomLevels.initial/15&&(this.A=!0),c<r)if(n.options.pinchToClose&&!this.A&&this.I<=o.zoomLevels.initial){const t=1-(r-c)/(r/1.2);n.dispatch("pinchClose",{bgOpacity:t}).defaultPrevented||n.applyBgOpacity(t)}else c=r-.15*(r-c);else c>a&&(c=a+.05*(c-a));o.pan.x=this.L("x",c),o.pan.y=this.L("y",c),o.setZoomLevel(c),o.applyCurrentZoomPan()}end(){const{pswp:t}=this,{currSlide:i}=t;i.currZoomLevel<i.zoomLevels.initial&&!this.A&&t.options.pinchToClose?t.close():this.correctZoomPan()}L(t,i){const s=i/this.I;return this.D[t]-(this.T[t]-this.C[t])*s}correctZoomPan(t){const{pswp:s}=this,{currSlide:h}=s;if(!h.isZoomable())return;void 0===this.D.x&&(t=!0);const o=h.currZoomLevel;let r,a=!0;o<h.zoomLevels.initial?r=h.zoomLevels.initial:o>h.zoomLevels.max?r=h.zoomLevels.max:(a=!1,r=o);const c=s.bgOpacity,l=s.bgOpacity<1,p=i({},h.pan);let u=i({},p);t&&(this.D.x=0,this.D.y=0,this.T.x=0,this.T.y=0,this.I=o,i(this.C,p)),a&&(u={x:this.L("x",r),y:this.L("y",r)}),h.setZoomLevel(r),u={x:h.bounds.correctPan("x",u.x),y:h.bounds.correctPan("y",u.y)},h.setZoomLevel(o);let d=!0;if(e(u,p)&&(d=!1),!d&&!a&&!l)return h.g(r),void h.applyCurrentZoomPan();s.animations.stopAllPan(),s.animations.startSpring({isPan:!0,start:0,end:1e3,velocity:0,dampingRatio:1,naturalFrequency:40,onUpdate:t=>{if(t/=1e3,d||a){if(d&&(h.pan.x=p.x+(u.x-p.x)*t,h.pan.y=p.y+(u.y-p.y)*t),a){const i=o+(r-o)*t;h.setZoomLevel(i)}h.applyCurrentZoomPan()}l&&s.bgOpacity<1&&s.applyBgOpacity(n(c+(1-c)*t,0,1))},onComplete:()=>{h.g(r),h.applyCurrentZoomPan()}})}}function z(t){return!!t.target.closest(".pswp__container")}class P{constructor(t){this.gestures=t}click(t,i){const s=i.target.classList,h=s.contains("pswp__img"),e=s.contains("pswp__item")||s.contains("pswp__zoom-wrap");h?this.k("imageClick",t,i):e&&this.k("bgClick",t,i)}tap(t,i){z(i)&&this.k("tap",t,i)}doubleTap(t,i){z(i)&&this.k("doubleTap",t,i)}k(t,i,s){const{pswp:h}=this.gestures,{currSlide:e}=h,n=t+"Action",o=h.options[n];if(!h.dispatch(n,{point:i,originalEvent:s}).defaultPrevented)if("function"!=typeof o)switch(o){case"close":case"next":h[o]();break;case"zoom":e.toggleZoom(i);break;case"zoom-or-close":e.isZoomable()&&e.zoomLevels.secondary!==e.zoomLevels.initial?e.toggleZoom(i):h.options.clickToCloseNonZoomable&&h.close();break;case"toggle-controls":this.gestures.pswp.element.classList.toggle("pswp--ui-visible")}else o.call(h,i,s)}}class C{dragAxis;constructor(t){this.pswp=t,this.p1={},this.p2={},this.prevP1={},this.prevP2={},this.startP1={},this.startP2={},this.velocity={},this.Z={},this.F={},this.B=0,this.O=[],this.R="ontouchstart"in window,this.N=!!window.PointerEvent,this.supportsTouch=this.R||this.N&&navigator.maxTouchPoints>1,this.supportsTouch||(t.options.allowPanToNext=!1),this.drag=new x(this),this.zoomLevels=new M(this),this.tapHandler=new P(this),t.on("bindEvents",(()=>{t.events.add(t.scrollWrap,"click",(t=>this.V(t))),this.N?this.G("pointer","down","up","cancel"):this.R?(this.G("touch","start","end","cancel"),t.scrollWrap.ontouchmove=()=>{},t.scrollWrap.ontouchend=()=>{}):this.G("mouse","down","up")}))}G(t,i,s,h){const{pswp:e}=this,{events:n}=e,o=h?t+h:"";n.add(e.scrollWrap,t+i,this.onPointerDown.bind(this)),n.add(window,t+"move",this.onPointerMove.bind(this)),n.add(window,t+s,this.onPointerUp.bind(this)),o&&n.add(e.scrollWrap,o,this.onPointerUp.bind(this))}onPointerDown(t){let s;if("mousedown"!==t.type&&"mouse"!==t.pointerType||(s=!0),s&&t.button>0)return;const{pswp:h}=this;h.opener.isOpen?h.dispatch("pointerDown",{originalEvent:t}).defaultPrevented||(s&&(h.mouseDetected(),this.U(t)),h.animations.stopAll(),this.q(t,"down"),this.pointerDown=!0,1===this.B&&(this.dragAxis=null,i(this.startP1,this.p1)),this.B>1?(this.H(),this.isMultitouch=!0):this.isMultitouch=!1):t.preventDefault()}onPointerMove(t){t.preventDefault(),this.B&&(this.q(t,"move"),this.pswp.dispatch("pointerMove",{originalEvent:t}).defaultPrevented||(1!==this.B||this.isDragging?this.B>1&&!this.isZooming&&(this.K(),this.isZooming=!0,this.W(),this.zoomLevels.start(),this.j(),this.X()):(this.dragAxis||this.Y(),this.dragAxis&&!this.isDragging&&(this.isZooming&&(this.isZooming=!1,this.zoomLevels.end()),this.isDragging=!0,this.H(),this.W(),this.$=Date.now(),this.J=!1,i(this.F,this.p1),this.velocity.x=0,this.velocity.y=0,this.drag.start(),this.j(),this.X()))))}K(){this.isDragging&&(this.isDragging=!1,this.J||this.tt(!0),this.drag.end(),this.dragAxis=null)}onPointerUp(t){this.B&&(this.q(t,"up"),this.pswp.dispatch("pointerUp",{originalEvent:t}).defaultPrevented||(0===this.B&&(this.pointerDown=!1,this.j(),this.isDragging?this.K():this.isZooming||this.isMultitouch||this.it(t)),this.B<2&&this.isZooming&&(this.isZooming=!1,this.zoomLevels.end(),1===this.B&&(this.dragAxis=null,this.W()))))}X(){(this.isDragging||this.isZooming)&&(this.tt(),this.isDragging?e(this.p1,this.prevP1)||this.drag.change():e(this.p1,this.prevP1)&&e(this.p2,this.prevP2)||this.zoomLevels.change(),this.st(),this.raf=requestAnimationFrame(this.X.bind(this)))}tt(t){const s=Date.now(),h=s-this.$;h<50&&!t||(this.velocity.x=this.ht("x",h),this.velocity.y=this.ht("y",h),this.$=s,i(this.F,this.p1),this.J=!0)}it(t){const{mainScroll:s}=this.pswp;if(s.isShifted())return void s.moveIndexBy(0,!0);if(t.type.indexOf("cancel")>0)return;if("mouseup"===t.type||"mouse"===t.pointerType)return void this.tapHandler.click(this.startP1,t);const e=this.pswp.options.doubleTapAction?300:0;this.et?(this.H(),h(this.Z,this.startP1)<25&&this.tapHandler.doubleTap(this.startP1,t)):(i(this.Z,this.startP1),this.et=setTimeout((()=>{this.tapHandler.tap(this.startP1,t),this.H()}),e))}H(){this.et&&(clearTimeout(this.et),this.et=null)}ht(t,i){const s=this.p1[t]-this.F[t];return Math.abs(s)>1&&i>5?s/i:0}j(){this.raf&&(cancelAnimationFrame(this.raf),this.raf=null)}U(t){return t.preventDefault(),!0}q(t,s){if(this.N){const h=t,e=this.O.findIndex((t=>t.id===h.pointerId));"up"===s&&e>-1?this.O.splice(e,1):"down"===s&&-1===e?this.O.push(this.nt(h,{})):e>-1&&this.nt(h,this.O[e]),this.B=this.O.length,this.B>0&&i(this.p1,this.O[0]),this.B>1&&i(this.p2,this.O[1])}else{const i=t;this.B=0,i.type.indexOf("touch")>-1?i.touches&&i.touches.length>0&&(this.nt(i.touches[0],this.p1),this.B++,i.touches.length>1&&(this.nt(i.touches[1],this.p2),this.B++)):(this.nt(t,this.p1),"up"===s?this.B=0:this.B++)}}st(){i(this.prevP1,this.p1),i(this.prevP2,this.p2)}W(){i(this.startP1,this.p1),i(this.startP2,this.p2),this.st()}Y(){if(this.pswp.mainScroll.isShifted())this.dragAxis="x";else{const t=Math.abs(this.p1.x-this.startP1.x)-Math.abs(this.p1.y-this.startP1.y);if(0!==t){const i=t>0?"x":"y";Math.abs(this.p1[i]-this.startP1[i])>=10&&(this.dragAxis=i)}}}nt(t,i){return i.x=t.pageX-this.pswp.offset.x,i.y=t.pageY-this.pswp.offset.y,"pointerId"in t?i.id=t.pointerId:void 0!==t.identifier&&(i.id=t.identifier),i}V(t){this.pswp.mainScroll.isShifted()&&(t.preventDefault(),t.stopPropagation())}}class T{slideWidth;itemHolders;constructor(t){this.pswp=t,this.x=0,this.resetPosition()}resize(t){const{pswp:i}=this,s=Math.round(i.viewportSize.x+i.viewportSize.x*i.options.spacing),h=s!==this.slideWidth;h&&(this.slideWidth=s,this.moveTo(this.getCurrSlideX())),this.itemHolders.forEach(((i,s)=>{h&&r(i.el,(s+this.ot)*this.slideWidth),t&&i.slide&&i.slide.resize()}))}resetPosition(){this.rt=0,this.at=0,this.slideWidth=0,this.ot=-1}appendHolders(){this.itemHolders=[];for(let i=0;i<3;i++){const s=t("pswp__item",!1,this.pswp.container);s.style.display=1===i?"block":"none",this.itemHolders.push({el:s})}}canBeSwiped(){return this.pswp.getNumItems()>1}moveIndexBy(t,i,s){const{pswp:h}=this;let e=h.potentialIndex+t;const n=h.getNumItems();if(h.canLoop()){e=h.getLoopedIndex(e);const i=(t+n)%n;t=i<=n/2?i:i-n}else e<0?e=0:e>=n&&(e=n-1),t=e-h.potentialIndex;h.potentialIndex=e,this.rt-=t,h.animations.stopMainScroll();const o=this.getCurrSlideX();if(i){h.animations.startSpring({isMainScroll:!0,start:this.x,end:o,velocity:s||0,naturalFrequency:30,dampingRatio:1,onUpdate:t=>{this.moveTo(t)},onComplete:()=>{this.updateCurrItem(),h.appendHeavy()}});let t=h.potentialIndex-h.currIndex;if(h.canLoop()){const i=(t+n)%n;t=i<=n/2?i:i-n}Math.abs(t)>1&&this.updateCurrItem()}else this.moveTo(o),this.updateCurrItem();if(t)return!0}getCurrSlideX(){return this.slideWidth*this.rt}isShifted(){return this.x!==this.getCurrSlideX()}updateCurrItem(){const{pswp:t}=this,i=this.at-this.rt;if(!i)return;this.at=this.rt,t.currIndex=t.potentialIndex;let s,h=Math.abs(i);h>=3&&(this.ot+=i+(i>0?-3:3),h=3);for(let e=0;e<h;e++)i>0?(s=this.itemHolders.shift(),this.itemHolders[2]=s,this.ot++,r(s.el,(this.ot+2)*this.slideWidth),t.setContent(s,t.currIndex-h+e+2)):(s=this.itemHolders.pop(),this.itemHolders.unshift(s),this.ot--,r(s.el,this.ot*this.slideWidth),t.setContent(s,t.currIndex+h-e-2));Math.abs(this.ot)>50&&!this.isShifted()&&(this.resetPosition(),this.resize()),t.animations.stopAllPan(),this.itemHolders.forEach(((t,i)=>{t.slide&&t.slide.setIsActive(1===i)})),t.currSlide=this.itemHolders[1].slide,t.contentLoader.updateLazy(i),t.currSlide.applyCurrentZoomPan(),t.dispatch("change")}moveTo(t,i){let s,h;!this.pswp.canLoop()&&i&&(s=(this.slideWidth*this.rt-t)/this.slideWidth,s+=this.pswp.currIndex,h=Math.round(t-this.x),(s<0&&h>0||s>=this.pswp.getNumItems()-1&&h<0)&&(t=this.x+.35*h)),this.x=t,r(this.pswp.container,t),this.pswp.dispatch("moveMainScroll",{x:t,dragging:i})}}class D{constructor(t){this.pswp=t,t.on("bindEvents",(()=>{t.options.initialPointerPos||this.ct(),t.events.add(document,"focusin",this.lt.bind(this)),t.events.add(document,"keydown",this.ut.bind(this))}));const i=document.activeElement;t.on("destroy",(()=>{t.options.returnFocus&&i&&this.dt&&i.focus()}))}ct(){this.dt||(this.pswp.element.focus(),this.dt=!0)}ut(t){const{pswp:i}=this;if(i.dispatch("keydown",{originalEvent:t}).defaultPrevented)return;if(function(t){if(2===t.which||t.ctrlKey||t.metaKey||t.altKey||t.shiftKey)return!0}(t))return;let s,h,e;switch(t.keyCode){case 27:i.options.escKey&&(s="close");break;case 90:s="toggleZoom";break;case 37:h="x";break;case 38:h="y";break;case 39:h="x",e=!0;break;case 40:e=!0,h="y";break;case 9:this.ct()}if(h){t.preventDefault();const{currSlide:n}=i;i.options.arrowKeys&&"x"===h&&i.getNumItems()>1?s=e?"next":"prev":n&&n.currZoomLevel>n.zoomLevels.fit&&(n.pan[h]+=e?-80:80,n.panTo(n.pan.x,n.pan.y))}s&&(t.preventDefault(),i[s]())}lt(t){const{template:i}=this.pswp;document===t.target||i===t.target||i.contains(t.target)||i.focus()}}class I{onFinish;constructor(t){this.props=t;const{target:i,onComplete:s,transform:h}=t;let{duration:e,easing:n}=t;const o=h?"transform":"opacity",r=t[o];this.ft=i,this.wt=s,e=e||333,n=n||"cubic-bezier(.4,0,.22,1)",this.gt=this.gt.bind(this),this._t=setTimeout((()=>{a(i,o,e,n),this._t=setTimeout((()=>{i.addEventListener("transitionend",this.gt,!1),i.addEventListener("transitioncancel",this.gt,!1),i.style[o]=r}),30)}),0)}gt(t){t.target===this.ft&&this.vt()}vt(){this.yt||(this.yt=!0,this.onFinish(),this.wt&&this.wt())}destroy(){this._t&&clearTimeout(this._t),a(this.ft),this.ft.removeEventListener("transitionend",this.gt,!1),this.ft.removeEventListener("transitioncancel",this.gt,!1),this.yt||this.vt()}}class A{constructor(t,i,s){this.velocity=1e3*t,this.bt=i||.75,this.xt=s||12,this.bt<1&&(this.St=this.xt*Math.sqrt(1-this.bt*this.bt))}easeFrame(t,i){let s,h=0;i/=1e3;const e=Math.E**(-this.bt*this.xt*i);if(1===this.bt)s=this.velocity+this.xt*t,h=(t+s*i)*e,this.velocity=h*-this.xt+s*e;else if(this.bt<1){s=1/this.St*(this.bt*this.xt*t+this.velocity);const n=Math.cos(this.St*i),o=Math.sin(this.St*i);h=e*(t*n+s*o),this.velocity=h*-this.xt*this.bt+e*(-this.St*t*o+this.St*s*n)}return h}}class E{onFinish;constructor(t){this.props=t;const{start:i,end:s,velocity:h,onUpdate:e,onComplete:n,onFinish:o,dampingRatio:r,naturalFrequency:a}=t,c=new A(h,r,a);let l=Date.now(),p=i-s;this.Mt=o;const u=()=>{this.zt&&(p=c.easeFrame(p,Date.now()-l),Math.abs(p)<1&&Math.abs(c.velocity)<50?(e(s),n&&n(),this.onFinish()):(l=Date.now(),e(p+s),this.zt=requestAnimationFrame(u)))};this.zt=requestAnimationFrame(u)}destroy(){this.zt>=0&&cancelAnimationFrame(this.zt),this.zt=null}}class L{constructor(){this.activeAnimations=[]}startSpring(t){this.Pt(t,!0)}startTransition(t){this.Pt(t)}Pt(t,i){let s;return s=i?new E(t):new I(t),this.activeAnimations.push(s),s.onFinish=()=>this.stop(s),s}stop(t){t.destroy();const i=this.activeAnimations.indexOf(t);i>-1&&this.activeAnimations.splice(i,1)}stopAll(){this.activeAnimations.forEach((t=>{t.destroy()})),this.activeAnimations=[]}stopAllPan(){this.activeAnimations=this.activeAnimations.filter((t=>!t.props.isPan||(t.destroy(),!1)))}stopMainScroll(){this.activeAnimations=this.activeAnimations.filter((t=>!t.props.isMainScroll||(t.destroy(),!1)))}isPanRunning(){return this.activeAnimations.some((t=>t.props.isPan))}}class k{constructor(t){this.pswp=t,t.events.add(t.element,"wheel",this.Ct.bind(this))}Ct(t){t.preventDefault();const{currSlide:i}=this.pswp;let{deltaX:s,deltaY:h}=t;if(i&&!this.pswp.dispatch("wheel",{originalEvent:t}).defaultPrevented)if(t.ctrlKey||this.pswp.options.wheelToZoom){if(i.isZoomable()){let s=-h;1===t.deltaMode?s*=.05:s*=t.deltaMode?1:.002,s=2**s;const e=i.currZoomLevel*s;i.zoomTo(e,{x:t.clientX,y:t.clientY})}}else i.isPannable()&&(1===t.deltaMode&&(s*=18,h*=18),i.panTo(i.pan.x-s,i.pan.y-h))}}class Z{constructor(i,s){const h=s.name||s.className;let e=s.html;if(!1===i.options[h])return;"string"==typeof i.options[h+"SVG"]&&(e=i.options[h+"SVG"]),i.dispatch("uiElementCreate",{data:s});let n,o="";s.isButton?(o+="pswp__button ",o+=s.className||`pswp__button--${s.name}`):o+=s.className||`pswp__${s.name}`;let r=s.isButton?s.tagName||"button":s.tagName||"div";if(r=r.toLowerCase(),n=t(o,r),s.isButton){n=t(o,r),"button"===r&&(n.type="button");let{title:e}=s;const{ariaLabel:a}=s;"string"==typeof i.options[h+"Title"]&&(e=i.options[h+"Title"]),e&&(n.title=e),(a||e)&&n.setAttribute("aria-label",a||e)}n.innerHTML=function(t){if("string"==typeof t)return t;if(!t||!t.isCustomSVG)return"";const i=t;let s='<svg aria-hidden="true" class="pswp__icn" viewBox="0 0 %d %d" width="%d" height="%d">';return s=s.split("%d").join(i.size||32),i.outlineID&&(s+='<use class="pswp__icn-shadow" xlink:href="#'+i.outlineID+'"/>'),s+=i.inner,s+="</svg>",s}(e),s.onInit&&s.onInit(n,i),s.onClick&&(n.onclick=t=>{"string"==typeof s.onClick?i[s.onClick]():s.onClick(t,n,i)});const a=s.appendTo||"bar";let c;"bar"===a?(i.topBar||(i.topBar=t("pswp__top-bar pswp__hide-on-close","div",i.scrollWrap)),c=i.topBar):(n.classList.add("pswp__hide-on-close"),c="wrapper"===a?i.scrollWrap:i.element),c.appendChild(i.applyFilters("uiElement",n,s))}}function F(t,i,s){t.classList.add("pswp__button--arrow"),i.on("change",(()=>{i.options.loop||(t.disabled=s?!(i.currIndex<i.getNumItems()-1):!(i.currIndex>0))}))}const B={name:"arrowPrev",className:"pswp__button--arrow--prev",title:"Previous",order:10,isButton:!0,appendTo:"wrapper",html:{isCustomSVG:!0,size:60,inner:'<path d="M29 43l-3 3-16-16 16-16 3 3-13 13 13 13z" id="pswp__icn-arrow"/>',outlineID:"pswp__icn-arrow"},onClick:"prev",onInit:F},O={name:"arrowNext",className:"pswp__button--arrow--next",title:"Next",order:11,isButton:!0,appendTo:"wrapper",html:{isCustomSVG:!0,size:60,inner:'<use xlink:href="#pswp__icn-arrow"/>',outlineID:"pswp__icn-arrow"},onClick:"next",onInit:(t,i)=>{F(t,i,!0)}},R={name:"close",title:"Close",order:20,isButton:!0,html:{isCustomSVG:!0,inner:'<path d="M24 10l-2-2-6 6-6-6-2 2 6 6-6 6 2 2 6-6 6 6 2-2-6-6z" id="pswp__icn-close"/>',outlineID:"pswp__icn-close"},onClick:"close"},N={name:"zoom",title:"Zoom",order:10,isButton:!0,html:{isCustomSVG:!0,inner:'<path d="M17.426 19.926a6 6 0 1 1 1.5-1.5L23 22.5 21.5 24l-4.074-4.074z" id="pswp__icn-zoom"/><path fill="currentColor" class="pswp__zoom-icn-bar-h" d="M11 16v-2h6v2z"/><path fill="currentColor" class="pswp__zoom-icn-bar-v" d="M13 12h2v6h-2z"/>',outlineID:"pswp__icn-zoom"},onClick:"toggleZoom"},V={name:"preloader",appendTo:"bar",order:7,html:{isCustomSVG:!0,inner:'<path fill-rule="evenodd" clip-rule="evenodd" d="M21.2 16a5.2 5.2 0 1 1-5.2-5.2V8a8 8 0 1 0 8 8h-2.8Z" id="pswp__icn-loading"/>',outlineID:"pswp__icn-loading"},onInit:(t,i)=>{let s,h;const e=i=>{var h,e;s!==i&&(s=i,h="active",e=i,t.classList[e?"add":"remove"]("pswp__preloader--"+h))},n=()=>{if(!i.currSlide.content.isLoading())return e(!1),void(h&&(clearTimeout(h),h=null));h||(h=setTimeout((()=>{e(i.currSlide.content.isLoading()),h=null}),i.options.preloaderDelay))};i.on("change",n),i.on("loadComplete",(t=>{i.currSlide===t.slide&&n()})),i.ui.updatePreloaderVisibility=n}},G={name:"counter",order:5,onInit:(t,i)=>{i.on("change",(()=>{t.innerText=i.currIndex+1+i.options.indexIndicatorSep+i.getNumItems()}))}};function U(t,i){t.classList[i?"add":"remove"]("pswp--zoomed-in")}class q{updatePreloaderVisibility;Tt;constructor(t){this.pswp=t}init(){const{pswp:t}=this;this.isRegistered=!1,this.uiElementsData=[R,B,O,N,V,G],t.dispatch("uiRegister"),this.uiElementsData.sort(((t,i)=>(t.order||0)-(i.order||0))),this.items=[],this.isRegistered=!0,this.uiElementsData.forEach((t=>{this.registerElement(t)})),t.on("change",(()=>{t.element.classList[1===t.getNumItems()?"add":"remove"]("pswp--one-slide")})),t.on("zoomPanUpdate",(()=>this.Dt()))}registerElement(t){this.isRegistered?this.items.push(new Z(this.pswp,t)):this.uiElementsData.push(t)}Dt(){const{template:t,currSlide:i,options:s}=this.pswp;let{currZoomLevel:h}=i;if(this.pswp.opener.isClosing)return;if(this.pswp.opener.isOpen||(h=i.zoomLevels.initial),h===this.Tt)return;this.Tt=h;const e=i.zoomLevels.initial-i.zoomLevels.secondary;if(Math.abs(e)<.01||!i.isZoomable())return U(t,!1),void t.classList.remove("pswp--zoom-allowed");t.classList.add("pswp--zoom-allowed");const n=e<0;h===i.zoomLevels.secondary?U(t,n):h>i.zoomLevels.secondary?U(t,!0):U(t,!1),"zoom"!==s.imageClickAction&&"zoom-or-close"!==s.imageClickAction||t.classList.add("pswp--click-to-zoom")}}class H{constructor(t,i){this.type=t,i&&Object.assign(this,i)}preventDefault(){this.defaultPrevented=!0}}class K{constructor(i,s){this.element=t("pswp__img pswp__img--placeholder",i?"img":"",s),i&&(this.element.decoding="async",this.element.alt="",this.element.src=i,this.element.setAttribute("role","presentation")),this.element.setAttribute("aria-hiden","true")}setDisplayedSize(t,i){this.element&&("IMG"===this.element.tagName?(c(this.element,250,"auto"),this.element.style.transformOrigin="0 0",this.element.style.transform=o(0,0,t/250)):c(this.element,t,i))}destroy(){this.element.parentNode&&this.element.remove(),this.element=null}}class W{element;constructor(t,i,s){this.instance=i,this.data=t,this.index=s,this.width=Number(this.data.w)||Number(this.data.width)||0,this.height=Number(this.data.h)||Number(this.data.height)||0,this.isAttached=!1,this.hasSlide=!1,this.state=l,this.data.type?this.type=this.data.type:this.data.src?this.type="image":this.type="html",this.instance.dispatch("contentInit",{content:this})}removePlaceholder(){this.placeholder&&!this.keepPlaceholder()&&setTimeout((()=>{this.placeholder&&(this.placeholder.destroy(),this.placeholder=null)}),500)}load(i,s){if(!this.placeholder&&this.slide&&this.usePlaceholder()){const t=this.instance.applyFilters("placeholderSrc",!(!this.data.msrc||!this.slide.isFirstSlide)&&this.data.msrc,this);this.placeholder=new K(t,this.slide.container)}this.element&&!s||this.instance.dispatch("contentLoad",{content:this,isLazy:i}).defaultPrevented||(this.isImageContent()?this.loadImage(i):(this.element=t("pswp__content"),this.element.innerHTML=this.data.html||""),s&&this.slide&&this.slide.updateContentSize(!0))}loadImage(i){const s=t("pswp__img","img");this.element=s,this.instance.dispatch("contentLoadImage",{content:this,isLazy:i}).defaultPrevented||(this.data.srcset&&(s.srcset=this.data.srcset),s.src=this.data.src,s.alt=this.data.alt||"",this.state=p,s.complete?this.onLoaded():(s.onload=()=>{this.onLoaded()},s.onerror=()=>{this.onError()}))}setSlide(t){this.slide=t,this.hasSlide=!0,this.instance=t.pswp}onLoaded(){this.state=u,this.slide&&(this.instance.dispatch("loadComplete",{slide:this.slide,content:this}),this.slide.isActive&&this.slide.heavyAppended&&!this.element.parentNode&&(this.slide.container.innerHTML="",this.append(),this.slide.updateContentSize(!0)))}onError(){this.state=d,this.slide&&(this.displayError(),this.instance.dispatch("loadComplete",{slide:this.slide,isError:!0,content:this}),this.instance.dispatch("loadError",{slide:this.slide,content:this}))}isLoading(){return this.instance.applyFilters("isContentLoading",this.state===p,this)}isError(){return this.state===d}isImageContent(){return"image"===this.type}setDisplayedSize(t,i){if(this.element&&(this.placeholder&&this.placeholder.setDisplayedSize(t,i),!this.instance.dispatch("contentResize",{content:this,width:t,height:i}).defaultPrevented&&(c(this.element,t,i),this.isImageContent()&&!this.isError()))){const s=this.element;s.srcset&&(!s.dataset.largestUsedSize||t>parseInt(s.dataset.largestUsedSize,10))&&(s.sizes=t+"px",s.dataset.largestUsedSize=String(t)),this.slide&&this.instance.dispatch("imageSizeChange",{slide:this.slide,width:t,height:i,content:this})}}isZoomable(){return this.instance.applyFilters("isContentZoomable",this.isImageContent()&&this.state!==d,this)}usePlaceholder(){return this.instance.applyFilters("useContentPlaceholder",this.isImageContent(),this)}lazyLoad(){this.instance.dispatch("contentLazyLoad",{content:this}).defaultPrevented||this.load(!0)}keepPlaceholder(){return this.instance.applyFilters("isKeepingPlaceholder",this.isLoading(),this)}destroy(){this.hasSlide=!1,this.slide=null,this.instance.dispatch("contentDestroy",{content:this}).defaultPrevented||(this.remove(),this.isImageContent()&&this.element&&(this.element.onload=null,this.element.onerror=null,this.element=null))}displayError(){if(this.slide){let i=t("pswp__error-msg");i.innerText=this.instance.options.errorMsg,i=this.instance.applyFilters("contentErrorElement",i,this),this.element=t("pswp__content pswp__error-msg-container"),this.element.appendChild(i),this.slide.container.innerHTML="",this.slide.container.appendChild(this.element),this.slide.updateContentSize(!0),this.removePlaceholder()}}append(){this.isAttached=!0,this.state!==d?this.instance.dispatch("contentAppend",{content:this}).defaultPrevented||(this.isImageContent()?this.slide&&!this.slide.isActive&&"decode"in this.element?(this.isDecoding=!0,requestAnimationFrame((()=>{this.element&&"IMG"===this.element.tagName&&this.element.decode().then((()=>{this.isDecoding=!1,requestAnimationFrame((()=>{this.appendImage()}))})).catch((()=>{this.isDecoding=!1}))}))):(!this.placeholder||this.state!==u&&this.state!==d||this.removePlaceholder(),this.appendImage()):this.element&&!this.element.parentNode&&this.slide.container.appendChild(this.element)):this.displayError()}activate(){this.instance.dispatch("contentActivate",{content:this}).defaultPrevented||this.slide&&(this.isImageContent()&&this.isDecoding?this.appendImage():this.isError()&&this.load(!1,!0))}deactivate(){this.instance.dispatch("contentDeactivate",{content:this})}remove(){this.isAttached=!1,this.instance.dispatch("contentRemove",{content:this}).defaultPrevented||this.element&&this.element.parentNode&&this.element.remove()}appendImage(){this.isAttached&&(this.instance.dispatch("contentAppendImage",{content:this}).defaultPrevented||this.slide&&this.element&&!this.element.parentNode&&(this.slide.container.appendChild(this.element),!this.placeholder||this.state!==u&&this.state!==d||this.removePlaceholder()))}}class j{It;constructor(t){this.pswp=t,this.isClosed=!0,this.At=this.At.bind(this),t.on("firstZoomPan",this.At)}open(){this.At(),this.Pt()}close(){if(this.isClosed||this.isClosing||this.isOpening)return!1;const t=this.pswp.currSlide;return this.isOpen=!1,this.isOpening=!1,this.isClosing=!0,this.Et=this.pswp.options.hideAnimationDuration,t&&t.currZoomLevel*t.width>=this.pswp.options.maxWidthToAnimate&&(this.Et=0),this.Lt(),setTimeout((()=>{this.Pt()}),this.kt?30:0),!0}At(){if(this.pswp.off("firstZoomPan",this.At),!this.isOpening){const t=this.pswp.currSlide;this.isOpening=!0,this.isClosing=!1,this.Et=this.pswp.options.showAnimationDuration,t&&t.zoomLevels.initial*t.width>=this.pswp.options.maxWidthToAnimate&&(this.Et=0),this.Lt()}}Lt(){const{pswp:t}=this,i=this.pswp.currSlide,{options:s}=t;if("fade"===s.showHideAnimationType?(s.showHideOpacity=!0,this.It=!1):"none"===s.showHideAnimationType?(s.showHideOpacity=!1,this.Et=0,this.It=!1):this.isOpening&&t.Zt?this.It=t.Zt:this.It=this.pswp.getThumbBounds(),this.Ft=i.getPlaceholderElement(),t.animations.stopAll(),this.Bt=this.Et>50,this.Ot=Boolean(this.It)&&i.content&&i.content.usePlaceholder()&&(!this.isClosing||!t.mainScroll.isShifted()),this.Ot?this.Rt=s.showHideOpacity:(this.Rt=!0,this.isOpening&&(i.zoomAndPanToInitial(),i.applyCurrentZoomPan())),this.Nt=!this.Rt&&this.pswp.options.bgOpacity>.003,this.Vt=this.Rt?t.element:t.bg,!this.Bt)return this.Et=0,this.Ot=!1,this.Nt=!1,this.Rt=!0,void(this.isOpening&&(t.element.style.opacity=String(.003),t.applyBgOpacity(1)));this.Ot&&this.It&&this.It.innerRect?(this.kt=!0,this.Gt=this.pswp.container,this.Ut=this.pswp.currSlide.holderElement,t.container.style.overflow="hidden",t.container.style.width=t.viewportSize.x+"px"):this.kt=!1,this.isOpening?(this.Rt?(t.element.style.opacity=String(.003),t.applyBgOpacity(1)):(this.Nt&&(t.bg.style.opacity=String(.003)),t.element.style.opacity="1"),this.Ot&&(this.qt(),this.Ft&&(this.Ft.style.willChange="transform",this.Ft.style.opacity=String(.003)))):this.isClosing&&(t.mainScroll.itemHolders[0].el.style.display="none",t.mainScroll.itemHolders[2].el.style.display="none",this.kt&&0!==t.mainScroll.x&&(t.mainScroll.resetPosition(),t.mainScroll.resize()))}Pt(){this.isOpening&&this.Bt&&this.Ft&&"IMG"===this.Ft.tagName?new Promise((t=>{let i=!1,s=!0;var h;(h=this.Ft,"decode"in h?h.decode():h.complete?Promise.resolve(h):new Promise(((t,i)=>{h.onload=()=>t(h),h.onerror=i}))).finally((()=>{i=!0,s||t()})),setTimeout((()=>{s=!1,i&&t()}),50),setTimeout(t,250)})).finally((()=>this.Ht())):this.Ht()}Ht(){this.pswp.element.style.setProperty("--pswp-transition-duration",this.Et+"ms"),this.pswp.dispatch(this.isOpening?"openingAnimationStart":"closingAnimationStart"),this.pswp.dispatch("initialZoom"+(this.isOpening?"In":"Out")),this.pswp.element.classList[this.isOpening?"add":"remove"]("pswp--ui-visible"),this.isOpening?(this.Ft&&(this.Ft.style.opacity="1"),this.Kt()):this.isClosing&&this.Wt(),this.Bt||this.jt()}jt(){const{pswp:t}=this;this.isOpen=this.isOpening,this.isClosed=this.isClosing,this.isOpening=!1,this.isClosing=!1,t.dispatch(this.isOpen?"openingAnimationEnd":"closingAnimationEnd"),t.dispatch("initialZoom"+(this.isOpen?"InEnd":"OutEnd")),this.isClosed?t.destroy():this.isOpen&&(this.Ot&&(t.container.style.overflow="visible",t.container.style.width="100%"),t.currSlide.applyCurrentZoomPan())}Kt(){const{pswp:t}=this;this.Ot&&(this.kt&&(this.Xt(this.Gt,"transform","translate3d(0,0,0)"),this.Xt(this.Ut,"transform","none")),t.currSlide.zoomAndPanToInitial(),this.Xt(t.currSlide.container,"transform",t.currSlide.getCurrentTransform())),this.Nt&&this.Xt(t.bg,"opacity",String(t.options.bgOpacity)),this.Rt&&this.Xt(t.element,"opacity","1")}Wt(){const{pswp:t}=this;this.Ot&&this.qt(!0),this.Nt&&t.bgOpacity>.01&&this.Xt(t.bg,"opacity","0"),this.Rt&&this.Xt(t.element,"opacity","0")}qt(t){if(!this.It)return;const{pswp:s}=this,{innerRect:h}=this.It,{currSlide:e,viewportSize:n}=s;if(this.kt){const i=-n.x+(this.It.x-h.x)+h.w,s=-n.y+(this.It.y-h.y)+h.h,e=n.x-h.w,a=n.y-h.h;t?(this.Xt(this.Gt,"transform",o(i,s)),this.Xt(this.Ut,"transform",o(e,a))):(r(this.Gt,i,s),r(this.Ut,e,a))}i(e.pan,h||this.It),e.currZoomLevel=this.It.w/e.width,t?this.Xt(e.container,"transform",e.getCurrentTransform()):e.applyCurrentZoomPan()}Xt(t,i,s){if(!this.Et)return void(t.style[i]=s);const{animations:h}=this.pswp,e={duration:this.Et,easing:this.pswp.options.easing,onComplete:()=>{h.activeAnimations.length||this.jt()},target:t};e[i]=s,h.startTransition(e)}}function X(t,i){const s=i.getItemData(t);if(!i.dispatch("lazyLoadSlide",{index:t,itemData:s}).defaultPrevented)return function(t,i,s){const h=i.createContentFromData(t,s);if(!h||!h.lazyLoad)return;const{options:e}=i,n=_(e,i.viewportSize||w(e,i),t,s),o=new y(e,t,-1);return o.update(h.width,h.height,n),h.lazyLoad(),h.setDisplayedSize(Math.ceil(h.width*o.initial),Math.ceil(h.height*o.initial)),h}(s,i,t)}class Y{constructor(t){this.pswp=t,this.limit=Math.max(t.options.preload[0]+t.options.preload[1]+1,5),this.Yt=[]}updateLazy(t){const{pswp:i}=this;if(i.dispatch("lazyLoad").defaultPrevented)return;const{preload:s}=i.options,h=void 0===t||t>=0;let e;for(e=0;e<=s[1];e++)this.loadSlideByIndex(i.currIndex+(h?e:-e));for(e=1;e<=s[0];e++)this.loadSlideByIndex(i.currIndex+(h?-e:e))}loadSlideByIndex(t){t=this.pswp.getLoopedIndex(t);let i=this.getContentByIndex(t);i||(i=X(t,this.pswp),i&&this.addToCache(i))}getContentBySlide(t){let i=this.getContentByIndex(t.index);return i||(i=this.pswp.createContentFromData(t.data,t.index),i&&this.addToCache(i)),i&&i.setSlide(t),i}addToCache(t){if(this.removeByIndex(t.index),this.Yt.push(t),this.Yt.length>this.limit){const t=this.Yt.findIndex((t=>!t.isAttached&&!t.hasSlide));if(-1!==t){this.Yt.splice(t,1)[0].destroy()}}}removeByIndex(t){const i=this.Yt.findIndex((i=>i.index===t));-1!==i&&this.Yt.splice(i,1)}getContentByIndex(t){return this.Yt.find((i=>i.index===t))}destroy(){this.Yt.forEach((t=>t.destroy())),this.Yt=null}}const $={allowPanToNext:!0,spacing:.1,loop:!0,pinchToClose:!0,closeOnVerticalDrag:!0,hideAnimationDuration:333,showAnimationDuration:333,zoomAnimationDuration:333,escKey:!0,arrowKeys:!0,returnFocus:!0,maxWidthToAnimate:4e3,clickToCloseNonZoomable:!0,imageClickAction:"zoom-or-close",bgClickAction:"close",tapAction:"toggle-controls",doubleTapAction:"zoom",indexIndicatorSep:" / ",preloaderDelay:2e3,bgOpacity:.8,index:0,errorMsg:"The image cannot be loaded",preload:[1,2],easing:"cubic-bezier(.4,0,.22,1)"};class J extends class extends class{constructor(){this.$t={},this.Jt={},this.pswp=void 0}addFilter(t,i,s=100){this.Jt[t]||(this.Jt[t]=[]),this.Jt[t].push({fn:i,priority:s}),this.Jt[t].sort(((t,i)=>t.priority-i.priority)),this.pswp&&this.pswp.addFilter(t,i,s)}removeFilter(t,i){this.Jt[t]&&(this.Jt[t]=this.Jt[t].filter((t=>t.fn!==i))),this.pswp&&this.pswp.removeFilter(t,i)}applyFilters(t,...i){return this.Jt[t]&&this.Jt[t].forEach((t=>{i[0]=t.fn.apply(this,i)})),i[0]}on(t,i){this.$t[t]||(this.$t[t]=[]),this.$t[t].push(i),this.pswp&&this.pswp.on(t,i)}off(t,i){this.$t[t]&&(this.$t[t]=this.$t[t].filter((t=>i!==t))),this.pswp&&this.pswp.off(t,i)}dispatch(t,i){if(this.pswp)return this.pswp.dispatch(t,i);const s=new H(t,i);return this.$t?(this.$t[t]&&this.$t[t].forEach((t=>{t.call(this,s)})),s):s}}{options;getNumItems(){let t;const{dataSource:i}=this.options;i?"length"in i?t=i.length:"gallery"in i&&(i.items||(i.items=this.Qt(i.gallery)),i.items&&(t=i.items.length)):t=0;const s=this.dispatch("numItems",{dataSource:i,numItems:t});return this.applyFilters("numItems",s.numItems,i)}createContentFromData(t,i){return new W(t,this,i)}getItemData(t){const{dataSource:i}=this.options;let s;Array.isArray(i)?s=i[t]:i&&i.gallery&&(i.items||(i.items=this.Qt(i.gallery)),s=i.items[t]);let h=s;h instanceof Element&&(h=this.ti(h));const e=this.dispatch("itemData",{itemData:h||{},index:t});return this.applyFilters("itemData",e.itemData,t)}Qt(t){return this.options.children||this.options.childSelector?function(t,i,s=document){let h=[];if(t instanceof Element)h=[t];else if(t instanceof NodeList||Array.isArray(t))h=Array.from(t);else{const e="string"==typeof t?t:i;e&&(h=Array.from(s.querySelectorAll(e)))}return h}(this.options.children,this.options.childSelector,t)||[]:[t]}ti(t){const i={element:t},s="A"===t.tagName?t:t.querySelector("a");if(s){i.src=s.dataset.pswpSrc||s.href,s.dataset.pswpSrcset&&(i.srcset=s.dataset.pswpSrcset),i.width=parseInt(s.dataset.pswpWidth,10),i.height=parseInt(s.dataset.pswpHeight,10),i.w=i.width,i.h=i.height,s.dataset.pswpType&&(i.type=s.dataset.pswpType);const h=t.querySelector("img");h&&(i.msrc=h.currentSrc||h.src,i.alt=h.getAttribute("alt")),(s.dataset.pswpCropped||s.dataset.cropped)&&(i.thumbCropped=!0)}return this.applyFilters("domItemData",i,t,s),i}}{topBar;constructor(t){super(),this.ii(t),this.offset={},this.si={},this.viewportSize={},this.bgOpacity=1,this.events=new f,this.animations=new L,this.mainScroll=new T(this),this.gestures=new C(this),this.opener=new j(this),this.keyboard=new D(this),this.contentLoader=new Y(this)}init(){if(this.isOpen||this.isDestroying)return;this.isOpen=!0,this.dispatch("init"),this.dispatch("beforeOpen"),this.hi();let t="pswp--open";return this.gestures.supportsTouch&&(t+=" pswp--touch"),this.options.mainClass&&(t+=" "+this.options.mainClass),this.element.className+=" "+t,this.currIndex=this.options.index||0,this.potentialIndex=this.currIndex,this.dispatch("firstUpdate"),this.scrollWheel=new k(this),(Number.isNaN(this.currIndex)||this.currIndex<0||this.currIndex>=this.getNumItems())&&(this.currIndex=0),this.gestures.supportsTouch||this.mouseDetected(),this.updateSize(),this.offset.y=window.pageYOffset,this.ei=this.getItemData(this.currIndex),this.dispatch("gettingData",{index:this.currIndex,data:this.ei,slide:void 0}),this.Zt=this.getThumbBounds(),this.dispatch("initialLayout"),this.on("openingAnimationEnd",(()=>{this.setContent(this.mainScroll.itemHolders[0],this.currIndex-1),this.setContent(this.mainScroll.itemHolders[2],this.currIndex+1),this.mainScroll.itemHolders[0].el.style.display="block",this.mainScroll.itemHolders[2].el.style.display="block",this.appendHeavy(),this.contentLoader.updateLazy(),this.events.add(window,"resize",this.ni.bind(this)),this.events.add(window,"scroll",this.oi.bind(this)),this.dispatch("bindEvents")})),this.setContent(this.mainScroll.itemHolders[1],this.currIndex),this.dispatch("change"),this.opener.open(),this.dispatch("afterInit"),!0}getLoopedIndex(t){const i=this.getNumItems();return this.options.loop&&(t>i-1&&(t-=i),t<0&&(t+=i)),t=n(t,0,i-1)}appendHeavy(){this.mainScroll.itemHolders.forEach((t=>{t.slide&&t.slide.appendHeavy()}))}goTo(t){this.mainScroll.moveIndexBy(this.getLoopedIndex(t)-this.potentialIndex)}next(){this.goTo(this.potentialIndex+1)}prev(){this.goTo(this.potentialIndex-1)}zoomTo(...t){this.currSlide.zoomTo(...t)}toggleZoom(){this.currSlide.toggleZoom()}close(){this.opener.isOpen&&!this.isDestroying&&(this.isDestroying=!0,this.dispatch("close"),this.events.removeAll(),this.opener.close())}destroy(){if(!this.isDestroying)return this.options.showHideAnimationType="none",void this.close();this.dispatch("destroy"),this.listeners=null,this.scrollWrap.ontouchmove=null,this.scrollWrap.ontouchend=null,this.element.remove(),this.mainScroll.itemHolders.forEach((t=>{t.slide&&t.slide.destroy()})),this.contentLoader.destroy(),this.events.removeAll()}refreshSlideContent(t){this.contentLoader.removeByIndex(t),this.mainScroll.itemHolders.forEach(((i,s)=>{let h=this.currSlide.index-1+s;this.canLoop()&&(h=this.getLoopedIndex(h)),h===t&&(this.setContent(i,t,!0),1===s&&(this.currSlide=i.slide,i.slide.setIsActive(!0)))})),this.dispatch("change")}setContent(t,i,s){if(this.canLoop()&&(i=this.getLoopedIndex(i)),t.slide){if(t.slide.index===i&&!s)return;t.slide.destroy(),t.slide=null}if(!this.canLoop()&&(i<0||i>=this.getNumItems()))return;const h=this.getItemData(i);t.slide=new b(h,i,this),i===this.currIndex&&(this.currSlide=t.slide),t.slide.append(t.el)}getViewportCenterPoint(){return{x:this.viewportSize.x/2,y:this.viewportSize.y/2}}updateSize(t){if(this.isDestroying)return;const s=w(this.options,this);!t&&e(s,this.si)||(i(this.si,s),this.dispatch("beforeResize"),i(this.viewportSize,this.si),this.oi(),this.dispatch("viewportSize"),this.mainScroll.resize(this.opener.isOpen),!this.hasMouse&&window.matchMedia("(any-hover: hover)").matches&&this.mouseDetected(),this.dispatch("resize"))}applyBgOpacity(t){this.bgOpacity=Math.max(t,0),this.bg.style.opacity=String(this.bgOpacity*this.options.bgOpacity)}mouseDetected(){this.hasMouse||(this.hasMouse=!0,this.element.classList.add("pswp--has_mouse"))}ni(){this.updateSize(),/iPhone|iPad|iPod/i.test(window.navigator.userAgent)&&setTimeout((()=>{this.updateSize()}),500)}oi(){this.setScrollOffset(0,window.pageYOffset)}setScrollOffset(t,i){this.offset.x=t,this.offset.y=i,this.dispatch("updateScrollOffset")}hi(){this.element=t("pswp"),this.element.setAttribute("tabindex","-1"),this.element.setAttribute("role","dialog"),this.template=this.element,this.bg=t("pswp__bg",!1,this.element),this.scrollWrap=t("pswp__scroll-wrap",!1,this.element),this.container=t("pswp__container",!1,this.scrollWrap),this.mainScroll.appendHolders(),this.ui=new q(this),this.ui.init(),(this.options.appendToEl||document.body).appendChild(this.element)}getThumbBounds(){return function(t,i,s){const h=s.dispatch("thumbBounds",{index:t,itemData:i,instance:s});if(h.thumbBounds)return h.thumbBounds;const{element:e}=i;let n,o;if(e&&!1!==s.options.thumbSelector){const t=s.options.thumbSelector||"img";o=e.matches(t)?e:e.querySelector(t)}return o=s.applyFilters("thumbEl",o,i,t),o&&(n=i.thumbCropped?function(t,i,s){const h=t.getBoundingClientRect(),e=h.width/i,n=h.height/s,o=e>n?e:n,r=(h.width-i*o)/2,a=(h.height-s*o)/2,c={x:h.left+r,y:h.top+a,w:i*o};return c.innerRect={w:h.width,h:h.height,x:r,y:a},c}(o,i.width||i.w,i.height||i.h):function(t){const i=t.getBoundingClientRect();return{x:i.left,y:i.top,w:i.width}}(o)),s.applyFilters("thumbBounds",n,i,t)}(this.currIndex,this.currSlide?this.currSlide.data:this.ei,this)}canLoop(){return this.options.loop&&this.getNumItems()>2}ii(t){window.matchMedia("(prefers-reduced-motion), (update: slow)").matches&&(t.showHideAnimationType="none",t.zoomAnimationDuration=0),this.options={...$,...t}}}export{J as default}; |
| { | ||
| "name": "photoswipe", | ||
| "version": "5.2.4", | ||
| "version": "5.2.5", | ||
| "main": "dist/photoswipe.esm.js", | ||
| "style": "dist/photoswipe.css", | ||
| "type": "module", | ||
| "types": "./dist/types/photoswipe.d.ts", | ||
| "exports": { | ||
| ".": "./dist/photoswipe.esm.js", | ||
| "./lightbox": "./dist/photoswipe-lightbox.esm.js", | ||
| ".": { | ||
| "types": "./dist/types/photoswipe.d.ts", | ||
| "import": "./dist/photoswipe.esm.js" | ||
| }, | ||
| "./lightbox": { | ||
| "types": "./dist/types/lightbox/lightbox.d.ts", | ||
| "import": "./dist/photoswipe-lightbox.esm.js" | ||
| }, | ||
| "./dist/photoswipe.css": "./dist/photoswipe.css", | ||
@@ -14,2 +21,9 @@ "./photoswipe.css": "./dist/photoswipe.css", | ||
| }, | ||
| "typesVersions": { | ||
| "<4.7": { | ||
| "lightbox": [ | ||
| "dist/types/lightbox/lightbox.d.ts" | ||
| ] | ||
| } | ||
| }, | ||
| "files": [ | ||
@@ -27,3 +41,3 @@ "dist", | ||
| "watch-local": "concurrently \"npm:watch-js\" \"npm:watch-css\" \"npm:watch-docs-local\"", | ||
| "build-and-minify-js": "rollup --config build/rollup.config.js", | ||
| "build-and-minify-js": "rollup --config build/rollup.config.js && npm run tsc", | ||
| "watch-js": "rollup --config build/rollup.config.watch.js --watch", | ||
@@ -37,3 +51,4 @@ "build-css": "copyfiles -f src/*.css dist/ && copyfiles -f src/*.css demo-docs-website/static/photoswipe/", | ||
| "lint-auto-fix": "eslint src/js/**/*.js --fix", | ||
| "test": "npm run lint" | ||
| "test": "npm run lint", | ||
| "tsc": "tsc" | ||
| }, | ||
@@ -43,2 +58,3 @@ "devDependencies": { | ||
| "@babel/eslint-parser": "^7.13.14", | ||
| "@babel/plugin-syntax-class-properties": "^7.12.13", | ||
| "chokidar-cli": "^3.0.0", | ||
@@ -52,3 +68,4 @@ "concurrently": "^6.0.2", | ||
| "rollup-plugin-copy": "^3.4.0", | ||
| "rollup-plugin-terser": "^7.0.2" | ||
| "rollup-plugin-terser": "^7.0.2", | ||
| "typescript": "^4.6.4" | ||
| }, | ||
@@ -74,4 +91,3 @@ "repository": { | ||
| "author": "Dmytro Semenov (https://dimsemenov.com)", | ||
| "license": "MIT", | ||
| "dependencies": {} | ||
| "license": "MIT" | ||
| } |
@@ -1,5 +0,1 @@ | ||
| /** | ||
| * PhotoSwipe base class that can retrieve data about every slide. | ||
| * Shared by PhotoSwipe Core and PhotoSwipe Lightbox | ||
| */ | ||
| import Eventable from './eventable'; | ||
@@ -11,6 +7,18 @@ import { | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {import("../photoswipe").PhotoSwipeOptions} PhotoSwipeOptions */ | ||
| /** @typedef {import("../slide/slide").SlideData} SlideData */ | ||
| /** | ||
| * PhotoSwipe base class that can retrieve data about every slide. | ||
| * Shared by PhotoSwipe Core and PhotoSwipe Lightbox | ||
| */ | ||
| class PhotoSwipeBase extends Eventable { | ||
| /** @type {PhotoSwipeOptions} */ | ||
| options; | ||
| /** | ||
| * Get total number of slides | ||
| * | ||
| * @returns {number} | ||
| */ | ||
@@ -22,6 +30,6 @@ getNumItems() { | ||
| numItems = 0; | ||
| } else if (dataSource.length) { | ||
| } else if ('length' in dataSource) { | ||
| // may be an array or just object with length property | ||
| numItems = dataSource.length; | ||
| } else if (dataSource.gallery) { | ||
| } else if ('gallery' in dataSource) { | ||
| // query DOM elements | ||
@@ -45,3 +53,8 @@ if (!dataSource.items) { | ||
| /** | ||
| * @param {SlideData} slideData | ||
| * @param {number} index | ||
| */ | ||
| createContentFromData(slideData, index) { | ||
| // @ts-expect-error | ||
| return new Content(slideData, this, index); | ||
@@ -57,3 +70,3 @@ } | ||
| * | ||
| * @param {Integer} index | ||
| * @param {number} index | ||
| */ | ||
@@ -69,3 +82,3 @@ getItemData(index) { | ||
| // thus it was created by Lightbox, based on | ||
| // gallerySelecor and childSelector options | ||
| // gallery and children options | ||
@@ -100,3 +113,3 @@ // query DOM elements | ||
| * | ||
| * @param {Element} galleryElement | ||
| * @param {HTMLElement} galleryElement | ||
| */ | ||
@@ -118,6 +131,7 @@ _getGalleryDOMElements(galleryElement) { | ||
| * | ||
| * @param {Element} element DOM element | ||
| * @param {HTMLElement} element DOM element | ||
| */ | ||
| // eslint-disable-next-line class-methods-use-this | ||
| _domElementToItemData(element) { | ||
| /** @type {SlideData} */ | ||
| const itemData = { | ||
@@ -127,3 +141,4 @@ element | ||
| const linkEl = element.tagName === 'A' ? element : element.querySelector('a'); | ||
| // eslint-disable-next-line max-len | ||
| const linkEl = /** @type {HTMLAnchorElement} */ (element.tagName === 'A' ? element : element.querySelector('a')); | ||
@@ -130,0 +145,0 @@ if (linkEl) { |
@@ -0,5 +1,208 @@ | ||
| /** @typedef {import("../lightbox/lightbox").default} PhotoSwipeLightbox */ | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {import("../photoswipe").DataSource} DataSource */ | ||
| /** @typedef {import("../ui/ui-element").UIElementData} UIElementData */ | ||
| /** @typedef {import("../slide/content").default} ContentDefault */ | ||
| /** @typedef {import("../slide/slide").default} Slide */ | ||
| /** @typedef {import("../slide/slide").SlideData} SlideData */ | ||
| /** @typedef {import("../slide/zoom-level").default} ZoomLevel */ | ||
| /** @typedef {import("../slide/get-thumb-bounds").Bounds} Bounds */ | ||
| /** | ||
| * Allow adding an arbitrary props to the Content | ||
| * https://photoswipe.com/custom-content/#using-webp-image-format | ||
| * @typedef {ContentDefault & Record<string, any>} Content | ||
| */ | ||
| /** @typedef {{ x?: number; y?: number }} Point */ | ||
| /** | ||
| * @typedef {Object} PhotoSwipeEventsMap https://photoswipe.com/events/ | ||
| * | ||
| * | ||
| * https://photoswipe.com/adding-ui-elements/ | ||
| * | ||
| * @prop {undefined} uiRegister | ||
| * @prop {{ data: UIElementData }} uiElementCreate | ||
| * | ||
| * | ||
| * https://photoswipe.com/events/#initialization-events | ||
| * | ||
| * @prop {undefined} beforeOpen | ||
| * @prop {undefined} firstUpdate | ||
| * @prop {undefined} initialLayout | ||
| * @prop {undefined} change | ||
| * @prop {undefined} afterInit | ||
| * @prop {undefined} bindEvents | ||
| * | ||
| * | ||
| * https://photoswipe.com/events/#opening-or-closing-transition-events | ||
| * | ||
| * @prop {undefined} openingAnimationStart | ||
| * @prop {undefined} openingAnimationEnd | ||
| * @prop {undefined} closingAnimationStart | ||
| * @prop {undefined} closingAnimationEnd | ||
| * | ||
| * | ||
| * https://photoswipe.com/events/#closing-events | ||
| * | ||
| * @prop {undefined} close | ||
| * @prop {undefined} destroy | ||
| * | ||
| * | ||
| * https://photoswipe.com/events/#pointer-and-gesture-events | ||
| * | ||
| * @prop {{ originalEvent: PointerEvent }} pointerDown | ||
| * @prop {{ originalEvent: PointerEvent }} pointerMove | ||
| * @prop {{ originalEvent: PointerEvent }} pointerUp | ||
| * @prop {{ bgOpacity: number }} pinchClose can be default prevented | ||
| * @prop {{ panY: number }} verticalDrag can be default prevented | ||
| * | ||
| * | ||
| * https://photoswipe.com/events/#slide-content-events | ||
| * | ||
| * @prop {{ content: Content }} contentInit | ||
| * @prop {{ content: Content; isLazy: boolean }} contentLoad can be default prevented | ||
| * @prop {{ content: Content; isLazy: boolean }} contentLoadImage can be default prevented | ||
| * @prop {{ content: Content; slide: Slide; isError?: boolean }} loadComplete | ||
| * @prop {{ content: Content; slide: Slide }} loadError | ||
| * @prop {{ content: Content; width: number; height: number }} contentResize can be default prevented | ||
| * @prop {{ content: Content; width: number; height: number; slide: Slide }} imageSizeChange | ||
| * @prop {{ content: Content }} contentLazyLoad can be default prevented | ||
| * @prop {{ content: Content }} contentAppend can be default prevented | ||
| * @prop {{ content: Content }} contentActivate can be default prevented | ||
| * @prop {{ content: Content }} contentDeactivate can be default prevented | ||
| * @prop {{ content: Content }} contentRemove can be default prevented | ||
| * @prop {{ content: Content }} contentDestroy can be default prevented | ||
| * | ||
| * | ||
| * undocumented | ||
| * | ||
| * @prop {{ point: Point; originalEvent: PointerEvent }} imageClickAction can be default prevented | ||
| * @prop {{ point: Point; originalEvent: PointerEvent }} bgClickAction can be default prevented | ||
| * @prop {{ point: Point; originalEvent: PointerEvent }} tapAction can be default prevented | ||
| * @prop {{ point: Point; originalEvent: PointerEvent }} doubleTapAction can be default prevented | ||
| * | ||
| * @prop {{ originalEvent: KeyboardEvent }} keydown can be default prevented | ||
| * @prop {{ x: number; dragging: boolean }} moveMainScroll | ||
| * @prop {{ slide: Slide }} firstZoomPan | ||
| * @prop {{ slide: Slide, data: SlideData, index: number }} gettingData | ||
| * @prop {undefined} beforeResize | ||
| * @prop {undefined} resize | ||
| * @prop {undefined} viewportSize | ||
| * @prop {undefined} updateScrollOffset | ||
| * @prop {{ slide: Slide }} slideInit | ||
| * @prop {{ slide: Slide }} afterSetContent | ||
| * @prop {{ slide: Slide }} slideLoad | ||
| * @prop {{ slide: Slide }} appendHeavy can be default prevented | ||
| * @prop {{ slide: Slide }} appendHeavyContent | ||
| * @prop {{ slide: Slide }} slideActivate | ||
| * @prop {{ slide: Slide }} slideDeactivate | ||
| * @prop {{ slide: Slide }} slideDestroy | ||
| * @prop {{ destZoomLevel: number, centerPoint: Point, transitionDuration: number | false }} beforeZoomTo | ||
| * @prop {{ slide: Slide }} zoomPanUpdate | ||
| * @prop {{ slide: Slide }} initialZoomPan | ||
| * @prop {{ slide: Slide }} calcSlideSize | ||
| * @prop {undefined} resolutionChanged | ||
| * @prop {{ originalEvent: WheelEvent }} wheel can be default prevented | ||
| * @prop {{ content: Content }} contentAppendImage can be default prevented | ||
| * @prop {{ index: number; itemData: SlideData }} lazyLoadSlide can be default prevented | ||
| * @prop {undefined} lazyLoad | ||
| * @prop {{ slide: Slide }} calcBounds | ||
| * @prop {{ zoomLevels: ZoomLevel, slideData: SlideData }} zoomLevelsUpdate | ||
| * | ||
| * | ||
| * legacy | ||
| * | ||
| * @prop {undefined} init | ||
| * @prop {undefined} initialZoomIn | ||
| * @prop {undefined} initialZoomOut | ||
| * @prop {undefined} initialZoomInEnd | ||
| * @prop {undefined} initialZoomOutEnd | ||
| * @prop {{ dataSource: DataSource, numItems: number }} numItems | ||
| * @prop {{ itemData: SlideData; index: number }} itemData | ||
| * @prop {{ index: number, itemData: SlideData, instance: PhotoSwipe }} thumbBounds | ||
| */ | ||
| /** | ||
| * @typedef {Object} PhotoSwipeFiltersMap https://photoswipe.com/filters/ | ||
| * | ||
| * @prop {(numItems: number, dataSource: DataSource) => number} numItems | ||
| * Modify the total amount of slides. Example on Data sources page. | ||
| * https://photoswipe.com/filters/#numitems | ||
| * | ||
| * @prop {(itemData: SlideData, index: number) => SlideData} itemData | ||
| * Modify slide item data. Example on Data sources page. | ||
| * https://photoswipe.com/filters/#itemdata | ||
| * | ||
| * @prop {(itemData: SlideData, element: HTMLElement, linkEl: HTMLAnchorElement) => SlideData} domItemData | ||
| * Modify item data when it's parsed from DOM element. Example on Data sources page. | ||
| * https://photoswipe.com/filters/#domitemdata | ||
| * | ||
| * @prop {(clickedIndex: number, e: MouseEvent, instance: PhotoSwipeLightbox) => number} clickedIndex | ||
| * Modify clicked gallery item index. | ||
| * https://photoswipe.com/filters/#clickedindex | ||
| * | ||
| * @prop {(placeholderSrc: string | false, content: Content) => string | false} placeholderSrc | ||
| * Modify placeholder image source. | ||
| * https://photoswipe.com/filters/#placeholdersrc | ||
| * | ||
| * @prop {(isContentLoading: boolean, content: Content) => boolean} isContentLoading | ||
| * Modify if the content is currently loading. | ||
| * https://photoswipe.com/filters/#iscontentloading | ||
| * | ||
| * @prop {(isContentZoomable: boolean, content: Content) => boolean} isContentZoomable | ||
| * Modify if the content can be zoomed. | ||
| * https://photoswipe.com/filters/#iscontentzoomable | ||
| * | ||
| * @prop {(useContentPlaceholder: boolean, content: Content) => boolean} useContentPlaceholder | ||
| * Modify if the placeholder should be used for the content. | ||
| * https://photoswipe.com/filters/#usecontentplaceholder | ||
| * | ||
| * @prop {(isKeepingPlaceholder: boolean, content: Content) => boolean} isKeepingPlaceholder | ||
| * Modify if the placeholder should be kept after the content is loaded. | ||
| * https://photoswipe.com/filters/#iskeepingplaceholder | ||
| * | ||
| * | ||
| * @prop {(contentErrorElement: HTMLElement, content: Content) => HTMLElement} contentErrorElement | ||
| * Modify an element when the content has error state (for example, if image cannot be loaded). | ||
| * https://photoswipe.com/filters/#contenterrorelement | ||
| * | ||
| * @prop {(element: HTMLElement, data: UIElementData) => HTMLElement} uiElement | ||
| * Modify a UI element that's being created. | ||
| * https://photoswipe.com/filters/#uielement | ||
| * | ||
| * @prop {(thumbnail: HTMLElement, itemData: SlideData, index: number) => HTMLElement} thumbEl | ||
| * Modify the thubmnail element from which opening zoom animation starts or ends. | ||
| * https://photoswipe.com/filters/#thumbel | ||
| * | ||
| * @prop {(thumbBounds: Bounds, itemData: SlideData, index: number) => Bounds} thumbBounds | ||
| * Modify the thubmnail bounds from which opening zoom animation starts or ends. | ||
| * https://photoswipe.com/filters/#thumbbounds | ||
| */ | ||
| /** | ||
| * @template {keyof PhotoSwipeFiltersMap} T | ||
| * @typedef {{ fn: PhotoSwipeFiltersMap[T], priority: number }} Filter<T> | ||
| */ | ||
| /** | ||
| * @template {keyof PhotoSwipeEventsMap} T | ||
| * @typedef {PhotoSwipeEventsMap[T] extends undefined ? PhotoSwipeEvent<T> : PhotoSwipeEvent<T> & PhotoSwipeEventsMap[T]} AugmentedEvent | ||
| */ | ||
| /** | ||
| * @template {keyof PhotoSwipeEventsMap} T | ||
| * @typedef {(event: AugmentedEvent<T>) => void} EventCallback<T> | ||
| */ | ||
| /** | ||
| * Base PhotoSwipe event object | ||
| * | ||
| * @template {keyof PhotoSwipeEventsMap} T | ||
| */ | ||
| class PhotoSwipeEvent { | ||
| /** | ||
| * @param {T} type | ||
| * @param {PhotoSwipeEventsMap[T]} [details] | ||
| */ | ||
| constructor(type, details) { | ||
@@ -23,6 +226,22 @@ this.type = type; | ||
| constructor() { | ||
| /** | ||
| * @type {{ [T in keyof PhotoSwipeEventsMap]?: ((event: AugmentedEvent<T>) => void)[] }} | ||
| */ | ||
| this._listeners = {}; | ||
| /** | ||
| * @type {{ [T in keyof PhotoSwipeFiltersMap]?: Filter<T>[] }} | ||
| */ | ||
| this._filters = {}; | ||
| /** @type {PhotoSwipe=} */ | ||
| this.pswp = undefined; | ||
| } | ||
| /** | ||
| * @template {keyof PhotoSwipeFiltersMap} T | ||
| * @param {T} name | ||
| * @param {PhotoSwipeFiltersMap[T]} fn | ||
| * @param {number} priority | ||
| */ | ||
| addFilter(name, fn, priority = 100) { | ||
@@ -41,4 +260,10 @@ if (!this._filters[name]) { | ||
| /** | ||
| * @template {keyof PhotoSwipeFiltersMap} T | ||
| * @param {T} name | ||
| * @param {PhotoSwipeFiltersMap[T]} fn | ||
| */ | ||
| removeFilter(name, fn) { | ||
| if (this._filters[name]) { | ||
| // @ts-expect-error | ||
| this._filters[name] = this._filters[name].filter(filter => (filter.fn !== fn)); | ||
@@ -52,5 +277,12 @@ } | ||
| /** | ||
| * @template {keyof PhotoSwipeFiltersMap} T | ||
| * @param {T} name | ||
| * @param {Parameters<PhotoSwipeFiltersMap[T]>} args | ||
| * @returns {Parameters<PhotoSwipeFiltersMap[T]>[0]} | ||
| */ | ||
| applyFilters(name, ...args) { | ||
| if (this._filters[name]) { | ||
| this._filters[name].forEach((filter) => { | ||
| // @ts-expect-error | ||
| args[0] = filter.fn.apply(this, args); | ||
@@ -62,2 +294,7 @@ }); | ||
| /** | ||
| * @template {keyof PhotoSwipeEventsMap} T | ||
| * @param {T} name | ||
| * @param {EventCallback<T>} fn | ||
| */ | ||
| on(name, fn) { | ||
@@ -77,4 +314,10 @@ if (!this._listeners[name]) { | ||
| /** | ||
| * @template {keyof PhotoSwipeEventsMap} T | ||
| * @param {T} name | ||
| * @param {EventCallback<T>} fn | ||
| */ | ||
| off(name, fn) { | ||
| if (this._listeners[name]) { | ||
| // @ts-expect-error | ||
| this._listeners[name] = this._listeners[name].filter(listener => (fn !== listener)); | ||
@@ -88,2 +331,8 @@ } | ||
| /** | ||
| * @template {keyof PhotoSwipeEventsMap} T | ||
| * @param {T} name | ||
| * @param {PhotoSwipeEventsMap[T]} [details] | ||
| * @returns {AugmentedEvent<T>} | ||
| */ | ||
| dispatch(name, details) { | ||
@@ -94,3 +343,3 @@ if (this.pswp) { | ||
| const event = new PhotoSwipeEvent(name, details); | ||
| const event = /** @type {AugmentedEvent<T>} */ (new PhotoSwipeEvent(name, details)); | ||
@@ -97,0 +346,0 @@ if (!this._listeners) { |
@@ -1,5 +0,1 @@ | ||
| /** | ||
| * Handles single pointer dragging | ||
| */ | ||
| import { | ||
@@ -9,2 +5,5 @@ equalizePoints, roundPoint, clamp | ||
| /** @typedef {import("../photoswipe").Point} Point */ | ||
| /** @typedef {import("./gestures").default} Gestures */ | ||
| const PAN_END_FRICTION = 0.35; | ||
@@ -20,2 +19,6 @@ const VERTICAL_DRAG_FRICTION = 0.6; | ||
| /** | ||
| * @param {number} initialVelocity | ||
| * @param {number} decelerationRate | ||
| */ | ||
| function project(initialVelocity, decelerationRate) { | ||
@@ -25,6 +28,13 @@ return initialVelocity * decelerationRate / (1 - decelerationRate); | ||
| /** | ||
| * Handles single pointer dragging | ||
| */ | ||
| class DragHandler { | ||
| /** | ||
| * @param {Gestures} gestures | ||
| */ | ||
| constructor(gestures) { | ||
| this.gestures = gestures; | ||
| this.pswp = gestures.pswp; | ||
| /** @type {Point} */ | ||
| this.startPan = {}; | ||
@@ -120,2 +130,6 @@ } | ||
| /** | ||
| * @private | ||
| * @param {'x' | 'y'} axis | ||
| */ | ||
| _finishPanGestureForAxis(axis) { | ||
@@ -199,3 +213,4 @@ const { pswp } = this; | ||
| * | ||
| * @param {String} axis | ||
| * @private | ||
| * @param {'x' | 'y'} axis | ||
| */ | ||
@@ -300,3 +315,4 @@ _panOrMoveMainScroll(axis) { | ||
| * | ||
| * @param {Number} panY The current pan Y position. | ||
| * @private | ||
| * @param {number} panY The current pan Y position. | ||
| */ | ||
@@ -313,5 +329,6 @@ _getVerticalDragRatio(panY) { | ||
| * | ||
| * @param {String} axis | ||
| * @param {Number} potentialPan | ||
| * @param {Number|null} customFriction (0.1 - 1) | ||
| * @private | ||
| * @param {'x' | 'y'} axis | ||
| * @param {number} potentialPan | ||
| * @param {number=} customFriction (0.1 - 1) | ||
| */ | ||
@@ -318,0 +335,0 @@ _setPanWithFriction(axis, potentialPan, customFriction) { |
@@ -1,8 +0,1 @@ | ||
| /** | ||
| * Gestures class bind touch, pointer or mouse events | ||
| * and emits drag to drag-handler and zoom events zoom-handler. | ||
| * | ||
| * Drag and zoom events are emited in requestAnimationFrame, | ||
| * and only when one of pointers was actually changed. | ||
| */ | ||
| import { | ||
@@ -16,2 +9,5 @@ equalizePoints, pointsEqual, getDistanceBetween | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {import("../photoswipe").Point} Point */ | ||
| // How far should user should drag | ||
@@ -25,3 +21,16 @@ // until we can determine that the gesture is swipe and its direction | ||
| /** | ||
| * Gestures class bind touch, pointer or mouse events | ||
| * and emits drag to drag-handler and zoom events zoom-handler. | ||
| * | ||
| * Drag and zoom events are emited in requestAnimationFrame, | ||
| * and only when one of pointers was actually changed. | ||
| */ | ||
| class Gestures { | ||
| /** @type {'x' | 'y'} */ | ||
| dragAxis; | ||
| /** | ||
| * @param {PhotoSwipe} pswp | ||
| */ | ||
| constructor(pswp) { | ||
@@ -33,13 +42,23 @@ this.pswp = pswp; | ||
| // PhotoSwipe keeps track only of two pointers, others are ignored | ||
| /** @type {Point} */ | ||
| this.p1 = {}; // the first pressed pointer | ||
| /** @type {Point} */ | ||
| this.p2 = {}; // the second pressed pointer | ||
| /** @type {Point} */ | ||
| this.prevP1 = {}; | ||
| /** @type {Point} */ | ||
| this.prevP2 = {}; | ||
| /** @type {Point} */ | ||
| this.startP1 = {}; | ||
| /** @type {Point} */ | ||
| this.startP2 = {}; | ||
| /** @type {Point} */ | ||
| this.velocity = {}; | ||
| /** @type {Point} */ | ||
| this._lastStartP1 = {}; | ||
| /** @type {Point} */ | ||
| this._intervalP1 = {}; | ||
| this._numActivePoints = 0; | ||
| /** @type {Point[]} */ | ||
| this._ongoingPointers = []; | ||
@@ -85,2 +104,9 @@ | ||
| /** | ||
| * | ||
| * @param {'mouse' | 'touch' | 'pointer'} pref | ||
| * @param {'down' | 'start'} down | ||
| * @param {'up' | 'end'} up | ||
| * @param {'cancel'} [cancel] | ||
| */ | ||
| _bindEvents(pref, down, up, cancel) { | ||
@@ -100,3 +126,5 @@ const { pswp } = this; | ||
| /** | ||
| * @param {PointerEvent} e | ||
| */ | ||
| onPointerDown(e) { | ||
@@ -163,2 +191,5 @@ // We do not call preventDefault for touch events | ||
| /** | ||
| * @param {PointerEvent} e | ||
| */ | ||
| onPointerMove(e) { | ||
@@ -220,2 +251,5 @@ e.preventDefault(); // always preventDefault move event | ||
| /** | ||
| * @private | ||
| */ | ||
| _finishDrag() { | ||
@@ -236,3 +270,5 @@ if (this.isDragging) { | ||
| /** | ||
| * @param {PointerEvent} e | ||
| */ | ||
| onPointerUp(e) { | ||
@@ -273,3 +309,5 @@ if (!this._numActivePoints) { | ||
| /** | ||
| * @private | ||
| */ | ||
| _rafRenderLoop() { | ||
@@ -298,2 +336,4 @@ if (this.isDragging || this.isZooming) { | ||
| * Update velocity at 50ms interval | ||
| * | ||
| * @param {boolean=} force | ||
| */ | ||
@@ -317,2 +357,6 @@ _updateVelocity(force) { | ||
| /** | ||
| * @private | ||
| * @param {PointerEvent} e | ||
| */ | ||
| _finishTap(e) { | ||
@@ -361,2 +405,5 @@ const { mainScroll } = this.pswp; | ||
| /** | ||
| * @private | ||
| */ | ||
| _clearTapTimer() { | ||
@@ -372,4 +419,5 @@ if (this._tapTimer) { | ||
| * | ||
| * @param {Number} axis | ||
| * @param {Number} duration | ||
| * @private | ||
| * @param {'x' | 'y'} axis | ||
| * @param {number} duration | ||
| */ | ||
@@ -387,2 +435,5 @@ _getVelocity(axis, duration) { | ||
| /** | ||
| * @private | ||
| */ | ||
| _rafStopLoop() { | ||
@@ -395,3 +446,6 @@ if (this.raf) { | ||
| // eslint-disable-next-line class-methods-use-this | ||
| /** | ||
| * @private | ||
| * @param {PointerEvent} e | ||
| */ | ||
| _preventPointerEventBehaviour(e) { | ||
@@ -408,10 +462,12 @@ // TODO find a way to disable e.preventDefault on some elements | ||
| * | ||
| * @param {Event} e | ||
| * @param {String} pointerType Normalized pointer type ('up', 'down' or 'move') | ||
| * @private | ||
| * @param {PointerEvent | TouchEvent} e | ||
| * @param {'up' | 'down' | 'move'} pointerType Normalized pointer type | ||
| */ | ||
| _updatePoints(e, pointerType) { | ||
| if (this._pointerEventEnabled) { | ||
| const pointerEvent = /** @type {PointerEvent} */ (e); | ||
| // Try to find the current pointer in ongoing pointers by its ID | ||
| const pointerIndex = this._ongoingPointers.findIndex((ongoingPoiner) => { | ||
| return ongoingPoiner.id === e.pointerId; | ||
| return ongoingPoiner.id === pointerEvent.pointerId; | ||
| }); | ||
@@ -424,6 +480,6 @@ | ||
| // add new pointer | ||
| this._ongoingPointers.push(this._convertEventPosToPoint(e, {})); | ||
| this._ongoingPointers.push(this._convertEventPosToPoint(pointerEvent, {})); | ||
| } else if (pointerIndex > -1) { | ||
| // update existing pointer | ||
| this._convertEventPosToPoint(e, this._ongoingPointers[pointerIndex]); | ||
| this._convertEventPosToPoint(pointerEvent, this._ongoingPointers[pointerIndex]); | ||
| } | ||
@@ -443,11 +499,13 @@ | ||
| } else { | ||
| const touchEvent = /** @type {TouchEvent} */ (e); | ||
| this._numActivePoints = 0; | ||
| if (e.type.indexOf('touch') > -1) { | ||
| if (touchEvent.type.indexOf('touch') > -1) { | ||
| // Touch Event | ||
| // https://developer.mozilla.org/en-US/docs/Web/API/TouchEvent | ||
| if (e.touches && e.touches.length > 0) { | ||
| this._convertEventPosToPoint(e.touches[0], this.p1); | ||
| if (touchEvent.touches && touchEvent.touches.length > 0) { | ||
| this._convertEventPosToPoint(touchEvent.touches[0], this.p1); | ||
| this._numActivePoints++; | ||
| if (e.touches.length > 1) { | ||
| this._convertEventPosToPoint(e.touches[1], this.p2); | ||
| if (touchEvent.touches.length > 1) { | ||
| this._convertEventPosToPoint(touchEvent.touches[1], this.p2); | ||
| this._numActivePoints++; | ||
@@ -458,3 +516,3 @@ } | ||
| // Mouse Event | ||
| this._convertEventPosToPoint(e, this.p1); | ||
| this._convertEventPosToPoint(/** @type {PointerEvent} */ (e), this.p1); | ||
| if (pointerType === 'up') { | ||
@@ -506,3 +564,4 @@ // clear all points on mouseup | ||
| * | ||
| * @param {Event} e | ||
| * @private | ||
| * @param {Touch | PointerEvent} e | ||
| * @param {Point} p | ||
@@ -514,4 +573,3 @@ */ | ||
| // e.pointerId can be zero | ||
| if (e.pointerId !== undefined) { | ||
| if ('pointerId' in e) { | ||
| p.id = e.pointerId; | ||
@@ -525,2 +583,6 @@ } else if (e.identifier !== undefined) { | ||
| /** | ||
| * @private | ||
| * @param {PointerEvent} e | ||
| */ | ||
| _onClick(e) { | ||
@@ -527,0 +589,0 @@ // Do not allow click event to pass through after drag |
| /** | ||
| * Tap, double-tap handler. | ||
| * @template T | ||
| * @template P | ||
| * @typedef {import("../types").AddPostfix<T, P>} AddPostfix<T, P> | ||
| */ | ||
| /** @typedef {import("./gestures").default} Gestures */ | ||
| /** @typedef {'imageClick' | 'bgClick' | 'tap' | 'doubleTap'} Actions */ | ||
| /** @typedef {{ x?: number; y?: number }} Point */ | ||
| /** | ||
@@ -9,9 +16,15 @@ * Whether the tap was performed on the main slide | ||
| * | ||
| * @param {Event} event | ||
| * @param {PointerEvent} event | ||
| */ | ||
| function didTapOnMainContent(event) { | ||
| return !!(event.target.closest('.pswp__container')); | ||
| return !!(/** @type {HTMLElement} */ (event.target).closest('.pswp__container')); | ||
| } | ||
| /** | ||
| * Tap, double-tap handler. | ||
| */ | ||
| class TapHandler { | ||
| /** | ||
| * @param {Gestures} gestures | ||
| */ | ||
| constructor(gestures) { | ||
@@ -21,5 +34,8 @@ this.gestures = gestures; | ||
| /** | ||
| * @param {Point} point | ||
| * @param {PointerEvent} originalEvent | ||
| */ | ||
| click(point, originalEvent) { | ||
| const targetClassList = originalEvent.target.classList; | ||
| const targetClassList = /** @type {HTMLElement} */ (originalEvent.target).classList; | ||
| const isImageClick = targetClassList.contains('pswp__img'); | ||
@@ -36,2 +52,6 @@ const isBackgroundClick = targetClassList.contains('pswp__item') | ||
| /** | ||
| * @param {Point} point | ||
| * @param {PointerEvent} originalEvent | ||
| */ | ||
| tap(point, originalEvent) { | ||
@@ -43,2 +63,6 @@ if (didTapOnMainContent(originalEvent)) { | ||
| /** | ||
| * @param {Point} point | ||
| * @param {PointerEvent} originalEvent | ||
| */ | ||
| doubleTap(point, originalEvent) { | ||
@@ -50,8 +74,14 @@ if (didTapOnMainContent(originalEvent)) { | ||
| /** | ||
| * @param {Actions} actionName | ||
| * @param {Point} point | ||
| * @param {PointerEvent} originalEvent | ||
| */ | ||
| _doClickOrTapAction(actionName, point, originalEvent) { | ||
| const { pswp } = this.gestures; | ||
| const { currSlide } = pswp; | ||
| const optionValue = pswp.options[actionName + 'Action']; | ||
| const actionFullName = /** @type {AddPostfix<Actions, 'Action'>} */ (actionName + 'Action'); | ||
| const optionValue = pswp.options[actionFullName]; | ||
| if (pswp.dispatch(actionName + 'Action', { point, originalEvent }).defaultPrevented) { | ||
| if (pswp.dispatch(actionFullName, { point, originalEvent }).defaultPrevented) { | ||
| return; | ||
@@ -58,0 +88,0 @@ } |
@@ -5,2 +5,5 @@ import { | ||
| /** @typedef {import("../photoswipe").Point} Point */ | ||
| /** @typedef {import("./gestures").default} Gestures */ | ||
| const UPPER_ZOOM_FRICTION = 0.05; | ||
@@ -24,8 +27,14 @@ const LOWER_ZOOM_FRICTION = 0.15; | ||
| class ZoomHandler { | ||
| /** | ||
| * @param {Gestures} gestures | ||
| */ | ||
| constructor(gestures) { | ||
| this.gestures = gestures; | ||
| this.pswp = this.gestures.pswp; | ||
| /** @type {Point} */ | ||
| this._startPan = {}; | ||
| /** @type {Point} */ | ||
| this._startZoomPoint = {}; | ||
| /** @type {Point} */ | ||
| this._zoomPoint = {}; | ||
@@ -100,2 +109,7 @@ } | ||
| /** | ||
| * @private | ||
| * @param {'x' | 'y'} axis | ||
| * @param {number} currZoomLevel | ||
| */ | ||
| _calculatePanForZoomLevel(axis, currZoomLevel) { | ||
@@ -112,4 +126,4 @@ const zoomFactor = currZoomLevel / this._startZoomLevel; | ||
| * | ||
| * @param {Boolean} ignoreGesture Wether gesture coordinates should be ignored | ||
| * when calculating destination pan position. | ||
| * @param {boolean=} ignoreGesture | ||
| * Wether gesture coordinates should be ignored when calculating destination pan position. | ||
| */ | ||
@@ -130,2 +144,3 @@ correctZoomPan(ignoreGesture) { | ||
| /** @type {number} */ | ||
| let destinationZoomLevel; | ||
@@ -132,0 +147,0 @@ let currZoomLevelNeedsChange = true; |
@@ -0,13 +1,18 @@ | ||
| import { specialKeyUsed } from './util/util.js'; | ||
| /** @typedef {import("./photoswipe").default} PhotoSwipe */ | ||
| /** | ||
| * | ||
| * keyboard.js | ||
| * | ||
| * @template T | ||
| * @typedef {import("./types").Methods<T>} Methods<T> | ||
| */ | ||
| /** | ||
| * - Manages keyboard shortcuts. | ||
| * - Heps trap focus within photoswipe. | ||
| * | ||
| */ | ||
| import { specialKeyUsed } from './util/util.js'; | ||
| class Keyboard { | ||
| /** | ||
| * @param {PhotoSwipe} pswp | ||
| */ | ||
| constructor(pswp) { | ||
@@ -29,3 +34,3 @@ this.pswp = pswp; | ||
| const lastActiveElement = document.activeElement; | ||
| const lastActiveElement = /** @type {HTMLElement} */ (document.activeElement); | ||
| pswp.on('destroy', () => { | ||
@@ -47,2 +52,5 @@ if (pswp.options.returnFocus | ||
| /** | ||
| * @param {KeyboardEvent} e | ||
| */ | ||
| _onKeyDown(e) { | ||
@@ -62,3 +70,5 @@ const { pswp } = this; | ||
| /** @type {Methods<PhotoSwipe>} */ | ||
| let keydownAction; | ||
| /** @type {'x' | 'y'} */ | ||
| let axis; | ||
@@ -126,3 +136,3 @@ let isForward; | ||
| * | ||
| * @param {Event} e | ||
| * @param {FocusEvent} e | ||
| */ | ||
@@ -133,3 +143,3 @@ _onFocusIn(e) { | ||
| && template !== e.target | ||
| && !template.contains(e.target)) { | ||
| && !template.contains(/** @type {Node} */ (e.target))) { | ||
| // focus root element | ||
@@ -136,0 +146,0 @@ template.focus(); |
@@ -0,3 +1,29 @@ | ||
| import { | ||
| specialKeyUsed, | ||
| getElementsFromOption, | ||
| isPswpClass | ||
| } from '../util/util.js'; | ||
| import PhotoSwipeBase from '../core/base.js'; | ||
| import { lazyLoadSlide } from '../slide/loader.js'; | ||
| /** | ||
| * PhotoSwipe lightbox | ||
| * @template T | ||
| * @typedef {import("../types").Type<T>} Type<T> | ||
| */ | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {import("../photoswipe").PhotoSwipeOptions} PhotoSwipeOptions */ | ||
| /** @typedef {import("../photoswipe").DataSource} DataSource */ | ||
| /** @typedef {import("../slide/content").default} Content */ | ||
| /** @typedef {import("../core/eventable").PhotoSwipeEventsMap} PhotoSwipeEventsMap */ | ||
| /** @typedef {import("../core/eventable").PhotoSwipeFiltersMap} PhotoSwipeFiltersMap */ | ||
| /** | ||
| * @template T | ||
| * @typedef {import("../core/eventable").EventCallback<T>} EventCallback<T> | ||
| */ | ||
| /** | ||
| * PhotoSwipe Lightbox | ||
| * | ||
@@ -16,15 +42,9 @@ * - If user has unsupported browser it falls back to default browser action (just opens URL) | ||
| */ | ||
| import { | ||
| specialKeyUsed, | ||
| getElementsFromOption, | ||
| isPswpClass | ||
| } from '../util/util.js'; | ||
| import PhotoSwipeBase from '../core/base.js'; | ||
| import { lazyLoadSlide } from '../slide/loader.js'; | ||
| class PhotoSwipeLightbox extends PhotoSwipeBase { | ||
| /** | ||
| * @param {PhotoSwipeOptions} options | ||
| */ | ||
| constructor(options) { | ||
| super(); | ||
| /** @type {PhotoSwipeOptions} */ | ||
| this.options = options || {}; | ||
@@ -34,2 +54,6 @@ this._uid = 0; | ||
| /** | ||
| * Initialize lightbox, should be called only once. | ||
| * It's not included in the main constructor, so you may bind events before it. | ||
| */ | ||
| init() { | ||
@@ -45,2 +69,5 @@ this.onThumbnailsClick = this.onThumbnailsClick.bind(this); | ||
| /** | ||
| * @param {MouseEvent} e | ||
| */ | ||
| onThumbnailsClick(e) { | ||
@@ -70,3 +97,3 @@ // Exit and allow default browser action if: | ||
| const dataSource = { | ||
| gallery: e.currentTarget | ||
| gallery: /** @type {HTMLElement} */ (e.currentTarget) | ||
| }; | ||
@@ -83,3 +110,3 @@ | ||
| * | ||
| * @param {Event} e click event | ||
| * @param {MouseEvent} e click event | ||
| */ | ||
@@ -92,7 +119,7 @@ getClickedIndex(e) { | ||
| const clickedTarget = e.target; | ||
| const clickedTarget = /** @type {HTMLElement} */ (e.target); | ||
| const childElements = getElementsFromOption( | ||
| this.options.children, | ||
| this.options.childSelector, | ||
| e.currentTarget | ||
| /** @type {HTMLElement} */ (e.currentTarget) | ||
| ); | ||
@@ -117,5 +144,5 @@ const clickedChildIndex = childElements.findIndex( | ||
| * | ||
| * @param {Integer} index | ||
| * @param {Array|Object|null} dataSource | ||
| * @param {Point|null} initialPoint | ||
| * @param {number} index | ||
| * @param {DataSource=} dataSource | ||
| * @param {{ x?: number; y?: number }} [initialPoint] | ||
| */ | ||
@@ -142,3 +169,4 @@ loadAndOpen(index, dataSource, initialPoint) { | ||
| * | ||
| * @param {Integer} index | ||
| * @param {number} index | ||
| * @param {DataSource=} dataSource | ||
| */ | ||
@@ -153,2 +181,3 @@ preload(index, dataSource) { | ||
| // Add the main module | ||
| /** @type {Promise<Type<PhotoSwipe>>[]} */ | ||
| const promiseArray = []; | ||
@@ -158,7 +187,7 @@ | ||
| if (isPswpClass(options.pswpModule)) { | ||
| promiseArray.push(options.pswpModule); | ||
| promiseArray.push(Promise.resolve(/** @type {Type<PhotoSwipe>} */ (options.pswpModule))); | ||
| } else if (pswpModuleType === 'string') { | ||
| throw new Error('pswpModule as string is no longer supported'); | ||
| } else if (pswpModuleType === 'function') { | ||
| promiseArray.push(options.pswpModule()); | ||
| promiseArray.push(/** @type {() => Promise<Type<PhotoSwipe>>} */ (options.pswpModule)()); | ||
| } else { | ||
@@ -188,2 +217,7 @@ throw new Error('pswpModule is not valid'); | ||
| /** | ||
| * @private | ||
| * @param {Type<PhotoSwipe> | { default: Type<PhotoSwipe> }} module | ||
| * @param {number} uid | ||
| */ | ||
| _openPhotoswipe(module, uid) { | ||
@@ -206,3 +240,7 @@ // Cancel opening if UID doesn't match the current one | ||
| // Pass data to PhotoSwipe and open init | ||
| /** | ||
| * Pass data to PhotoSwipe and open init | ||
| * | ||
| * @type {PhotoSwipe} | ||
| */ | ||
| const pswp = typeof module === 'object' | ||
@@ -216,5 +254,6 @@ ? new module.default(this.options) // eslint-disable-line | ||
| // map listeners from Lightbox to PhotoSwipe Core | ||
| Object.keys(this._listeners).forEach((name) => { | ||
| /** @type {(keyof PhotoSwipeEventsMap)[]} */ | ||
| (Object.keys(this._listeners)).forEach((name) => { | ||
| this._listeners[name].forEach((fn) => { | ||
| pswp.on(name, fn); | ||
| pswp.on(name, /** @type {EventCallback<typeof name>} */(fn)); | ||
| }); | ||
@@ -224,3 +263,4 @@ }); | ||
| // same with filters | ||
| Object.keys(this._filters).forEach((name) => { | ||
| /** @type {(keyof PhotoSwipeFiltersMap)[]} */ | ||
| (Object.keys(this._filters)).forEach((name) => { | ||
| this._filters[name].forEach((filter) => { | ||
@@ -245,2 +285,5 @@ pswp.addFilter(name, filter.fn, filter.priority); | ||
| /** | ||
| * Unbinds all events, closes PhotoSwipe if it's open. | ||
| */ | ||
| destroy() { | ||
@@ -247,0 +290,0 @@ if (this.pswp) { |
@@ -1,7 +0,1 @@ | ||
| /** | ||
| * Handles movement of the main scrolling container | ||
| * (for example, it repositions when user swipes left or right). | ||
| * | ||
| * Also stores its state. | ||
| */ | ||
| import { | ||
@@ -12,2 +6,7 @@ setTransform, | ||
| /** @typedef {import("./photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {import("./slide/slide").default} Slide */ | ||
| /** @typedef {{ el: HTMLDivElement; slide?: Slide }} ItemHolder */ | ||
| const MAIN_SCROLL_END_FRICTION = 0.35; | ||
@@ -20,3 +19,15 @@ | ||
| /** | ||
| * Handles movement of the main scrolling container | ||
| * (for example, it repositions when user swipes left or right). | ||
| * | ||
| * Also stores its state. | ||
| */ | ||
| class MainScroll { | ||
| /** @type {number} */ | ||
| slideWidth; | ||
| /** @type {ItemHolder[]} */ | ||
| itemHolders; | ||
| /** | ||
@@ -36,3 +47,3 @@ * @param {PhotoSwipe} pswp | ||
| * | ||
| * @param {Boolean} resizeSlides Whether slides content should resized | ||
| * @param {boolean=} resizeSlides Whether slides content should resized | ||
| */ | ||
@@ -121,4 +132,6 @@ resize(resizeSlides) { | ||
| * | ||
| * @param {Integer} diff | ||
| * @returns {Boolean} whether index was changed or not | ||
| * @param {number} diff | ||
| * @param {boolean=} animate | ||
| * @param {number=} velocityX | ||
| * @returns {boolean} whether index was changed or not | ||
| */ | ||
@@ -291,7 +304,9 @@ moveIndexBy(diff, animate, velocityX) { | ||
| * | ||
| * @param {Number} x | ||
| * @param {Boolean} dragging | ||
| * @param {number} x | ||
| * @param {boolean=} dragging | ||
| */ | ||
| moveTo(x, dragging) { | ||
| /** @type {number} */ | ||
| let newSlideIndexOffset; | ||
| /** @type {number} */ | ||
| let delta; | ||
@@ -298,0 +313,0 @@ |
@@ -1,7 +0,1 @@ | ||
| /** | ||
| * Manages opening and closing transitions of the PhotoSwipe. | ||
| * | ||
| * It can perform zoom, fade or no transition. | ||
| */ | ||
| import { | ||
@@ -14,2 +8,6 @@ setTransform, | ||
| /** @typedef {import("./photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {import("./slide/get-thumb-bounds").Bounds} Bounds */ | ||
| /** @typedef {import("./util/animations").AnimationProps} AnimationProps */ | ||
| // some browsers do not paint | ||
@@ -21,3 +19,14 @@ // elements which opacity is set to 0, | ||
| /** | ||
| * Manages opening and closing transitions of the PhotoSwipe. | ||
| * | ||
| * It can perform zoom, fade or no transition. | ||
| */ | ||
| class Opener { | ||
| /** @type {false | Bounds} */ | ||
| _thumbBounds; | ||
| /** | ||
| * @param {PhotoSwipe} pswp | ||
| */ | ||
| constructor(pswp) { | ||
@@ -125,3 +134,3 @@ this.pswp = pswp; | ||
| if (this.isOpening) { | ||
| pswp.element.style.opacity = MIN_OPACITY; | ||
| pswp.element.style.opacity = String(MIN_OPACITY); | ||
| pswp.applyBgOpacity(1); | ||
@@ -132,3 +141,3 @@ } | ||
| if (this._animateZoom && this._thumbBounds.innerRect) { | ||
| if (this._animateZoom && this._thumbBounds && this._thumbBounds.innerRect) { | ||
| // Properties are used when animation from cropped thumbnail | ||
@@ -148,9 +157,9 @@ this._croppedZoom = true; | ||
| if (this._animateRootOpacity) { | ||
| pswp.element.style.opacity = MIN_OPACITY; | ||
| pswp.element.style.opacity = String(MIN_OPACITY); | ||
| pswp.applyBgOpacity(1); | ||
| } else { | ||
| if (this._animateBgOpacity) { | ||
| pswp.bg.style.opacity = MIN_OPACITY; | ||
| pswp.bg.style.opacity = String(MIN_OPACITY); | ||
| } | ||
| pswp.element.style.opacity = 1; | ||
| pswp.element.style.opacity = '1'; | ||
| } | ||
@@ -162,7 +171,7 @@ | ||
| // tell browser that we plan to animate the placeholder | ||
| this._placeholder.willChange = 'transform'; | ||
| this._placeholder.style.willChange = 'transform'; | ||
| // hide placeholder to allow hiding of | ||
| // elements that overlap it (such as icons over the thumbnail) | ||
| this._placeholder.style.opacity = MIN_OPACITY; | ||
| this._placeholder.style.opacity = String(MIN_OPACITY); | ||
| } | ||
@@ -200,3 +209,3 @@ } | ||
| let isDelaying = true; | ||
| decodeImage(this._placeholder).finally(() => { | ||
| decodeImage(/** @type {HTMLImageElement} */ (this._placeholder)).finally(() => { | ||
| decoded = true; | ||
@@ -228,3 +237,6 @@ if (!isDelaying) { | ||
| // legacy event | ||
| this.pswp.dispatch('initialZoom' + (this.isOpening ? 'In' : 'Out')); | ||
| this.pswp.dispatch( | ||
| /** @type {'initialZoomIn' | 'initialZoomOut'} */ | ||
| ('initialZoom' + (this.isOpening ? 'In' : 'Out')) | ||
| ); | ||
@@ -236,3 +248,3 @@ this.pswp.element.classList[this.isOpening ? 'add' : 'remove']('pswp--ui-visible'); | ||
| // unhide the placeholder | ||
| this._placeholder.style.opacity = 1; | ||
| this._placeholder.style.opacity = '1'; | ||
| } | ||
@@ -261,3 +273,6 @@ this._animateToOpenState(); | ||
| // legacy event | ||
| pswp.dispatch('initialZoom' + (this.isOpen ? 'InEnd' : 'OutEnd')); | ||
| pswp.dispatch( | ||
| /** @type {'initialZoomInEnd' | 'initialZoomOutEnd'} */ | ||
| ('initialZoom' + (this.isOpen ? 'InEnd' : 'OutEnd')) | ||
| ); | ||
@@ -292,7 +307,7 @@ if (this.isClosed) { | ||
| if (this._animateBgOpacity) { | ||
| this._animateTo(pswp.bg, 'opacity', pswp.options.bgOpacity); | ||
| this._animateTo(pswp.bg, 'opacity', String(pswp.options.bgOpacity)); | ||
| } | ||
| if (this._animateRootOpacity) { | ||
| this._animateTo(pswp.element, 'opacity', 1); | ||
| this._animateTo(pswp.element, 'opacity', '1'); | ||
| } | ||
@@ -310,11 +325,16 @@ } | ||
| && pswp.bgOpacity > 0.01) { // do not animate opacity if it's already at 0 | ||
| this._animateTo(pswp.bg, 'opacity', 0); | ||
| this._animateTo(pswp.bg, 'opacity', '0'); | ||
| } | ||
| if (this._animateRootOpacity) { | ||
| this._animateTo(pswp.element, 'opacity', 0); | ||
| this._animateTo(pswp.element, 'opacity', '0'); | ||
| } | ||
| } | ||
| /** | ||
| * @param {boolean=} animate | ||
| */ | ||
| _setClosedStateZoomPan(animate) { | ||
| if (!this._thumbBounds) return; | ||
| const { pswp } = this; | ||
@@ -360,5 +380,5 @@ const { innerRect } = this._thumbBounds; | ||
| /** | ||
| * @param {Element} target | ||
| * @param {String} prop | ||
| * @param {String} propValue | ||
| * @param {HTMLElement} target | ||
| * @param {'transform' | 'opacity'} prop | ||
| * @param {string} propValue | ||
| */ | ||
@@ -372,2 +392,3 @@ _animateTo(target, prop, propValue) { | ||
| const { animations } = this.pswp; | ||
| /** @type {AnimationProps} */ | ||
| const animProps = { | ||
@@ -374,0 +395,0 @@ duration: this._duration, |
@@ -23,2 +23,198 @@ import { | ||
| /** | ||
| * @template T | ||
| * @typedef {import("./types").Type<T>} Type<T> | ||
| */ | ||
| /** @typedef {import("./slide/slide").SlideData} SlideData */ | ||
| /** @typedef {import("./slide/zoom-level").ZoomLevelOption} ZoomLevelOption */ | ||
| /** @typedef {import("./ui/ui-element").UIElementData} UIElementData */ | ||
| /** @typedef {import("./main-scroll").ItemHolder} ItemHolder */ | ||
| /** @typedef {import("./core/eventable").PhotoSwipeEventsMap} PhotoSwipeEventsMap */ | ||
| /** @typedef {import("./core/eventable").PhotoSwipeFiltersMap} PhotoSwipeFiltersMap */ | ||
| /** | ||
| * @template T | ||
| * @typedef {import("./core/eventable").EventCallback<T>} EventCallback<T> | ||
| */ | ||
| /** | ||
| * @template T | ||
| * @typedef {import("./core/eventable").AugmentedEvent<T>} AugmentedEvent<T> | ||
| */ | ||
| /** @typedef {{ x?: number; y?: number; id?: string | number }} Point */ | ||
| /** @typedef {{ x?: number; y?: number }} Size */ | ||
| /** @typedef {{ top: number; bottom: number; left: number; right: number }} Padding */ | ||
| /** @typedef {SlideData[]} DataSourceArray */ | ||
| /** @typedef {{ gallery: HTMLElement; items?: HTMLElement[] }} DataSourceObject */ | ||
| /** @typedef {DataSourceArray | DataSourceObject} DataSource */ | ||
| /** @typedef {(point: Point, originalEvent: PointerEvent) => void} ActionFn */ | ||
| /** @typedef {'close' | 'next' | 'zoom' | 'zoom-or-close' | 'toggle-controls'} ActionType */ | ||
| /** @typedef {Type<PhotoSwipe> | { default: Type<PhotoSwipe> }} PhotoSwipeModule */ | ||
| /** @typedef {PhotoSwipeModule | Promise<PhotoSwipeModule> | (() => Promise<PhotoSwipeModule>)} PhotoSwipeModuleOption */ | ||
| /** | ||
| * @typedef {Object} PhotoSwipeOptions https://photoswipe.com/options/ | ||
| * | ||
| * @prop {DataSource=} dataSource | ||
| * Pass an array of any items via dataSource option. Its length will determine amount of slides | ||
| * (which may be modified further from numItems event). | ||
| * | ||
| * Each item should contain data that you need to generate slide | ||
| * (for image slide it would be src (image URL), width (image width), height, srcset, alt). | ||
| * | ||
| * If these properties are not present in your initial array, you may "pre-parse" each item from itemData filter. | ||
| * | ||
| * @prop {number=} bgOpacity | ||
| * Background backdrop opacity, always define it via this option and not via CSS rgba color. | ||
| * | ||
| * @prop {number=} spacing | ||
| * Spacing between slides. Defined as ratio relative to the viewport width (0.1 = 10% of viewport). | ||
| * | ||
| * @prop {boolean=} allowPanToNext | ||
| * Allow swipe navigation to the next slide when the current slide is zoomed. Does not apply to mouse events. | ||
| * | ||
| * @prop {boolean=} loop | ||
| * If set to true you'll be able to swipe from the last to the first image. | ||
| * Option is always false when there are less than 3 slides. | ||
| * | ||
| * @prop {boolean=} wheelToZoom | ||
| * By default PhotoSwipe zooms image with ctrl-wheel, if you enable this option - image will zoom just via wheel. | ||
| * | ||
| * @prop {boolean=} pinchToClose | ||
| * Pinch touch gesture to close the gallery. | ||
| * | ||
| * @prop {boolean=} closeOnVerticalDrag | ||
| * Vertical drag gesture to close the PhotoSwipe. | ||
| * | ||
| * @prop {Padding=} padding | ||
| * Slide area padding (in pixels). | ||
| * | ||
| * @prop {(viewportSize: Size, itemData: SlideData, index: number) => Padding} [paddingFn] | ||
| * The option is checked frequently, so make sure it's performant. Overrides padding option if defined. For example: | ||
| * | ||
| * @prop {number | false} [hideAnimationDuration] | ||
| * Transition duration in milliseconds, can be 0. | ||
| * | ||
| * @prop {number | false} [showAnimationDuration] | ||
| * Transition duration in milliseconds, can be 0. | ||
| * | ||
| * @prop {number | false} [zoomAnimationDuration] | ||
| * Transition duration in milliseconds, can be 0. | ||
| * | ||
| * @prop {string=} easing | ||
| * String, 'cubic-bezier(.4,0,.22,1)'. CSS easing function for open/close/zoom transitions. | ||
| * | ||
| * @prop {boolean=} escKey | ||
| * Esc key to close. | ||
| * | ||
| * @prop {boolean=} arrowKeys | ||
| * Left/right arrow keys for navigation. | ||
| * | ||
| * @prop {boolean=} returnFocus | ||
| * Restore focus the last active element after PhotoSwipe is closed. | ||
| * | ||
| * @prop {boolean=} clickToCloseNonZoomable | ||
| * If image is not zoomable (for example, smaller than viewport) it can be closed by clicking on it. | ||
| * | ||
| * @prop {ActionType | ActionFn | false} [imageClickAction] | ||
| * Refer to click and tap actions page. | ||
| * | ||
| * @prop {ActionType | ActionFn | false} [bgClickAction] | ||
| * Refer to click and tap actions page. | ||
| * | ||
| * @prop {ActionType | ActionFn | false} [tapAction] | ||
| * Refer to click and tap actions page. | ||
| * | ||
| * @prop {ActionType | ActionFn | false} [doubleTapAction] | ||
| * Refer to click and tap actions page. | ||
| * | ||
| * @prop {number=} preloaderDelay | ||
| * Delay before the loading indicator will be displayed, | ||
| * if image is loaded during it - the indicator will not be displayed at all. Can be zero. | ||
| * | ||
| * @prop {string=} indexIndicatorSep | ||
| * Used for slide count indicator ("1 of 10 "). | ||
| * | ||
| * @prop {(options: PhotoSwipeOptions, pswp: PhotoSwipe) => { x: number; y: number }} [getViewportSizeFn] | ||
| * A function that should return slide viewport width and height, in format {x: 100, y: 100}. | ||
| * | ||
| * @prop {string=} errorMsg | ||
| * Message to display when the image wasn't able to load. If you need to display HTML - use contentErrorElement filter. | ||
| * | ||
| * @prop {[number, number]=} preload | ||
| * Lazy loading of nearby slides based on direction of movement. Should be an array with two integers, | ||
| * first one - number of items to preload before the current image, second one - after the current image. | ||
| * Two nearby images are always loaded. | ||
| * | ||
| * @prop {string=} mainClass | ||
| * Class that will be added to the root element of PhotoSwipe, may contain multiple separated by space. | ||
| * Example on Styling page. | ||
| * | ||
| * @prop {HTMLElement=} appendToEl | ||
| * Element to which PhotoSwipe dialog will be appended when it opens. | ||
| * | ||
| * @prop {number=} maxWidthToAnimate | ||
| * Maximum width of image to animate, if initial rendered image width | ||
| * is larger than this value - the opening/closing transition will be automatically disabled. | ||
| * | ||
| * @prop {string=} closeTitle | ||
| * Translating | ||
| * | ||
| * @prop {string=} zoomTitle | ||
| * Translating | ||
| * | ||
| * @prop {string=} arrowPrevTitle | ||
| * Translating | ||
| * | ||
| * @prop {string=} arrowNextTitle | ||
| * Translating | ||
| * | ||
| * @prop {'zoom' | 'fade' | 'none'} [showHideAnimationType] | ||
| * To adjust opening or closing transition type use lightbox option `showHideAnimationType` (`String`). | ||
| * It supports three values - `zoom` (default), `fade` (default if there is no thumbnail) and `none`. | ||
| * | ||
| * Animations are automatically disabled if user `(prefers-reduced-motion: reduce)`. | ||
| * | ||
| * @prop {number=} index | ||
| * Defines start slide index. | ||
| * | ||
| * @prop {(e: MouseEvent) => number} [getClickedIndexFn] | ||
| * | ||
| * @prop {boolean=} arrowPrev | ||
| * @prop {boolean=} arrowNext | ||
| * @prop {boolean=} zoom | ||
| * @prop {boolean=} close | ||
| * @prop {boolean=} counter | ||
| * | ||
| * @prop {string=} arrowPrevSVG | ||
| * @prop {string=} arrowNextSVG | ||
| * @prop {string=} zoomSVG | ||
| * @prop {string=} closeSVG | ||
| * @prop {string=} counterSVG | ||
| * | ||
| * @prop {string=} arrowPrevTitle | ||
| * @prop {string=} arrowNextTitle | ||
| * @prop {string=} zoomTitle | ||
| * @prop {string=} closeTitle | ||
| * @prop {string=} counterTitle | ||
| * | ||
| * @prop {ZoomLevelOption=} initialZoomLevel | ||
| * @prop {ZoomLevelOption=} secondaryZoomLevel | ||
| * @prop {ZoomLevelOption=} maxZoomLevel | ||
| * | ||
| * @prop {boolean=} mouseMovePan | ||
| * @prop {Point | null} [initialPointerPos] | ||
| * @prop {boolean=} showHideOpacity | ||
| * | ||
| * @prop {PhotoSwipeModuleOption} [pswpModule] | ||
| * @prop {() => Promise<any>} [openPromise] | ||
| * @prop {boolean=} preloadFirstSlide | ||
| * @prop {string=} gallery | ||
| * @prop {string=} gallerySelector | ||
| * @prop {string=} children | ||
| * @prop {string=} childSelector | ||
| * @prop {string | false} [thumbSelector] | ||
| */ | ||
| /** @type {PhotoSwipeOptions} */ | ||
| const defaultOptions = { | ||
@@ -52,3 +248,12 @@ allowPanToNext: true, | ||
| /** | ||
| * PhotoSwipe Core | ||
| */ | ||
| class PhotoSwipe extends PhotoSwipeBase { | ||
| /** @type {HTMLDivElement} */ | ||
| topBar; | ||
| /** | ||
| * @param {PhotoSwipeOptions} options | ||
| */ | ||
| constructor(options) { | ||
@@ -59,11 +264,27 @@ super(); | ||
| // offset of viewport relative to document | ||
| /** | ||
| * offset of viewport relative to document | ||
| * | ||
| * @type {{ x?: number; y?: number }} | ||
| */ | ||
| this.offset = {}; | ||
| /** | ||
| * @type {{ x?: number; y?: number }} | ||
| * @private | ||
| */ | ||
| this._prevViewportSize = {}; | ||
| // Size of scrollable PhotoSwipe viewport | ||
| /** | ||
| * Size of scrollable PhotoSwipe viewport | ||
| * | ||
| * @type {{ x?: number; y?: number }} | ||
| */ | ||
| this.viewportSize = {}; | ||
| // background (backdrop) opacity | ||
| /** | ||
| * background (backdrop) opacity | ||
| * | ||
| * @type {number} | ||
| */ | ||
| this.bgOpacity = 1; | ||
@@ -129,3 +350,7 @@ | ||
| this._initialItemData = this.getItemData(this.currIndex); | ||
| this.dispatch('gettingData', this.currIndex, this._initialItemData, true); | ||
| this.dispatch('gettingData', { | ||
| index: this.currIndex, | ||
| data: this._initialItemData, | ||
| slide: undefined | ||
| }); | ||
@@ -168,3 +393,3 @@ // *Layout* - calculate size and position of elements here | ||
| * | ||
| * @param {Integer} index | ||
| * @param {number} index | ||
| */ | ||
@@ -199,3 +424,3 @@ getLoopedIndex(index) { | ||
| * Change the slide | ||
| * @param {Integer} New index | ||
| * @param {number} index New index | ||
| */ | ||
@@ -224,2 +449,4 @@ goTo(index) { | ||
| * @see slide/slide.js zoomTo | ||
| * | ||
| * @param {Parameters<Slide['zoomTo']>} args | ||
| */ | ||
@@ -290,3 +517,3 @@ zoomTo(...args) { | ||
| * | ||
| * @param {Integer} slideIndex | ||
| * @param {number} slideIndex | ||
| */ | ||
@@ -306,2 +533,3 @@ refreshSlideContent(slideIndex) { | ||
| if (i === 1) { | ||
| /** @type {Slide} */ | ||
| this.currSlide = itemHolder.slide; | ||
@@ -320,5 +548,5 @@ itemHolder.slide.setIsActive(true); | ||
| * | ||
| * @param {Object} holder mainScroll.itemHolders array item | ||
| * @param {Integer} index Slide index | ||
| * @param {Boolean} force If content should be set even if index wasn't changed | ||
| * @param {ItemHolder} holder mainScroll.itemHolders array item | ||
| * @param {number} index Slide index | ||
| * @param {boolean=} force If content should be set even if index wasn't changed | ||
| */ | ||
@@ -369,3 +597,3 @@ setContent(holder, index, force) { | ||
| * | ||
| * @param {Boolean} force Update size even if size of viewport was not changed. | ||
| * @param {boolean=} force Update size even if size of viewport was not changed. | ||
| */ | ||
@@ -415,5 +643,8 @@ updateSize(force) { | ||
| /** | ||
| * @param {number} opacity | ||
| */ | ||
| applyBgOpacity(opacity) { | ||
| this.bgOpacity = Math.max(opacity, 0); | ||
| this.bg.style.opacity = this.bgOpacity * this.options.bgOpacity; | ||
| this.bg.style.opacity = String(this.bgOpacity * this.options.bgOpacity); | ||
| } | ||
@@ -433,2 +664,4 @@ | ||
| * Page resize event handler | ||
| * | ||
| * @private | ||
| */ | ||
@@ -454,2 +687,4 @@ _handlePageResize() { | ||
| * relative to PhotoSwipe viewport. | ||
| * | ||
| * @private | ||
| */ | ||
@@ -460,2 +695,6 @@ _updatePageScrollOffset() { | ||
| /** | ||
| * @param {number} x | ||
| * @param {number} y | ||
| */ | ||
| setScrollOffset(x, y) { | ||
@@ -470,2 +709,4 @@ this.offset.x = x; | ||
| * and add it to DOM | ||
| * | ||
| * @private | ||
| */ | ||
@@ -475,3 +716,3 @@ _createMainStructure() { | ||
| this.element = createElement('pswp'); | ||
| this.element.setAttribute('tabindex', -1); | ||
| this.element.setAttribute('tabindex', '-1'); | ||
| this.element.setAttribute('role', 'dialog'); | ||
@@ -520,2 +761,6 @@ | ||
| /** | ||
| * @param {PhotoSwipeOptions} options | ||
| * @private | ||
| */ | ||
| _prepareOptions(options) { | ||
@@ -527,2 +772,3 @@ if (window.matchMedia('(prefers-reduced-motion), (update: slow)').matches) { | ||
| /** @type {PhotoSwipeOptions}*/ | ||
| this.options = { | ||
@@ -529,0 +775,0 @@ ...defaultOptions, |
@@ -0,1 +1,3 @@ | ||
| /** @typedef {import("./photoswipe").default} PhotoSwipe */ | ||
| /** | ||
@@ -6,2 +8,5 @@ * Handles scroll wheel. | ||
| class ScrollWheel { | ||
| /** | ||
| * @param {PhotoSwipe} pswp | ||
| */ | ||
| constructor(pswp) { | ||
@@ -12,2 +17,6 @@ this.pswp = pswp; | ||
| /** | ||
| * @private | ||
| * @param {WheelEvent} e | ||
| */ | ||
| _onWheel(e) { | ||
@@ -14,0 +23,0 @@ e.preventDefault(); |
| import { createElement, LOAD_STATE, setWidthHeight } from '../util/util.js'; | ||
| import Placeholder from './placeholder.js'; | ||
| /** @typedef {import("./slide").default} Slide */ | ||
| /** @typedef {import("./slide").SlideData} SlideData */ | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {import("../util/util").LoadState} LoadState */ | ||
| class Content { | ||
| /** @type {HTMLImageElement | HTMLDivElement} */ | ||
| element; | ||
| /** | ||
| * @param {Object} itemData Slide data | ||
| * @param {PhotoSwipeBase} instance PhotoSwipe or PhotoSwipeLightbox instance | ||
| * @param {Slide|undefined} slide Slide that requested the image, | ||
| * can be undefined if image was requested by something else | ||
| * (for example by lazy-loader) | ||
| * @param {SlideData} itemData Slide data | ||
| * @param {PhotoSwipe} instance PhotoSwipe or PhotoSwipeLightbox instance | ||
| * @param {number} index | ||
| */ | ||
@@ -22,2 +28,3 @@ constructor(itemData, instance, index) { | ||
| this.hasSlide = false; | ||
| /** @type {LoadState} */ | ||
| this.state = LOAD_STATE.IDLE; | ||
@@ -51,3 +58,4 @@ | ||
| * | ||
| * @param {Boolean} isLazy | ||
| * @param {boolean=} isLazy | ||
| * @param {boolean=} reload | ||
| */ | ||
@@ -92,6 +100,7 @@ load(isLazy, reload) { | ||
| * | ||
| * @param {Boolean} isLazy | ||
| * @param {boolean} isLazy | ||
| */ | ||
| loadImage(isLazy) { | ||
| this.element = createElement('pswp__img', 'img'); | ||
| const imageElement = createElement('pswp__img', 'img'); | ||
| this.element = imageElement; | ||
@@ -103,19 +112,19 @@ if (this.instance.dispatch('contentLoadImage', { content: this, isLazy }).defaultPrevented) { | ||
| if (this.data.srcset) { | ||
| this.element.srcset = this.data.srcset; | ||
| imageElement.srcset = this.data.srcset; | ||
| } | ||
| this.element.src = this.data.src; | ||
| imageElement.src = this.data.src; | ||
| this.element.alt = this.data.alt || ''; | ||
| imageElement.alt = this.data.alt || ''; | ||
| this.state = LOAD_STATE.LOADING; | ||
| if (this.element.complete) { | ||
| if (imageElement.complete) { | ||
| this.onLoaded(); | ||
| } else { | ||
| this.element.onload = () => { | ||
| imageElement.onload = () => { | ||
| this.onLoaded(); | ||
| }; | ||
| this.element.onerror = () => { | ||
| imageElement.onerror = () => { | ||
| this.onError(); | ||
@@ -188,3 +197,3 @@ }; | ||
| /** | ||
| * @returns {Boolean} If the content is image | ||
| * @returns {boolean} If the content is image | ||
| */ | ||
@@ -210,2 +219,3 @@ isImageContent() { | ||
| // eslint-disable-next-line max-len | ||
| if (this.instance.dispatch('contentResize', { content: this, width, height }).defaultPrevented) { | ||
@@ -218,3 +228,4 @@ return; | ||
| if (this.isImageContent() && !this.isError()) { | ||
| const image = this.element; | ||
| const image = /** @type HTMLImageElement */ (this.element); | ||
| // Handle srcset sizes attribute. | ||
@@ -226,8 +237,10 @@ // | ||
| if (image.srcset | ||
| && (!image.dataset.largestUsedSize || width > image.dataset.largestUsedSize)) { | ||
| // eslint-disable-next-line max-len | ||
| && (!image.dataset.largestUsedSize || width > parseInt(image.dataset.largestUsedSize, 10))) { | ||
| image.sizes = width + 'px'; | ||
| image.dataset.largestUsedSize = width; | ||
| image.dataset.largestUsedSize = String(width); | ||
| } | ||
| if (this.slide) { | ||
| // eslint-disable-next-line max-len | ||
| this.instance.dispatch('imageSizeChange', { slide: this.slide, width, height, content: this }); | ||
@@ -239,3 +252,3 @@ } | ||
| /** | ||
| * @returns {Boolean} If the content can be zoomed | ||
| * @returns {boolean} If the content can be zoomed | ||
| */ | ||
@@ -251,3 +264,3 @@ isZoomable() { | ||
| /** | ||
| * @returns {Boolean} If content should use a placeholder (from msrc by default) | ||
| * @returns {boolean} If content should use a placeholder (from msrc by default) | ||
| */ | ||
@@ -264,4 +277,2 @@ usePlaceholder() { | ||
| * Preload content with lazy-loading param | ||
| * | ||
| * @param {Boolean} isLazy | ||
| */ | ||
@@ -277,3 +288,3 @@ lazyLoad() { | ||
| /** | ||
| * @returns {Boolean} If placeholder should be kept after content is loaded | ||
| * @returns {boolean} If placeholder should be kept after content is loaded | ||
| */ | ||
@@ -313,2 +324,3 @@ keepPlaceholder() { | ||
| if (this.slide) { | ||
| /** @type {HTMLElement} */ | ||
| let errorMsgEl = createElement('pswp__error-msg'); | ||
@@ -365,3 +377,4 @@ errorMsgEl.innerText = this.instance.options.errorMsg; | ||
| if (this.element && this.element.tagName === 'IMG') { | ||
| this.element.decode().then(() => { | ||
| /** @type {HTMLImageElement} */ | ||
| (this.element).decode().then(() => { | ||
| this.isDecoding = false; | ||
@@ -378,3 +391,5 @@ requestAnimationFrame(() => { | ||
| if (this.placeholder | ||
| && (this.state === LOAD_STATE.LOADED || this.state === LOAD_STATE.ERROR)) { | ||
| // eslint-disable-next-line max-len | ||
| && (this.state === LOAD_STATE.LOADED || /** @type {LoadState} */ (this.state) === LOAD_STATE.ERROR) | ||
| ) { | ||
| this.removePlaceholder(); | ||
@@ -381,0 +396,0 @@ } |
@@ -0,1 +1,9 @@ | ||
| /** @typedef {import("./slide").SlideData} SlideData */ | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {{ x: number; y: number; w: number; innerRect?: { w: number; h: number; x: number; y: number } }} Bounds */ | ||
| /** | ||
| * @param {HTMLElement} el | ||
| */ | ||
| function getBoundsByElement(el) { | ||
@@ -10,2 +18,7 @@ const thumbAreaRect = el.getBoundingClientRect(); | ||
| /** | ||
| * @param {HTMLElement} el | ||
| * @param {number} imageWidth | ||
| * @param {number} imageHeight | ||
| */ | ||
| function getCroppedBoundsByElement(el, imageWidth, imageHeight) { | ||
@@ -23,5 +36,9 @@ const thumbAreaRect = el.getBoundingClientRect(); | ||
| // Coordinates of the image, | ||
| // as if it was not cropped, | ||
| // height is calculated automatically | ||
| /** | ||
| * Coordinates of the image, | ||
| * as if it was not cropped, | ||
| * height is calculated automatically | ||
| * | ||
| * @type {Bounds} | ||
| */ | ||
| const bounds = { | ||
@@ -49,6 +66,6 @@ x: thumbAreaRect.left + offsetX, | ||
| * | ||
| * @param {Integer} index | ||
| * @param {Object} itemData | ||
| * @param {number} index | ||
| * @param {SlideData} itemData | ||
| * @param {PhotoSwipe} instance PhotoSwipe instance | ||
| * @returns Object|undefined | ||
| * @returns {Bounds | undefined} | ||
| */ | ||
@@ -62,3 +79,5 @@ export function getThumbBounds(index, itemData, instance) { | ||
| }); | ||
| // @ts-expect-error | ||
| if (event.thumbBounds) { | ||
| // @ts-expect-error | ||
| return event.thumbBounds; | ||
@@ -69,2 +88,3 @@ } | ||
| let thumbBounds; | ||
| /** @type {HTMLElement} */ | ||
| let thumbnail; | ||
@@ -86,4 +106,4 @@ | ||
| thumbnail, | ||
| itemData.w, | ||
| itemData.h | ||
| itemData.width || itemData.w, | ||
| itemData.height || itemData.h | ||
| ); | ||
@@ -90,0 +110,0 @@ } |
| import { getViewportSize, getPanAreaSize } from '../util/viewport-size.js'; | ||
| import ZoomLevel from './zoom-level.js'; | ||
| /** @typedef {import("./content").default} Content */ | ||
| /** @typedef {import("./slide").default} Slide */ | ||
| /** @typedef {import("./slide").SlideData} SlideData */ | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {import("../lightbox/lightbox").default} PhotoSwipeLightbox */ | ||
| const MIN_SLIDES_TO_CACHE = 5; | ||
@@ -11,6 +17,6 @@ | ||
| * | ||
| * @param {Object} itemData Data about the slide | ||
| * @param {PhotoSwipeBase} instance PhotoSwipe or PhotoSwipeLightbox | ||
| * @param {Integer} index | ||
| * @returns {Object|Boolean} Image that is being decoded or false. | ||
| * @param {SlideData} itemData Data about the slide | ||
| * @param {PhotoSwipe | PhotoSwipeLightbox} instance PhotoSwipe or PhotoSwipeLightbox | ||
| * @param {number} index | ||
| * @returns Image that is being decoded or false. | ||
| */ | ||
@@ -29,3 +35,4 @@ export function lazyLoadData(itemData, instance, index) { | ||
| // as it might use srcset and we need to define sizes | ||
| const viewportSize = instance.viewportSize || getViewportSize(options); | ||
| // @ts-expect-error should provide pswp instance? | ||
| const viewportSize = instance.viewportSize || getViewportSize(options, instance); | ||
| const panAreaSize = getPanAreaSize(options, viewportSize, itemData, index); | ||
@@ -53,4 +60,4 @@ | ||
| * | ||
| * @param {Integer} index Slide index | ||
| * @param {Object} instance PhotoSwipe or PhotoSwipeLightbox eventable instance | ||
| * @param {number} index Slide index | ||
| * @param {PhotoSwipe | PhotoSwipeLightbox} instance PhotoSwipe or PhotoSwipeLightbox eventable instance | ||
| */ | ||
@@ -69,2 +76,5 @@ export function lazyLoadSlide(index, instance) { | ||
| class ContentLoader { | ||
| /** | ||
| * @param {PhotoSwipe} pswp | ||
| */ | ||
| constructor(pswp) { | ||
@@ -77,2 +87,3 @@ this.pswp = pswp; | ||
| ); | ||
| /** @type {Content[]} */ | ||
| this._cachedItems = []; | ||
@@ -84,3 +95,3 @@ } | ||
| * | ||
| * @param {Integer} diff Difference between slide indexes that was changed recently, or 0. | ||
| * @param {number=} diff Difference between slide indexes that was changed recently, or 0. | ||
| */ | ||
@@ -109,2 +120,5 @@ updateLazy(diff) { | ||
| /** | ||
| * @param {number} index | ||
| */ | ||
| loadSlideByIndex(index) { | ||
@@ -124,2 +138,5 @@ index = this.pswp.getLoopedIndex(index); | ||
| /** | ||
| * @param {Slide} slide | ||
| */ | ||
| getContentBySlide(slide) { | ||
@@ -165,3 +182,3 @@ let content = this.getContentByIndex(slide.index); | ||
| * | ||
| * @param {Integer} index | ||
| * @param {number} index | ||
| */ | ||
@@ -175,2 +192,5 @@ removeByIndex(index) { | ||
| /** | ||
| * @param {number} index | ||
| */ | ||
| getContentByIndex(index) { | ||
@@ -177,0 +197,0 @@ return this._cachedItems.find(content => content.index === index); |
@@ -1,4 +0,1 @@ | ||
| /** | ||
| * Calculates minimum, maximum and initial (center) bounds of a slide | ||
| */ | ||
| import { | ||
@@ -9,3 +6,13 @@ clamp | ||
| /** @typedef {import("./slide").default} Slide */ | ||
| /** @typedef {{ x?: number; y?: number }} Point */ | ||
| /** @typedef {'x' | 'y'} Axis */ | ||
| /** | ||
| * Calculates minimum, maximum and initial (center) bounds of a slide | ||
| */ | ||
| class PanBounds { | ||
| /** | ||
| * @param {Slide} slide | ||
| */ | ||
| constructor(slide) { | ||
@@ -16,4 +23,7 @@ this.slide = slide; | ||
| /** @type {Point} */ | ||
| this.center = {}; | ||
| /** @type {Point} */ | ||
| this.max = {}; | ||
| /** @type {Point} */ | ||
| this.min = {}; | ||
@@ -24,3 +34,7 @@ | ||
| // _getItemBounds | ||
| /** | ||
| * _getItemBounds | ||
| * | ||
| * @param {number} currZoomLevel | ||
| */ | ||
| update(currZoomLevel) { | ||
@@ -38,3 +52,7 @@ this.currZoomLevel = currZoomLevel; | ||
| // _calculateItemBoundsForAxis | ||
| /** | ||
| * _calculateItemBoundsForAxis | ||
| * | ||
| * @param {Axis} axis | ||
| */ | ||
| _updateAxis(axis) { | ||
@@ -82,4 +100,4 @@ const { pswp } = this.slide; | ||
| * | ||
| * @param {String} axis x or y | ||
| * @param {Object} panOffset | ||
| * @param {Axis} axis x or y | ||
| * @param {number} panOffset | ||
| */ | ||
@@ -86,0 +104,0 @@ correctPan(axis, panOffset) { // checkPanBounds |
@@ -5,4 +5,4 @@ import { createElement, setWidthHeight, toTransformString } from '../util/util.js'; | ||
| /** | ||
| * @param {String|false} imageSrc | ||
| * @param {Element} container | ||
| * @param {string | false} imageSrc | ||
| * @param {HTMLElement} container | ||
| */ | ||
@@ -19,5 +19,8 @@ constructor(imageSrc, container) { | ||
| if (imageSrc) { | ||
| this.element.decoding = 'async'; | ||
| this.element.alt = ''; | ||
| this.element.src = imageSrc; | ||
| /** @type {HTMLImageElement} */ | ||
| (this.element).decoding = 'async'; | ||
| /** @type {HTMLImageElement} */ | ||
| (this.element).alt = ''; | ||
| /** @type {HTMLImageElement} */ | ||
| (this.element).src = imageSrc; | ||
| this.element.setAttribute('role', 'presentation'); | ||
@@ -29,2 +32,6 @@ } | ||
| /** | ||
| * @param {number} width | ||
| * @param {number} height | ||
| */ | ||
| setDisplayedSize(width, height) { | ||
@@ -31,0 +38,0 @@ if (!this.element) { |
@@ -0,3 +1,19 @@ | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {import("../photoswipe").Point} Point */ | ||
| /** | ||
| * Renders and allows to control a single slide | ||
| * @typedef {_SlideData & Record<string, any>} SlideData | ||
| * @typedef {Object} _SlideData | ||
| * @prop {HTMLElement=} element thumbnail element | ||
| * @prop {string=} src image URL | ||
| * @prop {string=} srcset image srcset | ||
| * @prop {number=} w image width (deprecated) | ||
| * @prop {number=} h image height (deprecated) | ||
| * @prop {number=} width image width | ||
| * @prop {number=} height image height | ||
| * @prop {string=} msrc placeholder image URL that's displayed before large image is loaded | ||
| * @prop {string=} alt image alt text | ||
| * @prop {boolean=} thumbCropped whether thumbnail is cropped client-side or not | ||
| * @prop {string=} html html content of a slide | ||
| * @prop {'image' | 'html' | string} [type] slide type | ||
| */ | ||
@@ -18,3 +34,11 @@ | ||
| /** | ||
| * Renders and allows to control a single slide | ||
| */ | ||
| class Slide { | ||
| /** | ||
| * @param {SlideData} data | ||
| * @param {number} index | ||
| * @param {PhotoSwipe} pswp | ||
| */ | ||
| constructor(data, index, pswp) { | ||
@@ -26,2 +50,3 @@ this.data = data; | ||
| this.currentResolution = 0; | ||
| /** @type {Point} */ | ||
| this.panAreaSize = {}; | ||
@@ -48,3 +73,5 @@ | ||
| this.currZoomLevel = 1; | ||
| /** @type {number} */ | ||
| this.width = this.content.width; | ||
| /** @type {number} */ | ||
| this.height = this.content.height; | ||
@@ -63,3 +90,3 @@ | ||
| * | ||
| * @param {Boolean} isActive | ||
| * @param {boolean} isActive | ||
| */ | ||
@@ -78,2 +105,4 @@ setIsActive(isActive) { | ||
| * Appends slide content to DOM | ||
| * | ||
| * @param {HTMLElement} holderElement | ||
| */ | ||
@@ -91,3 +120,3 @@ append(holderElement) { | ||
| this.container.transformOrigin = '0 0'; | ||
| this.container.style.transformOrigin = '0 0'; | ||
@@ -213,3 +242,3 @@ this.load(); | ||
| * | ||
| * @param {Boolean} force if size should be updated even if dimensions weren't changed | ||
| * @param {boolean=} force if size should be updated even if dimensions weren't changed | ||
| */ | ||
@@ -234,2 +263,6 @@ updateContentSize(force) { | ||
| /** | ||
| * @param {number} width | ||
| * @param {number} height | ||
| */ | ||
| sizeChanged(width, height) { | ||
@@ -255,8 +288,8 @@ if (width !== this.prevDisplayedWidth | ||
| * | ||
| * @param {Number} destZoomLevel Destination zoom level. | ||
| * @param {Object|false} centerPoint Transform origin center point, | ||
| * or false if viewport center should be used. | ||
| * @param {Number} transitionDuration Transition duration, may be set to 0. | ||
| * @param {Boolean|null} ignoreBounds Minimum and maximum zoom levels will be ignored. | ||
| * @return {Boolean|null} Returns true if animated. | ||
| * @param {number} destZoomLevel Destination zoom level. | ||
| * @param {{ x?: number; y?: number }} centerPoint | ||
| * Transform origin center point, or false if viewport center should be used. | ||
| * @param {number | false} [transitionDuration] Transition duration, may be set to 0. | ||
| * @param {boolean=} ignoreBounds Minimum and maximum zoom levels will be ignored. | ||
| * @return {boolean=} Returns true if animated. | ||
| */ | ||
@@ -316,2 +349,5 @@ zoomTo(destZoomLevel, centerPoint, transitionDuration, ignoreBounds) { | ||
| /** | ||
| * @param {{ x?: number, y?: number }} [centerPoint] | ||
| */ | ||
| toggleZoom(centerPoint) { | ||
@@ -330,3 +366,3 @@ this.zoomTo( | ||
| * | ||
| * @param {Number} currZoomLevel | ||
| * @param {number} currZoomLevel | ||
| */ | ||
@@ -344,7 +380,7 @@ setZoomLevel(currZoomLevel) { | ||
| * | ||
| * @param {String} axis | ||
| * @param {Object|null} centerPoint point based on which zoom is performed, | ||
| * usually refers to the current mouse position, | ||
| * if false - viewport center will be used. | ||
| * @param {Number|null} prevZoomLevel Zoom level before new zoom was applied. | ||
| * @param {'x' | 'y'} axis | ||
| * @param {{ x?: number; y?: number }} [point] | ||
| * point based on which zoom is performed, usually refers to the current mouse position, | ||
| * if false - viewport center will be used. | ||
| * @param {number=} prevZoomLevel Zoom level before new zoom was applied. | ||
| */ | ||
@@ -371,4 +407,4 @@ calculateZoomToPanOffset(axis, point, prevZoomLevel) { | ||
| * | ||
| * @param {Number} panX | ||
| * @param {Number} panY | ||
| * @param {number} panX | ||
| * @param {number} panY | ||
| */ | ||
@@ -418,5 +454,5 @@ panTo(panX, panY) { | ||
| * | ||
| * @param {Number} x | ||
| * @param {Number} y | ||
| * @param {Number} zoom | ||
| * @param {number} x | ||
| * @param {number} y | ||
| * @param {number} zoom | ||
| */ | ||
@@ -461,3 +497,3 @@ _applyZoomTransform(x, y, zoom) { | ||
| * | ||
| * @param {Number} newResolution | ||
| * @param {number} newResolution | ||
| */ | ||
@@ -464,0 +500,0 @@ _setResolution(newResolution) { |
@@ -0,1 +1,9 @@ | ||
| const MAX_IMAGE_WIDTH = 4000; | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {import("../photoswipe").PhotoSwipeOptions} PhotoSwipeOptions */ | ||
| /** @typedef {import("../slide/slide").SlideData} SlideData */ | ||
| /** @typedef {'fit' | 'fill' | number | ((zoomLevelObject: ZoomLevel) => number)} ZoomLevelOption */ | ||
| /** | ||
@@ -5,11 +13,8 @@ * Calculates zoom levels for specific slide. | ||
| */ | ||
| const MAX_IMAGE_WIDTH = 4000; | ||
| class ZoomLevel { | ||
| /** | ||
| * @param {Object} options PhotoSwipe options | ||
| * @param {Object} itemData Slide data | ||
| * @param {Integer} index Slide index | ||
| * @param {PhotoSwipe|undefined} pswp PhotoSwipe instance, can be undefined if not initialized yet | ||
| * @param {PhotoSwipeOptions} options PhotoSwipe options | ||
| * @param {SlideData} itemData Slide data | ||
| * @param {number} index Slide index | ||
| * @param {PhotoSwipe=} pswp PhotoSwipe instance, can be undefined if not initialized yet | ||
| */ | ||
@@ -28,3 +33,5 @@ constructor(options, itemData, index, pswp) { | ||
| * | ||
| * @param {Slide} slide | ||
| * @param {number} maxWidth | ||
| * @param {number} maxHeight | ||
| * @param {{ x?: number; y?: number }} panAreaSize | ||
| */ | ||
@@ -71,9 +78,9 @@ update(maxWidth, maxHeight, panAreaSize) { | ||
| * | ||
| * @param {Mixed} optionPrefix Zoom level option prefix (initial, secondary, max) | ||
| * @private | ||
| * @param {'initial' | 'secondary' | 'max'} optionPrefix Zoom level option prefix (initial, secondary, max) | ||
| */ | ||
| _parseZoomLevelOption(optionPrefix) { | ||
| // zoom.initial | ||
| // zoom.secondary | ||
| // zoom.max | ||
| const optionValue = this.options[optionPrefix + 'ZoomLevel']; | ||
| // eslint-disable-next-line max-len | ||
| const optionName = /** @type {'initialZoomLevel' | 'secondaryZoomLevel' | 'maxZoomLevel'} */ (optionPrefix + 'ZoomLevel'); | ||
| const optionValue = this.options[optionName]; | ||
@@ -105,3 +112,4 @@ if (!optionValue) { | ||
| * | ||
| * @return {Number} | ||
| * @private | ||
| * @return {number} | ||
| */ | ||
@@ -128,3 +136,4 @@ _getSecondary() { | ||
| * | ||
| * @return {Number} | ||
| * @private | ||
| * @return {number} | ||
| */ | ||
@@ -140,3 +149,4 @@ _getInitial() { | ||
| * | ||
| * @return {Number} | ||
| * @private | ||
| * @return {number} | ||
| */ | ||
@@ -143,0 +153,0 @@ _getMax() { |
@@ -5,2 +5,11 @@ /* | ||
| /** @typedef {import("./ui-element").UIElementData} UIElementData */ | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** | ||
| * | ||
| * @param {HTMLElement} element | ||
| * @param {PhotoSwipe} pswp | ||
| * @param {boolean=} isNextButton | ||
| */ | ||
| function initArrowButton(element, pswp, isNextButton) { | ||
@@ -11,5 +20,7 @@ element.classList.add('pswp__button--arrow'); | ||
| if (isNextButton) { | ||
| element.disabled = !(pswp.currIndex < pswp.getNumItems() - 1); | ||
| /** @type {HTMLButtonElement} */ | ||
| (element).disabled = !(pswp.currIndex < pswp.getNumItems() - 1); | ||
| } else { | ||
| element.disabled = !(pswp.currIndex > 0); | ||
| /** @type {HTMLButtonElement} */ | ||
| (element).disabled = !(pswp.currIndex > 0); | ||
| } | ||
@@ -20,2 +31,3 @@ } | ||
| /** @type {UIElementData} */ | ||
| export const arrowPrev = { | ||
@@ -38,2 +50,3 @@ name: 'arrowPrev', | ||
| /** @type {UIElementData} */ | ||
| export const arrowNext = { | ||
@@ -40,0 +53,0 @@ name: 'arrowNext', |
@@ -0,1 +1,2 @@ | ||
| /** @type {import("./ui-element").UIElementData} UIElementData */ | ||
| const closeButton = { | ||
@@ -2,0 +3,0 @@ name: 'close', |
@@ -0,1 +1,2 @@ | ||
| /** @type {import("./ui-element").UIElementData} UIElementData */ | ||
| const zoomButton = { | ||
@@ -8,2 +9,3 @@ name: 'zoom', | ||
| isCustomSVG: true, | ||
| // eslint-disable-next-line max-len | ||
| inner: '<path d="M17.426 19.926a6 6 0 1 1 1.5-1.5L23 22.5 21.5 24l-4.074-4.074z" id="pswp__icn-zoom"/>' | ||
@@ -10,0 +12,0 @@ + '<path fill="currentColor" class="pswp__zoom-icn-bar-h" d="M11 16v-2h6v2z"/>' |
@@ -0,1 +1,2 @@ | ||
| /** @type {import("./ui-element").UIElementData} UIElementData */ | ||
| export const counterIndicator = { | ||
@@ -2,0 +3,0 @@ name: 'counter', |
@@ -0,1 +1,2 @@ | ||
| /** @type {import("./ui-element").UIElementData} UIElementData */ | ||
| export const loadingIndicator = { | ||
@@ -7,2 +8,3 @@ name: 'preloader', | ||
| isCustomSVG: true, | ||
| // eslint-disable-next-line max-len | ||
| inner: '<path fill-rule="evenodd" clip-rule="evenodd" d="M21.2 16a5.2 5.2 0 1 1-5.2-5.2V8a8 8 0 1 0 8 8h-2.8Z" id="pswp__icn-loading"/>', | ||
@@ -12,5 +14,11 @@ outlineID: 'pswp__icn-loading' | ||
| onInit: (indicatorElement, pswp) => { | ||
| /** @type {boolean} */ | ||
| let isVisible; | ||
| /** @type {NodeJS.Timeout} */ | ||
| let delayTimeout; | ||
| /** | ||
| * @param {string} className | ||
| * @param {boolean} add | ||
| */ | ||
| const toggleIndicatorClass = (className, add) => { | ||
@@ -20,2 +28,5 @@ indicatorElement.classList[add ? 'add' : 'remove']('pswp__preloader--' + className); | ||
| /** | ||
| * @param {boolean} visible | ||
| */ | ||
| const setIndicatorVisibility = (visible) => { | ||
@@ -22,0 +33,0 @@ if (isVisible !== visible) { |
| import { createElement } from '../util/util.js'; | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** | ||
| * @template T | ||
| * @typedef {import("../types").Methods<T>} Methods<T> | ||
| */ | ||
| /** | ||
| * @typedef {Object} UIElementMarkupProps | ||
| * @prop {boolean=} isCustomSVG | ||
| * @prop {string} inner | ||
| * @prop {string=} outlineID | ||
| * @prop {number | string} [size] | ||
| */ | ||
| /** | ||
| * @typedef {Object} UIElementData | ||
| * @prop {DefaultUIElements | string} [name] | ||
| * @prop {string=} className | ||
| * @prop {UIElementMarkup=} html | ||
| * @prop {boolean=} isButton | ||
| * @prop {keyof HTMLElementTagNameMap} [tagName] | ||
| * @prop {string=} title | ||
| * @prop {string=} ariaLabel | ||
| * @prop {(element: HTMLElement, pswp: PhotoSwipe) => void} [onInit] | ||
| * @prop {Methods<PhotoSwipe> | ((e: MouseEvent, element: HTMLElement, pswp: PhotoSwipe) => void)} [onClick] | ||
| * @prop {'bar' | 'wrapper' | 'root'} [appendTo] | ||
| * @prop {number=} order | ||
| */ | ||
| /** @typedef {'arrowPrev' | 'arrowNext' | 'close' | 'zoom' | 'counter'} DefaultUIElements */ | ||
| /** @typedef {string | UIElementMarkupProps} UIElementMarkup */ | ||
| /** | ||
| * @param {UIElementMarkup} [htmlData] | ||
| */ | ||
| function addElementHTML(htmlData) { | ||
@@ -21,3 +58,4 @@ if (typeof htmlData === 'string') { | ||
| let out = '<svg aria-hidden="true" class="pswp__icn" viewBox="0 0 %d %d" width="%d" height="%d">'; | ||
| out = out.split('%d').join(svgData.size || 32); // replace all %d with size | ||
| // replace all %d with size | ||
| out = out.split('%d').join(/** @type {string} */ (svgData.size || 32)); | ||
@@ -41,2 +79,6 @@ // Icons may contain outline/shadow, | ||
| class UIElement { | ||
| /** | ||
| * @param {PhotoSwipe} pswp | ||
| * @param {UIElementData} data | ||
| */ | ||
| constructor(pswp, data) { | ||
@@ -46,2 +88,3 @@ const name = data.name || data.className; | ||
| // @ts-expect-error lookup only by `data.name` maybe? | ||
| if (pswp.options[name] === false) { | ||
@@ -53,2 +96,3 @@ // exit if element is disabled from options | ||
| // Allow to override SVG icons from options | ||
| // @ts-expect-error lookup only by `data.name` maybe? | ||
| if (typeof pswp.options[name + 'SVG'] === 'string') { | ||
@@ -59,2 +103,3 @@ // arrowPrevSVG | ||
| // zoomSVG | ||
| // @ts-expect-error lookup only by `data.name` maybe? | ||
| elementHTML = pswp.options[name + 'SVG']; | ||
@@ -73,5 +118,6 @@ } | ||
| /** @type {HTMLElement} */ | ||
| let element; | ||
| let tagName = data.isButton ? (data.tagName || 'button') : (data.tagName || 'div'); | ||
| tagName = tagName.toLowerCase(); | ||
| tagName = /** @type {keyof HTMLElementTagNameMap} */ (tagName.toLowerCase()); | ||
| element = createElement(className, tagName); | ||
@@ -83,3 +129,3 @@ | ||
| if (tagName === 'button') { | ||
| element.type = 'button'; | ||
| /** @type {HTMLButtonElement} */ (element).type = 'button'; | ||
| } | ||
@@ -90,3 +136,5 @@ | ||
| // @ts-expect-error lookup only by `data.name` maybe? | ||
| if (typeof pswp.options[name + 'Title'] === 'string') { | ||
| // @ts-expect-error lookup only by `data.name` maybe? | ||
| title = pswp.options[name + 'Title']; | ||
@@ -100,3 +148,3 @@ } | ||
| if (ariaLabel || title) { | ||
| element.setAttribute('aria-label', ariaLabel || title); | ||
| /** @type {HTMLElement} */ (element).setAttribute('aria-label', ariaLabel || title); | ||
| } | ||
@@ -126,3 +174,3 @@ } | ||
| if (!pswp.topBar) { | ||
| pswp.topBar = createElement('pswp__top-bar pswp__hide-on-close', false, pswp.scrollWrap); | ||
| pswp.topBar = createElement('pswp__top-bar pswp__hide-on-close', 'div', pswp.scrollWrap); | ||
| } | ||
@@ -129,0 +177,0 @@ container = pswp.topBar; |
@@ -8,2 +8,5 @@ import UIElement from './ui-element.js'; | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {import("./ui-element").UIElementData} UIElementData */ | ||
| /** | ||
@@ -15,3 +18,4 @@ * Set special class on element when image is zoomed. | ||
| * | ||
| * @param {Boolean} isZoomedIn | ||
| * @param {HTMLElement} el | ||
| * @param {boolean} isZoomedIn | ||
| */ | ||
@@ -23,2 +27,11 @@ function setZoomedIn(el, isZoomedIn) { | ||
| class UI { | ||
| /** @type {() => void} */ | ||
| updatePreloaderVisibility; | ||
| /** @type {number} */ | ||
| _lastUpdatedZoomLevel; | ||
| /** | ||
| * @param {PhotoSwipe} pswp | ||
| */ | ||
| constructor(pswp) { | ||
@@ -31,2 +44,3 @@ this.pswp = pswp; | ||
| this.isRegistered = false; | ||
| /** @type {UIElementData[]} */ | ||
| this.uiElementsData = [ | ||
@@ -49,2 +63,3 @@ closeButton, | ||
| /** @type {(UIElement | UIElementData)[]} */ | ||
| this.items = []; | ||
@@ -64,2 +79,5 @@ | ||
| /** | ||
| * @param {UIElementData} elementData | ||
| */ | ||
| registerElement(elementData) { | ||
@@ -66,0 +84,0 @@ if (this.isRegistered) { |
| import CSSAnimation from './css-animation.js'; | ||
| import SpringAnimation from './spring-animation.js'; | ||
| /** @typedef {SpringAnimation | CSSAnimation} Animation */ | ||
| /** | ||
| * @typedef {Object} AnimationProps | ||
| * | ||
| * @prop {HTMLElement=} target | ||
| * | ||
| * @prop {string=} name | ||
| * | ||
| * @prop {number=} start | ||
| * @prop {number=} end | ||
| * @prop {number=} duration | ||
| * @prop {number=} velocity | ||
| * @prop {number=} dampingRatio | ||
| * @prop {number=} naturalFrequency | ||
| * | ||
| * @prop {(end: number) => void} [onUpdate] | ||
| * @prop {() => void} [onComplete] | ||
| * @prop {() => void} [onFinish] | ||
| * | ||
| * @prop {string=} transform | ||
| * @prop {string=} opacity | ||
| * @prop {string=} easing | ||
| * | ||
| * @prop {boolean=} isPan | ||
| * @prop {boolean=} isMainScroll | ||
| */ | ||
| /** | ||
| * Manages animations | ||
| */ | ||
| class Animations { | ||
| constructor() { | ||
| /** @type {Animation[]} */ | ||
| this.activeAnimations = []; | ||
| } | ||
| /** | ||
| * @param {AnimationProps} props | ||
| */ | ||
| startSpring(props) { | ||
@@ -17,2 +48,5 @@ this._start(props, true); | ||
| /** | ||
| * @param {AnimationProps} props | ||
| */ | ||
| startTransition(props) { | ||
@@ -22,3 +56,8 @@ this._start(props); | ||
| /** | ||
| * @param {AnimationProps} props | ||
| * @param {boolean=} isSpring | ||
| */ | ||
| _start(props, isSpring) { | ||
| /** @type {Animation} */ | ||
| let animation; | ||
@@ -37,2 +76,5 @@ if (isSpring) { | ||
| /** | ||
| * @param {Animation} animation | ||
| */ | ||
| stop(animation) { | ||
@@ -39,0 +81,0 @@ animation.destroy(); |
@@ -1,5 +0,1 @@ | ||
| /** | ||
| * Runs CSS transition. | ||
| */ | ||
| import { setTransitionStyle, removeTransitionStyle } from './util.js'; | ||
@@ -9,4 +5,16 @@ | ||
| /** @typedef {import("./animations").AnimationProps} AnimationProps */ | ||
| /** | ||
| * Runs CSS transition. | ||
| */ | ||
| class CSSAnimation { | ||
| // onComplete can be unpredictable, be careful about current state | ||
| /** @type {() => void} */ | ||
| onFinish; | ||
| /** | ||
| * onComplete can be unpredictable, be careful about current state | ||
| * | ||
| * @param {AnimationProps} props | ||
| */ | ||
| constructor(props) { | ||
@@ -30,3 +38,5 @@ this.props = props; | ||
| /** @private */ | ||
| this._target = target; | ||
| /** @private */ | ||
| this._onComplete = onComplete; | ||
@@ -37,2 +47,3 @@ | ||
| /** @private */ | ||
| this._onTransitionEnd = this._onTransitionEnd.bind(this); | ||
@@ -46,2 +57,3 @@ | ||
| // ¯\_(ツ)_/¯ | ||
| /** @private */ | ||
| this._firstFrameTimeout = setTimeout(() => { | ||
@@ -57,2 +69,6 @@ setTransitionStyle(target, prop, duration, easing); | ||
| /** | ||
| * @private | ||
| * @param {TransitionEvent} e | ||
| */ | ||
| _onTransitionEnd(e) { | ||
@@ -64,2 +80,5 @@ if (e.target === this._target) { | ||
| /** | ||
| * @private | ||
| */ | ||
| _finalizeAnimation() { | ||
@@ -66,0 +85,0 @@ if (!this._finished) { |
@@ -13,4 +13,17 @@ // Detect passive event listener support | ||
| /** | ||
| * @typedef {Object} PoolItem | ||
| * @prop {HTMLElement | Window | Document} target | ||
| * @prop {string} type | ||
| * @prop {(e: any) => void} listener | ||
| * @prop {boolean} passive | ||
| */ | ||
| class DOMEvents { | ||
| constructor() { | ||
| /** | ||
| * @type {PoolItem[]} | ||
| * @private | ||
| */ | ||
| this._pool = []; | ||
@@ -22,6 +35,6 @@ } | ||
| * | ||
| * @param {DOMElement} target | ||
| * @param {String} type Can be multiple, separated by space. | ||
| * @param {Function} listener | ||
| * @param {Boolean} passive | ||
| * @param {HTMLElement | Window | Document} target | ||
| * @param {string} type Can be multiple, separated by space. | ||
| * @param {(e: any) => void} listener | ||
| * @param {boolean=} passive | ||
| */ | ||
@@ -35,6 +48,6 @@ add(target, type, listener, passive) { | ||
| * | ||
| * @param {DOMElement} target | ||
| * @param {String} type | ||
| * @param {Function} listener | ||
| * @param {Boolean} passive | ||
| * @param {HTMLElement | Window | Document} target | ||
| * @param {string} type | ||
| * @param {(e: any) => void} listener | ||
| * @param {boolean=} passive | ||
| */ | ||
@@ -65,8 +78,8 @@ remove(target, type, listener, passive) { | ||
| * | ||
| * @param {DOMElement} target | ||
| * @param {String} type | ||
| * @param {Function} listener | ||
| * @param {Boolean} passive | ||
| * @param {Boolean} unbind Whether the event should be added or removed | ||
| * @param {Boolean} skipPool Whether events pool should be skipped | ||
| * @param {HTMLElement | Window | Document} target | ||
| * @param {string} type | ||
| * @param {(e: any) => void} listener | ||
| * @param {boolean} passive | ||
| * @param {boolean=} unbind Whether the event should be added or removed | ||
| * @param {boolean=} skipPool Whether events pool should be skipped | ||
| */ | ||
@@ -78,5 +91,5 @@ _toggleListener(target, type, listener, passive, unbind, skipPool) { | ||
| const methodName = (unbind ? 'remove' : 'add') + 'EventListener'; | ||
| type = type.split(' '); | ||
| type.forEach((eType) => { | ||
| const methodName = unbind ? 'removeEventListener' : 'addEventListener'; | ||
| const types = type.split(' '); | ||
| types.forEach((eType) => { | ||
| if (eType) { | ||
@@ -83,0 +96,0 @@ // Events pool is used to easily unbind all events when PhotoSwipe is closed, |
| import SpringEaser from './spring-easer.js'; | ||
| /** @typedef {import("./animations").AnimationProps} AnimationProps */ | ||
| class SpringAnimation { | ||
| /** @type {() => void} */ | ||
| onFinish; | ||
| /** | ||
| * @param {AnimationProps} props | ||
| */ | ||
| constructor(props) { | ||
@@ -5,0 +13,0 @@ this.props = props; |
@@ -0,21 +1,22 @@ | ||
| const DEFAULT_NATURAL_FREQUENCY = 12; | ||
| const DEFAULT_DAMPING_RATIO = 0.75; | ||
| /** | ||
| * Spring easing helper | ||
| */ | ||
| const DEFAULT_NATURAL_FREQUENCY = 12; | ||
| const DEFAULT_DAMPING_RATIO = 0.75; | ||
| class SpringEaser { | ||
| /** | ||
| * @param {Number} initialVelocity Initial velocity, px per ms. | ||
| * @param {number} initialVelocity Initial velocity, px per ms. | ||
| * | ||
| * @param {Number} dampingRatio Determines how bouncy animation will be. | ||
| * From 0 to 1, 0 - always overshoot, 1 - do not overshoot. | ||
| * "overshoot" refers to part of animation that | ||
| * goes beyond the final value. | ||
| * @param {number} dampingRatio | ||
| * Determines how bouncy animation will be. | ||
| * From 0 to 1, 0 - always overshoot, 1 - do not overshoot. | ||
| * "overshoot" refers to part of animation that | ||
| * goes beyond the final value. | ||
| * | ||
| * @param {Number} naturalFrequency Determines how fast animation will slow down. | ||
| * The higher value - the stiffer the transition will be, | ||
| * and the faster it will slow down. | ||
| * Recommended value from 10 to 50 | ||
| * @param {number} naturalFrequency | ||
| * Determines how fast animation will slow down. | ||
| * The higher value - the stiffer the transition will be, | ||
| * and the faster it will slow down. | ||
| * Recommended value from 10 to 50 | ||
| */ | ||
@@ -38,6 +39,6 @@ constructor(initialVelocity, dampingRatio, naturalFrequency) { | ||
| /** | ||
| * @param {Number} deltaPosition Difference between current and end position of the animation | ||
| * @param {Number} deltaTime Frame duration in milliseconds | ||
| * @param {number} deltaPosition Difference between current and end position of the animation | ||
| * @param {number} deltaTime Frame duration in milliseconds | ||
| * | ||
| * @returns {Number} Displacement, relative to the end position. | ||
| * @returns {number} Displacement, relative to the end position. | ||
| */ | ||
@@ -44,0 +45,0 @@ easeFrame(deltaPosition, deltaTime) { |
@@ -0,8 +1,14 @@ | ||
| /** @typedef {import("../photoswipe").Point} Point */ | ||
| /** @typedef {undefined | null | false | '' | 0} Falsy */ | ||
| /** @typedef {keyof HTMLElementTagNameMap} HTMLElementTagName */ | ||
| /** | ||
| * Creates element and optionally appends it to another. | ||
| * | ||
| * @param {String} className | ||
| * @param {String|NULL} tagName | ||
| * @param {Element|NULL} appendToEl | ||
| */ | ||
| * @template {HTMLElementTagName | Falsy} [T="div"] | ||
| * @template {Node | undefined} [NodeToAppendElementTo=undefined] | ||
| * @param {string=} className | ||
| * @param {T=} [tagName] | ||
| * @param {NodeToAppendElementTo=} appendToEl | ||
| * @returns {T extends HTMLElementTagName ? HTMLElementTagNameMap[T] : HTMLElementTagNameMap['div']} | ||
| */ | ||
| export function createElement(className, tagName, appendToEl) { | ||
@@ -16,5 +22,10 @@ const el = document.createElement(tagName || 'div'); | ||
| } | ||
| // @ts-expect-error | ||
| return el; | ||
| } | ||
| /** | ||
| * @param {Point} p1 | ||
| * @param {Point} p2 | ||
| */ | ||
| export function equalizePoints(p1, p2) { | ||
@@ -29,3 +40,5 @@ p1.x = p2.x; | ||
| /** | ||
| * @param {Point} p | ||
| */ | ||
| export function roundPoint(p) { | ||
@@ -39,4 +52,4 @@ p.x = Math.round(p.x); | ||
| * | ||
| * @param {Object} p1 Point | ||
| * @param {Object} p2 Point | ||
| * @param {Point} p1 | ||
| * @param {Point} p2 | ||
| */ | ||
@@ -52,4 +65,4 @@ export function getDistanceBetween(p1, p2) { | ||
| * | ||
| * @param {Object} p1 | ||
| * @param {Object} p2 | ||
| * @param {Point} p1 | ||
| * @param {Point} p2 | ||
| */ | ||
@@ -63,5 +76,5 @@ export function pointsEqual(p1, p2) { | ||
| * | ||
| * @param {Number} val | ||
| * @param {Number} min | ||
| * @param {Number} max | ||
| * @param {number} val | ||
| * @param {number} min | ||
| * @param {number} max | ||
| */ | ||
@@ -75,5 +88,5 @@ export function clamp(val, min, max) { | ||
| * | ||
| * @param {Number} x | ||
| * @param {Number|null} y | ||
| * @param {Number|null} scale | ||
| * @param {number} x | ||
| * @param {number=} y | ||
| * @param {number=} scale | ||
| */ | ||
@@ -97,6 +110,6 @@ export function toTransformString(x, y, scale) { | ||
| * | ||
| * @param {DOMElement} el | ||
| * @param {Number} x | ||
| * @param {Number|null} y | ||
| * @param {Number|null} scale | ||
| * @param {HTMLElement} el | ||
| * @param {number} x | ||
| * @param {number=} y | ||
| * @param {number=} scale | ||
| */ | ||
@@ -112,6 +125,6 @@ export function setTransform(el, x, y, scale) { | ||
| * | ||
| * @param {Element} el | ||
| * @param {String} prop CSS property to animate | ||
| * @param {Number} duration in ms | ||
| * @param {String|NULL} ease CSS easing function | ||
| * @param {HTMLElement} el | ||
| * @param {string=} prop CSS property to animate | ||
| * @param {number=} duration in ms | ||
| * @param {string=} ease CSS easing function | ||
| */ | ||
@@ -129,2 +142,6 @@ export function setTransitionStyle(el, prop, duration, ease) { | ||
| * Apply width and height CSS properties to element | ||
| * | ||
| * @param {HTMLElement} el | ||
| * @param {string | number} w | ||
| * @param {string | number} h | ||
| */ | ||
@@ -136,2 +153,5 @@ export function setWidthHeight(el, w, h) { | ||
| /** | ||
| * @param {HTMLElement} el | ||
| */ | ||
| export function removeTransitionStyle(el) { | ||
@@ -141,2 +161,6 @@ setTransitionStyle(el); | ||
| /** | ||
| * @param {HTMLImageElement} img | ||
| * @returns {Promise<HTMLImageElement | void>} | ||
| */ | ||
| export function decodeImage(img) { | ||
@@ -157,2 +181,4 @@ if ('decode' in img) { | ||
| /** @typedef {LOAD_STATE[keyof LOAD_STATE]} LoadState */ | ||
| /** @type {{ IDLE: 'idle'; LOADING: 'loading'; LOADED: 'loaded'; ERROR: 'error' }} */ | ||
| export const LOAD_STATE = { | ||
@@ -170,3 +196,3 @@ IDLE: 'idle', | ||
| * | ||
| * @param {Event} e | ||
| * @param {MouseEvent | KeyboardEvent} e | ||
| */ | ||
@@ -182,8 +208,9 @@ export function specialKeyUsed(e) { | ||
| * | ||
| * @param {Element|NodeList|String} option | ||
| * @param {String|null} legacySelector | ||
| * @param {Element|null} parent | ||
| * @returns Element[] | ||
| * @param {HTMLElement | NodeListOf<HTMLElement> | string} option | ||
| * @param {string=} legacySelector | ||
| * @param {HTMLElement | Document} [parent] | ||
| * @returns HTMLElement[] | ||
| */ | ||
| export function getElementsFromOption(option, legacySelector, parent = document) { | ||
| /** @type {HTMLElement[]} */ | ||
| let elements = []; | ||
@@ -208,4 +235,3 @@ | ||
| * | ||
| * @param {*} fn | ||
| * @returns Boolean | ||
| * @param {any} fn | ||
| */ | ||
@@ -212,0 +238,0 @@ export function isPswpClass(fn) { |
@@ -0,1 +1,9 @@ | ||
| /** @typedef {import("../photoswipe").PhotoSwipeOptions} PhotoSwipeOptions */ | ||
| /** @typedef {import("../photoswipe").default} PhotoSwipe */ | ||
| /** @typedef {import("../slide/slide").SlideData} SlideData */ | ||
| /** | ||
| * @param {PhotoSwipeOptions} options | ||
| * @param {PhotoSwipe} pswp | ||
| */ | ||
| export function getViewportSize(options, pswp) { | ||
@@ -48,10 +56,11 @@ if (options.getViewportSizeFn) { | ||
| * | ||
| * @param {String} prop 'left', 'top', 'bottom', 'right' | ||
| * @param {Object} options PhotoSwipe options | ||
| * @param {Object} viewportSize PhotoSwipe viewport size, for example: { x:800, y:600 } | ||
| * @param {Object} itemData Data about the slide | ||
| * @param {Integer} index Slide index | ||
| * @returns {Number} | ||
| * @param {'left' | 'top' | 'bottom' | 'right'} prop | ||
| * @param {PhotoSwipeOptions} options PhotoSwipe options | ||
| * @param {{ x?: number; y?: number }} viewportSize PhotoSwipe viewport size, for example: { x:800, y:600 } | ||
| * @param {SlideData} itemData Data about the slide | ||
| * @param {number} index Slide index | ||
| * @returns {number} | ||
| */ | ||
| export function parsePaddingOption(prop, options, viewportSize, itemData, index) { | ||
| /** @type {number} */ | ||
| let paddingValue; | ||
@@ -65,3 +74,5 @@ | ||
| const legacyPropName = 'padding' + prop[0].toUpperCase() + prop.slice(1); | ||
| // @ts-expect-error | ||
| if (options[legacyPropName]) { | ||
| // @ts-expect-error | ||
| paddingValue = options[legacyPropName]; | ||
@@ -74,3 +85,8 @@ } | ||
| /** | ||
| * @param {PhotoSwipeOptions} options | ||
| * @param {{ x?: number; y?: number }} viewportSize | ||
| * @param {SlideData} itemData | ||
| * @param {number} index | ||
| */ | ||
| export function getPanAreaSize(options, viewportSize, itemData, index) { | ||
@@ -77,0 +93,0 @@ return { |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
No alert changes
Improved metrics
- Total package byte prevSize
- increased by30.89%
1040776
- Number of package files
- increased by79.55%
79
- Lines of code
- increased by48.41%
16819
Worsened metrics
- Dev dependency count
- increased by18.18%
13
No dependency changes