IV0110 2 töö 2010 aasta variant

Allikas: Lambda

See on vana, 2010 aasta töö, mitte 2011 aasta töö!

Rakenduse ülevaade

Sinu ülesandeks on kirjutada brauseris jooksev, javascripti ja css-i peale ehitatud ülilihtne kahe inimese täringumäng pig, täpsemalt selle "basic rules" variant. Loe kõigepealt läbi ülevaade wikipediast ja vaata tausta mõttes lisaks optimaalset programmi ja kogumikku artikleid.

Ühe mängija asemel mängib sinu programmis arvuti, st programmi kasutaja mängib arvuti vastu. Optimaalne mängustrateegia on suhteliselt keeruline (sellest saab lugeda viidatud artiklitest), sestap piisab, kui arvuti mängib lihtsa mitteoptimaalse põhimõttega:

  • kui 100 punkti on juba täis, siis katkesta kohe.
  • muidu võta alati täis 20 punkti ja siis anna käik vastasele

Kogu materjal - html, css, javascript ja pildid - tuleb riputada serverisse. TTÜ serveri (dijkstra) kasutamiseks registreeri loengus/praksis õppejõu juures oma matriklinumber: täpsemalt loe altpoolt. Soovi korral võid kasutada ka mõnda muud serverit, kuid siis pead saama seal järgmistes praksides kasutada pythonit, php-d ja mysql-i.

Nõuded kasutajaliidesele

Mängu alustamiseks peab kasutaja sisestama vormile eraldi väljadele oma nime ja emaili ja mängupandava summa suuruse ning vajutama "Alusta" nuppu. Kui need väljad ei ole täidetud mõistliku sisuga, mängu alustada ei lubata (seda pead kontrollima javascriptiga). Täitmata/valesti täidetud väljade korral tuleb osutada, mis/kus on valesti, värvida sisendvälja taust erivärvi ja anda sinna fookus.

"Alusta" nupule vajutamise korral kuvatakse mängu põhileht, kus nime/emaili vormi enam pole. Väljadele sisestatud teksti mängus ei kasutata, see on niisama "dummy".

Mängu käigus on vaja:

  • Kuvada alati selge info, kelle käik parajasti on ning mis on mängu seis.
  • Esitada seis alati nii numbriliselt kui graafiliselt kahe riba/postiga, mis kumbki näitab ühe mängija seisu (vahemikus 0-100)
  • Iga täringuveeretuse järel tuleb kuvada graafiliselt täringukülg (otsi veebist täringukülgede pilte või joonista soovi korral ise).
  • Arvuti täringuveeretused peavad võtma mõistliku aja, et neid oleks võimalik jälgida (ca 1 sekund või rohkem).
  • Mängija käigu korral peavad tal olema selgelt nähtavad kaks nuppu: veereta ja katkesta.
  • Kui ei ole parjasti mängija käik, siis ei tule neid nuppe näidata (või näidata "hallilt" vms).
  • Info paigutus ekraanil peab olema stabiilne, tekst/nupud ei tohi hüpata vahel ühte, vahel teise kohta.

Mõlemad veebilehed peavad olema selge, arusaadava ja kena disainiga, mõttetut/segast infot ja arusaamist raskendavaid kujunduselemente ära kasuta.

Tehnoloogianõuded

Kasutajainfo vorm peab olema ühel html lehel ja mängu põhileht teisel html lehel - ilma freimide ja ifreimideta. Html lehed võivad kasutada sisselaetavaid css ja javascripti faile ja pilte.

Kogu rakendus peab kasutama ainult html+css+javascripti ja olema üles laetud serverisse staatiliste lehtedena. Flashi, java jms tehnoloogiate kasutamine on keelatud.

CSS-i harjutamise eesmärgil tuleb vältida kujunduslikke html tage (font, b, center, h1...h6, table jne) ja teha kujundus puhtalt CSS-ga. Elementaarsed tagid nagu p ja br ning head, script, body jms on ok. Vormi tagid (form, input, button jne) on hädavajalikud. Põhiliselt soovitav kasutada id-de ja class-dega varustatud div ja span tage.


