class EhpForm_h_ReCaptchaHandler extends elementorModules.frontend.handlers.Base {
    getDefaultSettings() {
      return {
        selectors: {
          recaptcha: ".cool-form-h-recaptcha-con",
          submit: 'button[type="submit"]',
          recaptchaResponse: '[name="cool-form-h-recaptcha-response"]',
        },
      };
    }
  
    getDefaultElements() {
      const selectors = this.getDefaultSettings().selectors;
      const $recaptcha = this.$element.find(selectors.recaptcha);
      const $form = $recaptcha.closest("form");
  
      return {
        $recaptcha,
        $form,
        $submit: $form.find(selectors.submit),
        $responseInput: $form.find(selectors.recaptchaResponse),
      };
    }
  
    bindEvents() {
  
      const $recaptcha = this.elements.$recaptcha;
      const captcha_con = $recaptcha.find('[class^="cool-form-h-recaptcha"]');
  
      if(captcha_con.length > 0){
  
        const captcha_data = captcha_con.data();
        const disableBtn = captcha_data.disablebtn;
    
        if(disableBtn == "yes"){
    
          this.disableSubmit();
        }
        this.onRecaptchaApiReady();
      }
  
    }
  
    disableSubmit() {
      this.elements.$submit.prop("disabled", true).css({
        opacity: 0.5,
        cursor: "not-allowed",
      });
    }
  
    enableSubmit() {
      this.elements.$submit.prop("disabled", false).css({
        opacity: 1,
        cursor: "pointer",
      });
    }
  
    addRecaptcha() {
      const $recaptcha = this.elements.$recaptcha;
      const captcha_con = $recaptcha.find('[id^="cool-form-h-recaptcha"]');
  
      const captcha_render_class = captcha_con.attr("id");
      const captcha_data = captcha_con.data();
      const disableBtn = captcha_data.disablebtn;
  
  
      if(disableBtn == "yes"){
  
        this.disableSubmit();
      }
  
      let captchaLoaded = false;
  
      if (captcha_con.is(':empty')) {

        const widgetId = window.hcaptcha.render(`${captcha_render_class}`, {
          captcha_data,
          callback: (token) => {
            captchaLoaded = true;
            if(disableBtn == 'yes'){
  
              this.enableSubmit();
            }
            $recaptcha.find(".recaptcha-error").remove();
          },
          "error-callback": () => {
            if (!captchaLoaded) {
              
              if(disableBtn == 'yes'){
  
                this.disableSubmit();
              }
              $recaptcha.find(".recaptcha-error").remove();
              $recaptcha.append(`
                <div class="recaptcha-error" style="color:red; font-size:14px; margin-top:10px;">
                  CAPTCHA failed to load. Check site key or network and try again.
                </div>
              `);
            }
          },
          "expired-callback": () => {
            if(disableBtn == 'yes'){
  
              this.disableSubmit();
            }
          },
        });
  
        this.elements.$form.on("reset error", () => {
          if (widgetId) window.hcaptcha.reset(widgetId);
        });
      }
    }
  
    onRecaptchaApiReady() {
      if (window.hcaptcha && window.hcaptcha.render) {
        this.addRecaptcha();
      } else {
        setTimeout(() => this.onRecaptchaApiReady(), 350);
      }
    }
  }
  
  jQuery(window).on('elementor/frontend/init', () => {
    const capHandler = ($element) => {
      elementorFrontend.elementsHandler.addHandler(EhpForm_h_ReCaptchaHandler, {
        $element,
      });
    };
    elementorFrontend.hooks.addAction('frontend/element_ready/ehp-form.default', capHandler);
  });
  