projekat web aplikacije - internet online oglasi - diplomski

UNIVERZITET SINGIDUNUM

FAKULTET ZA POSLOVNU INFORMATIKU

Darko Dragi

PROJEKAT WEB APLIKACIJE -INTERNET ONLINE OGLASI-

- Diplomski rad -

Beograd, 2007.

FAKULTET ZA POSLOVNU INFORMATIKU

PROJEKAT WEB APLIKACIJE -INTERNET ONLINE OGLASI-

- Diplomski rad -

Mentor: Prof dr Mladen Veinovi

Student: Darko Dragi

Br. indeksa: 2s/2003

Beograd, 2007.

FAKULTET ZA POSLOVNU INFORMATIKU UNIVERZITET SINGIDUNUM FAKULTET ZA POSLOVNU INFORMATIKU Beograd, Danijelova 32 Broj: __________/2007 Kandidat: Darko Dragi Broj indeksa: 2s/2003 Smer: Projektovanje i programiranje Tema: PROJEKAT WEB APLIKACIJE - INTERNET ONLINE OGLASI- Zadatak: Predstaviti i upoznati se sa osnovnim tehnikama u realizaciji web aplikacije - internet online oglasi. U ovom radu predstavljeni su HTML , PHP kao i sistem za upravljanje relacionim bazama podataka MySQL za skladitenje podataka. Omoguiti unos i pregled oglasa, registraciju korisnika, brisanje i izmenu istih, administratorska prava kao i ostale propratne funkcije za uspean rad aplikacije .Realizovati i opisati web aplikaciju za internet online oglase. Unos oglasa u bazu realizovati korienjem standardnih HTML formi a za reenje zadatka primeniti programski jezik PHP i MySQL za skladitenje podataka. MENTOR ________________________ Prof. dr Mladen Veinovi Datum odobrenja teme: 03.06.2007. Beograd DEKAN ________________________ Prof. dr Milan Milosavljevi

SAETAK U ovom radu prezentirana je ideja o razvijanju novog, jednostavnog, preglednog i pre svega funkcionalnog web site-a, dizajniranog tako da bude prilagoen svim strukturama korisnika Internet usluga, odn. funkcionalno prilagoenog svim korisnicima Internet usluga bez obzira na nivo znanja koritenja Internet-a. ABSTRACT This paper presents an idea on developing a new, simple, straightforward and, above all, functional web site, designed so as to suit all profiles of Internet service users, i.e. functionally adapted to all users of Internet facilities, regardless of their Internet competence levels . .

1 ..................................................................................................................... - 1 - UVOD2 HTML..................................................................................................................... - 2 -

2.1 TAGOVI......................................................................................................... - 2 - 2.2 HTML FORME .............................................................................................. - 3 - 2.3 PRVI KORAK................................................................................................ - 4 -

2.3.1 TEKST FORMA (TEXT)....................................................................... - 4 - 2.3.2 TEKSTUALNO POLJE (TEXT AREA) ............................................... - 5 - 2.3.3 POLJE ZA GLASANJE (RADIO BUTTON)........................................ - 6 - 2.3.4 POLJE ZA OBELEAVANJE, EKIRANJE (CHECKBOX)............. - 6 - 2.3.5 PADAJUI MENI (POP-UP BOX)....................................................... - 7 - 2.3.6 POALJI I BRII DUGMAD (Submit and reset buttons)..................... - 8 - 2.3.7 PRIMER JEDNE HTML FORM ........................................................... - 9 -

3 CSS ....................................................................................................................... - 11 - 3.1 TA JE CSS ................................................................................................. - 11 - 3.2 CSS SYNTAX-e........................................................................................... - 12 -

3.2.1 SYNTAX-e ZA TEKST ....................................................................... - 12 - 3.2.2 CSS MARGINE ................................................................................... - 13 - 3.2.3 CSS BOJE - COLORS ......................................................................... - 14 - 3.2.4 BACKGROUND - POZADINA .......................................................... - 14 - 3.2.5 BORDER - OKVIR.............................................................................. - 15 - 3.2.6 UPOTREBA CSS-a.............................................................................. - 17 - 3.2.7 UPOTREBA CSS-a U HTML-u .......................................................... - 17 -

4 PHP....................................................................................................................... - 18 - 4.1 UVOD U PHP .............................................................................................. - 18 - 4.2 PHP U POREENJU SA DRUGIM JEZICIMA ........................................ - 19 - 4.3 RAZLIKA IZMEU S-S i C-S SKRIPTNIH JEZIKA ............................... - 20 - 4.4 SINTAKSA PHP-a....................................................................................... - 21 - 4.5 PRELAENJE IZ PHP-a U HTML MOD................................................... - 21 - 4.6 POVEZIVANJE HTML OBRAZCA SA PHP SKRIPTOM ...................... - 22 - 4.7 NEKE OD OSNOVNIH PHP TEHNIKA.................................................... - 23 -

4.7.1 IF iskaz: ................................................................................................ - 23 - 4.7.2 WHILE petlja: ...................................................................................... - 24 - 4.7.3 FOR petlja: ........................................................................................... - 25 -

4.8 UPOTREBA KOLAIA (cookies) ........................................................... - 27 - 5 BAZE PODATAKA............................................................................................. - 29 -

5.1 UPOTREBA MYSQL BAZA PODATAKA ............................................... - 30 - 6 PROJEKAT .......................................................................................................... - 31 -

6.1 INDEX.......................................................................................................... - 31 - 6.2 MENI............................................................................................................ - 32 -

7 RAZVOJ............................................................................................................... - 33 - 7.1 SPISAK MySQL TABELA ......................................................................... - 33 -

8 FUNKCIJE ........................................................................................................... - 35 - 8.1 INSTALACIJA............................................................................................. - 36 - 8.2 REGISTRACIJA NOVOG KORISNIKA.................................................... - 42 - 8.3 LOGIN.......................................................................................................... - 45 - 8.4 PREGLED OGLASA................................................................................... - 47 - 8.5 PREDAJA OGLASA ................................................................................... - 49 - 8.6 PRETRAGA OGLASA................................................................................ - 52 - 8.7 PODEAVANJA ......................................................................................... - 53 - 8.8 BRISANJE OGLASA .................................................................................. - 54 -

8.9 ADMINISTRACIJA CMS ........................................................................ - 56 - 8.9.1 USERS.................................................................................................. - 56 - 8.9.2 GRADOVI I KATEGORIJE................................................................ - 57 - 8.9.3 VESTI NEWS ................................................................................... - 58 -

8.10 CMS LISTING KODA.............................................................................. - 59 - 9 ZAKLJUAK....................................................................................................... - 66 - 10 LITERATURA ................................................................................................. - 67 -

Darko Dragi Projekat web aplikacije - Internet online oglasi

1 UVOD Upoznavajui se sa statistikama odreenih web pretraivaa uvideo sam da je re oglasi jedna od vodeih po broju izvrenih pretraga. Oslonivi se na ovaj podatak, odluio sam da razvijem jednu web aplikaciju koja bi omoguavala da se na brz i jednostavan nain omogui internet korisnicima da uspeno vre razmenu oglasa putem interneta.

Prva zamisao jeste da upotreba ove aplikacije bude prilagoena svim nivoima

internet korisnika , jer aplikacija nije usmerena usko jednoj grupi korisnika nego oekujem iru grupu posetilaca. Zbog ovoga kao prvo web aplikacija ( u daljem tekstu web stranica) treba da bude pojednostavljena do krajnjih granica ali da u istom trenutku ostane krajnje funkcionalna. Takoe da bi zadovoljio gore navedene uslove i sam dizajn web stranice treba da bude jednostavan kako zbog lakse preglednosti tako i zbog breg uitavanja (s obzirom da je u Srbiji i dalje jedna od najzastupljenijih internet konekcija dial-up).

Posmatrajui neke od ve postojeih aplikacija za internet online oglase uvideo

sam odreene nedostatke koje bi trebalo da ispravim u ovom projektu: Odreeni deo sadraja zatiti autorizacijom (dozvoliti pristup samo

registrovanim korisnicima) kao npr. predaja oglasa , pretraga oglasa ... Oglase predavati i pregledavati po kategorijama i po gradovima Web sajt treba da ima odreenu vrstu kontrole kako sadraja tako i

ostalih funkcija sajta kao npr. dodavanje/brisanje kategorija , gradova , oglasa ... uz pomo CMS-a (Content Management System)

Svakom registrovanom korisniku omoguiti da u istom trenutku moe imati ukupno 5 oglasa s tim da brisanjem jednog od ve postavljenih oslobaa prostor za postavljanje novog oglasa (spreavanje nagomilavanja nepotrebnih i zastarelih oglasa)

Dakle ideja jeste napraviti jednostavan , pregledan i pre svega funkcionalan web

sajt za online oglase prilagoen svim korisnicima interneta bez obzira na njihov nivo znanja koritenja interneta.

- 1 -


2 HTML

Velika raznovrsnost korienih tipova raunara, operativnih sistema i softvera na

internetu prouzrokovala je potrebu za markap jezicima. Markap jezici predstavljaju jezike koji samo opisno prikazuju svoj sadraj, dok se pravi prikaz sadraja vri na korisnikom raunaru, gde se nalazi interpreter za dati jezik. Na ovaj nain prevazieno je pisanje gotovih prikaza za svaki tip raunara, operativnog sistema ili korisnikog softvera. Sve www stranice su pisane markap jezicima. Interpreteri na korisnikim raunarima se nazivaju brauzeri ili korisniki agenti. HTML jezik zaduen je za izgled stranice, i on predstavalja lice koje vide korisnici koji pristupaju datom web sajtu, i zato je vrlo bitno poznavati HTML jezik prilikom dizajniranja web stranica. HTML jezik se sastoji od komandi koji su osnovni elementi jezika, a najee se nazivaju tag-ovi. Pomou tagova se sve obavlja, formatira se tekst kao naslov, paragraf ili tabela. Postoje tagovi za ukljuenje mnogih drugih formata fajlova, kao to su slike filmovi. Takoe postoje tagovi za ukljuenje hiperlinkova. Hiperlinkovi su najvaniji deo stakog web sajta jer oni povezuju tekuu web stranicu sa drugim stranicama i tako obezbeuju korisniku da se kree kroz web. Hiperlinkovi poseduju URL adresu eljene stranice koju brauzer ita i preko nje dolazi do eljene stranice.

Dobra osobina HTML jezika je da ima mogunost proirivanja, odnoso, mogu mu

se dodavati nove komande, a da to ne poremeti izvrenje ranje napisanih dokumenata u HTML fomatu.

