Muokattavissa olevat tiedostot

Rivimäärältään lyhyehkö HTML-tiedosto kuten personaltimeline-example1-html määrittää aikajanan ym. näyttävän sivun rakenteen, siinä valmistellaan olennaiset ohjelmistokomponentit optionaalisuuksineen ja tehdään valintaa sen suhteen, mitä dataa aikajanalle laitetaan. Aikajanalla olevien elementtien tyylittely tehdään aikajanan osalta tiedostoon feelingtimeline.css ja kaiken muun osalta luovasti nimettyyn tiedostoon others.css. Tietoryhmissä käytettävä data on käytännössä joukko JavaScriptin array-tyyppisiä muuttujia sisältäen objekti-tyyppisiä tietueita. Datan rakenteesta tarkemmin kirjoituksessa "Tietoryhmien datarakenteet ja attribuutit".

Aikajanan muokkaamiseksi eri henkilöiden tarkoituksiin on tavanomaisesti riittävää olla tekemättä mitään aikajanan kontrollilogiikan enimmälti sisältävään tiedostoon personaltimeline.js. Sama pätee myös tiedostoon oddqueries.js. Nämä tiedostot, kuten muutkin, sisältävät monin kohdin avustavia selitteitä, jotta on helpompi hahmottaa/ymmärtää, mitä käytetään mihinkin.

Kaikki tiedostot demosivujen tapaisten toteutusten luomista varten ovat saatavilla GitHub-sivuilta: dfgdfg..

Esivaatimukset ohjelmointitaidoiksi

Ohjelmointitaitoja ei välttämättä tarvitse paljoa, sillä muokkaajan tarvitsee vähimmillään vain vaihtaa omia tietojaan esimerkkitietojen tilalle ja olla lisäämättä mukaan niitä tietoryhmiä, joita ei tarvitse. Todennäköisesti sitä kuitenkin haluaa ottaa mukaan sellaisen tyyppisiä tietoja, joille ei ole ollut soveltuvaa tietoryhmää, mikä vaatiikin sitten jo feelingtimeline.css-tiedoston hienoista muokkausta, sillä muistettavuuden vuoksi muuttujien ja tyylittelyjen nimet ovat tietoryhmien mukaisia. Käytännössä lähtökohdat ovat hyvät, kun tietää mitä tarkoittaa HTML, osaa tyylitellä sitä CSS:llä ja pystyy lukemaan JavaScript-koodia.

Mukavaksi ja näppäräksi ohjelmointivälineeksi voi suositella otettavan käyttöön Visual Studio Code. Jonkinmoisesta tottumuksesta nettisivujen tekoon tai muokkailuun on hyötyä, sillä muuten kaikkea saattaa kaikesta huolimatta tulla ajateltavaksi hiukan liiaksi kerralla. Tämä siitäkin huolimatta, että koodi on jäsennelty siten, ettei siinä pitäisi olla kovin vaikea navigoida.

Aikajanan näyttäminen

Aikajanan ja siinä käytettävän datan käyttöönottoa HTML-sivun JavaScript-koodissa.

Kuvasta voi havaita, että aikajanan muodostaminen ja näyttäminen on jokseenkin selkeä toimenpide, sillä aikajana eli käytännössä sen kontrollilogiikka tarvitsee syötteekseen näytettävät tiedot tietynrakenteisena ja tietojen mukaan ymppäämisen jälkeen aikajanan valmistelu onkin pitkälti valmista. Huomaa myös kommenteiksi muutetut rivit, joissa käytetään metodia limitGroupUse. Sellaista juuri ennen aikajanan initialisointia käyttäen voi rajata tietoryhmän näkyvyyttä alkamaan ja päättymään tietyille päiville, mille voi olla käyttöä esim. silloin, jos jokin mittari on ensin sijoitettuna yhteen huoneeseen ja myöhemmin johonkin toiseen huoneeseen, eikä koe tarkoituksenmukaiseksi pitää molempia mittausarvoja näkyvillä jonkin tietyn ajankohdan jälkeen. Tai ehkäpä oirekuva muuntuu joksikin aikaa sellaiseksi, että osan oireilusta voisi erottaa joksikin aikaa erilliseksi tietoryhmäkseen, jolloin sen tietoryhmän näkyvyydelle voi asettaa alku- ja päättymisaikansa.

Aikajana ohjelmistokomponenttina perustuu JavaScript-kirjasto vis.js:n moduuliin "timeline" ja yleensä ottaen se tarvitsee syötetiedoikseen lähinnä näytettäväksi tarkoitetun tiedon tietynlaisena datarakenteena, sekä HTML-elementin, johon aikajana tulisi sijoittumaan. Sitä ei ole kehitetty enää pitkiin aikoihin, mutta sen käyttöönotto on mielekkään vaivatonta. Jonkinmoinen hitaus runsaalla visualisoidun datan määrällä saattaa olla vaivaksi varsinkin hitaampia laitteita käytettäessä.

Optionaaliset ominaisuudet

Nämä eräät optionaaliset ominaisuudet saattaa hyvinkin haluta pitää kaikki käytössä. Niitä ovat ovat fullscreen-näkymä, päivittäiset kommentit, tietoryhmien pois/näkyviin -painikkeet ja oddqueries (tiedon exportointi ja tietokyselyt). Kuvituskuvatkin ovat tavallaan optionaalinen ominaisuus, mutta ehkä lähinnä sen vuoksi esillä, että mieleen juontuisi idea siitä, että kuvituskuvien avulla on helpompi ajatella kuin toisin muistelemalla. Oddqueries on selitetty tarkemmin kirjoituksessa "Oddqueries (tiedon exportointi ja tietokyselyt)".

Optionaalisten toimintojen käyttöönottoa HTML-sivun JavaScript-koodissa.

Aikajanan päiväkohtaiset kommentoinnit. Tämä on erikseen käyttöön otettavissa oleva ominaisuus, mikä toimii siten, että aikajanan oletettavasti alapuolella näytetään päiväkohtaiset kommentoinnit niiden päivien osalta, jotka ovat juuri tuolloisella katselun hetkellä kokonaan aikajanalle mahtuvia. Täten aikajanan zoomailu ja aikajanalla siirtyminen saa päiväkohtaisten kommenttien listan päivittymään. Datan rakenteesta päiväkohtaisuuksien osalta on myös lisätietoa kirjoituksessa "Tietoryhmien datarakenteet ja attribuutit".

Tietoryhmien piilotettavuus ja takaisin näkyviin tuominen. Kun aikajanan sisältö ensilatauksella visualisoidaan, kaikki tietoryhmät näytetään, mutta arvattavasti aikajanan yläpuolella olevilla painikkeilla voi piilottaa ja palauttaa takaisin näkyviin tietoryhmän jos toisenkin. Nämä painikkeet luodaan automaattisesti, kunhan vain ottaa tämän ominaisuuden käyttöön. Näille on sitä suurempi tarve, mitä pienempiruutuisella näytöllä sivua katselee. Alunperin koodailu on tehty 32-tuumaista näyttöä käyttäen, mihin mahtuu runsaanlaisesti informaatiota ja vasta siinä jossain koodailun myöhemmillä vaiheilla on annettu ajatusta sillekin, josko esim. tablet-laitteillakin pitäisi voida olla käytettävyyttä.