Simulator sata sata koji se može konfigurirati: 3 koraka

2024 Autor: John Day | [email protected]. Zadnja izmjena: 2024-01-30 08:04

Ovo nije baš uputstvo. Dizajniram vlastiti Word Clock i odlučio sam prvo izgraditi simulator web aplikacije kako bih mogao postaviti mrežu i testirati kako izgleda u različito doba dana. Tada sam shvatio da bi ovo moglo biti korisno za druge ljude koji rade na satovima riječi, pa sam odlučio to podijeliti.

Aplikacija je jedna kratka HTML datoteka. Ako ga spremite i dvaput kliknete na njega, otvorit će se u vašem pregledniku i početi prikazivati trenutno vrijeme. Zatim će ažurirati zaslon svakih 10 sekundi ako se vrijeme promijenilo.

Tu je i tekstualno polje u koje možete upisati bilo koje vrijeme i vidjeti kako će to izgledati u vašem projektu.

Svačiji dizajn sata za riječi je različit, pa sam pokušao napraviti kôd za jednostavnu konfiguraciju. U sljedećih nekoliko koraka potražite savjete kako to učiniti.

Nadam se da će vam ovo biti od pomoći! Sjajno je moći eksperimentirati s izgledima i riječima prije nego što se posvetite hardveru!

Korak 1: Preuzmite HTML datoteku

Simulator je web-aplikacija s jednom datotekom. To je nešto manje od 200 redova. Možete ga preuzeti ovdje.

(Zapravo ne postoji dugme za preuzimanje datoteke na Github -u. Ali možete samo izabrati sadržaj datoteke, kopirati i zalijepiti u novu tekstualnu datoteku na vašem računaru. Dajte datoteci nešto ime.html.)

Nakon što je preuzmete, dvaput kliknite na datoteku i ona će se učitati na karticu u vašem pregledniku. Trebali biste vidjeti trenutno vrijeme prikazano u mreži riječi.

Napomena: Aplikaciju sam testirao samo pomoću Chromea u sustavu Windows.

Korak 2: Uredite mrežu

Možete isprobati različite rasporede riječi uređivanjem komada Javascripta koji izgleda ovako:

var row_strs = ["TO JE", "JEDNA DVA TRI", "ČETIRI PET ŠEST", "SEDAM OSAM", "DEVET DESET", "JEDANAEST DVANAEST", "OH PET DESET", "PETNAEST DVADESET", "O'CLOCK TRIDESET", "ČETRDESET PEDESET PET", "POSLE PODNE", "U NOĆ UJUTRO",];

Ako dodate/izbrišete redove i ponovo učitate stranicu, mreža će biti veća ili manja.

A ako svakom retku dodate više slova, mreža će se proširiti. Samo pazite da svi redovi imaju isti broj slova.

Primijetit ćete da nizovi u gornjem kodu imaju razmake, ali oni se pretvaraju u nasumične znakove u mreži. Možete odabrati skup znakova koji će se nasumično koristiti za popunjavanje tih prostora uređivanjem linije koja izgleda ovako:

var RANDCHARS = "ABCDEFGHIJKLMNOPQRSTUVWXYZ@#$%&";

Korak 3: Promijenite tekst

Morat ćete znati pisati kôd ako želite koristiti drugačije fraziranje. Logika koja uzima datum i pretvara ga u riječi nalazi se u funkciji koja se zove dateToSentence ().