UNPKG

@edgedev/edgecomponents

Version:

Reusable flipbook and magazine Vue components

943 lines 181 kB
(function(){"use strict";try{if(typeof document<"u"){var i=document.createElement("style");i.appendChild(document.createTextNode('.viewport{-webkit-overflow-scrolling:touch;width:100%;height:100%}.viewport.zoom{overflow:scroll}.viewport.zoom.drag-to-scroll{overflow:hidden}.flipbook-container{position:relative;width:100%;height:100%;transform-origin:top left;-webkit-user-select:none;user-select:none}.click-to-flip{position:absolute;width:50%;height:100%;top:0;-webkit-user-select:none;user-select:none}.click-to-flip.left{left:0}.click-to-flip.right{right:0}.bounding-box{position:absolute;-webkit-user-select:none;user-select:none}.page{position:absolute;backface-visibility:hidden}.polygon{position:absolute;top:0;background-repeat:no-repeat;backface-visibility:hidden;transform-origin:center left}.polygon.blank{background-color:#ddd}.polygon .lighting{width:100%;height:100%}@font-face{font-family:swiper-icons;src:url(data:application/font-woff;charset=utf-8;base64,\\ d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA);font-weight:400;font-style:normal}:root{--swiper-theme-color: #007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function, initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translateZ(0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-slide,.swiper-3d .swiper-cube-shadow{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper:before{content:"";flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper:before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper:before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-slide-shadow-bottom{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:#00000026}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,#00000080,#0000)}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color, var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color: #fff}.swiper-lazy-preloader-black{--swiper-preloader-color: #000}@keyframes swiper-preloader-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:root{--swiper-navigation-size: 44px}.swiper-button-prev,.swiper-button-next{position:absolute;top:var(--swiper-navigation-top-offset, 50%);width:calc(var(--swiper-navigation-size) / 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(0px - (var(--swiper-navigation-size) / 2));z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color, var(--swiper-theme-color))}.swiper-button-prev.swiper-button-disabled,.swiper-button-next.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-prev.swiper-button-hidden,.swiper-button-next.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-prev,.swiper-navigation-disabled .swiper-button-next{display:none!important}.swiper-button-prev svg,.swiper-button-next svg{width:100%;height:100%;object-fit:contain;transform-origin:center}.swiper-rtl .swiper-button-prev svg,.swiper-rtl .swiper-button-next svg{transform:rotate(180deg)}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset, 10px);right:auto}.swiper-button-lock{display:none}.swiper-button-prev:after,.swiper-button-next:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;font-variant:initial;line-height:1}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:"prev"}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset, 10px);left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:"next"}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translateZ(0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-pagination-fraction,.swiper-pagination-custom,.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal{bottom:var(--swiper-pagination-bottom, 8px);top:var(--swiper-pagination-top, auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));height:var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius, 50%);background:var(--swiper-pagination-bullet-inactive-color, #000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none!important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color, var(--swiper-theme-color))}.swiper-vertical>.swiper-pagination-bullets,.swiper-pagination-vertical.swiper-pagination-bullets{right:var(--swiper-pagination-right, 8px);left:var(--swiper-pagination-left, auto);top:50%;transform:translate3d(0,-50%,0)}.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap, 6px) 0;display:block}.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap, 4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translate(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color, inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, .25));position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color, var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size, 4px);left:0;top:0}.swiper-vertical>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite{width:var(--swiper-pagination-progressbar-size, 4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}')),document.head.appendChild(i)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})(); import { ref as X, reactive as bi, computed as k, onMounted as Re, onBeforeUnmount as mt, watch as he, createElementBlock as we, openBlock as ae, createBlock as ot, renderSlot as dt, createElementVNode as K, Teleport as Ti, normalizeProps as ut, guardReactiveProps as _t, mergeProps as xi, normalizeStyle as se, normalizeClass as Mt, createCommentVNode as It, Fragment as Nt, renderList as $t, withDirectives as Ei, vShow as Pi, onUpdated as Ft, provide as Gt, nextTick as Ci, h as J, onBeforeUpdate as Mi, resolveComponent as Ii, withCtx as Je, createVNode as Li, unref as Lt } from "vue"; const Oi = ["src"], zi = ["src"], ps = { __name: "flipbook", props: { magazine: { type: Object, required: !0 }, flipDuration: { type: Number, default: 1e3 }, zoomDuration: { type: Number, default: 500 }, zoomLevels: { type: Array, default: () => [1, 2, 4] }, perspective: { type: Number, default: 2400 }, nPolygons: { type: Number, default: 10 }, ambient: { type: Number, default: 0.4 }, gloss: { type: Number, default: 0.6 }, swipeMin: { type: Number, default: 3 }, singlePage: { type: Boolean, default: !1 }, forwardDirection: { type: String, default: "right", validator: (i) => i === "right" || i === "left" }, centering: { type: Boolean, default: !0 }, startPage: { type: Number, default: null }, loadingImage: { type: String, default: "spinner" }, clickToZoom: { type: Boolean, default: !0 }, dragToFlip: { type: Boolean, default: !0 }, wheel: { type: String, default: "scroll" }, teleport: { type: String, default: "" } }, emits: [ "flip-left-start", "flip-left-end", "flip-right-start", "flip-right-end", "zoom-start", "zoom-end" ], setup(i, { emit: e }) { const t = i, n = e, a = (p) => p ** 2, r = (p) => 1 - a(1 - p), o = (p) => p < 0.5 ? a(p * 2) / 2 : 0.5 + r((p - 0.5) * 2) / 2, l = X(1), d = X(null), s = bi({ viewWidth: 0, viewHeight: 0, imageWidth: null, imageHeight: null, displayedPages: 1, nImageLoad: 0, nImageLoadTrigger: 0, imageLoadCallback: null, currentPage: 0, firstPage: 0, secondPage: 1, zoomIndex: 0, zooming: !1, touchStartX: null, touchStartY: null, maxMove: 0, activeCursor: null, hasTouchEvents: !1, hasPointerEvents: !1, minX: 1 / 0, maxX: -1 / 0, preloadedImages: {}, flip: { progress: 0, direction: null, frontImage: null, backImage: null, auto: !1, opacity: 1 }, currentCenterOffset: null, animatingCenter: !1, startScrollLeft: 0, startScrollTop: 0, scrollLeft: 0, scrollTop: 0, loadedImages: {}, mounted: !1, finalImages: {} }), u = k(() => { var I, G, R; if ((I = t.magazine) != null && I.thumbnailImages) return [null, ...t.magazine.thumbnailImages.slice().sort((_, F) => { const q = Number.parseInt(_.pageName.replace(/\D/g, "")), Y = Number.parseInt(F.pageName.replace(/\D/g, "")); return q - Y; }).map((_) => _.url)]; const p = ((R = (G = t.magazine) == null ? void 0 : G.ccState) == null ? void 0 : R.cfImages) || {}; return [null, ...Object.keys(p).sort().map((_) => p[_].variants.find((q) => q.includes("/thumbnail"))).filter(Boolean)]; }), c = k(() => { var I, G, R; if ((I = t.magazine) != null && I.highResImages) return [null, ...t.magazine.highResImages.slice().sort((_, F) => { const q = Number.parseInt(_.pageName.replace(/\D/g, "")), Y = Number.parseInt(F.pageName.replace(/\D/g, "")); return q - Y; }).map((_) => _.url)]; const p = ((R = (G = t.magazine) == null ? void 0 : G.ccState) == null ? void 0 : R.cfImages) || {}; return [null, ...Object.keys(p).sort().map((_) => p[_].variants.find((q) => q.includes("/public"))).filter(Boolean)]; }), h = k(() => t.zoomLevels || [1]), v = k(() => !s.flip.direction && s.currentPage + s.displayedPages < u.value.length), g = (p, E = !1) => { if (E && l.value > 1 && !s.zooming) { const I = c.value[p]; return I && console.log("Using high-res image:", I), I.replace("/public", "/highres"); } return u.value[p] || null; }, w = k(() => !s.flip.direction && s.currentPage >= s.displayedPages && !(s.displayedPages === 1 && !g(s.firstPage - 1))), P = k(() => typeof navigator < "u" && /Trident/.test(navigator.userAgent)), y = k(() => t.forwardDirection === "left" ? v.value : w.value), f = k(() => t.forwardDirection === "right" ? v.value : w.value), m = k(() => !s.zooming && s.zoomIndex < h.value.length - 1), S = k(() => !s.zooming && s.zoomIndex > 0), T = k(() => u.value[0] == null ? u.value.length - 1 : u.value.length), L = k(() => u.value[0] != null ? s.currentPage + 1 : Math.max(1, s.currentPage)), O = k(() => t.forwardDirection === "right" || s.displayedPages === 1 ? s.firstPage : s.secondPage), C = k(() => t.forwardDirection === "left" ? s.firstPage : s.secondPage), b = k(() => O.value !== null && O.value > 0), x = k(() => C.value !== null && s.displayedPages === 2), M = k(() => s.activeCursor ? s.activeCursor : P.value ? "auto" : t.clickToZoom && m.value ? "zoom-in" : t.clickToZoom && S.value ? "zoom-out" : t.dragToFlip ? "grab" : "auto"), A = k(() => { const p = s.displayedPages * s.imageWidth, E = s.viewWidth / p, I = s.viewHeight / s.imageHeight; return Math.min(E, I); }), z = k(() => Math.round(s.imageWidth * A.value)), N = k(() => Math.round(s.imageHeight * A.value)), $ = k(() => (s.viewWidth - z.value * s.displayedPages) / 2), B = k(() => (s.viewHeight - N.value) / 2), H = k(() => { const p = z.value / t.nPolygons; return `${Math.ceil(p + 1 / l.value)}px`; }), D = k(() => `${N.value}px`), V = k(() => `${z.value}px ${N.value}px`), W = (p) => { if (!s.flip.direction) return []; let E = s.flip.progress, I = s.flip.direction; s.displayedPages === 1 && I !== t.forwardDirection && (E = 1 - E, I = t.forwardDirection), s.flip.opacity = s.displayedPages === 1 && E > 0.7 ? 1 - (E - 0.7) / 0.3 : 1; const G = p === "front" ? s.flip.frontImage : s.flip.backImage, R = z.value / t.nPolygons; let _ = $.value, F = !1; s.displayedPages === 1 ? t.forwardDirection === "right" ? p === "back" && (F = !0, _ = $.value - z.value) : I === "left" ? p === "back" ? _ = z.value - $.value : F = !0 : p === "front" ? _ = z.value - $.value : F = !0 : I === "left" ? p === "back" ? _ = s.viewWidth / 2 : F = !0 : p === "front" ? _ = s.viewWidth / 2 : F = !0; const q = (ge, Me) => { const me = [], Ie = [-0.5, -0.25, 0, 0.25, 0.5]; if (t.ambient < 1) { const ne = 1 - t.ambient, U = Ie.map( (ie) => (1 - Math.cos((ge - Me * ie) / 180 * Math.PI)) * ne ); me.push(` linear-gradient(to right, rgba(0, 0, 0, ${U[0]}), rgba(0, 0, 0, ${U[1]}) 25%, rgba(0, 0, 0, ${U[2]}) 50%, rgba(0, 0, 0, ${U[3]}) 75%, rgba(0, 0, 0, ${U[4]})) `); } if (t.gloss > 0 && !P.value) { const ie = Ie.map( (Le) => Math.max( Math.cos((ge + 30 - Me * Le) / 180 * Math.PI) ** 200, Math.cos((ge - 30 - Me * Le) / 180 * Math.PI) ** 200 ) ); me.push(` linear-gradient(to right, rgba(255, 255, 255, ${ie[0] * t.gloss}), rgba(255, 255, 255, ${ie[1] * t.gloss}) 25%, rgba(255, 255, 255, ${ie[2] * t.gloss}) 50%, rgba(255, 255, 255, ${ie[3] * t.gloss}) 75%, rgba(255, 255, 255, ${ie[4] * t.gloss})) `); } return me.join(","); }, Y = new DOMMatrix(); Y.translateSelf(s.viewWidth / 2, 0), Y.scaleSelf(1, 1, t.perspective), Y.translateSelf(-s.viewWidth / 2, 0), Y.translateSelf(_, B.value); let de = 0; E > 0.5 && (de = -(E - 0.5) * 2 * 180), I === "left" && (de = -de), de += p === "back" ? 180 : 0, de && (F && Y.translateSelf(z.value, 0), Y.rotateAxisAngleSelf(0, 1, 0, de), F && Y.translateSelf(-z.value, 0)); let pe = E < 0.5 ? E * 2 * Math.PI : (1 - (E - 0.5) * 2) * Math.PI; pe === 0 && (pe = 1e-9); const Pe = z.value / pe; let be = 0; const Ce = pe / t.nPolygons; let ue = Ce / 2 / Math.PI * 180, ee = Ce / Math.PI * 180; F && (ue = -pe / Math.PI * 180 + ee / 2), p === "back" && (ue = -ue, ee = -ee), s.minX = 1 / 0, s.maxX = -1 / 0; const te = []; for (let ge = 0; ge < t.nPolygons; ge++) { const Me = `${ge / (t.nPolygons - 1) * 100}% 0px`, me = new DOMMatrix(Y), Ie = F ? pe - be : be; let ne = Math.sin(Ie) * Pe; ne = F ? z.value - ne : ne; let U = (1 - Math.cos(Ie)) * Pe; U = p === "back" ? -U : U, (isNaN(ne) || !isFinite(ne)) && (ne = 0), (isNaN(U) || !isFinite(U)) && (U = 0), me.translateSelf(ne, 0, U), me.rotateAxisAngleSelf(0, 1, 0, -ue); const ie = me.m41, Le = ie + R; s.maxX = Math.max(ie, Le, s.maxX), s.minX = Math.min(ie, Le, s.minX); const Si = q(de - ue, ee); be += Ce, ue += ee, te.push([p + ge, G, Si, Me, me.toString(), Math.abs(Math.round(U))]); } return te; }, oe = k(() => [ ...W("front"), // Generates polygon data for the front side ...W("back") // Generates polygon data for the back side ]), Se = (p) => { if (s.imageWidth == null) return p; if (s.loadedImages[p]) return p; { const E = new Image(); return E.onload = () => { s.loadedImages[p] = !0; }, E.src = p, t.loadingImage; } }, Ve = (p, E) => { if (s.finalImages[p]) return; const I = new Image(); I.onload = () => { s.finalImages[p] = E; }, I.src = E; }, ti = k(() => oe.value.map(([p, E, I, G, R, _]) => { const F = E.replace("/thumbnail", "/highres"); Ve(E, F); const q = s.finalImages[E] || E; return { key: p, bgImage: `url(${q})`, lighting: I, bgPos: G, transform: R, z: _ }; })), fe = k(() => { if (s.displayedPages === 1) return $.value; const p = b.value ? $.value : s.viewWidth / 2; return p < s.minX ? p : s.minX; }), xe = k(() => { if (s.displayedPages === 1) return s.viewWidth - $.value; const p = x.value ? s.viewWidth - $.value : s.viewWidth / 2; return p > s.maxX ? p : s.maxX; }), ze = k(() => { const p = t.centering ? Math.round(s.viewWidth / 2 - (fe.value + xe.value) / 2) : 0; return s.currentCenterOffset == null && s.imageWidth != null && (s.currentCenterOffset = p), p; }), Ee = k(() => Math.round(s.currentCenterOffset)), He = k(() => !t.hasTouchEvents), ii = k(() => { const p = (xe.value - fe.value) * l.value; return p < s.viewWidth ? (fe.value + Ee.value) * l.value - (s.viewWidth - p) / 2 : (fe.value + Ee.value) * l.value; }), ni = k(() => { const p = (xe.value - fe.value) * l.value; return p < s.viewWidth ? (fe.value + Ee.value) * l.value - (s.viewWidth - p) / 2 : (xe.value + Ee.value) * l.value - s.viewWidth; }), si = k(() => { const p = N.value * l.value; return p < s.viewHeight ? B.value * l.value - (s.viewHeight - p) / 2 : B.value * l.value; }), ai = k(() => { const p = N.value * l.value; return p < s.viewHeight ? B.value * l.value - (s.viewHeight - p) / 2 : (B.value + N.value) * l.value - s.viewHeight; }), ri = k(() => Math.min(ni.value, Math.max(ii.value, s.scrollLeft))), li = k(() => Math.min(ai.value, Math.max(si.value, s.scrollTop))), wt = () => { s.displayedPages === 1 && s.currentPage === 0 && u.value.length && !g(0) && s.currentPage++; }, We = () => { const p = d.value; p && (s.viewWidth = p.clientWidth, s.viewHeight = p.clientHeight, s.displayedPages = s.viewWidth > s.viewHeight && !t.singlePage ? 2 : 1, s.displayedPages === 2 && (s.currentPage &= -2), wt(), s.minX = 1 / 0, s.maxX = -1 / 0); }, yt = (p) => { p == null || p === L.value || (u.value[0] == null ? s.displayedPages === 2 && p === 1 ? s.currentPage = 0 : s.currentPage = p : s.currentPage = p - 1, s.minX = 1 / 0, s.maxX = -1 / 0, s.currentCenterOffset = ze.value); }, oi = (p, E = !1) => { const I = g(p, E); if (E && l.value > 1 && !s.zooming) return I; if (I) return Se(I); }, Be = (p = !1) => { for (let E = s.currentPage - 3; E <= s.currentPage + 3; E++) oi(E); if (p) for (let E = s.currentPage; E < s.currentPage + s.displayedPages; E++) { const I = c.value[E]; if (I) { const G = new Image(); G.src = I; } } }, St = () => { s.firstPage = s.currentPage, s.secondPage = s.currentPage + 1, Be(); const p = O.value, E = C.value, I = g(p), G = g(E), R = I == null ? void 0 : I.replace("/thumbnail", "/highres"), _ = G == null ? void 0 : G.replace("/thumbnail", "/highres"); I && R && Ve(I, R), G && _ && Ve(G, _); }; Re(() => { window.addEventListener("resize", We, { passive: !0 }), We(), l.value = h.value[0], yt(t.startPage), console.log("canzoom"), console.log(s.zoomIndex), console.log(h.value), console.log(l.value), console.log(m.value), St(), s.mounted = !0; }), mt(() => { window.removeEventListener("resize", We, { passive: !0 }); }); const bt = (p, E) => { s.nImageLoad = 0, s.nImageLoadTrigger = p, s.imageLoadCallback = E; }, Tt = (p) => { const E = Date.now(), I = t.flipDuration * (1 - s.flip.progress), G = s.flip.progress; s.flip.auto = !0, n(`flip-${s.flip.direction}-start`, L.value); const R = () => { requestAnimationFrame(() => { const _ = Date.now() - E; let F = G + _ / I; F = F > 1 ? 1 : F, s.flip.progress = p ? o(F) : F, F < 1 ? R() : (s.flip.direction !== t.forwardDirection ? s.currentPage -= s.displayedPages : s.currentPage += s.displayedPages, n(`flip-${s.flip.direction}-end`, L.value), s.displayedPages === 1 && s.flip.direction === t.forwardDirection ? s.flip.direction = null : bt(1, () => { s.flip.direction = null; }), s.flip.auto = !1); }); }; R(); }, Ae = (p, E) => { p !== t.forwardDirection ? s.displayedPages === 1 ? (s.flip.frontImage = g(s.currentPage - 1), s.flip.backImage = null) : (s.flip.frontImage = g(s.firstPage), s.flip.backImage = g(s.currentPage - s.displayedPages + 1)) : s.displayedPages === 1 ? (s.flip.frontImage = g(s.currentPage), s.flip.backImage = null) : (s.flip.frontImage = g(s.secondPage), s.flip.backImage = g(s.currentPage + s.displayedPages)), s.flip.direction = p, s.flip.progress = 0, requestAnimationFrame(() => { requestAnimationFrame(() => { s.flip.direction !== t.forwardDirection ? s.displayedPages === 2 && (s.firstPage = s.currentPage - s.displayedPages) : s.displayedPages === 1 ? s.firstPage = s.currentPage + s.displayedPages : s.secondPage = s.currentPage + 1 + s.displayedPages, E && Tt(!0); }); }); }, je = () => { y.value && Ae("left", !0); }, qe = () => { f.value && Ae("right", !0); }, di = () => { const p = Date.now(), E = t.flipDuration * s.flip.progress, I = s.flip.progress; s.flip.auto = !0; const G = () => { requestAnimationFrame(() => { const R = Date.now() - p; let _ = I - I * R / E; _ = _ < 0 ? 0 : _, s.flip.progress = _, _ > 0 ? G() : (s.firstPage = s.currentPage, s.secondPage = s.currentPage + 1, s.displayedPages === 1 && s.flip.direction !== t.forwardDirection ? s.flip.direction = null : bt(1, () => { s.flip.direction = null; }), s.flip.auto = !1); }); }; G(); }, Xe = (p, E = null) => { const I = d.value; let G, R; if (E) { const ee = I.getBoundingClientRect(); G = E.pageX - ee.left, R = E.pageY - ee.top; } else G = I.clientWidth / 2, R = I.clientHeight / 2; const _ = l.value, F = p, q = I.scrollLeft, Y = I.scrollTop, de = G + q, pe = R + Y, Pe = de / _ * F - G, be = pe / _ * F - R, Ce = Date.now(); s.zooming = !0, n("zoomStart", l.value); const ue = () => { requestAnimationFrame(() => { const ee = Date.now() - Ce; let te = ee / t.zoomDuration; te = te > 1 ? 1 : te, te = o(te), l.value = _ + (F - _) * te, s.scrollLeft = q + (Pe - q) * te, s.scrollTop = Y + (be - Y) * te, ee < t.zoomDuration ? ue() : (n("zoomEnd", p), s.zooming = !1, l.value = p, s.scrollLeft = Pe, s.scrollTop = be); }); }; ue(), F > 1 && Be(!0); }, xt = (p) => { var I; const E = p.target || ((I = p.path) == null ? void 0 : I[0]); s.imageWidth == null && (s.imageWidth = E.naturalWidth, console.log("imageWidth", s.imageWidth), s.imageHeight = E.naturalHeight, console.log("imageHeight", s.imageHeight), Be()), s.imageLoadCallback && ++s.nImageLoad >= s.nImageLoadTrigger && (s.imageLoadCallback(), s.imageLoadCallback = null); }, Ye = (p = null) => { m.value && (s.zoomIndex += 1, Xe(h.value[s.zoomIndex], p)); }, Ue = (p = null) => { S.value && (s.zoomIndex -= 1, Xe(h.value[s.zoomIndex], p)); }, ui = (p) => { s.zoomIndex = (s.zoomIndex + 1) % h.value.length, Xe(h.value[s.zoomIndex], p); }, Ze = (p) => { s.touchStartX = p.pageX, s.touchStartY = p.pageY, s.maxMove = 0, l.value <= 1 ? t.dragToFlip && (s.activeCursor = "grab") : (s.startScrollLeft = d.value.scrollLeft, s.startScrollTop = d.value.scrollTop, s.activeCursor = "all-scroll"); }, ci = (p, E) => { s.scrollLeft = s.startScrollLeft - p, s.scrollTop = s.startScrollTop - E; }, Ke = (p) => { if (s.touchStartX == null) return; const E = p.pageX - s.touchStartX, I = p.pageY - s.touchStartY; if (s.maxMove = Math.max(s.maxMove, Math.abs(E)), s.maxMove = Math.max(s.maxMove, Math.abs(I)), l.value > 1) { He.value && ci(E, I); return; } if (t.dragToFlip && !(Math.abs(I) > Math.abs(E))) return s.activeCursor = "grabbing", E > 0 ? (!s.flip.direction && y.value && E >= t.swipeMin && Ae("left", !1), s.flip.direction === "left" && (s.flip.progress = E / z.value, s.flip.progress > 1 && (s.flip.progress = 1))) : (!s.flip.direction && f.value && E <= -t.swipeMin && Ae("right", !1), s.flip.direction === "right" && (s.flip.progress = -E / z.value, s.flip.progress > 1 && (s.flip.progress = 1))), !0; }, Qe = (p) => { s.touchStartX != null && (t.clickToZoom && s.maxMove < t.swipeMin && ui(p), s.flip.direction && !s.flip.auto && (s.flip.progress > 0.25 ? Tt(!1) : di()), s.touchStartX = null, s.activeCursor = null); }, fi = (p) => { s.hasTouchEvents = !0, Ze(p.changedTouches[0]); }, pi = (p) => { Ke(p.changedTouches[0]) && p.cancelable && p.preventDefault(); }, Et = (p) => Qe(p.changedTouches[0]), gi = (p) => { if (console.log("on pointer down"), s.hasPointerEvents = !0, !s.hasTouchEvents && !(p.which && p.which !== 1)) { Ze(p); try { p.target.setPointerCapture(p.pointerId); } catch (E) { console.log(E); } } }, mi = (p) => { s.hasTouchEvents || Ke(p); }, Pt = (p) => { if (!s.hasTouchEvents) { Qe(p); try { p.target.releasePointerCapture(p.pointerId); } catch (E) { console.log(E); } } }, hi = (p) => { console.log("on mouse down"), !(s.hasTouchEvents || s.hasPointerEvents) && (p.which && p.which !== 1 || Ze(p)); }, vi = (p) => { !s.hasTouchEvents && !s.hasPointerEvents && Ke(p); }, wi = (p) => { console.log("on mouse up"), !s.hasTouchEvents && !s.hasPointerEvents && Qe(p); }, yi = (p) => { t.wheel === "scroll" && l.value > 1 && He.value && (s.scrollLeft = d.value.scrollLeft + p.deltaX, s.scrollTop = d.value.scrollTop + p.deltaY, p.cancelable && p.preventDefault()), t.wheel === "zoom" && (p.deltaY >= 100 ? (Ue(p), p.cancelable && p.preventDefault()) : p.deltaY <= -100 && (Ye(p), p.cancelable && p.preventDefault())); }; he(() => s.currentPage, () => { s.firstPage = s.currentPage, s.secondPage = s.currentPage + 1, Be(); }), he(() => ze.value, () => { if (s.animatingCenter) return; const p = () => { requestAnimationFrame(() => { const I = ze.value - s.currentCenterOffset; Math.abs(I) < 0.5 ? (s.currentCenterOffset = ze.value, s.animatingCenter = !1) : (s.currentCenterOffset += I * 0.1, p()); }); }; s.animatingCenter = !0, p(); }), he(ri, (p) => { P.value ? requestAnimationFrame(() => { d.value && (d.value.scrollLeft = p); }) : d.value && (d.value.scrollLeft = p); }), he(() => li.value, (p) => { P.value ? requestAnimationFrame(() => { d.value.scrollTop = p; }) : d.value.scrollTop = p; }), he(() => u.value, (p, E) => { wt(), !(E != null && E.length) && (p != null && p.length) && t.startPage > 1 && p[0] === null && s.currentPage++; }), he(() => t.startPage, (p) => { yt(p); }); const Ct = (p) => { document.fullscreenElement ? document.exitFullscreen() : p.requestFullscreen ? p.requestFullscreen() : p.webkitRequestFullscreen ? p.webkitRequestFullscreen() : p.msRequestFullscreen && p.msRequestFullscreen(); }; return he(() => s.currentPage, () => { St(); }), (p, E) => (ae(), we("div", null, [ s.mounted && t.teleport ? (ae(), ot(Ti, { key: 0, to: `#${t.teleport}` }, [ dt(p.$slots, "default", ut(_t({ canFlipLeft: y.value, canFlipRight: f.value, canZoomIn: m.value, canZoomOut: S.value, page: L.value, numPages: T.value, flipLeft: je, flipRight: qe, zoomIn: Ye, zoomOut: Ue, openFullscreen: Ct, viewport: d.value }))) ], 8, ["to"])) : dt(p.$slots, "default", ut(xi({ key: 1 }, { canFlipLeft: y.value, canFlipRight: f.value, canZoomIn: m.value, canZoomOut: S.value, page: L.value, numPages: T.value, flipLeft: je, flipRight: qe, zoomIn: Ye, zoomOut: Ue, openFullscreen: Ct, viewport: d.value }))), K("div", { ref_key: "viewport", ref: d, class: Mt(["viewport h-full w-full", { zoom: s.zooming || l.value > 1, "drag-to-scroll": He.value }]), style: se({ cursor: M.value === "grabbing" ? "grabbing" : "auto" }), onTouchmove: pi, onPointermove: mi, onMousemove: vi, onTouchend: Et, onTouchcancel: Et, onPointerup: Pt, onPointercancel: Pt, onMouseup: wi, onWheel: yi }, [ K("div", { class: "flipbook-container", style: se({ transform: `scale(${l.value})` }) }, [ K("div", { class: "click-to-flip left", style: se({ cursor: y.value ? "pointer" : "auto" }), onClick: je }, null, 4), K("div", { class: "click-to-flip right", style: se({ cursor: f.value ? "pointer" : "auto" }), onClick: qe }, null, 4), K("div", { style: se({ transform: `translateX(${Ee.value}px)` }) }, [ b.value ? (ae(), we("img", { key: 0, class: "fixed page", style: se({ width: `${z.value}px`, height: `${N.value}px`, left: `${$.value}px`, top: `${B.value}px` }), src: s.finalImages[g(O.value)] || g(O.value), onLoad: E[0] || (E[0] = (I) => xt(I)) }, null, 44, Oi)) : It("", !0), x.value && g(C.value) ? (ae(), we("img", { key: 1, class: "fixed page", style: se({ width: `${z.value}px`, height: `${N.value}px`, left: `${g(O.value) ? s.viewWidth / 2 : (s.viewWidth - z.value) / 2}px`, top: `${B.value}px` }), src: s.finalImages[g(C.value)] || g(C.value), onLoad: E[1] || (E[1] = (I) => xt(I)) }, null, 44, zi)) : It("", !0), (ae(!0), we(Nt, null, $t(ti.value, ({ key: I, bgImage: G, lighting: R, bgPos: _, transform: F, z: q }) => (ae(), we("div", { key: I, class: Mt(["polygon", { blank: !G }]), style: se({ left: `${g(O.value) ? 0 : -(z.value / 2)}px`, backgroundImage: G, backgroundSize: V.value, backgroundPosition: _, width: H.value, height: D.value, transform: F, zIndex: q }) }, [ Ei(K("div", { class: "lighting", style: se({ backgroundImage: R }) }, null, 4), [ [Pi, R.length] ]) ], 6))), 128)), K("div", { class: "bounding-box", style: se({ left: `${fe.value}px`, top: `${B.value}px`, width: `${xe.value - fe.value}px`, height: `${N.value}px`, cursor: M.value }), onTouchstart: fi, onPointerdown: gi, onMousedown: hi }, null, 36) ], 4) ], 4) ], 38) ])); } }; function Ot(i) { return i !== null && typeof i == "object" && "constructor" in i && i.constructor === Object; } function ht(i, e) { i === void 0 && (i = {}), e === void 0 && (e = {}); const t = ["__proto__", "constructor", "prototype"]; Object.keys(e).filter((n) => t.indexOf(n) < 0).forEach((n) => { typeof i[n] > "u" ? i[n] = e[n] : Ot(e[n]) && Ot(i[n]) && Object.keys(e[n]).length > 0 && ht(i[n], e[n]); }); } const Rt = { body: {}, addEventListener() { }, removeEventListener() { }, activeElement: { blur() { }, nodeName: "" }, querySelector() { return null; }, querySelectorAll() { return []; }, getElementById() { return null; }, createEvent() { return { initEvent() { } }; }, createElement() { return { children: [], childNodes: [], style: {}, setAttribute() { }, getElementsByTagName() { return []; } }; }, createElementNS() { return {}; }, importNode() { return null; }, location: { hash: "", host: "", hostname: "", href: "", origin: "", pathname: "", protocol: "", search: "" } }; function le() { const i = typeof document < "u" ? document : {}; return ht(i, Rt), i; } const Bi = { document: Rt, navigator: { userAgent: "" }, location: { hash: "", host: "", hostname: "", href: "", origin: "", pathname: "", protocol: "", search: "" }, history: { replaceState() { }, pushState() { }, go() { }, back() { } }, CustomEvent: function() { return this; }, addEventListener() { }, removeEventListener() { }, getComputedStyle() { return { getPropertyValue() { return ""; } }; }, Image() { }, Date() { }, screen: {}, setTimeout() { }, clearTimeout() { }, matchMedia() { return {}; }, requestAnimationFrame(i) { return typeof setTimeout > "u" ? (i(), null) : setTimeout(i, 0); }, cancelAnimationFrame(i) { typeof setTimeout > "u" || clearTimeout(i); } }; function Z() { const i = typeof window < "u" ? window : {}; return ht(i, Bi), i; } function Ai(i) { return i === void 0 && (i = ""), i.trim().split(" ").filter((e) => !!e.trim()); } function Di(i) { const e = i; Object.keys(e).forEach((t) => { try { e[t] = null; } catch { } try { delete e[t]; } catch { } }); } function ct(i, e) { return e === void 0 && (e = 0), setTimeout(i, e); } function Ne() { return Date.now(); } function ki(i) { const e = Z(); let t; return e.getComputedStyle && (t = e.getComputedStyle(i, null)), !t && i.currentStyle && (t = i.currentStyle), t || (t = i.style), t; } function _i(i, e) { e === void 0 && (e = "x"); const t = Z(); let n, a, r; const o = ki(i); return t.WebKitCSSMatrix ? (a = o.transform || o.webkitTransform, a.split(",").length > 6 && (a = a.split(", ").map((l) => l.replace(",", ".")).join(", ")), r = new t.WebKitCSSMatrix(a === "none" ? "" : a)) : (r = o.MozTransform || o.OTransform || o.MsTransform || o.msTransform || o.transform || o.getPropertyValue("transform").replace("translate(", "matrix(1, 0, 0, 1,"), n = r.toString().split(",")), e === "x" && (t.WebKitCSSMatrix ? a = r.m41 : n.length === 16 ? a = parseFloat(n[12]) : a = parseFloat(n[4])), e === "y" && (t.WebKitCSSMatrix ? a = r.m42 : n.length === 16 ? a = parseFloat(n[13]) : a = parseFloat(n[5])), a || 0; } function De(i) { return typeof i == "object" && i !== null && i.constructor && Object.prototype.toString.call(i).slice(8, -1) === "Object"; } function Ni(i) { return typeof window < "u" && typeof window.HTMLElement < "u" ? i instanceof HTMLElement : i && (i.nodeType === 1 || i.nodeType === 11); } function Q() { const i = Object(arguments.length <= 0 ? void 0 : arguments[0]), e = ["__proto__", "constructor", "prototype"]; for (let t = 1; t < arguments.length; t += 1) { const n = t < 0 || arguments.length <= t ? void 0 : arguments[t]; if (n != null && !Ni(n)) { const a = Object.keys(Object(n)).filter((r) => e.indexOf(r) < 0); for (let r = 0, o = a.length; r < o; r += 1) { const l = a[r], d = Object.getOwnPropertyDescriptor(n, l); d !== void 0 && d.enumerable && (De(i[l]) && De(n[l]) ? n[l].__swiper__ ? i[l] = n[l] : Q(i[l], n[l]) : !De(i[l]) && De(n[l]) ? (i[l] = {}, n[l].__swiper__ ? i[l] = n[l] : Q(i[l], n[l])) : i[l] = n[l]); } } } return i; } function ke(i, e, t) { i.style.setProperty(e, t); } function Vt(i) { let { swiper: e, targetPosition: t, side: n } = i; const a = Z(), r = -e.translate; let o = null, l; const d = e.params.speed; e.wrapperEl.style.scrollSnapType = "none", a.cancelAnimationFrame(e.cssModeFrameID); const s = t > r ? "next" : "prev", u = (h, v) => s === "next" && h >= v || s === "prev" && h <= v, c = () => { l = (/* @__PURE__ */ new Date()).getTime(), o === null && (o = l); const h = Math.max(Math.min((l - o) / d, 1), 0), v = 0.5 - Math.cos(h * Math.PI) / 2; let g = r + v * (t - r); if (u(g, t) && (g = t), e.wrapperEl.scrollTo({ [n]: g }), u(g, t)) { e.wrapperEl.style.overflow = "hidden", e.wrapperEl.style.scrollSnapType = "", setTimeout(() => { e.wrapperEl.style.overflow = "", e.wrapperEl.scrollTo({ [n]: g }); }), a.cancelAnimationFrame(e.cssModeFrameID); return; } e.cssModeFrameID = a.requestAnimationFrame(c); }; c(); } function re(i, e) { e === void 0 && (e = ""); const t = Z(), n = [...i.children]; return t.HTMLSlotElement && i instanceof HTMLSlotElement && n.push(...i.assignedElements()), e ? n.filter((a) => a.matches(e)) : n; } function $i(i, e) { const t = [e]; for (; t.length > 0; ) { const n = t.shift(); if (i === n) return !0; t.push(...n.children, ...n.shadowRoot ? n.shadowRoot.children : [], ...n.assignedElements ? n.assignedElements() : []); } } function Fi(i, e) { const t = Z(); let n = e.contains(i); return !n && t.HTMLSlotElement && e instanceof HTMLSlotElement && (n = [...e.assignedElements()].includes(i), n || (n = $i(i, e))), n; } function $e(i) { try { console.warn(i); return; } catch { } } function Fe(i, e) { e === void 0 && (e = []); const t = document.createElement(i); return t.classList.add(...Array.isArray(e) ? e : Ai(e)), t; } function Gi(i, e) { const t = []; for (; i.previousElementSibling; ) { const n = i.previousElementSibling; e ? n.matches(e) && t.push(n) : t.push(n), i = n; } return t; } function Ri(i, e) { const t = []; for (; i.nextElementSibling; ) { const n = i.nextElementSibling; e ? n.matches(e) && t.push(n) : t.push(n), i = n; } return t; } function ve(i, e) { return Z().getComputedStyle(i, null).getPropertyValue(e); } function Ge(i) { let e = i, t; if (e) { for (t = 0; (e = e.previousSibling) !== null; ) e.nodeType === 1 && (t += 1); return t; } } function Ht(i, e) { const t = []; let n = i.parentElement; for (; n; ) e ? n.matches(e) && t.push(n) : t.push(n), n = n.parentElement; return t; } function ft(i, e, t) { const n = Z(); return i[e === "width" ? "offsetWidth" : "offsetHeight"] + parseFloat(n.getComputedStyle(i, null).getPropertyValue(e === "width" ? "margin-right" : "margin-top")) + parseFloat(n.getComputedStyle(i, null).getPropertyValue(e === "width" ? "margin-left" : "margin-bottom")); } function j(i) { return (Array.isArray(i) ? i : [i]).filter((e) => !!e); } function Wt(i, e, t, n) { return i.params.createElements && Object.keys(n).forEach((a) => { if (!t[a] && t.auto === !0) { let r = re(i.el, `.${n[a]}`)[0]; r || (r = Fe("div", n[a]), r.className = n[a], i.el.append(r)), t[a] = r, e[a] = r; } }), t; } function Vi(i) { let { swiper: e, extendParams: t, on: n, emit: a } = i; t({ navigation: { nextEl: null, prevEl: null, hideOnClick: !1, disabledClass: "swiper-button-disabled", hiddenClass: "swiper-button-hidden", lockClass: "swiper-button-lock", navigationDisabledClass: "swiper-navigation-disabled" } }), e.navigation = { nextEl: null, prevEl: null }; function r(g) { let w; return g && typeof g == "string" && e.isElement && (w = e.el.querySelector(g) || e.hostEl.querySelector(g), w) ? w : (g && (typeof g == "string" && (w = [...document.querySelectorAll(g)]), e.params.uniqueNavElements && typeof g == "string" && w && w.length > 1 && e.el.querySelectorAll(g).length === 1 ? w = e.el.querySelector(g) : w && w.length === 1 && (w = w[0])), g && !w ? g : w); } function o(g, w) { const P = e.params.navigation; g = j(g), g.forEach((y) => { y && (y.classList[w ? "add" : "remove"](...P.disabledClass.split(" ")), y.tagName === "BUTTON" && (y.disabled = w), e.params.watchOverflow && e.enabled && y.classList[e.isLocked ? "add" : "remove"](P.lockClass)); }); } function l() { const { nextEl: g, prevEl: w } = e.navigation; if (e.params.loop) { o(w, !1), o(g, !1); return; } o(w, e.isBeginning && !e.params.rewind), o(g, e.isEnd && !e.params.rewind); } function d(g) { g.preventDefault(), !(e.isBeginning && !e.params.loop && !e.params.rewind) && (e.slidePrev(), a("navigationPrev")); } function s(g) { g.preventDefaul