81
VISOKA ŠKOLA STRUKOVNIH STUDIJA ZA INFORMACIONE I KOMUNIKACIONE TEHNOLOGIJE INTERNET TEHNOLOGIJE TRANSLATE WEB SERVIS U SLIM FRAMEWORKU Z a v r š n i r a d 1

webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

  • Upload
    vandang

  • View
    219

  • Download
    1

Embed Size (px)

Citation preview

Page 1: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

VISOKA ŠKOLA STRUKOVNIH STUDIJA

ZA INFORMACIONE I KOMUNIKACIONE TEHNOLOGIJE

INTERNET TEHNOLOGIJE

TRANSLATE WEB SERVIS U SLIM FRAMEWORKU

Z a v r š n i r a d

Mentor: Student:

Dr Nenad Kojić, dipl. inž. Miloš Maričić 49/11

Beograd, 2016.

1

Page 2: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

VISOKA ŠKOLA STRUKOVNIH STUDIJA

ZA INFORMACIONE I KOMUNIKACIONE TEHNOLOGIJE

INTERNET TEHNOLOGIJE

Predmet: Web programiranje PHP

Tema: „Translate” web servis u Slim framework-u

Ocena ( )

Članovi komisije:

1.

2. __

3. __

2

Page 3: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

Sadržaj1 UVOD......................................................................................................................................5

2 RADNO OKRUŽENJE...........................................................................................................6

2.1 Slim Framework................................................................................................................7

3 ORGANIZACIJA....................................................................................................................8

3.1 Web SERVICE..................................................................................................................8

3.2 Lokalni Sajt.....................................................................................................................10

3.2.1 Organizacija lokalnog sajta.....................................................................................10

3.2.2 Prikaz Translate.......................................................................................................11

3.2.3 Prikaz Log In...........................................................................................................12

3.2.4 Prikaz Create Account.............................................................................................13

3.2.5 Prikaz Admin Page..................................................................................................14

4 KODOVI.................................................................................................................................15

4.1 Web Servis u Slim framework-u.....................................................................................15

4.1.1 Organizacija.............................................................................................................15

4.1.2 rest/v1/index.php.....................................................................................................16

4.1.3 rest/v1/.htaccess.......................................................................................................22

4.1.4 rest/include/Config.php...........................................................................................22

4.1.5 rest/include/DbConnect.php....................................................................................22

4.1.6 rest/include/DbHandler.php....................................................................................23

4.1.7 rest/index.php..........................................................................................................27

4.1.8 rest/style.css.............................................................................................................29

4.1.9 rest/libs....................................................................................................................29

4.2 Lokalni sajt......................................................................................................................30

4.2.1 Organizacija.............................................................................................................30

4.2.2 Translate/index.php.................................................................................................30

4.2.3 Translate/translate.php.............................................................................................31

4.2.4 Translate/createAccount.php...................................................................................34

4.2.5 Translate/admin.php................................................................................................35

4.2.6 Translate/includes/dbConnection.php.....................................................................44

4.2.7 Translate/includes/functions.php.............................................................................45

3

Page 4: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

4.2.8 Translate/includes/logInModal.php.........................................................................50

4.2.9 Translate/includes/session.php................................................................................52

4.2.10 Translate/css/style.css............................................................................................53

5 BAZA PODATAKA.............................................................................................................63

5.1 Web servis baza podataka...............................................................................................63

5.1.1 Struktura baze podataka.........................................................................................64

5.2 Localhost sajt baza podataka...........................................................................................64

5.2.1 Struktura baze podataka.........................................................................................64

6 Z A K L J U Č A K................................................................................................................65

7 LITERATURA......................................................................................................................66

4

Page 5: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

1 UVOD

Mrežni servis (web service) predstavlja način komunikacije između dva elektronska uređaja na

mreži. Ova komunikacija se obično vrši tako što klijent šalje zahtev pomoću mrežnog servisa serveru

i rezultujuća informacija se vraća klijentu u nekom obliku. Danas se koriste dva dominantna mrežna

servisa SOAP i REST (RESTful).

U ovom radu radićemo na Translate web servisu koji je baziran na RESTful servisu čija će

glavna funkcija biti prevod prosleđenih reci na jedan od selektovanih jezika. Prevod reči će biti

baziran na principu reč za reč i podržavaće više jezika koji korisnik može da koristi.

Web servis će imati nekoliko metoda koji komuniciraju sa bazom jezika od kojih će neke

omogućavati korisniku da trazi i dobije prevod tražene reči, a ostale omogućavati privilegovanom

korisniku (adminu) ubacivanje, izmenu ili brisanje iz baze podataka web servisa.

Uz diplomski poželjno je da se napravi sajt koji komunicira sa web servisom, sa odvojenom

zasebnom bazom za korisnike. Sajt treba da pokaže mogućnosti i funkcionalnost zasebnog web

servisa.

5

Page 6: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

2 RADNO OKRUŽENJE

Prilikom izrade web servisa korišćen je Slim framework v.3.0. Pored toga, na

serverskoj strani podaci su skladišteni u MySQL bazu podataka koja je administrirana

alatima PhpMyAdmin, dok sajt translate je napisan u funkcionalnom PHP-u sa takođe MySQL

bazu podataka koja je takođe administrirana alatima PhpMyAdmin.

Web servis ne poseduje nikakav dizajn sem index strane u kojoj su opisanne funkcije

servisa. Dok sajt sluzi da pokaže funkcionalnost web servisa i sajt sadrži JavaScript sa JQuery

bibliotekom, CSS3 i HTML5. Sajt je responsive (prilagođava se veličini ekrana korisnika).

U toku razvoja aplikacije korišćena su sledeća razvojna okruženja:

• Notepad++

• PhpMyAdmin

• Advanced REST client

6

Page 7: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

2.1 Slim Framework

Slim je mikro PHP framework koji omogućava brzo pisanje moćnih web aplikacija i API-

a. Sto nas dovodi do zaključka da slim framework sadrzi samo najvazniji set alata koji

omogućavaju veliku fleksibilnost u pravljenju web servisa.

Slim framework je napravljen 2013 godine kada su micro framework-ci doživeli veliki

uspeh i ostao je popularan do dana danas. „Micro“ zato što je sastavljen samo od neophodnih

stvari da se napravi web applikacija. Obični micro framework radi na principu primanja HTTP

zahteva, obradjivanje tog HTTP zahteva preko određenog kontrolera, i vraća HTTP odgovor.

Slim framework je otišao stepenicu više i ponudio još dodatne alate za manipulaciju HTTP

odgovora (HTTP keš, ažuriranje statusa, preusmerenje, itd.).

Medjutim, veliki broj programera su više upućeni u velike full-stack framework-e kao što

su Laravel ili Symfony. Ovi odlični framework-ci imaju veliku podršku i veliku grupu ljudi

koje rade na svakodnevnom razvijanju softvera. Za neke projekte full-stack framework-ci su

idealno rešenje jer imaju ogromne mogućnosti, dok zahtevaju dodatno podešavanje i dodatnu

logiku. Dok sa druge strane ako pravite web servis koji je zasnovan na REST-u, Slim

framework je idealno rešenje jer poseduje dosta manje podešavanja a pruža velike mogućnosti

u toj oblasti.

7

Page 8: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

3 ORGANIZACIJA

Kao sto je navedeno diplomski se sastoji iz dva dela:

WEB SERVIS-a pisanog u Slim framework Lokalnom sajtu koji komunicira sa web servisom

3.1 Web SERVICE

Poseduje pet različitih metoda, koji manipulišu sa bazom podataka. Ne poseduje nikakv

GUI jer poenta web servisa je u obrađivanju poslatih informacija i dobijanja odgovora u odnosu

na poslati zahtev. Baza podataka sadrži sedam različitih jezika : Arapski, Nemački, Italijanski,

Portugalski, Ruski i Španski.

8

Page 9: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

URLM E T O D A

PARAMETRI OPIS

v1/translate

POST

translateFrom, translateTo, words

Prevodi reči na jedan selektovan jezik, morate proslediti jezik od (translateFrom) i jezik na (translateTo) i reči (kao string parametar)

v1/translates

POST

translateFrom, words

Prevodi reči na sve jezike, morate proslediti jezik od (translateFrom) i reči (kao string parametar)

v1/insertTranslates

POST

english,arabic, german,italian, portuguese, russian, Spanish

Ubacuje podatke u bazu, ubacuje reči u sve jezike zato sto REST redi na principu reč za reč, tako da je portrebno proslediti po jednu reč za svaki jezik u bazi (english,arabic,german,italian, portuguese,russian,spanish)

v1/deleteTranslates

DELETE

word,languageBrise podatke iz baze, mora da se prosledi reč (word) I takođe jezik gde ta reč postoji (language)

v1/editTranslatesPUT

english,arabic, german,italian, portuguese, russian, Spanish

Edituje reči u bazi, edituje reći u svim jezicima zato sto REST radi na principu reč za reč, tako daj je potrebno proslediti reč za svaki jezik (english, arabic, german,italian,portuguese,russian,spanish), kao i id reči koju zelite da editujete.

Slika 1 Tabela metoda web servisa sa kratkim objašnjenjom

9

Page 10: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

3.2 Lokalni Sajt

Lokalni sajt koji prati funkcije web servisa i na najbolji način ih primenjuje. Sajt predstavlja neku vrstu online prevodioca, koji prevodi reč za reč. Postoji mogućnost prevoda određene reči na sve jezike iz baze kao i mogućnost prevoda na samo jedan od odabranih jezika. Sajt poseduje autentifikaciju, gde korisnik koji ima admin privilegije, moze da:• Dodaje nove admin usere• Dodaje nove podatke u bazu web servisa• Brise podatke iz baze web servisa• Edituje podatke iz baze web servisa

Obični korisnici su u mogućnosti da prevode reči. Metode su sledeće:

3.2.1 Organizacija lokalnog sajta

Slika 2 Organizaciona šema lokalnog sajta

