{
"version": 3,
"sources": ["/cdn/shop/t/81/assets/pdp-clean-v4-gallery.js?lly=laley-custom-20260808-release-v313"],
"sourcesContent": ["/* ============================================================\n Laley PDP Clean v4 \u2014 gallery\n Modul\u00E6r PDP-runtime. Den gamle v3-monolitten er kun historisk arkiv.\n Registrerer metoder p\u00E5 LaleyPDP.prototype via PDP.registerModule.\n Krever pdp-clean-v4-core.js lastet f\u00F8rst (defer-rekkef\u00F8lge i product-clean-v3-1.liquid).\n ============================================================ */\n(() => {\n const PDP = window.LaleyPDPCleanV4;\n if (!PDP || typeof PDP.registerModule !== 'function') {\n console.error('[PDP] Kjerne mangler \u2014 hopper over modul: gallery');\n return;\n }\n const { lockRootScroll, unlockRootScroll } = PDP.utils;\n\n PDP.registerModule('gallery', {\n bindGalleryZoom() {\n // High-performance PDP lightbox:\n // - open instantly with the already-loaded product image\n // - swap to decoded high-res image when ready\n // - preload neighbor images so next/prev feels immediate\n // - one transform pipeline for zoom/pan to avoid mousemove jank\n if (!this.gallery) return;\n const getItems = () => Array.from(this.gallery.querySelectorAll('.pdp-clean__gallery-item'))\n .filter((item) => item.dataset.mediaType === 'image' && item.querySelector('img'));\n const allGalleryItems = () => Array.from(this.gallery.querySelectorAll('.pdp-clean__gallery-item'));\n const items = getItems();\n if (!items.length) return;\n\n let lightbox = null, lbImg = null, lbCounter = null, lbCloseBtn = null;\n let lbPrevBtn = null, lbNextBtn = null;\n let stage = null;\n let currentIdx = 0, lastFocused = null;\n let loadToken = 0;\n let raf = null;\n let scale = 1;\n let pan = { x: 0, y: 0 };\n let ignoreClickUntil = 0;\n let galleryPointer = null;\n let pendingGalleryZoomItem = null;\n let suppressGalleryZoomUntil = 0;\n let scrollLockToken = null;\n const ZOOM = 2.5;\n const MAX_ZOOM = 4;\n const preloadCache = new Map();\n\n const normalizedIndex = (idx) => {\n const count = getItems().length || 1;\n return (idx + count) % count;\n };\n\n const fullSrcFor = (img) => {\n const src = img?.currentSrc || img?.src || '';\n if (!src) return '';\n try {\n const url = new URL(src, window.location.href);\n if (url.searchParams.has('width')) {\n url.searchParams.set('width', '2200');\n return url.toString();\n }\n } catch (error) { /* fall through to string replacement */ }\n return src\n .replace(/width=\\d+/i, 'width=2200')\n .replace(/_(\\d{2,4})x(\\d{0,4})?(\\.|@)/, '_2200x$3');\n };\n\n const imageData = (idx) => {\n const list = getItems();\n const item = list[normalizedIndex(idx)];\n const img = item?.querySelector('img');\n const thumb = img?.currentSrc || img?.src || img?.getAttribute('src') || '';\n return {\n alt: img?.alt || '',\n full: fullSrcFor(img) || thumb,\n thumb,\n };\n };\n\n const preloadImage = (idx, priority = false) => {\n const data = imageData(idx);\n if (!data.full) return Promise.resolve('');\n const cached = preloadCache.get(data.full);\n if (cached) {\n if (priority && cached.image?.fetchPriority) cached.image.fetchPriority = 'high';\n return cached.promise;\n }\n\n const probe = new Image();\n probe.decoding = 'async';\n probe.loading = 'eager';\n if ('fetchPriority' in probe) probe.fetchPriority = priority ? 'high' : 'low';\n\n const record = { image: probe, loaded: false, promise: null };\n record.promise = new Promise((resolve) => {\n probe.onload = () => {\n if (!probe.decode) {\n resolve(data.full);\n return;\n }\n probe.decode().then(() => resolve(data.full)).catch(() => resolve(data.full));\n };\n probe.onerror = () => resolve('');\n probe.src = data.full;\n }).then((src) => {\n record.loaded = Boolean(src);\n return src;\n });\n preloadCache.set(data.full, record);\n return record.promise;\n };\n\n const warmVisibleImages = () => {\n [0, 1, 2].forEach((idx) => preloadImage(idx, idx === 0));\n };\n // Ytelse (audit #4): idle-warming lastet ~1,4MB 2200px-bilder per\n // sidevisning uten brukerintensjon. Warm i stedet ved F\u00D8RSTE\n // pointer-kontakt med galleriet \u2014 god margin f\u00F8r tap/zoom \u00E5pner\n // lightboxen, og null kost for de som aldri r\u00F8rer galleriet.\n this.on(\n this.gallery,\n window.PointerEvent ? 'pointerdown' : 'touchstart',\n warmVisibleImages,\n { once: true, passive: true },\n );\n\n const zoomBlockedSelector = [\n 'a',\n 'button',\n 'input',\n 'select',\n 'textarea',\n 'summary',\n '[contenteditable=\"true\"]',\n '[data-pdp-gallery-prev]',\n '[data-pdp-gallery-next]',\n '[data-pdp-gallery-video]',\n 'video',\n 'iframe',\n '.pdp-clean__wishlist-slot',\n ].join(',');\n\n const itemFromZoomEvent = (event) => {\n if (!(event.target instanceof Element)) return null;\n const item = event.target.closest('.pdp-clean__gallery-item');\n if (!item || !this.gallery.contains(item)) return null;\n if (item.dataset.mediaType !== 'image' || !item.querySelector('img')) return null;\n const blocked = event.target.closest(zoomBlockedSelector);\n if (blocked && blocked !== item && !blocked.classList.contains('pdp-clean__gallery-item')) return null;\n return item;\n };\n\n const clampPan = () => {\n if (!stage || !lbImg || scale <= 1) {\n pan = { x: 0, y: 0 };\n return;\n }\n const stageRect = stage.getBoundingClientRect();\n const baseW = lbImg.offsetWidth || lbImg.getBoundingClientRect().width;\n const baseH = lbImg.offsetHeight || lbImg.getBoundingClientRect().height;\n const maxX = Math.max(0, ((baseW * scale) - stageRect.width) / 2);\n const maxY = Math.max(0, ((baseH * scale) - stageRect.height) / 2);\n pan.x = Math.max(-maxX, Math.min(maxX, pan.x));\n pan.y = Math.max(-maxY, Math.min(maxY, pan.y));\n };\n\n const applyTransform = (withTransition = true) => {\n if (!lbImg) return;\n clampPan();\n if (withTransition) {\n lbImg.classList.remove('is-dragging');\n } else {\n lbImg.classList.add('is-dragging');\n }\n window.cancelAnimationFrame(raf);\n raf = window.requestAnimationFrame(() => {\n if (!lbImg) return;\n lbImg.classList.toggle('is-zoomed', scale > 1);\n lbImg.style.transform = scale > 1\n ? `translate3d(${pan.x}px, ${pan.y}px, 0) scale(${scale})`\n : '';\n });\n };\n\n const resetZoom = () => {\n scale = 1;\n pan = { x: 0, y: 0 };\n if (lbImg) {\n lbImg.classList.remove('is-zoomed', 'is-dragging');\n lbImg.style.transform = '';\n }\n };\n\n const zoomAt = (x, y) => {\n if (!lbImg) return;\n if (scale > 1) {\n resetZoom();\n return;\n }\n const rect = lbImg.getBoundingClientRect();\n if (!rect.width || !rect.height) return;\n const dx = x - (rect.left + rect.width / 2);\n const dy = y - (rect.top + rect.height / 2);\n scale = ZOOM;\n pan = {\n x: -dx * (ZOOM - 1),\n y: -dy * (ZOOM - 1),\n };\n applyTransform(true);\n };\n\n const ensureLightbox = () => {\n if (lightbox) return;\n lightbox = document.createElement('div');\n lightbox.className = 'pdp-clean__lightbox';\n lightbox.setAttribute('role', 'dialog');\n lightbox.setAttribute('aria-modal', 'true');\n lightbox.setAttribute('aria-label', 'Bildevisning');\n lightbox.setAttribute('aria-hidden', 'true');\n lightbox.tabIndex = -1;\n lightbox.innerHTML = `\n \n \n \n \n
![\"\"]()
\n