Koncept markup jezika vezan je za interpretiranje napisanog teksta. Svaki brauzer

na prevodi celokupan tekst napisan u nekom markup jeziku, npr. HTML jeziku, ve interpretira,tumai, liniju po liniju i izvrava komande koje je protumaio iz teksta. U HTML je pravac izvravanja instrukcija strogo odozgo na dole.

2.1 TAGOVI Tagovi odnoso komande u HTML jeziku imaju specifian nain pisanja. Svi tagovi

se piu izmeu znakova manje i vee . Kao primer tag oznaava poetak naslova prvog nivoa, dok tag oznaava kraj naslova provog nivoa. Sledea linija u HTML programu prikae jedan naslov u kome pie Ovo je naslov.

Ovo je naslov Primeujemo da postoje tag na poetku koji oznaava strartni tag i tag na kraju koji

oznaava krajnji tag. Sam tekst naslova ogranien je poetnim i krajnjim tagom. Postoje tagovi koji nemaju krajnji tag, kao to je koji vri prekid linije teksta

- 2 -


Ovo je nalsov Neosetljivost na velika i mala slova. Svi tagovi su neosetljivi na pisanje malih

slova tako da je tag isto to i . Preporuka je da dizajner web stranice pie tagove na onaj nain na koji mu to odgovara najvie, a najee se piu velikim slovima jer su tada najitljiviji.

Atributi Tagova. Ponekad tagovi poseduju neke atribute ili karakteristike koji

preciznije opisuju nain prikaza teksta, slike, tabele. Atributi su kao neke promenljive koje mogu dobiti jednu od konanog broja unapred poznatih vrednosti. Na primer sledei tag

Ovo je nalsov H1 poseduje atribut ALIGN koji dobija vrednost "center". Na isti nain tag

poseduje atribut SRC koji odreuje ime fajla gde se nalazi slika. Aatributi su takoe neosetljivi na velika i mala slova.

2.2 HTML FORME

Moda najvaniji deo HTML jezika u dizajniranju web sajtova za online oglase jesu obrazci ondosno forme. Krstarei internetom esto nailazimo na web stranice gde treba da upiemo svoju E-mail adresu , ime , prezime ili neki drugi podatak. Ovo je omogueno uz pomo HTML formi. Web stranice za online oglase takoe sadre ove forme ili vie formi za unos texta. Ako je potrebno da se logujemo na sajt radi autorizacije ili ako elimo da se registrujemo na nekom sajtu sigurno emo morati unositi neke podatke kao to su username ili password U naelu moe se rei da je HTML obrazac web stranica ili njezin dio koji sadri polja za unos podataka. Uneseni podaci se dalje prosljeuju nekakvoj skripti (PHP, JavaScript, ASP, CGI ...) koja podatke obrauje te na osnovu toga generira neki izlaz (slanje na e-mail adresu, stvaranje nove web stranice ...). Prema tome na obrazac predstavlja input podataka, skripta je proces obrade tih podataka, a output je nekakav finalni proizvod samog procesa. Takva struktura prikazana je na slici2.

- 3 -


OBRAZAC (input)

->

PHP,CGI,Javascript...(proces)

->

E-MAIL, WWW (output)

Slika1: prikaz odnosa HTML form > neka skripta

NAPOMENA Forme koje emo ovde nauiti da pravimo su osnvne. Postoji jo

puno komandi koje moemo prikaiti formama.

2.3 PRVI KORAK

Prvo moramo rei browseru da zapoinjemo formu, i ta elimo da se desi sa

podacima upisanim u formi. Komanda kojom govorimo browseru da treba da prikae formu izgleda ovako:

Primeujemo da ova komanda radi etri stvari: 1. Obavetava browser da poinje FORMA. 2. Obavetava browser da METODA kojom e forma tretirati unete podatke biti

slanje e-mailom (POST=Pota). 3. Da podaci uneti u formu treba da budu poslati na upisanu e-mail adresu pomou

ACTION="mailto:[email protected]" komande. 4. Da unete podatke treba da se poalju kao tekst. Ovo radi ENCTYPE="text/plain"

komanda. Napomena. Treba da stavimo svoju e-mail adresu odmah posle "mailto:" bez praznog

polja! Na adresu koju ovde napiemo, bie poslati podaci iz forme.

Sada kada browser zna da poinje forma treba da napiemo kakav tip forme elimo da se prikae. Ovde u prikazati pet tipova; TEXT (tekst), TEXT AREA (tekstualno polje), RADIO BUTTON (polje za glasanje), CHECKBOX (polje za obeleavanje, ekiranje), i POP-UP BOX (Padajui meni). Ove forme se najvie koriste na internetu. Takoe, pokazau kako da napravimo dugmie koji e kada se na njih klikne poslati podatke iz forme na "mailto:" adresu ili obrisati sadrzaj forme. 2.3.1 TEKST FORMA (TEXT)

Ovo je osnovna forma koja omoguava upisivanje jednog reda teksta. Kada je postavimo na stranici, surferi e moi da upisu podatke kao to su ime i prezime, e-mail adresu i sl. Evo kako tekst forma (box) izgleda:

Slika2 text forma

- 4 -


Treba da kliknete miem na formu da bi je aktivirali. Ako nikada do sada niste pravili forme moda ete pomisliti da je to to vidite .gif ili .jpg. E, nije. Forma je ubaena pomou jedne HTML komande koja izgleda ovako: Ova komanda je uradila tri stvari

INPUT TYPE govori browseru da e tu biti ubaen element (neki tip) forme. Gore smo rekli browseru da treba da prikaze formu a sada mu govorimo koji tip forme treba da prikae. Tip ove forme je "text".

NAME je naziv koji dodeljujemo box-u. Treba da znamo da ne moramo box nazvati "naziv". Nazovimo ga kako god hoemo i sadraj e nam stii pod tim imenom. Ako box slui za upisivanje imena surfera, nazovimo ga "ime". Ako box sluzi za upisivanje e-mail adrese surfera, nazovimo ga "e-mail". itd., itd.

SIZE oznaava koliko e karektera (polja) box imati. Moeo upisati 10, 60, a moemo i 100 ako elimo.

2.3.2 TEKSTUALNO POLJE (TEXT AREA)

Ovaj box takoe slui za upisivanje teksta, samo to je vei i za razliku od prethodnog moemo upistati vie redova teksta.

Evo kako ovaj box izgleda:

Slika3 : text area

Ako elimo, moemo upisati koliko god redova hoemo. Samo kliknemo miem da aktiviramo formu.

Evo komande koja je napravila ovakav box:

Primeujemo da TEXTAREA zahteva zavrnu komandu, dok

prethodni primer na zehteva. Evo opisa delova komande: TEXTAREA (jedna re) govori browseru da treba da prikae tektualno polje

kakvo vidimo gore. NAME ima istu funkciju kao i prethodni primer. Poruka koju surfer upise u polje

e stii na na e-mail oznaena bilo kojim imenom koji ovde ubacimo. U ovom sluaju, ono to je napisano u box-u e nam stii na e-mail sa reima, "komentar=Tekst koji je surfer upisao u formu".

- 5 -


ROWS govori browseru koliko e redova box imati. COLS govori browseru koliko e karaktera (polja) box imati. Gornji primer ima 6

redova i 40 polja.

2.3.3 POLJE ZA GLASANJE (RADIO BUTTON)

Ovo je maleno okruglo polje. Krui je aktivan i surfer moe miem kliknuti na njega. Kada neko klikne unutranjost kruia se ispuni crnom takom. Evo tri ovakva polja:

Probajmo da obeleimo dva kruia i... naravno neemo uspeti zato to ova polja

tako funkcioniu, kada kliknemo na jedno pa zatim na drugo polje, ovo prvo e biti deselktovano.

Ali zato se zovu radio buttons (buttons=dugmici)?! To je zato to se ponaaju kao dugmii na starim radio ureajima za kola. Kada ukljuimo neto dugme se uvue. Kada pritisnete drugo dugme, ovo prvo se iskljui i vrati u prethodno stanje. Evo komande za ubacivanje ovakvog polja:

Pogledajte, tip forme u TYPE komandi je "radio". Ova komanda je malo dugaka, ali nije nimalo komplikovana. Evo njenih tri dela sa objanjenjima:

INPUT TYPE isto kao u gornjim primerima oznaava tip forme koja e se prikazati. U ovom sluaju to je "radio"

NAME ovde treba da oznaimo kojoj grupi kruia ovo polje pripada, npr. ako na sajtu imamo dve ankete, na jednoj recimo pitamo koja je naa najlepa peveica i u toj anketi stoji nekoliko predloga, a na drugoj, ko je na najbolji politiar, i tu imamo nekoliko predloga. Za prvu anketu, mogli bi da stavimo NAME="Naj pevacica je", a za drugu NAME="Naj politicar je".

VALUE ovde traba da u naem sluaju za prvu anketu napiemo imena i prezimena predloenih pevaica, a za drugu imena i prezimena nekih politiara kako bi smo lake protumaili za koga je surfer glasao.

2.3.4 POLJE ZA OBELEAVANJE, EKIRANJE (CHECKBOX)

Polje za obeleavanje je klon polja za glasanje, a razlikuje se u dve stvari: Kada ubacimo kod na stranici se prikazuje mali kavdrat, a kada kliknete, u

kvadraticu se pojavljuje znak za ekiranje. Moemo obeleiti (ekirati) koliko god kvadratica elite.

Evo nekoliko ovakvih polja:

Evo komande koja ubacuje ovaj chekbox na nau stranicu:

- 6 -


Svaka komanda u ovom kodu je ista kao i u prethodnom primeru pa nema potrebe da ih ponovo opisujemo. Jedino je novo TYPE="checkbox" umesto TYPE="radio" iz prethodnog primera.

Zapamtimo da nam iz ovakvih formi na e-mail mogu stii vie obeleenih kvadratia. Ovakve forme se najee koriste kada elimo da surferima ponudimo izbor, recimo za primanje e-maila samo iz oblasti koje ih interesuju, i koje e izabrati pomou ovih simpatinih kvadratia. Za ankete i glasanja je ipak mnogo bolje koristiti radio polja.

2.3.5 PADAJUI MENI (POP-UP BOX)

Ova stvar, nam moe utedeti puno prostora na stranici. Evo jednog padajueg menija, a da biste videli sve opcije morate da kliknuti na njega. Pomou ovog padajuceg menija moemo pitati korisnike za omiljenu boju:

Crvena

Evo koda: Braon Crvena Plava Zelena Crna Braon

Iako ovo moda izgleda malo komplikovano, zaista nije. Komande se u stvari stalno ponavljaju a neke smo ve upoznali. Evo delova koda uz objanjenje:

SELECT govori browseru da treba da prikaze formu . Ovoga puta to je SELECT (select=izaberi) tj. padajui meni.

NAME isto kao u gornjim primerima oznaava kako e izgledati tekst koji e stii na na e-mail. A izgledae ovako: "Omiljena_boja=" a zatim, izbor surfera.

SIZE oznaava veliinu box-a. U gornjem primeru je 1, to znai da e samo jedan red teksta biti vidljiv.

OPTION SELECTED oznaava koja e opcija biti vidljiva. U ovom sluaju to je "Crvena" boja.

OPTION oznaava druge izbore koji e biti vidljivi kada surfer klikne na padajui meni

/SELECT govori browseru da se forma zavrava.

- 7 -


2.3.6 POALJI I BRII DUGMAD (Submit and reset buttons)

Sada kada smo ubacili sve elemente formi na stranicu, treba da pronaemo nain da omoguimo surferu da nam poalje upisane podatke na e-mail adresu. Ovi dugmii su najlaki za pravljenje od svih elemenata forme. Evo kako izgledaju:

Posalji Brisi

A, evo komandi kojima se dugmii ubacuju na stranicu: Sve komande su poznate, samo u neto razjasniti:

Submit znai izvriti. Kada surfer klikne "izvrie" se slanje sadraja forme na upisanu e-mail adresu.

Reset znai dovesti u prvobitno stanje tj. kada surfer klikne na ovo dugme, sve to je upisao u gore prikazane elemente formi e biti izbrisano.

VALUE u ovom sluaju oznaava ta e biti napisano na dugmetu. Ne moramo staviti "Posalji" i "Brisi", moemo i neto drugo.

Konano!

Nemojmo zaboraviti da sve to smo ispisali zatvorimo sa:

- 8 -


2.3.7 PRIMER JEDNE HTML FORM Sledi jedan jednostavan primer (Listing1) HTML forme koja zahteva od korisika da unese Ime ,Prezime , Grad , izabere jednu tri ponuene drave , username , password. Registracija Ime : Prezime Grad : Drzava: SRB Austrija Italija Username: Password

Listing1

Kada gore navedeni kod obradi web browser npr. FireFox dobiemo sledei izlaz. Slika3.

- 9 -


Slika3 izgled forme Iz listinga1 se moe zakljuiti da navedeni kod predstavlja samo prazan obrazac za unos podatak od strane posetioca korisnika. Da bi se ovakav obrazac stavio u funkciju povezaemo ga sa nekom PHP skrkiptom. U HTML formi moramo navesti putanju i ime PHP skripte koju emo povezati sa naim HTML obrazcem. U listingu1 moe se videti sledea linija koda : Deo koda action=registar.php nam govori da e uneti podaci biti prosleeni do PHP skripte pod imenom registar.php koja se nalazi u istom direktorijumu. Podaci se alju u sledeim varijablama : Ime :


3 CSS

3.1 TA JE CSS

CSS (Cascading Style Sheets) je jezik koji moe sadrati sve one podatke ili

bolje reeno sve syntax-e koje imaju zadatak da odrede stil (style) nekog elementa jedne stranice. Ti elementi mogu biti od obinog texta do jedne veoma kompleksno ''stajlovane'' tabele.

Svaki sajt koji ne sadri u sebi neke od syntax-i a koristi CSS za definisanje stila pojedinog ili pojedinih delova stranice mora imati deo HTML (HyperText Markup Language) koda koji poziva neki CSS fajl sa syntax-ama. Mi emo krenuti ba od poetka a to je kako i kojom komandom pozvati neki CSS dokument.

Recimo da se na CSS dokument zove ''stil'' tada u naeg HTML-a piemo sledei kod:

Ako ne elimo praviti poseban fajl za CSS syntax-e onda ih moramo pisati u na

HTML dokument i to na sledei nain:

U zadnjem kodu imamo sledee , to moemo izostaviti, a ono slui

samo da se sakriju syntax-e od browsera koji ne podravaju CSS. S ovim smo reili pozivanje nekog CSS fajla u HTML dokument. Sad je vreme da

saznamo kako pisati CSS dokument i pre svega koje syntax-e postoje u CSS-u. NAPOMENA : Objanjenje kompletnog CSS bi bilo preobimno za ovaj rad pa

sam odluio da predstavim samo one delove koje smatram potrebnim i interesantnim za realizaciju mog projekta.

- 11 -


3.2 CSS SYNTAX-e 3.2.1 SYNTAX-e ZA TEKST Syntax-a {font-size}

Koristi se za definisanje veliine slova, a moe se definisati na etiri naina: apsolutno, relativno, po duini, ili procentualno. Moda najjednostavnije a i ono to veina koristi jeste definisanje veliine slova po duini.

{ font-size: 30px; } Objanjenje: syntax-a je definisana preko duine od 30px.

Sadraj Syntax-a {font-weight}

font-weight definie debljinu odnosno koliko e naa slova biti boldirana. Ovde moemo koristiti kljune rei kao npr. bolder ili lighter ali i cele brojeve od 100-900 i primeujemo da ako stavimo vei broj nae slovo e biti deblje.

{ font-weight: bolder; } Objanjenje: debljina slova je postavljena na bolder.

Sadraj

CSS Syntax-a: { font-weight: normal|bolder|lighter|100... 900; }

normal ova kljuna re je defaultna lighter slova se udebljavaju ali malo bolder slova se udebljavaju ali vie nego kod lighter

Syntax-a {font-style}

Ova syntax-a podeava slova na italic ili ih vraa u normal (prvobitni) oblik.

{ font-style: italic; } Objanjenje: slova e biti ukoena .

Sadraj

italic ukoena slova normal normalna slova

CSS Syntax-a: { font-style: normal|italic; }

- 12 -


Syntax-a {text-decoration}

Ova syntax-a dekorira na tekst sa nekim od sledeih vrednosti: underline, line-through, ili defaultna vrijednost none:

{ text-decoration: line-through; } Objanjenje: tekst koji ima ovu sintax-u izgleda ovako:

Sadraj underline podvlai text line-through linija kroz sredinu texta none nema nikakvih dekoracija

CSS Syntax-a: { text-decoration: none|underline|line-through; } Syntax-a {text-align}

text-align se koristi za poravnanje teksta. Poravnanje se vri sa etiri vrednosti. Defaultna vrijednost je left.

left poravnava tekst sa leve strane right poravnava tekst sa desne strane center centrira tekst justify poravnava tekst sa obe strane

{ text-align: justify; } Obajnjenje: tekst je poravnat s obe strane .

Sadraj ovog teksta je poravnat s obe strane.

3.2.2 CSS MARGINE

Margine su nevidljivi vanjski prostor izmeu elemenata i u ovom delu emo

saznati kako se definiu margine. Pri definisanju margina moemo postaviti da sve margine imaju istu vrednost ili da svaka ima razliitu ali ono to je vano, pri davanju vrednosti jednoj margini ne smemo nikada koristiti negativne vrednosti jer moe doi do nekih nesporazuma. Kada koristimo margine onda ih moemo podesiti sve od jednm ili pojedinano svaku posebno. Definisanje margina se moe izvriti na etiri naina:

margin ovde se upisuje samo jedna cifra ili kljuna re auto koja pravi isti prazni prostor oko elementa sa sve etiri strane

margin-top podeavanje gornje margine margin-right podeavanje desne margine margin-bottom podeavanje donje margine margin-left podeavanje leve margine

- 13 -


Syntax-a {margin}

Ovu syntax-u koristimo samo ako elimo imati isti prazni prostor sa sve etiri strane elementa.

{ margin: 40px; } pravi 40px praznog prostora oko elementa

CSS Syntax-a: {margin: duina|procentualno; }

Syntax-a za element koji ima razliite margine izgleda ovako: { margin 11px 22px 33px 44px;}

Iz primera vidimo da je: gornja margina 11px, desna margina 22px, donja margina 33px i leva margina 44px. Redosled margina je uvijek isti i pie/ita se u smeru kazaljke na satu, gornja margina je prva a zatim sledi desna itd. 3.2.3 CSS BOJE - COLORS

Pre nego to krenemo sa syntax-ama kojime se definiu boje jednog elementa trebamo znati koje sisteme definisanja boja imamo. Postoje tri razliita sistema od kojeg je najinteresantniji HexaDecimalni sistem ali mi emo obraditi sve.

Mogue je: { color: rgb(crvena%, zelena%, plava%); }


Syntax-a {background-image}

Postavlja sliku u pozadinu elementa. Ako imamo sliku koju elimo postaviti u pozadinu neke tabele onda to moemo uraditi preko sledee syntax-e:

Predpostavimo da se slika zove logo.jpg: { background-image: url(folder do slike/logo.jpg); }

CSS Syntax-a: { background-image: url(URLSlike); } 3.2.5 BORDER - OKVIR

Borderi su oviri koji se nalaze oko nekog elementa. Syntax-a {border-width}

Podeavanje debljine bordera.

{ border-width: 15px; } Obajnjenje: postavlja debljinu bordera na 15px .

Sadraj

CSS Syntax-a: { border-style: duina|procentualno; }

Syntax-a {border-style}

Podeavanje stila odnosno kako e okvir izgledati, mogue su none, solid, dashed, dotted, inherit, double, inset, outset, groove, ridge kljune rei. Da bi se border sa odreenim stilom mogao prikazati potrebna mu je odreena debljina, tu debljinu odreujemo syntax-om border-width.

{ border-style: dotted; } Obajnjenje: kljuna re u syntax-i ini da okvir oko elementa bude isprekidan.

Sadraj

CSS Syntax-a:{ border-style: none|solid|dashed|dotted|inherit|double|inset|outset|groove|ridge; }

Syntax-a {border-color}

Podeavanje boje bordera. Da bi se border sa odreenom bojom mogao prikazati potrebna mu je minimalna debljina od 1px, tu debljinu odreujemo syntax-om border-width.

{ border-color: blue; } Obajnjenje: border je plav.

Sadraj

