Näytä luokat aakkosjärjestyksessä

index.html

@@ -27,8 +27,9 @@
 		<script src="tietokanta.js"></script>
 		<script src="käyttöliittymä.js"></script>
 		<script>
-			suorita(tietokanta.transaktio((t)=> {t.lisää(taulut.luokat, '1A')}));
 			suorita(tietokanta.transaktio((t)=> {t.lisää(taulut.luokat, '1B')}));
+			suorita(tietokanta.transaktio((t)=> {t.lisää(taulut.luokat, '1A')}));
+			suorita(tietokanta.transaktio((t)=> {t.lisää(taulut.luokat, '1C')}));
 			suorita(tietokanta.transaktio((t) => {t.poista(taulut.luokat, 0)}));
 		</script>
 	</body>

käyttöliittymä.js

@@ -4,19 +4,25 @@ document.getElementById('kumoa').addEventListener('click', () => {
 	suorita(tietokanta.kumoa());
 });
 
-function suorita(muutokset) {
+function suorita([tietokanta, muutokset]) {
 	for (const muutos of muutokset) {
-		suoritaMuutos(muutos);
+		suoritaMuutos(tietokanta, muutos);
 	}
 }
 
-function suoritaMuutos(muutos) {
+function suoritaMuutos(tietokanta, muutos) {
 	const {taulu, id, vanha, uusi} = muutos;
 	if (taulu === taulut.luokat && vanha === undefined) {
 		// Uusi luokka
-		// TODO: Järjestele
+		const järjestys = tietokanta.järjestyksessä(taulu, vertaa);
+		const seuraavaId = järjestys[järjestys.indexOf(id) + 1];
 		const luokatLista = document.getElementById('luokat-lista');
-		luokatLista.appendChild(luoLuokka(id, uusi));
+		// 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}`);
@@ -26,6 +32,11 @@ function suoritaMuutos(muutos) {
 	}
 }
 
+function vertaa(a, b) {
+	// TODO: Parempi vertailufunktio?
+	return a.localeCompare(b);
+}
+
 function luoLuokka(id, nimi) {
 	const li = document.createElement('li');
 	li.id = `luokka-${id}`;

tietokanta.js

@@ -80,7 +80,7 @@ class Tietokanta {
 	transaktio(funktio) {
 		const transaktio = new Transaktio(this);
 		funktio(transaktio);
-		return this.suorita(transaktio);
+		return [tietokanta, this.suorita(transaktio)];
 	}
 
 	suorita(transaktio) {
@@ -129,7 +129,7 @@ class Tietokanta {
 				uusi: vanha,
 			});
 		}
-		return kumotut;
+		return [tietokanta, kumotut];
 	}
 
 	hae(taulu, id) {
@@ -138,6 +138,22 @@ class Tietokanta {
 		}
 		return this.taulut.get(taulu).get(id);
 	}
+
+	järjestyksessä(taulu, järjestys) {
+		if (!this.taulut.has(taulu)) {
+			throw new Error(`ei taulua ${taulu}`);
+		}
+		const taulukko = Array.from(this.taulut.get(taulu).entries());
+		taulukko.sort(([xId, x], [yId, y]) => {
+			const vertaus = järjestys(x, y);
+			if (vertaus < 0 || vertaus > 0) {
+				return vertaus;
+			} else {
+				return xId - yId;
+			}
+		});
+		return taulukko.map(([id, _]) => id);
+	}
 }
 
 const tietokanta = new Tietokanta;