10

Page 11: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

3.2.2 Prikaz Translate

Stranica služi za prevod reči.Poseduje mogucnost prevoda reči na jedan jezik ili prevoda reči na sve jezike u bazi. Ukoliko korisnik traži prevod reči koja nije trenutno u bazi podataka dobiće obavestenje da reč ne postoji.

Slika 3 Prikaz translate strane lokalnog sajta

11

Page 12: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

3.2.3 Prikaz Log In

Modalni prozor pisan u Java Script-u koji u koliko korisnik nije ulogovan daje opciju korisniku da se uloguje, a ukoliko je ulogovan, daje opciju korisniku da se izloguje.

Slika 4 Prikaz log in modalnog prozora lokalnog sajta

12

Page 13: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

3.2.4 Prikaz Create Account

Stranica služi za kreiranje novog naloga. Ukoliko je rola usera admin on poseduje opciju kreiranja drugih admin korisnika, koji imaju dodatne opcije za razliku od normalnih korisnika.

Slika 5 Prikaz strane za kreiranje lokalnog sajta

13

Page 14: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

3.2.5 Prikaz Admin Page

Stranica kojoj mogu da pristupe samo autorizovani korisnici sa ulogom admina. Na stranici imaju mogućnost:

Dodavanja novih reči u bazu web servisa Brisanje reči iz bare web servisa Editovanje reči iz baze web servisa

Slika 6 Prikaz admin strane lokalnog sajta

14

Page 15: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

4 KODOVI

4.1 Web Servis u Slim framework-u

4.1.1 Organizacija

Slika 7 Struktura fajlova web servis aplikacije

15

Page 16: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

4.1.2 rest/v1/index.php

<?php

header("HTTP/1.0 200 OK");

require_once '../include/DbHandler.php';require_once '../include/PassHash.php';require '.././libs/Slim/Slim.php';

\Slim\Slim::registerAutoloader();

$app = new \Slim\Slim(array( 'debug' => true));

// User id from db - Global Variable$user_id = NULL;

/** * Verifying required params posted or not */function verifyRequiredParams($requiredFields) { $error = false; $errorFields = ""; $requestParams = array(); $requestParams = $_REQUEST; // Handling PUT request params if ($_SERVER['REQUEST_METHOD'] == 'PUT') { $app = \Slim\Slim::getInstance(); parse_str($app->request()->getBody(), $requestParams); } foreach ($requiredFields as $field) { if (!isset($requestParams[$field]) || strlen(trim($requestParams[$field])) <= 0) { $error = true; $errorFields .= $field . ', '; } }

if ($error) { // Required field(s) are missing or empty // echo error json and stop the app $response = array(); $app = \Slim\Slim::getInstance(); $response["error"] = true; $response["message"] = 'Required field(s) ' . substr($errorFields, 0, -2) . ' is missing or empty!!!'; echoRespnse(400, $response); $app->stop();

16

Page 17: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

}}

/** * Echoing json response to client * @param String $status_code Http response code * @param Int $response Json response */function echoRespnse($statusCode, $response) { $app = \Slim\Slim::getInstance(); // Http response code $app->status($statusCode);

// setting response content type to json $app->contentType('application/json');

echo json_encode($response);}

function checkWordsParametersSize($wordSize) { if($wordSize != 7){ $app = \Slim\Slim::getInstance(); $response["error"] = true; $response["message"] = 'You only can insert 7 words exactly, but all must be for different languages!!!'; echoRespnse(400, $response); $app->stop(); }}

function desplayError($message, $error) { $app = \Slim\Slim::getInstance(); $response["error"] = true; $response["message"] = $message; echoRespnse($error, $response); $app->stop();}

$app->post('/translate', function() use($app) {

verifyRequiredParams(array("translateFrom", "translateTo", "words")); $response = array();

$translateFrom = $app->request->post('translateFrom'); $translateTo = $app->request->post('translateTo'); $words = $app->request->post('words'); // check for required params $response = array(); $db = new DbHandler();

$languageArray = array("english", "arabic", "german", "italian", "portuguese", "russian", "spanish"); $translatedText = null;

17

Page 18: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

$languageErrorMessage = "Selected Language From-To isn't in list of languages: english, arabic, german, italian, portuguese, russian, spanish"; if(!in_array($translateFrom, $languageArray) || !in_array($translateTo, $languageArray)) { return desplayError($languageErrorMessage, 400); }

$matchingIds = array(); $matchingIds = $db->getWordsId($translateFrom, $words); $nullErrorMessage = "We do not have any of your word(s) in database!!!"; if(empty($matchingIds)) { return desplayError($nullErrorMessage, 400); }

$translatedText = $db->translate($translateTo, $matchingIds); $app = \Slim\Slim::getInstance(); if ($translatedText != NULL) {

$response["error"] = false; $response["translation"] = $translatedText; echoRespnse(200, $response);

return $response; } else { $response["error"] = true; if(!in_array($translateFrom, $languageArray) || !in_array($translateTo, $languageArray)){ $response["message"] = "We don't support selected language!!!" ; echoRespnse(400, $response); }else { $response["message"] = "We do not have any of your word(s) in database!!!"; echoRespnse(404, $response); } }});

$app->post('/translates', function() use($app) { verifyRequiredParams(array("translateFrom", "words")); $response = array();

$translateFrom = $app->request->post('translateFrom'); $words = $app->request->post('words');

$db = new DbHandler();

$matchingIds = array(); $languageArray = array("english", "arabic", "german", "italian", "portuguese", "russian", "spanish"); $translationsArray = array();

$allTranslations = null; if(in_array($translateFrom, $languageArray)) { $matchingIds = $db->getWordsId($translateFrom, $words);

unset($languageArray[array_search($translateFrom, $languageArray)]); foreach($languageArray as $language){

18

Page 19: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

$translationsArray[] = $db->translate($language, $matchingIds); }

$all_translations = '{"translation": [{'; $index = 0; foreach($languageArray as $language){ $allTranslations = $allTranslations . '"' . $language . '":"' .$translationsArray[$index] . '",'; $index++; } $allTranslations = rtrim($allTranslations, ","); $allTranslations = $allTranslations . ']}'; }

array_push($languageArray,"english"); $app = \Slim\Slim::getInstance(); if ($db->checkArrayValues($translationsArray)) {

$response["error"] = false; $response["translation"] = $allTranslations;

echoRespnse(200, $response); } else { $response["error"] = true;

if(!in_array($translateFrom, $languageArray) || !$translateFrom=="$translateFrom"){ $response["message"] = "We do not support selected language!!!"; echoRespnse(404, $response); }else { $response["message"] = "We do not have any of your word(s) in database!!!"; echoRespnse(400, $response); } }});

$app->post('/insertTranslates', function() use ($app) { // check for required params verifyRequiredParams(array("english", "arabic", "german", "italian", "portuguese", "russian", "spanish")); $response = array();

$english = $app->request->post('english'); $arabic = $app->request->post('arabic'); $german = $app->request->post('german'); $italian = $app->request->post('italian'); $portuguese = $app->request->post('portuguese'); $russian = $app->request->post('russian'); $spanish = $app->request->post('spanish');

$errorMessageEng = "We can't find English word!"; if (empty($english)) { return desplayError($errorMessageEng, 400); }

19

Page 20: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

$errorMessageAra = "We can't find Arabic word!"; if (empty($arabic)) { return desplayError($errorMessageAra, 400); } $errorMessageGer = "We can't find German word!"; if (empty($german)) { return desplayError($errorMessageGer, 400); } $errorMessageIta = "We can't find Italian word!"; if (empty($italian)) { return desplayError($errorMessageIta, 400); } $errorMessagePor = "We can't find Portuguese word!"; if (empty($portuguese)) { return desplayError($errorMessagePor, 400); } $errorMessageRus = "We can't find Russian word!"; if (empty($russian)) { return desplayError($errorMessageRus, 400); } $errorMessageSpa = "We can't find Spanish word!"; if (empty($spanish)) { return desplayError($errorMessageSpa, 400); }

$db = new DbHandler();

$db->insertTranslates($english, $arabic, $german, $italian, $portuguese, $russian, $spanish);

$response["error"] = false; $response["message"] = "Words insert successfully"; echoRespnse(200, $response);});

$app->delete('/deleteTranslates', function() use($app) {

$word = $app->request->delete('word'); $language = $app->request->delete('language');

$errorMessageWord = "We can't find word!"; if (empty($word)) { return desplayError($errorMessageWord, 400); } $errorMessageLanguage = "We can't find language!"; if (empty($language)) { return desplayError($errorMessageLanguage, 400); }

//checkLanguage($language); $db = new DbHandler(); $response = array(); $wordsId = array(); $wordsId = $db->getWordsId($language, $word); $errorMessage = "Word does not exist!"; if (empty($wordsId)) { return desplayError($errorMessage, 400); } foreach($wordsId as $wordId){ $db->deleteTranslations($wordId); }

$response["error"] = false; $response["message"] = "Words deleted successfully"; echoRespnse(200, $response);});

// UPDATE$app->put('/editTranslates', function() use($app) {

20

Page 21: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

// check for required params verifyRequiredParams(array("english", "arabic", "german", "italian", "portuguese", "russian", "spanish", "language", "word"));

$english = $app->request->put('english'); $arabic = $app->request->put('arabic'); $german = $app->request->put('german'); $italian = $app->request->put('italian'); $portuguese = $app->request->put('portuguese'); $russian = $app->request->put('russian'); $spanish = $app->request->put('spanish'); $language = $app->request->put('language'); $word = $app->request->put('word');

