{"version":3,"sources":["webpack:///./assets/javascripts/modules/components/ProductCardComponent.js"],"names":["ProductCardComponent","compEl","_classCallCheck","this","_this","_possibleConstructorReturn","__proto__","Object","getPrototypeOf","call","pricesBlock","$component","querySelector","SELECTORS","prices","anchor","anchorHref","Component","oldPrice","currentPrice","carousel","prevArrow","nextArrow","arrows","_this2","Promise","resolve","reject","moduleLoader","loadCarouselAndExecute","module","error","tagNumber","isNaN","tagCat","getAttribute","tagHref","length","href","innerText","currPrice","price","self","$","document","on","component","e","preventDefault","productCard","closest","parentNode","importLibrary","then","getImages","initCarousel","target","card","isDevelop","dataset","envDev","dataGallery","carouselGallery","imageAlt","temp","split","each","i","src","div","createElement","picture","source","img","classList","add","replace","setAttribute","alt","append","appendChild","opts","find","slick","_get","prototype","bindCarouselProduct"],"mappings":"oXAEqBA,cAcnB,SAAAA,EAAYC,gGAAQC,CAAAC,KAAAH,GAAA,IAAAI,mKAAAC,CAAAF,MAAAH,EAAAM,WAAAC,OAAAC,eAAAR,IAAAS,KAAAN,KACZF,IADY,OAElBG,EAAKM,YAAcN,EAAKO,WAAWC,cAAcR,EAAKS,UAAUC,QAChEV,EAAKW,OAASX,EAAKO,WAAWC,cAAcR,EAAKS,UAAUG,YAHzCZ,qUAd4Ba,6CAE9C,OACEH,OAAQ,mBACRE,WAAY,iBACZE,SAAU,8BACVC,aAAc,wBACdC,SAAU,iDACVC,UAAW,oBACXC,UAAW,oBACXC,OAAQ,+DAUI,IAAAC,EAAArB,KACd,OAAO,IAAIsB,QAAQ,SAACC,EAASC,GAC3BH,EAAKI,aAAaC,uBAChB,SAAAC,GAAYJ,EAAQI,IACpB,SAAAC,GAAWJ,EAAOI,sCAKjBC,GACL,IAAIC,MAAMD,GAAV,CAGA,IAAIE,EAAS/B,KAAKQ,WAAWwB,aAAhB,gBAA6CH,GACtDI,EAAUjC,KAAKQ,WAAWwB,aAAhB,iBAA8CH,GAO5D,OANe,OAAXE,GAAmBA,EAAOG,OAAS,IACrCH,EAAS,MAEK,OAAZE,GAAoBA,EAAQC,OAAS,IACvCH,EAAS,OAGTA,SACAE,8CAIF,OAAOjC,KAAKY,OAAOuB,uCAGnB,OAAOnC,KAAKY,OAAOwB,8CAGnB,IAAIrB,EAAWf,KAAKO,YAAYE,cAAcT,KAAKU,UAAUK,UACzDsB,EAAYrC,KAAKO,YAAYE,cAAcT,KAAKU,UAAUM,cAC9D,OACEsB,MAAOD,EAAYA,EAAUD,UAAY,KACzCrB,SAAUA,EAAWA,EAASqB,UAAY,oDAK5C,IAAIG,EAAOvC,KACXwC,EAAEC,UAAUC,GAAG,kBAAmB1C,KAAKU,UAAUU,QAASuB,UAAY3C,MAAO,SAAS4C,GACpFA,EAAEC,iBAEF,IAAMC,EAAc9C,KAAK+C,QAAQ,mBAE9B/C,KAAKgD,WAAWvC,cAAc8B,EAAK7B,UAAUO,WAC9CsB,EAAKU,gBAAgBC,KAAK,WACxBX,EAAKY,UAAUZ,EAAMO,GACrBP,EAAKa,aAAaN,yCAMhBP,EAAMc,GACd,IAAIC,EAAOD,EAAO5C,cAAc,mBAC5B8C,EAAYD,EAAKE,QAAQC,OACzBC,EAAcL,EAAOG,QAAQG,gBAC7BC,EAAWP,EAAOG,QAAQI,SAE1BC,EAAOH,EAAYI,MAAM,KAC7BtB,EAAEuB,KAAKF,EAAM,SAASG,EAAGC,GACvB,GAAU,IAAPA,EAAW,CAEZ,IAAIC,EAAMzB,SAAS0B,cAAc,OAC7BC,EAAU3B,SAAS0B,cAAc,WACjCE,EAAS5B,SAAS0B,cAAc,UAChCG,EAAM7B,SAAS0B,cAAc,OAGjCD,EAAIK,UAAUC,IAAI,oBAClBJ,EAAQG,UAAUC,IAAI,sBACN,SAAbjB,IACDU,EAAMA,EAAIQ,QAAQ,OAAQ,UAE5BJ,EAAOK,aAAa,SAAUT,GAC9BI,EAAOK,aAAa,OAAQ,cAC5BJ,EAAIL,IAAMA,EACVK,EAAIK,IAAMf,EAAW,OAASI,EAAI,GAClCM,EAAII,aAAa,WAAYT,GAG7BG,EAAQQ,OAAOP,EAAQC,GACvBJ,EAAIW,YAAYT,GAChBd,EAAKsB,OAAOV,2CAKLb,GACX,IAAMyB,GACJ5D,UAAWmC,EAAO5C,cAAcT,KAAKU,UAAUQ,WAC/CC,UAAWkC,EAAO5C,cAAcT,KAAKU,UAAUS,YAEjDqB,EAAEa,GAAQ0B,KAAK/E,KAAKU,UAAUO,UAAU+D,MAAMF,+RAI9CG,CAAApF,EAAAqF,UAAA/E,WAAAC,OAAAC,eAAAR,EAAAqF,WAAA,SAAAlF,MAAAM,KAAAN,MACAA,KAAKmF,+BA1HYtF","file":"component-ProductCardComponent.chunks.js","sourcesContent":["import Component from '../abstracts/Component';\n\nexport default class ProductCardComponent extends Component {\n  get SELECTORS() {\n    return {\n      prices: '[data-pc-prices]',\n      anchorHref: '[data-pc-href]',\n      oldPrice: '[data-details] .price--sale',\n      currentPrice: '[data-details] .price',\n      carousel: '[data-carousel=\"true\"]:not(.slick-initialized)',\n      prevArrow: '[data-prev-arrow]',\n      nextArrow: '[data-next-arrow]',\n      arrows: '[data-arrow]',\n    };\n  }\n\n  constructor(compEl) {\n    super(compEl);\n    this.pricesBlock = this.$component.querySelector(this.SELECTORS.prices);\n    this.anchor = this.$component.querySelector(this.SELECTORS.anchorHref);\n  }\n\n  importLibrary() {\n    return new Promise((resolve, reject) => {\n      this.moduleLoader.loadCarouselAndExecute(\n        module => { resolve(module) },\n        error => { reject(error) }\n      );\n    })\n  }\n\n  getTag(tagNumber) {\n    if (isNaN(tagNumber)) {\n      return;\n    }\n    let tagCat = this.$component.getAttribute(`data-tag-cat-${tagNumber}`);\n    let tagHref = this.$component.getAttribute(`data-tag-href-${tagNumber}`);\n    if (tagCat !== null && tagCat.length < 1) {\n      tagCat = null;\n    }\n    if (tagHref !== null && tagHref.length < 1) {\n      tagCat = null;\n    }\n    return {\n      tagCat,\n      tagHref,\n    };\n  }\n  getLink() {\n    return this.anchor.href;\n  }\n  getName() {\n    return this.anchor.innerText;\n  }\n  getPrices() {\n    let oldPrice = this.pricesBlock.querySelector(this.SELECTORS.oldPrice);\n    let currPrice = this.pricesBlock.querySelector(this.SELECTORS.currentPrice);\n    return {\n      price: currPrice ? currPrice.innerText : null,\n      oldPrice: oldPrice ? oldPrice.innerText : null,\n    };\n  }\n\n  bindCarouselProduct() {\n    let self = this;\n    $(document).on('click mouseover', this.SELECTORS.arrows, {component : this}, function(e) {\n      e.preventDefault();\n\n      const productCard = this.closest('.w-card-product');\n\n      if(this.parentNode.querySelector(self.SELECTORS.carousel)) {\n        self.importLibrary().then(() => {\n          self.getImages(self, productCard);\n          self.initCarousel(productCard);\n        });\n      }\n    });\n  }\n\n  getImages(self, target) {\n    let card = target.querySelector('.c-p-card__main');\n    let isDevelop = card.dataset.envDev;\n    let dataGallery = target.dataset.carouselGallery;\n    let imageAlt = target.dataset.imageAlt;\n    // first split string and convert it to array\n    let temp = dataGallery.split(',');\n    $.each(temp, function(i, src) {\n      if(src != '') {\n        // Created elements\n        let div = document.createElement('div');\n        let picture = document.createElement('picture');\n        let source = document.createElement('source');\n        let img = document.createElement('img');\n\n        // Set attributes to elements\n        div.classList.add('product-card-img');\n        picture.classList.add('main-product-image');\n        if(isDevelop == 'false') {\n          src = src.replace('.jpg', '.webp');\n        }\n        source.setAttribute('srcset', src);\n        source.setAttribute('type', 'image/webp');\n        img.src = src;\n        img.alt = imageAlt + ' - ' + (i + 2);\n        img.setAttribute('data-src', src);\n\n        // Append elements\n        picture.append(source, img);\n        div.appendChild(picture);\n        card.append(div);\n      }\n    });\n  }\n\n  initCarousel(target) {\n    const opts = {\n      prevArrow: target.querySelector(this.SELECTORS.prevArrow),\n      nextArrow: target.querySelector(this.SELECTORS.nextArrow),\n    }\n    $(target).find(this.SELECTORS.carousel).slick(opts);\n  }\n\n  render() {\n    super.render();\n    this.bindCarouselProduct();\n  }\n}\n"],"sourceRoot":""}