{"version":3,"sources":["expertise-details-block.js"],"names":["ExpertiseDetailsBlock","constructor","container","options","this","Object","assign","expertiseAnchors","document","querySelector","querySelectorAll","iconTechnology","iconCreative","iconData","forEach","anchorBlock","expertiseType","dataset","expertise","iconContainerLeft","iconContainerLeftIcon","iconContainerLeftLabel","iconContainerMiddle","iconContainerMiddleIcon","iconContainerMiddleLabel","iconContainerRight","iconContainerRightIcon","iconContainerRightLabel","fetchExpertiseType","addEventListener","onClickIconContainer","bind","setEvents","expertiseAnchor","innerHTML","event","clickedIcon","target","closest","anchorElement","scrollIntoView","behavior","block"],"mappings":"qBAAqBA,sBACnBC,YAAYC,EAAWC,GAKrBC,KAAKD,QAAUE,OAAOC,OAAO,GAJN,CACrBC,iBAAkB,oBACpB,EAEiDJ,CAAO,EACxDC,KAAKF,UAAYM,SAASC,cAAcP,CAAS,EACjDE,KAAKG,iBAAmBH,KAAKF,UAAUQ,iBAAiBN,KAAKD,QAAQI,gBAAgB,EAErFH,KAAKO;;;;;;;MASLP,KAAKQ;;;;;MAOLR,KAAKS;;;;;MAOyB,OAA1BT,KAAKG,kBACPH,KAAKG,iBAAiBO,QAAQC,IAC5BX,KAAKY,cAAgBD,EAAYE,QAAQC,UACzCd,KAAKe,kBAAoBJ,EAAYN,cAAc,sBAAsB,EACzEL,KAAKgB,sBAAwBL,EAAYN,cAAc,4BAA4B,EACnFL,KAAKiB,uBAAyBN,EAAYN,cAAc,6BAA6B,EACrFL,KAAKkB,oBAAsBP,EAAYN,cAAc,wBAAwB,EAC7EL,KAAKmB,wBAA0BR,EAAYN,cAAc,8BAA8B,EACvFL,KAAKoB,yBAA2BT,EAAYN,cAAc,+BAA+B,EACzFL,KAAKqB,mBAAqBV,EAAYN,cAAc,uBAAuB,EAC3EL,KAAKsB,uBAAyBX,EAAYN,cAAc,6BAA6B,EACrFL,KAAKuB,wBAA0BZ,EAAYN,cAAc,8BAA8B,EAEvFL,KAAKwB,mBAAmB,CAC1B,CAAC,EAGoB,OAAnBxB,KAAKF,WACPE,KAAKF,UAAU2B,iBAAiB,QAASzB,KAAK0B,qBAAqBC,KAAK3B,IAAI,CAAC,EAG/EA,KAAK4B,UAAU,CACjB,CAEAA,aAGAJ,qBACE,OAAQxB,KAAKY,eACX,IAAK,WACHZ,KAAKe,kBAAkBF,QAAQgB,gBAAkB,aACjD7B,KAAKkB,oBAAoBL,QAAQgB,gBAAkB,WACnD7B,KAAKqB,mBAAmBR,QAAQgB,gBAAkB,OAClD7B,KAAKgB,sBAAsBc,UAAY9B,KAAKO,eAC5CP,KAAKmB,wBAAwBW,UAAY9B,KAAKQ,aAC9CR,KAAKsB,uBAAuBQ,UAAY9B,KAAKS,SAC7CT,KAAKiB,uBAAuBa,UAAY,aACxC9B,KAAKoB,yBAAyBU,UAAY,WAC1C9B,KAAKuB,wBAAwBO,UAAY,OACzC,MACF,IAAK,aACH9B,KAAKe,kBAAkBF,QAAQgB,gBAAkB,WACjD7B,KAAKkB,oBAAoBL,QAAQgB,gBAAkB,aACnD7B,KAAKqB,mBAAmBR,QAAQgB,gBAAkB,OAClD7B,KAAKgB,sBAAsBc,UAAY9B,KAAKQ,aAC5CR,KAAKmB,wBAAwBW,UAAY9B,KAAKO,eAC9CP,KAAKsB,uBAAuBQ,UAAY9B,KAAKS,SAC7CT,KAAKiB,uBAAuBa,UAAY,WACxC9B,KAAKoB,yBAAyBU,UAAY,aAC1C9B,KAAKuB,wBAAwBO,UAAY,OACzC,MACF,IAAK,OACH9B,KAAKe,kBAAkBF,QAAQgB,gBAAkB,aACjD7B,KAAKkB,oBAAoBL,QAAQgB,gBAAkB,OACnD7B,KAAKqB,mBAAmBR,QAAQgB,gBAAkB,WAClD7B,KAAKgB,sBAAsBc,UAAY9B,KAAKO,eAC5CP,KAAKmB,wBAAwBW,UAAY9B,KAAKS,SAC9CT,KAAKsB,uBAAuBQ,UAAY9B,KAAKQ,aAC7CR,KAAKiB,uBAAuBa,UAAY,aACxC9B,KAAKoB,yBAAyBU,UAAY,OAC1C9B,KAAKuB,wBAAwBO,UAAY,UAE7C,CACF,CAEAJ,qBAAqBK,GACnB,IAAMC,EAAcD,EAAME,OAAOC,QAAQ,iBAAiB,EACrDF,IAECH,EAAkBG,EAAYnB,QAAQgB,gBAEtCM,EAAgB/B,SAASC,cADd,IAAIwB,CACgC,IAGnDM,EAAcC,eAAe,CAAEC,SAAU,SAAUC,MAAO,QAAS,CAAC,CAExE,CACF","file":"expertise-details-block.min.js","sourcesContent":["export default class ExpertiseDetailsBlock {\r\n  constructor(container, options) {\r\n    const defaultOptions = {\r\n      expertiseAnchors: '.expertise-anchors'\r\n    }\r\n\r\n    this.options = Object.assign({}, defaultOptions, options)\r\n    this.container = document.querySelector(container)\r\n    this.expertiseAnchors = this.container.querySelectorAll(this.options.expertiseAnchors)\r\n\r\n    this.iconTechnology = `\r\n      <svg class=\"icon-technology\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 587.83 349.72\">\r\n        <path d=\"M3.72,175.53H124.41\" fill=\"none\" stroke=\"#231f20\" stroke-dasharray=\"0 0 126.5 141.38\" stroke-linecap=\"round\" stroke-miterlimit=\"74.41\" stroke-width=\"7.44\"/>\r\n        <path d=\"M125.31,174.86c3.24,7.15,6.84,14.13,10.79,20.91,36.83,62.58,98.29,103.65,192.5,129.32,41.91,11.42,84.91,18.43,128.28,20.91-30.12-51.46-46-110.02-45.99-169.65-1.78-60.95,14.65-121.05,47.18-172.63-43.78,2.52-87.19,9.5-129.55,20.83-94.57,25.97-155.74,66.97-192.5,129.62-3.94,6.7-7.51,13.6-10.71,20.69Z\" fill=\"none\" stroke=\"#231f20\" stroke-dasharray=\"0 0 1145.91 1160.79\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"7.44\"/>\r\n        <path d=\"M431.57,62.21h152.54\" fill=\"none\" stroke=\"#231f20\" stroke-dasharray=\"0 0 156.26 171.14\" stroke-linecap=\"round\" stroke-miterlimit=\"74.41\" stroke-width=\"7.44\"/>\r\n        <path d=\"M435.67,288.93h148.45\" fill=\"none\" stroke=\"#231f20\" stroke-dasharray=\"0 0 148.82 163.7\" stroke-linecap=\"round\" stroke-miterlimit=\"74.41\" stroke-width=\"7.44\"/>\r\n      </svg>\r\n    `\r\n\r\n    this.iconCreative = `\r\n      <svg class=\"icon-creative\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 595.28 357.17\">\r\n        <path d=\"M298.08,3.72L141.82,91.15v174.86l156.26,87.43,156.26-87.43V91.15L298.23,3.79\" fill=\"none\" stroke=\"#231f20\" stroke-dasharray=\"0 0 1071.5 1086.38\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"7.44\"/>\r\n        <path d=\"M3.72,178.58H591.56\" fill=\"none\" stroke=\"#231f20\" stroke-dasharray=\"0 0 587.83 602.72\" stroke-linecap=\"round\" stroke-miterlimit=\"74.41\" stroke-width=\"7.44\"/>\r\n      </svg>\r\n    `\r\n\r\n    this.iconData = `\r\n      <svg class=\"icon-data\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 589.4 355.67\">\r\n        <path d=\"M285.14,9.14L119.5,337.73c-2.42,4.85-.46,10.75,4.4,13.18,1.36,.68,2.86,1.03,4.38,1.04H459.55c5.42,0,9.82-4.4,9.82-9.83,0-1.52-.36-3.02-1.04-4.38L302.7,9.14c-2.43-4.85-8.33-6.81-13.18-4.38-1.89,.95-3.43,2.48-4.38,4.38Z\" fill=\"none\" stroke=\"#231f20\" stroke-dasharray=\"0 0 1131.02 1145.91\" stroke-linecap=\"round\" stroke-miterlimit=\"74.41\" stroke-width=\"7.44\"/>\r\n        <path d=\"M3.72,177.75H416.25c4.26,0,8.47-.91,12.35-2.68l157.08-71.73\" fill=\"none\" stroke=\"#231f20\" stroke-dasharray=\"0 0 602.72 617.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"7.44\"/>\r\n      </svg>\r\n    `\r\n\r\n    if (this.expertiseAnchors !== null) {\r\n      this.expertiseAnchors.forEach(anchorBlock => {\r\n        this.expertiseType = anchorBlock.dataset.expertise\r\n        this.iconContainerLeft = anchorBlock.querySelector('.icon-container.left')\r\n        this.iconContainerLeftIcon = anchorBlock.querySelector('.icon-container.left .icon')\r\n        this.iconContainerLeftLabel = anchorBlock.querySelector('.icon-container.left .label')\r\n        this.iconContainerMiddle = anchorBlock.querySelector('.icon-container.middle')\r\n        this.iconContainerMiddleIcon = anchorBlock.querySelector('.icon-container.middle .icon')\r\n        this.iconContainerMiddleLabel = anchorBlock.querySelector('.icon-container.middle .label')\r\n        this.iconContainerRight = anchorBlock.querySelector('.icon-container.right')\r\n        this.iconContainerRightIcon = anchorBlock.querySelector('.icon-container.right .icon')\r\n        this.iconContainerRightLabel = anchorBlock.querySelector('.icon-container.right .label')\r\n\r\n        this.fetchExpertiseType()\r\n      })\r\n    }\r\n\r\n    if (this.container !== null) {\r\n      this.container.addEventListener('click', this.onClickIconContainer.bind(this))\r\n    }\r\n\r\n    this.setEvents()\r\n  }\r\n\r\n  setEvents() {\r\n  }\r\n\r\n  fetchExpertiseType() {\r\n    switch (this.expertiseType) {\r\n      case 'creative':\r\n        this.iconContainerLeft.dataset.expertiseAnchor = 'technology'\r\n        this.iconContainerMiddle.dataset.expertiseAnchor = 'creative'\r\n        this.iconContainerRight.dataset.expertiseAnchor = 'data'\r\n        this.iconContainerLeftIcon.innerHTML = this.iconTechnology\r\n        this.iconContainerMiddleIcon.innerHTML = this.iconCreative\r\n        this.iconContainerRightIcon.innerHTML = this.iconData\r\n        this.iconContainerLeftLabel.innerHTML = 'Technology'\r\n        this.iconContainerMiddleLabel.innerHTML = 'Creative'\r\n        this.iconContainerRightLabel.innerHTML = 'Data'\r\n        break\r\n      case 'technology':\r\n        this.iconContainerLeft.dataset.expertiseAnchor = 'creative'\r\n        this.iconContainerMiddle.dataset.expertiseAnchor = 'technology'\r\n        this.iconContainerRight.dataset.expertiseAnchor = 'data'\r\n        this.iconContainerLeftIcon.innerHTML = this.iconCreative\r\n        this.iconContainerMiddleIcon.innerHTML = this.iconTechnology\r\n        this.iconContainerRightIcon.innerHTML = this.iconData\r\n        this.iconContainerLeftLabel.innerHTML = 'Creative'\r\n        this.iconContainerMiddleLabel.innerHTML = 'Technology'\r\n        this.iconContainerRightLabel.innerHTML = 'Data'\r\n        break\r\n      case 'data':\r\n        this.iconContainerLeft.dataset.expertiseAnchor = 'technology'\r\n        this.iconContainerMiddle.dataset.expertiseAnchor = 'data'\r\n        this.iconContainerRight.dataset.expertiseAnchor = 'creative'\r\n        this.iconContainerLeftIcon.innerHTML = this.iconTechnology\r\n        this.iconContainerMiddleIcon.innerHTML = this.iconData\r\n        this.iconContainerRightIcon.innerHTML = this.iconCreative\r\n        this.iconContainerLeftLabel.innerHTML = 'Technology'\r\n        this.iconContainerMiddleLabel.innerHTML = 'Data'\r\n        this.iconContainerRightLabel.innerHTML = 'Creative'\r\n        break\r\n    }\r\n  }\r\n\r\n  onClickIconContainer(event) {\r\n    const clickedIcon = event.target.closest('.icon-container')\r\n    if (!clickedIcon) return\r\n\r\n    const expertiseAnchor = clickedIcon.dataset.expertiseAnchor\r\n    const anchorId = `#${expertiseAnchor}`\r\n    const anchorElement = document.querySelector(anchorId)\r\n    \r\n    if (anchorElement) {\r\n      anchorElement.scrollIntoView({ behavior: 'smooth', block: 'center' })\r\n    }\r\n  }\r\n}"]}