//checkLanguage($language); $db = new DbHandler(); $response = array(); $wordsId = array(); $wordsId = $db->getWordsId($language, $word); $errorMessage = "We can't find word!"; if (empty($wordsId)) { return desplayError($errorMessage, 400); } $errorMessageEng = "We can't find English word!"; if (empty($english)) { return desplayError($errorMessageEng, 400); } $errorMessageAra = "We can't find Arabic word!"; if (empty($arabic)) { return desplayError($errorMessageAra, 400); } $errorMessageGer = "We can't find German word!"; if (empty($german)) { return desplayError($errorMessageGer, 400); } $errorMessageIta = "We can't find Italian word!"; if (empty($italian)) { return desplayError($errorMessageIta, 400); } $errorMessagePor = "We can't find Portuguese word!"; if (empty($portuguese)) { return desplayError($errorMessagePor, 400); } $errorMessageRus = "We can't find Russian word!"; if (empty($russian)) { return desplayError($errorMessageRus, 400); } $errorMessageSpa = "We can't find Spanish word!"; if (empty($spanish)) { return desplayError($errorMessageSpa, 400); }

$db = new DbHandler(); $db->editTranslations($wordsId[0], $english, $arabic, $german, $italian, $portuguese, $russian, $spanish);

$response["error"] = false; $response["message"] = "Words edited successfully"; echoRespnse(200, $response);});

$app->run();

?>

21

Page 22: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

4.1.3 rest/v1/.htaccess

REWRITEENGINE ON##REWRITEBASE /HELLO/REWRITECOND %{REQUEST_FILENAME} !-FREWRITECOND %{REQUEST_FILENAME} !-DREWRITERULE ^(.*)$ /V1/INDEX.PHP/$1 [L]

4.1.4 rest/include/Config.php

<?php/** * Database configuration */define('DB_USERNAME', 'dbo643577406');define('DB_PASSWORD', 'q12345678');define('DB_HOST', 'db643577406.db.1and1.com');define('DB_NAME', 'db643577406');

?>

4.1.5 rest/include/DbConnect.php

<?php

/** * Handling database connection */

