{"version":3,"sources":["webpack://@verndale/toolkit/./src/js/modules/marketo-button.js"],"names":["Module","Component","event","modal","modalTitleContainer","modalDescriptionContainer","formContainer","dataset","formTitle","formDescription","formId","accountId","script","form","svgElem","submitButton"],"mappings":"kJAEA,MAAMA,UAAeC,WAAU,CAC7B,eAAgB,CACd,KAAK,IAAM,CACT,IAAK,KAAK,EACZ,CACF,CAEA,cAAe,CACb,KAAK,IAAI,IAAI,iBAAiB,QAAS,KAAK,iBAAiB,KAAK,IAAI,CAAC,CACzE,CAEA,iBAAiBC,EAAO,CAEtB,KAAK,IAAI,IAAI,UAAU,IAAI,eAAe,EAC1C,KAAK,IAAI,IAAI,KAAK,EAElBA,EAAM,eAAe,EAGrB,MAAMC,EAAQ,SAAS,cAAc,gBAAgB,EAC/CC,EAAsBD,GAAO,cAAc,cAAc,EACzDE,EAA4BF,GAAO,cAAc,oBAAoB,EACrEG,EAAgBH,GAAO,cAAc,gCAAgC,EAGrE,CAAE,QAAAI,CAAQ,EAAIL,EAAM,OACpBM,EAAYD,EAAQ,WAAa,GACjCE,EAAkBF,EAAQ,iBAAmB,GAC7C,CAAE,OAAAG,EAAS,KAAM,UAAAC,EAAY,aAAc,EAAIJ,EAoBrD,GAjBIH,IACFA,EAAoB,YAAcI,EAClCJ,EAAoB,aAAa,aAAcI,CAAS,EACxDF,EAAc,aAAa,kBAAmBF,EAAoB,EAAE,GAIlEC,IACFA,EAA0B,YAAcI,EACxCH,EAAc,aAAa,mBAAoBD,EAA0B,EAAE,GAI7EC,EAAc,UAAY,sBAAsBI,wCAI5C,OAAO,WAAe,IACxB,KAAK,gBAAgBC,EAAWD,CAAM,MAEjC,CACL,MAAME,EAAS,SAAS,cAAc,QAAQ,EAC9CA,EAAO,IAAM,+CACbA,EAAO,OAAS,IAAM,KAAK,gBAAgBD,EAAWD,CAAM,EAC5D,SAAS,KAAK,YAAYE,CAAM,CAClC,CAGAT,EAAM,UAAU,IAAI,yBAAyB,CAC/C,CAEA,gBAAgBQ,EAAWD,EAAQ,CAC7B,OAAO,WAAe,KAK1B,WAAW,SAAS,oBAAqBC,EAAWD,EAASG,GAAS,CAEpE,MAAMC,EAAU;AAAA;AAAA;AAAA,gBAIVC,EAAeF,EAAK,YAAY,EAAE,KAAK,uBAAuB,EAEhEE,EAAa,OAAS,GACxBA,EAAa,OAAOD,CAAO,CAE/B,CAAC,CACH,CACF,CAEA,UAAed,C","file":"scripts/741.7a4ec414.js","sourcesContent":["import { Component } from '@verndale/core';\n\nclass Module extends Component {\n  setupDefaults() {\n    this.dom = {\n      $el: this.el\n    };\n  }\n\n  addListeners() {\n    this.dom.$el.addEventListener('click', this.openMarketoModal.bind(this));\n  }\n\n  openMarketoModal(event) {\n    // set the Marketo button to its disabled state\n    this.dom.$el.classList.add('btn--disabled');\n    this.dom.$el.blur(); // necessary when used in Optimizely CMS to change state\n\n    event.preventDefault();\n\n    // get Storybook values\n    const modal = document.querySelector('.marketo-modal');\n    const modalTitleContainer = modal?.querySelector('.modal-title');\n    const modalDescriptionContainer = modal?.querySelector('.modal-description');\n    const formContainer = modal?.querySelector('.marketo-modal-form__container');\n\n    // get Optimizely CMS values (or use defaults if not available)\n    const { dataset } = event.target;\n    const formTitle = dataset.formTitle || \"\";\n    const formDescription = dataset.formDescription || \"\";\n    const { formId = 3024, accountId = \"335-QLG-882\" } = dataset;\n\n    // set modal title\n    if (modalTitleContainer) {\n      modalTitleContainer.textContent = formTitle;\n      modalTitleContainer.setAttribute('aria-label', formTitle);\n      formContainer.setAttribute('aria-labelledby', modalTitleContainer.id);\n    };\n\n    // set modal description\n    if (modalDescriptionContainer) {\n      modalDescriptionContainer.textContent = formDescription;\n      formContainer.setAttribute('aria-describedby', modalDescriptionContainer.id);\n    };\n\n    // create the markup for the Marketo form and insert it into the handlebars container\n    formContainer.innerHTML = `<form id=\"mktoForm_${formId}\" class=\"marketo-modal-form\"></form>`;\n\n    // check that the MktoForms2 instance is available prior to loading the Marketo form data.\n    // if it is, load the Marketo form data\n    if (typeof MktoForms2 !== 'undefined') {\n      this.loadMarketoForm(accountId, formId);\n    // if it is not, load the MktoForms2 script dynamically, and then load the Marketo form data\n    } else {\n      const script = document.createElement('script');\n      script.src = \"//info.amwell.com/js/forms2/js/forms2.min.js\";\n      script.onload = () => this.loadMarketoForm(accountId, formId);\n      document.head.appendChild(script);\n    }\n\n    // display the Marketo modal\n    modal.classList.add('marketo-modal__expanded');\n  }\n\n  loadMarketoForm(accountId, formId) {\n    if (typeof MktoForms2 === \"undefined\") {\n      return;\n    }\n\n    // eslint-disable-next-line no-undef\n    MktoForms2.loadForm(\"//info.amwell.com\", accountId, formId, (form) => {\n      // add right-facing chevron svg into the form's button\n      const svgElem = `\n        <svg viewBox=\"0 0 8 12\" role=\"presentation\" aria-hidden=\"true\">\n          <use xlink:href=\"#chevron-right\"></use>\n        </svg>`;\n      const submitButton = form.getFormElem().find('button[type=\"submit\"]');\n\n      if (submitButton.length > 0) {\n        submitButton.append(svgElem);\n      }\n    });\n  }\n}\n\nexport default Module;\n"],"sourceRoot":""}