54
SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET Preddiplomski sveučilišni studij računarstva Završni rad RENT WEB APLIKACIJA ZA EVALUACIJU SUDIONIKA NA TRŽIŠTU NEKRETNINA Rijeka, rujan 2014. Luka Batistić 0069054562

SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

  • Upload
    others

  • View
    6

  • Download
    0

Embed Size (px)

Citation preview

Page 1: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

SVEUČILIŠTE U RIJECI

TEHNIČKI FAKULTET

Preddiplomski sveučilišni studij računarstva

Završni rad

RENT WEB APLIKACIJA ZA EVALUACIJU SUDIONIKA NA

TRŽIŠTU NEKRETNINA

Rijeka, rujan 2014. Luka Batistić

0069054562

Page 2: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

SVEUČILIŠTE U RIJECI

TEHNIČKI FAKULTET

Preddiplomski sveučilišni studij računarstva

Završni rad

RENT WEB APLIKACIJA ZA EVALUACIJU SUDIONIKA NA

TRŽIŠTU NEKRETNINA

Mentor: izv.prof.dr.sc. Miroslav Joler

Rijeka, rujan 2014. Luka Batistić

0069054562

Page 3: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama
Page 4: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama
Page 5: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

Sadržaj

1. Uvod ............................................................................................................................................ 7

2. Zadatak i zahtjevi ........................................................................................................................ 8

3. Prijašnje stanje aplikacije i potrebne promjene .......................................................................... 9

3.1. Prijašnje stanje aplikacije ..................................................................................................... 9

3.1.1 Uloge .............................................................................................................................. 9

3.1.2 Početna stranica .............................................................................................................. 9

3.1.3 Slanje e-maila ................................................................................................................. 9

3.1.4 Pretraga korisnika ......................................................................................................... 10

3.1.5 Dodavanje novih pitanja u ankete ................................................................................ 10

3.1.6 Profil korisnika i uređivanje profila korisnika .............................................................. 11

3.1.7 Ocjenjivanje korisnika i pregled ocjena ....................................................................... 11

3.1.8 Logout ........................................................................................................................... 11

3.2 Prijašnje stanje baze podataka ............................................................................................. 12

4. Alati i tehnologije izrade ........................................................................................................... 14

4.1 Tehnologije.......................................................................................................................... 14

4.2 Alati ..................................................................................................................................... 15

5. Implementacija i rješenje zahtjeva ............................................................................................ 16

5.1 Baza podataka i entiteti ....................................................................................................... 16

5.1.1 Korisnički računi ......................................................................................................... 17

5.1.2 Administratori ............................................................................................................... 18

5.1.3 Vlastiti odgovori najmodavac i vlastiti odgovori najmoprimac ................................... 18

5.1.4 Komentari najmodavac i komentari najmoprimac ....................................................... 19

5.1.5 Ocjene najmodavac i ocjene najmoprimac ................................................................... 19

5.1.6 Pitanja najmodavac i pitanja najmoprimac ................................................................... 20

5.1.7 Poruke administratorima ............................................................................................... 21

5.1.8 Poruke korisnicima ....................................................................................................... 21

5.1.9 Prijavljeni korisnici....................................................................................................... 22

5.2 Aplikacija ............................................................................................................................ 22

5.2.1 Uređivanje anketnih obrazaca ...................................................................................... 22

5.2.2 Brisanje pitanja ............................................................................................................. 24

5.2.3 Validacije podataka ...................................................................................................... 25

Page 6: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

5.2.4 Kreiranje profila za treću osobu ................................................................................... 26

5.2.6 Prijava nedoličnog ponašanja ....................................................................................... 27

5.2.7 Mjere protiv nedoličnog ponašanja .............................................................................. 28

5.2.8 Obavještavanje korisnika o blokadi ili evaluaciji ......................................................... 29

5.2.9 Komunikacije između korisnika ................................................................................... 30

5.2.10 Komunikacija administrator-korisnik ......................................................................... 30

5.2.11 Obavijesti .................................................................................................................... 31

6. Instalacija i pokretanje aplikacije.............................................................................................. 33

7. Primjeri rada i korištenja aplikacije .......................................................................................... 34

7.1 Početna stranica ................................................................................................................... 34

7.1.1 Oporavak lozinke .......................................................................................................... 35

7.1.2 Kontakt administratora ................................................................................................. 35

7.1.3 Registracija ................................................................................................................... 36

7.1.4 Prijava ........................................................................................................................... 36

7.2 Admin panel ........................................................................................................................ 37

7.2.1 Pitanja i odgovori.......................................................................................................... 38

7.2.2 Poruke ........................................................................................................................... 42

7.2.3 Prijavljeni komentari .................................................................................................... 43

7.2.4 Prijavljeni korisnici....................................................................................................... 44

7.3 Pretraga................................................................................................................................ 45

7.4 Vlastiti profil ....................................................................................................................... 46

7.5 Profil ostalih korisnika ........................................................................................................ 48

7.6 Validacije ............................................................................................................................ 49

7.7 Obavijesti ............................................................................................................................ 50

8. Zaključak................................................................................................................................... 51

Literatura ....................................................................................................................................... 52

Prilozi ............................................................................................................................................ 53

Page 7: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

7

1. Uvod

Cilj ovog projekta je usavršavanje, dorada te dodavanje novih mogućnosti na web aplikaciju

„Rent web aplikacija za evaluaciju sudionika na tržištu najma nekretnina“.

Web aplikacija [1] je aplikacijski software koji se pokreće u internet pretraživaču, a sadrži

jednu ili više web stranica koje omogućuju interakciju korisnika. Obično se sastoji od samog

programa (engl. software) i baze podataka.

„Rent web aplikacija za evaluaciju sudionika na tržištu najma nekretninama“ je osmišljena

kao aplikacija koja će pomoći osobama koje se bave najmom nekretnina (kako najmoprimcima

tako i najmodavcima) da dobiju više informacija o ostalim sudionicima na tržištu. Tako se, uz

pomoć aplikacije, sudionici na tržištu mogu međusobno evaluirati te pregledavati dosadašnje

evaluacije koje je netko napisao za njih ili ostale sudionike. Na primjer: najmodavac, prije nego

što iznajmi određenom najmoprimcu stan, može pogledati kakve su ocjene i komentare ostavili

najmodavci od kojih je taj najmoprimac prije iznajmljivao stan.

Za izradu projekta korišteno je znanje stečeno na kolegijima „Razvoj web aplikacija“ i

„Izborni projekt – Razvoj web aplikacija“ te znanje stečeno istražujući i razvijajući vlastite web

aplikacije.

Page 8: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

8

2. Zadatak i zahtjevi

Zadatak za ovaj završni rad je bio razviti web sučelja i bazu podataka na način da

poboljša aplikaciju evaluacije sudionika na tržištu najma nekretnina preko sljedećih stavki:

Fleksibilizacija anketnih obrazaca

Omogućiti uređivanje anketnih obrazaca (pitanja)

Omogućiti brisanje pitanja iz anketnih obrazaca

Pohrana ispravnih podataka nakon promjene anketnog obrasca

Validacija unošenja ispravnih podataka u obrasce

Kreiranje profila za treću osobu za koju želimo omogućiti evaluacije, a koja ne

može ili ne želi sama napraviti korisnički račun na stranici

Administratorima omogućiti blokiranje nedoličnih korisnika

Administratorima omogućiti brisanje nedoličnih komentara

Korisnicima omogućiti prijavu nedoličnog ponašanja

Korisnicima omogućiti informacije (obavijest) o njihovoj evaluaciji ili blokadi

Korisnicima omogućiti komunikaciju sa ostalim korisnicima

Omogućiti započinjanje komunikacije administrator-korisnik sa web sučelja

