TEHNICKI FAKULTET - bib.irb.hr · MySQL i PHP su osvojili veliki dio tr zi sta jer su open source. Relacijski sustavi za pohranu podataka kao sto je MySQL sve podatke pohranjuju unutar

SVEUCILISTE U RIJECI

TEHNICKI FAKULTET

Preddiplomski studij racunarstva

Zavrsni rad

Web aplikacija za evidentiranje inalazenje lokacija sportskih centara

Rijeka, Srpanj, 2012. Mate Stulina

0069045897

SVEUCILISTE U RIJECI

TEHNICKI FAKULTET

Preddiplomski studij racunarstva

Zavrsni rad

Web aplikacija za evidentiranje inalazenje lokacija sportskih centara

Mentor: doc.dr.sc. Miroslav Joler

Rijeka, Srpanj, 2012. Mate Stulina

0069045897

Umjesto ove stranice umetnuti opis

zavrsnoga ili diplomskoga rada

Umjesto ove stranice umetnuti potpisanu izjavu

o samostalnoj izradbi rada

Sadrzaj

Popis slika viii

Popis kratica x

1 Uvod 1

2 Programski jezici i alati 3

2.1 Programski jezici . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4

2.1.1 PHP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4

2.1.2 MySQL . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5

2.1.3 Javascript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6

2.2 Alati . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8

2.2.1 NetBeans . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8

2.2.2 WampServer . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9

2.2.3 Mysql Workbench . . . . . . . . . . . . . . . . . . . . . . . . . 10

v

Sadrzaj

3 Aplikacijsko programsko sucelje 11

3.1 Google developers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12

3.1.1 Google geocoding service . . . . . . . . . . . . . . . . . . . . . 13

3.1.2 Google static maps . . . . . . . . . . . . . . . . . . . . . . . . 14

3.1.3 Google maps JavaScript v3 API . . . . . . . . . . . . . . . . . 15

3.1.4 Google directions service . . . . . . . . . . . . . . . . . . . . . 16

3.1.5 PHPMailer . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16

3.2 JQuery API . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17

4 Tennis Center Finder 19

4.1 Baza podataka . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20

4.2 Funkcionalnost i dizajn . . . . . . . . . . . . . . . . . . . . . . . . . . 21

5 Sports Center Finder 23

5.1 Baza podataka za SCF2 . . . . . . . . . . . . . . . . . . . . . . . . . 24

5.2 Programska rjesenja . . . . . . . . . . . . . . . . . . . . . . . . . . . 26

5.2.1 Pretraga . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26

5.2.2 Unos novog centra . . . . . . . . . . . . . . . . . . . . . . . . 28

5.2.3 Upute do centra . . . . . . . . . . . . . . . . . . . . . . . . . . 32

6 Upute za instalaciju 35

6.1 Priprema podataka za postavljanje na posluzitelj . . . . . . . . . . . 35

vi

Sadrzaj

6.2 Postavljanje baze podataka . . . . . . . . . . . . . . . . . . . . . . . . 36

6.2.1 Postavke za spajanje sa bazom . . . . . . . . . . . . . . . . . 36

6.3 Postavke za slanje mail-a . . . . . . . . . . . . . . . . . . . . . . . . . 37

6.4 Pocetak koristenja aplikacije . . . . . . . . . . . . . . . . . . . . . . . 38

7 Primjer koristenja 39

7.1 Primjer korisnickog sucelja . . . . . . . . . . . . . . . . . . . . . . . . 39

7.2 Primjer administracije centara . . . . . . . . . . . . . . . . . . . . . . 44

8 Zakljucak 46

Bibliografija 47

vii

Popis slika

2.1 Razlika izmedu standardne web apliakcije i aplikacije koja koristi

AJAX [15]. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8

2.2 Odabran i instaliran PHP modul. . . . . . . . . . . . . . . . . . . . 9

2.3 Wampserver localhost sucelje. . . . . . . . . . . . . . . . . . . . . . 10

3.1 Google API Console sucelje. . . . . . . . . . . . . . . . . . . . . . . 13

3.2 Mapa koja je rezultat zahtjeva adrese ‘Vukovarska 58, Rijeka, Hrvatska‘. 15

4.1 SCF - unos novog centra sa osnovnim podacima o centru. . . . . . . 19

4.2 TCF - unos novog centra sa mogucnosti odabira podloge teniskog

centra. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20

4.3 Relacije izmedu tablica sportski centar, korisnici, errorreport. . . . . 21

4.4 Odabir vrste podloge prilikom pretrazivanja unesenih lokacija teni-

skih centara. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22

5.1 Prikaz relacijske strukture baze podatka. . . . . . . . . . . . . . . . 26

5.2 Izgled trazilice za pretragu sportskih centara u bazi aplikacije. . . . . 27

viii

Popis slika

5.3 Dio funkcije initializeSlider () koji obraduje XML dokument i pos-

tavlja staticne slike lokacija centara unutar slider-a. . . . . . . . . . 28

5.4 Najbitniji dio funkcije addInfo () koji omogucuje dodavanje opisa

klikom na centar. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29

5.5 Prikaz nacina rada pretrage. . . . . . . . . . . . . . . . . . . . . . . 30

5.6 Prikaz rada web aplikacije prilikom unosa novog centra. . . . . . . . 31

5.7 Inicijalizacija Google Directions service-a. . . . . . . . . . . . . . . . 32

5.8 Funkcija za izracun uputa. . . . . . . . . . . . . . . . . . . . . . . . 33

5.9 Graficki prikaz pozivanja i rada funkcije calcRoute (). . . . . . . . . 34

7.1 Izgled korisnickog sucelja prilikom prijave na racun. . . . . . . . . . 40

7.2 Odabir lokacije centra”Cosmo Gym”. . . . . . . . . . . . . . . . . . 40

7.3 Gumb kojim se mogu zatraziti upute do centra. . . . . . . . . . . . . 41

7.4 Upis adrese polaska. . . . . . . . . . . . . . . . . . . . . . . . . . . . 41

7.5 Prikaz uputa od adrese polaska”Korzo 1, Rijeka” do lokacije centra

”Cosmo Gym”. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42

7.6 Gumb za prijavu pogreski. . . . . . . . . . . . . . . . . . . . . . . . 42

7.7 Popunjavanje obrazca za prijavu pogreske. . . . . . . . . . . . . . . 43

7.8 Pregled prijavljenih pogreski. . . . . . . . . . . . . . . . . . . . . . . 44

7.9 Administrator izmjenjuje prijavljene vrijednosti. . . . . . . . . . . . 45

7.10 Administrator pise e-mail poruku korisniku koji je prijavio pogresku. 45

ix

Kazalo

AJAX Asynchronous JavaScript and XML

API Application programming interface

CSS Cascading Style Sheets

