A Client Web App Development Project, iFilm is a Google Chrome Extension whose purpose is to retrieve information about movies (ratings, cast, photos, trailers and reviews).
It uses web resources from YouTube, IMDb, Google+, Facebook, RottenTomatoes, Twitter and Google Maps.
Authentication is made using OAuth 2.0 protocol. This means that the user can authenticate with his Facebook, Twitter, Google or other account that supports OAuth 2.0.
Enjoy!
1. iFilm
Documentație proiect CLIW
Ionuț Dănilă,
Student în anul III al Facultății de Informatică Iași
ionut.danila@info.uaic.ro
Consultați și demo-ul video asociat documentației, disponibil la adresa: vimeo.com/35849583
2. Titlul proiectului: iFilm
Perioadă realizare: noiembrie 2011 – februarie 2012
Cerințele proiectului:
Să se implementeze o extensie pentru browser-ul web Google
Chrome, care să acceseze un serviciu pentru prezentarea
comparativă a topurilor de filme (de diverse genuri). Utilizatorii vor
putea vota producțiile cinematografice preferate, reactualizarea
efectuându-se în mod dinamic. Se va prevede și posibilitatea de a
propune noi intrări în top.
Utilizatorul va avea posibilitatea de a vedea detalii despre
producțiile cinematografice, oferite de anumite situri specializate. Va
fi oferită posibilitatea de a vizualiza clipuri video și fotografii care au
legătură cu un anumit film, precum și opțiunea de a împărtăși
preferințele cinematografice pe rețelele sociale (Facebook, Twitter,
Google+).
Autentificarea în cadrul extensiei se va realiza folosind
protocolul OAuth, prin conectarea unui cont deținut de utilizator,
capabil să ofere informații despre utilizator într-un mod securizat.
Ionuț Dănilă iFilm | 2
3. Descrierea proiectului
Mediul de programare:
Server-side: Microsoft ASP.net 4.5
Client-side: HTML, CSS, jQuery, AJAX și JavaScript
Bază de date: Microsoft SQL Server 2012
Proiectul se dorește a fi un instrument web de informare a utilizatorilor, fiind
accesat prin intermediul unei extensii în browser-ul Google Chrome. Aplicația
are o interfață simplă și prietenoasă, fiind ușor de folosit. Dimensiunile maxime
permise pentru conținutul unei extensii sunt 800x600 px.
Prima accesare a extensiei trimite utilizatorul pe pagina de conectare a
unui cont personal, care are implementat protocolul OAuth 2.0, în acest caz
contul de Facebook (Fig. 1). Aplicația necesită numele și prenumele
utilizatorului, locația acestuia și id-ul contului utilizat.
Fig. 1
3|iFilm Ionuț Dănilă
4. După finalizarea autentificării, utilizatorul poate folosi toate
funcționalitățile aplicației, printre care se numără: căutarea unui film după
numele său original, sau după id-ul de pe IMDb, votarea producțiilor
cinematografice preferate, sau vizualizarea de trailer-e și fotografii.
În continuare va fi explicată fiecare funcționalitate.
Vizualizare profil personal
Utilizatorul poate accesa profilul personal prin
folosirea butonului Your Profile (Fig. 2). Sunt
afișate informații despre filmele adăugate în baza
de date și filmele votate, precum și locația
utilizatorului, generată folosind Google Maps.
Aceleași detalii sunt vizibile și în profilele celorlalți
utilizatori, prin accesarea ferestrei de Chat.
Fig. 2
Căutare producții cinematografice
Utilizatorul poate căuta orice film după nume sau după id-ul corespunzător
filmului pe IMDb prin accesarea butonului Search/ Add Movie (Fig. 3). Aplicația
va căuta filmul dorit chiar și atunci când numele introdus este parțial eronat.
Fig. 3
Ionuț Dănilă iFilm | 4
5. Pentru exemplificare va fi căutat filmul The Pursuit of Happyness. După
finalizarea căutării rezultatul va fi afișat în fereastră (Fig. 4). După cum se
observă, informațiile afișate cuprind, printre altele, genurile în care se
încadrează producția cinematografică, numărul de voturi (IMDb), scorul obținut
în urma votării, regizorul și scriitorii.
Fig. 4
În partea de jos sunt afișate (în file separate) informații despre actori
(actorii principali fiind evidențiați prin fotografie și afșarea numelui
personajului interpretat), clipuri video preluate de pe YouTube (Fig. 5), care
prezintă posibile interviuri sau trailer-e, o galerie foto care prezintă fotografii
din timpul filmărilor, scene din film sau din timpul premierelor (Fig. 6) și critici
oferite de RottenTomatoes, preluate din cele mai importante publicații
internaționale (Fig. 7).
5|iFilm Ionuț Dănilă
7. Adăugare de filme în baza de date iFilm
După căutarea filmului, utilizatorul are posibilitatea de a-l adăuga în baza de
date iFilm folosind butonul Add Movie into iFilm Database (Fig. 8), în
categoriile genurilor cinematografice existente în descrierea filmului.
Fig. 8
Votare producție cinematografică preferată
În urma adăugării efectuate, filmul The Pursuit of Happyness se va afla în
topurile genurilor Biography și Drama (Fig. 9), pe ultima poziție. Utilizatorul are
posibilitatea de a vota (o singură dată) orice producție cinematografică care
există în baza de date iFilm folosind butonul Vote this Movie.
Fig. 9
7|iFilm Ionuț Dănilă
8. Share pe platforme sociale
Butonul de vot se află poziționat lângă butoanele de “share” pe platformele
sociale a producției cinematografice curente: Facebook, Twitter și Google+. În
urma accesării unuia dintre aceste butoane, pe contul aferent butonului va
apare o descriere și posterul filmului (Fig. 10).
Fig. 10
Utilizarea chat-ului intern
Aplicația poate fi folosită și pentru a comunica cu
alți utilizatori iFilm. Există opțiunea de a vizualiza
profilul altui utilizator (Fig. 11), sau de a transmite
mesaje (Fig. 12).
Fig. 11
Fig. 12
Ionuț Dănilă iFilm | 8