Käyttöliittymän muokkaus

http://www.hut.fi/~trutanen/76115/vaihe5/templatet.html
 
Päivä Selitys Tekijä
12.03.2000 Kuvat Mika
15.03.2000 Alustava versio tekstistä, templatejen ja sivujen nimet Mika
19.3.2000 Käytössä olevat tagitMika
20.3.2000 Lisäyksiä 3. lukuunMika
22.3.2000 Viimeistelyä, kuvien linkkausMika

Sisällysluettelo

1. Yleistä
2. Templatejen ja staattisten sivujen muokkaus
3. Käytössä olevat tagit
4. Tehtyjen muutosten käyttöönotto

Liite 1: Terminologia

1 .Yleistä

Kauppaohjelmiston ulkoasun luominen on erillään ohjelman muista toiminnoista, jolloin kauppapaikan pitäjä voi muokata kaupan ilmeen haluamakseen koskematta varsinaiseen ohjelmistoon. Normaalisti ulkoasun muokkaus tehdään asennusvaiheessa, mutta muutoksia voi halutessaan tehdä milloin tahansa.

1. 1. Elementit

Ulkoasu muodostuu staattisista kokonaisista HTML-sivuista (sivuista) sekä lyhyistä dynaamista HTML-pätkistä (templateista), joista kootaan kokonaisia sivuja.  Staattiset sivut ja kuvat tallennetaan johonkin WWW-palvelimelle näkyvään hakemistoon. Templatet pitää tallentaa hakemistoon c:\telamiitti\layout\.

Käyttöliittymän elementit, eli

ovat muokattavissa.
Ohjelma käyttää kehyksiä (frames), joita voi myös muokata, mutta tätä ei suositella eikä ohjeisteta.

1. 2. Ennakkotiedot ja vaatimukset

Ennakkotiedoiksi riittää hyvä HTML-kielen tuntemus.
Muokattujen sivujen ja templatejen käyttöönotto edelyttää riittäviä käyttöoikeuksia (Windowsissa oikeus pysäyttää ja käynnistää serviceitä).

2. Templatejen ja staattisten sivujen muokkaus

Jokainen näkymä koostuu yhdestä tai useammasta staattisesta sivusta ja templatesta.  Seuraavissa kuvissa staattiset sivut on merkitty harmaalla ja templatet valkoisella. Tiedoston nimi on mainittu sen oletuspaikkaa vastaavan suorakaiteen vasemmassa yläkulmassa. Yksittäisten elementtien paikkaa voi vaihtaa. Listoissa listan kasvamissuunta voi olla ylhäältä alas tai vasemmalta oikealle.

Staattisia sivuja muokataan normaalin HTML-sivun tavoin.

Templateissa dynaamisten tietojen (kuten tuotteen nimen tai hinnan) paikkaa merkitään erityisellä tagilla:

<!--! attributeName -->
esim.

<!--! productname-->

Sivun luontivaiheessa tagi korvataan merkkijonolla (normaalitapauksessa tavallista tekstiä). Jos halutun nimistä arvoa ei löydy, tagi korvataan tyhjällä merkkijonolla.

Oletusarvoisesti käyttöliittymä koostuu seuraavista sivuista ja templateista:

2.1. Kaupankäynti - pääkehys

Päänäkymä muodostuu kolmesta kehyksestä: vasemmassa yläkulmassa on päävalikko, sen alla lista tuotekategorioista, ja oikella puolella on tilaa tuotteilla ja ostoskorille (ostoskehys). Päänäkymän kokoaa index.html (tai default.htm tai muu WWW-palvelimelle määritelty hakemiston indeksisivu).

Tiedostot ja käytössä olevat tagit:

2.2. Kaupankäynti - normaali näkymä

Oikealle puolelle ladataan ostoskehyksen sisältö, jonka yläosassa on tuotelista (tuotekehys) ja alaosassa listattuna ostoskorin sisältö (ostoskorikehys). Molemmat listat ovat oletusarvoisesti tyhjiä, jolloin ...list.html -templatea ei ole yhtään kappaletta.

Kun kategoriasta on valittu tuotteita sisältävä kategoria, tuotelista avautuu oikealle puolelle. Ostoskori päivittyy aina kun tuotelistalta poimitaan ostoksia tai ostoskoria muokataan suoraan, esim. poistetaan tuote sieltä.

Tiedostot ja käytössä olevat tagit:

2.3. Kaupankäynti - tuotetiedot

Tuotteen valitseminen joko ostoskorista tai tuotelistaltaa avaa tuotteen esittelysivun tuotekehykseen.  Mikäli tuotteen haluaa avata erilliseen 'popup' -ikkunaan, linkiksi pitää laittaa ikkunan avaava javascript-koodi varsinaisen linkin sijaan.

Tiedostot ja käytössä olevat tagit:

2. 4. Tilaus - asiakastiedot

Valitsemalla tilaustoiminnon ostoskorista, siirrytään tilausvaiheeseen. Oletusarvoisesti tässä vaiheessa päävalikko jää pois.

Tiedostot ja käytössä olevat tagit:

2. 5. Tilaus - kuitti

Asiakastietojen täyttämisen jälkeen lasku näytetään pankkisiirtolomakkeen tapaisessa näkymässä, jolloin sitä ei voi enää editoida.  Lomakkeen lähetyksen jälkeen ostaja siirtyy pankin omalle sivulle, tai luottokortttioston tapauksessa suoraan paluu-sivulle.

Tiedostot ja käytössä olevat tagit:

2. 6. Tilaus- paluu pankista maksamisen jälkeen

Pankin sivuilta palatessa, tai luottokortilla maksaessa palataan takaisin kaupan sivulle.

Tiedostot ja käytössä olevat tagit:

2. 7. Tilaus - paluu mikäli maksu on peruutettu

Tiedostot ja käytössä olevat tagit:

3. Käytössä olevat tagit

3.1. cancelorder.html

- -

3.2. cart.html

sum Ostosten yhteissumma
list Lista ostoksista, katso cartlist.html
empty1 Jos ostoskori on tyhjä, nämä korvataan kommenttimerkeillä, jolloin Tilaus ja Tyhjennä nappeja ei näytetä ollenkaan
empty2

3.3. cartlist.html

name Tuotteen nimi
id Tuotenumero tai muu tuotteen yksilöivä tunniste
amount Kuinka monta kappaletta tuotetta on valittu ostoskoriin
index Tuotteen järjestysnumero korissa
price Yhden kappaleen / erän hinta
priceall Tuotteen hinta * määrä

3.4. categories.html

list Lista kategorioista, valmiiksi sisennetty

3.5. creditcard.html / custinfo.html

sum ostosten yhteissumma
sumnumber
firstname Asiakkaan yhteystiedot
lastname
streetaddress
zip
postoffice
country
phone
email

3.6. productinfo.html

name Tuotteen nimi
category## Kategorian nimi, ## tarkoittaa syvyystasoa
id Tuotenumero tai muu tuotteen yksilöivä tunniste
vendor Valmistaja
unitsize Myyntierän koko
price Yhden kappaleen / erän hinta

3.7. productlist.html

name Tuotteen nimi
category## Kategorian nimi, ## tarkoittaa syvyystasoa
id Tuotenumero tai muu tuotteen yksilöivä tunniste
vendor Valmistaja
unitsize Myyntierän koko
price Yhden kappaleen / erän hinta

3.8. productlistlistpage.html

productlist Lista tuotteista, katso productlist.html
hidePageList1 Mikäli tuotelista mahtuu yhdelle sivulle, piilotetaan sana sivu
hidePageList2
pages Mikäli tuotelista ei mahdu yhdelle sivulle, linkkilista muista sivuista 

3.9. receipt.html

payment.dealer Tietoja kauppiaasta, luetaan payment.properties -tiedostosta
payment.message
payment.ref Viite
payment.sum Kokonaissumma
payment.date Päivämäärä
payment.form HTML-lomake, jolla tiedot välitetään pankille / luottokunnalle
payment.customer Asiakkaan (itse syöttämä) nimi

3.10. validateorder.html

paymentok Viesti onnistuneesta maksusta

4. Tehtyjen muutosten käyttöönotto

Staattisille sivuille tehdyt muutokset voi tallettaa suoraan WWW-palvelimen hakemistoon. Jotkut palvelimet lukitsevat tiedostot, jolloin WWW-palvelin pitää pysäyttää  ja käynnistää  uudestaan, jotta tiedostot voi kopioida vanhojen päälle. Uusia tiedostoja voi hakemistoon siirtää milloin vain.

Muokattujen templatejen käyttöönotto edellyttää servlet enginen pysäyttämistä ja uudelleen käynnistystä.

Liite 1: Terminologia