Älä käytä prompt():ia tai alert():ia
This commit is contained in:
parent
d676ff37b0
commit
643c68dc2c
13
index.html
13
index.html
|
@ -7,6 +7,19 @@
|
|||
.testit-epäonnistunut {
|
||||
background-color: #e77;
|
||||
}
|
||||
.virhe {
|
||||
background-color: #fbb;
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
.luokka-aste-lomake {
|
||||
display: inline;
|
||||
}
|
||||
.piilotettu {
|
||||
display: none;
|
||||
}
|
||||
.luokka-aste-kenttä {
|
||||
width: 3em;
|
||||
}
|
||||
#luokka-asteet {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
|
|
@ -59,26 +59,45 @@ function luoLuokkaAsteListassa(aste) {
|
|||
|
||||
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;
|
||||
let muokkausVirhe = document.createElement('span');
|
||||
muokkausVirhe.classList.add('virhe');
|
||||
muokkausVirhe.classList.add('piilotettu');
|
||||
muokkausVirhe.appendChild(document.createTextNode(''));
|
||||
luokkaAsteListassa.appendChild(muokkausVirhe);
|
||||
|
||||
// Luo muokkauspainike ja -lomake, joista vain yksi on näkyvillä kerralla
|
||||
let muokkausLomake = document.createElement('form');
|
||||
muokkausLomake.classList.add('piilotettu');
|
||||
muokkausLomake.classList.add('luokka-aste-lomake');
|
||||
let asteValitsin = document.createElement('input');
|
||||
asteValitsin.classList.add('luokka-aste-kenttä');
|
||||
asteValitsin.type = 'number';
|
||||
asteValitsin.min = 1;
|
||||
asteValitsin.value = aste;
|
||||
muokkausLomake.append(asteValitsin);
|
||||
let muokkausLomakePainike = document.createElement('input');
|
||||
muokkausLomakePainike.type = 'submit';
|
||||
muokkausLomakePainike.value = '✓';
|
||||
muokkausLomake.appendChild(muokkausLomakePainike);
|
||||
muokkausLomake.addEventListener('submit', (tapahtuma) => {
|
||||
tapahtuma.preventDefault();
|
||||
let uusiAste = parseInt(asteValitsin.value);
|
||||
if (luokkaAsteet.asteet[uusiAste] === undefined || aste === uusiAste) {
|
||||
suorita(tapahtumaTyypit.muutaAste, aste, uusiAste);
|
||||
piirräLuokat();
|
||||
} else {
|
||||
muokkausVirhe.firstChild.textContent =
|
||||
`Luokka-aste ${uusiAste} on jo olemassa.`;
|
||||
muokkausVirhe.classList.remove('piilotettu');
|
||||
}
|
||||
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();
|
||||
}));
|
||||
});
|
||||
luokkaAsteListassa.appendChild(muokkausLomake);
|
||||
|
||||
let muokkausPainike = luoPainike('✎', () => {
|
||||
muokkausLomake.classList.remove('piilotettu');
|
||||
muokkausPainike.classList.add('piilotettu');
|
||||
});
|
||||
luokkaAsteListassa.appendChild(muokkausPainike);
|
||||
|
||||
return luokkaAsteListassa;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue