joi, 4 octombrie 2007

Descriere

SWar doreste a fi un simulator interactiv de razboi intergalactic ce permite interactiunea intre un numar mare de utilizatori fara a consuma foarte multe
resurse pe partea de server.


Printre facilitatile ce fac acest joc distinct sunt interactiunea pe partea de client sporita, traficul client-server redus, modificarea in timp real a elementelor dinamice din pagina si utilizarea
straturilor multiple active.



Interactiunea client-server
Nivelul scazut de trafic intre client si server a fost posibil datorita implementarii unor tehnici web 2.0 cum ar fi Ajax. Implementarea Ajax s-a realizat cu limbajul Javascript, folosind obiectul XmlHttpRequest, fara librarii sau cadre de lucru externe.
Pentru a realiza comunicarea intre limbajele de programare folosite pe partea de server (Php), respectiv pe partea de client (Javascript) s-a folosit limbajul extensibil Xml. Procesarea documentului Xml se face folosind functiile speciale Dom.
Toate cererile Ajax sunt trimise asincron catre server, iar asteptarea primiri raspunsului de la server se indica printr-un element activ, ce este afisat doar la declansarea evenimentului de trimitere a cererii.
Fisierele de pe server catre care sunt trimise cererile au headere speciale ce nu permit stocarea acestora in cache-ul local al browserului, deoarece gradul de perisare al informatiilor trimise inapoi este mare.
Datele sunt preluate instantaneu din document cu limbajul Javascript iar apoi sunt trimise ca parametrii fisierelor Php cu metoda Get.
La nivel de document sunt create functii specifice pentru fiecare tip de actiune, iar atunci cand aceasta este declansata este creat obiectul XmlHttpRequest si cererea este trimisa.

Motoare interne
Actiunile declansate de catre utilzator sunt procesate de motoare scrise in PHP iar rezultatul procesarii este transpus in format XML pentru a putea fi apoi prelucrat cu JAVASCRIPT.
Motoarele primesc parametrii cu metoda GET, proceseaza cererea, rezultatul este trecut in baza de date, iar afisarea se face sub forma de arbore XML.
Reimprospatarea actiunilor globale este realizata cu o functie JAVASCRIPT ce se autoapeleaza intr-un interval de timp ce variaza in functie de timpul de raspuns al serverului.

Module si cadre active
Intregul joc este bazat pe module si cadre active, acest lucru facilitand o interactiune utilizator-browser mai mare. De asemenea, aceasta caracteristica permite reimprospatarea dinamica, doar pe anumite cadre, ce reduce traficul client-server. Constructia pe cadre, permite si o accesare rapida si instantanee a tuturor sectiunilor jocului.
Spatiul din fereastra browserului este minimizat si compact datorita elementelor ascunse, si a straturilor multiple active. Un numar destul de mare de ferestre si elemente active sunt estompate pentru a reduce spatiul, acestea putand fi afisate la declansarea unor evenimente specifice. Straturile multiple active sunt construite cu clase speciale CSS si functii JAVASCRIPT ce schimba in timp real proprietatile acestora.
Accesarea elementelor din cadrele active se face folosind functiile DOM. Continutul fiecarui cadru modificandu-se in timp real la declansarea anumitor elemente.

Interfata
a.) Straturi multiple active
Folosirea straturilor multiple active aduce interactiunea sistemului de operare in browser. Aceasta caracteristica speciala SWar permite utilizarea unui numar mare de ferestre si de cadre active in acelasi timp intr-un spatiu restrans.
La afisarea meniului principal, elementele din proximitatea sa se vor dezactiva, iar singura zona activa va ramane interiorul meniului.
b.) Elemente ascuse
Pentru a reduce spatiul activ, s-au implementat elemente partial ascunse, care se deruleaza la declansarea evenimentelor onClick.
c.) Ferestre drag&drop
O alta caracteristica ce face ca interactiunea SWar sa fie asemenatoare cu cea a unui sistem de operare este implementarea ferestrelor de tip drag&drop.
d.) Elemente de tip hint
Pentru a facilita afisarea informatiilor ajutatoare, au fost implementate elemente de tip hint, ce se activeaza in timp real la trecerea cursorului deasupra unui element.
e.) Elemente pull-down
Meniuri interactive ce se deruleaza la aparitia evenimentului onClick.
f.) Butoane cu animatii in trei pasi
Pentru a marii interactiunea utilizator-browser, fiecare buton are trei faze de animatie, fiecare faza fiind declansata la aparitia unui eveniment, animatia find asemanatoare butoanelor ActiveX ale sistemului de operare Windows. Pentru animarea butoanelor s-a folosit o singura functie JAVASCRIPT ce primeste ca parametru numele butonului.
g.) Functii pentru selectare multipla



Functiile pentru selectarea multipla au rolul de a parcurge dinamic elementele de tip input din document.

Sectiuni
Utilizatorul are doua perspective principale asupra jocului ce pot fi selectate din meniul de tip pull-down aflat in partea superioara a ecranului.
a.) Planeta
b.) Harta Univers
c.) Statistici
d.) Mesaje
e.) Instructiuni



Tratarea evenimentelor si alertelor
La nivelul documentului sunt declansate evenimente de tip timeout pentru numaratoarile inverse.
Alertele nu sunt afisate cu functia JAVASCRIPT alert() ci cu o functie predefinita numita fereastra(text), ce primiteste ca parametru textul ce va fi afisat.

Securitate
A fost creata o functie PHP speciala addentities() ce trateaza fiecare parametru primit cu GET. Accesul direct la oricare dintre fisierele PHP de pe server este restrictionat. Verificarea se face pe baza de sesiuni.
De asemenea in JAVASCRIPT s-a creat o functie ce restrictioneaza incarcarea jocului intr-un sau orice alt container de acest fel, pastrand principul locatiei originare.

Standardizare
Codul a fost scris respectand standardele consotiului W3C. In procesul de constructie site-ul a fost testat regulat in browserele moderne cum ar fi: Internet Explorer 6.0, Mozilla 1.0, Opera 9.0 si Safari 3.0 pe platforma Windows XP Professional.

Niciun comentariu: