globalThis.zbThemes.sharedThemeCommonForm=class{awsUrl;resizeListener;fontStyleValues={bold:"B",italic:"I",underline:"U"};selectedCountryCode=null;static_page;$websiteSettings;formData={};countries;isLoading=!1;language=globalThis?.safelocalStorage?.getItem("language")||"en";constructor(t,e,n){if(this.bundle=n,this.isLoading=!0,this.awsUrl=this.bundle?.environment.awsImageUrl,zbLoadCustomScripts(["zwe-form-field","zwe-select","zwe-snackbar","zwe-font-resizer"]).finally((()=>{this.isLoading=!1,this.rerender(),this.element&&this.allEvents()})),this.sectionId=t,this.static_page=globalThis?.safeWindow?.translationObj.PAGE_LAYOUT,this.sectionData=e,this.md=!1,this.formSettings=e?.formSetting||{},this.isEditor=e.isEditor??!1,this.isEditor)this.isLoading=!1;else{const t={input:{currency:!1}};Promise.all([this.bundle?.service?.getAllCountries(t),this.bundle?.service?.getContactDetails({input:{params:{storeId:this.bundle?.service?.storeId}}})]).then((([t,e])=>{this.countries=t,this.$websiteSettings=e,this.rerender(),this.element&&this.allEvents()}))}}async zbOnInit(t){this.checkElement(),this.checkScreenSize()}checkElement(){requestAnimationFrame((()=>{this.element=globalThis.safeDocument?.querySelector("phase-ii-common-form#zb-section"+this.sectionId),this.element?this.allEvents():this.checkElement()}))}allEvents(){this.element&&(this.resizeListener||(this.resizeListener=this.checkScreenSize.bind(this),globalThis?.safeWindow?.addEventListener("resize",this.resizeListener)),this.form=this.element.querySelector("#zbContactForm"+this.sectionId),this.form&&(this.inputs=this.form.querySelectorAll(".zwe-input-flex"),this.attachEventListeners(),this.form.addEventListener("click",(t=>{const e=t.target.closest("button");e&&"BUTTON"===e.tagName&&("submit"===e.name?this.validateOnSubmit():"reset"===e.name&&this.clearFormFields())}))))}checkScreenSize(){const t=globalThis?.safeWindow?.innerWidth,e=t<769,n=this.sm,i=t<415;e!==this.md&&(this.md=e,this.rerender()),i!==n&&(this.sm=i,this.rerender()),this.element&&this.allEvents()}rerender(){this.element&&(this.element.innerHTML="\x3c!----\x3e",this.element.innerHTML=this.getHtml())}sharedThemeCommonForm(t){this.formSettings=t.formSetting;try{return this.getHtml()}catch(t){return"\x3c!-- Error in Form Rendering --\x3e"}}getHtml(){const t=this.generateBorder("top"),e=this.generateBorder("bottom"),n=this.getBackgroundStyle("#contact-bg-image2"+this.sectionId),i="center"===this.formSettings?.contactusalignment||this.formSettings?.formOnly&&"templateTwo"===this.formSettings?.templateName?"center center":"",r=!this.formSettings?.formOnly&&("center"===this.formSettings?.contactusalignment&&"color"===this.formSettings?.backgroundType||"center"!==this.formSettings?.contactusalignment&&this.formSettings?.colorFill)&&this.formSettings?.isGlobalBackground?"contact-background":"",o="center"!==this.formSettings?.contactusalignment&&!this.formSettings?.formOnly,s=`\n

\n `;return`\n \n

\n ${t}\n

\n ${o?s:""}\n ${this.getFormContainer()}\n

\n ${e}\n

\n \n ${this.getStyle()}\n `}getStyle(){return`\n \n `}getFlexAlignment(t){const[e,n]=t.split(" ");return`justify-content: ${e||""};align-items: ${n||e||""};\n `}getFormContainer(){const t=`\n padding: ${this.formSettings?.formOnly?"0px":"30px"};width: 100%;\n background-color: ${!this.formSettings?.formBackground||this.formSettings?.colorFill||"center"===this.formSettings?.contactusalignment||this.formSettings?.isGlobalBackground?"transparent":this.formSettings?.backgroundColor};\n `,e=`max-width: ${this.md||this.formSettings?.formOnly?"100%":"center"!==this.formSettings?.contactusalignment?"50%":"sporting"===this.formSettings?.sporting?"100%":"templateThree"===this.formSettings?.templateName?"90%":"70%"};order:${"left"===this.formSettings?.contactusalignment?1:2};flex:1 1 100%;`,n=this.formSettings?.formCard,i=n?"mat-elevation-z8":"",r=`\n border-radius: ${this.formSettings?.formCardRadius||0}px;\n padding: ${n?"35px":"0px"};\n background-color: ${n?this.formSettings?.formCardColor||null:"transparent"};\n `;return`\n \n

\n ${!this.formSettings?.formOnly&&this.formSettings?.showTitle&&this.formSettings?.textOutside?this.getHeading():""}\n ${!this.formSettings?.formOnly&&this.formSettings?.showSubtitle&&this.formSettings?.textOutside?this.getSubheading():""}\n

\n ${this.formSettings?.formOnly||!this.formSettings?.showTitle||this.formSettings?.textOutside?"":this.getHeading()}\n ${this.formSettings?.formOnly||!this.formSettings?.showSubtitle||this.formSettings?.textOutside?"":this.getSubheading()}\n

\n ${this.isLoading?'\n

\n ':this.getFormTemplete()}\n

\n \n`}generateBorder(t){return this.formSettings.borderDesign?`\n

\n ${this.renderSvg()}\n

\n `:""}renderSvg(){return'\n \n '}getBackgroundStyle(t){return`background-color: ${"color"===this.formSettings.backgroundType?this.formSettings.backgroundColor:"transparent"};background-image: ${"image"===this.formSettings.backgroundType?`url(${zbSetOptimizedBackgroundUrl(t,this.awsUrl+this.formSettings.contactusImage)})`:"none"};background-repeat: no-repeat;background-size: cover;background-position: center;\n `}getHeading(){const t=this.formSettings?.textAlingment||"center";return`\n

\n \n ${this.formSettings?.formTitle||""}\n \n

\n
`}getSubheading(){const t=this.formSettings?.textAlingment||"center";return`\n

\n \n ${this.formSettings?.formSubtitle||""}\n \n

\n
`}getFormTemplete(){const t=this.formSettings||{},e=`\n ${this.formSettings.edit?"painting-contact-us":""}\n ${this.formSettings.formFieldFill&&"outline"===t.formFieldAppearence?"center-alignment-outline":""}\n ${this.formSettings.formFieldFill&&"fill"===t.formFieldAppearence?"center-alignment-standard":""}\n ${"fill"===this.formSettings.formFieldAppearence?"standard-spacing colors-standard":""}\n ${"outline"===this.formSettings.formFieldAppearence?"colors-outline":""}\n ${"boxed"===this.formSettings.formFieldDesign?"boxed":""}\n ${"rounded"===this.formSettings.formFieldDesign&&"outline"===t.formFieldAppearence?"rounded":""}\n ${t.isEditor?"read-only-form":""}\n text-color\n `.trim(),n="^(?! )(?!.* $)[A-Za-z ]{1,35}$",i={firstname:{prop:"first_name",name:"firstName",type:"text",placeholder:this.static_page.FIRST_NAME_PH,label:this.static_page.FIRST_NAME,required:!0,max:35,pattern:n},lastname:{prop:"last_name",name:"lastName",type:"text",placeholder:this.static_page.LAST_NAME_PH,label:this.static_page.LAST_NAME,required:!0,max:35,pattern:n},email:{prop:"email",name:"email",icon:"email",type:"email",placeholder:this.static_page.EMAIL_PH,label:this.static_page.EMAIL,required:!0,pattern:"^[a-zA-Z0-9._%+\\-]+@[a-zA-Z0-9.\\-]+\\.[a-zA-Z]{2,}$"},countryCode:{prop:"countrycode",name:"countryCode",placeholder:"E.g., +"+this.$websiteSettings?.i1_getContactDetails?.currentUserDetails?.countryCode,label:this.static_page.COUNTRY_CODE,required:!0},name:{prop:"name",name:"userName",icon:"person",type:"text",placeholder:this.static_page.NAME_PH,label:this.static_page.NAME,required:!0,max:35,pattern:n},contact:{prop:"contact",name:"contactNumber",icon:"phone",type:"text",placeholder:this.static_page.CONTACT_PH,label:this.static_page.CONTACT,pattern:"^[0-9]*$",max:20},message:{prop:"message",name:"message",type:"textarea",placeholder:this.static_page.MESSAGE_PH,label:this.static_page.MESSAGE,required:!0,max:500,pattern:"^[^\\s]+(\\s+[^\\s]+)*$"}};return"templateTwo"==this.formSettings.templateName?`\n \n `:"templateThree"==this.formSettings.templateName?`\n \n `:"templateFour"==this.formSettings.templateName?`

\n ${this.generateInputField(i.name)}\n

\n ${this.formSettings?.emailField?`\n

\n ${this.generateInputField(i.email)}\n

`:""}\n ${this.formSettings?.contactNoField?`\n

\n ${this.formSettings?.formFieldLabelOut?`\n \n ${this.static_page.COUNTRY_CODE}:\n \n `:""}\n \n ${this.formSettings?.formFieldLabelOut?"":`${this.static_page.COUNTRY_CODE}`}\n \n \n \n \n ${this.countries?.getAllCountries?.country.length&&this.countries.getAllCountries.country.map((t=>`\n +${t?.countryCode} ${t?.name}\n `)).join("")}\n \n \n \n

\n ${this.generateInputField(i.contact)}\n

`:""}\n

\n ${this.generateInputField(i.message)}\n

\n
\n ${this.formSettings?.buttonArray?`\n

\n ${this.generateButtons()}\n

`:""}\n
\n

\n `:`\n \n `}generateInputField(t){const e=t.pattern?t.pattern.replace(/\\/g,""):"",n=`\n \n `,i=`\n \n `;return`\n ${this.formSettings?.formFieldLabelOut?("templateFour"==this.formSettings.templateName?`\n ${t.label}:\n `:`\n \n ${"contactNumber"===t?.name?t.label:t.label+"*"}\n \n `)+"\n ":""}\n \n ${this.formSettings?.formFieldLabelOut?"":`${t.label}`}\n ${"text"==t.type|"email"==t.type?`\n ${t?.icon&&this.formSettings.suffixIcon&&("templateOne"===this.formSettings.templateName||"templateFour"===this.formSettings.templateName)?`\n ${t?.icon}\n `:""}\n ${n}\n \n `:`\n ${i}\n \n `}\n \n `}getCountryCode_Input(t){return`\n ${this.formSettings?.formFieldLabelOut?`\n ${t.label}\n `:""}\n \n ${this.formSettings?.formFieldLabelOut?"":`${t.label}`}\n \n \n \n \n ${this.countries?.getAllCountries?.country.length&&this.countries.getAllCountries.country.map((t=>`\n +${t?.countryCode} ${t?.name}\n `)).join("")}\n \n \n \n `}generateButtons(){return this.formSettings.buttonArray&&this.formSettings.buttonArray.length?`\n

\n ${this.formSettings.buttonArray.map(((t,e)=>`\n

1?"":"100%"}">\n \n

\n `)).join("")}\n

\n `:""}validateField(t){if("contactNumber"===t.name){const e=globalThis?.safeDocument?.querySelector("zwe-select")?.closest(".zwe-input-wrapper")?.querySelector(".zwe-placeholder");if(e){const n=e.textContent.trim(),i=n.endsWith("*");t.value&&!i?e.textContent=n+" *":!t.value&&i&&(e.textContent=n.slice(0,-2))}}const e=t.nextElementSibling;e&&(t.validity.valid?(t.classList.remove("error"),e.textContent="",e.style.display="none"):(t.classList.add("error"),t.validity.valueMissing?e.textContent=this.static_page[t.getAttribute("prop").toUpperCase()+"_REQUIRED"]:t.validity.patternMismatch?e.textContent=this.static_page[t.getAttribute("prop").toUpperCase()+"_PATTERN"]:"email"===t.type&&t.validity.typeMismatch&&(e.textContent=this.static_page.EMAIL_PATTERN),e.style.display="block"))}attachEventListeners(){this.inputs&&this.inputs.forEach((t=>{if(t){const e=t.querySelector("input , textarea");e&&(e.addEventListener("blur",(()=>this.validateField(e))),e.addEventListener("input",(()=>this.validateField(e))))}}));const t=this.element.querySelector("zwe-select");t?.addEventListener("selectChange",(t=>{if(this.selectedCountryCode=Number(t?.detail?.value),this.selectedCountryCode){const t=globalThis?.safeDocument?.querySelector('input[name="contactNumber"]'),e=t.closest(".zwe-input-wrapper").querySelector(".zwe-placeholder");e&&!e.textContent.includes(" *")&&(e.textContent+=" *"),t.setAttribute("required","true")}}));const e=this.element.querySelector("#searchField");e&&(this.handleSearchFieldInput=this.handleSearchFieldInput.bind(this),e.addEventListener("input",this.handleSearchFieldInput))}async validateOnSubmit(){let t=!0;if(this.inputs&&this.inputs.forEach((e=>{const n=e.querySelector("input , textarea");n&&this.validateField(n),n&&!n.validity.valid&&(t=!1)})),t){this.formData={},this.inputs&&this.inputs.forEach((t=>{const e=t.querySelector("input , textarea");e&&e.name&&(this.formData[e.name]=e.value.trim())}));try{if(this.formData.storeId=this.bundle?.service?.storeId,this.formSettings?.nameSplit&&"templateOne"===this.formSettings?.templateName&&(this.formData.userName=this.formData.firstName+" "+this.formData.lastName),this.formData.countryCode=this.selectedCountryCode,this.formData.contactNumber&&!this.formData.countryCode)throw Error("noCountryCode");delete this.formData.firstName,delete this.formData.lastName;const t={input:{...this.formData}};this.bundle?.service?.saveUserQueries(t).then((()=>{zweShowSnackbar({message:this.static_page.DATA_SUCCESS,duration:3e3,type:"success",buttonText:this.static_page.BUTTON_TEXT}),this.clearFormFields()})).catch((t=>{zweShowSnackbar({message:this.static_page.ERROR_MESSAGE,duration:3e3,type:"error",buttonText:this.static_page.BUTTON_TEXT})}))}catch(t){t&&"noCountryCode"==t?.message?zweShowSnackbar({message:this.static_page.COUNTRY_CODE_REQUIRED,duration:3e3,type:"error",buttonText:this.static_page.BUTTON_TEXT}):zweShowSnackbar({message:this.static_page.FAILEDTOSAVEQUERY,duration:3e3,type:"error",buttonText:this.static_page.BUTTON_TEXT})}}else zweShowSnackbar({message:this.static_page.MANDATORY_FIELD_FILL,duration:3e3,type:"warn",buttonText:this.static_page.BUTTON_TEXT})}handleSearchFieldInput(t){const e=t.target.value.toLowerCase();this.element.querySelectorAll("zwe-select zwe-option").forEach((t=>{const n=t.querySelector(".mat-option-wrapper .mat-option-text")?.innerText?.toLowerCase();t.style.display=n&&n.includes(e)?"":"none"}))}clearFormFields(){this.form&&(this.form.querySelectorAll("input, textarea").forEach((t=>{t.value=""})),this.form.querySelectorAll("zwe-select").forEach((t=>{t.setAttribute("reset","true")})))}zbOnDestroy(){if(this.resizeListener&&(globalThis?.safeWindow?.removeEventListener("resize",this.resizeListener),this.resizeListener=null),this.inputs&&(this.inputs.forEach((t=>{if(t){const e=t.querySelector("input , textarea");e&&(e.removeEventListener("blur",(()=>this.validateField(e))),e.removeEventListener("input",(()=>this.validateField(e))))}})),this.inputs=null),this.element){const t=this.element.querySelector("#searchField");t&&t.removeEventListener("input",this.handleSearchFieldInput)}}};

Our Stores