lukujarjestaja/käyttöliittymä.js

109 lines
2.8 KiB
JavaScript

'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 (vastaus === NaN) {
// Ei numero
alert('Luokka-asteen pitää olla numero');
return;
}
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