FTP File Transfer Protocol

HTML Hypertext Markup Language

HTTP HyperText Transfer Protocol

HTTPS Hypertext Transfer Protocol Secure

GPS Global Positioning System

JS JavaScript

JSON JavaScript Object Notation

PHP Hypertext Preprocessor

SCF Sports Center Finder

SCF2 Sports Center Finder 2

SCP Secure Copy Protocol

x

Kazalo

SSL Secure Sockets Layer

TCF Tennis Center Finder

TCP Transmission Control Protocol

TLS Transport Layer Security

XML EXtensible Markup Language

xi

Poglavlje 1

Uvod

Tema zavrsnog rada je izraditi web aplikaciju koja bi omogucila pretrazivanje sport-

skih centara prema njihovoj lokaciji. Korisnici trebaju unijeti sportski centar, od-

nosno lokaciju centra koja se zatim geokodira s obzirom na upisanu adresu cime se

omogucuje daljnje prikazivanje polozaja centra na generiranim kartama. Rezultat

je realizacija aplikacije”Sports center finder” (SCF) odnosno njene konacne verzije

”Sports center finder 2” (SCF2).

Pocetak razvoja je prva verzija za opci unos sportskih centara (”Sports center

finder” - SCF) koja je temelj razvoja. Nastavak razvoja je prosirivanje pretrage i

unosa doradom aplikacije za pretragu teniskih centara (”Tennis center finder” - TCF),

a posljednja verzija je obogacena novim rjesenjima, funkcionalnostima i dizajnom.

Cijela aplikacija je zamisljena i organizirana u tri korisnicke razine da bi se

ogranicilo mogucnosti korisnika i sprijecilo neprimjerno koristenje aplikacije. Stoga

su tri korisnicke razine organizirane kao:

• gost u kojoj ce svaki korisnik moci koristiti samo opciju pregledavanja centara,

• registrirani korisnik u kojoj ce korisnik morati imati svoj racun te ce moci

1

Poglavlje 1. Uvod

koristiti uz vec navedenu opciju pregleda i opciju unosa novih lokacija centara,

• administrator odnosno korisnik koji ce odrzavati bazu podataka web aplika-

cije.

Dodatne mogucnosti za registrirane korisnike su komentiranje i ocjenjivanje centara

(kojima je ujedno uveden i”sustav kvalitete” unosa), upute do centra, pregled vlas-

titih unosa i mogucnost izmjene osobnih podataka.

2

Poglavlje 2

Programski jezici i alati

Prilikom izrade aplikacije koristeni su sljedeci programski jezici:

• PHP 5.2/5.3 [1],

• MySQL 5.5.24 [2],

• JavaScript [3],

• AJAX [4],

Skriptni jezici kojima se generira sadrzaj i osvaruje komunikacija posluzitelj-korisnik

su:

• HTML 5 [5],

• CSS 3 [6],

• JSON [8],

• XML [7].

3

Poglavlje 2. Programski jezici i alati

U izradi koda i osmisljavanju baze su koristeni programski alati:

• WampServer [10],

• NetBeans 7.1.2 [9],

• MySQL Workbench 5.2.40 [11].

Za testiranje i otklanjanje poteskoca na aplikacijama su koristeni web preglednici:

• Google Chrome [12],

• Mozilla Firefox [13],

• Microsoft Internet Explorer [14].

2.1 Programski jezici

2.1.1 PHP

PHP [1] (Hypertext Preprocessor) je objektno-orijentiran programski jezik namije-

njen prvenstveno programiranju posluziteljske strane (eng. server side) web aplika-

cije. PHP je jedan od najzastupljenijih programskih jezika za programiranje web

aplikacija. Vrline su mu da je jako slican C programskom jeziku i lak za pamcenje.

Ukratko nakon sluzbenog izdanja prvotna verzija”PHP/FI 2.0“ u studenom ‘97,

je zamijenjena prvom alfa verzijom PHP-a 3 (PHP3). Postoje trenutno 3 sluzbene

verzije ovog programskog jezika:

• PHP3

• PHP4

4


• PHP5

Sintaksa prve verzije je bila slicna perlu, ali jednostavnija. Ipak je imala varijable

kao perl, automatsku interpretaciju varijabli web formi i u HTML-u ukorijenjenu

sintaksu. PHP kod se stavlja izmedu HTML trag-ova:

<?php echo ‘i‘; ?>.

Varijable u PHP-u su”loosely typed” i uvijek pocinju sa znakom

”$” (dollar). Za

pokretanje web aplikacija pisanih u PHP-u potrebno je imati instaliran PHP modul

na serveru. PHP nije jedini specijalizirani programski jezik za izradu web aplikacija:

• JSP - Sun-ova inacica Jave za izradu web aplikacija,

• ASP - razvijen od strane Microsofta,

• CFM - ”ColdFusion” tvrtke Adobe.

Naravno, moguce je i jezicima opce namjene kreirati web aplikacije, bio to C, Perl

ili cak Fortran.

I u Hrvatskoj postoje portali orijentirani PHP-u:

• http://www.php.hr - Udruga PHP programera Hrvatske,

• http://www.PHP.com.hr - Nesluzbena hrvatska PHP stranica.

2.1.2 MySQL

MySQL [2] je besplatan open source sustav za upravljanje bazom podataka. MySQL

baza je slobodna za vecinu uporaba. Ranije u svom razvoju, MySQL baza podataka

5

http://www.php.hr

http://www.PHP.com.hr


suocila se s raznim protivnicima MySQL sustava, organiziranja podataka jer su joj

nedostajale neke osnovne funkcije definirane SQL standardom. Vrlo je stabilna i ima

dobro dokumentirane module i ekstenzije te podrsku od brojnih programskih jezika:

PHP, Java , Perl, Python itd. MySQL baze su relacijskog tipa, koji se pokazao

kao najbolji nacin skladistenja i pretrazivanja velikih kolicina podataka i u sustini

predstavljaju osnovu svakog informacijskog sustava, tj. temelj svakog poslovnog

subjekta koji svoje poslovanje bazira na dostupnosti kvalitetnih i brzih informacija.

MySQL i PHP su osvojili veliki dio trzista jer su open source. Relacijski sustavi za

pohranu podataka kao sto je MySQL sve podatke pohranjuju unutar tablica koje

se sastoje od kolona i redova. Kolone se nazivaju jos i poljima ili atributima, a

sluze za skladistenje pojedinih podataka o odredenom entitetu, redovi se nazivaju

jos zapisima ili slogovima (eng. record) i sadrze sve podatke jednog entiteta. Teorija

o bazama podataka je precizno definirana matematickim pravilima pocetkom 70-ih.

2.1.3 Javascript

JavaScript [3] je skriptni programski jezik, koji se izvrsava u web pregledniku na

