// ChatGPT Search

const chatgptSearch = document.querySelector('.chatgpt-search');
if (chatgptSearch) {
	const input = chatgptSearch.querySelector('[type="search"]'),
		  submit = chatgptSearch.querySelector('[type="submit"]');

	if (input) {
		// Check if the browser supports the Web Speech API
		if ('SpeechRecognition' in window || 'webkitSpeechRecognition' in window) {
			// <button id="startButton">Start Speech Recognition</button>

			// Create a new SpeechRecognition object
			const recognition = new (window.SpeechRecognition || window.webkitSpeechRecognition)();

			// When the speech recognition starts, set the input value to empty
			recognition.onstart = function () {
				// document.getElementById('speechInput').value = '';
				input.value = '';
				console.log('Speech recognition started.');
			};

			// When the speech recognition results are available, set the input value to the recognized speech
			recognition.onresult = function (event) {
				const transcript = event.results[0][0].transcript;
				// document.getElementById('speechInput').value = transcript;
				input.value = transcript;
			};

			const buttonElement = document.createElement('div');
			buttonElement.style.width = '20px';
			buttonElement.style.top = '20px';
			buttonElement.style.left = '25px';
			buttonElement.style.position = 'absolute';
			buttonElement.innerHTML = `
				<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 352 512">
					<path fill="#a0a0a0" d="M176 352c53.02 0 96-42.98 96-96V96c0-53.02-42.98-96-96-96S80 42.98 80 96v160c0 53.02 42.98 96 96 96zm160-160h-16c-8.84 0-16 7.16-16 16v48c0 74.8-64.49 134.82-140.79 127.38C96.71 376.89 48 317.11 48 250.3V208c0-8.84-7.16-16-16-16H16c-8.84 0-16 7.16-16 16v40.16c0 89.64 63.97 169.55 152 181.69V464H96c-8.84 0-16 7.16-16 16v16c0 8.84 7.16 16 16 16h160c8.84 0 16-7.16 16-16v-16c0-8.84-7.16-16-16-16h-56v-33.77C285.71 418.47 352 344.9 352 256v-48c0-8.84-7.16-16-16-16z"/>
				</svg>
			`;					
			buttonElement.addEventListener('click', function () {
				recognition.start();
			});
			input.parentNode.appendChild(buttonElement);

			// Add event listener to the button to start speech recognition
			// document.getElementById('startButton').addEventListener('click', function () {
				// recognition.start();
			// });
		} else {
			console.log('Web Speech API is not supported in this browser.');
		}

		if (submit) {
			submit.addEventListener('click', (e) => {
				e.preventDefault();

				searchgpt(input);
			});
		}

		input.addEventListener('keypress', (e) => {
			const keycode = (e.keyCode ? e.keyCode : e.which);
			if (keycode == '13') {
				searchgpt(input);
			}
		});
	}
}

/**
 * 
 */
const searchgpt = (input) => {
	const loading = document.createElement('div');
	loading.classList.add('loading');
	loading.innerText = '...';
	input.parentNode.append(loading);

	let progress = 0;

	const interval = setInterval(() => {
		if (progress > 100) {
			clearInterval(interval);
		} else {
			if (progress >= 20)
				loading.innerText = 'Preparing your request ...';

			if (progress >= 40)
				loading.innerText = 'AI is submitting your request to all the major airlines ...';

			if (progress >= 60)
				loading.innerText = 'AI is processing all the ticket options being returned by the airlines ...';

			if (progress >= 80)
				loading.innerText = 'It’s almost ready, hold tight!';

			progress += 20;

			if (progress >= 90) {
				loading.innerText = 'Wait please ...';
				loading.style.width = `90%`;
			} else {
				loading.style.width = `${progress}%`;
			}
		}
	}, 1000);

	input.disabled = true;

	const formData = new FormData(), 
		  xmlHttp = new XMLHttpRequest();

	   formData.append('query', input.value);

	xmlHttp.onreadystatechange = function() {
		if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
			clearInterval(interval);

			loading.innerText = 'Opening search ...';
			loading.style.width = `100%`;

			setTimeout(() => {
				input.disabled = false;
				loading.remove();
			}, 300);

			const json = JSON.parse(xmlHttp.responseText);

			if (json.trips.length == 1) {
				location.href = `/search/one-way/${json.trips[0].origin},${json.trips[0].destination},${json.trips[0].date}/${json.cabinClass}/${json.passengers.adults}/${json.passengers.children}/${json.passengers.infants}/${json.override}`;
			} else if (json.trips.length == 2 && json.trips[0].origin === json.trips[1].destination && json.trips[0].destination === json.trips[1].origin) {
				location.href = `/search/round-trip/${json.trips[0].origin},${json.trips[0].destination},${json.trips[0].date},${json.trips[1].date}/${json.cabinClass}/${json.passengers.adults}/${json.passengers.children}/${json.passengers.infants}/${json.override}`;
			} else if (json.trips.length >= 3) {
				let trips = [];

				for (const trip of json.trips)
					trips.push(`${trip.origin},${trip.destination},${trip.date}`);

				location.href = `/search/multi-city/${trips.join(';')}/${json.cabinClass}/${json.passengers.adults}/${json.passengers.children}/${json.passengers.infants}/${json.override}`;
			} else {
				alert('Sorry something went wront!');
			}
		}
	}

	xmlHttp.open('POST.html', '/api/chatgpt/search'); 
	xmlHttp.send(formData);
};