class DbConnect {

private $conn;

function __construct() { }

/** * Establishing database connection * @return database connection handler */ function connect() { include_once dirname(__FILE__) . '/Config.php';

22

Page 23: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

// Connecting to mysql database $this->conn = new mysqli(DB_HOST, DB_USERNAME, DB_PASSWORD, DB_NAME);

// Check for database connection error if (mysqli_connect_errno()) { echo "Failed to connect to MySQL: " . mysqli_connect_errno(); }

// returing connection resource return $this->conn; }

}

?>

4.1.6 rest/include/DbHandler.php

<?php

class DbHandler {

private $conn;

function __construct() { require_once dirname(__FILE__) . '/DbConnect.php'; // opening db connection $db = new DbConnect(); $this->conn = $db->connect();

}

public function getWordsId($translateFrom, $words) {

$words = trim($words); $wordsArray = array();

// Break the words into an array $wordsArray = explode(" ", $words); $this->conn->set_charset("utf8"); $arraySize = count($wordsArray); $languageId = $translateFrom . "_id";

$query = "SELECT " . $languageId . ", " . $translateFrom .".word FROM ". $translateFrom . " JOIN( SELECT '" . $wordsArray[0] . "' AS word, 1 AS word_order"; for ($i = 1; $i < $arraySize; $i++) { $query = $query . " UNION ALL SELECT '" . $wordsArray[$i] . "', " . ($i + 1) . " "; } $query = $query . ") WordsToSearch ON " . $translateFrom . ".word = WordsToSearch.word ORDER BY WordsToSearch.word_order;";

23

Page 24: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

$stmt = $this->conn->prepare($query);

$stmt->execute();

$words = $stmt->get_result();

// Array that contains the matching ids in order $matching_ids = array();

if($words){ while($row = mysqli_fetch_array($words)){ $matchingIds[] = $row[$languageId]; // Holds the array after the select $arrayAfterQuery[] = $row['word']; } } $stmt->close(); if(isset($matchingIds)){ return $matchingIds;} else { return null;}}

public function translate($translateTo, $matchingIds){

$translateId = $translateTo . '_id';

if($matchingIds == null){ return; }

$translateQuery = 'SELECT word FROM ' . $translateTo . ' JOIN(' .'SELECT ' . $matchingIds[0] . ' AS id, 1 AS word_order'; $arraySize2 = count($matchingIds); for ($i = 1; $i < $arraySize2; $i++) { $translateQuery = $translateQuery . " UNION ALL SELECT '" . $matchingIds[$i] . "', " . ($i + 1) . " "; } $translateQuery = $translateQuery . ') WordsToSearch ON ' .$translateTo . '.' . $translateId . ' = WordsToSearch.id ORDER BY WordsToSearch.word_order;';

$stmt = $this->conn->prepare($translateQuery); $stmt->execute(); $translateResponse = $stmt->get_result();

if($translateResponse){ if(!isset($translatedText)){ $translatedText= null; } while($row = mysqli_fetch_array($translateResponse)){ $translatedText = $translatedText . ' ' . $row['word'];

24

Page 25: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

} } return $translatedText;}

function checkArrayValues($array){ if($array == null){ return false; } if (in_array("", $array)) { return false; } return true;}

function insertTranslates($english, $arabic, $german, $italian, $portuguese, $russian, $spanish){ // ENGLISH

$this->conn->set_charset("utf8"); $query = "INSERT INTO english (word) VALUES (?)"; $stmt = $this->conn->prepare($query); $stmt->bind_param("s", $english); $stmt->execute(); // ARABIC $query = "INSERT INTO arabic (word) VALUES (?)"; $stmt = $this->conn->prepare($query); $stmt->bind_param("s", $arabic); $stmt->execute(); // GERMAN $query = "INSERT INTO german (word) VALUES (?)"; $stmt = $this->conn->prepare($query); $stmt->bind_param("s", $german); $stmt->execute(); // ITALIAN $query = "INSERT INTO italian (word) VALUES (?)"; $stmt = $this->conn->prepare($query); $stmt->bind_param("s", $italian); $stmt->execute(); // PORTUGUESE $query = "INSERT INTO portuguese (word) VALUES (?)"; $stmt = $this->conn->prepare($query); $stmt->bind_param("s", $portuguese); $stmt->execute(); // RUSSIAN $query = "INSERT INTO russian (word) VALUES (?)"; $stmt = $this->conn->prepare($query); $stmt->bind_param("s", $russian); $stmt->execute(); // SPANISH $query = "INSERT INTO spanish (word) VALUES (?)"; $stmt = $this->conn->prepare($query); $stmt->bind_param("s", $spanish);

25

Page 26: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

$stmt->execute();

$stmt->close();}

function deleteTranslations($wordId){ // English $query = "DELETE FROM english WHERE english_id = $wordId"; $stmt = $this->conn->prepare($query); $stmt->execute(); // Arabic $query = "DELETE FROM arabic WHERE arabic_id = $wordId"; $stmt = $this->conn->prepare($query); $stmt->execute(); // German $query = "DELETE FROM german WHERE german_id = $wordId"; $stmt = $this->conn->prepare($query); $stmt->execute(); // Italian $query = "DELETE FROM italian WHERE italian_id = $wordId"; $stmt = $this->conn->prepare($query); $stmt->execute(); // Portuguese $query = "DELETE FROM portuguese WHERE portuguese_id = $wordId"; $stmt = $this->conn->prepare($query); $stmt->execute(); // Russian $query = "DELETE FROM russian WHERE russian_id = $wordId"; $stmt = $this->conn->prepare($query); $stmt->execute(); // Spanish $query = "DELETE FROM spanish WHERE spanish_id = $wordId"; $stmt = $this->conn->prepare($query); $stmt->execute();

$stmt->close();}

public function editTranslations($wordId, $english, $arabic, $german, $italian, $portuguese, $russian, $spanish){

// English $query = "UPDATE english SET word = '$english' WHERE english_id = $wordId"; $stmt = $this->conn->prepare($query); $stmt->execute(); // Arabic $query = "UPDATE arabic SET word = '$arabic' WHERE arabic_id = $wordId"; $stmt = $this->conn->prepare($query); $stmt->execute(); // German $query = "UPDATE german SET word = '$german' WHERE german_id = $wordId";

26

Page 27: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

$stmt = $this->conn->prepare($query); $stmt->execute(); // Italian $query = "UPDATE italian SET word = '$italian' WHERE italian_id = $wordId"; $stmt = $this->conn->prepare($query); $stmt->execute(); // Portuguese $query = "UPDATE portuguese SET word = '$portuguese' WHERE portuguese_id = $wordId"; $stmt = $this->conn->prepare($query); $stmt->execute(); // Russian $query = "UPDATE russian SET word = '$russian' WHERE russian_id = $wordId"; $stmt = $this->conn->prepare($query); $stmt->execute(); // Spanish $query = "UPDATE spanish SET word = '$spanish' WHERE spanish_id = $wordId"; $stmt = $this->conn->prepare($query); $stmt->execute();

$stmt->close();}

}

?>

4.1.7 rest/index.php

<html lang="en"><head> <meta charset="utf-8"> <title>REST SERVICE</title> <meta name="description" content="Multi language translator"/> <meta name="author" content="Milos Maricic"/> <script src="js/jquery-2.2.4.min.js"></script> <link rel="stylesheet" href="style.css?v=1.0"/> <link href='https://fonts.googleapis.com/css?family=Raleway:400,300,200,500,700|Alegreya+Sans:400,300,500,700' rel='stylesheet' type='text/css'/>

</head>

<body> <section id="wrapper"> <h2>Functionality of REST service</h2> <br/> <table> <tr>

27

Page 28: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

<th> URL </th> <th>METHOD</th> <th>PARAMS</th> <th>DESCRIPTION</th> </tr> <tr> <td>/translate</td> <td>POST</td> <td>translateFrom,translateTo,words</td> <td><b>Translate words to one selected language</b>, you need to pass parameter <b>translateFrom</b> (language from), and parameter <b>translateTo</b> (language to), and parameter <b>words</b> (like string param).</td> </tr> <tr> <td>/translates</td> <td>POST</td> <td>translateFrom,words</td> <td><b>Translate words to all languages</b>, you need to pass <b>translateFrom</b> (language from), and <b>words</b> (like string param).</td> </tr> <tr> <td>/insertTranslates</td> <td>POST</td> <td>english,arabic,german,italian,portuguese,russian,spanish</td> <td><b>Insert data in dababase</b>, you need to pass all params <b>(english,arabic,german,italian,portuguese,russian,spanish)</b> because REST is working on principle word for word, so you need to pass one word for every language.</td> </tr> <tr> <td>/deleteTranslates</td> <td>DELETE</td> <td>word,language</td> <td><b>Delete data in dababase</b>, you need to provade parameter <b>word</b> (word which is going to be deleted), and also parameter <b>language</b> (language the word is from).</td> </tr> <tr> <td>/editTranslates</td> <td>PUT</td> <td>english,arabic,german,italian,portuguese,russian,spanish,language,word</td> <td><b>Edit row in dababase</b>, editing words in all languages because REST is working on principle word for word, so you need to pass one word for every language <b>(english,arabic,german,italian,portuguese,russian,spanish)</b>, and you also need to pass parameter <b>word</b> (whitch needs to be changed), and you also need to pass parameter <b>language</b> (language of selected word).</td> </tr> </table>

</section> <br/><br/> <footer> <p>Copyright © 2016 Miloš Maričić. All rights reserved.</p> </footer>

28

Page 29: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

</body>

</html>

4.1.8 rest/style.css

h2{ margin-top: 100px; text-align: center;}

table { margin: 0px auto; width: 60%;}

table th, td{ border: 1px solid black; height:35px;}

table td{ padding-left: 1%; padding-right: 1%;}

footer { text-align: center;}

4.1.9 rest/libs

Ovde se nalaze fajlovi slim flamework-a koji su deo biblioteke pomoću kojih web servis funkcioniše. Sastoji se od mnoštvo php fajlova koji su raspoređeni u četiri datoteke koje su:

Exception Helper Http Middleware

29

Page 30: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

4.2 Lokalni sajt

4.2.1 Organizacija

Slika 8 Struktura fajlova lokalnog sajta

4.2.2 Translate/index.php

<?php require_once("includes/dbConnection.php"); ?><?php require_once("includes/session.php"); ?><?php require_once("includes/functions.php"); ?><!doctype html>

<html lang="en"><head> <meta charset="utf-8"> <title>Translate</title> <meta name="description" content="Multi language translator"/> <meta name="author" content="Milos Maricic"/> <script src="js/jquery-2.2.4.min.js"></script> <link rel="stylesheet" href="css/style.css?v=1.0"/> <link href='https://fonts.googleapis.com/css?family=Raleway:400,300,200,500,700|Alegreya+Sans:400,300,500,700' rel='stylesheet' type='text/css'/> <script> $(document).ready(function(){ $( '.logIn' ).click(function() { $( "#logInModal" ).toggle( "slow", function() {

30

Page 31: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

}); }); }) </script></head>

<body> <section id="wrapper"> <?php if(!empty($_GET)){ $array = (array_keys($_GET)); changePage($array[0]); }else{ pageRedirect("index.php?translate"); } messagesAboutUserSession(); ?>

</section> <footer> <p>Copyright © 2016 Miloš Maričić. All rights reserved.</p> </footer></body>

</html>

4.2.3 Translate/translate.php

<header> <nav> <ul> <li><a class="active" href="index.php?translate">Multi Language Translate</a></li> <li class="logIn" style="float:right"><a href="#"> <?php logInTitle(); ?> </a></li> </ul> </nav> <?php include('includes/logInModal.php'); ?> </header>

<?php

if(isset($_POST['submit'])) {$words = $_POST['words'];$translateFrom = $_POST['translateFrom'];$translateTo = $_POST['translateTo'];if($translateTo == ""){

$url = "http://milosmaricic.com/v1/translates";$data = "translateFrom=" .$translateFrom. "&words=" . $words;

}else

31

Page 32: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

{$url = "http://milosmaricic.com/v1/translate";$data = "translateFrom=" .$translateFrom. "&translateTo=" .$translateTo. "&words=" . $words;

}

$ch = curl_init( $url );curl_setopt( $ch, CURLOPT_POSTFIELDS, $data);curl_setopt( $ch, CURLOPT_HTTPHEADER, array('Content-Type:application/x-www-form-

urlencoded'));# Return response instead of printing.curl_setopt( $ch, CURLOPT_RETURNTRANSFER, true );# Send request.$result = curl_exec($ch);curl_close($ch);

$result = json_decode($result, true);if($translateTo == ""){

if(isset($result['translation'])){ $result['translation'] = substr($result['translation'], 0, -2);

}}

}

?>

<section id="content">

<form id="translate" action="" method="post">

<h3>Translate:</h3> <hr> <br/> <!-- First Textarea --> <section id="left">

Language From: <select name="translateFrom">

<option value="english" <?php if(isset($translateFrom)){if($translateFrom == 'english'){echo("selected");}}?>>English</option>

<option value="arabic" <?php if(isset($translateFrom)){if($translateFrom == 'arabic'){echo("selected");}}?>>Arabic</option>

<option value="german" <?php if(isset($translateFrom)){if($translateFrom == 'german'){echo("selected");}}?>>German</option>

<option value="italian" <?php if(isset($translateFrom)){if($translateFrom == 'italian'){echo("selected");}}?>>Italian</option>

<option value="portuguese" <?php if(isset($translateFrom)){if($translateFrom == 'portuguese'){echo("selected");}}?>>Portuguese</option>

<option value="russian" <?php if(isset($translateFrom)){if($translateFrom == 'russian'){echo("selected");}}?>>Russian</option>

<option value="spanish" <?php if(isset($translateFrom)){if($translateFrom == 'spanish'){echo("selected");}}?>>Spanish</option>

32

Page 33: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

</select> <br/><br/>

<textarea id="source" name="words" type="text"><?php if(isset($words)) { echo $words;}?></textarea> </section>

<!-- Second Textarea --> <section id="right">

Language To: <select name="translateTo"> <option value="" <?php if(isset($translateTo)){if($translateTo == ''){echo("selected");}}?

>>All Languages</option> <option value="english" <?php if(isset($translateTo)){if($translateTo == 'english')

{echo("selected");}}?>>English</option> <option value="arabic" <?php if(isset($translateTo)){if($translateTo == 'arabic')

{echo("selected");}}?>>Arabic</option> <option value="german" <?php if(isset($translateTo)){if($translateTo == 'german')

{echo("selected");}}?>>German</option> <option value="italian" <?php if(isset($translateTo)){if($translateTo == 'italian')

{echo("selected");}}?>>Italian</option> <option value="portuguese" <?php if(isset($translateTo)){if($translateTo ==

'portuguese'){echo("selected");}}?>>Portuguese</option> <option value="russian" <?php if(isset($translateTo)){if($translateTo == 'russian')

{echo("selected");}}?>>Russian</option> <option value="spanish" <?php if(isset($translateTo)){if($translateTo == 'spanish')

{echo("selected");}}?>>Spanish</option> </select> <br/><br/>

<textarea disabled id="source" name="text"><?phpif(isset($result) && $result['error'] == 0) {

if($translateTo == ""){$translate = $result['translation'];$translate = '{'. $translate . '}';$resultArray = json_decode($translate, TRUE);foreach ($resultArray as $key => $value) {

echo "{$key}={$value} \n";}

}else{

printf($result['translation']);}

}?></textarea>

</section> <input name="submit" type="submit" id="buttonTranslate" />

<br/><br/> <?php if(isset($result) && $result['error'] == 1){

echo '<div id="errorTranslate"><spam style="color:red; font-weight: bold">' . $result["message"] . '</spam></div>';

33

Page 34: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

} ?>

</form>

<div id="response"> <pre></pre></div>

</section>

4.2.4 Translate/createAccount.php

<header> <nav> <ul> <li><a href="index.php?translate">Multi Language Translate</a></li> <li class="logIn" style="float:right"><a href="#"> <?php logInTitle() ?> </a></li> </ul> </nav> <?php include('includes/logInModal.php'); ?></header><section id="content"> <form id="createAccount" method="POST" action="index.php?createAccount"> <h3>Create Account</h3> <fieldset> <div id="error" style="color:red"> <?php if(!isset($error)){ $error = ""; $firstName = $lastName = $eMail = $userName = $password = $rePassword = ""; }

if(isset($_POST['submit'])) { $error = ""; $firstName = $_POST['firstName']; $lastName = $_POST['lastName']; $eMail = $_POST['eMail']; $userName = $_POST['userName']; $password =$_POST['password']; $rePassword = $_POST['rePassword'];

validateAndInsetUser($error, $firstName, $lastName, $eMail, $userName, $password, $rePassword); } ?> </div> </fieldset>

34

Page 35: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

<fieldset> <label>First Name: </label> <input placeholder="First Name" value="<?php echo $firstName ?>" name="firstName" type="text" tabindex="1" autofocus> </fieldset> <fieldset> <label>Last Name: </label> <input placeholder="Last Name" value="<?php echo $lastName ?>" name="lastName" type="text" tabindex="2" autofocus> </fieldset> <fieldset> <label>Email address: </label> <input placeholder="Email address" value="<?php echo $eMail ?>" name="eMail" type="text" tabindex="3" autofocus> </fieldset> <fieldset> <label>UserName: </label> <input placeholder="UserName" value="<?php echo $userName ?>" name="userName" type="text" tabindex="4" autofocus> </fieldset> <fieldset> <label>Password: </label> <input placeholder="Password" name="password" type="password" tabindex="5" autofocus> </fieldset> <fieldset> <label>Repeat Password: </label> <input placeholder="Repeat Password" name="rePassword" type="password" tabindex="6" autofocus> </fieldset> <?php if(isset($_SESSION["role"])){ if($_SESSION["role"] == 'admin') { ?> <fieldset> <label>Role: </label> <select name="selectedRole"> <option selected value="0">Select...</option> <option value = "1">Admin</option> <option value = "2">Regular User</option> </select> </fieldset> <?php } } ?> <fieldset> <input name="submit" type="submit"/> </fieldset> </form></section>

4.2.5 Translate/admin.php

<?php if(isset($_SESSION["role"])){

35

Page 36: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

$role = $_SESSION["role"]; if($role != "admin"){

redirectTo("index.php?translate"); }

}else{ redirectTo("index.php?translate"); }

?>

<header>

<nav> <ul> <li><a href="index.php?translate">Multi Language Translate</a></li> <li class="logIn" style="float:right"><a href="#"> <?php logInTitle() ?> </a></li> </ul> </nav> <?php include('includes/logInModal.php'); ?></header> <div id="error" style="color:red;text-align:center;margin-top:20px;font-weight: bold;"><?php// INSERT if(isset($_POST['insert'])) {

$error = ""; $english = $arabic = $german = $italian = $portuguese = $russian = $spanish = "";

$english = $_POST['english']; $arabic = $_POST['arabic']; $german = $_POST['german']; $italian = $_POST['italian']; $portuguese =$_POST['portuguese']; $russian = $_POST['russian']; $spanish = $_POST['spanish'];

validateInsert($error, $english, $arabic, $german, $italian, $portuguese, $russian, $spanish);

if($error == ""){ $url = "http://milosmaricic.com/v1/insertTranslates"; $data = "english=" .urlencode($english). "&arabic=" .urlencode($arabic). "&german=" .urlencode($german). "&italian=" .urlencode($italian). "&portuguese=" .urlencode($portuguese). "&russian=" .urlencode($russian). "&spanish=" .urlencode($spanish); $ch = curl_init( $url ); curl_setopt( $ch, CURLOPT_POSTFIELDS,$data); curl_setopt( $ch, CURLOPT_HTTPHEADER, array('Content-Type:application/x-www-form-urlencoded')); # Return response instead of printing. curl_setopt( $ch, CURLOPT_RETURNTRANSFER, true ); # Send request. $result = curl_exec($ch); curl_close($ch);

36

Page 37: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

$result = json_decode($result, true); if($result['error'] == false){ $messageInsert = "Sucessfully insert word from database!!!"; } else { $errorDelete = "Error:"; $messageInsert = $result['message']; }

?> <a href="#openModalInsert" id="clickModalInsert"/> <script type="application/javascript"> $(document).ready(function(){ $('#clickModalInsert')[0].click(); }); </script> <div id="openModalInsert" class="modalDialog"> <div> <a href="#close" title="Close" class="close">X</a> <?php if(isset($errorDelete)){ ?> <h2> <?php echo $errorDelete; ?></h2> <?php } ?> <p><?php echo $messageInsert ?></p> </div> </div> <?php }}

// DELETE if(isset($_POST['delete'])) { $deleteFrom = $_POST['deleteFrom']; $word = $_POST['deleteWord'];

$languageArray = array("english", "arabic", "german", "italian", "portuguese", "russian", "spanish"); if($word == "" || !in_array($deleteFrom, $languageArray)){ $deleteEmptyMessage = "You can not delete empty word or language is not selected!!!!"; echo $deleteEmptyMessage;

?> <a href="#openModalDeleteEmpty" id="clickModalDeleteEmpty"/> <script type="application/javascript"> $(document).ready(function(){ $('#clickModalDeleteEmpty')[0].click(); }); </script> <div id="openModalDeleteEmpty" class="modalDialog"> <div> <a href="#close" title="Close" class="close">X</a> <h2> <?php echo "Error"; ?> </h2> <p><?php echo $deleteEmptyMessage ?></p>

37

Page 38: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

</div> </div> <?php

} else { $url = "http://milosmaricic.com/v1/deleteTranslates"; $data = "word=" .$word. "&language=" . $deleteFrom;

$ch = curl_init( $url ); curl_setopt( $ch, CURLOPT_POSTFIELDS, $data); curl_setopt( $ch, CURLOPT_HTTPHEADER, array('Content-Type:application/x-www-form-urlencoded')); curl_setopt($ch, CURLOPT_CUSTOMREQUEST, "DELETE"); # Return response instead of printing. curl_setopt( $ch, CURLOPT_RETURNTRANSFER, true ); # Send request. $result = curl_exec($ch); curl_close($ch);

$result = json_decode($result, true); if($result['error'] == false){ $messageDelete = "Sucessfully deleted word from database!!!"; } else { $errorDelete = "Error:"; $messageDelete = $result['message']; }

?> <a href="#openModalDelete" id="clickModalDelete"/> <script type="application/javascript"> $(document).ready(function(){ $('#clickModalDelete')[0].click(); }); </script> <div id="openModalDelete" class="modalDialog"> <div> <a href="#close" title="Close" class="close">X</a> <?php if(isset($errorDelete)){ ?> <h2> <?php echo $errorDelete; ?></h2> <?php } ?> <p><?php echo $messageDelete ?></p> </div> </div><?php

}}

// UPDATE FIND WORD if(isset($_POST['findWords'])) {

38

Page 39: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

$updateFrom = $_POST['updateFrom']; $updateWord = $_POST['searhWord'];

$url = "http://milosmaricic.com/v1/translates"; $data = "translateFrom=" .$updateFrom. "&words=" . $updateWord;

$ch = curl_init( $url ); curl_setopt( $ch, CURLOPT_POSTFIELDS, $data); curl_setopt( $ch, CURLOPT_HTTPHEADER, array('Content-Type:application/x-www-form-urlencoded')); # Return response instead of printing. curl_setopt( $ch, CURLOPT_RETURNTRANSFER, true ); # Send request. $result = curl_exec($ch); curl_close($ch);

$result = json_decode($result, true); if(isset($result['translation'])){ $result['translation'] = substr($result['translation'], 0, -2); }

if($result['error'] == true){ $errorFindWord = "Error:"; $messageFindWord = $result['message']; ?> <a href="#openModalFindWord" id="clickModalFindWord"/> <script type="application/javascript"> $(document).ready(function(){ $('#clickModalFindWord')[0].click(); }); </script> <div id="openModalFindWord" class="modalDialog"> <div> <a href="#close" title="Close" class="close">X</a> <?php if(isset($errorFindWord)){ ?> <h2> <?php echo $errorFindWord; ?></h2> <?php } ?> <p><?php echo $messageFindWord ?></p> </div> </div> <?php $word = ""; } else { $updateArabic =$updateEnglish = $updateGerman = $updateItalian = $updatePortuguese = $updateRussian = $updateSpanish = ''; if($updateFrom == "english"){ $translate = $result['translation']; $translate = '{'. $translate . '}'; $resultArray = json_decode($translate, TRUE); $updateArabic = $resultArray['arabic']; $updateGerman = $resultArray['german']; $updateItalian = $resultArray['italian']; $updatePortuguese = $resultArray['portuguese'];

39

Page 40: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

$updateRussian = $resultArray['russian']; $updateSpanish = $resultArray['spanish']; } if($updateFrom == "arabic"){ $translate = $result['translation']; $translate = '{'. $translate . '}'; $resultArray = json_decode($translate, TRUE); $updateEnglish = $resultArray['english']; $updateGerman = $resultArray['german']; $updateItalian = $resultArray['italian']; $updatePortuguese = $resultArray['portuguese']; $updateRussian = $resultArray['russian']; $updateSpanish = $resultArray['spanish']; } if($updateFrom == "german"){ $translate = $result['translation']; $translate = '{'. $translate . '}'; $resultArray = json_decode($translate, TRUE); $updateArabic = $resultArray['arabic']; $updateEnglish = $resultArray['english']; $updateItalian = $resultArray['italian']; $updatePortuguese = $resultArray['portuguese']; $updateRussian = $resultArray['russian']; $updateSpanish = $resultArray['spanish']; } if($updateFrom == "portuguese"){ $translate = $result['translation']; $translate = '{'. $translate . '}'; $resultArray = json_decode($translate, TRUE); $updateArabic = $resultArray['arabic']; $updateGerman = $resultArray['german']; $updateItalian = $resultArray['italian']; $updateEnglish = $resultArray['english']; $updateRussian = $resultArray['russian']; $updateSpanish = $resultArray['spanish']; } if($updateFrom == "spanish"){ $translate = $result['translation']; $translate = '{'. $translate . '}'; $resultArray = json_decode($translate, TRUE); $updateArabic = $resultArray['arabic']; $updateGerman = $resultArray['german']; $updateItalian = $resultArray['italian']; $updatePortuguese = $resultArray['portuguese']; $updateRussian = $resultArray['russian']; $updateEnglish = $resultArray['english']; } if($updateFrom == "russian"){ $translate = $result['translation']; $translate = '{'. $translate . '}'; $resultArray = json_decode($translate, TRUE);

40

Page 41: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

$updateArabic = $resultArray['arabic']; $updateGerman = $resultArray['german']; $updateItalian = $resultArray['italian']; $updatePortuguese = $resultArray['portuguese']; $updateEnglish = $resultArray['english']; $updateSpanish = $resultArray['spanish']; } if($updateFrom == "italian"){ $translate = $result['translation']; $translate = '{'. $translate . '}'; $resultArray = json_decode($translate, TRUE); $updateArabic = $resultArray['arabic']; $updateGerman = $resultArray['german']; $updateEnglish = $resultArray['english']; $updatePortuguese = $resultArray['portuguese']; $updateRussian = $resultArray['russian']; $updateSpanish = $resultArray['spanish']; } }}

// UPDATE WORDS

if(isset($_POST['update'])) {

$error = ""; $updateEnglish = $updateArabic = $updateGerman = $updateItalian = $updatePortuguese = $updateRussian = $updateSpanish = ""; $updateFrom = $_POST['updateFrom']; $updateWord = $_POST['searhWord']; $updateEnglish = trim($_POST['updateEnglish']); $updateArabic = trim($_POST['updateArabic']); $updateGerman = trim($_POST['updateGerman']); $updateItalian = trim($_POST['updateItalian']); $updatePortuguese = trim($_POST['updatePortuguese']); $updateRussian = trim($_POST['updateRussian']); $updateSpanish = trim($_POST['updateSpanish']);

validateInsert($error, $updateEnglish, $updateArabic, $updateGerman, $updateItalian, $updatePortuguese, $updateRussian, $updateSpanish); if(!$updateFrom ){ $error .= 'Must be selected language!'; } if(!$updateWord ){ $error .= 'Old word must be inserted!'; }

if($error == ""){ $url = "http://milosmaricic.com/v1/editTranslates"; $data = "english=" .urlencode($updateEnglish). "&arabic=" .urlencode($updateArabic). "&german=" .urlencode($updateGerman). "&italian=" .urlencode($updateItalian).

41

Page 42: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

"&portuguese=" .urlencode($updatePortuguese). "&russian=" .urlencode($updateRussian). "&spanish=" .urlencode($updateSpanish). "&language=" .$updateFrom. "&word=" .$updateWord;

$ch = curl_init( $url ); curl_setopt( $ch, CURLOPT_POSTFIELDS, $data); curl_setopt( $ch, CURLOPT_HTTPHEADER, array('Content-Type:application/x-www-form-urlencoded')); curl_setopt($ch, CURLOPT_CUSTOMREQUEST, "PUT"); # Return response instead of printing. curl_setopt( $ch, CURLOPT_RETURNTRANSFER, true ); # Send request. $result = curl_exec($ch); curl_close($ch);

$result = json_decode($result, true); if($result['error'] == false){ $messageUpdate = "Sucessfully updated words from database!!!"; } else { $errorUpdate = "Error:"; $messageUpdate = $result['message']; }

?> <a href="#openModalUpdate" id="clickModalUpdate"/> <script type="application/javascript"> $(document).ready(function(){ $('#clickModalUpdate')[0].click(); }); </script> <div id="openModalUpdate" class="modalDialog"> <div> <a href="#close" title="Close" class="close">X</a> <?php if(isset($errorUpdate)){ ?> <h2> <?php echo $errorUpdate; ?></h2> <?php } ?> <p><?php echo $messageUpdate; ?></p> </div> </div><?php}

}

?></div>

<section id="content">

<form id="admin" action="" method="post">

<h2>Admin Panel</h2>

42

Page 43: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

<fieldset> <label>INSERT: </label> <br /> <input placeholder="English" value="<?php if(isset($english)){echo $english;} ?>" name="english" type="text" tabindex="1" autofocus/> <input placeholder="Arabic" value="<?php if(isset($arabic)){echo $arabic;} ?>" name="arabic" type="text" tabindex="1" autofocus/> <input placeholder="German" value="<?php if(isset($german)){echo $german;} ?>" name="german" type="text" tabindex="1" autofocus/> <input placeholder="Italian" value="<?php if(isset($italian)){echo $italian;} ?>" name="italian" type="text" tabindex="1" autofocus/> <input placeholder="Portuguese" value="<?php if(isset($portuguese)){echo $portuguese;} ?>" name="portuguese" type="text" tabindex="1" autofocus/> <input placeholder="Russian" value="<?php if(isset($russian)){echo $russian;} ?>" name="russian" type="text" tabindex="1" autofocus/> <input placeholder="Spanish" value="<?php if(isset($spanish)){echo $spanish;} ?>" name="spanish" type="text" tabindex="1" autofocus/> <br / /> <input name="insert" type="submit"/> </fieldset> <fieldset> <label>DELETE: </label> <br /> <label>Language: </label> <select name="deleteFrom"> <option name="">Select...</option> <option value="english" <?php if(isset($deleteFrom)){if($deleteFrom == 'english'){echo("selected");}}?>>English</option> <option value="arabic" <?php if(isset($deleteFrom)){if($deleteFrom == 'arabic'){echo("selected");}}?>>Arabic</option> <option value="german" <?php if(isset($deleteFrom)){if($deleteFrom == 'german'){echo("selected");}}?>>German</option> <option value="italian" <?php if(isset($deleteFrom)){if($deleteFrom == 'italian'){echo("selected");}}?>>Italian</option> <option value="portuguese" <?php if(isset($deleteFrom)){if($deleteFrom == 'portuguese'){echo("selected");}}?>>Portuguese</option> <option value="russian" <?php if(isset($deleteFrom)){if($deleteFrom == 'russian'){echo("selected");}}?>>Russian</option> <option value="spanish" <?php if(isset($deleteFrom)){if($deleteFrom == 'spanish'){echo("selected");}}?>>Spanish</option> </select> <input placeholder="Type Word" name="deleteWord" value="<?php if(isset($deleteFrom)){echo $word; } ?>" type="text" tabindex="2" autofocus/> <input name="delete" type="submit"/> </fieldset> <fieldset> <label>UPDATE: </label> <br /> <label>Language: </label> <select name="updateFrom"> <option name="">Select...</option> <option value="english" <?php if(isset($updateFrom)){if($updateFrom == 'english'){echo("selected");}}?>>English</option>

43

Page 44: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

<option value="arabic" <?php if(isset($updateFrom)){if($updateFrom == 'arabic'){echo("selected");}}?>>Arabic</option> <option value="german" <?php if(isset($updateFrom)){if($updateFrom == 'german'){echo("selected");}}?>>German</option> <option value="italian" <?php if(isset($updateFrom)){if($updateFrom == 'italian'){echo("selected");}}?>>Italian</option> <option value="portuguese" <?php if(isset($updateFrom)){if($updateFrom == 'portuguese'){echo("selected");}}?>>Portuguese</option> <option value="russian" <?php if(isset($updateFrom)){if($updateFrom == 'russian'){echo("selected");}}?>>Russian</option> <option value="spanish" <?php if(isset($updateFrom)){if($updateFrom == 'spanish'){echo("selected");}}?>>Spanish</option> </select> <input placeholder="Type Word" value="<?php if(isset($updateWord)){echo $updateWord; } ?>" name="searhWord" type="text" tabindex="3" autofocus/> <input name="findWords" type="submit"/> <br /> <input placeholder="English" value="<?php if(isset($updateEnglish)){echo $updateEnglish;}?>" <?php if(!isset($updateWord) || $updateWord == ""){ echo "disabled"; } else {echo "enable"; } ?> name="updateEnglish" type="text" tabindex="1" autofocus/> <input placeholder="Arabic" value="<?php if(isset($updateArabic)){echo $updateArabic;}?>" <?php if(!isset($updateWord) || $updateWord == ""){ echo "disabled"; } ?> name="updateArabic" type="text" tabindex="1" autofocus/> <input placeholder="German" value="<?php if(isset($updateGerman)){echo $updateGerman;}?>" <?php if(!isset($updateWord) || $updateWord == ""){ echo "disabled"; } ?> name="updateGerman" type="text" tabindex="1" autofocus/> <input placeholder="Italian" value="<?php if(isset($updateItalian)){echo $updateItalian;}?>" <?php if(!isset($updateWord) || $updateWord == ""){ echo "disabled"; } ?> name="updateItalian" type="text" tabindex="1" autofocus/> <input placeholder="Portuguese" value="<?php if(isset($updatePortuguese)){echo $updatePortuguese;}?>" <?php if(!isset($updateWord) || $updateWord == ""){ echo "disabled"; } ?> name="updatePortuguese" type="text" tabindex="1" autofocus/> <input placeholder="Russian" value="<?php if(isset($updateRussian)){echo $updateRussian;}?>" <?php if(!isset($updateWord) || $updateWord == ""){ echo "disabled"; } ?> name="updateRussian" type="text" tabindex="1" autofocus/> <input placeholder="Spanish" value="<?php if(isset($updateSpanish)){echo $updateSpanish;}?>" <?php if(!isset($updateWord) || $updateWord == ""){ echo "disabled"; } ?> name="updateSpanish" type="text" tabindex="1" autofocus/> <br / /> <input name="update" type="submit"/> </fieldset> </form></section>

4.2.6 Translate/includes/dbConnection.php

<?php//1. Create a database connectiondefine("DB_SERVER", "localhost");define("DB_USER", "root");define("DB_PASS", "");define("DB_NAME", "local");

44

Page 45: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

$connection = mysqli_connect(DB_SERVER,DB_USER,DB_PASS,DB_NAME);//Test if connection occuerred.if(mysqli_connect_error()){die("Database connection failed:" .

mysqli_connect_error()." (" . mysqli_connect_errno() . ")");

}?>

4.2.7 Translate/includes/functions.php

<?php

function redirectTo($new_location) { header("Location: " . $new_location); exit;}

function pageRedirect($location){ echo '<META HTTP-EQUIV="Refresh" content="0; URL='.$location.'">'; exit;}

function changePage($page){ if(isset($_GET["$page"])) { return include("$page.php"); }}

function find_user(){

global $connection;

$query = "SELECT ID,USERNAME,PASSWORD,ROLE "; $query .= "FROM user "; $query .= "ORDER BY USERNAME ASC"; $user = mysqli_query($connection, $query); confirm_query($user); return $user;}

function confirm_query($result_set) { if(!$result_set){ die("Database query failed"); }

45

Page 46: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

}

function inserUser($firstName, $lastName, $eMail, $username, $password ){

global $connection; $regularUser = '2'; $query = "INSERT INTO user (ID,FIRST_NAME,LAST_NAME,E_MAIL,USERNAME,PASSWORD,ROLE) "; $query .= "VALUES ('','{$firstName}','{$lastName}','{$eMail}','{$username}','{$password}','{$regularUser}') "; $user = mysqli_query($connection, $query); confirm_query($user);

}

function insertAdmin($firstName, $lastName, $eMail, $username, $password, $role){

global $connection;

$query = "INSERT INTO user (ID,FIRST_NAME,LAST_NAME,E_MAIL,USERNAME,PASSWORD,ROLE ) "; $query .= "VALUES ('','{$firstName}','{$lastName}','{$eMail}','{$username}','{$password}','{$role}') "; $user = mysqli_query($connection, $query); confirm_query($user);

}

function checkAvailableUsername($username){ global $connection;

$query = "SELECT USERNAME "; $query .= "FROM user "; $query .= "WHERE user.USERNAME = '{$username}'"; $username = mysqli_query($connection, $query); confirm_query($username); return $username;}

function validateInsert($error, $english, $arabic, $german, $italian, $portuguese, $russian, $spanish){ if(!$english ){ $error .= 'English field is required!'; } if(!$arabic ){ $error .= 'Arabic field is required!'; } if(!$german ){ $error .= 'German field is required!'; } if(!$italian ){ $error .= 'Italian field is required!'; }

46

Page 47: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

if(!$portuguese ){ $error .= 'Portuguese field is required!'; } if(!$russian ){ $error .= 'Russian field is required!'; } if(!$spanish ){ $error .= 'Spanish field is required!'; } if($error != ""){ $allerrors=explode("!",$error); for($i=0;$i<count($allerrors)-1;$i++) { echo $allerrors[$i].'!!!';?> <br><?php } } }

function validateAndInsetUser($error, $firstName, $lastName, $eMail, $userName, $password, $rePassword){ if(!$firstName ){ $error .= 'First name is required field!'; } else { if(!preg_match("/^[A-Z][-a-zA-Z]+$/", $firstName)){ $error .= 'First name invalid format!'; } } if(!$lastName ){ $error .= 'Last name is required field!'; } else { if(!preg_match("/^[A-Z][-a-zA-Z]+$/", $lastName)){ $error .= 'Last name invalid format!'; } } if(!$eMail){ $error .= 'Email is required field!'; } else { if(!preg_match("/^([a-z0-9_\.-]+)@([\da-z\.-]+)\.([a-z\.]{2,10})$/", $eMail)){ $error .= 'Email invalid format!'; } } if(!$userName) { $error .= 'Username is required field!'; }else { $availableUsername = checkAvailableUsername($userName); $subject_count = mysqli_num_rows($availableUsername); if($subject_count > 0){ $error .= 'Username is already exist!'; } } if(!$password){

47

Page 48: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

$error .= 'Password is required field!'; }else{ if($password != $rePassword){ $error .= 'Passwords does not match!'; } }

if($error == ""){ $passwordMD5 = md5($password); if (isset($_SESSION["role"])) { if ($_POST['selectedRole'] == '1') { $role = $_POST['selectedRole']; insertAdmin($firstName, $lastName, $eMail, $userName, $passwordMD5,$role); $_SESSION["userCreated"] = "true"; } else { inserUser($firstName, $lastName, $eMail, $userName, $passwordMD5); $_SESSION["userCreated"] = "true"; } }else { inserUser($firstName, $lastName, $eMail, $userName, $passwordMD5); $_SESSION["userCreated"] = "true"; } redirectTo("index.php?translate"); }else{ $allerrors=explode("!",$error); for($i=0;$i<count($allerrors)-1;$i++) { echo $allerrors[$i].'!!!';?> <br><?php } }}

function logInTitle(){ if(!isset($_SESSION["role"])) { echo "Log In"; }else { echo "Log Out"; }}

function messagesAboutUserSession(){ if(isset($_SESSION["justLogIN"])){ if($_SESSION["justLogIN"] == "true") { ?> <a href="#openModal" id="clickModal"/> <script type="application/javascript"> $(document).ready(function(){ $('#clickModal')[0].click(); });

48

Page 49: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

</script> <div id="openModal" class="modalDialog"> <div> <a href="#close" title="Close" class="close">X</a> <h2>Hello : <?php echo $_SESSION["username"]; ?></h2> <p>You successfully log in!</p> </div> </div> <?php unset($_SESSION["justLogIN"]); } } if(isset($_SESSION["userCreated"])){ if($_SESSION["userCreated"] == "true") { ?> <a href="#openModal" id="clickModal2"/> <script type="application/javascript"> $(document).ready(function(){ $('#clickModal2')[0].click(); }); </script> <div id="openModal" class="modalDialog"> <div> <a href="#close" title="Close" class="close">X</a> <h2>You successfully create user</h2> <p>Please try to log in!</p> </div> </div> <?php unset($_SESSION["userCreated"]); } } if(isset($_SESSION["logOut"])){ if($_SESSION["logOut"] == "true") { ?> <a href="#openModal" id="clickModal3"/> <script type="application/javascript"> $(document).ready(function(){ $('#clickModal3')[0].click(); }); </script> <div id="openModal" class="modalDialog"> <div> <a href="#close" title="Close" class="close">X</a> <h2>You just log out</h2> <p>Thank you for visiting us!</p> </div> </div> <?php session_destroy(); }

49

Page 50: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

}}

?>

4.2.8 Translate/includes/logInModal.php

<?php

if(!isset($_SESSION["role"])) { ?> <form method="POST" action="index.php?translate"> <section id="logInModal" hidden="true"> <fieldset> <label>UserName: </label> <input placeholder="First Name" type="text" name="username" tabindex="1" required autofocus> </fieldset> <fieldset> <label>Password: </label> <input placeholder="Last Name" type="password" name="password" tabindex="2" required autofocus> </fieldset> <fieldset> <input name="logIn" type="submit"/> </fieldset> <a href="index.php?createAccount">Or Create account</a> </section> </form>

<?php // LOG IN if(isset($_POST['logIn'])) { $user = find_user(); $subject_count = mysqli_num_rows($user); $formUserName = $_POST['username']; $formPassword = md5($_POST['password']); for ($count = 0; $count < ($subject_count); $count++) { $row = mysqli_fetch_array($user); $tableUsername = $row["USERNAME"]; $tableUserId = $row["ID"]; $tablePassword = $row["PASSWORD"]; if ($formUserName == $tableUsername && $formPassword == $tablePassword) { if ($row["ROLE"] == '1') { $_SESSION["role"] = "admin"; $_SESSION["username"] = $tableUsername;

50

Page 51: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

$_SESSION["id"] = $tableUserId; $_SESSION["justLogIN"] = "true"; redirectTo("index.php?admin"); } else { $_SESSION["role"] = "regularUser"; $_SESSION["username"] = $tableUsername; $_SESSION["id"] = $tableUserId; $_SESSION["justLogIN"] = "true"; redirectTo("index.php?translate"); } } } $message = "User doesn't exist. Probably misstype username or password, please try again!"; ?> <a href="#openModal" id="clickModal4"/> <script type="application/javascript"> $(document).ready(function(){ $('#clickModal4')[0].click(); }); </script> <div id="openModal" class="modalDialog"> <div> <a href="#close" title="Close" class="close">X</a> <h2>Error :</h2> <p><?php echo $message ?></p> </div> </div> <?php }

} else { ?> <form method="post" action="index.php?translate"> <section id="logInModal" hidden="true"> <fieldset> </fieldset> <fieldset> <label>Hello: </label> <label> <?php echo $_SESSION["username"]; ?> </label> </fieldset> <fieldset> <label>Role: </label> <label> <?php echo $_SESSION["role"]; ?> </label> </fieldset> <?php if($_SESSION["role"] == "admin"){ ?> <fieldset> </fieldset> <fieldset> <a href="index.php?admin">GO TO ~ Admin Page</a> </fieldset>

51

Page 52: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

<?php } ?> <fieldset> <input type="submit" name="logOut" value="Log Out!" /> </fieldset> <?php if($_SESSION["role"] == "admin"){ ?> <a href="index.php?createAccount">Or Create account</a> <?php } ?> </section> </form>

<?php

if(isset($_POST['logOut'])){ unset($_SESSION["role"]); $_SESSION["logOut"] = "true"; redirectTo("index.php?translate"); }

}?>