Implementirati obavijesti (engl. notifications)

Page 9: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

9

3. Prijašnje stanje aplikacije i potrebne promjene

Ovo poglavlje ukratko opisuje stanje web aplikacije i baze podataka prije dodatnog

razvoja i unesenih promjena u sklopu ovog završnog rada.

3.1. Prijašnje stanje aplikacije

3.1.1 Uloge

Postojeće uloge u web aplikaciji su:

Administratori – mogu dodavati nova pitanja u ankete, odgovarati na upite korisnika,

pregledavati ocjene i pretraživati korisnike (ostali korisnici ih ne vide).

Registrirani Korisnici – mogu se logirati na stranicu, pretraživati druge korisnike,

evaluirati druge korisnike, kontaktirati administratore. Dijele se na „Najmoprimce“,

„Najmodavce“ i „Oboje“(i najmoprimac i najmodavac) .

Neregistrirani korisnici – mogu vidjeti početnu stranicu, registrirati se, kontaktirati

administratore stranice.

3.1.2 Početna stranica

Početna stranica index.php služi za login, kreiranje novog korisničkog računa ili kontakt

administratora

3.1.3 Slanje e-maila

Slanje e-maila je implementirano kroz alat phpmailer te skripte mail.php i

mail_config.php, koristi se za potvrdu registracije korisničkog računa, za odgovore

administratora na korisničke upite te za promjenu lozinke korisničkog računa.

Page 10: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

10

3.1.4 Pretraga korisnika

Opcija pretrage korisnika sastoji se od upisivanja ključnih pojmova u tekstualna polja

(npr. Ime i Prezime) te skripte za pretragu korisničkih računa i pronalaženje podudarnih

vrijednosti sa unesenim pojmovima. Nakon što se izlistaju sve vrijednosti koje se podudaraju,

možemo odabrati korisnika na čiji profil želimo ići. Implementirano uz pomoć skripte

pretraga.php.

3.1.5 Dodavanje novih pitanja u ankete

Administratori imaju opciju dodavanja novih pitanja u anketne obrasce za najmoprimca i

najmodavca u skripti pitanja-odgovori.php.

Odgovori na pitanja mogu biti tri različita tipa:

da/ne

višestruki odabir- gdje administrator upisuje koji odabiri će biti ponuđeni

ocjenjivanje- gdje administrator upisuje minimum, maksimum i korak

ocjene

Ukoliko je odgovor na pitanje tipa „da/ne“ otvara se mogućnost unošenja podpitanja koje

isto može biti jednog od navedena tri tipa.

Page 11: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

11

3.1.6 Profil korisnika i uređivanje profila korisnika

Kada korisnik pregledava vlastiti profil, može odabrati nekoliko opcija:

Uredi profil: za promjenu podataka o korisničkom računu (OIB, JMBG,

Grad, adresa, telefon)

Postavke računa: za promjenu e-maila, lozinke ili uloge

Pogledaj ocjene: za pregled svojih ocjena

Kontaktiraj nas: za kontakt sa administratorom

Kada korisnik pregledava tuđi profil može odabrati neku od opcija:

Ocijeni: za ocjenjivanje pregledavanog korisnika

Pogledaj ocjene: za pregled ocjena pregledavanog korisnika

(detaljnije opisano niže u poglavlju 3.1.7)

3.1.7 Ocjenjivanje korisnika i pregled ocjena

Kada smo na profilu drugog korisnika, imamo opciju da ga ocijenimo ili pogledamo

njegove dosadašnje ocjene. Najmoprimci mogu ocjenjivati jedino najmodavce (i obratno), a

ulogu „Oboje“ može ocjenjivati bilo tko (i ta uloga može ocjenjivati bilo koga). Implementirano

uz pomoć skripte ocjeni.php.

3.1.8 Logout

Logout se koristi za završetak rada na stranici, implementiran je uz pomoć skripte

logout.php

Page 12: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

12

3.2 Prijašnje stanje baze podataka

Baza podataka se sastoji od jedanaest entiteta (na slici 1 možemo vidjeti Entity-

Relationship dijagram):

accounts - korisnički računi

ocjene_najmodavac – ocjene kojima su ocijenjeni najmodavci

ocjene_najmoprimac

pitanja_najmodavac – pitanja za evaluaciju najmodavaca

pitanja_najmoprimac

custom_odg_najmodavac – odgovori na pitanja tipa višestrukog odabira za

najmodavca

custom_odg_najmoprimac

admins – korisnički računi administratora

poruke – poruke poslane administratorima

komentari_najmodavac – komentari u evaluaciji za najmodavca

komentari_najmoprimac

Page 13: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

13

Slika 1: Entity-Relationship dijagram [2], prijašnje stanje baze podataka

Page 14: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

14

4. Alati i tehnologije izrade

4.1 Tehnologije

Za potrebe završnog rada korištene su sljedeće tehnologije:

„PHP Hypertext Preprocessor“ (PHP) [3], poslužiteljski skriptni jezik koji se koristi za

izradu web aplikacija. Lako se kombinira sa HTML kodom i služi za dinamičko generiranje

stranica. Kada korisnik odabere određenu opciju za prikaz na stranici, PHP skripta na

poslužitelju napravi određeni zadatak te se korisniku na njegov web preglednik vraća samo

HTML kod izgeneriran na poslužitelju uz pomoć PHP-a. Krajnji korisnici nemaju uvid u PHP

dio web aplikacija.

„HyperText Markup Language“ (HTML) [4] je markup jezik za opisivanje i kreiranje

web stranica. On sačinjava osnovnu strukturu i dizajn svih internet stranica. Sastoji se od oznaka

(engl. tags) koje služe kako bi se označili, razlikovali i time oblikovali dijelovi stranice koju web

preglednik otvara. Web preglednik ne prikazuje sam HTML i njegove tagove nego ih koristi

kako bi prikazao pravi sadržaj stranice. Uz pomoć HTML-a se mogu prikazati razni sadržaju

poput slika, tekstova, videa, poveznica (engl. link), tablica ili čak formulara (engl. form) sa

kojima korisnik može vršiti interakciju, uz pomoć PHP-a, kao što je opisano iznad.

„Cascading Style Sheets“ (CSS)[5] je jezik koji se koristi za dizajn i izgled web stranica

pisanih u HTML-u. Budući da HTML ima ograničene sposobnosti oblikovanja stranica, gotovo

je nemoguće napraviti web stranicu bez korištenja CSS-a. Uz pomoć CSS-a se odvaja sadržaj

stranice od izgleda stranice te je jedan sadržaj stranice moguće prikazati u neograničeno mnogo

različitih izgleda. Postoje tri različita korištenja CSS-a „External“, „Embeded“ i „Inline“.

„MySQL“[6] (engl. SQL- Structured Query Language), sistem za upravljanje

relacijskim bazama podataka. Baza podataka za ovaj rad je napravljena u MySQL-u iz razloga

što se MySQL vrlo jednostavno implementira sa PHP-om i imaju jako dobro razrađenu i

jednostavnu komunikaciju između naredbi. U MySQL-u se podaci sortiraju u tablice, svaki redak

u tablici je jedan zapis, a svaki stupac u tablici je atribut tog zapisa.

Page 15: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

15

„JavaScript“[7] je dinamični programski jezik koji se koristi za web stranice,

kompjuterske programe, programe za pametne telefone, tablete, laptope te razne uređaje. Najširu

primjenu našao je upravo u web stranicama iz razloga što dopušta kreiranje skripti (malih

programa) koji će se odrađivati kod korisnika te time smanjuje posao poslužitelju. Uz pomoć tih

skripti može kontrolirati rad internet pretraživača, vršiti interakciju sa korisnikom, i mijenjati

