'use strict';

const PLATFORM_ENDPOINT = 'https://msplatform-staging.herokuapp.com/';
const DASHBOARD_ENDPOINT = 'https://msdashboard-staging.herokuapp.com/';

var phoneInstanceFields = {};
var phoneInstanceUtils = null;
var passwordValidityVeredicts = {}
const request = window.superagent;


function showErrorAlert(title, message) {
	Swal.fire({
	  title: title,
	  text: message,
	  type: 'error',
	  confirmButtonText: 'Ok'
	});
}


function triggerBrowserValidation(paymentProviderPrefix) {
	// The only way to trigger HTML5 form validation UI is to fake a user submit
	// event.
    var form = document.getElementById(paymentProviderPrefix + 'Form');
	var submit = document.createElement('input');
	submit.type = 'submit';
	submit.style.display = 'none';
	form.appendChild(submit);
	submit.click();
	submit.remove();
	console.log('triggerBrowserValidation(): Triggered fake validation!!!');
}


function formIsFilled(paymentProviderPrefix) {
	// Trigger HTML5 validation UI on the form if any of the inputs fail
    // validation.
    var form = document.getElementById(paymentProviderPrefix + 'Form');
    var plainInputsValid = true;
    Array.prototype.forEach.call(form.querySelectorAll('input'), function(input) {
      if (!input.value) {
        console.log('formIsFilled(): there are missing fields!');
        plainInputsValid = false;  
        return false;
      }
    });
    
    if (!plainInputsValid) {
      triggerBrowserValidation(paymentProviderPrefix);
      console.log('formIsFilled(): there are missing fields!');
      return false;
    }

    console.log('formIsFilled(): all fields are filled!');
    return plainInputsValid;
}


async function isEmailValid(email) {

  if(!email) {
    return false;
  }

  var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
  var wellFormed = re.test(email);
  try {

      // var dummyPromise = await new Promise(resolve => setTimeout(resolve, 5000));
      // console.log('Dummy promise resolved!');

      var response = await request
           .post(DASHBOARD_ENDPOINT + 'provision/check/email')
           .send('email=' + email);
      var accountAvailable = !response.body.accountExists;
      console.log('isEmailValid(): is the account available ' + accountAvailable);
      return { wellFormed: wellFormed, available: accountAvailable };

  } catch (e) {
    console.log('isEmailValid(): error happened, details ' + e);
    return { wellFormed: wellFormed, available: false };
  }
}


async function fieldsAreValid(paymentProviderPrefix) {

    console.log('Checking fields validity!');

	var subscriberName = document.getElementById(paymentProviderPrefix + 'SubscriberName').value;
	var subscriberEmail = document.getElementById(paymentProviderPrefix + 'SubscriberEmail').value;

	var validName = (subscriberName && (subscriberName.length > 0));
	var validEmail = await isEmailValid(subscriberEmail);

	if (!validName) {
		showErrorAlert('Invalid name', 'Name cannot be empty!');
		return false;
	}

    console.log('fieldsAreValid(): validity of the email is ' + JSON.stringify(validEmail, null, 2));        

	if (!validEmail.wellFormed) {
        showErrorAlert('Invalid email', 'Email has to be like xxxx@yyyy.zzz!');
        return false;
    }

    if (!validEmail.available) {
        showErrorAlert('Email already exists', 'There is already an account registered with that email address.');
        return false;
    }

    console.log('fieldsAreValid(): email is valid!');

	if (!phoneInstanceFields[paymentProviderPrefix + 'SubscriberPhone'].isValidNumber()) {
		showErrorAlert('Invalid phone', 'Please double check your phone, perhaps missing trailing 0 or wrong country?');
		return false;
	}

    console.log('fieldsAreValid(): phone is valid!');

    // if (!passwordValidityVeredicts[paymentProviderPrefix]) {
    //     return false;
    // }

    console.log('fieldsAreValid(): all fields are valid!');

	return true;

}


// Listen on the form's 'submit' handler...
async function formIsValid(paymentProviderPrefix) {

    var filled = formIsFilled(paymentProviderPrefix);

    if (!filled) {
        return false;
    }

    var valid = await fieldsAreValid(paymentProviderPrefix);

    console.log('formIsValid(): filled ' + filled + ' valid ' + valid);

	if(!filled || !valid) {
		return false;
	}

    console.log('formIsValid(): all the fields are valid!');
    return true;

    // // Show a loading screen...
    // example.classList.add('submitting');

    // // Disable all inputs.
    // disableInputs();

    // // Gather additional customer data we may have collected in our form.
    // var name = form.querySelector('#' + exampleName + '-name');
    // var address1 = form.querySelector('#' + exampleName + '-address');
    // var city = form.querySelector('#' + exampleName + '-city');
    // var state = form.querySelector('#' + exampleName + '-state');
    // var zip = form.querySelector('#' + exampleName + '-zip');
    // var additionalData = {
    //   name: name ? name.value : undefined,
    //   address_line1: address1 ? address1.value : undefined,
    //   address_city: city ? city.value : undefined,
    //   address_state: state ? state.value : undefined,
    //   address_zip: zip ? zip.value : undefined,
    // };

};


function initializeTelInputField(paymentProviderPrefix) {
    var phoneInputFieldName = paymentProviderPrefix + 'SubscriberPhone';
    var phoneInput = document.getElementById(phoneInputFieldName);
    phoneInstanceFields[phoneInputFieldName] = window.intlTelInput(phoneInput, {
        separateDialCode: true,
        initialCountry: "auto",
        geoIpLookup: function(callback) {
            console.log('initializeTelInputField(): locating customer at ' + customerIp);
            request.get(PLATFORM_ENDPOINT + 'beta/customer/location?customerIp=' + customerIp)
            .then((successResponse) => {
                console.log('initializeTelInputField(): located client as in country ' + JSON.stringify(successResponse.body));
                callback(successResponse.body.countryCode);
            })
            .catch((errorResponse) => {
                console.log('initializeTelInputField(): could not locate client because of ' + errorResponse);
            });
        },
        preferredCountries: [ "us", "ca", "gb" ],
        utilsScript: 'https://d2tzi4yayp7s6t.cloudfront.net/beta/static/shippingForm/js/intlTelInput-utils.js'
    });

    phoneInstanceUtils = window.intlTelInputGlobals.loadUtils("https://d2tzi4yayp7s6t.cloudfront.net/beta/static/shippingForm/js/intlTelInput-utils.js");

	phoneInstanceFields[phoneInputFieldName].promise.then(() => { 

		var wrappedPhoneInputs = document.getElementsByClassName('iti iti--allow-dropdown iti--separate-dial-code');
        for (var wrappedPhoneInput of wrappedPhoneInputs) {
            wrappedPhoneInput.style.width = '100%';
            wrappedPhoneInput.style.zIndex = '101';
            document.getElementById(paymentProviderPrefix + 'SubscriberPhone').style.paddingLeft = '55px';
        }

	});

    // var theSpan = document.createElement('span');
    // theSpan.setAttribute('class', 'focus-input100');
    // theSpan.setAttribute('style', 'top: 9px');
    // var theWrapperDiv = document.getElementsByClassName('intl-tel-input')[0];
    // theWrapperDiv.appendChild(theSpan);
}