$(function () {
	$("#set-password-btn").click(function (event) {
		event.preventDefault();

		$("#feedbackPrompt").hide();
		$("#feedbackPrompt").html("");

		$("#set-password-btn").attr("disabled", "");

		$(".password_feedback").hide();
		var password = $("input#password").val();
		var password_confirm = $("input#passwordconfirm").val();
		if (password == "") {
			$(".password_feedback").html("Password cannot be empty.");
			$(".password_feedback").show();
			$("input#password").focus();

			$("#set-password-btn").removeAttr("disabled");
			return false;
		} else if (password !== password_confirm) {
			$(".password_feedback").html("Passwords do not match.");
			$(".password_feedback").show();
			$("input#password").focus();

			$("#set-password-btn").removeAttr("disabled");
			return false;
		} else if (password.length < 5) {
			$(".password_feedback").html(
				"Password length cannot be less than 5 characters."
			);
			$(".password_feedback").show();
			$("input#password").focus();

			$("#set-password-btn").removeAttr("disabled");
			return false;
		}

		$(".button_spinner").show();

		$("input#password").prop("disabled", true);
		$("input#passwordconfirm").prop("disabled", true);

		var form_data = "password=" + encodeURIComponent(password);

		$.ajax({
			url: "../helpers/new-password",
			type: "POST",
			data: form_data,
		}).done(function (response) {
			if (response == "success") {
				$("#feedbackPrompt").html(
					'<div class="alert alert-success" role="alert"> Your password has been reset successfully. Redirecting you...</div>'
				);
				$("input#password").val("");
				$("input#passwordconfirm").val("");

				setTimeout(function () {
					window.location.href = "../login";
				}, 3000);
			} else {
				$("#feedbackPrompt").html(
					'<div class="alert alert-danger" role="alert">' +
						response +
						"</div>"
				);
			}

			$("#feedbackPrompt").show();
			$("#set-password-btn").removeAttr("disabled");
			$(".button_spinner").hide();

			$("input#password").prop("disabled", false);
			$("input#passwordconfirm").prop("disabled", false);
		});
		return false;
	});
	
	// show/hide password
	const togglePassword = document.querySelector('#togglePassword');
	const password = document.querySelector('#password');

	togglePassword.addEventListener('click', function (e) {
		// toggle the type attribute
		const type = password.getAttribute('type') === 'password' ? 'text' : 'password';
		password.setAttribute('type', type);
		// toggle the eye slash icon
		this.classList.toggle('fa-eye-slash');
	});

	// show/hide coonfirm password
	const toggleCPassword = document.querySelector('#toggleCPassword');
	const cpassword = document.querySelector('#passwordconfirm');

	toggleCPassword.addEventListener('click', function (e) {
		// toggle the type attribute
		const type = cpassword.getAttribute('type') === 'password' ? 'text' : 'password';
		cpassword.setAttribute('type', type);
		// toggle the eye slash icon
		this.classList.toggle('fa-eye-slash');
	});
});