strani korisnika. Napravljen je da bude slican Javi, zbog laksega koristenja, ali

nije objektno orijentiran kao Java, vec se temelji na prototipu i tu prestaje svaka

povezanost s programskim jezikom Java. Izvorno ga je razvila tvrtka Netscape

(www.netscape.com). JavaScript je primjena ECMAScript standarda. JavaScript

s AJAX (Asynchronous JavaScript and XML) tehnikom omogucuje web stranicama

komunikaciju sa serverskim programom, sto cini web aplikaciju interaktivnijom i

laksom za koristenje. Ostvarivanje web aplikacija brzinom slicnih desktop aplikaci-

jama, napokon je omoguceno uvodenjem i razvojem AJAX-a [4]. Kod uobicajenih

web aplikacija, korisnik ispunjava obrazac te salje posluzitelju na obradu odabirom

”submit” akcije. Nakon potvrde, cijeli HTML obrazac se salje posluzitelju, posluzitelj

predaje podatke na obradu odredenoj skripti (uglavnom PHP), te nakon obrade

6

www.netscape.com


vraca pregledniku potpuno novu stranicu. Naravno, dok proces obrade podataka

traje, korisnici su prisiljeni cekati neko vrijeme. Tu se ocituje jedan od nedosta-

taka standardnih web aplikacija a to je relativno spor odgovor na zahtjev korisnika

(brzina ovisi o kolicini podataka koje je potrebno obraditi) te korisnici nisu informi-

rani o statusu poslanih podataka. Nisu u mogucnosti znati da li je cekanje rezultat

opterecenosti posluzitelja, spore veze ili je pak posrijedi nesto trece. Uglavnom,

nedostaje trenutna povratna informacija nakon slanja podataka na obradu. AJAX

postavlja JavaScript tehnologiju i XMLHttpRequest objekt”izmedu” web forme i

posluzitelja. Nakon sto korisnik zavrsi sa unosom podataka u obrazac, oni se salju

JavaScript skripti, a ne direktno na posluzitelj. Tada sama skripta salje podatke

posluzitelju na obradu, te korisnik uopce nije svjestan ikakvog toka obrade poda-

taka, ako se stranica u pregledniku ne osvjezava. Razlog tome je sto JavaScript salje

podatke asinkrono odnosno korisnik ne mora cekati na odgovor posluzitelja da bi mo-

gao nastaviti s radom. On i dalje moze popunjavati forme, koristiti stranicu a podaci

se salju odnosno primaju u pozadini. Ta razlika je u radu izmedu standardnog nacina

rada i AJAX-a je prikazana na Slici 2.1 . Nakon obrade, posluzitelj vraca podatke

JavaScript funkciji koja odlucuje sto s njima dalje napraviti. Ona moze upotpuniti

polja obrazca, dodati sadrzaj stranici ili nesto trece i to sve obavlja trenutno sto

rezultira povecanom brzinom (kako nije svaki put potrebno prenositi cijelu stranicu

do posluzitelja i natrag) te korisniku daje dojam trenutnog odaziva na koji je navikao

koristeci desktop aplikacije. JavaScript funkcija cak moze primiti podatke, provesti

njihove obrade, poslati novi zahtjev posluzitelju i to sve bez ikakve potrebe za inter-

vencijom korisnika. Rezultat je dinamicna i brza web stranica sa visokim stupnjem

interakcije poput standardne desktop aplikacije sa svim prednostima nad njom koje

pruza Internet.

7


Slika 2.1 Razlika izmedu standardne web apliakcije i aplikacije koja koristi AJAX[15].

2.2 Alati

2.2.1 NetBeans

NetBeans [9] je open source razvojni alat baziran programiran i baziran na Java

programskom jeziku. Alat je dizajniran kao modularan software zbog cega korisnik

moze optimizirati sucelje i prilagoditi ga svojim potrebama. Kao takav ovaj razvojni

alat je postao popularan medu web razvojnim programerima. Iako je NetBeans

uglavnom okrenut prema Java programskim jezicima, posjeduje module za razvoj

PHP, C/C++ i Groovy. Prilikom izrade ovog projekta koristen je modul za PHP

razvojno okruzje. Na Slici 2.2 je prikazan odabir PHP modula.

8


Slika 2.2 Odabran i instaliran PHP modul.

2.2.2 WampServer

WampServer [10] je lokalni web server za Windows operativne sustave koji podrzava

Apache2, PHP i MySQL. Trenutne verzije WampServer-a poboljsane su verzije i

nastavak razvoja WAMP inacice. WAMP-ove inacice za ostale operativne sustave

su MAMP ( Apple Mac Os ) i LAMP ( Linux bazirani sustavi ). WampServer

instalacijski paket posjeduje:

• phpMyAdmin – sucelje za manipulaciju sa MySQL bazom,

• MySQL Buddy – sucelje za odrzavanje i optimizaciju baza,

• Webgrind – alat za profiliranje web aplikacija.

Na Slici 2.3 je prikazano ‘localhost‘ sucelje.

9


Slika 2.3 Wampserver localhost sucelje.

2.2.3 Mysql Workbench

MySQL Workbench [11] je opensource aplikacija za dizajniranje i optimiziranje MySQL

baza podataka. Velika je pomoc pri projektiranju baze podataka. Posjeduje jednos-

tavne i korisne alate kojima se vrlo lako moze postici rezultat. Moguce je i napraviti

relacijske diagrame automatski generirane prema relacijskoj strukturi baze podataka.

10

Poglavlje 3

Aplikacijsko programsko sucelje

Aplikacijsko programsko sucelje [16] (eng. API - Application Programming Interface)

ili sucelje za programiranje aplikacija je skup odredenih pravila i specifikacija koje

programeri slijede kako bi se mogli sluziti uslugama ili resursima operacijskog sustava

ili nekog drugog slozenog programa (npr. funkcija, procedura, metoda, struktura

podataka, objekata i protokola). Na primjer s programskim jezicima kao Java, C i

Python dolazi skup osnovnih aplikacijskih programskih sucelja dok specificni API-i

dolaze s programskim paketima posebne namjene kao sto su Google Maps, MySQL

i Facebook Platform. Koristenjem API-a omogucava se da programeri koriste rad

drugih programera stedeci vrijeme a u vecini slucajeva i novac koji je potreban da se

napise slozeni program. Napretkom u operacijskim sustavima, a osobito u grafickom

korisnickom sucelju, API je nezaobilazan u stvaranju novih aplikacija. Umjesto da

se novi programi pisu iz temelja, programeri nastavljaju na radu drugih te njihovim

kombinacijama u vrlo kratkom roku stvaraju nesto sto sami ne bi mogli ni zamisliti.

Prilikom izrade TCF i SCF aplikacije su koristeni sljedeci servisi i API-ji:

• Google Code / Google Developers:

