'use strict';
document.getElementById('kumoa').addEventListener('click', () => {
	kumoa();
	piirräKaikki();
});
document.getElementById('tee-uudelleen').addEventListener('click', () => {
	teeUudelleen();
	piirräKaikki();
});

document.getElementById('lisää-luokka-aste').addEventListener('click', () => {
	suorita(tapahtumaTyypit.lisääAste);
	piirräLuokat();
});

function piirräKaikki() {
	piirräLuokat();
}

function piirräLuokat() {
	let vanhaLuokkaAsteLista = document.getElementById('luokka-asteet');
	let luokkaAsteLista = luoLuokkaAsteLista();
	vanhaLuokkaAsteLista.parentNode.replaceChild(
		luokkaAsteLista,
		vanhaLuokkaAsteLista
	);
}

function luoLuokkaAsteLista() {
	let luokkaAsteLista = document.createElement('ul');
	luokkaAsteLista.id = 'luokka-asteet';

	for (let aste = 0; aste < luokkaAsteet.asteet.length; aste++) {
		if (luokkaAsteet.asteet[aste] !== undefined) {
			let luokkaAsteListassa = luoLuokkaAsteListassa(aste);
			luokkaAsteLista.appendChild(luokkaAsteListassa);
		}
	}

	return luokkaAsteLista;
}

function luoLuokkaAsteListassa(aste) {
	let luokkaAsteListassa = document.createElement('li');
	luokkaAsteListassa.classList.add('luokka-aste');

	luokkaAsteListassa.appendChild(luoPainike('+', () => {
		suorita(tapahtumaTyypit.lisääLuokka, aste);
		piirräLuokat();
	}));
	luokkaAsteListassa.appendChild(luoPainike('-', () => {
		if (luokkaAsteet.asteet[aste].luokat().length > 1) {
			suorita(tapahtumaTyypit.poistaLuokka, aste);
		} else {
			suorita(tapahtumaTyypit.poistaAste, aste);
		}
		piirräLuokat();
	}));

	luokkaAsteListassa.appendChild(luoLuokkaLista(aste));

	luokkaAsteListassa.appendChild(luoPainike('✎', () => {
		// TODO: Älä käytä prompt():ia ja alert():ia
		let vastaus = prompt('Uusi luokka-aste');
		if (vastaus === null) {
			// Käytääjä painoi 'Peruuta'
			return;
		}
		vastaus = parseInt(vastaus, 10);
		if (Number.isNaN(vastaus)) {
			// Ei numero
			alert('Luokka-asteen pitää olla numero');
			return;
		} else if (vastaus < 1) {
			// Luokka-aste alkaa 1:stä
			alert('Luokka-asteeen pitää olla vähintään 1');
			return;
		}
		suorita(tapahtumaTyypit.muutaAste, aste, vastaus);
		piirräLuokat();
	}));

	return luokkaAsteListassa;
}

function luoLuokkaLista(aste) {
	let luokkaLista = document.createElement('ul');
	luokkaLista.classList.add('luokat');

	for (let luokka of luokkaAsteet.asteet[aste].luokat()) {
		let luokkaListassa = document.createElement('li');
		luokkaListassa.appendChild(document.createTextNode(`${aste}${luokka}`));
		luokkaLista.appendChild(luokkaListassa);
	}

	return luokkaLista;
}

function luoPainike(teksti, funktio) {
	let painike = document.createElement('input');
	painike.type = 'button';
	painike.value = teksti;
	painike.addEventListener('click', funktio);
	return painike;
}

// TOOD: Käyttöliittymätestit