
jQuery(function ($) {

  //initialize stripe elements
  const publishable_key = $('#chama_pub_key').val();
  const stripe = Stripe(publishable_key);
   var currency = $('#chama_currency').val().toLowerCase();
  const options = {
    mode: 'setup',
    currency: currency,
    loader: 'always',
    layout: {
      type: 'tabs',
      defaultCollapsed: false,
    },
    // Fully customizable with appearance API.
    appearance: {
      variables: {
        labels: 'floating',
        fontLineHeight: '1.4',
        fontSizeBase: '16px',
        colorText: '#000000',
        colorPrimary: '#3867d6',
        colorDanger: '#eb3b5a',
        focusBoxShadow: '0 0 0 1px #3867d6',
        borderRadius: '7px',
        borderColor: '#000000'
      },
      rules: {
        '.Input': {
          border: '1px solid #000000',
          boxShadow: 'none',
        }
      }
    },
  };
  // Set up Stripe.js and Elements to use in checkout form
  const elements = stripe.elements(options);
  // Create and mount the Payment Element
  const payment_element = elements.create('payment');
  payment_element.on('change', function (event) {
    //billingDataChange();
    if (event.error) {
      handle_error(event.error.message);
      return;
    } else {
      jQuery('#chama-payment-errors').removeClass('show');
    }
    if (event.complete) {
      chama_disable_submit_button(false);
    }
  });

  payment_element.mount('#chama-payment-element');

  const payment_form = document.querySelector('.chama-payment-form');

  payment_form.addEventListener('submit', async (e) => {
    // Disable the button from submitting twice.
    chama_disable_submit_button(true);
  
    // Avoid a full page POST request.
    e.preventDefault();
    var base_rest_url = $('#chama_base_rest_url').val();
    var confirmation_url = window.location.href;
    var customer_id = $('#chama_stripe_customer_id').val();
    var nonce = $('#_wpnonce').val();    
    

    // Trigger form validation and wallet collection
    const { error: submitError } = await elements.submit();
    if (submitError) {
      handle_error(submitError.message);
      chama_disable_submit_button(false);
      return;
    }   
      //create setup intent

    
      var values = {
        '_wpnonce': nonce,
        'customer_id': customer_id,
      };
      
      const { clientSecret, setupIntent } = await $.ajax({
        url: base_rest_url + "v1/stripe/setup",
        type: "POST",
        data: values,
        error: function (data) {
          $('#chama-payment-errors').html(data.responseText);
          $('#chama-payment-errors').addClass('show');   
          chama_disable_submit_button(false); 
          return;
        }
      });
    
      if (clientSecret) {
        const { error } = await stripe.confirmSetup({
          elements,
          clientSecret,
          confirmParams: {
            return_url: confirmation_url,
          },
        });
        //error happened
        if (error) {
          handle_error(error.message);

          // Re-enable the form so the customer can resubmit.
          chama_disable_submit_button(false); 
          return;
        }
      }




  });

});

function chama_disable_submit_button(isLoading) {
  default_text = document.getElementById("chama_default_text").value ; 
  processing_text = document.getElementById("chama_processing_text").value ; 
  if (isLoading) {
   
    document.querySelector("button").disabled = true;
    document.querySelector(".chama-button-spinner").classList.remove("chama-hide");
    document.querySelector("#chama-button-text").innerHTML = processing_text;
    document.querySelector("button").classList.add("chama-disabled-button");
  } else {
    document.querySelector("button").disabled = false;
    document.querySelector(".chama-button-spinner").classList.add("chama-hide");
    document.querySelector("#chama-button-text").innerHTML = default_text ;
    document.querySelector("button").classList.remove("chama-disabled-button");
  }
};


function handle_error(message) {
  jQuery('#chama-payment-errors').html(message);
  jQuery('#chama-payment-errors').addClass('show');
  chama_disable_submit_button(false);
}