– Google geocoding service,

11

Poglavlje 3. Aplikacijsko programsko sucelje

– Google static maps API,

– Google maps JavaScript V3 API,

– Google directions service API,

– PHP Mailer,

• Jquery API.

3.1 Google developers

Google developers [17] je web servis orijentiran prema razvojnim programerima koji

zele iskoristiti mogucnosti koje pruza Google prilikom razvoja vlastitih projekata.

Google developers odnosno google code nudi dvije osnovne razine koda, API za pri-

vatne korisnike i API za poslovne korisnike koji predvidaju da ce koristiti velike

resurse. Bitna razlika u ponudi opcija i mogucnosti ne postoji ali ukoliko ste pos-

lovni korisnik, Google ce vam posvetiti posebnu paznju i potporu. Privatni korisnik

odnosno fizicka osoba koja koristi google API u nekomercijalne svrhe ima limite, koje

ukoliko vas sputavaju mozete ukinuti na nacin da placate svako prekoracenje dozvo-

ljenog limita. U svrhu boljeg pracenja i odrzavanja koristenih Google API-ja, Google

je stvorio Google API Console prikazano na Slici 3.1. To je jedinstveno sucelje kojime

se moze pratiti sav promet preko koristenih API-ja, pregled koristenja, pregled na-

placenih zahtjeva i sl. Na Google developers sluzbenoj stranici [17] mogu se pronaci

svi sluzbeni API-ji koje nudi Google u svojoj ponudi. Google Maps API sadrzava

vecinu API-ja koristenog u realiziranju web aplikacija TCF i SCF2. Google Maps

je trenutno najveci svjetski web servis orijentiran na mapiranje zemljine povrsine.

Usporedno sa razvojem i sve vecom pokrivenosti zemljine povrsine sa mapiranim

podatcima, Google je razvio vlastite usluge, servise i API-je. Prilikom razvoja apli-

kacija u aplikacije se”ugraduje” Google Maps API, prilagodava potrebama aplikacije

i dizajna.

12


Slika 3.1 Google API Console sucelje.

3.1.1 Google geocoding service

Geokodiranje [18] (eng. geocoding) je proces nalazenja odgovarajucih zemljopisnih

koordinata (izrazenih kao zemljopisna duzina i sirina) prema drugim zemljopisnim

podatcima kao sto su adrese ulica, postanski brojevi itd. Sa zemljopisnim koordina-

tama moguce je mapirati i generirati zemljovide i karte u Geografskim informacijskim

sustavima (Geographic Information Systems ) ili ih upotrijebiti za oznacavanje (eng.

geotagging) pozicija na kartama. Postoji i takozvana opcija reverznog geokodira-

nja (eng. reverse geocoding) gdje se iz zemljopisnih koordinata generiraju adrese.

Google geocoder API je web servis koji pomaze u procesu geokodiranja. Interpo-

lacija adresa je jednostavna metoda geokodiranja. Ova metoda koristi podatke iz

geografskih informacijskih sustava koji su vec mapirani u geografskom koordinatnom

prostoru. Svaka ulica je segment kojem je dodan atribut broj. Geocoding uzima tu

adresu, pronalazi odgovarajuci segment i zatim interpolira koordinate adrese unutar

13


tog segmenta ovisno ukupnom rasponu adresa unutar tog segmenta. Jedan od ostalih

nacina geokodiranja je centroid ili postavljanje koordinata u centar parcele, ukoliko

su dostupni podaci u bazi podataka geografskog sustava. U ruralnim ili nekim dru-

gim podrucjima nedostatak visoko kvalitetnih podataka i adresiranja uglavnom nije

moguc pa se tu koristi GPS sustav za mapiranje karata. No ovaj nacin nije dobar

iz razloga sto se dogadaju slucajevi gdje je nepreciznost generiranja koordinata ve-

lika zbog velikih dimenzija parcela ili referentnih tocaka. Istrazivanja su uvela novi

pristup kontroli i unapredivanju baza podataka, koristenjem paradigme bazirane na

agentima. Kao dopuna geocoding-u, razvijene su dodatne tehnike i kontrolni algo-

ritmi. Taj pristup su geografski elementi koje pronalaze individualni agenti (ugl.

korisnici usluge) a omogucuju maksimalno priblizavanje istinitosti prikaza. Geoko-

dirane lokacije su korisne u mnogim analizama geografskih informacijskih sustava i

kartografskih zadataka. Takoder geokodiranje je sveprisutno i raznim web aplikaci-

jama i servisima.

3.1.2 Google static maps

Google Static Maps V2 su staticne mape koje generira Google API prilikom slanja

HTTP zahtjeva prema Google Maps serverima za zeljenu lokaciju. Mape koje su ge-

nerirane su u slikovnom formatu i kao takve se ne mogu mijenjati te Google zadrzava

pravo na svaku kopiju doticne slike/mape. Moguce je potrazivati mapu lokacije upi-

som tekst naziva lokacije ili pomocu zemljopisnih koordinata. Google Static Maps

podlijeze ogranicenom broju zahtjeva prema serveru na dan. Trenutni dnevni limt

je 5000/dan (pet tisuca dnevno), a ukoliko korisnik Google Static Maps API-ja zeli,

moze omoguciti naplatu ukoliko se prekoraci dnevno ogranicenje. U primjeru dolje

je primjer web adrese pomocu koje se generira slika prikazana na Slici 3.2 sa mapom:

http://maps.googleapis.com/maps/api/staticmap?

14


center=Vukovarska%2058,%20Rijeka,Croatia&zoom=16&size=500x300

&maptype=roadmap

&markers=color:blue%7Clabel:Tehni%C4%8Dki%20faklutet%20rijeka

%7C45.336140,14.425191

&sensor=false

Slika 3.2 Mapa koja je rezultat zahtjeva adrese ‘Vukovarska 58, Rijeka, Hrvatska‘.

3.1.3 Google maps JavaScript v3 API

Google maps JavaScript API omogucuje postavljanje interaktivnih Google mapa

na web aplikacije korisnika i razvojnih web programera. Trenutna sluzbena API

verzija 3 (tri) je dizajnirana da bude brza, prilagodljiva mobilnim aplikacijama, a

istovremeno i tradicionalnim desktop aplikacijama. Google maps JavaScript API