dokumente koji su prikazani (bez da se ponovno šalje zahtjev na poslužitelja). U ovom projektu

je tehnologija JavaScript-a pretežno korištena za validacije, provjere te dinamičko mijenjanje

obrazaca bez da se stranica ponovno učitava.

4.2 Alati

Za potrebe završnog rada korišteni su sljedeći alati:

„WAMPServer“[8], okruženje za razvoj web stranica na Windows operacijskom sustavu

bazirano na Apache-u, PHP-u i MySQL-u. Omogućuje kreiranje web stranica u PHP-u i

MySQL, a budući da su to tehnologije koje su se koristile za izradu ovog projekta te je

preuzimanje programa besplatno, za projekt je korišten WAMPServer. Kada se ova web

aplikacija bude pokretala, preporuka je da se to izvrši uz pomoć WAMPServera jer je na njemu

rađena i testirana te se vrti optimalno. Spomenuti alat također sadržava i alat PhpMyAdmin.

„PhpMyAdmin“[9], program napisan u PHP-u, a koristi se za laganu i brzu

administraciju MySQLa (baza podataka) preko web stranice.

„Notepad++“[10] je besplatan uređivač (engl. editor) izvornog koda koji podržava

nekoliko jezika. Podržava rad u kraticama (engl. tabs) što uvelike olakšava kreiranje web

stranica iz razloga što često razne PHP datoteke komuniciraju međusobno te je potrebno

višestruko prebacivanje sa jedne datoteke na drugu kako bi se povezale i kako bi se omogućila

njihova komunikacija. Notepad++ je također besplatan za preuzimanje.

„Mozilla Firefox“[11] i „Google Chrome“[12] su internet pretraživači u kojima je

testirana i pokretana web aplikacija.

„draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow).

Korišten je za izradu ER-dijagrama.

Page 16: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

16

5. Implementacija i rješenje zahtjeva

5.1 Baza podataka i entiteti

U bazi podataka su upisani svi podaci sa kojima web aplikacija radi. Kroz razvoj web

aplikacije bilo je potrebno promijeniti bazu podataka u više navrata. Zbog dodavanja nekih

funkcionalnosti bilo je potrebno mijenjati već postojeće entitete (dodavati atribute u njih) ili

dodavati nove entitete. U ovom poglavlju je u potpunosti opisana nova verzija baze podataka

potrebna za rad web aplikacije. Baza podataka se sastoji od 13 entiteta. Na slici 2 vidimo Entity-

Relationship dijagram nove verzije baze podataka.

Slika 2: Entity-Relationship dijagram nove baze podataka

Page 17: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

17

5.1.1 Korisnički računi

Korisnički računi ( tablica: accounts). U ovu tablicu se upisuju svi podaci o računima

korisnika. Sastoji se od atributa (polja označena zvjezdicom su obavezna za unos pri

registraciji):

id: primarni ključ i jedinstveni identifikator korisničkog računa. Atribut se

automatski dodaje u bazu podataka pri kreiranju korisničkog računa.

username: korisničko ime računa. *

password: zaporka za pristup stranici*

ime: ime korisnika*

prezime: prezime korisnika*

email: e-mail korisnika, koristi se za komunikaciju i aktivaciju korisničkog

računa*

jmbg: jmbg korisnika- pri registraciji se upisuje ili jmbg ili oib, nije

potrebno upisati obje stavke.*

oib: oib korisnika

uloga: uloga korisnika na stranici- može imati vrijednost 'p','d' ili 'o'

(najmoprimac/najmodavac/oboje)*

kod: kod koji se koristi za registraciju. Korisniku se prilikom registracije

upisuje kod u ovo polje te mu se isti kod šalje na e-mail, kada korisnik

aktivira račun ovaj atribut prima vrijednost 0

grad: grad u kojem je korisnik- ovo polje nije obavezno za unos

adresa: adresa korisnika- ovo polje nije obavezno za unos

tel: telefonski broj korisnika- ovo polje nije obavezno za unos

status: ukoliko je korisniku blokiran pristup stranici, ovaj atribut će imati

vrijednost 1, ukoliko mu je pristup slobodan, imati će vrijednost 0

dat_zabrane: datum zabrane pristupa stranici (ukoliko postoji)

dat_isteka_zabrane: datum isteka zabrane pristupa stranici (ukoliko

postoji)

Page 18: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

18

5.1.2 Administratori

Administratorski računi se mogu kreirati jedino kroz sučelje PhpMyAdmin.

Administratori (tablica: admins). U ovu tablicu se upisuju svi podaci o administratorima

na web stranici. Sastoji se od atributa:

id: primarni ključ i jedinstveni identifikator administratorskog računa.

Atribut se automatski dodaje od strane servera pri kreiranju

administratorskog računa

username: Korisničko ime administratora

password: zaporka administratora

5.1.3 Vlastiti odgovori najmodavac i vlastiti odgovori najmoprimac

Vlastiti odgovori (tablice: custom_odg_najmodavac i custom_odg_ najmoprimac). U ove

tablice se upisuju svi vlastiti odgovori na pitanja koja su tipa „višestruki odabir“. Najmoprimci i

najmodavci imaju odvojene tablice za tu svrhu. Sastoje se od atributa:

id: primarni ključ i jedinstveni identifikator odgovora . Atribut se

automatski dodaje od strane servera pri kreiranju odgovora

odgovor: kako glasi odgovor

id_pitanja: strani ključ, id pitanja na koje je upisana vrijednost u atributu

„odgovor“ odgovor. Vrijednost se upisuje uz pomoć aplikacije- korisnik

ne unosi.

Page 19: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

19

5.1.4 Komentari najmodavac i komentari najmoprimac

Komentari (tablice: komentari_najmodavac i komentari_najmoprimac). U ove tablice se

upisuju komentari koje su ostavljeni za korisnike prilikom njihove evaluacije. Najmoprimci i

najmodavci imaju odvojene tablice za tu svrhu. Sastoje se od atributa:

id: primarni ključ i jedinstveni identifikator komentara. Atribut se

automatski dodaje od strane servera pri kreiranju komentara

from_id: strani ključ, id korisnika koji je napisao komentar. Vrijednost se

upisuje uz pomoć aplikacije- korisnik ne unosi.

to_id: strani ključ, id korisnika za koga je komentar napisan. Vrijednost se

upisuje uz pomoć aplikacije- korisnik ne unosi.

datum: datum kada je komentar napisan. Vrijednost se upisuje uz pomoć

aplikacije- korisnik ne unosi.

komentar: komentar koji korisnik želi ostaviti za nekoga

prijava: status prijave (ukoliko je komentar prijavljen); '0' ako nije, '1' ako

je.

prijava_od: id korisnika koji je prijavio komentar. Vrijednost se upisuje uz

pomoć aplikacije- korisnik ne unosi.

5.1.5 Ocjene najmodavac i ocjene najmoprimac

Ocjene (tablice: ocjene_najmodavac i ocjene_najmoprimac). U ovu tablicu se upisuju

ocjene za korisnike. Najmoprimci i najmodavci imaju odvojene tablice za tu svrhu. Sastoje se od

atributa:

user_id: strani ključ, id korisnika koji je ocijenjen

q_id: strani ključ, id pitanja na koje za koje važi ocjena

atr1: ovisno o vrsti pitanja atribut „atr1“ može imati različitu vrijednost

kao što je navedeno u tablici 1.

atr2: ovisno o vrsti pitanja atribut „atr2“ može imati različitu vrijednost

kao što je navedeno u tablici 1.

Page 20: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

20

Tablica 1: Vrijednosti „atr1“ i „atr2“

Vrsta pitanja atr1 atr2

Da/ne Broj odgovora da Broj odgovora ne

Ocjenjivanje Zbroj ocjena za pitanje Broj korisnika koji su

