{"version":3,"file":"6051.1700d31802e3e4aacc6b.js","mappings":"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","sources":["webpack://nationalspacecentre.web/./wwwroot/app/src/modules/thumbnail-gallery/thumbnail-gallery.js"],"sourcesContent":["// *****************************************\r\n// ************* Image Gallery *************\r\n// *****************************************\r\n\r\nimport PhotoSwipe from 'photoswipe';\r\nimport 'photoswipe/style.css';\r\nimport './thumbnail-gallery.scss';\r\n\r\nclass ProductGallery {\r\n\r\n constructor(el) {\r\n this.el = el;\r\n this.collectionsItem = el.classList.contains('collections-thumbnail-gallery');\r\n this.imageSizesOkay = true;\r\n this.lightbox = null;\r\n this.activeIndex = 0;\r\n this.main = el.querySelector('.thumbnail-gallery--main-image');\r\n this.mainImg = el.querySelector('.thumbnail-gallery--main-image figure img');\r\n this.mainImgFigCaption = el.querySelector('.thumbnail-gallery--main-image figure figcaption');\r\n this.items = [];\r\n let findItems = el.querySelectorAll('ul li a');\r\n this.loop = findItems.length > 1;\r\n if(findItems != null) {\r\n [...findItems].forEach((itemElement, itemIndex) => {\r\n let dataWidth = itemElement.dataset.pswpWidth,\r\n dataHeight = itemElement.dataset.pswpHeight;\r\n this.items[itemIndex] = {\r\n el: itemElement,\r\n src: itemElement.getAttribute('href'),\r\n width: parseFloat(dataWidth) > 0 ? parseFloat(dataWidth) : 0,\r\n height: parseFloat(dataHeight) > 0 ? parseFloat(dataHeight) : 0,\r\n img: itemElement.querySelector('img'),\r\n alt: itemElement.querySelector('figcaption').innerText,\r\n figCaptionHTML: itemElement.querySelector('figcaption').innerHTML,\r\n };\r\n this.imageSizesOkay = this.items[itemIndex].width > 0 && this.items[itemIndex].height > 0;\r\n });\r\n }\r\n // open gallery with 'main' button\r\n this.main.onclick = (e) => {\r\n e.stopPropagation();\r\n e.preventDefault();\r\n if(!this.imageSizesOkay) {\r\n this.getImageDimensions(this.activeIndex);\r\n } else {\r\n this.createLightbox(this.activeIndex);\r\n }\r\n };\r\n // thumbnail links load image into 'main' area and change the activeIndex\r\n for(var x=0; x < this.items.length; x++) {\r\n let index = x,\r\n _this = this;\r\n this.items[x].el.onclick = (e) => {\r\n e.stopPropagation();\r\n e.preventDefault();\r\n _this.setActiveThumbnail(index);\r\n };\r\n }\r\n this.items[this.activeIndex].el.classList.add('active');\r\n }\r\n\r\n getImageDimensions(priorityIndex) {\r\n // priority index\r\n if(this.items[priorityIndex].width == 0 || this.items[priorityIndex].height == 0) {\r\n let index = priorityIndex;\r\n this.items[priorityIndex].image = new Image();\r\n this.items[priorityIndex].image.onload = () => {\r\n this.imageLoaded(priorityIndex, true);\r\n }\r\n this.items[priorityIndex].image.src = this.items[priorityIndex].src;\r\n } else {\r\n this.createLightbox(priorityIndex);\r\n }\r\n // other images\r\n for(var x=0; x < this.items.length; x++) {\r\n if( x !== priorityIndex) {\r\n if(this.items[x].width == 0 || this.items[x].height == 0) {\r\n let index = x;\r\n this.items[x].image = new Image();\r\n this.items[x].image.onload = () => {\r\n this.imageLoaded(index, false);\r\n }\r\n this.items[x].image.src = this.items[x].src;\r\n }\r\n }\r\n };\r\n }\r\n\r\n imageLoaded(i, create) {\r\n let w = this.items[i].image.width,\r\n h = this.items[i].image.height;\r\n this.items[i].width = w;\r\n this.items[i].height = h;\r\n if(create) {\r\n this.createLightbox();\r\n } else {\r\n this.lightbox.options.dataSource[i].width = w;\r\n this.lightbox.options.dataSource[i].height = h;\r\n this.lightbox.refreshSlideContent(i);\r\n }\r\n }\r\n\r\n createLightbox() {\r\n this.lightbox = new PhotoSwipe({\r\n dataSource: this.items,\r\n loop: this.loop,\r\n index: this.activeIndex\r\n });\r\n // update thumbnails on slide change\r\n this.lightbox.on('change', () => {\r\n // triggers when slide is switched, and at initialization\r\n this.setActiveThumbnail(this.lightbox.currSlide.index);\r\n });\r\n // init\r\n this.lightbox.init();\r\n }\r\n\r\n setActiveThumbnail(index) {\r\n this.items[this.activeIndex].el.classList.remove('active');\r\n this.items[index].el.classList.add('active');\r\n if(this.collectionsItem) {\r\n this.mainImg.removeAttribute('srcset');\r\n this.mainImg.setAttribute('src', this.items[index].src);\r\n } else {\r\n this.mainImg.setAttribute('src', this.items[index].img.dataset.src);\r\n this.mainImg.setAttribute('srcset', this.items[index].img.dataset.srcset);\r\n }\r\n this.mainImg.setAttribute('alt', this.items[index].alt);\r\n this.mainImgFigCaption.innerHTML = this.items[index].figCaptionHTML;\r\n this.activeIndex = index;\r\n }\r\n\r\n}\r\n\r\n// export the default function to create\r\nexport function createFrom(wrappers) {\r\n wrappers.forEach((node) => {\r\n // if node is an element\r\n if (node.nodeType === 1) {\r\n new ProductGallery(node);\r\n }\r\n });\r\n}"],"names":["ProductGallery","el","this","collectionsItem","classList","contains","imageSizesOkay","lightbox","activeIndex","main","querySelector","mainImg","mainImgFigCaption","items","findItems","querySelectorAll","loop","length","forEach","itemElement","itemIndex","dataWidth","dataset","pswpWidth","dataHeight","pswpHeight","src","getAttribute","width","parseFloat","height","img","alt","innerText","figCaptionHTML","innerHTML","onclick","e","stopPropagation","preventDefault","createLightbox","getImageDimensions","index","x","_this","setActiveThumbnail","add","priorityIndex","image","Image","onload","imageLoaded","i","create","w","h","options","dataSource","refreshSlideContent","PhotoSwipe","on","currSlide","init","remove","removeAttribute","setAttribute","srcset","createFrom","wrappers","node","nodeType"],"sourceRoot":""}