4.2.9 Translate/includes/session.php

<?phpsession_start();

function message(){if(isset($_SESSION["message"])){

$output = "<div class='message'>";$output .= htmlentities($_SESSION["message"]);$output .= "</div>";

// clear message after use$_SESSION["message"] = null;return $output;}

}

function errors(){if(isset($_SESSION["errors"])){

$errors = $_SESSION["errors"];

// clear message after use$_SESSION["errors"] = null;

return $errors;}

}

52

Page 53: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

?>

4.2.10 Translate/css/style.css

body{ background:#F9F9F9; position: relative; font-family: 'Alegreya Sans', sans-serif;}p{ font-size: 24px;}#content { min-height: 450px; position: relative; padding-left: 5%;}#wrapper{ position: relative;}

/* Navigation START */header { width : 80%; margin : 0px auto;}nav ul { list-style-type: none; margin: 0; padding: 0; overflow: hidden; background-color: #333;}nav li { float: left; border-right:1px solid #bbb; font-size: 24px;}nav li:last-child { border-right: none;}nav li a { display: block;

53

Page 54: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

color: white; text-align: center; padding: 14px 16px; text-decoration: none;}nav li a:hover:not(.active) { background-color: #111;}nav .active { background-color: #4CAF50;}/* Navigation END */

/* Toggle Log In START */#logInModal{ position: absolute; z-index: 100; right:10%; width : 20%; margin-top: 0.5%; background-color: white; padding : 1%; border-radius: 5px;}#logInModal fieldset { border: medium none !important; margin: 0 0 15px; padding: 0; width: 100%;}#logInModal input[type="text"], #logInModal input[type="password"] { width:100%; border: none; border-bottom: 3px solid #aaa; background:#F9F9F9; margin-top: 5px;}#logInModal input[type="text"]:hover, #logInModal input[type="password"]:hover { -webkit-transition:border-color 0.3s ease-in-out; -moz-transition:border-color 0.3s ease-in-out; transition:border-color 0.3s ease-in-out; border-bottom: 3px solid #4CAF50;}#logInModal input[type="text"]:focus, #logInModal input[type="password"]:focus { border-bottom: 3px solid #4CAF50; outline: none;}#logInModal input[type="submit"] { cursor:pointer; width:100%; border:none;

54

Page 55: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

background:#333; color:#FFF; padding:10px; font-size:15px;}#logInModal input[type="submit"]:hover { background:#111; -webkit-transition:background 0.3s ease-in-out; -moz-transition:background 0.3s ease-in-out; transition:background-color 0.3s ease-in-out;}#logInModal a {

color: #333; margin-top: -10px; float: right; text-decoration: none;}#logInModal a:hover { color : #4CAF50;}/* Toggle Log In END */

/* Create Account CSS START */#createAccount { max-width:400px; width:100%; margin:0 auto; position:sticky; padding-top: 3%; font-family: 'Raleway', sans-serif;}#createAccount h3 { color: #4CAF50; display: block; text-align: center; font-size: 30px; font-weight: 400;}#createAccount fieldset { border: medium none !important; margin: 0 0 15px; min-width: 100%; padding: 0; width: 100%;}#createAccount input[type="text"], #createAccount input[type="email"], #createAccount input[type="password"]{ width:100%; border: none; border-bottom: 3px solid #aaa; background:#F9F9F9;

55

Page 56: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

margin-top: 5px;}#createAccount input[type="text"]:hover, #createAccount input[type="email"]:hover, #createAccount input[type="password"]:hover { -webkit-transition:border-color 0.3s ease-in-out; -moz-transition:border-color 0.3s ease-in-out; transition:border-color 0.3s ease-in-out; border-bottom: 3px solid #4CAF50;}#createAccount input[type="text"]:focus, #createAccount input[type="email"]:focus, #createAccount input[type="password"]:focus { border-bottom: 3px solid #4CAF50; outline: none;}#createAccount input[type="submit"] { cursor:pointer; width:100%; border:none; background:#333; color:#FFF; margin:10px 0 5px; padding:10px; font-size:15px;}#createAccount input[type="submit"]:hover { background:#111; -webkit-transition:background 0.3s ease-in-out; -moz-transition:background 0.3s ease-in-out; transition:background-color 0.3s ease-in-out;}/* Create Account CSS END */

/* Translate part START */#translate{ padding-top: 5%; position: relative; margin:0 0 0 10%; width: 75%;}#translate h3{ margin-bottom: 2%;}

#errorTranslate{ margin-top: 200px;}/* Translate part END */

/* Footer START */footer{ background-color: #333; margin : 0px auto;

56

Page 57: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

width : 80%; padding : 4px 0px;}

footer p{ color: white; text-align: center;}/* Footer END */

/* CONTENT LEFT, RIGHT AND RESULTS START */

#left { display: relative; float : left; width : 49%; height:150px;}

#left textarea { resize: none; width : 99%; height:90%; padding:0; float:left; vertical-align: top;}

#right { display: relative; float : right; width : 49%; height:150px;}

#right textarea { resize: none; width : 99%; height:90%;}

#results{

}/* CONTENT LEFT, RIGHT AND RESULTS END */

/* ADMIN START */

#admin{ padding-top: 5%; position: relative;

57

Page 58: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

margin:0 0 0 10%; width: 75%;}