odgovorili na pitanje

Višestruki odabir ID vlastitog odgovora Broj glasova za odgovor

5.1.6 Pitanja najmodavac i pitanja najmoprimac

Pitanja (tablice: pitanja_najmodavac i pitanja_najmoprimac). U ovu tablicu se upisuju

pitanja koja se koriste u obrascima za evaluaciju. U pitanja_najmodavac se upisuju pitanja za

najmodavca, a u pitanja_najmoprimac za najmoprimca. Sastoje se od atributa:

id: primarni ključ i jedinstveni identifikator pitanja. Atribut se automatski

dodaje od strane servera pri kreiranju pitanja

pitanje: kako glasi pitanje, unosi ga administrator pri ispunjavanju obrasca

tip: koji je tip pitanja, unosi ga administrator pri ispunjavanju obrasca,

može biti 0(da/ne), 1(ocjenjivanje) ili 2(vlastiti odgovor)

okidac: ukoliko je pitanje da/ne, koja vrijednost je okidač. Unosi

administrator pri ispunjavanju obrasca

jePodpitanje: ukoliko je pitanje podpitanje na neko drugo pitanje ovdje će

biti postavljena vrijednost 1

min: ukoliko je pitanje tipa ocjenjivanje, „min“ prima minimalnu

vrijednost ocjene

max: ukoliko je pitanje tipa ocjenjivanje, „max“ prima maksimalnu

vrijednost ocjene

korak: ukoliko je pitanje tipa ocjenjivanje, „korak“ prima korak po kojem

se ocjena dijeli između „min“ i „max“

Page 21: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

21

5.1.7 Poruke administratorima

Poruke administratorima (tablica: poruke). U ovu tablicu se upisuju poruke koje su

korisnici poslali administratorima. Sastoji se od atributa:

id: primarni ključ i jedinstveni identifikator poruke. Atribut se automatski

dodaje od strane servera pri kreiranju poruke

od_koga: strani ključ, sadržava id osobe koja je poslala poruku. Vrijednost

se upisuje uz pomoć aplikacije- korisnik ne unosi.

naslov: sadržava naslov poruke koju je poslao korisnik

sadrzaj: sadržaj poruke koju je poslao korisnik

datum: datum kada je poruka poslana

procitano: ukoliko ovaj atribut ima vrijednost '0' administrator je pročitao

poruku, ukoliko ima vrijednost '1' administrator nije pročitao poruku

5.1.8 Poruke korisnicima

Poruke korisnicima (tablica poruke_korisnici). U ovu tablicu se zapisuju poruke koju su

korisnici međusobno slali jedni drugima. Sastoji se od atributa:

id: primarni ključ i jedinstveni identifikator poruke. Atribut se automatski

dodaje od strane servera pri kreiranju poruke

od_koga: strani ključ, id korisnika koji je poslao poruku. Vrijednost se

upisuje uz pomoć aplikacije- korisnik ne unosi.

za_koga: strani ključ, id korisnika za koga je poruka poslana. Vrijednost

se upisuje uz pomoć aplikacije- korisnik ne unosi.

naslov: naslov poruke koju je poslao korisnik

sadrzaj: sadržaj poruke koju je poslao korisnik

datum: datum kada je poruka poslana

procitano: ukoliko ovaj atribut ima vrijednost '0' korisnik je pročitao

poruku, ukoliko ima vrijednost '1' korisnik nije pročitao poruku

Page 22: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

22

5.1.9 Prijavljeni korisnici

Prijavljeni korisnici (tablica prijavljeni_korisnici). U ovu tablicu se upisuju korisnici koje

je netko prijavio zbog nedoličnog ponašanja. Sastoji se od atributa:

id: primarni ključ i jedinstveni identifikator prijave. Atribut se automatski

dodaje od strane servera pri kreiranju poruke

id_prijavljenog: strani ključ, id korisnika koji je prijavljen. Vrijednost se

upisuje uz pomoć aplikacije- korisnik ne unosi.

id_podnositelja: strani ključ, id korisnika koji prijavljuje. Vrijednost se

upisuje uz pomoć aplikacije- korisnik ne unosi.

komentar: korisnik upisuje komentar i razlog zašto je prijavio određenu

osobu.

5.2 Aplikacija

Poglavlje 5.2 opisuje razvoj, promjene i poboljšanja koja su uvedena u web aplikaciju za

evaluaciju sudionika na tržištu najma nekretnina u sklopu ovog završnog rada.

5.2.1 Uređivanje anketnih obrazaca

Kako bi se postigla fleksibilizacija anketnih obrazaca, dodane su opcije uređivanja i

brisanja anketnih pitanja iz baze podataka.

Uređivanje anketnih obrazaca je implementirano kroz skripte pitanja-odgovori.php i

uredi-pitanje.php

Dio koda u skripti pitanja-odgovori.php zadužen je za uređivanje pitanja (i njegovog

podpitanja, ukoliko postoji) nakon što smo na određenom pitanju, na stranici „Admin panel –

pitanja i odgovori“, stisnuli tipku „Uredi pitanje!“ (na administratorskom sučelju „Pitanja i

odgovori“). Kada stisnemo navedenu tipku, skripta se ponovno učitava te se vrijednost „akcija“

postavi u „edit“, kao što vidimo iz programskom koda 1.

Page 23: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

23

Vrijednost „akcije“ se u skripti hvata putem GET metode. Metoda GET određenu

vrijednost, u ovom slučaju vrijednost „akcije“, preko URL-a (engl. Uniform resource locator)

šalje poslužitelju. Poslužitelj tu vrijednost hvata i obrađuje sa definiranom skriptom. Tako je

opisano u [14]. Kada se vrijednost „akcije“ postavi u „edit“ poziva se funkcija edit();, kao što je

vidljivo u programskom kodu 2. Funkcija edit(); zadužena je za ispisivanje obrasca za uređivanje

pitanja.

print("<td style='float:right'><a href='pitanja-

odgovori.php?akcija=edit&id=" . $pitanje['id'] .

"&from=" . $tablica_pitanja . "&codg=" . $tablica_odg

."' >Uredi pitanje!</a></td></tr>");

switch($_GET['akcija'])

{

case "novo":

{

novo();

break;

}

case "prikaz":

{

prikaz();

break;

}

case "edit":

{

edit();

break;

}

}

Programski kod 2: pozivanje

funkcije edit();

Programski kod 1: postavljanje vrijednosti „akcije“ u „edit“

Page 24: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

24

Nakon što je pitanje ispisano u obrascu za uređivanje pitanja i nakon što stisnemo opciju

„Spremi promjene“, podaci se uz pomoć metode POST [14] šalju skripti uredi-pitanje.php.

Skripta uredi-pitanje.php sve promjene i nove podatke vezane uz određeno pitanje pohranjuje u

bazu podataka. Ukoliko kroz uređivanje pitanja odlučimo promijeniti tip pitanja (da/ne,

ocjenjivanje, višestruki odabir), ocjene/odgovori na to pitanje (koje su napisali korisnici) će se

izbrisati iz baze podataka. Razlog tome je što je pitanje promijenjeno pa ocjene/odgovori na

njega više ne bi bili važeći, niti bi se podudarao tip odgovora u bazi podataka (pogledati 5.1.5,

Tablica 1).

5.2.2 Brisanje pitanja

Brisanje anketnih pitanja je omogućeno u skripti pitanja-odgovori.php. Pritiskom na tipku

„Briši pitanje!“ (na administratorskom sučelju „Pitanja i odgovori“), skripta se ponovno učitava

te se vrijednost „del“ postavlja u 1 i šalje putem URL-a, kao što je vidljivo u programskom kodu

3. Vrijednost „del“ za određeno pitanje se zatim prima uz pomoć GET metode te se to pitanje,

