/* --------------------- GET STATES FROM COUNTRY ID ------------------------ */
jQuery(function ($) {
	$(document).ready(function () {
		var form = $("#franchise-form form");
		if ($("#franchise-form form").find("select.state_auto").length > 0) {
			var cnt = 101;
			
			$(form).find("select.state_auto").html('<option value="0001" data-id="0001">Loading...</option>');
			$(form).find("select.city_auto").html('<option value="0" data-id="0">Select City</option>');
			if (cnt == '0') {
				$(form).find("select.state_auto").html('<option value="0">Select State</option>');
				return false;
			}
			jQuery.ajax({
				url: tc_csca_auto_ajax.ajax_url,
				type: 'post',
				dataType: "json",
				data: { action: "tc_csca_get_states", nonce_ajax: tc_csca_auto_ajax.nonce, cnt: cnt },
				success: function (response) {
					//console.log(response);
					if (response.length > 0) {
						$(form).find("select.state_auto").html('<option value="0" data-id="0">Select State</option>');
						for (i = 0; i < response.length; i++) {
							var st_id = response[i]['id'];
							var st_name = response[i]['name'];
							var opt = "<option data-id='" + st_id + "' value='" + st_name + "'>" + st_name + "</option>";
							$(form).find("select.state_auto").append(opt);
						}
					}
					else {
						$(form).find("select.state_auto").html('');
						var opt = "<option value='0'>State List Not Found</option>";
						$(form).find("select.state_auto").append(opt);
						console.log("State List Not Found");
					}
				}
			});

		}
	});
	
	/* --------------------- GET CITIES ------------------------ */
	jQuery(document).ready(function($) {
		// Hook into the form submission
		$(document).on('wpcf7submit', function(event) {
			// Prevent default form submission
			let valid = true;
			const cityDropdown = $('#cf7sg-form-franchise-enquiry select.city_auto');
			const stateDropdown = $('#cf7sg-form-franchise-enquiry select.state_auto');

			// Check if the city dropdown has a selected value
			if (stateDropdown.val() === "" || stateDropdown.val() === "0") {
				valid = false;

				jQuery("#state-valid").remove();
				stateDropdown.after('<span class="wpcf7-not-valid-tip" id="state-valid" aria-hidden="true">Please select a state. This field is mandatory.</span>');
				stateDropdown.focus();
			}

			if (cityDropdown.val() === "" || cityDropdown.val() === "0") {
				valid = false;

				jQuery("#city-valid").remove();
				cityDropdown.after('<span class="wpcf7-not-valid-tip" id="city-valid" aria-hidden="true">Please select a city. This field is mandatory.</span>');
				
				cityDropdown.focus();  // Optional: focus on the city dropdown
			}
	
			// Prevent form submission if invalid
			if (!valid) {
				event.preventDefault();
			}
		});
	});

	$("select.city_auto").change(function () {
		jQuery("#city-valid").remove();
	});

	$("select.state_auto").change(function () {
		var form = (this).closest("form");
		jQuery("#state-valid").remove();
		//console.log(form);
		if ($(this).closest("form").find("select.city_auto").length > 0) {
			var sid = $(form).find("select.state_auto").children("option:selected").attr('data-id');

			$(form).find("select.city_auto").html('<option value="0001" data-id="0001">Loading...</option>');
			if (sid == '0') {
				$(form).find("select.city_auto").html('<option value="0" data-id="0">Select City</option>');
				return false;
				//return rv;
			}

			jQuery.ajax({
				url: tc_csca_auto_ajax.ajax_url,
				type: 'post',
				dataType: "json",
				data: { action: "tc_csca_get_cities", nonce_ajax: tc_csca_auto_ajax.nonce, sid: sid },
				success: function (response) {
					if (response.length > 0) {
						$(form).find("select.city_auto").html('<option value="0" data-id="0">Select City</option>');
						// Unique cities tracker
						var uniqueCities = {};
						function replaceDiacritics(str) {							
							var diacriticsMap = {
								'ā': 'a',
								'ē': 'e',
								'ī': 'i',
								'ō': 'o',
								'ū': 'u',
								'Ā': 'A',
								'Ē': 'E',
								'Ī': 'I',
								'Ō': 'O',
								'Ū': 'U'
							};
							
							// Replace each character in the map
							return str.split('').map(function(char) {
								return diacriticsMap[char] || char; // Return the mapped value or the original character
							}).join('');
						}
					
						for (var i = 0; i < response.length; i++) {
							var ct_id = response[i]['id'];
							var ct_name = response[i]['name'];
					
							// Normalize the city name for comparison
							var normalizedCtName = replaceDiacritics(ct_name).toLowerCase();
					
							// Check if the normalized city name already exists
							if (!uniqueCities[normalizedCtName]) {
								// If not, add to tracker
								uniqueCities[normalizedCtName] = true;
					
								// Clean the city name by replacing diacritics
								var cleanedCtName = replaceDiacritics(ct_name); // Removing diacritics
				
								var opt = "<option value='" + cleanedCtName + "' data-id='" + ct_id + "'>" + cleanedCtName + "</option>";
								$(form).find("select.city_auto").append(opt);
							}
						}
					} else {
						$(form).find("select.city_auto").html('');
						var opt = "<option value='0'>City List Not Found</option>";
						$(form).find("select.city_auto").append(opt);
						console.log("City List Not Found");
					}					
				}
			});
		}
	});
});