'use strict'; document.getElementById('kumoa').addEventListener('click', () => { suorita(_tietokanta.kumoa()); }); document.getElementById('luokat-uusi').addEventListener('submit', (e) => { e.preventDefault(); suorita(_tietokanta.transaktio((t) => { const luokanNimi = document.getElementById('luokat-uusi-nimi').value; t.lisää(taulut.luokat, luokanNimi) document.getElementById('luokat-uusi-nimi').value = ''; })); }); document.getElementById('opettajat-uusi').addEventListener('submit', (e) => { e.preventDefault(); suorita(_tietokanta.transaktio((t) => { const nimi = document.getElementById('opettajat-uusi-nimi').value; const lyhenne = document.getElementById('opettajat-uusi-lyhenne').value; t.lisää(taulut.opettajat, {nimi, lyhenne}); document.getElementById('opettajat-uusi-nimi').value = ''; document.getElementById('opettajat-uusi-lyhenne').value = ''; })); }); document.getElementById('opettajat-uusi-nimi').addEventListener('change', () => { const nimi = document.getElementById('opettajat-uusi-nimi').value; // TODO: Kunnollinen tuki grafeemiklustereille // TODO: Älä ehdota lyhennettä, joka on jo käytössä const lyhenne = nimi.split(' ') .map((x) => String.fromCodePoint(x.codePointAt(0))).join(''); document.getElementById('opettajat-uusi-lyhenne').value = lyhenne; }); function suorita([tietokanta, muutokset]) { for (const muutos of muutokset) { suoritaMuutos(tietokanta, muutos); } tallennaTietokanta(tietokanta); } function suoritaMuutos(tietokanta, muutos) { const {taulu, id, vanha, uusi} = muutos; if (taulu === taulut.luokat && vanha === undefined) { // Uusi luokka const seuraavaId = idJälkeen(tietokanta, taulu, id, vertaa); const luokatLista = document.getElementById('luokat-lista'); // getElementById palauttaa null:n, jos id:tä ei löydy. Jos tämä luokka // on viimeinen, seuraavaId on undefined, eikä DOM:ssa ole luokkaa // "luokka-undefined". seuraava on siis null silloin kuin tämä luokka // tulee lisätä listan loppuun, joka vastaa insertBefore:n toimintaa const seuraava = document.getElementById(`luokka-${seuraavaId}`); luokatLista.insertBefore(luoLuokka(id, uusi), seuraava); } else if (taulu === taulut.luokat && uusi === undefined) { // Luokka poistettu const luokka = document.getElementById(`luokka-${id}`); luokka.parentElement.removeChild(luokka); // TODO: luokka muutos } else if (taulu === taulut.opettajat && vanha === undefined) { // Uusi opettaja const seuraavaId = idJälkeen(tietokanta, taulu, id, (a, b) => vertaa(a.nimi, b.nimi) ); const opettajatLista = document.getElementById('opettajat-lista'); // ks. kommentti uuden luokan tapauksessa const seuraava = document.getElementById(`opettaja-${seuraavaId}`); opettajatLista.insertBefore(luoOpettaja(id, uusi), seuraava); } else if (taulu === taulut.opettajat && uusi === undefined) { // Opettaja poistettu const opettaja = document.getElementById(`opettaja-${id}`); opettaja.parentElement.removeChild(opettaja); // TODO: opettaja muutos } else { throw new Error(`Ei toteutettu ${taulu} ${id} ${vanha} ${uusi}`); } } function idJälkeen(tietokanta, taulu, id, vertaa) { const järjestys = tietokanta.järjestyksessä(taulu, vertaa); return järjestys[järjestys.indexOf(id) + 1]; } function vertaa(a, b) { // TODO: Parempi vertailufunktio? return a.localeCompare(b); } function luoLuokka(id, nimi) { const li = document.createElement('li'); li.id = `luokka-${id}`; const poistoPainike = document.createElement('input'); poistoPainike.type = 'button'; poistoPainike.value = '-'; poistoPainike.addEventListener('click', () => { suorita(_tietokanta.transaktio((t) => { t.poista(taulut.luokat, id); })); }); li.appendChild(poistoPainike); li.appendChild(document.createTextNode(nimi)); return li; } function luoOpettaja(id, {nimi, lyhenne}) { const li = document.createElement('li'); li.id = `opettaja-${id}`; const poistoPainike = document.createElement('input'); poistoPainike.type = 'button'; poistoPainike.value = '-'; poistoPainike.addEventListener('click', () => { suorita(_tietokanta.transaktio((t) => { t.poista(taulut.opettajat, id); })); }); li.appendChild(poistoPainike); li.appendChild(document.createTextNode(`${nimi} (${lyhenne})`)); return li; }