Dijkstra server

Kodutööde tarbeks on kasutusel server nimega dijkstra (see keeruline nimi on ühe tuntud arvutiteaduse teerajaja nimi ja keeruline seepärast, et see nimi teile paremini meelde jääks).

Enne failide serverisse riputamist on mõistlik teha kogu süsteem valmis lihtsalt oma arvutis/arvutiklassi arvutis.

Ligipääs

Dijkstrasse sisselogimiseks on vaja end registreerida: kirjutada loengus/praksis registreerimispaberile oma nimi ja matriklinumber.

Sisselogimine

Sisselogimiseks kasutatakse SSL ühendust ehk siis maakeeli programmi putty (Windows) või ssh (Linux). Tegemist on siis käsurealigipääsuga Linuxipõhisele serverile.

  • Teie kasutajanimi ja parool: TTÜ arvutiklasside kasutaja + parool
  • Dijkstra aadress: dijkstra.cs.ttu.ee

Failide laadimine

Failide laadimiseks sinna kasutage SFTP protokolli. Soovitavad programmid selleks on windowsil winscp ja Filezilla. Linuxist kopeerimiseks kasutage scp-d.

Teine OK variant windowsil on kasutada putty-ga komplektis olevat DOS-i käsurea programmi pscp.exe näiteks nii (loomulikult pead oma failide, programmide asukohad ja nime ära muutma):

    F:\Lectures\Vorgurak1\Cgilect>c:\Users\tanel\Desktop\pscp tst1.html tammet@dijkstra.cs.ttu.ee:public_html/
    F:\Lectures\Vorgurak1\Cgilect>c:\Users\tanel\Desktop\pscp * tammet@dijkstra.cs.ttu.ee:public_html/

Failide muutmine otse serveris

Siin on kolm veidi erinevat võimalust:

  • redigeerida faile mõne serveris oleva redaktoriga, näiteks vi
  • redigeerida faile oma masinas ja kopeerida nad peale muutmist serverisse (nagu varem kirjeldatud)
  • redigeerida faile oma masinas oleva redaktoriga, mis võimaldab neid otse serverist avada ja sinna kirjutada (hea variant selleks on winscp)

Üldiselt on kõige mugavam teha võimalikult kõik oma masinas valmis, katsetada ära ja alles siis kopeerida valmis asjad serverisse.

Keskkonna ettevalmistamine

Kõik asjad, mis paigutate oma dijkstra kodukataloogi alamkataloogi "public_html", on veebis nähtavad. See kataloog tuleb kõigepealt luua:

$mkdir public_html

("$" rea alguses tähistab nüüd ja edaspidi Linuxi käsurealt antavaid käske (enamus praeguse näite failioperatsioonidest peaks olema tehtavad ka SFTP graafilise liidese alt). Linuxi käsurea kasutamist tuleb uurida omal käel. Käsurea saamiseks tuleks üle SSH ühenduse dijkstra käsureale logida (ssh või putty vms) )

Kui kataloog on olemas, suunake oma brauser dijkstra aadressile, mille saate kui lisate serveri nime järgi tudengikoodi (näiteks sedasi, aga asendage oma tudengikood ära): http://dijkstra.cs.ttu.ee/~t0XXX/

Kui kõik töötab õigesti, peaksite nägema kataloogi nimistut, mis on tühi, sest te pole sinna faile pannud. Tekitage index.html nimeline fail ja kontrollige, et see hakkab endist tühja kataloogilistingut asendama. Rakenduse html-failid võite panna sinnasamasse public_html alla.

Failiõiguste probleemid

Juhul, kui te kataloogi või oma index.html sisu ei näe, kontrollige, et nii teie kodukataloog kui public_html kuuluksid grupile "tudengid" ja et sellel grupil oleks nii lugemis-kui kataloogisisu vaatamise pääsuõigused. Samuti peab tudengigrupil olema võimalus lugeda kõiki veebi ülesminevaid faile.

Kataloogile lugemis-ja nimekirjanäitamise õiguse andmine:

$chmod  g+rx public_html

Failile lugemisõiguse andmine:

$chmod g+r index.html