#admin h2{ margin-bottom: 2%;}

#buttonTranslate{position : relative;float: right;margin-top : 50px;width: 30%;

}

/* ADMIN END */

/* -------------------------1920px-------------------------------- *//* RESPONSIVE PART */@media all and (max-width: 1920px) { p{ font-size: 24px; }

/* Navigation START */ nav li a { padding: 7px 8px; } /* Navigation END */

/* Toggle Log In START */ #logInModal{ width : 20%; } /* Toggle Log In END */ /* Create Account CSS START */ #createAccount input[type="text"], #createAccount input[type="email"], #createAccount input[type="password"], #contact button[type="submit"] { font: 400 16px/12px "Raleway", sans-serif; /*font-family: 'Raleway', sans-serif;*/ } #createAccount h3 { float:left; } /* Create Account CSS END */ /* Footer START */ footer p{ height : 24px; text-align: center; } /* Footer END */

58

Page 59: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

}

/* -------------------------1280px-------------------------------- */@media all and (max-width: 1280px) { p{ font-size: 16px; } /* Toggle Log In START */ #logInModal{ width : 25%; } /* Toggle Log In END */

}

/* -------------------------768px-------------------------------- */@media all and (max-width: 768px) { /* Toggle Log In START */ #logInModal{ width : 30%; } /* Toggle Log In END */

/* CONTENT LEFT, RIGHT AND RESULTS START */ #left { display: block; width : 100%; height:130px; float: none; }

#left textarea { resize: none; width : 99%; height:60%; }

#right { display: block; width : 100%; height:130px; float: none; }

#right textarea { resize: none; width : 99%; height:60%; }

59

Page 60: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

/* Translate part START */ #translate{ margin:0 0 0 10%; width: 70%; } /* Translate part END */

#results{ display: block; } #errorTranslate{ margin-top: 0px; } #buttonTranslate{ position : relative; float: right; margin-top : 0; width: 45%; } /* CONTENT LEFT, RIGHT AND RESULTS END */}

/* -------------------------480px-------------------------------- */@media all and (max-width: 480px) { /* Toggle Log In START */ #logInModal{ right:0%; } /* Toggle Log In END */ /* Navigation START */ header { width : 100%; margin : 0px auto; } nav li a { font-size: 13px; } /* Navigation END */

/* Toggle Log In START */ #logInModal{ width : 40%; } /* Toggle Log In END */

/* Translate part START */ #translate{ margin:0 0 0 0; width: 85%; }

60

Page 61: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

/* Translate part END */

#buttonTranslate{position : relative;float: right;margin-top : 0;width: 45%;}

#content { min-height: 300px; }

/* Footer START */ footer{ width : 100%; } footer p{ font-size: 12px; } /* Footer END */}

/* ALERT MODAL START */.modalDialog { position: fixed; font-family: Arial, Helvetica, sans-serif; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,0.8); z-index: 99999; opacity:0; -webkit-transition: opacity 400ms ease-in; -moz-transition: opacity 400ms ease-in; transition: opacity 400ms ease-in; pointer-events: none;}.modalDialog:target { opacity:1; pointer-events: auto;}.modalDialog > div { width: 400px; position: relative; margin: 10% auto; padding: 5px 20px 13px 20px; border-radius: 10px; background: #fff; background: -moz-linear-gradient(#fff, #999);

61

Page 62: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

background: -webkit-linear-gradient(#fff, #999); background: -o-linear-gradient(#fff, #999);}.close { background: #606061; color: #FFFFFF; line-height: 25px; position: absolute; right: -12px; text-align: center; top: -10px; width: 24px; text-decoration: none; font-weight: bold; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; -moz-box-shadow: 1px 1px 3px #000; -webkit-box-shadow: 1px 1px 3px #000; box-shadow: 1px 1px 3px #000;}.close:hover { background: #4CAF50;}/* ALERT MODAL END */

62

Page 63: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

5 BAZA PODATAKA

Diplomski sadrži dve MySQL baze podataka koje su administrirane sa phpMyAdmin

alatom.

5.1 Web servis baza podataka

Slika 9 Struktura baze podataka web servera

63

Page 64: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

5.1.1 Struktura baze podataka

Baza podataka sadrži sedam tabela, dok svaka tabela sadrži dve kolone. Jedna je id,

druga je reč.

5.2 Localhost sajt baza podataka

Slika 10 Struktura baze podataka lokalnog sajta

5.2.1 Struktura baze podataka

Postoje dve tabele, jedna je uloga, a druga je korisnik. Tabela uloga se sastoji od id-a i od uloge koju korisnik moze da poseduje.

Druga tabela je tabela korisnik koja sad sedam kolona: ID - id broj First_Name – Ime korisnika Last_Name – Prezime korisnika E-Mail – Email korisnika Username – Korisničko ime Password – Lozinka korisnika Role – Uloga korisnika ( pokazuje na tabelu uloga )

64

Page 65: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

6 Z A K L J U Č A K

Napravljen je translate web servis koji je baziran na RESTful servisu čija je glavna funkcija

prevod prosleđenih reci na jedan od selektovanih jezika. Prevod reči je baziran na principu reč za reč i

trenutno podržava sedam jezika (Arapski, Nemački, Italijanski, Portugalski, Ruski i Španski).

Web servis poseduje pet različitih metoda koji komuniciraju sa bazom jezika od kojih dve

omogućavaju korisniku da trazi i dobije prevod tražene reči, a ostale tri omogucavaju privilegovanom

korisniku (adminu) ubacivanje, izmenu ili brisanje iz baze podataka web servisa. Servis je pisan u

Slim frameworku koji je veoma pogodan za handlovanje grešaka koji mogu da dodju prilikom

prosledjivanja parametra servisu ili greske prilikom kucanja url-a.

Uz diplomski je uradjen sajt koji komunicira sa web servisom, sa odvojenom zasebnom bazom

za korisnike. Sajt na najbolji način pokazuje funkcionalnost zasebnog web servisa.

Ovim diplomskim je napravljen web servis koji može da se koristi sa bilo kakvim sajtom koji

na dobri način koristi funkcije koje pruža taj web servis. U budućnosti web servis se može proširiti sa

većom bazom podataka tako da podržava vise od sedam jezika. Ili da se ubaci glasovna komunikacija

sa web servisom.

65

Page 66: webdizajn.ict.edu.rswebdizajn.ict.edu.rs/...primeri/...milos_maricic.docx  · Web viewOva komunikacija se obično vrši tako što klijent šalje zahtev pomoću ... editing words

7 LITERATURA

1. J. Lockhart, A. Smith, R. Allen, Slim Framework Team Slim Documentation (http://www.slimframework.com/docs/)

2. P.DuBois MySQL (5th Edition) (Developer's Library) -Addison-Wesley Professional, 2013

3. D. Goodman, M.Morris JavaScript Bible, 7th Edition –Jhon Willey & Soon, 2010.

4. J. Duckett, HTML and CSS: Design and Build Websites 1st Edition - Willy, 2014.

66