{"version":3,"file":"chunks/e41c5358fc13ac.js","mappings":"kxBAKqBA,EAA2B,WAY9C,WAAYC,EAAsBC,I,4FAAa,SAC7CC,KAAKF,QAAUA,EACfE,KAAKD,OAASA,EACdC,KAAKC,gBAAkB,CACrBC,QAAS,GACTC,OAAQ,IAEVH,KAAKI,aAAe,IAAIC,MACxBL,KAAKI,aAAaE,IAAMN,KAAKD,OAAOK,aACpCJ,KAAKO,YAAc,IAAIF,MACvBL,KAAKO,YAAYD,IAAMN,KAAKD,OAAOQ,YACnCP,KAAKQ,iBAAmBR,KAAKF,QAAQW,cAAc,8CACnDT,KAAKU,eAAiBV,KAAKF,QAAQW,cAAc,0CACjDT,KAAKW,aAAeX,KAAKF,QAAQc,iBAAiB,wDAClDZ,KAAKa,sBAAwBb,KAAKF,QAAQW,cAAc,WACxDT,KAAKc,qBAAuBd,KAAKF,QAAQW,cAAc,WACvDT,KAAKe,MACP,C,QAuEC,O,EAvEA,G,EAAA,mBAED,WACEf,KAAKgB,cAAc,WACnBhB,KAAKgB,cAAc,UACnBhB,KAAKiB,YACP,GAAC,uBAED,SAAUC,GACR,OAA+B,MAAxBA,EAAQC,YACjB,GAAC,wBAED,WAAa,WACXnB,KAAKW,aAAaS,SAAQ,SAACC,EAAaC,GACtCD,EAAYE,iBAAiB,cAAc,WACzC,EAAKZ,aAAaS,SAAQ,SAAAI,GAAUA,EAAKC,WAAWC,UAAUC,OAAO,SAAU,IAC/EN,EAAYI,WAAWC,UAAUE,IAAI,UACrC,EAAKC,YAAYP,EACnB,GACF,GACF,GAAC,2BAED,SAAcQ,GAA4B,IACpCC,EADoC,OAExC/B,KAAKD,OAAOiC,OAAOF,GAAMV,SAAQ,SAACd,GAEhC,IAAI2B,EACJ,GAAI3B,EAAI4B,SAAS,OAAQ,EACvBD,EAAWE,SAASC,cAAc,UACzBC,UAAW,EACpBJ,EAASK,OAAQ,EACjBL,EAASM,MAAO,EAChB,IAAIC,EAAQL,SAASC,cAAc,UACnCI,EAAMlC,IAAMA,EACZkC,EAAMV,KAAO,YACbG,EAASQ,YAAYD,EACvB,MACEP,EAAW,IAAI5B,MAEjB4B,EAAS3B,IAAMA,EACfyB,EAAiB,CACfW,MAAOT,EACP3B,IAAK2B,EAAS3B,KAEhB,EAAKL,gBAAgB6B,GAAMa,KAAKZ,EAClC,GACF,GAAC,yBAED,SAAYT,GACVtB,KAAKa,sBAAsB+B,UAAY5C,KAAKc,qBAAqB8B,UAAY,GAE7E,IAAIC,EAAoB7C,KAAKC,gBAAgBC,QAAQoB,GAAOoB,MACxDI,EAAmB9C,KAAKC,gBAAgBE,OAAOmB,GAAOoB,MAC1D1C,KAAKa,sBAAsB4B,YAAYI,GACvC7C,KAAKc,qBAAqB2B,YAAYK,GAClCD,EAAkBvC,IAAI4B,SAAS,QAC7BlC,KAAK+C,UAAU/C,KAAKa,wBACtBgC,EAAkBG,OAGlBF,EAAiBxC,IAAI4B,SAAS,QAC5BlC,KAAK+C,UAAU/C,KAAKc,uBACtBgC,EAAiBE,MAGvB,GAAC,gCAED,WACEhD,KAAKa,sBAAsB+B,UAAY5C,KAAKc,qBAAqB8B,UAAY,GAC7E5C,KAAKa,sBAAsB4B,YAAYzC,KAAKI,cAC5CJ,KAAKc,qBAAqB2B,YAAYzC,KAAKO,YAC7C,M,oEAAC,EApG6C,E","sources":["webpack:///./resources/js/components/layout/container-features-screenshot.ts"],"sourcesContent":["type PreloadedImage = {\n image: HTMLImageElement | HTMLVideoElement,\n src: string,\n}\n\nexport default class ContainerFeaturesScreenshot {\n domRoot: HTMLElement;\n params: any;\n preloadedImages: { desktop: PreloadedImage[]; mobile: PreloadedImage[]; };\n defaultImage: HTMLImageElement;\n mobileImage: HTMLImageElement;\n featureContainer: any;\n imageContainer: any;\n featureCards: any;\n desktopImageContainer: any;\n mobileImageContainer: any;\n\n constructor(domRoot: HTMLElement, params: any) {\n this.domRoot = domRoot;\n this.params = params;\n this.preloadedImages = {\n desktop: [],\n mobile: []\n };\n this.defaultImage = new Image();\n this.defaultImage.src = this.params.defaultImage;\n this.mobileImage = new Image();\n this.mobileImage.src = this.params.mobileImage;\n this.featureContainer = this.domRoot.querySelector('.imkt-features-screenshots__text-container');\n this.imageContainer = this.domRoot.querySelector('.imkt-features-screenshots__screenshot');\n this.featureCards = this.domRoot.querySelectorAll('.screenshot-desktop .imkt-features-screenshots__card');\n this.desktopImageContainer = this.domRoot.querySelector('.md-img');\n this.mobileImageContainer = this.domRoot.querySelector('.xs-img');\n this.init();\n }\n\n init() {\n this.preloadImages('desktop');\n this.preloadImages('mobile');\n this.bindEvents();\n }\n\n isVisible(element: any) {\n return element.offsetParent != null;\n }\n\n bindEvents() {\n this.featureCards.forEach((featureCard, index) => {\n featureCard.addEventListener('mouseenter', () => {\n this.featureCards.forEach(card => { card.parentNode.classList.remove('active') });\n featureCard.parentNode.classList.add('active');\n this.updateImage(index);\n });\n })\n }\n\n preloadImages(type: 'mobile' | 'desktop') {\n var preloadedImage;\n this.params.images[type].forEach((src) => {\n\n var newImage;\n if (src.includes(\"mp4\")) {\n newImage = document.createElement(\"video\");\n newImage.autoplay = true;\n newImage.muted = true;\n newImage.loop = true;\n var srcer = document.createElement(\"source\");\n srcer.src = src;\n srcer.type = \"video/mp4\";\n newImage.appendChild(srcer);\n } else {\n newImage = new Image();\n }\n newImage.src = src;\n preloadedImage = {\n image: newImage,\n src: newImage.src\n };\n this.preloadedImages[type].push(preloadedImage);\n });\n }\n\n updateImage(index: number) {\n this.desktopImageContainer.innerHTML = this.mobileImageContainer.innerHTML = '';\n\n let appenderImageDesk = this.preloadedImages.desktop[index].image;\n let appenderImageMob = this.preloadedImages.mobile[index].image;\n this.desktopImageContainer.appendChild(appenderImageDesk);\n this.mobileImageContainer.appendChild(appenderImageMob);\n if (appenderImageDesk.src.includes(\"mp4\")) {\n if (this.isVisible(this.desktopImageContainer)) {\n appenderImageDesk.play();\n }\n }\n if (appenderImageMob.src.includes(\"mp4\")) {\n if (this.isVisible(this.mobileImageContainer)) {\n appenderImageMob.play();\n }\n }\n }\n \n updateImageDefault() {\n this.desktopImageContainer.innerHTML = this.mobileImageContainer.innerHTML = '';\n this.desktopImageContainer.appendChild(this.defaultImage);\n this.mobileImageContainer.appendChild(this.mobileImage);\n }\n}\n"],"names":["ContainerFeaturesScreenshot","domRoot","params","this","preloadedImages","desktop","mobile","defaultImage","Image","src","mobileImage","featureContainer","querySelector","imageContainer","featureCards","querySelectorAll","desktopImageContainer","mobileImageContainer","init","preloadImages","bindEvents","element","offsetParent","forEach","featureCard","index","addEventListener","card","parentNode","classList","remove","add","updateImage","type","preloadedImage","images","newImage","includes","document","createElement","autoplay","muted","loop","srcer","appendChild","image","push","innerHTML","appenderImageDesk","appenderImageMob","isVisible","play"],"sourceRoot":""}