Platformă multimedia pentru configurarea unui sistem de calcul Dulvac Andrei-Cosmin COORDONATOR ȘTIINȚIFIC Conf . dr. ing. Daniela Danciu Iulie 2016… [310407]
[anonimizat]. Daniela Danciu
Iulie 2016
[anonimizat]. Daniela Danciu
Iulie 2016
CRAIOVA
„Învățătura este o comoară care își urmează stăpânul pretutindeni.”
[anonimizat], student: [anonimizat], Calculatoare și Electronică a [anonimizat], [anonimizat]:
[anonimizat]. [anonimizat] 2016.
[anonimizat]:
reproducerea exactă a [anonimizat]-o [anonimizat]-o [anonimizat],
[anonimizat], [anonimizat] a unor aplicații realizate de alți autori fără menționarea corectă a [anonimizat] a [anonimizat].
Pentru evitarea acestor situații neplăcute se recomandă:
plasarea între ghilimele a citatelor directe și indicarea referinței într-o [anonimizat] a [anonimizat] a sursei originale de la care s-a [anonimizat] s-[anonimizat], figuri, imagini, statistici, [anonimizat], a căror paternitate este unanim cunoscută și acceptată.
Data, Semnătura candidat: [anonimizat],
PROIECTUL DE DIPLOMĂ
REFERATUL CONDUCĂTORULUI ȘTIINȚIFIC
În urma analizei lucrării candidat: [anonimizat]:
[anonimizat]:
Data, [anonimizat] „Platformă multimedia pentru configurarea unui sistem de calcul” este o [anonimizat] a alege modelul componentelor principale ale sistemului. Această etapă este una foarte importantă în procesul de achiziționare al unui sistem dekstop.
Pentru realizarea aplicației se vor utiliza o serie de tehnologii: HTML, CSS, PHP, JavaScript, [anonimizat].
[anonimizat].
Termenii cheie: HTML5, CSS3, [anonimizat], înregistrare, configurare, componente PC.
[anonimizat], după 4 ani de instruire ca viitor inginer.
Sunt foarte mulțumit că am ales să urmez o facultate de inginerie si că am avut lângă mine persoane care să mă îndrume către această profesie.
Cu această ocazie țin să le mulțumesc persoanelor care au avut grijă să mă sfătuiască în alegerea acestei facultăți, și în primul rând părinților mei care m-au susținut pe tot parcursul acestui ciclu.
Doresc să mulțumesc conducerii facultății de Automatică, Calculatoare și Electronică, cât și domnilor profesori, care au contribuit la dezvoltarea mea personală și au dat dovadă de implicare, înțelegerea și răbdarea pe parcustul acestor ani.
Deasemenea, îmi exprim mulțumirea față de doamna conf. dr. ing. Daniela Danciu pentru susținerea, contribuția, răbdarea și implicarea de care a dat dovadă de-a lungul procesului de planificare și realizare al acestui proiect.
Nu în ultimul rand, aș dori să le multumesc colegilor care au avut un rol important, prin sprijinul acordat în procesul de învățare, dar și prin modul în care m-au motivat și înțeles.
CUPRINSUL
LISTA FIGURILOR
Figura 1 1
Figura 2 2
Figura 3 5
Figura 4 9
Figura 5 10
Figura 6 12
Figura 7 13
Figura 8 15
Figura 9 16
Figura 10 17
Figura 11 19
Figura 12 20
Figura 13 21
Figura 14 21
Figura 15 22
Figura 16 22
Figura 17 23
Figura 18 24
Figura 19 24
Figura 20 25
Figura 21 25
Figura 22 26
Figura 23 26
Figura 24 27
Figura 25 27
Figura 26 28
Figura 27 28
Figura 28 29
Figura 29 29
Figura 30 30
Figura 31 30
Figura 32 31
Figura 33 31
Figura 34 33
Figura 35 33
Figura 36 34
Figura 37 34
Figura 38 35
Figura 39 36
Figura 40 37
Figura 41 38
Figura 42 39
Figura 43 39
Figura 44 40
Figura 45 40
Figura 46 41
Figura 47 41
LISTA TABELELOR
Tabelul 1 7
Introducere
Scopul
Scopul elaborării acestui proiect constă în dorința de a aculuma cât mai multe cunoștințe legate de aplicațiile web și de a-mi îmbunătății abilitățile de utilizare a tehnologiilor folosite .
Motivația
Motivul alegerii acestei teme consta în dorința de transformare a aplicației într-una foarte folositoare, dar și de a pune în practică cunoștințele de utilizare a tehnologiilor web dobândite in anii de studiu .
Avantaje proiect
Avantajul principal al proiectului este acela că utilizatorii pot configura virtual un sistem dekstop, printr-un proces simplu, utilizând o interfată ușor de folosit. Etapa de configurare este una foarte inportantă în procesul de achiziționare al unui sistem dekstop si de aceea o aplicație care să ne ușureze munca este extrem de folositoare.
Introducere proiect
Figura 1
De-a lungul timpului tehnologia a avansat culminant, iar internetul a oferit oamenilor din ce în ce mai multe posibilitați de a-și dezvolta o afacere în mediul online. Bineînțeles, fiecare cu ideea lui, de la site-uri din domeniul auto la domeniul hotelier, de la cel bancar la cel industrial.
Avantajele oferite de mediul online sunt nenumarate, printre care comoditate , economisirea timpului dar și o mai bună informare.
Odată cu dezvoltarea tehnologiei, au apărut PC-uri, laptopuri, telefoane mobile din ce în ce mai performante.
Pentru creșterea performanțelor unui PC, componente precum: placa de bază, procesorul, placa video, memoria RAM ,hard disk-ul au suferit o serie de îmbunătățiri substanțiale.
Figura 2
În procesul de achizițonare al unui PC, una dintre cele mai importante etape este configurarea sistemului. În zilele noastre această etapă se poate realiza faorte ușor. Datorită aplicațiilor web, orice persoană își poate configure online, foarte rapid si ușor, un sistem desktop.
Cu ceva ani în urmă, majoritatea persoanelor preferau să achiziționeze un PC gata asamblat și încercau să se orienteze spre un produs care să ofere o performanță cât mai bună, în funcție de bugetul alocat pentru acesta.
Poate nu era cea mai bună modalitate de achiziție a unui PC, persoana fiind limitată la sistemele ce se gaseau în magazine, însa era la îndemană și nu întâmpina probleme și bătai de cap ca în cazul în care cumpara componente care apoi trebuiau asamblate. În plus, este nevoie de cunoștinte de bază în asamblarea unui PC, iar dacă utilizatorul nu are aceste cunoștinte, preferă să achiziționeze un PC gata asamblat. Pe langă toate acestea, componentele cumpărate trebuie să fie și compatibile între ele, altfel te trezești că placa de bază nu suportă procesorul achiziționat, memoria RAM, sau alte componente.
În ziua de azi, se practică cumpărarea unui PC pe componente, unul dintre avantaje ar fi, în unele cazuri, costul mai redus al unora dintre acestea. Totuși, trebuie să deții și îndemanarea necesară asamblării componentelor.
Aplicațiile ce oferă posibilitatea configurării PC-urilor, pun la dispoziție și informații legate de performanțele componentelor, precum și o serie de informații privind compatibilitatea acestora.
Ccomponentele PC-urilor sunt intr-o continuă dezvoltare și de aceea este necesară o actualizare precisă a informațiilor.
noțiuni introductive
Ce este internetul?
Internetul este o rețea de întindere mondială, ce cuprinde o imensă colecție de informații disponibile prin intermediul calculatorului.
Termenul de internet este o prescurtare de la internetworking, care a apărut într-un protocol de rețea realizat de Yogen Dalal, Carl Sunshine și Vinton Cerf în anul 1974.
Un prim pas important în aparția internetului, l-a constituit apariția și dezvoltarea calculatoarelor, chiar dacă în anii 50 erau de dimensiunea unei camere. Transmiterea datelor de la calculatorul principal la terminal a costituit o etapă importantă în apariția internetului.
Internetul a fost descris ca „o colecție largă de rețete legate” sau ca o „rețea de rețele”.
Mașinile conectate la Internet pot comunica între ele folosind TCP/IP (Transmision Control Protocol/Internet Protocol). Sub denumirea de TCP/IP se regăsesc de fapt un număr mare de protocoale specializate pe tipuri de servicii.
Servicii oferite:
-transfer de fișiere;
-mesagerie electronică;
-accesul la informații;
-executarea de comenzi de la distantă;
-gestiune;
World Wide Web este o modalitate de a publica informații pentru cei conectați la rețea și de a se documenta prin citire sau prin ascultarea si vizualizarea informațiilor. Acest lucru este posibil cu ajutorul unui browser, care rulează pe calculator și are datoria de a „traduce” informația stocată pe server sub formă de instrucțiuni HTML și de a le afișa pe ecran.
Mai multe pagini adunate într-un sistem ierarhic, având un subiect comun, se numesc site Web.
Una din greșelile pe care unii dintre noi le facem este aceea de a confunda WWW (World Wide Web) cu noțiunea de internet. Un argument împotriva acestei confuzii este acela că WWW este o aplicație a internetului. Inventatorul WWW este omul de știință britanic Tim Bernes-Lee. Acesta împreună cu belgianul Robert Cailliau au dezvoltat pentru prima dată o comunicare prin intermediul unui protocol pentru transferul documentelor hipertext( HTTP).
Internetul poate fi în același timp o bibliotecă, o televiziune, un mall, un ziar, un cinematograf, o universitate, un loc de joacă, o piață, un mijloc de comunicare, o lume virtuală, locul unde mergi la muncă și multe altele. Este atât un spațiu privat, cât și un spațiu public, care funcționează după anumite reguli – la fel cum societatea funcționează după un set de norme sociale.
Figura 3
TEHNOLOGII UTILIZATE
HTML 5
CSS
MySQL
PHP
JavaScript
jQuery
Bootstrap
NetBeans
HTML 5
Tehnologia evoluează rapid, într-un ritm alert, în toate domeniile și cum era de așteptat, web development-ul nu putea să fie mai prejos. HTML-ul este limbajul cel mai folosit în acest moment pentru paginile web, însă acesta a „suferit” o dezvoltare simțitoare prin intermediul HTML5.
Având la bază principiile după care a fost dezvoltat HTML, ultima versiune a acestuia – HTML5, se bazează pe structură, sens și conținut. Cu alte cuvinte, HTML5 trebuie să descrie ce este un element în pagină, iar CSS3 să descrie cum trebuie să arate acel element.
Prin urmare, având aceste linii bine definite, schimbări au fost făcute pentru a veni în sprijinul dezvoltatorilor și designerilor. O parte din tag-urile deja cunoscute au fost scoase, iar altele au fost proaspăt introduse.
Începem cu începutul: Doctype-ul sau Document Type Declaration nu mai este atât de complicat și greu de reținut, cum a fost în versiunile anterioare de HTML sau XHTML, ci pur si simplu:
<!DOCTYPE HTML>
Aceasta ar trebui să fie prima linie de cod în fișierul html. Teoretic ea poate lipsi, însa un validator html va trebui apoi să „ghicească” ce versiune de html a fost folosită.
Secțiunea <head> este rezervată titlului paginii, informațiilor meta, javascript-urilor si css-urilor. De asemenea este o bună practică includerea charset-ului pentru a indica browserului ce tip de caractere să afișeze la încărcarea paginii.
<head>
<title></title>
<meta charset="UTF-9" />
</head>
Secțiunea <body> ramâne în continuare principala secțiune a paginii html.
<!DOCTYPE HTML>
<html>
<head>
<title></title>
<meta charset="UTF-9" />
</head>
<body>
<!– continut –>
</body>
</html>
În tabelul de mai jos voi prezenta tag-urile de bază ale HTML-ului:
Tabelul 1
Noile elemente în HTML5:
Cele mai cunoscute noutăți aduse de HTML5 sunt elementele de conținut header, article si footer, ce compun tag-urile cu aceleași nume. Omoloagele lor media: audio, canvas, figure și video ne scapă în sfârșit de scripturi de embed (în cazul fișierelor video/audio) și ne aduc funcționalități noi precum "desenarea" direct în pagină (cum este cazul canvas-ului).
VERSIUNI
Datele de lansare și versiunile HTML:
HTML 2.0 (24 Noiembrie 1995)
HTML 3.2 (Ianuarie 1997)
HTML 4.0 (Decembrie 1997)
HTML 4.01 (Decembrie 1999)
HTML 5.0 (Octombrie 2014)
Limbajul XHTML este un limbaj de programare care nu mai este dezvoltat separat și a început prin a fi o reformulare a limbajului HTML 4.01. Iată versiunile și datele de lansare ale acestui limbaj XHTML:
XHTML 1.0 (26 Ianuarie 2000)
XHTML 1.1 (31 Mai 2001)
A existat și o versiune 2.0, dar lucrul asupra acesteia a fost sistat în favoarea HTML 5.0 și XHTML5.
Figura 4
CSS(Cascading Style Sheets)
La data de 10 octombrie 1994, Hakon Wium Lie care era la acea dată coleg cu Tim Berners-Lee, a propus pentru prima dată limbajul Style Sheets (foaie de stil). Rezultatul propunerii, cam în aceeași perioada a mai multor limbaje style sheets a fost versiunea CSS1, versiune ce a fost lansată în anul 1996. Propunerea lui Bert Bos a fost decisivă, acesta devenind co-creator al limbajului CSS.
Este limbajul folosit pentru a descrie formatarea și aspectul unui document care este scris într-un limbaj de marcare. Pentru a schimba interfețele scrise în HTML și stilul paginilor web folosim de foarte multe ori limbajul CSS. Ca și în cazul altor limbaje, CSS-ul ne ajuta la crearea interfețelor de utilizator pentru aplicații web și pentru aplicații mobile, dar și la crearea paginilor web ale site-urilor.
Cu ajutorul CSS putem separa elemente precum aspect, culoare, font. Acesta fiind și unul din scopurile limbajului CSS. Privind această separare există și avantaje precum accesibilitatea conținutului, flexibilitatea și controlul caracteristicilor de prezentare, reducerea complexității și repetiția conținutului structural. Separarea instrucțiunilor de prezentare a conținutului HTML în fișiere separate sau secțiune de stil este posibilă cu ajutorul limbajului CSS.
Modificările design-ului unui proiect grafic pot fi aplicate foarte ușor și rapid prin a edita câteva rânduri ale fișierului. În cazul în care omitem să facem o legătură între documnt și foaia de stil, browser-ul va aplica un stil implicit.
Așa numita cascada (cascading) descrie un sistem de prioritate prin care se determină ce reguli de stil se aplică sau dacă sunt mai multe reguli.
VERSIUNI
Datele de lansare și versiunile CSS:
CSS 1 (17 Decembrie 1996)
CSS 2 ( Mai 1998)
CSS 2.1 (7 Iunie 2011)
CSS 3 ( Iunie 2013)
Figura 5
MySQL
MySQL este un sistem de gestiune a bazelor de date relaționale, produs de compania suedeză MySQLAB și este cel mai popular SGBD open-source la ora actuală.
Cei trei fondatori ai companiei suedeze MySQLAB sunt: Allan Larson, Michael Widenius și David Axmark. Pe data de 23 Mai 1995 a apărut prima versiune MySQL, iar compania este deținută în prezent de Oracle .
Unele dintre cele mai populare aplicații de acum precum: Youtube, Facebook, Twitter, Yahoo, Instagram folosesc baza de date MySQL.
Administrarea și gestionarea datelor conținute de către baza de date se poate face pe toate sistemele de operare. Iată exemple de platforme pe care se poate lucra cu baza de date MySQL: Linux, OS X, Microsoft Windows, OpenSolaris, Oracle Solaris, Symbian, I5/OS, SCO OpenServer. Platforma OpenVMS prezintă și ea un port MySQL.
Instrumente ale bazei de date MySQL:
MySQL Workbench
Adminer(cunoscut sub numele de phpMyAdmin)
Database Workbench
DBEdit
HeidiSQL
LibreOffice Base
Navicat
SQLyog
Webmin
VERSIUNI
Datele de lansare și versiunile MySQL:
Versiunea 3.19 ( finele anului 1996)
Versiunea 3.20 (Ianuarie 1997)
Versiunea 3.21 (1998)
Versiunea 3.22 (1998)
Versiunea 3.23 (22 Ianuarie 2001)
Versiunea 4.0 (Martie 2003)
Versiunea 4.1 (Octombrie 2004)
Versiunea 5.0 (Octombrie 2005)
Versiunea 5.1 (Noiembrie 2008)
Versiunea server 5.5 (Decembrie 2010)
Versiunea 5.6 (Februarie 2013)
Versiunea 5.7 (Decembrie 2013)
Figura 6
PHP
Php-ul este un limbaj de programare folosit pentru a crea site-uri web, iar prescurtarea PHP provine de la Personal Home Page Tools.
Este un limbaj de programare web open-source, reflectiv (abilitatea unui program de a-și observa și modifica structura și comportamentul) folosit în principal pentru dezvoltarea aplicațiilor server-side și a conținurilor web dinamice.
PHP este simplu de utilizat, fiind un limbaj de programare structurat, ca și C-ul, Perl-ul sau chiar Java, sintaxa limbajului fiind o combinație a celor trei.
Probabil una dintre cele mai importante facilități ale limbajului este conlucrarea cu majoritatea bazelor de date relaționale, de la MySQL și până la Oracle, trecând prin MS Sql Server, PostgreSQL, sau DB2.
PHP poate rula pe majoritatea sistemelor de operare, de la UNIX, Windows, sau Mac OS X și poate interacționa cu majoritatea serverelor web. Codul PHP este interpretat de serverul WEB și generează un cod HTML care va fi văzut de utilizator .
PHP folosește extensii specifice pentru fișierele sale: .php, .php3, .ph3, .php4, .inc, .phtml. Aceste fișiere sunt interpretate de către serverul web iar rezultatul este trimis în formă de text sau cod HTML către browser-ul clientului.
Versiunile 5.2 și anterioare
În aceste versiuni funcțiile nu sunt obiecte de primă clasă. Aceasta înseamnă că funcțiile nu pot fi create dinamic în timpul executării programului și că pot fi chemate doar prin numele dat când au fost definite. Utilizatorul poate crea funcții în orice moment în program.
Versiunile 5.3 și mai noi
PHP are suport pentru funcții de rangul întâi și pentru funcții anonime, precum cele folosite în Javascript.
Figura 7
JavaScript
Limbajul JavaScript este un limbaj descriptiv, compact, dezvoltat de Netscape pentru realizarea aplicațiilor client-server pe Internet. Netscape interpretează scripturile Java, incluse într-o pagină HTML în raport cu evenimentele activate de utilizator (click-ul de mouse, completare de câmpuri într-un formular, navigare, etc.).
Conceput pe principiile programării obiectuale, are predefinite un set de obiecte legate intr-o varietate de componente ale unei pagini HTML, împreună cu relațiie dintre acestea.
Fară a intra în prea multe detalii, JavaScript este interpretativ, destinat elaborarii scenariilor la fel ca și PERL, dar spre deosebire de acesta, unde scenariile se execută pe server, scenariile JavaScript sunt executate de către browser (Netscape Navigator, Internet Explorer), care reprezintă astfel interfața dintre utilizator și Web.
JavaScript poate fi încorporat într-un document HTML în doua situații: ca declarații și funcții, folosind elementul <SCRIPT> respectiv, sau ca metode de tratare a evenimentelor folosind elementele HTML, cu mențiunea că orice browser ce nu suportă JavaScript, ignoră secvențele de instrucțiuni precizate ca și comentarii. JavaScript este sezitiv la tipul de caractere.
Este de dorit ca funcțiile JavaScript să fie definite la începutul documentului (în secțiunea HEAD). Faptul că HEAD este lansat întotdeauna primul, garantează lansarea funcțiilor înainte ca utilizatorul să aibă o șansă să producă un eveniment care ar putea să apeleze o funcție.
Codul JavaScript nu se execută pur și simplu prin citirea și verificarea sintactică a erorilor din blocul SCRIPT, dat fiind faptul că browserul recunoaște codurile și funcțiile JavaScript, salvând definițiile acestora pentru o utilizare ulterioară. În JavaScript funcțiile sunt apelate doar de evenimente.
VERSIUNI
Versiunile și datele de lansare JavaScript:
JavaScript 1.0 (1995)
JavaScript 1.0 (1996 )
JavaScript 1.1 (1996)
JavaScript 1.2 ( 1997)
JavaScript 1.2 (JScript 3.0 1997)
JavaScript 1.3 (1998)
JavaScript 1.3 (JScript 5.0 1999)
Figura 8
jQuery
jQuery este o librărie JavaScript care simplifică foarte mult programarea JavaScript. Este ușor de învățat, iar librăria jQuery poate fi adăugată la o pagină web cu o singură linie de markup.
Librăria jQuery conține următoarele caracteristici:
• HTML element selections
• HTML element manipulation
• CSS manipulation
• HTML event functions
• JavaScript Effects and animatii
• HTML DOM traversal and modification
• AJAX
• Utilități
Librăria jQuery este stocată într-un singur fișier JavaScript, conținând toate metodele jQuery. Două versiuni jQuery sunt disponibile pentru download: una comprimată, pentru producție și alta necomprimată (pentru debugging).
Sintaxa jQuery este special concepută pentru selectarea elementelor HTML și efectuarea de acțiuni cu aceste elemente.
Sintaxa de bază este: $(selector).actiune()
• Un semn dolar pentru a defini cod jQuery
• Un (selector) pentru a găsi "query" elementele HTML
• acțiune jQuery action() ce va fi executată pe elemente
Dacă website-ul conține multe pagini, și doriți ca funcțiile jQuery să fie ușor de întreținut, puneți funcțiile jQuery într-un fișier .js separat.
Figura 9
BOOTSTRAP
Bootstrap este o bibliotecă disponibilă open-source, folostită pentru realizarea site-urilor și a aplicațiilor web. Acesta are ca scop facilitarea dezvoltării de site-uri dinamice și aplicații web. Bootstrap-ul conține HTML și template-uri de design bazate pe CSS pentru tipografie, formulare, butoane, navigare și alte componente de interfată.
Bootstrap , inițial numit Twitter Blueprint , a fost dezvoltat de Mark Otto și Jacob Thornton la Twitter ca un framework pentru a încuraja consecvența pentru instrumente interne. Înaintea Bootstrap –ului, diverse biblioteci au fost utilizate pentru dezvoltarea interfeței, ceea ce a dus la inconsistențe și o dificultate ridicată pentru intreținere.
După câteva luni în care a fost dezvoltat de un grup mic, mulți dezvoltatori de la Twitter au început să contribuie la proiect . Acesta a fost redenumit din Twitter Blueprint în Bootstrap și lansat ca un proiect open-source în data de 19 August 2011.
Acesta a continuat să fie întreținut de către Mark Otto, Jacob Thornton, și un mic grup de dezvoltatori.
Bootstrap este compatibil cu cele mai recente versiuni ale Google Chrome , Firefox, Internet Explorer, Opera, Safari, deși unele dintre aceste browsere nu sunt acceptate pe toate platformele.
Încă de la versiunea 2.0, el suportă design-ul responsive al paginilor web. Acest lucru înseamnă că aspectul paginilor web se ajustează în funcție de caracteristicile dispozitivului utilizat (dekstop, tabletă, telefon mobil).
Figura 10
2.1.8 NETBEANS
În anul 1996 a luat naștere NetBeans sub denumirea de Xelfi. Cel care a creat compania și a început să comercializeze produsul NetBeans IDE în anul 1997 a fost Roman Stanek. În anul 1999 compania Sun Microsystems a cumpărat această companie creată de Stanek. Acesta a fost momentul creșterii comunitații NetBeans.
Sistemele de operare precum Microsoft Windows, Mac OS X, Linux, Solaris sunt cele pe care rulează NetBeans-ul. Cu ajutorul său putem ca utilizator să dezvoltăm cu ușurință aplicații web și mobile care folosesc sintaxe HTML, JavaScript, CSS. Acesta ne este prezentat ca o aplicație software care este scrisă in limbajul Java. Acesta ne ajută să dezvoltăm o aplicație prin anumite componente software care se numesc module. În mediul de dezvoltare integrat NetBeans sunt incluse aplicațiile dezvoltate cu ajutorul NetBeans.
Platformele NetBeans IDE sunt fișiere de tip open-source ce permit dezvoltarea tuturor aplicațiilor limbajului de programare Java. Exemple de aplicații Java: Java Standard Edition, EJB, JPA. Avantajele aceastei platforme permite utilizatorilor săi să se concentreze asupra aplicației lor.
Alte limbaje de programare ce sunt suportate pe NetBeans IDE sunt:
PHP
C și C++
HTML5
Printre caracteristicile acestei platforme regăsim:
UI management(meniu și bară de instrumente)
Management setări
Management stocări
Management ferestre
Librăria NetBeans Visual
VERSIUNI
Datele de lansare și versiunile:
NetBeans IDE 6.5 (Noiembrie 2008)
NetBeans IDE 6.9 (Iunie 2010)
NetBeans IDE 7.0 (Aprilie 2011)
NetBeans IDE 7.0.1(1 August 2011)
NetBeans IDE 7.3 (Februarie 2013)
NetBeans IDE 7.4 (15 Octombrie 2013)
NetBeans IDE 8.0 (18 Martie 2014)
PREZENTARE APLICAȚIE:
3.1 Structura aplicației:
Aplicația este structurată în două părți, partea de administare a acesteia și partea ce afișează interfața pentru utilizatori.
Structura aplicației dedicată administrării acesteia:
Figura 11
Secțiunea de administrare a aplicației oferă posibilitatea administratorului site-ului de a adăuga sau edita componentele ce vor fi alese ulterior de către utilizatori, pentru a crea propria configurație. Fișierele ce crează această structură sunt conținute de pachetul ,,admin”.
Structura aplicației pentru interfața utilizatorilor:
Figura 12
În figura de mai sus sunt prezentate fișierele ce crează interfața dedicată utilizatorilor:
„index.php” , „de_stiut.php” , „contact.php” sunt fișierele ce crează cele trei pagini ale aplicației: Acasă , Dicționar tehnic de specialitate și Contact
„login.php” , „logout.php” , „register.php” sunt fișierele rsponsabile pentru înregistarea și autentificarea utilizatorilor
„details.php” crează pagina unde utilizatorul selectează componentele configurației
„profile.php” afișează configurația finală aleasă de către utilizator.
3.2 Prezentare interfață utilizator
Figura 13
Aceasta este pagina de întâmpinare a utilizatorilor. În partea de sus se găsește meniul, cu cele trei butoane pentru paginile aplicației, logo-ul, dar și secțiunea pentru înregistrarea și autentificarea utilizatorilor. Partea centrală prezintă o zonă ce conține materiale reprezentative domeniului de aplicabilitate al aplicației, iar în partea de jos sunt prezentate primele componente ce vor fi alese pentru a se începe procesul de configurare, și anume plăcile de bază.
Figura 14
Meniul principal conține butoanele „Acasă”, „Dicționar tehnic de specialitate” și „Contact”, care orientează utilizatorul către paginile respective. În partea dreaptă se regăesc butoanele „Register”, unde utilizatorul are posibilitatea să își creeze propriul cont, dar și butonul „Login”, care permite autentificarea.
Figura 15
În partea centrală a paginii de întâmpinare se află o animație care prezintă procesul de asamblare al unui calculator, dar și o zonă de text, care conține mesaje folosite pentru promovarea aplicației.
Figura 16
În partea de jos a paginii de întâmpinare se găsesc o serie de plăci de bază, însoțite de imagini reprezentative, numele și socket-ul acestora. Pentru a începe procesul de configurare, utilizatorul trebuie să aleagă una dintre aceste componente.
Figura 17
Aceasta este a doua pagină a aplicației, „Dicțonar tehnic de specialitate”. În această secțiune sunt puse la dispoziția utilizatorului informații de bază despre toate componentele ce vor fi alese ulterior în procesul de configurare.
Figura 18
Cea de-a treia pagină regăsită în meniul princial este pagina ,,Contact”. În formularul de contact, utilizatorul trebuie să completeze toate cele 3 câmpuri : numele , email-ul și mesajul ce dorește să fie transmis. După completarea corectă a formularului de contact, se va afișa o previzualizare a mesajului ce dorșste să fie transmis, după cum se poate vedea în figura 19.
Figura 19
Figura 20
Prin accesarea butonului „Register”, utilizatorul este redirecționat către formularul din figura 20, unde acesta își crează un cont personal, prin completarea corespunzătoare a celor trei câmpuri: numele, adresa de email și parola.
Figura 21
Pentru autentificare, utilizatorul trebuie să utilizeze butonul ,,Login”, care va afișa formularul de mai sus. Prin completarea celor doua câmpuri, email-ul și parola personala, se realizează cu success autentificarea.
Figura 22
Pentru a începe procesul de configurare, prima etapă este alegerea uneia dintre plăcile de bază afișate în figura de mai sus. Fiecare placă de bază conține o imagine sugestivă , numele dar și socket-ul corespunzator. Socket-ul plăcii de bază indică tipul procesorului compatibil cu aceasta.
Figura 23
După alegerea plăcii de bază , utilizatorul va fi redirecționat către pagina în care acesta trebuie să aleagă urmatoarele componente: memoria RAM, procesorul, unitatea de stocare și placa video.
Pentru a putea finaliza și salva configurația, utilizatorul trebuie să se autentifice, accesând butonul ,,Login” aflat în partea de sus a paginii.
Figura 24
În figura de mai sus se poate observa modul de alegere al componentelor, precum și apariția butonului ,,Finalizare”, după autentificarea utilizatorului.
Figura 25
Odată ce alegerea componentelor este finalizată, în partea de sus a paginii apare confirmarea acesteia și indică utilizatorului cum poate vizualiza configurația aleasa. Pentru vizualizarea acesteia, utilizatorul trebuie să acceseze butonul „Profil”, aflat în partea de sus a paginii.
Figura 26
În figura 26 este prezentat modul în care configurația finală este afișată. Componentele alese, memoria RAM, procesorul, placa de bază, unitatea de stocare dar și placa video sunt prezentate pe o linie orizontală. Pentru fiecare utilizator autentificat, se vor afișa toate configurațiile alese de către acesta.
3.3 Prezentare interfață administrator
Figura 27
Administratorul aplicației are posibilitatea de a adăuga și edita componentele. În figura 27 este prezentat modul prin care administratorul se poate autentifica, utilizând un cont prestabilit.
Figura 28
Acesta este meniul principal al interfeței de administrare. În parte dreaptă se observă confirmarea autentificării administratorului, iar în zona centrală butoanele corespunzătoare fiecarei componente, oferind posibilitatea de a adăuga și edita componentele.
Figura 29
În figura de mai sus sunt prezentate plăcile de bază adaugate ulterior. Această afișare este similară și pentru restul componentelor, memoria RAM, procesorul, unitatea de stocare și placa video. Prin accesarea butonului „Adaugă placa de bază”, administratorul are posibilitatea de a adăuga noi plăci de bază.
Figura 30
Pentru a adăuga o nouă placă de bază, trebuie să completăm câmpurile „Denumire” și „Preț”, iar pentru a adăuga o imagine sugestivă , trebuie să accesăm butonul „Alege fișier”. Adaugarea noii plăci de bază se încheie prin accesarea butonului „Submit” , iar după acest ultim pas, noua componentă este disponibilă utilizatorilor.
Figura 31
Pentru a edita una dintre componentele adăugate, administratorul utilizează butonul „Editează”, aflat în partea din dreapta a paginii, apoi va fi redirecționat către meniul pentru editarea componentei respective.
Figura 32
În figura 32 este prezentat modul de editare al unei coponente. După selectarea acesteia, avem posibilitatea de a edita numele componentei, prețul, precum și asignarea acesteia unei alte plăci de bază.
Figura 33
În figura 33 se poate observa design-ul responsive al aplicației. Acesta are capacitatea să-și adapteze design-ul paginilor în funcție de rezoluția ecranului (laptop, tabletă,telefon), fară a suferi degradări majore.
Design-ul responsive a devenit din ce în ce mai important, deoarece în ultimul timp, oamenii au început să folosească tot mai mult tabletele și smartphone-urile.
Design-ul responsive are o serie de avantaje:
crește vizibilitatea și lizibilitatea informațiilor furnizate de aplicație
procesul de navigare este mai ușor, iar spațiul de navigare este mai mare
nu mai sunt necesare versiuni speciale pentru mobil, care să necesite dezvoltate separată
Pe de altă parte, design-ul responsive necesită un volum de mucă mai mare în faza de implementare, iar uneori apar mici incompatibilități între browsere sau erori de afișare.
PREZENTAREa TEHNICĂ A APLICAȚIEI
4.1 Meniul de prezentare al produselor
Figura 34
Clasa „Produse” preia informațiile din tabela „motherboards”, iar în interiorul acestei clase sunt create doua funcții:
„getProdus”, care preia toate informațiile din tabela respectivă într-o ordine aleatoare.
„getPID”, care preia informațiile în funcție de id-ul fiecărui produs.
Figura 35
Figura 36
În figurile 25 si 26 sunt prezentate plăcile de bază aflate în antetul paginii principale. Acestea sunt în numar de 6 și au o dispunere orizontală, pe un singur rând.
Deasemenea, este locul în care utilizatorul începe procesul de configurare prin selecția uneia dintre plăcile de bază.
4.2 Adăugarea plăcilor de bază de către administrator
Figura 37
Figura 27 prezintă modul în care se adaugă și se editează plăcile de bază de către administratorul aplicației. Pentru adăugarea unei noi plăci de bază, administratorul trebuie să se autentifice, apoi va adăuga numele plăcii, prețul estimativ al acesteia și deasemenea, trebuie să încarce o imagine a plăcii de bază.
4.3 Editarea plăcilor de bază de către administrator
Figura 38
În figura 38 este prezentat modul prin care administratorul editează plăcile de bază. Acesta are posibilitatea de a modifica denumirea plăcii de bază, dar și prețul acesteia.
Această structură este similară și pentru restul componentelor : „procesor”, „memoria RAM”, „placa video” și „unitatea de stocare”.
4.4Crearea meniului principal
Figura 39
În figura 28 sunt prezentate funcțiile ce crează meniul principal al aplicației. Acesta este format din cele trei butoane active „Acasa”, „Dicționar tehnic de specialitate” și „Contact”, precum și butoanele „Login” și „Register”, responsabile cu autentificarea utilizatorilor dar și a administratorului.
4.5Prezentarea formularului de contact
Figura 40
În figura 39 sunt prezentate crearea și funcționalitatea formularului de contact, aflat pe pagina principală a aplicației. Acesta este format din câmpurile „Nume”, „Email” și „Mesaj”, dar și butonul „Trimite”. Dacă toate câmpurile sunt completate corespunzător se va afișa mesajul „Mesajul a fost trimis cu succes”.
4.5 Afișarea configurației
Figura 41
În figura de mai sus este prezentată funcția PHP care afișează configurația aleasă de către utilizator. Dacă câmpurile „RAM”, „CPU”, „Placa de baza”, „HDD”, „VIDEO” sunt completate corespunzător, componentele alese vor fi afișate.
4.6 Baza de date MySQL
Figura 42
Aplicația folosește o bază de date MySQL, iar în figura 32 este prezentat modul în care se realizează conexiunea între aplicație și baza de date. Aceasta este una dintre cele mai importante părti ale aplicației, deoarece oferă posibilitatea stocării componentelor dar și a configurațiilor.
Figura 43
În figura 33 sunt prezentate cele 9 tabele ce compun baza de date, necesară funcționării aplicației.
Figura 44
Figura 34 prezintă structura tabelei „cpu”. Structura este regăsita și pentru tabelele „hdd”, „motherboard”, „RAM”, „video”. Aici sunt stocate componentele introduse de către administratorul aplicației.
Figura 45
În figura de mai sus este prezentată structura tabelei ,, admins”, tabela în care sunt stocate informațiile pentru contul administratorului.
Figura 46
Figura 36 prezintă structura tabelei ,,users”. Aici sunt stocate informațiile conturilor utilizatorilor înregistrați.
Figura 47
În figura de mai sus este prezentată structura tabelei ,,saved”. În această tabelă sunt stocate toate configurațiile realizate.
Concluzii
În această lucrare a fost prezentată realizarea unei aplicații pentru configurarea unui sistem de calcul, mai exact a unei unitati de calculator. Configurarea unui sistem presupune necesitatea unor cunoștințe legate de compatibilitatea componentele.
Internetul a avansat rapid, iar în zilele noastre este principala sursă de informare, deaorece se pot afla rapid și usor informațiile dorite. Deasemenea este cea mai bună metoda prin care firmele din diferite domenii își promovează produsele și serviciile oferite.
Magazinele care comercializează produse IT sunt din ce în ce mai numeroase, iar oamenii preferă sa se informeze și să comande produsele, direct de acasă, prin intermediul internetulului. Astfel, lucrarea pe care am realizat-o vine în sprijinul persoanelor care doresc să își configureze o unitate de calculator rapid și ușor.
Pentru realizarea aplicațiiei am utilizat o serie de tehnologii precum: html, css, javascript, mysql, php. Aprofundarea acestor tehnologii se bazează pe anii de studiu din timpul facultății, precum și pe studiul individual.
Având o interfată simplă, aplicația este ușor de folosit, iar pașii pentru crearea configurației sunt bine precizați.
Colaboarea cu îndrumatorul proiectului, doamna conf.dr.ing Daniela Danciu, a fost benefică și a decurs foarte bine.
În concluzie, această aplicație este un exemplu ce poate fi utilizat de către posesorul unui magazin dedicat componentelor pentru calculatoare, unde clienții își pot configura propria unitate de calculator, urmând să achiziționeze componentele alese din magazinul respectiv.
Aplicația este importantă, deoarece oferă posibilitatea informării și alegerii produselor dorite direct de acasă, având la dispoziție doar un dispozitiv conectat la rețeaua internet.
Bibliografie
[PET98] – Charles Petzold, Programming Windows, 5th Edition, Editura Microsoft Press, 1998
[WEL11] – Luke Welling, Laura Thomson, Dezvoltarea aplicatiilor Web cu PHP si MySQL, Editura Teora, 21noiembrie 2011
[WAD13] – Zubin Wadia,Hazem Saleh ,Allan Lykke Christensen ,Pro JSF and HTML5, Editura Apress,8 decembrie 2013
[CAS03] – Elizabeth Castro ,HTML pentru world wide web , Editura Corint ,ianuarie 2003
[HOL13] – Molly Holzschlag ,The Designer’s Edge, 12 noiembrie 2013
[VAS10] -Vikram Vaswani, Mert Çalıșkan, Utilizarea si administrarea bazelor de date MySQL, Editura Rosetti Educational, 2010
[FLA11] – David Flanagan, JavaScript: The Definitive Guide, 6th Edition, Editura O’RELLY,aprilie 2011
Referințe web
[HTML16] – http://en.wikipedia.org/wiki/HTML
[YOU16]- https://www.youtube.com/watch?v=4QllNAdZPcQ
[HTML5]- https://en.wikipedia.org/wiki/File:HTML5_logo_and_wordmark.svg
[HTML16]-https://en.wikipedia.org/wiki/HTML
[CSS16]-https://en.wikipedia.org/wiki/Cascading_Style_Sheets
[MSQ16]-https://en.wikipedia.org/?title=MySQL
[BOO16]- https://en.wikipedia.org/wiki/Bootstrapping
[NET16]-https://en.wikipedia.org/?title=NetBeans
[BOO16]- https://en.wikipedia.org/wiki/Bootstrapping
[PHP16]-http://www.preferatele.com/docs/informatica/noi/php201621919.php
[JSC16]- http://www.qreferat.com/referate/informatica/JavaScript421.php
[NET16]-https://en.wikipedia.org/wiki/NetBeans
[PRE16]- http://www.preferatele.com/docs/informatica/1/marcaje-css-7.php
[JQU16]- http://www.w3schools.com/jquery/
[DEV]- http://devicebox.ro/tehnologia/componentele-unui-calculator.html
[TOT16]- http://totuldesprecalculatoare.weebly.com/
[HTML16] – http://en.wikipedia.org/wiki/HTML_element
[INF6]- http://www.info-portal.ro/articol/ce-este-internetul/382/1/0/
[WCS16]-http://www.w3.org/wiki/CSS/Training/Priority_level_of_selector
[EMA16]- http://www.emag.ro/componente/
Codul sursă
Index.php
<!DOCTYPE html>
<?php
require_once ('inc/common.php');
$product = new Produse();
$p = $product->getProdus();
?>
<html>
<head>
<title>Configurator</title>
<meta name="keywords" content="">
<meta name="description" content="">
</head>
<body background="assets/images/fundal.png">
<?php
include('inc/header.php');
?>
<?php
include('inc/menu.php');
?>
<div id="jssor_1" style="position: relative; margin: 0 auto; top: 60px; left: 0px; width: 1300px; height: 500px; overflow: hidden; visibility: hidden;">
<!– Loading Screen –>
<div data-u="loading" style="position: absolute; top: 0px; left: 0px;">
<div style="filter: alpha(opacity=70); opacity: 0.7; position: absolute; display: block; top: 0px; left: 0px; width: 100%; height: 100%;"></div>
<div style="position:absolute;display:block;background:url('assets/images/slider/loading.gif') no-repeat center center;top:0px;left:0px;width:100%;height:100%;"></div>
</div>
<div data-u="slides" style="cursor: default; position: relative; top: 0px; left: 0px; width: 1300px; height: 500px; overflow: hidden;">
<div data-p="225.00" style="display: none;">
<img data-u="image" src="assets/images/slider/7.jpg" />
<div style="position: absolute; top: 60px; left: 160px; width: 480px; height: 120px; font-size: 20px; color: #D0D7D9; line-height: 60px;"> </div>
<div style="position: absolute; top: 300px; left: 120px; width: 480px; height: 120px; font-size: 20px; color: #D0D7D9; line-height: 35px;"> </div>
<iframe class="video-slider" height="315" src="https://www.youtube.com/embed/Kw5sYwwOcpw" frameborder="1" allowfullscreen></iframe>
</div>
</div>
<!– Bullet Navigator –>
<div data-u="navigator" class="jssorb05" style="bottom:16px;right:16px;" data-autocenter="1">
<!– bullet navigator item prototype –>
<div data-u="prototype" style="width:16px;height:16px;"></div>
</div>
<!– Arrow Navigator –>
<span data-u="arrowleft" class="jssora22l" style="top:0px;left:12px;width:40px;height:58px;" data-autocenter="2"></span>
<span data-u="arrowright" class="jssora22r" style="top:0px;right:12px;width:40px;height:58px;" data-autocenter="2"></span>
</div>
<section id="start" class="welcome">
<div class="container">
<h4><b>Alegeți una dintre plăcile de bază pentru a începe configurarea</b></h4>
<div class="row">
<?php foreach ($p as $placi) { ?>
<div class="col-xs-6 col-md-2">
<a href="details.php?id=<?php echo $placi->id; ?>" class="thumbnail">
<img src="<?php echo $placi->image; ?>" alt="…">
</a>
<a href="details.php?id=<?php echo $placi->id; ?>">
<h5 class="title"><?php echo $placi->name; ?></h5>
</a>
</div>
<?php } ?>
</div>
</div>
</section>
<script type="text/javascript" src="assets/js/jquery.js"></script>
<script type="text/javascript" src="assets/js/bootstrap.min.js"></script>
<script type="text/javascript" src="assets/js/custom.js"></script>
<script type="text/javascript" src="assets/js/jssor.slider.mini.js"></script>
<script>
jQuery(document).ready(function ($) {
var jssor_1_SlideoTransitions = [
[{b: 5500, d: 3000, o: -1, r: 240, e: {r: 2}}],
[{b: -1, d: 1, o: -1, c: {x: 51.0, t: -51.0}}, {b: 0, d: 1000, o: 1, c: {x: -51.0, t: 51.0}, e: {o: 7, c: {x: 7, t: 7}}}],
[{b: -1, d: 1, o: -1, sX: 9, sY: 9}, {b: 1000, d: 1000, o: 1, sX: -9, sY: -9, e: {sX: 2, sY: 2}}],
[{b: -1, d: 1, o: -1, r: -180, sX: 9, sY: 9}, {b: 2000, d: 1000, o: 1, r: 180, sX: -9, sY: -9, e: {r: 2, sX: 2, sY: 2}}],
[{b: -1, d: 1, o: -1}, {b: 3000, d: 2000, y: 180, o: 1, e: {y: 16}}],
[{b: -1, d: 1, o: -1, r: -150}, {b: 7500, d: 1600, o: 1, r: 150, e: {r: 3}}],
[{b: 10000, d: 2000, x: -379, e: {x: 7}}],
[{b: 10000, d: 2000, x: -379, e: {x: 7}}],
[{b: -1, d: 1, o: -1, r: 288, sX: 9, sY: 9}, {b: 9100, d: 900, x: -1400, y: -660, o: 1, r: -288, sX: -9, sY: -9, e: {r: 6}}, {b: 10000, d: 1600, x: -200, o: -1, e: {x: 16}}]
];
var jssor_1_options = {
$AutoPlay: true,
$SlideDuration: 800,
$SlideEasing: $Jease$.$OutQuint,
$CaptionSliderOptions: {
$Class: $JssorCaptionSlideo$,
$Transitions: jssor_1_SlideoTransitions
},
$ArrowNavigatorOptions: {
$Class: $JssorArrowNavigator$
},
$BulletNavigatorOptions: {
$Class: $JssorBulletNavigator$
}
};
var jssor_1_slider = new $JssorSlider$("jssor_1", jssor_1_options);
//responsive code begin
//you can remove responsive code if you don't want the slider scales while window resizing
function ScaleSlider() {
var refSize = jssor_1_slider.$Elmt.parentNode.clientWidth;
if (refSize) {
refSize = Math.min(refSize, 1920);
jssor_1_slider.$ScaleWidth(refSize);
}
else {
window.setTimeout(ScaleSlider, 30);
}
}
ScaleSlider();
$(window).bind("load", ScaleSlider);
$(window).bind("resize", ScaleSlider);
$(window).bind("orientationchange", ScaleSlider);
//responsive code end
});
</script>
</body>
</html>
De_stiut.php
<!DOCTYPE html>
<?php
require_once ('inc/common.php');
$product = new Pagina1();
$p = $product->getContent();
//print_r($p);
?>
<html>
<head>
<title>Configurator</title>
<meta name="keywords" content="">
<meta name="description" content="">
</head>
<body background="assets/images/fundal.png">
<?php
include('inc/header.php');
?>
<?php
include('inc/menu.php');
?>
`<div class="container">
<h3 style="text-align: center; font-weight: bold;">Dicționar tehnic de specialitate</h3>
<div class="content">
<p class="subtitle"><b>PLACA DE BAZĂ</b></p>
<p>
Placa de bază este placa principală dintr-un calculator. Pe ea se leagă între ele absolut toate componentele calculatorului.
Este componenta principală a calculatorului. Ea trebuie să recunoască toate componentele din calculator. Aceasta se alege în funcție de platforma pe care o alegem: Intel sau AMD. Pe piată avem socket-uri de la Intel precum: Intel 1151, Intel 1150, Intel 1155, Intel 2011, Intel 775. La AMD avem următoarele socket-uri: AMD AM3, AMD AM3+, AMD FM1, AMD FM2. AM3 si AM3+ sunt compatibile la aceștia, așadar puteți să alegeți fară probleme un procesor AM3+ și o placă de bază AM.
<br/><br/><br/>
<img class="img-responsive" style="max-width: 400px; width: 100%; margin: 0 auto;" src="assets/images/placa_de_baza.png" alt="" title=""/>
</p>
<p class="subtitle"><b>Procesorul</b></p>
<p>
Procesorul sau CPU (Central Processing Unit) este creierul calculatorului. Este cea mai importantă componentă a calculatorului.
Frecvența (viteza) procesorului se masoară în MHz (megahertzi) sau GHz (gigahertzi). Cu cât are frecvența mai mare, cu atât mai bine, deoarece cu atât "pulsează" datele mai repede. Un procesor din prezent are până la 4 GHz (4000 MHz).
Cele două mari firme principale de procesoare sunt Intel si AMD. Procesoarele lor sunt foarte diversificate, de exemplu, Intel are foarte multe modele de procesoare, printre care Celeron, Pentium, Core 2, Core i3, Core i7, etc. Cel mai rapid procesor actual este Core i7.
<br/><br/><br/><img class="img-responsive" style="max-width: 350px; width: 100%; margin: 0 auto;" src="assets/images/procesor.png" alt="" title=""/>
</p>
<p class="subtitle"><b>MEMORIA RAM</b></p>
<p>
Memoria RAM (Random Access Memory) este memoria principală a calculatorului. Memoria RAM este "masa de lucru" a procesorului. Fie că-i melodie, poză, sau joc, acestea rulează în memoria calculatorului, deci în RAM. Nu pot sa funcționeze direct de pe hard disk.
Toate documentele, pozele, melodiile, programele, serviciile pe care le ai deschise, sunt aici, în RAM, până când le închizi sau până când oprești calculatorul, și atunci se șterg inevitabil din memorie, pentru că este volatilă.
Capacitatea memoriei RAM se masoară în MB (megabaiti) sau GB (gigabaiti).
<br/><br/><br/><img class="img-responsive" style="max-width: 400px; width: 100%; margin: 0 auto;" src="assets/images/ram.png" alt="" title=""/>
</p>
<p class="subtitle"><b>PLACA VIDEO</b></p>
<p>
Placa video este placa grafică a calculatorului. Ea generează imaginea.
Capacitatea plăcii video se masoară în MB (megabaiti) sau GB (gigabaiti). O placa video modernă normală are între 256 MB si 1 GB. Cele mai puternice plăci video au ajuns până la 4 GB.
Placa video este defapt un procesor de grafică GPU (Graphics Processing Unit) cu memorie RAM specială. Acestea sunt facute pentru a nu apela la memoria principală computerului. Astfel redarea 3D este mult mult mai rapidă.
Multe plăci video au funcții suplimentare, precum TV tuner, decodare MPEG-2 și MPEG-4 sau posibilitatea de a conecta mai multe monitoare.
Plăcile video se conectează pe placa de bază prin slotul PCI-Express
<br/><br/><br/><img class="img-responsive" style="max-width: 350px; width: 100%; margin: 0 auto;" src="assets/images/video.png" alt="" title=""/>
<p>
<p class="subtitle"><b>UNITATEA DE STOCARE (HARD DISK-UL)</b></p>
<p>
Hard disk-ul este unitatea principală de stocare a datelor. Orice se instalează și copiază în calculator se stochează în hard disk, muzică, poze, filme, jocuri.
Capacitatea hard-disk-ului se masoară in GB (gigabaiti). (10 GB, 20 GB, 40 GB, 80 GB, 160 GB, etc.)
În prezent există hard disk-uri până la 4000 GB. Adică 4 TB (4 terrabaiti).
În interiorul hard disk-ului se află unul sau mai multe platane. Platanul este un disc magnetic, suportul magnetic pe care se stochează datele.
Cele două tipuri principale de hard disk-uri sunt de tip IDE si SATA.
Hard disk-urile SATA sunt mult mai rapide decât cele IDE. Suportă transfer de date de 150 MB/s. IDE suporta doar 16 MB/s.
<br/><br/><br/><img class="img-responsive" style="max-width: 350px; width: 100%; margin: 0 auto;" src="assets/images/hdd.png" alt="" title=""/>
</p>
<p class="subtitle"><b>UNITATEA DE STOCARE (Solid State Disk)</b></p>
<p>
Solid State Disk (SSD) este un tip nou de hard disk în care locul platanelor a fost luat de chip-uri de memorie flash.
Prima companie care a conceput acest tip de hard disk este Samsung, dar în prezent sunt mai multe companii care produc astfel de harduri.
Tehnologia SSD oferă rate mai mici de consum de energie și viteze mai mari de transfer.
Rata de citire a datelor este de aproximativ 67 MB/s iar datele se pot accesa în mai puțin de 0.01 milisecunde (mult mai rapid decât cele mai bune hard diskuri actuale).
Legat de consumul de energie, aceste harduri consumă cu 50% mai puțină energie decât hardurile convenționale, și anume 0.9 W față de 1.9 W la hardurile cu platane.
<br/><br/><br/><img class="img-responsive" style="max-width: 350px; width: 100%; margin: 0 auto;" src="assets/images/ssd.png" alt="" title=""/>
</p>
</div>
</div>
</body>
</html>
Contact.php
<!DOCTYPE html>
<html>
<head>
<title>Configurator – Contact</title>
<meta name="keywords" content="">
<meta name="description" content="">
</head>
<body background="assets/images/fundal.png">
<?php
include('inc/header.php');
include('inc/menu.php');
$message = '';
if (isset($_POST['submit'])) {
$to = "andrey_c07@yahoo.com";
$subject = "Contact Configurator";
$name = $_POST['name'];
$email = $_POST['email'];
$content = $_POST['content'];
$message = "Nume: $name <br/>\n\n Emai: $email <br/> \n\n Mesaj: \n\n $content ";
if (empty($name) || empty($email) || empty($content)) {
$success = "Mesajul a fost trimis cu success";
mail($to, $subject, $message);
}
}
?>
<section class="contact">
<div class="container">
<div class="row">
<div class="col-md-3"></div>
<div class="col-md-6">
<?php echo $message; ?>
<h4 style="text-align: center; margin-bottom: 20px;">Formular contact</h4>
<form method="post" actio="">
<div class="input-group">
<span class="input-group-addon" id="basic-addon1">Nume</span>
<input type="text" name="name" class="form-control" placeholder="Nume" aria-describedby="basic-addon1">
</div>
<br/>
<div class="input-group">
<span class="input-group-addon" id="basic-addon1">Email</span>
<input type="text" name="email" class="form-control" placeholder="Email" aria-describedby="basic-addon1">
</div>
<br/>
<div class="input-group">
<span class="input-group-addon" id="basic-addon1">Mesaj</span>
<textarea name="content"></textarea>
</div>
<br/>
<input style="width: 100px;" class="btn btn-danger" type="submit" name="submit" value="Trimite"/>
</form>
</div>
</div>
</div>
</section>
</body>
</html>
Details.php
<html>
<head>
<title>Configurator</title>
<meta name="keywords" content="">
<meta name="description" content="">
<link rel="stylesheet" href="assets/plugins/select/css/select2.css">
<?php
include('inc/header.php');
?>
<link rel="stylesheet" href="assets/plugins/select/css/select2.css">
</head>
<body>
<?php
include('inc/menu.php');
?>
<div style="margin-top: 50px;" class="container">
<?php
if (empty($error)) {
echo $success;
} else {
echo $error;
}
?>
<h3><?php echo $pid->name; ?></h3>
<?php
$sql = "SELECT * FROM rams WHERE catid = $id";
$result = $conn->query($sql);
$sql2 = "SELECT * FROM cpu WHERE catid = $id";
$result2 = $conn->query($sql2);
$sql3 = "SELECT * FROM hdd WHERE catid = $id";
$result3 = $conn->query($sql3);
$sql4 = "SELECT * FROM video WHERE catid = $id";
$result4 = $conn->query($sql4);
?>
<form method="POST" action="">
<div class="col-md-12">
<input class="form-control hidden" type="text" name="motherboard" value="<?php echo $pid->name; ?>">
<p><b>Selectează memoria RAM</b></p>
<?php
if ($result->num_rows > 0) {
// output data of each row
while ($row = $result->fetch_assoc()) {
echo "<div class='col-md-6'>";
echo "<input name='ram' type='checkbox' value='" . $row["name"] . "'><span class='name-components'> " . $row["name"] . "</span>";
echo "</div>";
//echo "Name: " . $row["name"] . "";
}
} else {
echo "0 results";
}
?>
</div>
<div class="clear"></div>
<p><b>Selectează procesorul dorit</b></p>
<div class="cold-md-12">
<?php
if ($result->num_rows > 0) {
// output data of each row
while ($row = $result2->fetch_assoc()) {
echo "<div class='col-md-6'>";
echo "<input name='cpu' type='radio' value='" . $row["name"] . "'><span class='name-components'> " . $row["name"] . "</span>";
echo "</div>";
//echo "Name: " . $row["name"] . "";
}
} else {
echo "0 results";
}
?>
</div>
<div class="clear"></div>
<p><b>Selectează HDD</b></p>
<div class="cold-md-12">
<?php
if ($result->num_rows > 0) {
// output data of each row
while ($row = $result3->fetch_assoc()) {
echo "<div class='col-md-6'>";
echo "<input name='hdd' type='checkbox' value='" . $row["name"] . "'><span class='name-components'> " . $row["name"] . "</span>";
echo "</div>";
//echo "Name: " . $row["name"] . "";
}
} else {
echo "0 results";
}
$conn->close();
?>
</div>
<div class="clear"></div>
<p><b>Selectează placa video</b></p>
<div class="cold-md-12">
<?php
if ($result->num_rows > 0) {
// output data of each row
while ($row = $result4->fetch_assoc()) {
echo "<div class='col-md-6'>";
echo "<input name='video' type='checkbox' value='" . $row["name"] . "'><span class='name-components'> " . $row["name"] . "</span>";
echo "</div>";
//echo "Name: " . $row["name"] . "";
}
} else {
echo "0 results";
}
$conn->close();
?>
</div>
<div class="clear"></div>
<?php
if (!isset($_SESSION['user'])) {
echo "<p><br><b>Trebuie sa fii logat pentru a putea salva configuratia !</b></p>";
}else{
?>
<input style="margin-top: 20px;" class="btn btn-success" type="submit" name="submit" value="Finalizare"/>
<?php
}
?>
</form>
</div>
<script type="text/javascript" src="assets/js/jquery.js"></script>
<script type="text/javascript" src="assets/js/bootstrap.min.js"></script>
<script type="text/javascript" src="assets/js/custom.js"></script>
<script type="text/javascript" src="assets/plugins/select/js/select2.full.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(".js-example-basic-single").select2();
});
</script>
</body>
</html>
Register.php
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<link rel="stylesheet" href="style.css" type="text/css" />
</head>
<body>
<?php
include('inc/header.php');
?>
<?php
include('inc/menu.php');
?>
<div class="clear"></div>
<div class="register">
<div class="text"><h2>Creati-va cont</h2></div>
<form method="post" class="form">
<table align="center" width="30%" border="0">
<tr>
<td><input type="text" name="uname" placeholder="User Name" required /></td>
</tr>
<tr>
<td><input type="email" name="email" placeholder="Your Email" required /></td>
</tr>
<tr>
<td><input type="password" name="pass" placeholder="Your Password" required /></td>
</tr>
<tr>
<td><button type="submit" name="btn-signup" a href="index.php">Sign Me Up</button></td>
</tr>
<tr>
<!–<td><a href="index.php">Sign In Here</a></td>–>
</tr>
</table>
</form>
</div>
</body>
</html>
Profile.php
<html>
<head>
<title>Configurator</title>
<meta name="keywords" content="">
<meta name="description" content="">
<link rel="stylesheet" href="assets/plugins/select/css/select2.css">
<?php
include('inc/header.php');
?>
<link rel="stylesheet" href="assets/plugins/select/css/select2.css">
</head>
<body>
<?php
include('inc/menu.php');
$sql = "SELECT * FROM saved WHERE userid =" . $_SESSION['user'];
$result = $conn->query($sql);
?>
<section style="margin-top: 50px;" class="profile">
<div class="container">
<?php
if ($result->num_rows > 0) {
$i++
?>
<table class="table">
<thead>
<tr>
<th>#</th>
<th>RAM</th>
<th>CPU</th>
<th>Placa de baza</th>
<th>HDD/SSD</th>
<th>VIDEO</th>
</tr>
</thead>
<tbody>
<?php
while ($row = $result->fetch_assoc()) {
echo "<tr>";
echo "<th scope='row'>" . $i . "</th>";
echo "<td> " . $row["ram"] . "</td>";
echo "<td> " . $row["cpu"] . "</td>";
echo "<td> " . $row["motherboard"] . "</td>";
echo "<td> " . $row["hdd"] . "</td>";
echo "<td> " . $row["video"] . "</td>";
echo "</tr>";
}
?>
</tbody>
</table>
<?php
} else {
echo "0 results";
}
?>
</div>
</section>
<script type="text/javascript" src="assets/js/jquery.js"></script>
<script type="text/javascript" src="assets/js/bootstrap.min.js"></script>
<script type="text/javascript" src="assets/js/custom.js"></script>
<script type="text/javascript" src="assets/plugins/select/js/select2.full.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(".js-example-basic-single").select2();
});
</script>
</body>
</html>
Logout.php
<?php
session_start();
if(!isset($_SESSION['user']))
{
header("Location: index.php");
}
else if(isset($_SESSION['user'])!="")
{
header("Location: home.php");
}
if(isset($_GET['logout']))
{
session_destroy();
unset($_SESSION['user']);
header("Location: index.php");
}
?>
Login.php
<?php
session_start();
include_once 'inc/users/dbconnect.php';
if(isset($_SESSION['user'])!="")
{
header("Location: index.php");
}
if(isset($_POST['btn-login']))
{
$email = mysql_real_escape_string($_POST['email']);
$upass = mysql_real_escape_string($_POST['pass']);
$email = trim($email);
$upass = trim($upass);
$res=mysql_query("SELECT user_id, user_name, user_pass FROM users WHERE user_email='$email'");
$row=mysql_fetch_array($res);
$count = mysql_num_rows($res); // if uname/pass correct it returns must be 1 row
if($count == 1 && $row['user_pass']==md5($upass))
{
$_SESSION['user'] = $row['user_id'];
header("Location: index.php");
}
else
{
?>
<script>alert('Username / Password Seems Wrong !');</script>
<?php
}
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Configurator :: Login</title>
<link rel="stylesheet" href="style.css" type="text/css" />
</head>
<body>
<?php
include('inc/header.php');
?>
<?php
include('inc/menu.php');
?>
<div id="login-form">
<div class="register">
<div class="text"><h2>Autentificare</h2></div>
<form method="post" class="form">
<table align="center" width="30%" border="0">
<tr>
<td><input type="text" name="email" placeholder="Your Email" required /></td>
</tr>
<tr>
<td><input type="password" name="pass" placeholder="Your Password" required /></td>
</tr>
<tr>
<td><button type="submit" name="btn-login" a href="register.php">Sign In</button></td>
</tr>
<tr>
<!–<td><a href="register.php">Sign Up Here</a></td>–>
</tr>
</table>
</form>
</div>
</div>
</body>
</html>
Cpu.php
<?php
require_once ('includes/common.php');
$product = new Cpu();
$p = $product->getCPU();if (!isset($_SESSION['user'])) {
header('location:login.php');
}else{
?>
<html>
<head>
<title>Configurator :: Admin</title>
<meta name="keywords" content="">
<meta name="description" content="">
</head>
<body>
<?php
include('includes/header.php');
?>
<?php
include('includes/menu.php');
?>
<section class="list_motherboard">
<div class="container">
<h3>Procesoare</h3>
<a style="margin-bottom: 10px;" class="btn btn-success" href="add_cpu.php">Adauga Procesor</a>
<div class="panel panel-default">
<table class="table">
<thead>
<tr>
<th>No.</th>
<th>Denumire</th>
<th>Pret</th>
<th>Actiune</th>
</tr>
</thead>
<tbody>
<?php
foreach ($p as $mother) {
$i++
?>
<tr>
<th scope="row"><?php echo $i ?></th>
<td><?php echo $mother->name; ?></td>
<td><?php echo $mother->price, " Lei" ?></td>
<td><a class="btn btn-primary" href="edit_cpu.php?id=<?php echo $mother->id; ?>">Editeaza</a></td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
</div>
</section>
</body>
</html>
<?php } ?>
Hdd.php
<?php
require_once ('includes/common.php');
$product = new Hdd();
$p = $product->getHDD();
if (!isset($_SESSION['user'])) {
header('location:login.php');
}else{
?>
<html>
<head>
<title>Configurator :: Admin</title>
<meta name="keywords" content="">
<meta name="description" content="">
</head>
<body>
<?php
include('includes/header.php');
?>
<?php
include('includes/menu.php');
?>
<section class="list_motherboard">
<div class="container">
<h3>Unitate de stocare</h3>
<a style="margin-bottom: 10px;" class="btn btn-success" href="add_hdd.php">Adauga HDD & SSD</a>
<div class="panel panel-default">
<table class="table">
<thead>
<tr>
<th>No.</th>
<th>Denumire</th>
<th>Pret</th>
<th>Actiune</th>
</tr>
</thead>
<tbody>
<?php
foreach ($p as $mother) {
$i++
?>
<tr>
<th scope="row"><?php echo $i ?></th>
<td><?php echo $mother->name; ?></td>
<td><?php echo $mother->price, " Lei" ?></td>
<td><a class="btn btn-primary" href="edit_hdd.php?id=<?php echo $mother->id; ?>">Editeaza</a></td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
</div>
</section>
</body>
</html>
<?php } ?>
Motherboard.php
<?php
require_once ('includes/common.php');
$product = new Video();
$p = $product->getVideo();
if (!isset($_SESSION['user'])) {
header('location:login.php');
}else{
?>
<html>
<head>
<title>Configurator :: Admin</title>
<meta name="keywords" content="">
<meta name="description" content="">
</head>
<body>
<?php
include('includes/header.php');
?>
<?php
include('includes/menu.php');
?>
<section class="list_motherboard">
<div class="container">
<h3>Placi video</h3>
<a style="margin-bottom: 10px;" class="btn btn-success" href="add_video.php">Adauga Placa video</a>
<div class="panel panel-default">
<table class="table">
<thead>
<tr>
<th>No.</th>
<th>Denumire</th>
<th>Pret</th>
<th>Actiune</th>
</tr>
</thead>
<tbody>
<?php
foreach ($p as $mother) {
$i++
?>
<tr>
<th scope="row"><?php echo $i ?></th>
<td><?php echo $mother->name; ?></td>
<td><?php echo $mother->price, " Lei" ?></td>
<td><a class="btn btn-primary" href="edit_video.php?id=<?php echo $mother->id; ?>">Editeaza</a></td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
</div>
</section>
</body>
</html>
<?php } ?>
Ram.php
<?php
require_once ('includes/common.php');
$product = new Rami();
$p = $product->getProdus();
if (!isset($_SESSION['user'])) {
header('location:login.php');
}else{
?>
<html>
<head>
<title>Configurator :: Admin</title>
<meta name="keywords" content="">
<meta name="description" content="">
</head>
<body>
<?php
include('includes/header.php');
?>
<?php
include('includes/menu.php');
?>
<section class="list_motherboard">
<div class="container">
<h3>Memorii RAM</h3>
<a style="margin-bottom: 10px;" class="btn btn-success" href="add_ram.php">Adauga RAM</a>
<div class="panel panel-default">
<table class="table">
<thead>
<tr>
<th>No.</th>
<th>Denumire</th>
<th>Pret</th>
<th>Actiune</th>
</tr>
</thead>
<tbody>
<?php
foreach ($p as $mother) {
$i++
?>
<tr>
<th scope="row"><?php echo $i ?></th>
<td><?php echo $mother->name; ?></td>
<td><?php echo $mother->price, " Lei" ?></td>
<td><a class="btn btn-primary" href="edit_ram.php?id=<?php echo $mother->id; ?>">Editeaza</a></td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
</div>
</section>
</body>
</html>
<?php } ?>
Video.php
<?php
require_once ('includes/common.php');
$product = new Video();
$p = $product->getVideo();
if (!isset($_SESSION['user'])) {
header('location:login.php');
}else{
?>
<html>
<head>
<title>Configurator :: Admin</title>
<meta name="keywords" content="">
<meta name="description" content="">
</head>
<body>
<?php
include('includes/header.php');
?>
<?php
include('includes/menu.php');
?>
<section class="list_motherboard">
<div class="container">
<h3>Placi video</h3>
<a style="margin-bottom: 10px;" class="btn btn-success" href="add_video.php">Adauga Placa video</a>
<div class="panel panel-default">
<table class="table">
<thead>
<tr>
<th>No.</th>
<th>Denumire</th>
<th>Pret</th>
<th>Actiune</th>
</tr>
</thead>
<tbody>
<?php
foreach ($p as $mother) {
$i++
?>
<tr>
<th scope="row"><?php echo $i ?></th>
<td><?php echo $mother->name; ?></td>
<td><?php echo $mother->price, " Lei" ?></td>
<td><a class="btn btn-primary" href="edit_video.php?id=<?php echo $mother->id; ?>">Editeaza</a></td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
</div>
</section>
</body>
</html>
<?php } ?>
Edit_cpu.php
<?php
require_once ('includes/common.php');
$id = $_GET['id'];
$product = new Cpu();
$p = $product->getCPUID($id);
//print_r($p);
?>
<html>
<head>
<title>Configurator :: Admin</title>
<meta name="keywords" content="">
<meta name="description" content="">
</head>
<body>
<?php
include('includes/header.php');
?>
<?php
include('includes/menu.php');
?>
<title>Configurator :: Admin – Editeaza procesor</title>
<?php
$errors = '';
if (isset($_POST['submit'])) {
if (empty($errors) === true) {
$p->name = htmlentities(trim($_POST['name']));
$p->price = htmlentities(trim($_POST['price']));
$p->catid = htmlentities(trim($_POST['catid']));
if ($p->update()) {
$errors = "Produsul a fost modificat cu success.";
} else {
// Failure
$p->message("Ups! Error!");
}
}
}
?>
<div class="container">
<div id="page-wrapper">
<div class="jumbotron">
<h3>Editeaza Procesor</h3>
<form class="form-horizontal" action="" method="POST">
<p style="color:red; font-size:16px;"> <?php echo $errors; ?> </p> <br/>
<!– Name –>
<div class="form-group">
<label class="control-label col-md-2" for="name">Denumire</label>
<div class="col-md-4">
<input type="text" class="form-control" id="name" name="name" value="<?php echo $p->name; ?>"/>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2" for="price">Pret</label>
<div class="col-md-4">
<input type="text" class="form-control" id="price" name="price" maxlength="30" value="<?php echo $p->price; ?>"/>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2" for="price">Placa de baza</label>
<select name="catid">
<option name="catid" value="1">Asus H81M-K, Socket 1150</option>
<option name="catid" value="6">Placa de baza ASUS H110M-K, Socket 1151</option>
<option name="catid" value="8">Placa de baza MSI H110M PRO-VD, Socket 1151</option>
<option name="catid" value="9">Placa de baza ASUS M5A78L-M LX3, Socket AM3+</option>
<option name="catid" value="10">Placa de baza ASUS N3050M-E cu procesor Intel® Celeron® Dual-Core™ N3050 1.60Ghz, Socket 1170</option>
<option name="catid" value="11">Placa de baza Gigabyte GA-970-Gaming, Socket AM3+</option>
</select>
</div>
<div class="col-md-4" style="margin-left:20px;">
<input type="submit" id="submit" class="btn btn-primary btn-sm" name="submit" value="Submit">
</div>
</form>
</div>
</div>
</div>
</body>
</html>
Edit_hdd.php
<?php
require_once ('includes/common.php');
$id = $_GET['id'];
$product = new HDD();
$p = $product->getHDDID($id);
//print_r($p);
?>
<html>
<head>
<title>Configurator :: Admin</title>
<meta name="keywords" content="">
<meta name="description" content="">
</head>
<body>
<?php
include('includes/header.php');
?>
<?php
include('includes/menu.php');
?>
<title>Configurator :: Admin – Adauga Placa de baza</title>
<?php
$errors = '';
if (isset($_POST['submit'])) {
if (empty($errors) === true) {
$p->name = htmlentities(trim($_POST['name']));
$p->price = htmlentities(trim($_POST['price']));
$p->catid = htmlentities(trim($_POST['catid']));
if ($p->update()) {
$errors = "Produsul a fost modificat cu success.";
} else {
// Failure
$p->message("Ups! Error!");
}
}
}
?>
<div class="container">
<div id="page-wrapper">
<div class="jumbotron">
<h3>Editeaza HDD/SSD</h3>
<form class="form-horizontal" action="" method="POST">
<p style="color:red; font-size:16px;"> <?php echo $errors; ?> </p> <br/>
<!– Name –>
<div class="form-group">
<label class="control-label col-md-2" for="name">Denumire</label>
<div class="col-md-4">
<input type="text" class="form-control" id="name" name="name" value="<?php echo $p->name; ?>"/>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2" for="price">Pret</label>
<div class="col-md-4">
<input type="text" class="form-control" id="price" name="price" maxlength="30" value="<?php echo $p->price; ?>"/>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2" for="price">Placa de baza</label>
<select name="catid">
<option name="catid" value="1">Asus H81M-K, Socket 1150</option>
<option name="catid" value="6">Placa de baza ASUS H110M-K, Socket 1151</option>
<option name="catid" value="8">Placa de baza MSI H110M PRO-VD, Socket 1151</option>
<option name="catid" value="9">Placa de baza ASUS M5A78L-M LX3, Socket AM3+</option>
<option name="catid" value="10">Placa de baza ASUS N3050M-E cu procesor Intel® Celeron® Dual-Core™ N3050 1.60Ghz, Socket 1170</option>
<option name="catid" value="11">Placa de baza Gigabyte GA-970-Gaming, Socket AM3+</option>
</select>
</div>
<div class="col-md-4" style="margin-left:20px;">
<input type="submit" id="submit" class="btn btn-primary btn-sm" name="submit" value="Submit">
</div>
</form>
</div>
</div>
</div>
</body>
</html>
Edit_motherboard.php
<?php
require_once ('includes/common.php');
$id = $_GET['id'];
$product = new Produse();
$p = $product->getPID($id);
?>
<html>
<head>
<title>Configurator :: Admin</title>
<meta name="keywords" content="">
<meta name="description" content="">
</head>
<body>
<?php
include('includes/header.php');
?>
<?php
include('includes/menu.php');
?>
<title>Configurator :: Admin – Adauga Placa de baza</title>
<?php
// $errors = '';
if (isset($_POST['submit'])) {
if (empty($errors) === true) {
$p->name = htmlentities(trim($_POST['name']));
$p->price = htmlentities(trim($_POST['price']));
if ($p->update()) {
$errors = "Produsul a fost modificat cu succes.";
} else {
// Failure
$p->message("Ups! Error!");
}
}
}
?>
<div class="container">
<div id="page-wrapper">
<div class="jumbotron">
<h3>Editeaza Placa de baza</h3>
<form class="form-horizontal" action="" method="POST">
<p style="color:red; font-size:16px;"> <?php echo $errors; ?> </p> <br/>
<!– Name –>
<div class="form-group">
<label class="control-label col-md-2" for="name">Denumire</label>
<div class="col-md-4">
<input type="text" class="form-control" id="name" name="name" value="<?php echo $p->name; ?>"/>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2" for="price">Pret</label>
<div class="col-md-4">
<input type="text" class="form-control" id="price" name="price" value="<?php echo $p->price?>" />
</div>
</div>
<!– <div class="form-group">
<label class="col-md-2 control-label" for="image">Product Image</label>
<div class="col-sm-4">
<input type="file" name="image" />
</div>
</div> –>
<div class="col-md-4" style="margin-left:20px;">
<input type="submit" id="submit" class="btn btn-primary btn-sm" name="submit" value="Submit">
</div>
</form>
</div>
</div>
</div>
</body>
</html>
Edit_ram.php
<?php
require_once ('includes/common.php');
$id = $_GET['id'];
$product = new Rami();
$p = $product->getRam_cat($id);
//print_r($p);
?>
<html>
<head>
<title>Configurator :: Admin</title>
<meta name="keywords" content="">
<meta name="description" content="">
</head>
<body>
<?php
include('includes/header.php');
?>
<?php
include('includes/menu.php');
?>
<title>Configurator :: Admin – Adauga Placa de baza</title>
<?php
$errors = '';
if (isset($_POST['submit'])) {
if (empty($errors) === true) {
$p->name = htmlentities(trim($_POST['name']));
$p->price = htmlentities(trim($_POST['price']));
$p->catid = htmlentities(trim($_POST['catid']));
if ($p->update()) {
$errors = "Produsul a fost modificat cu success.";
} else {
// Failure
$p->message("Ups! Error!");
}
}
}
?>
<div class="container">
<div id="page-wrapper">
<div class="jumbotron">
<h3>Editeaza memorie RAM</h3>
<form class="form-horizontal" action="" method="POST">
<p style="color:red; font-size:16px;"> <?php echo $errors; ?> </p> <br/>
<!– Name –>
<div class="form-group">
<label class="control-label col-md-2" for="name">Denumire</label>
<div class="col-md-4">
<input type="text" class="form-control" id="name" name="name" value="<?php echo $p->name; ?>"/>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2" for="price">Pret</label>
<div class="col-md-4">
<input type="text" class="form-control" id="price" name="price" maxlength="30" value="<?php echo $p->price; ?>"/>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2" for="price">Placa de baza</label>
<select name="catid">
<option name="catid" value="1">Asus H81M-K, Socket 1150</option>
<option name="catid" value="6">Placa de baza ASUS H110M-K, Socket 1151</option>
<option name="catid" value="8">Placa de baza MSI H110M PRO-VD, Socket 1151</option>
<option name="catid" value="9">Placa de baza ASUS M5A78L-M LX3, Socket AM3+</option>
<option name="catid" value="10">Placa de baza ASUS N3050M-E cu procesor Intel® Celeron® Dual-Core™ N3050 1.60Ghz, Socket 1170</option>
<option name="catid" value="11">Placa de baza Gigabyte GA-970-Gaming, Socket AM3+</option>
</select>
</div>
<div class="col-md-4" style="margin-left:20px;">
<input type="submit" id="submit" class="btn btn-primary btn-sm" name="submit" value="Submit">
</div>
</form>
</div>
</div>
</div>
</body>
</html>
Edit_video.php
<?php
require_once ('includes/common.php');
$id = $_GET['id'];
$product = new Video();
$p = $product->getVID($id);
//print_r($p);
?>
<html>
<head>
<title>Configurator :: Admin</title>
<meta name="keywords" content="">
<meta name="description" content="">
</head>
<body>
<?php
include('includes/header.php');
?>
<?php
include('includes/menu.php');
?>
<title>Configurator :: Admin – Adauga Placa de baza</title>
<?php
$errors = '';
if (isset($_POST['submit'])) {
if (empty($errors) === true) {
$p->name = htmlentities(trim($_POST['name']));
$p->price = htmlentities(trim($_POST['price']));
$p->catid = htmlentities(trim($_POST['catid']));
if ($p->update()) {
$errors = "Produsul a fost modificat cu success.";
} else {
// Failure
$p->message("Ups! Error!");
}
}
}
?>
<div class="container">
<div id="page-wrapper">
<div class="jumbotron">
<h3>Editeaza memorie RAM</h3>
<form class="form-horizontal" action="" method="POST">
<p style="color:red; font-size:16px;"> <?php echo $errors; ?> </p> <br/>
<!– Name –>
<div class="form-group">
<label class="control-label col-md-2" for="name">Denumire</label>
<div class="col-md-4">
<input type="text" class="form-control" id="name" name="name" value="<?php echo $p->name; ?>"/>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2" for="price">Pret</label>
<div class="col-md-4">
<input type="text" class="form-control" id="price" name="price" maxlength="30" value="<?php echo $p->price; ?>"/>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2" for="price">Placa de baza</label>
<select name="catid">
<option name="catid" value="1">Asus H81M-K, Socket 1150</option>
<option name="catid" value="6">Placa de baza ASUS H110M-K, Socket 1151</option>
<option name="catid" value="8">Placa de baza MSI H110M PRO-VD, Socket 1151</option>
<option name="catid" value="9">Placa de baza ASUS M5A78L-M LX3, Socket AM3+</option>
<option name="catid" value="10">Placa de baza ASUS N3050M-E cu procesor Intel® Celeron® Dual-Core™ N3050 1.60Ghz, Socket 1170</option>
<option name="catid" value="11">Placa de baza Gigabyte GA-970-Gaming, Socket AM3+</option>
</select>
</div>
<div class="col-md-4" style="margin-left:20px;">
<input type="submit" id="submit" class="btn btn-primary btn-sm" name="submit" value="Submit">
</div>
</form>
</div>
</div>
</div>
</body>
</html>
Style.css
body{
font-family: 'Roboto', sans-serif;
}
.clear{
clear: both;
}
.wide-home{
background-image: url('../images/wide.jpg');
height: 100vh;
width: 100%;
background-size: cover;
background-position: center center;
/*margin-top: -20px;*/
text-align: center;
}
.menu{
/*position: absolute;*/
width: 100%;
top:0;
border-radius: 0!important;
margin-bottom: 0px;
}
.fa-chevron-down{
position: absolute;
bottom: 45px;
border: 1px solid #FFF;
color: #FFF;
border-radius: 50%;
margin: 0 auto;
font-size: 28px;
padding: 10px;
cursor: pointer;
transition: all 0.5s linear;
}
.fa-chevron-down:hover{
opacity: 0.5;
transition: all 0.5s linear;
}
section.welcome{
padding-top: 20px;
padding-bottom: 20px;
margin-top: 40px;
}
h5.title{
font-weight: bold;
margin-top: 20px;
}
.next-step{
margin-top: 20px;
text-transform: uppercase;
}
#step-2, #step-3, #step-4{
display: none;
}
/****************Details******************/
span.name-components{
text-transform: uppercase;
}
/*******user********/
.user_details{
padding-top: 15px;
}
.register{
margin-top: 5%;
}
.text{
width: 25%;
float: left;
margin-left: 25%;
}
.form{
padding-top: 20px;
width: 72%;
float: left;
}
input{
-moz-border-bottom-colors: none;
-moz-border-left-colors: none;
-moz-border-right-colors: none;
-moz-border-top-colors: none;
background: transparent none repeat scroll 0 0;
border-color: -moz-use-text-color -moz-use-text-color #cfd2d5;
border-image: none;
border-radius: 0;
border-style: none none solid;
border-width: 0 0 1px;
box-shadow: none;
color: #101010;
font-size: 1em;
font-style: normal;
font-weight: 300;
padding: 0.5em;
}
button{
background-color: #198fff;
border-color: #198fff;
color: #fff;
border-radius: 2px;
box-sizing: border-box;
font-size: 16px;
padding:0.45em;
width: 63%;
margin-top: 2%;
}
/* jssor slider bullet navigator skin 05 css */
/*
.jssorb05 div (normal)
.jssorb05 div:hover (normal mouseover)
.jssorb05 .av (active)
.jssorb05 .av:hover (active mouseover)
.jssorb05 .dn (mousedown)
*/
.jssorb05 {
position: absolute;
}
.jssorb05 div, .jssorb05 div:hover, .jssorb05 .av {
position: absolute;
/* size of bullet elment */
width: 16px;
height: 16px;
background: url('images/slider/b05.png') no-repeat;
overflow: hidden;
cursor: pointer;
}
.jssorb05 div { background-position: -7px -7px; }
.jssorb05 div:hover, .jssorb05 .av:hover { background-position: -37px -7px; }
.jssorb05 .av { background-position: -67px -7px; }
.jssorb05 .dn, .jssorb05 .dn:hover { background-position: -97px -7px; }
/* jssor slider arrow navigator skin 22 css */
/*
.jssora22l (normal)
.jssora22r (normal)
.jssora22l:hover (normal mouseover)
.jssora22r:hover (normal mouseover)
.jssora22l.jssora22ldn (mousedown)
.jssora22r.jssora22rdn (mousedown)
*/
.jssora22l, .jssora22r {
display: block;
position: absolute;
/* size of arrow element */
width: 40px;
height: 58px;
cursor: pointer;
background: url('images/slider/a22.png') center center no-repeat;
overflow: hidden;
}
.jssora22l { background-position: -10px -31px; }
.jssora22r { background-position: -70px -31px; }
.jssora22l:hover { background-position: -130px -31px; }
.jssora22r:hover { background-position: -190px -31px; }
.jssora22l.jssora22ldn { background-position: -250px -31px; }
.jssora22r.jssora22rdn { background-position: -310px -31px; }
.video-slider{
width: 100%;
max-width: 540px;
position: relative;
float: right;
margin-top: 76px;
margin-right: 76px;
}
textarea{
max-width: 800px;
width: 100%;
max-height: 400px;
height: 100%;
}
section.list_motherboard{
margin-top: 40px;
}
CD / DVD
Index
B
Bibliografie 43
C
CUPRINSUL x
L
LISTA FIGURILOR xi
LISTA TABELELOR xii
R
Referințe web 44
Copyright Notice
© Licențiada.org respectă drepturile de proprietate intelectuală și așteaptă ca toți utilizatorii să facă același lucru. Dacă consideri că un conținut de pe site încalcă drepturile tale de autor, te rugăm să trimiți o notificare DMCA.
Acest articol: Platformă multimedia pentru configurarea unui sistem de calcul Dulvac Andrei-Cosmin COORDONATOR ȘTIINȚIFIC Conf . dr. ing. Daniela Danciu Iulie 2016… [310407] (ID: 310407)
Dacă considerați că acest conținut vă încalcă drepturile de autor, vă rugăm să depuneți o cerere pe pagina noastră Copyright Takedown.
