const $event = document.getElementById('event');
const searchParams = new URLSearchParams(document.location.search);

const eventId = searchParams.get('event');

const googleAPIEndpoint = 'https://www.google.com/maps/dir/?api=1';

const getDirectionLink = (location) => {
	const $elem = document.createElement('a');
	const encodedLocation = encodeURIComponent(location);
	const dirLink = `${googleAPIEndpoint}&destination=${encodedLocation}`;

	$elem.setAttribute('href', dirLink);
	$elem.innerText = location;

	$elem.classList.add('underline');

	return $elem;
};

async function main() {
	if (!eventId)
		return window.location.replace('/');

	const query = {
		sort: 'start',
		where: {
			id: {
				equals: searchParams.get('event')
			}
		}
	};

	const stringifiedQuery = Qs.stringify({
		...query
	},
	{
		addQueryPrefix: true
	}
	);

	const res = await (await fetch(`/api/events${stringifiedQuery}`)).json();
	const event = res.docs[0];

	if (!event)
		return window.location.replace('/');

	document.title = `Event: ${event.name}`;

	$event.querySelector('.event-name').innerText = event.name;

	const typeElem = $event.querySelector('.event-type');
	typeElem.innerText = event.type.value.name;
	typeElem.style.backgroundColor = event.type.value.backgroundColour;

	$event.querySelector('.event-start .event-datetime').innerText = event.start;
	$event.querySelector('.event-end .event-datetime').innerText = event.end ? event.end : 'N/A';

	if (event.location)
		$event.querySelector('.event-location').appendChild(getDirectionLink(event.location));
	else
		$event.querySelector('.event-location').innerText = 'There is no location specified for this event';

	$event.querySelector('.event-notes').innerText = event.notes ?? 'There are no notes for this event';

	const uploads = $event.querySelector('.event-uploads');

	if (event.uploads && event.uploads.length > 0) {
		for (const { upload } of event.uploads) {
			if (typeof upload === 'string') {
				uploads.classList.add('text-red-600');
				uploads.innerText = 'Please log in to view uploads';
				break;
			}

			const $elem = document.createElement('a');

			$elem.setAttribute('href', upload.url);
			$elem.innerText = upload.filename;

			$elem.classList.add('underline');

			uploads.appendChild($elem);
		}
	} else {
		uploads.innerText = 'There are no uploads for this event';
	}
}

main();