// buttons

for (const button of document.querySelectorAll("#index button")) {
	button.onclick = onEntryButtonClicked;
}

function onEntryButtonClicked() {
	showEntry(this.dataset.entry);
	entryWrapper.scrollTo(0, 0);
}



// showing entry

const entryWrapper = document.getElementById("entry");
const entryTemplate = document.getElementById("entry-template");

async function showEntry(name) {
	let el;

	try {
		let entry = await fetchEntry(name);
		el = entryTemplate.content.cloneNode(true);

		el.getElementById("name").textContent = entry.name;

		el.getElementById("date").textContent = new Date(entry.date).toLocaleDateString("en-GB", {day: "numeric", month: "short", year: "2-digit"}).toLowerCase();
		el.getElementById("date").dateTime = entry.date;

		el.getElementById("content").innerHTML = entry.content;
		el.getElementById("content").className = entry.class;

		if (entry.mood) {
			el.getElementById("mood").firstChild.src = `_emote/${entry.mood}.png`;
			el.getElementById("mood").prepend(entry.mood + " ");
		}
		else el.getElementById("mood").parentElement.remove();

		el.getElementById("src").href = entryPath(name);
	}
	catch {
		el = document.createElement("iframe");
		el.style = "width: 100%; height: 100%";
		el.src = entryPath(name);
		entryWrapper.className = "";
	}

	entryWrapper.replaceChildren(el);
}



// xml parsing

let parser = new DOMParser;

async function fetchEntry(name) {
	let text = await (await fetch(entryPath(name))).text();
	let root = parser.parseFromString(text, "text/xml").documentElement;

	let entry = {class: root.querySelector("content").className};
	for (const tag of root.children) {
		entry[tag.tagName] = tag.innerHTML;
	}
	return entry;
}

function entryPath(name) {
	return `_entry/${name}.xml`;
}