Taulukoita ja palkkeja - Palkkisimulaattori

Nörtteily jatkuu!

Taulukoita ja palkkeja -kirjoituksessa käsittelin mm. Calc()-funktiota. Aihe oli kumminkin hankala selittää kunnolla, joten päätin yrittää, että mitä saan aikaan Javascriptilla (jota ei pidä sekoittaa Java-koodiin - eri asia). Tarkoituksena oli kehittää jokin visuaalinen simulaattori, jonka avulla voi hahmottaa, kuinka Calc()-funktio toimii palkkien suhteen.

Olen tyytyväinen luomukseeni, siitä tuli sellainen kuin idea olikin. Aika helpoilla systeemeillähän se on kasattu, mutta toimii se.

PALKKISIMULAATTORI Testipalkki: 50.00 %
MÄÄRITYKSET
1. Määritä palkin tilan leveys (harmaa alue):	% tilasta ( / pikseliä)
2. Määritä edustusarvo (yläraja ja yksikkö):	X Euroa Kiloa Metriä Mbit/s Omenaa Ääntä
3. Määritä sininen datapalkki:	X
CALC()-FUNKTIO -ESIMERKKI: Powered by Commodore 64 width: calc(25 / 50 * 100%); Tulos on 50.00 % Versio 1.0, tehnyt Jacke vuonna 2019

PALKKISIMULAATTORIN OHJEITA
Alue
Palkkisimulaattori on jaettu kolmeen osaan. Ylhäällä on testipalkki, sen alla on määritykset, joilla säädetään testipalkkia. Alimpana on Calc()-funktio -esimerkki, joka ottaa määrityksistä lukuja.

Määritykset
Määrityksiä on kolme.

1. Palkin tilan leveys
         on tila, jossa itse palkki voi liikkua. 1. määritys määrittää palkin tilan leveyden suhteessa sille varattuun tilaan:         . Palkin tilan leveys määritellään prosentteina: 20-100 % (raja-arvot). 20 % on alaraja, jotta on edes jotain nähtävääkin.

Prosenttiluvun jälkeen on pikseleinä tilan leveys (harmaa alue), 634 pikseliä. Sitä verrataan prosenttilukuun, jolloin saadaan selville pyöristettynä tilan leveys pikseleinä muutoksen jälkeen.

2. Edustusarvo (yläraja ja yksikkö)
Edustusarvo, parempaa nimeä en keksinyt tälle arvolle. Mutta kuvitellaan omenakori, niin 1. määritys on kori ja tämä 2. määritys määrittää, että montako omenaa koriin voi mahtua. Lukuarvon lisäksi voi valita sille jonkin yksikkömääreen, jotta asia olisi helpompi hahmottaa. 2. määrityksen yksikköpudotusvalikko määrittää automaattisesti myös 3. kohdan yksikkömääreen lukuarvon perään. Edustusarvo voi olla 1-1000.

3. Sininen datapalkki
         määrittää sen, että montako omenaa korissa on. Jos 2. kohdan arvo on 50 ja 3. kohdan arvo on 25, tarkoittaa tämä, että kori on puolillaan omenoita eli omenat vie tilaa korista 50 %. Datapalkin yläraja-arvo määräytyy sen mukaan, että mikä on 2. määrityksen lukuarvo. Eli kuvitteelliseen omenakoriin ei voi laittaa enempää omenoita kuin koriin mahtuu. Näin ollen yläraja on enintään 1000, jos 2. määrityskohdassa on täydet eli 1000. Datapalkin alaraja on 0, näin ollen meille jää aina jotain koriin laitettavaa, koska koriin mahtuu aina 1 asia (katso edustusarvon rajat).

Voit kirjoittaa numerokenttiin luvun tai sitten käyttää numerokenttien pieniä valintanuolia.

1. määritys ei vaikuta 2. ja 3. määrityksen väliseen suhteeseen. Vaikka tila muuttuu, niin sininen palkki pysyy suhteessa tilaan samana. Pieneen omenakoriin mahtuu yhtä monta omenaa kuin isompaankin koriin, mutta tietenkin omenien koko muuttuu, jotta pienempään tilaan mahtuu saman verran lukumäärällisesti.

Näytä muutos- ja Vakioasetukset-painikkeet
Kun olet määritellyt määritykset, paina Näytä muutos -painiketta. Näet muutokset palkissa, miten asetuksesi vaikuttivat palkkiin ja lukuihin. Alkutilanteessa Vakioasetukset-painike on pois käytöstä, tulee aktiiviseksi, kun muutos tehdään tai, kun klikkaa 2. määrityksen pudotusvalikkoa.

Näytä muutos -painike menee pois käytöstä tilanteessa, jossa edustusarvo on pienempi kuin sinisen datapalkin arvo. Tässä tilanteessa testipalkin yläpuolelle ilmestyy teksti "Huom. näillä arvoilla muutosta ei voi tehdä. Muuta kohtaa 2. tai 3.". Klikkaamalla datapalkin määrityksen numerokentän valintanuolta, niin silloin se luku pomppaa suurimpaan mahdolliseen lukuun ja jälleen Näytä muutos -painike on käytössä.

Vakioasetukset-painike palauttaa Palkkisimulaattorin alkutilaan - nollaa muutokset.

Muuta
Palkkisimulaattori on visuaalinen tapa hahmottaa prosenttilaskuja, kuinka paljon X-luku (datapalkki) on Y-luvusta (edustusarvo). Näin ollen Palkkisimulaattoria voidaan käyttää myös matematiikan apuvälineenä laskujen hahmottamiseen.

Palkkisimulaattorin perustoiminta oli nopeasti koodattu, mutta enemmän aikaa ja hermoja vaati paradoksien estäminen sekä "tekoälyn" kehittäminen. "Tekoälyä" on mm. kun 2. määritys asettaa 3. määrityksen ylärajan verraten itseensä - koriin ei voi laittaa enempää kuin siihen mahtuu. Jos kirjoitat raja-arvojen ulkopuolella olevan luvun, niin silloin luku muutetaan sallittuun rajaan. Samalla täytyi miettiä, kuinka painikkeet käyttäytyvät eri tilanteissa.

Tämä oli myös harjoitus, että saanko mitään aikaan javascriptilla.