// This event will be fired whenever the Lookfy app is created document.addEventListener('lookfyGallery', function(event) { const {galleryElement, galleryData} = event.detail; return; if(galleryData.id == "299" && galleryData.type == "default_column"){ const items = galleryElement.querySelectorAll(".kt-products-column .hotspot-item-type-product"); items.forEach(item => { const optionsForm = item.querySelector(".kt-addtocart-form"); const hotspotForm = item.querySelector(".hotspot-item-form"); const buttonAtc = hotspotForm.querySelector(".kt-button-addtocart"); const atcNew = document.createElement("a"); atcNew.classList.add('kt-button', 'button--secondary', 'button--atc-new'); atcNew.innerHTML = `Add to Cart

`; atcNew.setAttribute('href', "#"); optionsForm.appendChild(atcNew); atcNew.addEventListener("click", (e)=>{ e.preventDefault(); buttonAtc.click(); atcNew.classList.add("loading"); atcNew.querySelector('.kt-loading-overlay__spinner').classList.remove('lfHidden'); }) }) } }); // This is how you can configure a listener for said event document.addEventListener('lookfyCartAdded', function(event) { // Do your magic :) const {galleryElement, form} = event.detail; const atcNew = form.querySelector(".button--atc-new"); atcNew?.classList.remove('loading'); atcNew?.querySelector('.kt-loading-overlay__spinner').classList.add('lfHidden'); }); document.addEventListener('lookfyGallery', function(event) { const {galleryElement, galleryData} = event.detail; if(galleryData.id == "34776" || galleryData.id == "34836"){ const imgList = galleryElement.querySelectorAll(".kt-type-main .lf-image-item"); if(imgList.length > 1){ var text = ''; for (let i = 0; i < imgList.length; i++) { let active = (i == 0) ? "active" : ""; text += ``; } const buttons = document.createElement('span'); buttons.classList.add("flickitylf-link-wrap"); buttons.innerHTML = ` ${text} `; galleryElement.appendChild(buttons); const items = galleryElement.querySelectorAll(".kt-image-column"); items.forEach(item =>{ const pana = document.createElement('span'); pana.classList.add("flickitylf-image-wrap"); pana.innerHTML = ``; item.appendChild(pana); }); const carouselConfig = { draggable: false, //dragThreshold: 15 fade: true, prevNextButtons: false, pageDots: false, wrapAround: true, //adaptiveHeight: true, } var flkty = new flickitylf(galleryElement.querySelector(".kt-type-main"), carouselConfig); setInterval(function(){ flkty.resize(); }, 1000); const flktyNumbers = buttons.querySelectorAll('.flickitylf-number'); flktyNumbers.forEach(fkl => { fkl.addEventListener("click", (e)=>{ e.preventDefault(); flktyNumbers.forEach(fklc => { fklc.classList.remove("active"); }); fkl.classList.add("active"); flkty.select( fkl.dataset.number ); }); }); const items_next = galleryElement.querySelectorAll('.next'); const items_previous = galleryElement.querySelectorAll('.previous'); items_next.forEach(next => { next.addEventListener("click", (e)=>{ e.preventDefault(); flkty.next(); flktyNumbers.forEach(fklc => { fklc.classList.remove("active"); }); flktyNumbers.forEach((el, i) => { el.classList.toggle('active', i === flkty.selectedIndex); }); }); }) items_previous.forEach(previous => { previous.addEventListener("click", (e)=>{ e.preventDefault(); flkty.previous(); flktyNumbers.forEach(fklc => { fklc.classList.remove("active"); }); flktyNumbers.forEach((el, i) => { el.classList.toggle('active', i === flkty.selectedIndex); }); }); }); } } });

Country/region

DETAILS + CARE