{"version":3,"file":"logoContainer-Bm7AlJYp.js","sources":["../../src/scripts/modules/logoContainer.ts"],"sourcesContent":["import { Component } from '@verndale/core';\r\nimport { animate } from 'framer-motion';\r\n\r\nclass LogoContainer extends Component {\r\n  visibleLogos: HTMLElement[] | undefined;\r\n  hiddenLogos: HTMLElement[] | undefined;\r\n\r\n  constructor(el: HTMLElement) {\r\n    super(el);\r\n    if ((this.dom.logos as NodeListOf<HTMLElement>).length <= 6) return;\r\n    this.visibleLogos = [];\r\n    this.hiddenLogos = [];\r\n    this.setupAnimation();\r\n    setTimeout(() => {\r\n      this.animateLogos();\r\n    }, 3000);\r\n  }\r\n\r\n  setupDefaults() {\r\n    this.dom = {\r\n      logosContainer: this.el.querySelector('.logo-container__logos') as HTMLElement,\r\n      logos: this.el.querySelectorAll('.logo-container__logo') as NodeListOf<HTMLElement>,\r\n      logoWrappers: this.el.querySelectorAll(\r\n        '.logo-container__logo-wrapper'\r\n      ) as NodeListOf<HTMLElement>\r\n    };\r\n  }\r\n\r\n  setupAnimation() {\r\n    // move logos greater than 6 to a separate container\r\n    (this.dom.logos as NodeListOf<HTMLElement>).forEach((logo, index) => {\r\n      if (index < 6) {\r\n        this.visibleLogos?.push(logo as HTMLElement);\r\n      } else {\r\n        this.hiddenLogos?.push(logo as HTMLElement);\r\n      }\r\n    });\r\n\r\n    const newDiv = document.createElement('div');\r\n    newDiv.classList.add('logo-container__hidden-logos');\r\n    this.hiddenLogos?.forEach(logo => {\r\n      newDiv.appendChild(logo as HTMLElement);\r\n    });\r\n    this.dom.hiddenLogoContainer = newDiv as HTMLElement;\r\n    (this.el as HTMLElement).appendChild(newDiv);\r\n  }\r\n\r\n  animateLogos() {\r\n    const randomVisibleIndex = Math.floor(Math.random() * this.visibleLogos!.length);\r\n    const randomHiddenIndex = Math.floor(Math.random() * this.hiddenLogos!.length);\r\n    const visibleLogo = this.visibleLogos![randomVisibleIndex];\r\n    const hiddenLogo = this.hiddenLogos![randomHiddenIndex];\r\n\r\n    this.visibleLogos!.splice(randomVisibleIndex, 1, hiddenLogo);\r\n    this.hiddenLogos!.splice(randomHiddenIndex, 1, visibleLogo);\r\n\r\n    const logoWrapper = visibleLogo.parentElement as HTMLElement;\r\n    logoWrapper.appendChild(hiddenLogo);\r\n    hiddenLogo.style.opacity = '0';\r\n\r\n    requestAnimationFrame(async () => {\r\n      //animate visible logo to fade out\r\n      await animate(visibleLogo, { opacity: 0 }, { duration: 1 });\r\n      //animate hidden logo to fade in\r\n      await animate(hiddenLogo, { opacity: 1 }, { duration: 0.75 });\r\n    });\r\n\r\n    //set to repeat every 1 seconds\r\n    setTimeout(() => {\r\n      this.animateLogos();\r\n    }, 3000);\r\n  }\r\n\r\n  addListeners() {}\r\n}\r\n\r\nexport default LogoContainer;\r\n"],"names":["LogoContainer","Component","el","__publicField","logo","index","_a","_b","newDiv","randomVisibleIndex","randomHiddenIndex","visibleLogo","hiddenLogo","animate"],"mappings":"uRAGA,MAAMA,UAAsBC,CAAU,CAIpC,YAAYC,EAAiB,CAC3B,MAAMA,CAAE,EAJVC,EAAA,qBACAA,EAAA,oBAIO,OAAK,IAAI,MAAkC,QAAU,KAC1D,KAAK,aAAe,CAAC,EACrB,KAAK,YAAc,CAAC,EACpB,KAAK,eAAe,EACpB,WAAW,IAAM,CACf,KAAK,aAAa,GACjB,GAAI,EAAA,CAGT,eAAgB,CACd,KAAK,IAAM,CACT,eAAgB,KAAK,GAAG,cAAc,wBAAwB,EAC9D,MAAO,KAAK,GAAG,iBAAiB,uBAAuB,EACvD,aAAc,KAAK,GAAG,iBACpB,+BAAA,CAEJ,CAAA,CAGF,gBAAiB,OAEd,KAAK,IAAI,MAAkC,QAAQ,CAACC,EAAMC,IAAU,SAC/DA,EAAQ,GACLC,EAAA,KAAA,eAAA,MAAAA,EAAc,KAAKF,IAEnBG,EAAA,KAAA,cAAA,MAAAA,EAAa,KAAKH,EACzB,CACD,EAEK,MAAAI,EAAS,SAAS,cAAc,KAAK,EACpCA,EAAA,UAAU,IAAI,8BAA8B,GAC9CF,EAAA,KAAA,cAAA,MAAAA,EAAa,QAAgBF,GAAA,CAChCI,EAAO,YAAYJ,CAAmB,CAAA,GAExC,KAAK,IAAI,oBAAsBI,EAC9B,KAAK,GAAmB,YAAYA,CAAM,CAAA,CAG7C,cAAe,CACP,MAAAC,EAAqB,KAAK,MAAM,KAAK,SAAW,KAAK,aAAc,MAAM,EACzEC,EAAoB,KAAK,MAAM,KAAK,SAAW,KAAK,YAAa,MAAM,EACvEC,EAAc,KAAK,aAAcF,CAAkB,EACnDG,EAAa,KAAK,YAAaF,CAAiB,EAEtD,KAAK,aAAc,OAAOD,EAAoB,EAAGG,CAAU,EAC3D,KAAK,YAAa,OAAOF,EAAmB,EAAGC,CAAW,EAEtCA,EAAY,cACpB,YAAYC,CAAU,EAClCA,EAAW,MAAM,QAAU,IAE3B,sBAAsB,SAAY,CAE1B,MAAAC,EAAQF,EAAa,CAAE,QAAS,GAAK,CAAE,SAAU,EAAG,EAEpD,MAAAE,EAAQD,EAAY,CAAE,QAAS,GAAK,CAAE,SAAU,IAAM,CAAA,CAC7D,EAGD,WAAW,IAAM,CACf,KAAK,aAAa,GACjB,GAAI,CAAA,CAGT,cAAe,CAAA,CACjB"}