osigurava nekoliko nacina manipulacije mapama (npr. na sluzbenoj stranici Google

Maps-a http://maps.google.com) kao i dodavanja sadrzaja pomocu razlicitih web

servisa kao sto je Google directions. JavaScript Maps API V3 je besplatna usluga,

web servis dostupan je za svaku web aplikaciju koja je besplatna za krajnje korisnike.

15

http://maps.google.com


Google zadrzava sva prava na kod, kao i na pravo oglasavanje na sadrzaju koji je

generiran putem Google maps API-ja.

3.1.4 Google directions service

Google directions service je web servis koji proracunava put izmedu dvije zadane

lokacije koristeci HTTP zahtjeve i prikazuje upute ukoliko je to moguce i programski

se nadograduje na Google Maps JavaScript V3 API. Korisnik moze pretrazivati upute

ovisno o nacinu putovanja (javnim prijevozom, autom, biciklom, pjeske). Directions

mogu prikazivati nazive i imena polazista, i destinacije kao tekst ili kao zemljopisne

koordinate. Takoder ukoliko programer zeli prikazati i taj dio, directions nudi i ispis

lokacija koje su na putu izmedu dvije zadane lokacije. Time se omogucuje i olaksava

planiranje putovanja. Buduci da je proracun puta izmedu dvije tocke vrlo zahtjevan

i spor proces, predlaze se da se upute zahtijevaju i proracunavaju unaprijed ukoliko

je to moguce ili da se korisnika upozna sa problemom da ne dolazi do nesporazuma.

3.1.5 PHPMailer

PHPMailer [19] je PHP e-mail transportna klasa koja sadrzi opcije poput slanja

poruka putem SMTP protokola, HTML poruka, moguceg dodavanja priloga e-mail

poruci itd. Moguce je slati e-mail poruke preko PHP mail() funkcije, Qmail-a ili

direktno preko SMTP klase. Kao dodatne mogucnosti transporta je moguce dodati

i slanje SMS poruka, dok je slanje MMS poruka u razvoju, ali se ocekuje ubrzo.

Implementacija PHPMailer-a je vrlo jednostavna PHP skripta u kojoj se na-

mjestaju osnovne postavke koje su potrebne za slanje poruke. Iako je PHPMa-

iler u osnovi samostalna aplikacija-server za slanje e-mail poruka potrebno je imati

korisnicki racun sa e-mail adresom i lozinkom na nekom od e-mail servisa (npr.

16


”GMail”,

”Hotmail”,

”Yahoo” itd.).

3.2 JQuery API

JQuery [20] je open source JavaScript knjiznica dizajnirana kako bi se pojednostavilo

manipuliranje sa HTML sadrzajem. Funkcije u JQuery-u funkcioniraju na principu

event-a i element-a. Jednostavne funkcije omogucuju klijentu vise-manje standardizi-

ran upis i programiranje dinamicno-mijenjanog sadrzaja. JQuery omogucuje razvoj-

nim programerima razvoj vlastitih funkcija, plug-ina. Time se postize niza razina

korisnicke interakcije sa web aplikacijom pomocu animiranja sucelja, dok je moguca

i napredna razina koristenjem efekata, tematskih widget-a i sl. JQuery knjiznica

se dodaje u HTML dokument unutar <head> tag-a pomocu standardnog <script>

taga. Moguce je kao izbor navesti i web adresu na kojoj se nalazi zadnja stabilna

verzija skripte.

<script type="text/javascript" src="js/jquery-1.7.2.js" charset="utf-8">

</script>

Primjer prikazuje postavljanje JQuery skripe unutar HTML dokumenta.

<script type="text/javascript">

$(document).ready(function(){

$(’button’).click( function () {

$(this).hide();

});

});

</script>

17


Primjer prikazuje JavaScript JQuery koda cija funkcionalnost je ’skrivanje’ HTML

elementa kad kliknemo na istog.

18

Poglavlje 4

Tennis Center Finder

Aplikacija je nastala razvojem aplikacije”Sports center finder”, projekt

”Web sucelje

za vodenje lokacija sportskih centara”. SCF aplikacija omogucuje upis i pretragu lo-

kacija sportskih centara bez ikakvog detaljnijeg opisa lokacije osim adresom i nazvom

centra ( Slika 4.1 ). Korisnik prilikom unosa lokacije nije bio u mogucnosti pojasniti

Slika 4.1 SCF - unos novog centra sa osnovnim podacima o centru.

o kakvom se centru radi osim u nazivu centra. Razlog tomu je ogranicenost polja

19

Poglavlje 4. Tennis Center Finder

za upis zbog cega nastao TCF. Cilj TCF aplikacije je da korisnik ima mogucnost

unosa lokacije teniskog centra ali i mogucnost odabira podloge centra kojeg upisuje

( Slika 4.2 ). Osnovne funkcionalnosti aplikacije uglavnom su ostale nepromijenjene

Slika 4.2 TCF - unos novog centra sa mogucnosti odabira podloge teniskog centra.

u odnosu na originalnu aplikaciju, a sadrzavaju istu strukturu korisnickog sucelja i

ovlasti. Dok je prilikom obrade aplikacije, fokus bio na izmjeni baze i dodavanju

mogucnosti odabira vrste teniskih podloga, dorade profila, koristenih termina na

aplikaciji i dizajna.

4.1 Baza podataka

Baza podataka aplikacije TCF je izmjenjena u odnosu na bazu podataka aplikacije

SCF u skladu sa dodanim mogucnostima. Baza podataka se sastoji od 3 osnovne

tablice:

• sportski centar - sadrzi podatke o upisanoj lokaciji centra,

• korisnici - sadrzi podatke o korisnicima,

20


• errorreport - sadrzi upisane prijave o greskama na sportskim centrima.

Dodatna tablica problemi se koristi za upis problema u kodu i nema relacije na

navedene osnovne tablice te stoga je maknuta iz opisa.

Izmjene koje se odnose na bazu su u tablici”sportski centar” zbog dodavanja

upisa tipa podloge. Time je u tablicu dodano polje”typeOfCoutr” koje sluzi za

zapis vrste podloge unesenog teniskog centra. Diagram baze podataka je prikazan

na slici 4.3 .

Slika 4.3 Relacije izmedu tablica sportski centar, korisnici, errorreport.

4.2 Funkcionalnost i dizajn

Funkcionalnost aplikacije TCF se bazira na funkcionalnostima aplikacije SCF. Do-

rade funkcionalnosti u aplikaciji su napravljene s ciljem da se aplikacija specijali-

21


zira samo za spremanje i pronalazenje lokacija teniskih centara za razliku od unosa

opcenitih lokacija kao kod SCF. Stoga su dodana mogucnost za odabir vrste podloga

teniskih centara koja je omogucuje korisniku da definira tip terena koji se nalaze

na lokaciji koju upisuje. Daljna dorada aplikacije je pokazala neke nelogicnosti koje

su morale biti ispravljene poput nedostatka mogucnosti brisanja profila i mijenjanja

e-mail adrese. Time zapocet napredak u razvoju aplikacije u odnosu na SCF. Nakon

dorade aplikacije, napravljen je redizajn izgleda aplikacije. Ideja dizajna je da se

istakne bitne komponente aplikacije a ujedno i zadrzi jednostavnost i preglednost.

Novi dizajn i mogucnost aplikacije su prikazani na Slici 4.4 .

Slika 4.4 Odabir vrste podloge prilikom pretrazivanja unesenih lokacija teniskih cen-tara.

22

Poglavlje 5

Sports Center Finder

Aplikacija je zamisljena kroz tri razine korisnickih sucelja sa pripadajucim mogucnostima:

• gost - neregistrirani korisnik sa mogucnostima:

– pregleda unesenih lokacija centara,

– registracije novog korisnickog racuna,

• registrirani korisnici sa mogucnostima:

– pregleda unesenih lokacija centara,

– upute do odabrane lokacije centra,

– ocijenjivanje unesenih lokacija centara,

– komentiranja lokacije centra,

– pregleda i izmjena osobnih komentara,

– izmjene lozinke,

– izmjene e-mail adrese,

– pregeda vlastitih unosa,

23

Poglavlje 5. Sports Center Finder

– prijave pogreski administratoru,

• i uz sve korisnikove opcije, administrator ima ovlasti za:

– adimistraciju korisnika (pregled svih korisnika sa mogucnosti aktiviranja

i deaktiviranja te slanje e-mail-a),

– administraciju centara (uredivanje i brisanje unesenih lokacija sportskih

centara),

– dodavanje aktivnosti,

– brisanje i uredivanje komentara,

– pregled i obradu korisnickih prijava na unesene lokacije sportskih centara.

5.1 Baza podataka za SCF2

Aplikacija je povezana sa MySQL relacijskom bazom podataka sa sedam tablica

pomocu PHP programskog jezika, a podaci za pristup serveru na kojem se nalazi baza

podataka se nalaze u jedinstvenom PHP dokumentu. Struktura baze podataka je

vise puta mijenjana tijekom razvoja zbog unaprijedivanja i prilagodavanja zahtjevima

aplikacije. Sukladno tome su nastale dvije tablice sa pripradjucim podacima:

• users – jedanaest polja, od kojih se sedam odnosi na osobne podatke o korisniku

a ostali informativno ili zbog programskih zahtjeva,

• sports center – sadrzi podatke o spremljenim sportskim centrima i njihove ko-

ordinate pomocu kojih se generiraju lokacije centara na Google maps kartama.

Nakon toga se javila potreba za tablicom za spremanje prijava pogreski koje korisnici

uocavaju tijekom pregledavanja lokacija centara. Tablica sadrzi podatke poput pro-

24


blema i sugestije koji su kljucni za kvalitetno azuriranje lokacija. U bazi podataka

tablica je nazvana:

• error report – sadrzi korisnicke kritike na upisane centre,

Uvodenjem unosa aktivnosti, bilo je potrebno izraditi tablicu (”activites”) u kojoj

su unesene aktivnosti i tablicu u kojoj se nalazi veza izmedu sportskog centra i

pripadajucih aktivnosti. Druga tablica (”available activities”) je izradena prema

teoriji relacijskih baza podataka gdje se javlja veza izmedu tablica”vise prema vise”

(eng. many-to-many), uvodi se tablica (u ovom slucaju available activities) u koju se

unose eksterni kljucevi povezanih redova iz obje tablice ( u ovom slucaju sports center

i activities ).

• activities – sadrzi popis aktivnosti,

• available activities – aktivnosti vezane na sportske centre,

Uvodenjem novog sustava kvalitete i rangiranja centara, koju izravno postavljaju

sami korisnici, kreirane su dvije nove tablice. Tablica koja sadrzi ocjene koje su

upisali korisnici i tablica u kojoj su spremljeni komentari. Ocjene koje se unose su

anonimne, dok komentari zbog mogucih uvrjedljivih sadrzaja su morali zadrzati upis

korisnickog imena vezanog na svaki komentar. Upisom i prikazom samo korisnickog

imena, postize se djelomicna anonimnost, cime samo aplikacija zadrzava pravo na

sankcije problematicnog korisnika.

• ratings – sadrzi ocjene koje su korisnici dodijelili centrima,

• comments – sadrzi komentare na centre koje su korisnici dodijelili.

Strukture baze i relacija medu tablicama je prikazana na slici 5.1.

25


Slika 5.1 Prikaz relacijske strukture baze podatka.

5.2 Programska rjesenja

5.2.1 Pretraga

Pretraga lokacija centara i njihova obrada su temeljni dijelovi aplikacije. Unos loka-

cija centara je alat koji ce se sa vremenom sve manje koristiti tijekom popunjenja

baze novim lokacijama centara cime ce pretraga i kvaliteta pretrazivanja dobiti puni

smisao. Kvaliteta filtriranja se postize sa jednostavnom i preglednom trazilicom sa

poljima za unos”poznatih” odnosno zeljenih vrijednosti (slika 5.2). Taj dio pretrage

26


programski je jednostavniji od ostatka aplikacije ali je najbitniji dio aplikacije zbog

svoje funkcionalnosti. Nacin na koji su poredana polja za unos olaksava korisniku

da uoci bitne segmente pomocu kojih ce se doci do zeljenog rezultata. Komunikacija

Slika 5.2 Izgled trazilice za pretragu sportskih centara u bazi aplikacije.

sa serverom se odvija putem AJAX-a cime se postize dinamika aplikacije. Povratne

informacije sa servera su u XML formatu cime je olaksana manipulacija podacima

pomocu JQuery funkcija. Ispis se u potpunosti generira dinamicki, generiranjem

HTML koda i stavljanjem u”praznu HTML ljusku“ koja je predefinirana u skripti

slider.php. Funkcija initializeSlider () je zasluzna za AJAX pozive prema serveru i

generiranje povratnih informacija u obliku staticnih slicica. Dio koda koji je zasluzan

za obradu odaziva sa servera je prikazan na slici 5.3. Funkcija addInfo () je zasluzna

za postavljanje markera na dinamicnu Google maps kartu, te prikaza osnovnih infor-

macija sa ponudenim funkcionalnostima poput uputa, komentiranja, i prijavljivanja

greski. Dio koda koji omogucuje ispis je prikazan na slici 5.4. Da bi se lakse ra-

zumjela struktura toka informacija i nacin rada pretrage, prikazan je diagram na

slici 5.5.

27


Slika 5.3 Dio funkcije initializeSlider () koji obraduje XML dokument i postavljastaticne slike lokacija centara unutar slider-a.

5.2.2 Unos novog centra

Unos novog centra je obogacen sa novim funkcionalnostima i opcijama poput:

• opisa (opcenito o lokaciji centra),

• dostupnih aktivnosti(aktivnosti koje je moguce obavljati prilikom posjete sport-

skom centru),

• provjere lokacije centra (korisnik klikom na gumb moze vidjeti da li adresa koju

28


Slika 5.4 Najbitniji dio funkcije addInfo () koji omogucuje dodavanje opisa klikomna centar.

je upisao odgovara adresi koju je pronasao google maps),

• provjere upisanih vrijednosti(ukoliko nisu upisane sve obavezne vrijednosti, ko-

risnik ne moze kliknuti na upis lokacije centra),

• unosa formatriranih zapisa u bazu (kao adresa lokacije centra se unosi adresa

koju generira google cime se smanjiva mogucnost upisa vise slicnih adresa za

istu lokaciju).

29


Slika 5.5 Prikaz nacina rada pretrage.

Novim podatcima pri upisu nove lokacije centra je postignuta sistematizacija baze i

tocnost podataka koji se upisuju u bazu. Razlog tomu je manja kolicina nepotreb-

nih gresaka koje treba ispravljati sto olaksava posao administratoru. Na primjer,

korisnik, da bi unio podatke i centar mora unijeti gotovo sve tocne podatke inace

ce upis centra biti neuspjesan, sto smanjuje broj unosa, broj zapisa i opterecenje

aplikacije sa pretragom. Kao rezultat toga je sistematizirana baza sa smanjenim

30


brojem ponavljajucih nepotrebnih unosa. Pretraga je programski ostvarena JQuery

metodama koristeci AJAX asinkrone pozive cime se postize dinamicnost aplikacije.

Sistematizacija rada je prikazana na dijagramu slika 5.6 .

Slika 5.6 Prikaz rada web aplikacije prilikom unosa novog centra.

31


5.2.3 Upute do centra

Upute su nova funkcionalnost koja treba omoguciti da aplikacija dobije puni smi-

sao kao korisnicka aplikacija. Funkcionalnost se postize uvodenjem Google maps

JavaScript API-a sa Google directions service-om. JavaScript funkcija initialize()

omogucuje inicijalizaciju map objekta i prikaza mape. Prilikom iste inicijalizacije

potrebno je dodati i postaviti parametre Google Directions service-a. Dio koda koji

to obavlja je prikazan na slici 5.7, a doslovno je predstavljen na Google Directions

service API-u. Funkcija calcRoute () s obzirom na zadani centar i upisanu polazisnu

Slika 5.7 Inicijalizacija Google Directions service-a.

adresu, izracunava put i prikazuje upute. Objasnjenje pojedinih varijabli koje se

nalazi na Slici 5.8 su:

• var start - polazisna adresa,

• var end - odabrana lokacija centra,

• var request - definiranje postavki,

• directionsDisplay.setDirections(result) - postavljanje uputa sa rezuta-

tom na mapu,

• addInfo(markedCenter) - pozivanje funkcije koja dodaje marker na mapu u

slucaju da se prikazivanje uputa ne moze izvesti.

32


Slika 5.8 Funkcija za izracun uputa.

Graficki prikaz rada rada funkcije calcRoute () je prikazan na slici 5.9

33


Slika 5.9 Graficki prikaz pozivanja i rada funkcije calcRoute ().

34

Poglavlje 6

Upute za instalaciju

U nastavku su opisani bitni koraci prilikom postavljanja aplikacije na posluzitelj. Ove

upute su identicne za obje aplikacije (TCF i SCF2). Redoslijed obavljanja instalacije

je jako bitan stoga je preporucljivo da se drzi istog. Takoder sve izmjene koje se

obavljaju, potrebno je obaviti unutar direktorija aplikacije na Vasem posluzitelju.

6.1 Priprema podataka za postavljanje na posluzitelj

Podatke je, ukoliko su komprimirani u nekom obliku, otpakirati i kopirati u web

direktorij na vasem posluzitelju ne mijenjauci nazive direktorija ili nazive da-

toteka. Ukoliko niste sigurni koji je direktorij na Vasem posluzitelju web direktorij,

konzultirajte se sa administratorom odnosno sa odgovarajucom dokumentacijom.

Neki od najcesce koristenih naziva su:

• www - na bazi Windows posluzitelja,

• htdocs - na abzi linux posluzitelja.

35

Poglavlje 6. Upute za instalaciju

6.2 Postavljanje baze podataka

Baza podataka se nalazi unutar direktorija u kojem su podaci cijele aplikacije u

direktoriju pod nazivom”baza”. Unutar direktorija se nalaze dvije datoteke:

• baza.sql,

• tablice.sql.

Ukoliko trebate cijelu bazu podataka, unijeti treba datoteku baza.sql odnosno ako

vec imate bazu podataka unijeti treba tablice.sql.

6.2.1 Postavke za spajanje sa bazom

Unutar direktorija aplikacije se nalazi datoteka dbConnect.php koju je potrebno otvo-

riti u bilo kojem text editoru i popuniti sa podacima vaseg posluzitelja.

$username = "korisnicko_ime";

$password = "lozinka";

$hostname = "adresa_posluzitelja";

Ukoliko ste mijenjali naziv baze podataka, potrebno je i promijeniti naziv baze u

ime vase baze podataka (Mijenjanje naziva baze podataka nije preporucljivo jer su

moguci problemi sa prepoznavanjem tablica baze podatka.).

$db_selected = mysql_select_db("naziv_baze_podataka",$connection)

or die(mysql_error());

Napomena! Nazivi tablica kao i nazivi stupaca trebaju ostati nepromijenjeni. Sa

promijenjenim nazivima tablica i stupaca, aplikacija nece ispravno raditi.

36


6.3 Postavke za slanje mail-a

Unutar direktoija aplikacije nalazi se datoteka mailSend.php. Istu je potrebno otvoriti

sa text editorom i izmijeniti sljedece vrijednosti:

• protokol za autentifikaciju (npr. ssl),

• smtp.server.domena (npr. smtp.gmail.com),

• SMTP PORT (npr. 465),

• [email protected] - e-mail adresa,

• lozinka - odgovarajuca lozinka,

$mail->SMTPSecure = "protokol_za_autentifikaciju";

$mail->Host = "smtp.server.domena";

$mail->Port = SMTP_PORT;

$mail->Username = "[email protected]";

$mail->Password = "lozinka";

$mail->SMTPKeepAlive = true;

$mail->From = "[email protected]";

$mail->FromName = "Administrator";

Da bi se e-mail mogao poslati, potrebno je i omoguciti ekstenzije protokola za

autentifikaciju. Ukoliko se koristi ssl protokol, potrebno je omoguciti ekstenziju:

extension=php_openssl.dll

37


6.4 Pocetak koristenja aplikacije

Kao administrator aplikacije, vase korisnicko ime je”admin” a lozinka

”admin1”. S

tim podacima se mozete logirati u korisnicko sucelje i obavljati sve administrativne

poslove. Preporuca se da odmah po prvoj prijavi u korisnicko sucelje izmjenite e-mail

adresu i lozinku te korisnicke podatke.

38

Poglavlje 7

Primjer koristenja

Primjer koristenja aplikacije ce prikazati tipicne situacije u kojima ce se naci ko-

risnik i admin. Korisnik koji se registrirao moze pristupiti korisnickom sucelju u

kojem ima pristup komentiranju, ocijenjivanju, uputama do centra i prijavi pogreski

administratoru. Prijavom korisnika i njegovim djelovanjem prilikom koristenja apli-

kacije administrator ima uvid sve njegove upise novih lokacija centara i komentare

sto administratoru omogucuje da ispravlja i uklanja pogreske, a ako je to potrebno,

deaktivira korisnika!

7.1 Primjer korisnickog sucelja

Korisnik prilikom prijave nailazi na sucelje kao na Slici 7.1. Ukoliko zeli pretrazivati

centre, korisnik mora upisati vrijednosti u trazilicu na lijevoj strani. Korisnik je

odlucio pretrazivati grad Rijeku u kojem odabire centar Cosmo Gym izmedu ponudenih

centara (Slika 7.2). Prikazani centar se nalazi nedaleko od centra Rijeke zbog cega

korisnik zeli vidjeti kojim putem moze doci do odabrane lokacije. Korisnik to moze

napraviti klikom na gumb”Kako do centra” (Slika 7.3) i upisom adrese polaska i

39

Poglavlje 7. Primjer koristenja

Slika 7.1 Izgled korisnickog sucelja prilikom prijave na racun.

Slika 7.2 Odabir lokacije centra”Cosmo Gym”.

klikom na gumb”Uputi me”(Slika 7.4) mu se prikazuju upute (Slika 7.5). Korisnik

smatra da je opis centra nepotpun i odluci prijaviti pogresku. To ce uciniti kli-

kom na gumb”Prijava” (Slika 7.6 ) i odabirom polja koja mu se cine nepotpunima

40


Slika 7.3 Gumb kojim se mogu zatraziti upute do centra.

Slika 7.4 Upis adrese polaska.

upisivanjem kratkog prijedloga (Slika 7.7).

41


Slika 7.5 Prikaz uputa od adrese polaska”Korzo 1, Rijeka” do lokacije centra

”Cosmo

Gym”.

Slika 7.6 Gumb za prijavu pogreski.

42


Slika 7.7 Popunjavanje obrazca za prijavu pogreske.

43


7.2 Primjer administracije centara

Administrator prilikom prijavve na administratorsko sucelje pregledava prijavljene

pogreske (Slika 7.8) i primjecuje prijavljenu pogresku centra”Cosmo gym”. Admi-

Slika 7.8 Pregled prijavljenih pogreski.

nistrator ce odluciti da li je korisnik u pravu ili ne, odnosno u ovom slucaju admi-

nistrator daje pravo korisniku i odluci promijeniti opis centra (Slika 7.9). Nakon

izmjene, adminnistrator zahvaljuje korisniku putem e-mail mogucnosti (Slika 7.10).

44


Slika 7.9 Administrator izmjenjuje prijavljene vrijednosti.

Slika 7.10 Administrator pise e-mail poruku korisniku koji je prijavio pogresku.

45

Poglavlje 8

Zakljucak

Aplikacija za vodenje lokacija sportskih centar-a je hibridna aplikacija, ostvarena

na nacin da se oslanja na Google Maps API, koji upotpunjava vecinu njenih funk-

cionalnosti. Uz stalno napredovanje Google Maps-a, aplikacija se moze razvijati

i nadogradivati doslovno svakodnevno. U periodu od pocetka razvoja prve verzije

aplikacije do sad, Google je razvio novu verziju Google Maps API-a, pokrenuo Google

Developers [17] koji donosi sucelje Google Developers Console koje je vrlo korisno

pri pracenju i planiranju sljedeceg koraka razvoja. Aplikacija je razvijena u tolikoj

mjeri da zadovolji trziste i odreden broj korisnika. Za daljni razvoj svakako ima

mjesta. Ali da bi aplikacija radila u punom sjaju i da ne bi bilo nepotrebnih rusenja,

potreban je relativno brz posluzitelj na kojem ce biti postavljena. Razlog tomu je

intezivna komunikacija sa serverom, koja je uz koristenje XML-a i JSON-a ubrzana

maksimalno, ali ipak ne dovoljno da se bori sa slabijim internetskim vezama i sporim

posluziteljom.

46

Bibliografija

[1] W3Schools PHP Tutorial. Dostupno na: http://www.w3schools.com/php/

[2] W3Schools MySQL Tutorial. Dostupno na: http://www.w3schools.com/sql/

[3] W3Schools JavaScript Tutorial. Dostupno na: http://www.w3schools.com/js/

[4] W3Schools AJAX Tutorial. Dostupno na: http://www.w3schools.com/ajax/

[5] W3Schools HTML Tutorial. Dostupno na: http://www.w3schools.com/html/

[6] W3Schools CSS Tutorial. Dostupno na: http://www.w3schools.com/css/

[7] W3Schools XML Tutorial. Dostupno na: http://www.w3schools.com/xml/

[8] W3Schools JSON Tutorial. Dostupno na: http://www.w3schools.com/json/

[9] NetBeans sluzbena stranica. Dostupno na: http://netbeans.org/

[10] Wamp server sluzbena stranica. Dostupno na:http://www.wampserver.com/en/

[11] Mysql workbench sluzbena stranica. Dostupno na:http://www.mysql.com/products/workbench/

[12] Google Chrome sluzbena stranica. Dostupno na: ht-tps://www.google.com/chrome

[13] Mozilla Firefox sluzbena stranica. Dostupno na: http://www.mozilla.org/en-US/firefox/new/

[14] Microsoft internet explorer sluzbena stranica. Dostupno na:http://windows.microsoft.com/en-US/internet-explorer/products/ie/home

47

Bibliografija

[15] Miran Brajsa, Seminarski rad iz racunalne ergonomije”AJAX tehnologija”,

Sveuciliste u Zagrebu - Fakultet elektotehnike i racunarstva

[16] Wikipedia - Aplication programming interface. Dostupno na:http://en.wikipedia.org/wiki/Application programming interface

[17] Google developers sluzbene stranice. Dostupno na: ht-tps://developers.google.com/

[18] Wikipedia - Geocodeing. Dostupno na: http://en.wikipedia.org/wiki/Geocoding

[19] Google code - PhpMailer. Dostupno na: https://code.google.com/a/apache-extras.org/p/phpmailer/wiki/PHPMailer?tm=6

[20] JQuery sluzbena stranica. Dostupno na: http://jquery.com/

48

Documents

TEHNICKI FAKULTET - bib.irb.hr · MySQL i PHP su osvojili veliki dio tr zi sta jer su open source. Relacijski sustavi za pohranu podataka kao sto je MySQL sve podatke pohranjuju unutar