sva njegova podpitanja i vlastiti odgovori brišu iz baze podataka, kao što možemo vidjeti u

programskom kodu 4.

print("<tr><td><a href='pitanja-odgovori.php?id=" .

$pitanje['id'] . "&from=" . $tablica_pitanja . "&codg=" .

$tablica_odg . "&del=1" ."' onclick='return confirm(\"Jeste li

sigurni?\")' >Briši pitanje!</a></td>");

Programski kod 3: postavljanje vrijednosti „del“ i slanje zahtjeva za brisanje

određenog pitanja

Page 25: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

25

5.2.3 Validacije podataka

Bitan dio aplikacije su validacije podataka u obrascima. Aplikacija je imala problem

ukoliko bi se na nekim mjestima unijeli krivi podaci (npr. 0) iz razloga što se ti podaci kasnije ne

bi mogli prikazati ili bi stvarali probleme pri izračunima statistike ili raznih vrijednosti. U nekim

slučajevima, krivo uneseni podaci su čak stvarali preopterećenje servera ili baze podataka.

Validacije su riješene uz pomoć tehnologije JavaScript.

Validacije za unošenje ispravnih vrijednosti u polje „pitanje“ za sva pitanja, i polja

„min“, „max“ i „korak“ kod pitanja tipa „ocjenjivanje“ nalaze se u skripti pitanja-odgovori.php.

To su JavaScript funkcije validatePitanje(), validatePodpitanje(), validateOcjenjivanje() i

validateSpremiPitanja(). Validacija za pitanje i podpitanje provjeravaju da nešto bude uneseno u

ta polja pri kreiranju i uređivanju pitanja (da pitanje ne ostane prazno).

Iznimno je bitna funkcija validateOcjenjivanje() iz razloga što se kod pitanja tipa

„ocjenjivanje“ ne bi trebali unositi nikakvi drugi podaci osim pozitivnih cijelih brojeva. Prije

nego što je validacija napravljena, ukoliko bi se u polje „korak“ unijela 0 , server bi se

preopteretio iz razloga što bi ušao u beskonačnu petlju pri ispisu odgovora na to pitanje (pokušao

bi ispisati beskonačno mnogo opcija za odabir i nikada ne bi došao od vrijednosti „min“ do

vrijednosti „max“).

if (isset($_GET['id']) && isset($_GET['from']) && isset($_GET['del']) &&

is_numeric($_GET['id']))

