(function fullscreen() {
	var elem = document.body;
	var rFS = elem.requestFullScreen ||
		elem.msRequestFullScreen ||
		elem.mozRequestFullScreen ||
		elem.webkitRequestFullScreen;

	if (rFS)
		rFS.call(elem);
})();

var overlay = () => document.querySelector("#overlay");
var main = () => document.querySelector("#main");
var msg = () => document.querySelector("#msg");

function message(str) {
	msg().innerHTML = str;
	msg().className = "active";
}

// Swap the IDs of two elements
function swap(elem1, elem2) {
	var tmp = elem1.id;
	elem1.id = elem2.id;
	elem2.id = tmp;
}

// Change slides with a transition
function update(name) {
	overlay().className = "";
	swap(main(), overlay());
	main().src ="/"+name+"/";
	main().onload = () => {
		overlay().className = "hidden";
	}
}

function reload() {
	message("Connection to server lost.");
	var i = setInterval(() => {
		fetch("/")
			.then(res => {
				if (res.status !== 200)
					return;

				history.replaceState({}, "", "/");
				location.reload();
			})
			.catch(() => {});
	}, 1000);
}

function await() {
	// Wait for the next slide change, then update again
	fetch("/await", { method: "POST" })
		.then(response => response.json())
		.then(obj => {
			if (obj.evt === "next") {
				update(obj.args.name);
			} else if (obj.evt === "reload") {
				return reload();
			} else {
				console.log("Unknown event: "+obj.evt);
			}
			await();
		})
		.catch(err => { console.error(err); reload(); });
}

await();

fetch("/init")
	.then(response => response.text())
	.then(name => update(name));