"use strict";

// Class Definition
var KTAddUser = function () {
	// Private Variables
	var _wizardEl;
	var _formEl;
	var _wizardObj;
	var _avatar;
	var _validations = [];

	// Private Functions
	var _initWizard = function () {
		// Initialize form wizard
		_wizardObj = new KTWizard(_wizardEl, {
			startStep: 1, // initial active step number
			clickableSteps: false  // allow step clicking
		});

		// Validation before going to next page
		// _wizardObj.on('change', function (wizard) {
		// 	if (wizard.getStep() > wizard.getNewStep()) {
		// 		return; // Skip if stepped back
		// 	}

		// 	// Validate form before change wizard step
		// 	var validator = _validations[wizard.getStep() - 1]; // get validator for currnt step

		// 	if (validator) {
		// 		validator.validate().then(function (status) {
		// 			if (status == 'Valid') {
		// 				wizard.goTo(wizard.getNewStep());

		// 				KTUtil.scrollTop();
		// 			} else {
		// 				Swal.fire({
		// 					text: "Sorry, looks like there are some errors detected, please try again.",
		// 					icon: "error",
		// 					buttonsStyling: false,
		// 					confirmButtonText: "Ok, got it!",
		// 					customClass: {
		// 						confirmButton: "btn font-weight-bold btn-light"
		// 					}
		// 				}).then(function () {
		// 					KTUtil.scrollTop();
		// 				});
		// 			}
		// 		});
		// 	}

		// 	return false;  // Do not change wizard step, further action will be handled by he validator
		// });

		// // Change event
		// _wizardObj.on('changed', function (wizard) {
		// 	KTUtil.scrollTop();
		// });

		// // Submit event
		// _wizardObj.on('submit', function (wizard) {
		// 	Swal.fire({
		// 		text: "All is good! Please confirm the form submission.",
		// 		icon: "success",
		// 		showCancelButton: true,
		// 		buttonsStyling: false,
		// 		confirmButtonText: "Yes, submit!",
		// 		cancelButtonText: "No, cancel",
		// 		customClass: {
		// 			confirmButton: "btn font-weight-bold btn-primary",
		// 			cancelButton: "btn font-weight-bold btn-default"
		// 		}
		// 	}).then(function (result) {
		// 		if (result.value) {
		// 			_formEl.submit(); // Submit form
		// 		} else if (result.dismiss === 'cancel') {
		// 			Swal.fire({
		// 				text: "Your form has not been submitted!.",
		// 				icon: "error",
		// 				buttonsStyling: false,
		// 				confirmButtonText: "Ok, got it!",
		// 				customClass: {
		// 					confirmButton: "btn font-weight-bold btn-primary",
		// 				}
		// 			});
		// 		}
		// 	});
		// });
	}

	var _initValidations = function () {
		// Init form validation rules. For more info check the FormValidation plugin's official documentation:https://formvalidation.io/

		// Validation Rules For Step 1
		_validations.push(FormValidation.formValidation(
			_formEl,
			{
				fields: {
					firstname: {
						validators: {
							notEmpty: {
								message: 'First Name is required'
							}
						}
					},
					lastname: {
						validators: {
							notEmpty: {
								message: 'Last Name is required'
							}
						}
					},
					companyname: {
						validators: {
							notEmpty: {
								message: 'Company Name is required'
							}
						}
					},
					phone: {
						validators: {
							notEmpty: {
								message: 'Phone is required'
							},
							phone: {
								country: 'US',
								message: 'The value is not a valid US phone number. (e.g 5554443333)'
							}
						}
					},
					email: {
						validators: {
							notEmpty: {
								message: 'Email is required'
							},
							emailAddress: {
								message: 'The value is not a valid email address'
							}
						}
					},
					companywebsite: {
						validators: {
							notEmpty: {
								message: 'Website URL is required'
							}
						}
					}
				},
				plugins: {
					trigger: new FormValidation.plugins.Trigger(),
					// Bootstrap Framework Integration
					bootstrap: new FormValidation.plugins.Bootstrap({
						//eleInvalidClass: '',
						eleValidClass: '',
					})
				}
			}
		));

		_validations.push(FormValidation.formValidation(
			_formEl,
			{
				fields: {
					// Step 2
					communication: {
						validators: {
							choice: {
								min: 1,
								message: 'Please select at least 1 option'
							}
						}
					},
					language: {
						validators: {
							notEmpty: {
								message: 'Please select a language'
							}
						}
					},
					timezone: {
						validators: {
							notEmpty: {
								message: 'Please select a timezone'
							}
						}
					}
				},
				plugins: {
					trigger: new FormValidation.plugins.Trigger(),
					// Bootstrap Framework Integration
					bootstrap: new FormValidation.plugins.Bootstrap({
						//eleInvalidClass: '',
						eleValidClass: '',
					})
				}
			}
		));

		_validations.push(FormValidation.formValidation(
			_formEl,
			{
				fields: {
					address1: {
						validators: {
							notEmpty: {
								message: 'Address is required'
							}
						}
					},
					postcode: {
						validators: {
							notEmpty: {
								message: 'Postcode is required'
							}
						}
					},
					city: {
						validators: {
							notEmpty: {
								message: 'City is required'
							}
						}
					},
					state: {
						validators: {
							notEmpty: {
								message: 'state is required'
							}
						}
					},
					country: {
						validators: {
							notEmpty: {
								message: 'Country is required'
							}
						}
					},
				},
				plugins: {
					trigger: new FormValidation.plugins.Trigger(),
					// Bootstrap Framework Integration
					bootstrap: new FormValidation.plugins.Bootstrap({
						//eleInvalidClass: '',
						eleValidClass: '',
					})
				}
			}
		));
	}

	var _initAvatar = function () {
		_avatar = new KTImageInput('kt_user_add_avatar');
	}

	return {
		// public functions
		init: function () {
			_wizardEl = KTUtil.getById('kt_wizard');
			_formEl = KTUtil.getById('kt_form');

			_initWizard();
			_initValidations();
			_initAvatar();
		}
	};
}();

jQuery(document).ready(function () {
	KTAddUser.init();
});