{ border-color: kljuna re|#HexaDecimalni kod|rgb(0-255,0-255,0-255)|rgb(0-100%,0-100%,0-100%); }

- 15 -


Syntax-a {border-top-width}

Podeavanje debljine gornjeg dela okvira, tj. podeavanje debljine gornje linije.

{ border-top-width: 5px; } Obajnjenje: gornji border ima vrednost 5px.

Sadraj Syntax-a {border-right-width}

Podeavanje debljine desnog dela okvira, tj. podeavanje debljine desne linije.

{ border-right-width: 5px; } Obajnjenje: desni border ima vrednost 5px.

Sadraj Syntax-a {border-bottom-width}

Podeavanje debljine donjeg dela okvira, tj. podeavanje debljine donje linije.

{ border-bottom-width: 5px; } Obajnjenje: donji border ima vrednost 5px.

Sadraj Syntax-a {border-left-width}

Podeavanje debljine levog dela okvira, tj. podeavanje debljine leve linije.

{ border-left-width: 5px; } Obajnjenje: levi border ima vrednost 5px.

Sadraj

Syntax-a {width}

Ova syntax-a podeava duinu nekog elementa. width moe biti izraen procentualno, apsolutno ili sa kljunom rei auto koja je i defaultna vrednost.

Neke od moguih vrednosti syntax-e:

{ width: 500px; } { width: 7in; } { width: 100%; } { width: auto; }

{ width: 160px; } Obajnjenje: prikazana je tabela koja je zavisna od width syntax-e, poto je syntax-a podeena na 160px i tabela e biti te iste duine.

- 16 -


3.2.6 UPOTREBA CSS-a

Primer: napraviti CSS sa pet elemenata: 1. element 1 treba imati okvir "border" debljine 3px samo sa desne strane, ostale strane su 1 px 2. element 2 crvena boja slova sa crvenim isprekidanim "dotted" borderom debljine 1px 3. element 3 ima plavu pozadinu "background" sa crnim slovima 4. element 4 je tabela crvene boje i duine "width" 30% 5. element 5 ima razmak "padding" od 10px sa svih strana, vrsta slova Verdana crne boje

Reenje: 1. Otvoriti novi dokument u Notpad-u 2. U prazan dokument upisati sledee CSS syntax-e:

.element1 { border-style: solid; border: 1px; border-right-width: 3px ; }

.element2 {color: red; border: 1px; border-style: dotted; border-color: red; }

.element3 {color: #000000; background-color: blue; }

.element4 {backgroun-color: blue; width: 30%; }

.element5 {padding: 10px; font-family: verdana; color: black; }

3. Snimiti dokument sa nekim imenom npr. stiyle.css 3.2.7 UPOTREBA CSS-a U HTML-u

Ako ve imamo napisane CSS sintax-e onda je vreme da ih iskoristimo, to se radi ovako: Primjer: imamo tekst koji uzima syntax-u elementa 3 odnosno tekst e biti crn sa plavom pozadinom.

Kod:

Ovaj tekst je crven i nalazi se na plavoj pozadini Ovako bi izgledao celi HTML dokument: .element1 { border-style: solid; border: 1px; border-right-width: 3px ; } .element2 {color: red; border: 1px; border-style: dotted; border-color: red; } .element3 {color: #000000; background-color: blue; } .element4 {backgroun-color: blue; width: 30%; } .element5 {padding: 10px; font-family: verdana; color: black; } Ovaj tekst je crn i nalazi se na plavoj pozadini

Slika4: CSS u akciji

- 17 -


4 PHP

4.1 UVOD U PHP

Php je open-source server-side skriptni programski jezik za dinamiko generisanje HTML koda.

Drugim reima, PHP je skriptni programski jezik pomou kojeg moete kreirati HTML stranicu na serveru , pre nego to je ona poslana klijentu, popunjenu dinamikim sadrajem. Ovim nainom generisanja sadraja klijent ne moe vidjeti kod (skriptu) koji je generisao sadraj koji gleda, ve ima pristup istom HTML kodu.

Open-source u gornjoj definiciji znai da svako ko eli moe skinuti izvorne PHP kodove pisane u C-u i, ukoliko ih razume, moe ih mijenjati po svojoj volji te dodavati nove funkcije PHP-u. tovie, svi su pozvani da sudjeluju u razvoju novih verzija PHP-a. Izvorne kodove i instalacijske datoteke moete skinuti sa slubenog PHP sajta.

PHP je jedna od najnaprednijih i najkoritenijih server-side skriptnih tehnologija

danas u upotrebi. On je svojom sintaksom slian mnogim drugim slinim jezicima, ak i ima istoznane (iste po sintaksi i funkcionalnosti) funkcije kao i neki drugi jezici kao to su C ili Perl. To znai da jednu radnju moete izvesti koritenjem vie razliitih funkcija. Ova osobina u mnogome moe da olaka rad programerima.

Recimo ova dva primera(Listing2) rezultiraju istim prikazom:

i

Listing2 Rezultat oba primera iz listinga2 imae oblik :

Pozdrav svima

Jo jedna vana stvar je ta da je PHP bogat funkcijama za manipuliranje mnogo razliitih tipova sadraja. Od manipuliranja grafikom (png, jpg, flash) do loadanja .NET modula i rada sa XML-om.

- 18 -


Ono to PHP stavlja jo vie ispred ostalih web skriptnih tehnologija je njegova

podrka za baratanje irokom paletom baza podataka. Podrava sve popularnije baze podatak kao MySQL, PostgreSQL, dBase, Oracle, ODBC

Isto tako njegova neovisnost o operativnom sistemu i pristupane cijene

(besplatan je) ga ini meu prvim izborom velikih i malih kompanija za izradu vlastitih mrenih sistema.

4.2 PHP U POREENJU SA DRUGIM JEZICIMA

PHP vs ASP Prva razlika je ta to ASP sam po sebi nije jezik ve skupina povezanih objekata kojima moemo pristupiti pomou VB ili Java Scripta. Druga stvar koja stavlaj ASP u drugi plan je ta to je ASP podran na Win32 sistemima sa IIS-om, a morali bi izdvojiti poveu sumu da bi ga pokrenuli na drugim platformama ili serverima. Veliki problem kod ASP-a je to to je programer ogranien samim jezikom koji je podeljen na 'komponente' i ukoliko elimo ire mogunosti morali bismo nadograivati ASP dodatnim komponentama, to u Microsoft argonu znai dodatni trokovi! PHP vs Perl

Ova dva jezika imaju dosta slinosti, ali vie razlika. Glavna razlika je ta to je PHP namenjen prvenstveno za web skriptanje a Perl ima mnogo iru upotrebu. Samim time ima i sloeniju sintaksu od PHP-a to ga ini tee za nauiti i manje 'shvatljivim' od PHP-a. Unato iroj uporabi Perla, PHP koristi mnoge 'dobre' osobine Perla poput konstruktora i nekih sintaktikih osobina . PHP vs Cold Fusion

Osnovna razlika izmeu ova dva jezika je ta to je PHP stvoren sa misli na pravog programera sa iskustvom u nekom C stil jeziku, dok su stvoritelji Cold Fusiona imali u prvom planu neprogramere i njima su prilagodili sintaksu. Isto tako, PHP je pouzdaniji i otvoreniji inovacijama i programerskim trikovima od CF-a.

- 19 -


4.3 RAZLIKA IZMEU S-S i C-S SKRIPTNIH JEZIKA Server-side

Server side skripte se izvravaju na serveru kada server primi zahtev za PHP dokumentom. Nakon prihvatanja zahteva sa PHP dokumentom server izvrava PHP kod i na osnovu njega generie HTML kod i alje ga klijentu. To znai da stranica koja se prikazuje u pretraivau klijenta ne postoji u tom obliku nigde na serveru odakle ju je klijent primio.

Slika5: Server-side skriptni jezik Client-side

Glavni i najpoznatiji predstavnik ove skupine jezika je JavaScript. Kod pisan u JavaScriptu je obino umetnut u HTML stranicu i izvrava se tek u klijentovom pretraivau. Ovakav kod vidljiv je svima, osim ako nemate malo iskustva i spremite svoje kodove u nekakav include file te time sakrijete svoje kodove.

Slika6: Client-side skriptni jezik

- 20 -


4.4 SINTAKSA PHP-a Ve smo u prijanjem primeru mogli videti neke bitne stvari. Npr. da se sav PHP kod nalazi izmeu kvaica. Mali dodatak ovom pravilu bi bio koritenje kvaica radi razlikovanja izmeu PHP i XML koda (naime i XML koristi iste ove kvaice). Druga stvar koja je oita iz tog primera je da varijable prije svog imena imaju znak $.

4.5 PRELAENJE IZ PHP-a U HTML MOD

Vrlo bitna karakteristika PHP-a i bilo kojeg drugog jezika je razdvajanje server side koda od statikog HTML-a. Tako u PHP-u koritenjem govorimo serveru da se izmeu njih nalazi PHP kod i da je potrebno prvo njega izvriti i tek nakon toga poslati HTML output tog koda skupa sa ostatkom statikog HTML koda klijentu. Ovo je osnova server-client mrene komunikacije putem TCP/IP protokola.

Unutar koda se moemo u bilo kojem trenutku prebaciti iz HTML moda u PHP

mode. ak i unutar IF, FOR i ostalih kontrolnih struktura. Ovo nam omoguuje rad sa templateima u kojima se na isti nain prikazuju razliiti podatci iste strukture. Da ilustriram jednim vrlo jednostavnim primerom. Listing3. TEST

- 21 -


Rezultat Listinga3 bi izgledao

Marko Marki

Uoite da za ispis sadraja varijable koristimo dva razliita naina koji su

rezultirali istim krajnjim ispisom. Naime unutar se nalazi php kod koji e se izvriti ukoliko se u njemu ne nalaze neke sintaktike greke. Druga metoda ispisa je izgledala ovako :

Ovu metodu koristimo kada elimo ispisati neku varijablu ili string. Ova linija je identina

samo to smo umjesto echo naredbe koristili znak = koji PHP-u govori da ispie ono to se nalazi izmeu kvaica.

4.6 POVEZIVANJE HTML OBRAZCA SA PHP SKRIPTOM

esto ete na stranicama automatizovanih PHP-om, imati formulare. Najee e se raditi o anketama, formularima za komentare, glasanje i slino. Na svu sreu, kada se jedan ovakav formular prosledi PHP skriptu, sve varijable definisane na formi bie automatski dostupne PHP skriptu. Ovo znai da skript moe da prihvati i varijable koje nisu definisane u samom PHP skriptu. Na primer, imamo jednostavan formular (Listing4), koji se metodom "POST" alje na obradu PHP skriptu pod nazivom "primer.php":

IME:

Listing4 : kreiranje HTML forme za unos imena Kada ovaj formular popunite i kliknete na dugme "Posalji", metodom "POST" elementi formulara e biti prosleeni PHP stranici "primer.php" na dalju obradu. Stranica "primer.php" e automatski primiti sadraj iz prosleenog polja "ime" u varijablu "$ime". Evo kako bi mogao da izgleda skript "primer.php" Listing4:

- 22 -


Listing4 : primer PHP skripte za primanje I obradu podataka iz HTML obrazca

Znai, kada popunimo polje "IME" na stranici sa formularom, i kliknemo na

dugme za slanje, sadraj ovog polja e primiti varijabla "$ime" u PHP skriptu na stranici "primer.php", te e se uz pomo instrukcije "echo" prikazati vrednost date varijable.

Slika6: Izlaz listinga4

Vase ime je : Dragoslav

Slika5 : Izlaz PHP skripte primer.php

4.7 NEKE OD OSNOVNIH PHP TEHNIKA

4.7.1 IF iskaz: IF iskazi su neophodni u programiranju funkcionalnih sajtova. Ako zelimo da proverimo odnosno uporedimo dve ili vie vrednosti koristiemo IF iskaz. Sintaksa IF iskaza je jednostavna I najbolje bi bilo da se opie uz pomo jednostavnog primera : Recimo da korisnik unosi jedan broj u varijablu $broj i da nasa skripta provera.php proverava da li je taj broj vei od 10 ili ne . Evo koda ovog primera :

$broj = 14; if ( $broj > 10 ) { echo "Uneti broj je vei od 10!";} echo "Uneti broj nije vei od 10!";

Listing5 : primer koda IF iskaza

- 23 -


4.7.2 WHILE petlja:

Nakon "If" strukture prelazimo na obradu najjednostavnijeg tipa petlji u PHP-u, a to je "While" petlja. Struktura i sintaksa u PHP-u je vrlo slina sintaksi ove petlje u programskom jeziku C:

while (izraz) naredbe

Semantika same petlje je vrlo jednostavna, ona "kae" PHP-u da ponavlja izvravanje ugraenih naredbi, sve dok je ispunjen uslov, tj. dok je vrednost "izraza" TRUE. Vrednost izraza se proverava samo na svakom poetku ponavljanja petlje, tako da ako se ova vrednost promeni tokom izvravanja ugnedenih instrukcija, izvrenje se nee prekinuti do kraja date iteracije. U sluaju da je vrednost "izraz"-a FALSE, nee se izvriti ugnedene naredbe, a izvrenje programa e se prebaciti na sledeu instrukciju koja dolazi nakon petlje. Kao i kod "IF" grananja, i ovde moete grupisati vie instrukcija unutar jedne "While" petlje, i to uz pomo vitiastih zagrada, ili uz korienje alternativne sintakse:

while (izraz) : ...naredbe... endwhile;

U sledeim redovima moete videti dve "While" petlje, napisane na dva naina, koje "tampaju" cifre od 1 do 10:

Listing6 : Primer koda WHILE petlje Kao to vidite, ovde smo upotrebili inkrementalni operator (++) koji uveava

vrednost varijable "$a", i to nakon njenog tampanja.

- 24 -


Slina prethodnoj "While" petlji je "Do...While" petlja, a razlika je samo u poziciji proveravanja "izraz"-a. Kod ove petlje provera istinosne vrednosti izraza se vri na kraju petlje svake iteracije. Glavna razlika je u tome to e se kod ove druge petlje (do...while) prva iteracija svakako izvriti, za razliku od "While" gde se moda nee izvriti ni jedna iteracija (u sluaju da je vrednost izraza FALSE).

Listing7 : Primer koda DO WHILE petlje Prethodna petlja e se izvriti tano jedanput, jer se nakon prve iteracije proverava izraz ($a>0), koji e imati vrednost FALSE. Zbog ove vrednosti izraza petlja e prekinuti dalje izvravanje 4.7.3 FOR petlja: Za razliku od "jednostavne" sintakse "While" petlje, "For" petlja ima najsloeniju sintaksu u PHP-u (vrlo slinu C-u). Struktura i sintaksa je ove petlje je sledea:

for (izraz1; izraz2; izraz3) naredba

Prvi izraz (izraz1) se proverava (izvrava) samo jednom (bezuslovno), i to na poetku petlje. Na poetku svake iteracije proverava se drugi izraz (izraz2). Ukoliko je istinosna vrednost ovog izraza TRUE, petlja se nastavlja i izvrava se ugnedena instrukcija(e). Ukoliko je vrednost izraza FALSE, prekinue se izvravanje petlje. Takoe, na kraju svake iteracije petlje proverava se (izvrava se) trei izraz (izraz3). Svaki od nabrojanih izraza moe biti "prazan", tj. ne mora sadrati nikakav izraz. Ako je na primer, drugi izraz "prazan" petlja e se ponavljati nedefinisan broj puta. Da pogledamo par primera za FOR petlju.

- 25 -


Listing8 : Primer koda FOR petlje Od ova etiri primera, prvi je svakako najjasniji. U drugom primeru je prikazan "prazan" drugi izraz, pa imamo nedefinisan broj iteracija petlje. Ali, tu smo upotrebili "If" grananje i instrukciju "break", kojom izlazimo iz petlje (petlja se prekida) kada vrednost varijable "$b" bude 11 (nakon toga vrimo tampanje vrednosti varijable). Trei primer je specifian jer su sva tri izraza "prazna" (nedefinisana). Tako da e se data petlja izvravati u zavisnosti od prirode ugnedenih naredbi. PHP naravno, obezbeuje i alternativno definisanje "For" petlje (sa dvotakom):

for (izraz1; izraz2; izraz3): ...naredba; ...; endfor;

- 26 -


4.8 UPOTREBA KOLAIA (cookies) Vrednosti veine promenljivih nestaju nakon to PHP skript, u kome se nalaze, zavri rad. Kolaii su , za razliku od toga , promenljive koje mogu da postoje neogranieno dugo. Poto njihove vrednosti mogu da ostanu stalne , onda pretraiva korisnika uva kolaie da korisnikovom lokalnom disku. Kolaii mogu biti od koristi na razliite naine. Na primer, mnogi sajtovi koriste kolaie za uvanje identiteta korisnika i njegovih osobina . Kada se korisik vrati na taj sajt , kolai omoguava pretraivau da prepozna korisnika i da obnovi opcije koje je korisnik podesio. Recimo da na sajtu za elektronsku trgovinu koja prodaje razne artikle , od odee , knjiga pa sve do kua i brodova, omoguimo korisniku da izabere koja ga oblas najvie interesuje. Sledeiput kada korisnik poseti sajt automatski e dobiti novosti u oblasti koja ga najvie ineresuje. Na alost, kolaii nisu savreni nain za stalno skladitenje podataka. Kod njih postoje razliita ogranienja. Na prime ;

Korisnik moe da iskljui kolaie ako podesi odgovarajuu opciju u svom pretraivau.

Pod izvesnim okolnostima, kolaie mogu da vide i drugi korisnici , a ne samo oni kojima kolaii pripaduaju

Sajt moe da na disku korisnika smesti samo 20 kolaia i 4 KB inaformacija

Neke verzije popularnih pretraivaa imaju greke i ne mogu da koriste kolaie na pravilan nain

Uprkos pomenutim ogranienjima , kolaii su i dalje najpopularnija tehnika za stalno skladitenje podataka. Zbog toga ih je vano spomenuti

Primeri upotrebe cookie-a :

Programski kod koji kreira kolaie, iz razloga efikasnosti, trebao bi biti pozicioniran na poetku web stranice pre bilo kog drugog koda.

Cookie fajlove potrebno je smestiti u root direktorijum sajta kako bi ga mogli koristiti sa bilo koje pozicije vaeg web sajta.

Sledi programski kod kojim kreiramo varijablu cookie:

- 27 -


Kreiranjem i postavljanjem ovog koda, kada posetioc ponovo doe na tekuu stranicu ili bilo koju drugu PHP stranicu u tekuem folderu (ili bilo kom podfolderu), postavljeni kolai bie dostupan za "konzumiranje". Ukoliko bi sada komandom ECHO ispisali vrednost varijable - $_COOKIE["cookie"], dobili bi nazad "kolach".

Nadalje, ukoliko elite da postavite expire vremenski rok kolaia, dodaete samo jo jedno polje sa koliinom vremena (u sekundama) koja treba da protekne do "isteka vanosti":

Broj kolai-varijabli nije ogranien, tako da uvek moete postaviti vie od jendog kolaia:

I konano, kolaie je mogue i izbrisati, ukoliko vam vie nisu potrebni, upotrebom gorenavedene instrukcije setcookie, samo to ovaj put varijabli neemo dodeliti nikakvu vrednost. Postaviemo jo jednu setcookie funkciju samo sa nazivom varijable:

- 28 -


5 BAZE PODATAKA

Jedan od moda najvanijih delova sajtova za elektronsku trgovinu jesu baze podataka. U njima se skladite podaci o svim proizvodima , kao i njihovim karakteristikama , koliini , ceni i jo mnogo drugih vanih informacija. Poto se najee sa PHP-om koristi MySQL baza podataka u narednom delu u predstaviti tehniku upotrebe PHP i MySQL tehnologije. Podsetimo se samo da PHP podrava i ostal populare baze podatak kao PostgreSQL, dBase, Oracle, ODBC

- 29 -


5.1 UPOTREBA MYSQL BAZA PODATAKA

PHP ima celu biblioteku funkcija koje ine interfejs prema MySQL sistemu za upravljanje bazama podataka. Preko ovih funkcija , PHP program moe da pristupi i da menja podatke, koji se nalaze u MySQL bazi podataka. Interakcije sa bazama podataka se uglavnom se odvijaju po sledeem obrascu :

Uspostavlja se veza sa MySQL serverom Definie se baza podataka kojoj se pristupa Izvravaju se SQL upiti, pristupas e rezultatima tih upita i obavlja ju se

druge operacije koje nisu u direktnoj vezi sa SQL-om Prekida se veza sa MySQL-om

Povezivanje sa MySQL serverom Za povezivanje sa MySQL serverom koristiemo funkciju mysql_connect() koja ima sledei oblik: mysql_connect(hostname , username, password) Hostname predstavlaj adresu servera na kome se nalazi baza podataka , username predstavlja MySQL korisnika a password predstvlja lozinku koja je pridruena tom korisniku. Izbor baze podataka Nakon to smo uspostavili vezu sa MySQL serverom, program moe da definie bazu podataka kojoj treba da se pristupi. Ovo emo uraditi uz pomo funkcije mysql_select_db() koja ima sledei oblik mysql_select_db(baza podataka) Gde je baza podataka ime baze kojoj pristupamo. Funkcija fraa TRUE ako je u stanju da pristupi bazi podataka, u suprotnom vraa FALSE. Prekidanje veze sa MySQL serverom Ako elite da prekinete vezu ssa MySQL serverom, moete da upotrebite funkciju mysql_close(), koja ima sledei oblik :

mysql_close() NAPOMENA : korienje MySQL-a je veoma opiran pojam kao i upotreba PHP , tako da sam ja samo spomenuo neke osnovne stvari da bi vam doarao mo ovih tehnologija.

- 30 -


6 PROJEKAT 6.1 INDEX Izgled same web stranice je od velikog znaaja jer pri poseti korisnik prvo to upava jeste dizajn stranice. Pod ovim se podrazumeva da je sadraj stranice pregledan , raspored sadraja da je adekvatno pozicioniran i da je odvojen od drugih delova stranice. Veina stranica na internetu se dre proverenog ablona , tako da je gotovo uvek sigurno pridravati se njega. To izgleda ovako :

Banner Meni Sadraj Footer (tekst na dnu stranice)

Sledea slika pokazuje kako sam zamislio raspored i dizajn ovoe web aplikacije :

Slika8 : Index stranica web aplikacije

1. Banner 2. Meni 3. Glavni prozor (sadraj 4. Footer (u ovom sluaju iskorien i kao reklamni prostor)

- 31 -


6.2 MENI Ono to svaki web sajt treba da poseduje jeste meni za navigaciju. Obimnost ovih menija za navigaciju zavisi i od obimnosti web sajtova nakojima se nalaze kao i broja funkcija koje web sajt izvrava. Tako da krstarei po internetu nailazimo na menije koji se sadre od svega dva ili tri linka pa do onih koji imaju i vise desetina linkova. to se tie menija za web aplikaciju za internet online oglase, o kojoj je re u ovom radu , obimnost mu je svedena na minimum koji zadovoljava sve potrebe za uspeno korienje ove aplikacije. Poto na ovom sajtu postoji registracija korisnika poeljno je bilo da se naprave dva menija , jedan za ne registrovane korisnike i jedan ,malo opirniji za registrovane korisnike. Kako ovo izgleda predstavljaju sledee slike : Meni za ne regitrovane korisnike sadri svega tri linka i to :

1. Index za povratak na poetnu stranicu 2. Pregled za pregled ve postojeih oglasa 3. Login odnosno u ovom sluaju registracija novog

korisnika 4. Kao i info poruku da je korisnik ne registrovan

Slika9 :Meni za neregistrovane korisnike

Meni za regitrovane korisnike sadri pored menija za ne registrovane korisnije jos i :

1. Pretraga omoguava pretraivanje oglasa 2. Predaj_oglas predaja novih oglasa 3. Moji_oglasi pregled oglasa iji je autor korisnik 4. Privatne_poruke pregled privatnih poruka (u linku se

nalazi i broj trenutnih poruka) 5. Podesavanja izmena ve postojeih podataka o korisniku 6. ADMIN link ka administraciji sajta (prikazuje se samo

korisnicima sa ADMIN pravom) 7. Info poruka o broju preostalih oglasa za predaju

Slika10 : Meni za registrovane korisnike

- 32 -


7 RAZVOJ Posle predstavljanja osnovnih tehnika za roazvoj web aplikacije za internet online oglase vreme je da objasnim sam razvoj istog. Zbog preobimnosti objanjavanja kompletnog postupka kao i samog koda web aplikacije odluio sam da razvoj predstavim objanjavanjem odreenih funkcija web sajta koje predstavljaju kljuni faktor za funkcionisanje. Uz adekvatno objanjenje funkcionalnosti pokuau da predstavim i pojedine delove samog koda i da ih objasnim. Ovo smatram neizostavnim jer mislim da e na taj nain shvatanje funkcionisanja ove aplikacije biti u mnogome pojednostavljen.

7.1 SPISAK MySQL TABELA Pre nego to ponemo sa objanjavanjem funkcionalnosti same aplikacije , treba dati na uvid sve potrebne tabele u bazi koje e nam sluiti sa pohranjivanje podataka tokom rada web aplikacije. U sledeim listinzima prikazane su sve tabele.

grad Field Type Null Default Comments

grad_ID int(11) No grad varchar(30) No

kategorija Field Type Null Default Comments

kategorija_ID int(11) No kategorija text No

news Field Type Null Default Comments

news_ID int(11) No news text No slika text No

pvm Field Type Null Default Comments

pvm_ID int(11) No za_user text No od_user text No od_mail text No datum text No poruka text No

- 33 -


oglas Field Type Null Default Comments

oglasi_ID int(11) No title text No oglas text No cena text No datum text No link text No br_pregleda int(11) No 0 tip_oglasa int(11) No 0 grad text No kategorija text No user text No mail text No tel1 text No tel2 text No

users Field Type Null Default Comments

users_ID int(11) No username varchar(30) No password varchar(50) No mail varchar(50) No ime varchar(30) No prezime varchar(30) No tel1 text No tel2 text No adresa text No br_dozv_oglasa int(11) No 5 grad text No admin int(11) No 0 limit2 int(11) No 20

- 34 -


8 FUNKCIJE Za prikazivanje u ovom radu izabrao sam sledee funkcije :

Instalacija Registracija novog korisnika Registracija ve postojeeg korisnika (login) Pregled oglasa Predaja oglasa Brisanje oglasa Pretraga oglasa Podeavanja Privatne poruke Administracija

o Korisnici o Gradovi o Kategorije o Vesti

U opisu gore navedenih funkcija mogue je da e se spominjati neke koje nisam naveo ali iz ve navedenih razloga ih neu objanjavati.

- 35 -


8.1 INSTALACIJA Da bi smo uspeno mogli koristiti ovu aplikaciju na jednom od web servera prvo

to treba da uradimo jeste da je instaliramo. to se tie web servera on mora da podrava PHP kao i MySQL jeru protivnom aplikacija nee raditi. Ono to se oekuje da pored ovoga na serveru ve postoji , ako ne onda bi administrator trebao da obezbedi , jeste baza podataka sa imenom diplomski2. Ovako je po standardu , mada se lako moe izmeniti na sledei nain:

U root direktorijumu postoji fajl po imenu config.php koji izgleda kao na listingu

ispod ,

Uoavamo 4 promenljive :

$database ime baze podataka na serveru $host adresa servera na kome se nalazi web aplikacija $username korisniko ime za pristup bazi podataka $password lozinka za pristup bazi podataka

U sluaju da se na serveru baza drugaije zove , kao npr. oglasi , da nas je administrator registrovao po korisnikim imenom korisnik i sa lozinkom sifra123 , u tom sluaju bi trebali izmeniti fajl config.php da izgleda kao na lsitingu ispod.

Promenljivu $host nismo menjali jer se u veini sluajeva sve nalazi na jednom serveru , odnosno na raunaru gde se i nalazi naa aplikacija pa zbog toga e vrednost localhost omoguiti nesmetan rad web aplikacije. Ovo se odnosi na prilagoavanje sajta serveru na kom se nalazi. Bez ovoga bi bilo nemogue izvravanje aplikacije . Ovo nije potrebno samo za instalaciju ve e se vei deo sajta oslanjati na ove podatke koji su potrebni za svaki pristup bazi podataka kao i za itanje tako i za upis podataka u nju.

- 36 -


Kada smo izvrili pravilnu izmenu config.php fajla sada je potrebno da preemo na instalaciju same aplikacije. Ovo emo uraditi tako to emo da pokrenemo install.php fajl. NAPOMENA : u daljem tekstu bie dosta rei o adresi fajlova kao i same aplikacije. S obzirom da se aplikacija nalazi na raunaru za kojim i sedim (na kojem je takoe instaliran i web i mysql server) onda je pristup omoguen preko sledece adrese http://localhost/diplomski/ gde localhost predstavlja adresu servera a diplomski predstavlja direktorijum na serveru gde se nalazi aplikacija. Unoenjem adrese http://localhost/diplomski/install.php u na web browser dolazimo do jednostavne HTML forme preko koje emo da unesemo osnovne podatke o administratoru i da potom instaliramo i potrebne tabele u bazi podataka za rad nae aplikacije.

Slika11 : HTML forma za unos podataka o administratoru

i instaliranje aplikacije Iz ove slike zakljuujemo da imaju tri tekst polja (text box-a) i to : jedan za unos korisnokog imena(iji je naziv promenljive admin_username) i druga dva za unos lozinke (admin_password i admin_password2). Nazivi promenljivih za data polja su nam potreba kasnije u kodu za prihvaanje vrednosti koje se unose. Ovde vidimo da moramo dva puta da unesemo lozinku (identine) pa da razjasnim zato. Poto su polja za unos lozinki zatiena , nije dozvoljen pregled ta se unosi, nego korisnik vidi samo zvezdice (****) i ako bi bilo samo jedno polje postoji mogunost da korisnik unese sluajno pogrenu lozinku koja e se uneti u bazu. Zbog ovoga se primenjuje unos dva puta iste lozinke koje se kasnije u kodu proveravaju da li su identine. Admin Password

HTML kod koji pravi tekst polje za unos lozinke (zatieno zvezdicama)

Slika11Izgled zatienih polja u web browseru

- 37 -


Da bismo shvatili kako ovo sve radi , prikazau kod iz install.php fajla i objasniti najbitnije delova za ta slue. 1 2 3 4 5 6 7 8 Instalacija online oglasa 9 10 11 12 13 14 15 16 Admin Username 17 Admin Password 18 Admin Password 19 20 21 22 23 24 25 26 pomoc 27 28 29 30 31 32 33 34 35

HTML kod za kreiranje install forme Objasnjenje po linijama koda :

1 Kreiranje HTML forme za slanje podataka ka install.php stranici kojoj smo jos dodelili vrednost install promenljivoj action

5 Kreiranje tabele sa odreenim parametrima 16,17,18 Kreiranje polja za unos podataka 23 Kreiranje dugmeta za potvrdu slanja podataka iz forme 26 Kreiranje teksta pomoc sa hyperlinkom ka install_help.php stranici 35 Kraj forme

NAPOMENA : u priloenim listinzima koda brojevi linija su naknadno postavljeni tako da u originalnom kodu nesmeju da budu.

- 38 -


Poto smo kreirali formu za unos podataka sada u da predstavim kod za primanje tih podataka kao i za kreiranje tabela u MySQL bazi i na kraju unos podataka ako sve proe bez problema. Napominjem da se i ovaj kod nalazi u install.php fajlu.

Postupci su sledei :

Prihvatanje podataka iz HTML forme Provera podataka Konektovanje na MySQL bazu Kreiranje tabela Unos podataka iz HTML forme u bazu Kraj

1 $admin_username_buff = $_POST['admin_username']; 2 $admin_password_buff = $_POST['admin_password']; 3 $admin_password2_buff = $_POST['admin_password2']; 4 5 6 if($HTTP_GET_VARS['action']=='install' AND $admin_password_buff == $admin_password2_buff 7 AND $admin_username_buff != "" OR $admin_password_buff != "" ) { 8 9 echo ""; 10 mysql_connect($host, $username, $password) or die(mysql_error()); 11 echo ""; 12 echo "Uspesno konektovanje na bazu"; 13 echo ""; 14 15 mysql_select_db($database) or die(mysql_error()); 16 17 echo ""; 18 echo "Uspesna selekcija baze"; 19 echo ""; 20 mysql_query("CREATE TABLE ùsers` ( 21 ùsers_ID` INT NOT NULL AUTO_INCREMENT , 22 ùsername` VARCHAR( 30 ) NOT NULL, 23 `password` VARCHAR( 50 ) NOT NULL, 24 `mail` VARCHAR( 50 ) NOT NULL, 25 ìme` VARCHAR( 30 ) NOT NULL , 26 `prezime` VARCHAR( 30 ) NOT NULL , 27 `tel1` TEXT NOT NULL , 28 `tel2` TEXT NOT NULL , 29 àdresa` TEXT NOT NULL , 30 `br_dozv_oglasa` INT NOT NULL DEFAULT '5' , 31 `grad` TEXT NOT NULL , 32 àdmin` INT NOT NULL , 33 `limit2` INT NOT NULL DEFAULT '20', 34 PRIMARY KEY ( ùsers_ID` ) 35 ) TYPE = MYISAM ;" ) or die(mysql_error()); 36 37 echo ""; 38 echo "Uspesno kreirana tabela users"; 39 40 // .. Kreiranje ostalih tabela na isti nain kao i tabele users

PHP kod za prihvatanje podataka i HTML forme kao i za kreiranje tabela u bazi

- 39 -


Objanjenje po linijama koda : 1,2,3 Definisanje novih promenljivih kojima se dodeljuju vrednosti iz

HTML forme 6 Proveravamo da li je vrednost promenljive action jednaka sa

install , da li je unesena vrednost za korisniko ime, podudaraju li se uneene lozinke i ako su svi uslovi ispunjeni prelazimo na dalje izvravanje koda , u suprotnom ne deava se nita i oekuje se novi unos podataka.

10 konekcija na MySQL bazu sa odreenim parametrima 12 ispis info poruke 20 kreiranje tabele sa nazivom users koja sadri sledee kolone :

users_ID , username, password, mail, ime, preyime, tel1, tel2, adresa, br_dozv_oglasa, grad, admin, limit2

Postupak iz linije dvadeset se ponovlja jos pet puta za kreiranje ostalih tabela

potrebnih za rad web aplikacije.

Ako sve do sada proe bez greaka , na kraju nam ostaje jo da u tek kreirane tabele (u ovom sluaju e to biti tebela users) unesemo podatke koje je korisnik uneo preko HTML forme. Sledei listing pokazuje kod koji ovo izvrava. 1 mysql_query("INSERT INTO users(users_ID,

username, password, mail, ime, prezime, tel1, tel2,

adresa, br_dozv_oglasa, grad, admin) 2 VALUES(NULL,'".$admin_username_buff."', '".md5($admin_password_buff)."', 'localhost@localhost', 'Administrator', 'Administrator', '127.0.0.1', '127.0.0.1', 'localhost', 50 , 'Internet',1) ") or die(mysql_error()); 3 // mysql_close(); 4 mkdir("./usere/".$admin_username_buff , 0777, true); 5 echo ' Uspesno ste instalirali 0nline oglase 6 Redirect sledi... ' ; 7 echo '';

PHP kod za unos podataka u tabelu users u bazi podataka

- 40 -


Objanjenje po linijama koda: 1 izvravamo upit (query) INSERT INTO koji nam govori da unosimo

podatke u tabelu users odreenim redosledom ... 2 postavljamo vrednosti koje e da se upu u bazu podataka .Treba

obratiti panju na redosled podataka kojimora biti identian kao to je navedeno u liniji 1.

5 ispisujemo info poruku sa propratnom slikom 7 automatski redirekt ka index.php stranici posle tri sekunde.

Posle uspene instalacije uz pomo install.php fajla web browser bi trebao da izgleda kao na sledeoj slici :

Slika12 :Uspeno izvrena instalacija web aplikacije

- 41 -


8.2 REGISTRACIJA NOVOG KORISNIKA Radi spreavanja nekontrolisane predaje oglasa , to bi tokom vremena dovelo do nagomilavanja nepotrebnih stvari a kasnije moda ak i do prestank funkcionisanja web aplikacije , odluio sam da uvedem registraciju korisnika. Na ovaj nain moemo da limitiramo odreene korisnike tako to emo im odrediti maksimalan broj oglasa koje mogu da objavljuju u istom vremenskom intervalu. Takoe u sluaju da pojedini korisnik se ne pridrava pravila o postavljanju oglasa na web sajtu , jednostavnom akcijom administratora korisnik moe da bude izbrisan kao i svi njegovi trenutni online oglasi. Registracija novog korisnika treba da bude jednostavna , brza i da ne predstavlja veliki problem korisnicima jer u suprotnom moe da dovede do neeljenih posledica kao na primer da odvrati korisnika od upotreba aplikacije. O HTML formama je bilo ve rei i mislim da nema potrebe da ponovo objanjavam iste. Na sledeoj slici je prikazana forma za registraciju novog korisnika sa koje se jasno vide ta se zahteva za uspenu registraciju.

Slika13 HTML forma za registraciju novog korisnika

Moda treba napomenuti to da se u padajuem meniju za ibor grada nalaze svi gradovi koje je administrator naveo u CMS-u.

- 42 -


Pozivajui login.php?act=add_user fajl (gde promenljivoj act dajemo vrednost add_user) preko login.php fajla pokreemo funkciju html_add_user() koja je definisana u html.php fajlu i slui za prikaz gore navedene forme za registraciju novog korisnika. Posle unosa potrebnih podataka za registraciju pritiskom na dugme Registruj me saljemo uneene podatke prema fajlu add_user2.php gde e se izvriti provera i kasnije unos podataka u bazu. 1 function registruj() { 2 $add_username_buff = $_POST['add_username']; 3 $add_password_buff = md5($_POST['add_password']); 4 $add_password_buff2 = md5($_POST['add_password2']); 5 $add_email_buff = $_POST['add_mail']; 6 $add_ime_buff = $_POST['add_ime']; 7 $add_prezime_buff = $_POST['add_prezime']; 8 $add_gradd_buff = $_POST['add_gradd']; 9 $add_adresa_buff = $_POST['add_adresa']; 10 $add_telefon1_buff = $_POST['add_telefon1']; 11 $add_telefon2_buff = $_POST['add_telefon2']; 12 $num1 = chek_username($add_username_buff); 13 $num2 = chek_password($add_password_buff , $add_password_buff2); 14 $num3 = chek_email($add_email_buff); 15 $num4 = chek_tel($add_telefon1_buff); 16 if($num1 + $num2 + $num3 + $num4 == 0) { 17 mysql_query("INSERT INTO users(users_ID, username, password,

mail, ime, prezime, tel1, tel2, adresa, br_dozv_oglasa, grad, admin)

VALUES(NULL,'".$add_username_buff."', '".$add_password_buff."', '".$add_email_buff."', '".$add_ime_buff."', '".$add_prezime_buff."', '".$add_telefon1_buff."', '".$add_telefon1_buff."', '".$add_adresa_buff."', 5 , '".$add_gradd_buff."',0) ") or die(mysql_error()); // mysql_close(); 18 echo ' Uspesno ste se registrovali Redirect sledi... ' ; 19 echo ''; } 20 else { 21 echo ' Greska pri registraciji ....Proverite unos podataka !!!!! '; echo ""; 22 if($num1==1) echo 'Proverite username'; 23 if($num2==1) echo 'Proverite password';

- 43 -


24 if($num3==1) echo 'Proverite e-mail'; 25 if($num4==1) echo 'Proverite telefon 1'; 27 echo 'Pokusajte ponovo Login'; } } Objanjenje po linijama koda (funkcija registruj()) :

1 definisanje funkcije registruj() 2-11 definisanje variabli sa vrednostima iz HTML forme za registraciju

korisnika 12-15 pozivanje funkcija za proveru validnosti pojedinih podataka kao

na primer : korisnicko ime tj. username (da li ve postoji u bazi neki drugi korisnik sa istim korisnikim imenom) , lozinka (da li se obe unete lozinke podudaraju) , e-mail adresa (da li je validnog formata) kao i broj telefona.

16 ako se provera podataka sprovede bez greke prelazimo na unos podataka u bazu.

17 unos podataka u bazu 18 ispis info poruke 19 automatski redirekt ka stranici za login 20 u suprotno da provera podataka proe neuspeno 21 ispis info poruke 22-25 pomo pri ukazivanju ta je pogreno uneseno 27 link ka ponovnom pokuaju registracije novog korisnika.

NAPOMENA : lozinka se u bazi uva hashovana uz pomo MD5 algoritma to znai da je vie nemoemo vratiti u prvobitni. PHP nam omoguava veoma brz nain korienja MD5 algoritma. 3 $add_password_buff = md5($_POST['add_password']); 4 $add_password_buff2 = md5($_POST['add_password2']);

Poruka posle uspene registracije Poruka posle neuspele registracije

- 44 -


8.3 LOGIN Kada smo se uspeno registrovali sada ostaje jo da se prijavimo na sajt unosom registrovanog korisnikog imena i lozinke. Izborom Login u meniju browser e nam otvoriti login stranicu koja izgleda kao na slici ispod :

Izgled login stranice Pored HTML forme za unos korisnikog imena i lozinke na ovoj stranici je i link ka registraciji novog korisnika. Ovde moemo primetiti i jednu info poruku koja nas obavetava da moramo omoguiti rad cookie-a da bi smo se mogli uspeno registrovati. U ovom projektu sam se odluio samo za cookie kako zbog jednostavnosti izrade tako i objanjenja rada istih. NAPOMENA : tehnika koja je zastupljena u ovom projektu a koja se odnosi na upotrebu samo cookie-a nije ba najbolji izbor. Takoe i upotreba cooke-a na nain koji je prikazan ovde nije najbolje reenje jer ovde u kolaiima uvamo isto korisniko ime i na taj nain saj prepoznaje korisnika. U drugim sluajevima , kada sajt ide direktno online upotreba kolaia je malo drugaija : u kolaiima se uva ili hashovana lozinka i korisniko ime , ili hashovana random re koja je u bazi zabeleena za svakog korisnika. Postoji mnogo naina za prepoznavanje korisnika meu kojima je i upotreba sesija (session) ali sam se ja odluio samo za cookie (kolaie) i to na najjednostavniji nain da bi to jasnije prikazao njihovo funkcionisanje i upotrebu istih. Nakon unosa traenih podataka , HTML forma ih prosleuje funkcija koja se zove user_chek() koja je definisana u login_chek.php fajlu. Kod ove funkcije izgleda ovako :

- 45 -


1 function user_chek() { 2 if($_COOKIE['teste']=="") { echo 'da bi se uspesno logovali morate omoguciti rad COOKI-a !!! '; } else { 3 mysql_konekcija(); 4 $user_buff = $_POST['username']; 5 $pass_buff = md5($_POST['password']); 6 $result = mysql_query("SELECT password FROM users WHERE username LIKE '".$user_buff."'"); 7 if(!$result || (mysql_numrows($result) < 1)){ echo ''; 8 echo "Pogresan username ili password"; echo ""; 9 echo 'Pokusajte ponovo'; } else { 10 while($row = mysql_fetch_array( $result )) { if($pass_buff == $row['password']) { 11 setcookie("usere" , "".$user_buff.""); echo ' Uspesno ste logovani ! ' ; echo ""; 12 echo ''; echo 'Ukoliko vas browser ne redirectuje automatski klikni te ovde'; } } } } }

Prikaz PHP koda funkcije user_chek() koja se koristi za proveru identiteta korisnika Objanjenje po linijama koda :

1 definisanje funkcije user_chek() 2 proveravamo postojanje cookie-a test koji je trebao biti kreiran

odmah po uitavanju stranice i u sluaju da ne postoji ispisuje se obavetenje da se upotreba cookie-a omogui od strane korisnika

3 poziv funkcije za konekciju na bazu podataka 4-5 preuzimanje podataka iz HTML forme 6 provera postojanja korisnika u bazi 7,8,9 ako korisnik nije pronaen u bazi spisuje se info poruka 11 poto je korisnik pronaen u bazi kreira se cookie (kola) usere koji

sadri username (korisniko ime) logovanog korisnika. Na osnovu ovog kolaia web aplikacija e u daljem radu tano znati o kom se korisniku radi.

- 46 -


8.4 PREGLED OGLASA

Pregled oglasa je dozvoljen i ne registrovanim korisnicima. Ovo je jedan od vanijih delova web sajta jer veina korisnika e najveim delom korisniti ovu funkciju.

Pre svega ovde posebno treba da se obrati panja na sam dizajn odnosno na preglednost sadraja oglasa. Kako je vana preglednost tako je vano i da se sve potrebne informacije nau u tom oglasu , kako sam tekst oglasa tako i ko ga je postavio , broj telefona , cena ...

Pvro to se uoi kada se otvori stranica za pregled oglasa jeste forma za izbor grada i kategorije.

forma za izbor grada i kategorije

Po izboru eljenog grada i kategorije , pritiskom na dugme prikaz izlistae se

svi oglasi koji ispunjavaju traeni kriterijum. Oglasi su sortirani tako da je prvi (najgornji) oglas najnoviji.

Na slici su prikazani oglasi za kriterijum grad : Beograd i kategorija : Racunari

- 47 -


Ono to treba da se primeti jeste da svaki oglas poseduje identine informacije i to sledee :

Ko je predao oglas Datum predaje oglasa Link za slanje privatne poruke korisniku koji je autor oglasa Tekst oglasa Telefon autora E-mail adresa autora Opciono cena

NAPOMENA : oglasi se prikazuju u tabelama. Potrebno je samo definisati osnovnu tabeluu kojoj e se prikazivati tekst oglasa i informacije vezane za njega. Kasnije se samo uz pomo WHILE petlje itaju oglasi iz baze i pravi se onoliko tabela koliko i postoji oglasa u bazi koji zadovoljavaju birani kriterijum. Da vidimo kod za prikaz oglasa : 1 $result4 = mysql_query("SELECT * FROM oglas WHERE kategorija LIKE '".$pregled_kat_buff."' AND grad LIKE '".$pregled_grad_buff."' ORDER BY oglasi_ID DESC LIMIT $set_limit, $limit"); 2 while($row4 = mysql_fetch_array($result4)) { 3 echo' Oglas predao :'.$row4['user'].' '.$row4['datum'].' 4 '.$row4['oglas'].' : '.$row4['tel1'].' : '.$row4['mail'].' : '.$row4['cena'].' '; }

- 48 -


Objanjenje po linijama koda : 1 Izvravanje upita nad bazom gde se biraju svi oglasi koji

odgovaraju zadatom kriterijumu odnosno pripadaju biranom gradi i kategoriji

2 WHILE petlja koja nam omoguava itanje svih oglasa koji zadovoljavaju zadati kriterijum.

3 kreiranje tabele za prikaz oglasa 4 kreiranje polja u tabeli gde e se prikazati tekst oglasa. Ovde je

interesantno i to da se za ovo polje pozivamo na klasu glas_text koja odreuje grafiki dizajn samog polja i koja je definisana u design.css fajlu.

NAPOMENA : kako je kreirano polje za tekst oglasa tako se kreiraju i polja za ostale informacije vezane za taj oglas.

8.5 PREDAJA OGLASA Jo jedan od bitnijih delova web sajta jeste predaja oglasa. Za razliku od pregleda oglasa koji je dozvoljen svim posetiocima sajta , predaja oglasa je ograniena samo na registrovane korisnike. Iz menija koji je dozvoljen samo registrovanim korisnicima izborom linka Predaj oglas dolazimo do stranice koja sadri formu za unos novog oglasa. Ta forma je prikazana na sledeoj slici :

HTML forma za predaju oglasa

- 49 -


Kao to se vidi na slici , od korisnika se trai da izabere kategoriju iz ponuene liste, zatim da unese tekst oglasa. Duina oglasa je ograniena na tri stotine (300) karaktera i ova funkcija je izvrena uz pomo jednostavne JAVA skripte , koju neu detaljno objanjavati jer JAVA nije tema ovoga rada. Posle unosa teksta potrebno je izabrati grad za koji e oglas vaiti , opciono uneti cenu i pritiskom na dugme Dodaj oglas proslediti ove podatke PHP funkciji koja e ih obraditi i pohraniti u bazu podataka. Funkcija za predaju oglasa (pohranjivanje podataka u bazu) naziva se predaja() i definisana je u fajlu predaja_add.php Prihvatanje podataka iz HTML forme vrimo na sledei nain : $predaja_datum_buff = $_POST['predaja_datum']; $predaja_kat_buff = $_POST['predaja_kat']; $predaja_oglas_buff = $_POST['predaja_oglas']; $predaja_grad_buff = $_POST['predaja_grad']; $predaja_cena_buff = $_POST['predaja_cena']; $predaja_user_buff = $_POST['predaja_user']; Provera validnosti podataka : if ($predaja_datum_buff == "" || $predaja_kat_buff == "" || $predaja_oglas_buff == "" || $predaja_grad_buff == "" || $predaja_user_buff == "" ) { echo ' Oglas nije predat ! Uneseni podaci za oglas nisu validni , molimo vas ponovite unos. '; } Dobijanje podataka o korisniku koji predaje oglas $resultt = mysql_query("SELECT * FROM users WHERE username LIKE '".$predaja_user_buff."'") or die(mysql_error()); while($roww = mysql_fetch_array($resultt )) { $broj_dozvoljenih_oglasa = $roww['br_dozv_oglasa']; $predaja_tel1_buff = $roww['tel1']; $predaja_tel2_buff = $roww['tel2']; $predaja_mail_buff = $roww['mail']; } Provera da li korisnik ima pravo da preda oglas : if($broj_dozvoljenih_oglasa > 0) {

- 50 -


Unoenje podatak u bazu : mysql_query("INSERT INTO oglas(kategorija , oglas , grad , cena, user, datum, tel1, tel2, mail ) VALUES('".$predaja_kat_buff."', '".$predaja_oglas_buff."', '".$predaja_grad_buff."', '".$predaja_cena_buff."', '".$predaja_user_buff."', '".$predaja_datum_buff."', '".$predaja_tel1_buff."', '".$predaja_tel2_buff."', '".$predaja_mail_buff."' ) ") or die(mysql_error()); Umanjivanje broja dozvoljenih oglasa za korisnika i izmena tog podatka u bazi : $broj_dozvoljenih_oglasa--; mysql_query("UPDATE users SET br_dozv_oglasa = '".$broj_dozvoljenih_oglasa."' WHERE username = '".$predaja_user_buff."'"); Ispis info poruke : echo 'Uspesano ste predali oglas'; echo 'Automatski redirekt za par sekundi !'; echo ''; } else { echo ' Nemate dovoljno kredita da predate oglas '; } Predaja oglasa je veoma laka , i brza. Panju sam obratio na to da se korisnik niti u jednom trenutku nae u takvoj situaciji da ne zna ta dalje treba da se radi. Sve je propraeno adekvatnim objanjenjem i mislim da bilo koji korisnik neovisno o njegovom znanju upotrebe interneta moe bez ikakvih problema brzo i jednostavno da preda svoj online oglas.

- 51 -


8.6 PRETRAGA OGLASA Kako bi vreme prolazilo , rastom broja registrovanih korisnika na web sajtu bi doprineo i poveanje broja online oglasa. Samim tim pregled oglasa bi bio sve tei i tei , kasnije moda ak i nemogu, pa zbog toga je gotov i neizostavno omoguiti pretragu predatih oglasa. Pretragu oglasa sam onemegoio ne registrovanim korisnicima da bi ih moda ba to i navelo na registraciju koja bi poboljala statistiku samog web sajta. Registrovani korisnici izborom Pretraga linka iz menija dolaze do stranice za pretragu oglasa. Kako bi se drali pravila ovoga projekta , da sve bude pojednostavljeno do krajnjih granica, tako je i pretraga osiromaena i kao takva omoguava samo osnovnu vrstu pretrage oglasa po gradovima , kategorijama i zadatim reima. Na slici ispod je prikazana forma za pretragu online oglasas :

Izborom eljenog grada i kategorije kao i rei koju elimo da traeni oglas sadri pritiskom na dugme Trai PHP funkcija pretraga_pregled() koja je definisana u fajlu pretraga.php vrsi pretaivanje baze podataka za oglasima koji odgovaraju traenom kriterijumu. Sledei kod prikazuje nain pretrage baze podataka po kriterijum grada , kategorije i traene rei : $result4 = mysql_query("SELECT * FROM oglas WHERE kategorija LIKE '".$pregled_kat_buff."' AND grad LIKE '".$pregled_grad_buff."' AND oglas LIKE \"%$

projekat web aplikacije - internet online oglasi - diplomski

Documents