{

$id = $_GET['id'];

$from = $_GET['from'];

$codg = $_GET['codg'];

$result = mysql_query("DELETE FROM $from WHERE id=$id") or

die(mysql_error());

$result = mysql_query("DELETE FROM $from WHERE jePodpitanje=$id")

or die(mysql_error());

if (isset($_GET['codg']))

{

$codg = $_GET['codg'];

$result = mysql_query("DELETE FROM $codg WHERE

id_pitanja=$id") or die(mysql_error());

}

}

Programski kod 4: brisanje pitanja

Page 26: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

26

Implementirane su još validacije za kreiranje profila za treću osobu u skripti registracija-

to.php koje provjeravaju da potrebna polja budu upisana te da bude upisan točan format. To su

JavaScript funkcije validateUsername() i validateName(). Također je ugrađena i validacija za

točan upis iznosa dana zabrane pristupa stranici u skripti profil.php, i to funkcija validateDana().

Osim navedenih validacija postoje i validacije za provjeru akcije u smislu pojavljivanja

prozora „Jeste li sigurni?“ za ključne akcije poput brisanja određenih podataka, blokiranja

korisnika ili uređivanja podataka. Implementirana je kroz JavaScript funkciju confirm() na više

mjesta u aplikaciji.

5.2.4 Kreiranje profila za treću osobu

Kreiranje profila za treću osobu je funkcionalnost osmišljena za dodavanje i evaluiranje

osoba koje ne mogu ili iz nekog razloga ne žele napraviti vlastiti korisnički račun na aplikaciji.

U skripti pretraga.php ubačena je tipka „Registriraj treću osobu!“ (korisnik joj pristupa

kroz sučelje stranice za pretraživanje korisnika) koja pokreće skriptu registriraj-to.php te otvara

formu za registraciju treće osobe. Podaci koje treba unjeti za registraciju treće osobe su

„Username“, „Ime“ i „Prezime“. Nije potrebno unositi ostale podatke (poput „passworda“,

„maila“, „jmbga“, „oiba“ i sl.) iz razloga što je to profil osobe koja se neće logirati na stranicu i

neće imati nikakve komunikacije sa ostalim korisnicima, osim što će ostali korisnici moći

evaluirati tu osobu i pogledati evaluacije koje su drugi korisnici ostavili za tu osobu. Nakon što

se ispuni forma, podaci se šalju uz pomoć POST metode te se skripta ponovno pokreće i sprema

podatke u bazu.

Page 27: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

27

5.2.6 Prijava nedoličnog ponašanja

Prijava nedoličnog ponašanje je realizirana kroz dvije različite opcije: prijavu komentara

i prijavu korisnika.

Prijava korisnika je opcija koja je ponuđena korisnicima kada posjećuju nečiji tuđi profil.

U skripti profil.php ubačena je tipka „Prijavi korisnika“ koja pokreće skriptu prijava-

korisnika.php te preko URL-a šalje potrebne podatke. Kada se navedena skripta pokrene, pojavi

se obrazac u koji korisnik upisuje razlog prijave. Nakon što korisnik potvrdi prijavu, prijava se

šalje administratoru na uvid.

Prijava komentara je opcija ponuđena korisnicima kada pregledavaju komentare koje su

ostavili drugi korisnici. Implementirana je u skripti prikazOcjena.php. Uz pomoć tipke „Prijavi

komentar!“ se vrši komunikacija i pokretanje skripte prijava.php. Skripta prijava.php šalje

administratoru obavijest da je komentar prijavljen.

Page 28: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

28

5.2.7 Mjere protiv nedoličnog ponašanja

Administratorima je omogućena opcija blokiranja korisnika zbog nedoličnog ponašanja

na web stranici. Prilikom odlaska na korisnički profil, administratorima će biti ponuđena

mogućnost zabrane pristupa stranici za određenog korisnika, na određeni broj dana. To odrađuju

uz pomoć upisa željenog broja dana i pritiska na tipku „Zabrani!“ što je implementirano u skripti

profil.php koja komunicira sa skriptom zabrani.php preko GET metode, kao što je vidljivo u

programskom kodu 5. Skripta zabrani.php u bazu podataka unosi zabranu pristupa web aplikaciji

(osim početne stranice) određenom korisniku na određeni broj dana. Nakon što je nekom

korisniku zabranjen pristup stranici, administrator ima opciju uklanjanja zabrane pristupa uz

pomoć tipke „Dopusti pristup stranici“ koja pokreće skriptu zabrani.php te skida zabranu

pristupa. Također, administrator može pregledavati prijavljene korisnike te razloge zbog čega su

prijavljeni. Opcija je implementirana na admin panelu (panel.php) kao tipka „Prijavljeni

korisnici“ koja pokreće i komunicira sa skriptom prijavljeni-korisnici.php.

Druga mjera protiv nedoličnog ponašanja korisnika je brisanje komentara. Prilikom

pregledavanja ocjena određenog korisnika, administratoru je uz svaki komentar ponuđena opcija

brisanja komentara. Implementirana je u skripti pogledajOcjene.php kao tipka „Briši komentar!“,

a komunicira sa skriptom brisi-komentar.php. Skripta brisi-komentar.php briše odabrani

komentar iz baze podataka. Administrator, osim na korisničkim ocjenama, komentare može

brisati i iz posebnog sučelja „Prijavljeni komentari“ implementiranog u skripti prijavljeni-

komentari.php, do kojeg dolazi pritiskom na tipku „Prijavljeni komentari“ na admin panelu.

<tr><td class="profile-right-links">

<form name=zabrana id=zabrana method=GET action="zabrani.php"

onsubmit="return validateDana()">

Zabrana pristupa stranici na:

<input type="text" id="dana" name=dana id=dana size="3"

value="15" onfocus="clrError('dana','errDana')">&nbsp dana.

<?php print("<input type='hidden' name='id' value='".

$profile_id ."'>"); ?>

<?php print("<input type='hidden' name='opcija' value='1'>"); ?>

<input type=submit value="Zabrani!" class="submit-link">

<span class="error" id="errDana"></span>

</form>

</tr></td>

Programski kod 5: mogućnost zabrane pristupa za korisnike

Page 29: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

29

Administrator u sučelju „Prijavljeni komentari“, osim što može izbrisati komentar, može i

maknuti prijavu sa komentara ukoliko smatra da je sa komentarom sve uredu. To izvršava

pritiskom na tipku „Ukloni prijavu!“ koja pokreće skriptu ukloni-prijavu.php.

5.2.8 Obavještavanje korisnika o blokadi ili evaluaciji

Kada se korisnički račun blokira zbog neprimjerenog ponašanja, korisniku se automatski

šalje e-mail (ukoliko korisnički račun ima email- objašnjeno u 5.2.4 Kreiranje profila za treću

osobu) sa obavijesti o toj akciji, kao što vidimo iz programskog koda 6. Mogućnost je

implementirana u skripti zabrani.php te uz pomoć alata phpmailer.

Na sličan je način implementirana obavijest o evaluaciji korisnika u skripti

spremiOcjene.php. Tada se korisniku koji je evaluiran šalje e-mail koji ga obavještava da je

evaluiran i tko ga je točno evaluirao.

if(isset($korisnik['email']))

{

$primatelj=$korisnik['email'];

$naslov='Skidanje zabrane pristupa stranici';

$sadrzaj='Poštovani, <br> Uklonjena vam je zabrana pristupa

stranici. ';

$sadrzaj=$sadrzaj . '<br><br><br><hr><hr> Ukoliko nas želite

kontaktirati, odgovorite na ovu poruku, ili na NES stranici na

vlastitom profilu odaberite opciju "Kontaktiraj nas"!';

$datum=date('Y-m-d H:i:s');

include("mail_config.php");

$mail->AddAddress($primatelj);

$mail->Subject = "NES - " . $naslov;

$mail->MsgHTML($sadrzaj);

if(!$mail->Send()) echo $mail->ErrorInfo;

}

Programski kod 6: obavještavanje korisnika o zabrani pristupa putem e-maila

Page 30: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

30

5.2.9 Komunikacije između korisnika

Korisnicima web aplikacije je omogućena međusobna komunikacija. Kada korisnik ode

na profil drugog korisnika, ponuđena mu je opcija „Pošalji poruku“. U skriptu profil.php

ubačena je spomenuta tipka koja pokreće skriptu posalji-poruku-korisniku.php. Kada se

navedena skripta pokrene, korisnik koji želi poslati poruku ispunjava obrazac sa naslovom i

sadržajem poruke te pritiskom na tipku „Pošalji“ šalje poruku odabranom korisniku. Poruka se

sprema u bazu podataka uz pomoć iste skripte.

Kada korisnik ode na stranicu vlastitog profila, može pritiskom na tipku „Poruke“

pregledati poruke koje su mu ostali korisnici poslali. Pregledavanje poruka implementirano je

kroz skriptu poruke-korisnici.php. Skripta prikazuje sučelje za pregledavanje svih pristiglih

poruka te korisnik može odabrati brisanje poruke, pritiskom na tipku „Briši poruku!“ ili čitanje

poruke, pritiskom na naslov poruke. Ukoliko odabere „Briši poruku!“ pokreće se skripta brisi-

poruku-korisnik.php te se odabrana poruka briše. Ukoliko odabere naslov poruke, pokreće se

skripta prikazPoruke-korisnik.php te se prikazuje sadržaj poruke, a korisnik potom može i

odgovoriti na poruku pritiskom na tipku „Odgovori“ što ponovno pokreće skriptu posalji-

poruku-korisniku.php.

5.2.10 Komunikacija administrator-korisnik

Osim što postoji mogućnost kontaktiranja administratora od strane korisnika, dodatno je

implementirana mogućnost da administratori započinju komunikaciju. Administrator to može

napraviti kada posjećuje profil korisnika, pritiskom na tipku „Pošalji poruku“ koja pokreće

skriptu admin-nova-poruka.php i ispisuje obrazac za slanje poruke (naslov i sadržaj). Kada

Administrator ispuni i pošalje poruku, korisniku se šalje e-mail sa sadržajem koji je administrator

napisao. Administrator ne može slati poruke korisničkim računima koje je netko kreirao kao

„korisnički račun za treću osobu“ (iz razloga što takvi računi nemaju e-mail- objašnjeno u 5.2.4

Kreiranje profila za treću osobu)

Page 31: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

31

5.2.11 Obavijesti

Obavijesti (engl. notifications) su implementirane za sljedeće stavke:

Broj prijavljenih komentara- vidljiv na admin panelu pored tipke „Prijavljeni komentari“.

Iz baze podataka se uz pomoć mysql upita u skripti panel.php hvataju i prebrojavaju svi

prijavljeni komentari te se ispisuje broj tih komentara. Vidljivo u programskom kodu 7.

Broj prijavljenih korisnika- vidljiv na admin panelu pored tipke „Prijavljeni korisnici“.

Implementiran na sličan način kao i broj prijavljenih komentara.

Nepročitane poruke koje su primili administratori- vidljiv na admin panelu pored tipke

„Poruke“. Implementiran na sličan način kao obavijest za prijavljene komentare i

prijavljene korisnike.

Nepročitane poruke koje su primili korisnici- vidljiv na vlastitom profilu pored tipke

„Poruke“. Implementiran na sličan način kao u prethodnim stavkama.

Pokušaj logina ukoliko je korisnički račun pod zabranom pristupa- pojavljuje se

notifikacija„Korisnički račun je pod zabranom još [broj] dana!”. Implementiran na sličan

način kao u prethodnim stavkama.

Obavijesti o akcijama na stranici, poput uspješnog slanja poruke, uspješne zabrane

pristupa, uspješnog skidanja zabrane pristupa i sl.- Implementirano uz pomoć GET

metode i odjela za ispis obavijesti. Nakon što se odradi određena akcija, ukoliko je

uspješno odrađena, u URL-u se šalje poruka za ispis, kao što je vidljivo u programskom

kodu 8, te se prima kao varijabla $msg, što vidimo u programskom kodu 9.

$result = mysql_query("SELECT COUNT(`id`) as count FROM

`komentari_najmoprimac`WHERE `prijava`=1");

$row = mysql_fetch_object($result);

$count = $row->count;

$bpk=$bpk+$count;

if($bpk!=0)

{

Print("<tr><td class='profile-right-links'><a href='prijavljeni-

komentari.php' >Prijavljeni komentari </a><span

class='notification'> [". $bpk ."]</span></td></tr>");

}

Programski kod 7: obavijest- broj prijavljenih komentara

Page 32: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

32

<?php if(isset($_GET['msg']))

{

$msg=$_GET['msg'];

print("<tr><td class='notification'

style='padding-left:60px;'><h2>" . $msg .

"</h2></td></tr>");

}

header("Location:profil.php?id=$id&msg=Profil+uspješno+

odblokiran!");

Programski kod 9: primanje poruke putem GET metode i ispis

poruke

Programski kod 8: slanje poruke putem URL-a

Page 33: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

33

6. Instalacija i pokretanje aplikacije

Za instalaciju i pokretanje aplikacije potrebno je imati program poput WAMPServer-a

koji će obrađivati PHP kod i povezivati aplikaciju sa bazom podataka. Osim takvog programa,

potreban je i internet pretraživač u kojem će se aplikacija prikazivati.

Aplikaciju je potrebno kopirati u www direktorij u datoteci WAMPServer-a. Zatim je potrebno

pokrenuti WAMPServer, a početnoj stranici se pristupa tako da se u internet pretraživač upiše

localhost/Aplikacija/index.php

Bazu podataka rent.sql je potrebno importati u PhpMyAdminu.

Cjelokupna aplikacija i baza podataka nalaze se na CD-u priloženom ovom radu.

Detaljne upute za pokretanje aplikacije i spajanje na aplikaciju nalaze se u dokumentu

„README.txt“ na CD-u.

Page 34: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

34

7. Primjeri rada i korištenja aplikacije

7.1 Početna stranica

Kada imamo učitanu stranicu početnu stranicu (index.php) možemo izabrati između

nekoliko opcija: registracija, prijava na stranicu (engl. login), ponovno postavljanje lozinke

(ukoliko smo je zaboravili) ili kontakt administratora. Registracija se obavlja pritiskom na tipku

„Registriraj se ovdje“, prijava pritiskom na tipku „prijava“, oporavak lozinke pritiskom na tipku

„Zaboravljena lozinka?“, a kontakt administratora uz pomoć tipke „javite se administratoru

ovdje“. Sve navedeno je vidljivo na slici 3.

Slika 3: Početna stranica

Page 35: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

35

7.1.1 Oporavak lozinke

Ukoliko stisnemo tipku „Zaboravljena lozinka?“ pojaviti će se obrazac za oporavak

lozinke gdje upisujemo e-mail korisničkog računa, kao što je prikazano na slici 4. Kada

ispunimo obrazac na uneseni e-mail dobivamo novu lozinku.

Slika 4: Oporavak lozinke

7.1.2 Kontakt administratora

Pritiskom na tipku za kontakt administratora otvara se obrazac za kontakt u koji

upisujemo e-mail (na koji ćemo dobiti povratne informacije), naslov i sadržaj, kao što vidimo iz

slike 5.

Slika 5: Obrazac za kontakt administratora

Page 36: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

36

7.1.3 Registracija

Odabirom opcije za registraciju, pojaviti će se obrazac za registraciju novog korisnika.

Potrebno je unijeti sva polja označena sa * (zvjezdicom), vidljivo na slici 6.

Slika 6: Obrazac za registraciju

7.1.4 Prijava

Nakon ispunjenja obrasca za prijavu (vidljivog na slici 7), korisnik je preusmjeren na

vlastiti korisnički profil (profil.php), a administrator na admin panel (panel.php).

Slika 7: Obrazac za prijavu

Page 37: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

37

7.2 Admin panel

Sa stranice „admin panel“ (panel.php) možemo otvoriti stranicu „pitanja i odgovori“

(pritiskom na tipku „Pitanja i odgovori“), pregledavati poruke (pritiskom na tipku „poruke“),

pregledavati prijavljene komentare (pritiskom na tipku „Prijavljeni komentari“) te pregledavati

prijavljene korisnike (pritiskom na tipku „Prijavljeni korisnici“). Admin panel je vidljiv na slici

8.

Slika 8: Admin panel

Page 38: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

38

7.2.1 Pitanja i odgovori

Na stranici „Pitanja i odgovori“ su nam ponuđene mogućnosti dodavanja novih pitanja

(tipka „Novo pitanje“), brisanja pitanja (tipka „Briši pitanje“) iz baze podataka te uređivanje

pitanja (tipka „Uredi pitanje“), vidljivo na slici 9. Pritiskom na tipku „Najmoprimac“

prikazujemo pitanja za najmoprimca, a pritiskom na tipku „Najmodavac“ pitanja za najmodavca.

Slika 9: Pitanja i odgovori

Page 39: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

39

7.2.1.1 Novo pitanje

Tipka „Novo pitanje“ otvara obrazac za unošenje novog pitanja, vidljiv na slici 10.

Slika 10: Obrazac za unos novog pitanja

Ukoliko odaberemo vrstu pitanja „Ocjenjivanje“ pojavljuje se dio obrasca za upis

minimuma, maksimuma i koraka ocjene (vidljivo na slici 11). Odabir vrste „Vlastiti odgovori“

ispisuje dio obrasca za upis vlastitih odgovora, dodavanje vlastitih odgovora (za veći broj opcija)

i brisanje vlastitih odgovora (za manji broj opcija). Navedeni dio obrasca je vidljiv na slici 12.

Odabirom vrste „Da/Ne“ korisniku se ponudi opcija unošenja podpitanja što je vidljivo na

slikama 13 i 14. Podpitanje neće ponovno omogućiti upis još jednog podpitanje (bez obzira na

vrstu podpitanja).

Slika 11: Vrsta pitanja- Ocjenjivanje

Page 40: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

40

Slika 12: Vrsta pitanja- Vlastiti odgovori

Slika 13: Vrsta pitanja- Da/Ne, sa podpitanjem

Slika 14: Vrsta pitanja- Da/Ne, sa podpitanjem

Page 41: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

41

7.2.1.2 Uređivanje pitanja

Pritiskom na tipku „Uređivanje pitanja“ sa stranice „Pitanja i odgovori“, odabrano pitanje

se otvara u obrascu za uređivanje pitanja, vidljivo na slici 15. Ukoliko korisnik promijeni pitanje

na način da ukloni njegovo podpitanje (odabirom opcije „Nema ga“), dio obrasca za podpitanje

će se automatski ukloniti.

Slika 15: Uređivanje pitanja

Page 42: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

42

7.2.2 Poruke

Kada se na admin panelu odabere opcija „Poruke“ iz baze podataka se izlistavaju sve

poruke poslane administratorima, kao što je prikazano na slici 16. Pritiskom na naslov poruke se

otvara sadržaj poruke (slika 17). Potom se pritiskom na tipku „Odgovor“ može otvoriti forma za

odgovor na poruku (slika 18).

Slika 16: Poruke za administratore

Slika 17: Sadržaj poruke

Page 43: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

43

Slika 18: Odgovor na poruku

7.2.3 Prijavljeni komentari

Pritiskom na tipku „Prijavljeni komentari“ na admin panelu, otvara se sučelje sa

izlistanim prijavljenim komentarima, vidljivo na slici 19. Sa tog sučelja administrator može

obrisati komentar, ukloniti prijavu ili otići na profil korisnika koji je napisao komentar ili

korisnika koji je prijavio komentar.

Slika 19: Prijavljeni komentari

Page 44: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

44

7.2.4 Prijavljeni korisnici

Pritiskom na tipku „Prijavljeni korisnici“ na admin panelu, otvara se sučelje sa izlistanim

prijavljenim korisnicima, vidljivo na slici 20. Sa tog sučelja administrator može ukloniti prijavu

ili otići na profil prijavljenog korisnika te poduzeti potrebne mjere.

Slika 20: Prijavljeni korisnici

Page 45: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

45

7.3 Pretraga

Sa stranice „Pretraga“ (pretraga.php) korisnik ili administrator može ispuniti formu za

pretraživanje korisnika u bazi podataka, po unesenim ključnim vrijednostima. Navedena stranica

je vidljiva na slici 21. Sa ove stranice korisnik ili administrator također mogu pritisnuti tipku

„Registriraj treću osobu!“ te time otvoriti obrazac za registraciju treće osobe vidljiv na slici 22.

Slika 21: Pretraga korisnika

Slika 22: Registracija treće osobe

Page 46: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

46

7.4 Vlastiti profil

Kada se korisnik nalazi na stranici vlastitog profila, vidljivoj na slici 23, može stisnuti

tipku „Poruke“ za pregledavanje poruka, „Uredi profil“ za uređivanje podataka o profilu

(vidljivo na slici 24), „Postavke računa“ za uređivanje podataka o računu (vidljivo na slici 25),

„Pogledaj ocjene“ za pregled vlastitih ocjena (vidljivo na slici 26) ili „Kontaktirajte nas“ za

kontakt.

Slika 23: Vlastiti profil

Slika 24: Uređivanje profila

Page 47: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

47

Slika 25: Postavke korisničkog računa

Slika 26: Pregled ocjena

Page 48: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

48

7.5 Profil ostalih korisnika

Kada se korisnik nalazi na profilu nekog drugog korisnika, dodatno su mu ponuđene

opcije „Pošalji poruku“, „Ocijeni“ i „Prijavi korisnika“, kao što je vidljivo na slici 27. Obrazac

koji se otvara pritiskom na tipku „Ocijeni“ vidljiv je na slici 28.

Slika 27: Profil ostalih korisnika

Slika 28: Obrazac za ocjenjivanje korisnika

Page 49: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

49

7.6 Validacije

Primjeri validacije točnog upisa u obrazac su vidljivi na slikama 29 i 30.

Slika 29: Primjer validacije upisa I

Slika 30: Primjer validacije upisa II

Page 50: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

50

7.7 Obavijesti

Obavijesti (engl. notifications) imaju funkciju obavještavanja korisnika ili administratora

o uspješno ili neuspješno obavljenoj akciji. Za primjer smo uzeli obavijest o uspješnoj zabrani

pristupa stranici, vidljivo na slici 31.

Slika 31: Obavijest o uspješnoj zabrani pristupa

Page 51: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

51

8. Zaključak

Radeći ovaj završni rad proširio sam svoje znanje o razvoju web aplikacija ali i dobio

priliku za upotrijebiti i pokazati svoje dosad stečeno znanje iz tog područja. Naravno, ima još

puno prostora za poboljšanja i planiram se nastaviti baviti područjem razvoja web aplikacija,

kako u sklopu fakultetskog obrazovanja na diplomskom studiju, tako i u svoje slobodno vrijeme.

U aplikaciju su, prema zadanom zadatku, dodane razne funkcionalnosti i poboljšanja,

međutim uvijek ima prostora za još poboljšanja i nadogradnje. Tako bi se na primjer mogao

preurediti dizajn da aplikacija bude malo preglednija kada je izlistano puno stavki na nekoj

stranici (dodati straničenje). Također bi se mogla dodati mogućnost ubacivanja nekretnina koje

su u vlasništvu određenog najmodavca kako bi najmoprimci mogli ocjenjivati i određene

nekretnine za određenog najmodavca.

Page 52: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

52

Literatura

[1] Web Aplikacije, internet stranica: http://en.wikipedia.org/wiki/Web_application

[2]ER Model, internet stranica:

http://en.wikipedia.org/wiki/Entity%E2%80%93relationship_model

[3] PHP: What is PHP?, internet stranica: http://php.net/manual/en/intro-whatis.php

[4] HTML Introduction, internet stranica: http://www.w3schools.com/html/html_intro.asp

[5] CSS, internet stranica: http://en.wikipedia.org/wiki/Cascading_Style_Sheets

[6] MySQL Wikipedia, internet stranica: http://en.wikipedia.org/wiki/MySQL

[7] JavaScript Introduction, internet stranica: http://www.w3schools.com/js/js_intro.asp

[8] WAMPServer, internet stranica: http://www.wampserver.com/en/

[9] PhpMyAdmin, internet stranica: http://www.phpmyadmin.net/home_page/index.php

[10] Notepad++, internet stranica: http://notepad-plus-plus.org/

[11] Mozilla Firefox, internet stranica: http://en.wikipedia.org/wiki/Firefox

[12] Google Chrome, internet stranica: http://en.wikipedia.org/wiki/Google_Chrome

[13] draw.io, internet stranica: https://www.draw.io/

[14] HTTP metode, internet stranica: http://www.w3schools.com/tags/ref_httpmethods.asp

Page 53: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

53

Prilozi

Slika 1: Entity-Relationship dijagram [2], prijašnje stanje baze podataka ................................... 13

Slika 2: Entity-Relationship dijagram nove baze podataka .......................................................... 16

Tablica 1: Vrijednosti „atr1“ i „atr2“ ............................................................................................ 20

Programski kod 1: postavljanje vrijednosti „akcije“ u „edit“ ....................................................... 23

Programski kod 2: pozivanje funkcije edit();................................................................................ 23

Programski kod 3: postavljanje vrijednosti „del“ i slanje zahtjeva za brisanje određenog pitanja

....................................................................................................................................................... 24

Programski kod 4: brisanje pitanja ............................................................................................... 25

Programski kod 5: mogućnost zabrane pristupa za korisnike ....................................................... 28

Programski kod 6: obavještavanje korisnika o zabrani pristupa putem e-maila ........................... 29

Programski kod 7: obavijest- broj prijavljenih komentara ........................................................... 31

Programski kod 8: slanje poruke putem URL-a ........................................................................... 32

Programski kod 9: primanje poruke putem GET metode i ispis poruke ....................................... 32

Slika 3: Početna stranica ............................................................................................................... 34

Slika 4: Oporavak lozinke ............................................................................................................. 35

Slika 5: Obrazac za kontakt administratora .................................................................................. 35

Slika 6: Obrazac za registraciju .................................................................................................... 36

Slika 7: Obrazac za prijavu ........................................................................................................... 36

Slika 8: Admin panel .................................................................................................................... 37

Slika 9: Pitanja i odgovori............................................................................................................. 38

Slika 10: Obrazac za unos novog pitanja ...................................................................................... 39

Slika 11: Vrsta pitanja- Ocjenjivanje ............................................................................................ 39

Slika 12: Vrsta pitanja- Vlastiti odgovori ..................................................................................... 40

Slika 13: Vrsta pitanja- Da/Ne, sa podpitanjem ............................................................................ 40

Slika 14: Vrsta pitanja- Da/Ne, sa podpitanjem ............................................................................ 40

Slika 15: Uređivanje pitanja.......................................................................................................... 41

Slika 16: Poruke za administratore ............................................................................................... 42

Slika 17: Sadržaj poruke ............................................................................................................... 42

Slika 18: Odgovor na poruku ........................................................................................................ 43

Slika 19: Prijavljeni komentari ..................................................................................................... 43

Slika 20: Prijavljeni korisnici........................................................................................................ 44

Page 54: SVEUČILIŠTE U RIJECI TEHNIČKI FAKULTET - bib.irb.hr · „draw.io“[13], besplatni online alat za crtanje dijagrama i tokova rada (engl. workflow). Korišten je za izradu ER-dijagrama

54

Slika 21: Pretraga korisnika .......................................................................................................... 45

Slika 22: Registracija treće osobe ................................................................................................. 45

Slika 23: Vlastiti profil.................................................................................................................. 46

Slika 24: Uređivanje profila ......................................................................................................... 46

Slika 25: Postavke korisničkog računa ......................................................................................... 47

Slika 26: Pregled ocjena................................................................................................................ 47

Slika 27: Profil ostalih korisnika................................................................................................... 48

Slika 28: Obrazac za ocjenjivanje korisnika ................................................................................. 48

Slika 29: Primjer validacije upisa I ............................................................................................... 49

Slika 30: Primjer validacije upisa II.............................................................................................. 49

Slika 31: Obavijest o uspješnoj zabrani pristupa .......................................................................... 50