1. kodutöö – Lauakell

Autor: Teet Triisa

Funktsionaalsus: Töötav lauakell millel saab nupudega vahetada vastavalt font'i stiili või tausta värvi. Kellal saab kasutades checkbox'e ära kaotada nädalapäeva ja/või kuupäeva. Värvi valik toimub kasutades kolme erinevat math randomit, millest pannakse kokku rgb. Font'i stiili valik toimib loenduri järgi, ehk stiilid on kindlas järjekorras ning iga nupul click liigub edasi. Kõik stiilid on "web safe".

Ekraanipilt rakendusest:

1. ✓
2. ✓
3. ✓, eeh, peaaegu maitsekalt :)
4. ✓
5. ✓
6. ✓ ma loodan.
7. ✓

Tähtpäev 18.02.2018 23:59

Kujunda kellanäide vastavalt maitsele või kindlale teemale, mahutades kella täisekraanile, et saaks kasutada lauakella või ekraanisäästja asemel. Selleks, et see sobiks paljudele ekraanidele, kasuta kujunduse loomisel protsendilisi väärtusi (nt width: 100%; ) või nt võimalda kella suurust kasutajal muuta.

Nõuded

1. Veebirakendus töötab. Näitab kella, kuupäeva ja nädalapäeva.
2. Vastavalt kasutaja tegevusele on võimalik muuta kolme lauakella atribuuti muuta (nt suurus, värv, asukoht vms)
3. Kell on originaalne ning kasutajaliides on maitsekalt kujundatud
4. Autori ees- ja perenimi on lehel välja toodud
5. Lehel on viide rakenduse repositooriumile
6. Kood on vormistatud vastavalt stiilijuhendile
7. README.md failis on välja toodud autori nimi, ekraanipilt rakendusest ja kirjeldatud funktsionaalsus

Mõned ideed võimalikeks täiendusteks (lihtsalt, et mõte hakkaks jooksma)

• Vahetuda võivad taustapildid, taustal võib mängida muusika
• Taustale klikkides muudetakse kella taustaväri
• Kellale klõpsides muudetakse numbrite värvi või numbrite suurust;
• Iga numbri suurust saab eraldi muuta
• Nooleklahvidega saab kella ekraanil liigutada
• Küsi enne kella näitamise alustamist kasutajalt tema lemmikvärv ja tee sellest lähtudes midagi
• Muuda kella ja tausta värvi vastavalt ajale (päev/öö)
• Kella suurus ja asukoht sõltuvad hiire asukohast ekraanil
• Äkki võiks tegu olla hoopis analoogkellaga
• Kirjatüüpi saab ka muuta, google.com/fonts
• Kasutaja saab lisada või kasutajaöe näidatakse mitu kellaaega erinevatest maailma kohtadest

Abimaterjal

• Sündmuste loetelu HTML DOM Events
• Ajal põhinevad sündmused JavaScript Timing Events
• CSSi muutmine HTML DOM Style Object