STŘEDNÍ ŠKOLA INFORMAČNÍCH TECHNOLOGIÍ A SOCIÁLNÍ PÉČE

STŘEDNÍ ŠKOLA INFORMAČNÍCH TECHNOLOGIÍ A SOCIÁLNÍ PÉČE AUTOVRAKOVIŠTĚ MICHAL TOMÁŠEK ZÁVĚREČNÁ MATURITNÍ PRÁCE BRNO 2011

Prohlášení Prohlašuji, že tato závěrečná maturitní práce je mým původním autorským dílem, které jsem vypracoval samostatně. Všechny zdroje, prameny a literaturu, které jsem při vypracování používal nebo z nich čerpal, v práci řádně cituji s uvedením úplného odkazu na příslušný zdroj. Vedoucí práce: Ing. Aleš Lorenc ii

Shrnutí Cílem této maturitní práce je navrhnout a realizovat webovou aplikaci pro správu autovrakoviště. Aplikace bude poskytovat informace o autovrakovišti a umožňovat vyhledávání v databázi náhradních dílů, evidovaných na autovrakovišti, podle různých kritérií. Dále umožní přihlášeným uživatelům příslušné díly si rezervovat, a své rezervace spravovat. Zaměstnanci pak mohou přidávat, odebírat i měnit náhradní díly na autovrakovišti. iii

Obsah Prohlášení...ii Shrnutí...iii Obsah...1 Anotace...2 1 Koncepce...3 1.1 Existující řešení...3 2 Analýza problému a návrh jeho řešení...4 2.1 Návrh řešení...4 2.1.1 Struktura databáze...4 2.1.2 Rozdělení práv uživatelům...4 3 Návrh a popis vlastního řešení...5 3.1 Návrh databáze...5 3.2 Návrh a tvorba webové části aplikace...6 3.2.1 Design a rozvržení aplikace...6 3.2.2 Rozlišení uživatelů aplikace...7 3.2.3 Možnosti uživatelů...7 3.2.4 Rozdělení zdrojového kódu...8 3.2.5 Popis jednotlivých funkcí aplikace...9 3.3 Popis vybraných částí programového kódu...10 3.3.1 Vytváření vyhledávacího příkazu select...10 3.3.2 Výkreslení fotogalerie...13 Závěr...14 Seznam zdrojů a použité literatury...15 Seznam ilustrací...16 Seznam tabulek...17 1

Anotace Aplikace bude zabezpečovat evidenci autovrakoviště. Bude obsahovat informace o: evidenci náhradních dílů, zákaznících, provozovateli. Zákazník může vyhledávat náhradní díly podle různých kritérií a zamluvit si je. Administrátor může editovat náhradní díly. Aplikace bude dostupná na webu a bude pro ukládání dat používat databázi. 2

1 Koncepce Aplikace má umožnit uživatelům přístup k informacím, které obvykle na webových stránkách autovrakoviště nenaleznou. Většina autovrakovišť má totiž na svých stránkách pouze informace o firmě, kontakty a nanejvýš fotogalerii. Tyto informace však nejsou pro zákazníka prioritní. Zajímá ho, jestli se díl, který hledá, na vrakovišti nachází a pokud ano, tak v jakém je stavu a na kolik by ho přišla koupě. 1.1 Existující řešení Většina vrakovišť tento problém řeší tzv. Poptávkovým formulářem, do kterého uživatel vyplní potřebná data a zaměstnanec vrakoviště pak odpoví na zadaný e-mail zákazníka, zda se díl na vrakovišti nachází, či nikoliv. Toto řešení je však velmi nepohodlné. Ze strany zákazníka z důvodu vypisování množství dat a kvůli dlouhé prodlevě mezi odesláním dat a přijetí odpovědi. Samozřejmě také ze strany zaměstnanců vrakoviště, jelikož musí zjistit zda-li se díl na vrakovišti fyzicky nachází, poznamenat si zájemce a odpovědět na zákazníkův e-mail o dotazovaném dílu a jeho ceně. Další značnou nevýhodou je jistě rovněž to, že pokud zákazník hledá více dílu, musí formulář vypisovat několikrát, a to ho může odradit od dalšího dotazování formulářem. Další možností je pro zákazníka možnost zavolání, nebo osobní návštěva vrakoviště. Ovšem pokud hledá zákazník nějaký atypický díl, může se mu tato varianta snadno prodražit. Tomuto zdlouhavému a nepohodlnému řešení (poptávkový formulář) se aplikace vyhýbá tím, že poskytuje informace jaké náhradní díly se na vrakovišti fyziky nachází, v jakém jsou stavu a kolik stojí. Ilustrace 1: Poptávkový formulář 3

2 Analýza problému a návrh jeho řešení Vytvoření databázového systému pro evidenci náhradních dílů na autovrakovišti má následující problém - díly nejsou ve stejném stavu, jak je tomu u dílů nových a nepoužitých, které se prodávají např. v internetových obchodech. Z tohoto důvodu, je nutné rozlišit typ dílu a konkrétní díl. 2.1 Návrh řešení Typ dílu, dalo by se také říci díl šablonový, je díl, který má vlastnosti jako nový, nepoužitý díl. Konkrétní díl je pak odvozením šablonového dílu, s přidáním vlastností, které šablona neobsahovala. Vlastnostmi, které se přidávájí k šabloně, se konkrétní díl odlišuje od ostatních, a to sice stavem, poznámkou ke stavu a cenou dílu. Jako příklad si představme jako šablonový díl např. přední nárazník, který má vlastnosti jako je materiál, rozměry, ale i identifikační číslo dílu od výrobce(všechny nárazníky určitého typu mají toto číslo společné). A od této šablony můžeme odvodit konkrétní nárazník, který má vlastnosti šablonového dílu a k nim přidané vlastnosti: stav: použitý poznámka: Barva: modrá, mírné oděrky cena: 2500Kč Ke zdůvodnění nutnosti rozlišení použitých dílů může opět posloužit náš přední nárazník. Vlastníme-li totiž auto modré barvy, tak si můžeme rezervovat nárazník v modré barvě a zákazník s jinou barvou raději rezervuje tu svoji. Pokud však nárazník jeho barvy vrakoviště nemá, tak předpokládejme, že raději sáhne po levnějším dílu s poznámkou: nutné přelakovat, než po nárazníku mnohem dražším v barvě, kterou nemůže využít. (Pozn.: Lakování dílů stojí okolo 1000 až 2000Kč) Dalším příkladem by mohl být zákazník, který si koupí raději levnější rozbitý díl, nebo díl, kterému nějaká část chybí, když ví jak si díl může spravit a tím ušetřit peníze. 2.1.1 Struktura databáze Databáze by tedy měla obsahovat tabulky Díl a Konkrétní díl, pro rozlišení dílů konkrétních a šablonových. Díly by se dále měli řadit do příslušných kategorií a podkategorií, pro přehlednost při vyhledávání. Pokud budeme vyžadovat rozlišování dílů podle zvoleného automobilu zákazníka, budeme potřebovat tabulky Značka, Model, Motor a Typ karoserie pro jednoznačné určení vozidla. 2.1.2 Rozdělení práv uživatelům Uživatelé této aplikace by měli být rozděleni do skupin: Nepřihlášený uživatel, Přihlášený zákazník, Přihlášený zaměstnanec, Přihlášený administrátor. Každá skupina by měla mít svá práva na prohlížení a úpravu databáze prostřednictvím této webové aplikace. 4

3 Návrh a popis vlastního řešení 3.1 Návrh databáze Ilustrace 2: UML diagram tabulek databáze 5

Databázi SQL jsem vybral, protože poskytuje díky relacím rychlý zápis, což se u tohoto systému hodí, jelikož se velmi často mění obsah databáze. Při vytváření struktury databáze jsem dbal na to, aby zákazník mohl jednoznačně určit vozidlo, pro které hledá náhradní díly. Proto musí databáze obsahovat tabulky Znacka, Model, Motor a Typ_karoserie, protože jedině při zvolení všech těchto kritérií může být vozidlo jednoznačně určeno. Tabulka Vrakoviste obsahuje informace o vrakovišti, a z důvodu, že systém je určen pro správu jednoho vrakoviště, nemá žadné relace s ostatními tabulkami. Pokud by byl systém určen pro více autovrakovišť, či poboček sítě autovrakovišť, musela by být spojena alespoň s tabulkou člověk, kde by určovala u zaměstnanců na jaké pobočce, či autovrakovišti pracují. Tabulka Clovek obsahuje informace o uživatelích systému, včetně jejich práv, kontaktních informací a hashe přístupového hesla. Obsahuje také hodnotu, která odpovídá počtu aktuálně platných rezervací. Tato hodnota je důležitá kvůli omezení počtu rezervací, které může uživatel mít zároveň. Tabulka Dil obsahuje šablonové díly, pro které se v tabulce Konkretni_dil vytváří díly, které jsou fyzicky přítomné na vrakovišti. Obsahuje informace, které mají konkrétní díly společné a také informaci do jaké podkategorie patří. Typ_dilu a Podtyp_dilu obsahují kategorie a podkategorie do kterých se náhradní díly člení. Nakonec zbývají jen spojovací tabulky ModelMaDil, ModelMaMotor, ModelMaTyp_karoserie, MotorOmezDil a Typ_karoserieOmezDil. Tak velký počet spojovacích tabulek je z toho důvodu, že jeden identický díl je použit ve více modelech a to nejen té samé značky výrobce, jak je tomu např. u koncernu VW(Audi, Seat, Škoda, VW), kde díly i motory používá jak více modelů, tak více značek. 3.2 Návrh a tvorba webové části aplikace 3.2.1 Design a rozvržení aplikace Design stránky jsem vytvořil pomocí externích css souborů. Barvy pozadí jsem volil tmavé a barvy textů naopak světlé. Ilustrace 3: Ukázka designu stránky 6

Na pozadí celé stránky jsem použil jednoduchý tmavý křížový vzor, pozadí obsahu je pak tmavě šedé, s bílým, či žlutým textem. Horizontální menu stránky je rovněž vytvořeno za pomocí externího css souboru. Skládá se z opakujícího se obrázku jako pozadí nečíslovaného seznamu. Pod tímto pozadím je umístěno tmavě nebo světle červené pozadí, které se mění podle přejetí kurzoru, či zvolením určité položky. Barva textu se také mění mezi šedou a bílou, aby zvíraznila uživatelem zvolenou možnost. Seznam vyhledaných dílů je realizován pouze změnou barvy textu a pozadí po přejetí kurzoru pole, které odkazuje na stránku s náhradním dílem. U webové aplikace, jako je tato, je design stránky velmi důležitý, protože i nevhodně zvolená kombinace barev může zákazníka odradit. 3.2.2 Rozlišení uživatelů aplikace Každý uživatel aplikace má určitá práva a privilegia. Aplikace rozlišuje čtyři hlavní skupiny uživatelů, kterým jejich práva přiřazuje. Jejich práva jsou uložena v databázi v položce rights číselnou hodnotou. Tyto skupiny jsou : nepřihlášený uživatel přihlášený zákazník přihlášený zaměstnanec přihlášený administrátor Skupiny jsou seřazeny podle svých práv a počtu možností od nejnižšího po nejvyšší.každá skupina dědí funkce předchozí skupiny (skupiny s nižším právem přístupu) a přidává k ní své vlastní rozšiřující práva. 3.2.3 Možnosti uživatelů Nepřihlášený uživatel je zpočátku každý uživatel, který spustí webovou aplikaci. Může se registrovat a přihlásit k přístupu k více možností. Dále si může zobrazit informace o firmě, kontakty a fotogalerii. Také má zpřístupněno vyhledávání náhradních dílů a zobrazení detailu dílu. Přihlášený zákazník zdědí všechny možnosti nepřihlášeného uživatele a přidává k nim možnost úpravy osobních informací, které zadal při registraci. Nejdůležitější rozšiřující možností je však rezervování konkrétního náhradního dílu, a správa svých aktuálních rezervací. Přihlášený zaměstnanec může navíc od přihlášeného zákazníka přidávát nové typy dílů a modifikovat je, přidávat nové konkrétní díly a mazat je, a spravovat cizí rezervace. První dvě pravomoce jsou spíše administrátorskou vysadou, ale z důvodu rychle se měnícímu automobilovému průmyslu, by k nim měli mít přístup i zaměstnanci vrakoviště. Přihlášený administrátor má všechny již popsané pravomoce, a ještě navíc přidávání motorů k modelům automobilů. Tato funkce je pouze na pohodlnější plnění databáze, z důvodů velkého množství spojovacích tabulek. 7

Ilustrace 4: UML diagram případů užití 3.2.4 Rozdělení zdrojového kódu Kód je rozdělen do jednotlivých php stránek, které se vkládají do společného souboru index.php. Ten obsahuje společné části pro všechny stránky. Soubory jsou pak rozděleny do jednotlivých složek: css, files, images, js, pages. Název složky Obsah složky Počet souborů ve složce Velikost [%] css Obsahuje externí soubory css pro nastavení vzhledu stránek 4 0,08 files Obsahuje config.php přihlašovací údaje k databázi 1 0,01 images Obsahuje obrázky používané na stránkách 35 95,7 js Obsahuje JavaScript soubory 6 2,98 pages Obsahuje php stránky, které se vkládají do index.php 14 1,23 Tabulka 1: Přehled složek na serveru 8

Název souboru Stručný popis funkce souboru dil.php Slouží k výpisu informací o dílu a konkretním dílu, vytváří rezervace dílů fotogalerie.php Slouží k zobrazení fotogalerie pomocí technologie Lighbox 2 kontakt.php Slouží k výpisu kontaktních informací modifikace.php Slouží k modifikaci typů dílů (šablonových dílů) odebirani_kdilu.php Slouží k odebírání konkrétních dílů pridavani_dilu.php Slouží k přidávání nových typů dílů pridavani_kdilu.php Slouží k přidávání konkrétních dílů pridej_motor.php Slouží k přidávání motorů a spojení motoru s modelem prihlaseni.php Slouží k přihlášení registrovaného uživatele registrace.php Slouží k registraci nových zákazníků rezervace.php Slouží ke správě rezervací seznam.php Slouží ke zpracování informací pro vyhledávání a výpisu jeho výsledků uvod.php Slouží k zobrazení informací o firmě vyhledavani.php Slouží k zadání informací potřebných k vyhledávání Tabulka 2: Přehled souborů ve složce pages 3.2.5 Popis jednotlivých funkcí aplikace Registrace nového zákazníka obsahuje kontrolu: 1. délky a unikátnosti přihlašovacího jména(minimálně 3 znaky), 2. délky hesla(minimálně 4 znaky), 3. korektnosti e-mailové adresy a telefoního čísla. E-mailová adresa, pak musí být také unikátní. Před zápisem do databáze se k heslu přidává tzv. salt, z důvodu unikátnosti hesla pro naši webovou aplikaci i přes skutečnost, že by uživatel používal stejná hesla na více webových aplikací. Po tomto kroku se heslo zahashuje pomocí funkce MD5(). Vyhledávání náhradních dílů se provádí buď zadáním určité informace do hledacího pole, nebo tzv. Postupným vyhledáváním, ve kterém jak již název napovídá, budeme postupně volit různé možnosti, kterými se omezí počet výsledných dílů. V tomto vyhledávání volíme značku, model, motor a typ karoserie automobilu, pro který náhradní díly hledáme. Také máme na výběr kategorii a podkategorii, do které náhradní díl spadá. Možnost výběru kategorie a podkategorie máme i poté co nám aplikace zobrazí výsledky pro zadaný automobil. Při zadání informace nám aplikace vyhledá díly, které hledaný řetězec obsahují v názvu, poznámce, nebo v kódovém označení dílu výrobce. I při tomto typu hledání máme možnost počet vypsaných dílů omezit kategorií a podkategorií. Rezervace náhradních dílů se vytváří u konkrétního dílu stisknutím na příslušné tlačítko. V databázi se pak u dílu vytvoří časové razítko a vyplní se identifikační číslo uživatele, který si daný díl rezervoval. Nakonec se u rezervujícího uživatele přičte k počtu rezervovaných dílů jedna. Každý zákazník má totiž z bezpečnostních důvodů povolených pouze pět rezervací, probíhajících současně. Jakmile si zákazník rezervované díly vyzvedne nebo smaže některé ze svých rezervací, 9

může opět rezervovat další náhradní díly. Každá rezervace má omezenou dobu platnosti a to sice 14 dní, po kterých lze díl opět rezervovat jinými zákazníky. Pokud se tak nestane rezervace je stále platná, ale jakýkoliv přihlášený uživatel ji může přepsat na rezervaci svou. Pokud ji jiný zákazník přepíše, tak se počet rezervovaných dílů původního zákazníka sníží o jednu a o svou původní rezervaci přichází. Spravování vlastních rezervací mohou provádět zákazníci. Tuto možnost mají, jak z důvodu přehlednosti právě rezervovaných dílů, tak z důvodu omezeného počtu rezervací na uživatele. Při spravování svých rezervací je mohou zákazníci procházet a mazat. Na stejné stránce pak mají i možnost změny svých osobních informací, které vyplnili při registraci. Spravování cizích rezervací mohou provádět pouze zaměstnanci a to přes zadání jména a příjmení. Po tomto vstupu se zaměstnanci zobrazí tabulka s rezervacemi daného zákazníka, kde může jak mazat samotnou rezervaci, tak i rezervaci včetně rezervovaného náhradního dílu. Při situaci, že by databáze obsahovala více zákazníků se stejnou kombinací jména a příjmení, zobrazí se všichni zákazníci se stejnou zadanou kombinací. Pro jejich rozlišení se však vypisují včetně telefonního čísla a e-mailu, které jsou unikátní pro každého uživatele. Při mazání rezervace se sníží počet rezervací u uživatele o jedna a buď se rezervovaný díl z databáze smaže, nebo se smaže pouze časové razítko a číslo uživatele, který díl rezervoval. Tento krok záleží na postupu mazání. Pokud se maže pouze rezervace, díl zůstavá v databázi. Jinak tomu je, když mažeme rezervaci včetně konkrétního dílu. Také může nastat situace, že razítko i číslo uživatele se pouze přepíše novým razítkem a číslem uživatele.to nastává v případě, že rezervace bude více jak 14 dní stará a jiný uživatel díl rezervuje. Počet rezervací (zákazníka) se vždy u všech těchto operací sníží. Při přidávání typu dílu musí být vyplněna kategorie a podkategorie. Model a popř. motor i typ karoserie jsou však nepovinné. Vyplňujeme je jen pokud je těmito specifikacemi náhradní díl omezen. Modely jsou pak seřazeny podle značek a motory podle aut, do kterých se používají. V neposlední řadě je povinné vyplnění názvu náhradního dílu a identifikační číslo výrobce. Přidávání konkrétních dílů je pak možné dvojím způsobem a to buď po jednom, nebo hromadně. Pokud zvolíme hromadné přidávání, zobrazí se nám všechny šablonové díly, které patři pod zvolený automobil (v případě volby včetně motoru a karoserie, díly se omezí i podle nich). Ty pak můžeme vybírat a doplňovat k nim informace, které má konkrétní díl navíc. Při přidávání náhradních dílů po jednom se nám zobrazí hledací formulář, do kterého zadáme určitou informaci podle které se má šablona náhradního dílů vyhledat. Po odeslání formuláře vybereme požadovanou šablonu a vyplníme konkrétní informace. Při odebirani konkretního dílu, se kontroluje zda není na daný díl vytvořená platná rezervace. Pokud je, tak díl nejde smazat a vypíše se kdo má daný díl rezervovaný. Pokud neexistuje platná rezervace, díl se v databázi smaže. 3.3 Popis vybraných částí programového kódu 3.3.1 Vytváření vyhledávacího příkazu select //Zacatek prvni casti $prikaz="select Dil.ID_Dil id, Dil.nazev nazev, MIN(Konkretni_dil.cena) cena, Dil.alternativni_ID alt, Dil.poznamka poznamka FROM Dil,Konkretni_dil WHERE Dil.ID_Dil=Konkretni_dil.Dil"; if(isset($_session['inf']) AND trim($_session['inf'])!="") $inf=$_session['inf']; $prikaz.=" AND (Dil.nazev LIKE '%".$inf."%' OR Dil.alternativni_ID LIKE '%".$inf."%' OR Dil.poznamka LIKE '%".$inf."%')"; 10

$_SESSION['inf']=""; $uni=false; else $_POST['vyhledej_postup']=true; $uni=true; //Zacatek druhe casti if(isset($_post['vyhledej_postup'])) $_SESSION['vyhledej_postup']=true; $motor=false; $karoserie=false; $tabulky="konkretni_dil"; $where="dil.id_dil=konkretni_dil.dil"; posttosession("znacka"); posttosession("model"); posttosession("motor"); posttosession("karoserie"); posttosession("kategorie"); posttosession("podkategorie"); if(isset($_session['znacka']) AND $_SESSION['znacka']!=0) $tabulky.=",modelmadil,model"; $where.=" AND Dil.ID_Dil=ModelMaDil.ID_Dil AND Model.ID_Model=ModelMaDil.ID_Model AND Model.Znacka=".$_SESSION['znacka'].""; if(isset($_session['model']) AND $_SESSION['model']!=0) $where.=" AND Model.ID_Model=".$_SESSION['model'].""; if(isset($_session['motor']) AND $_SESSION['motor']!=0) $tabulky.=",motoromezdil RIGHT JOIN Dil ON Dil.ID_Dil=MotorOmezDil.ID_Dil"; $where.=" AND ((MotorOmezDil.ID_Dil=Dil.ID_Dil AND MotorOmezDil.ID_Motor=". $_SESSION['motor'].") OR Dil.nelibovolny_Motor=0)"; $motor=true; if(isset($_session['karoserie']) AND $_SESSION['karoserie']!=0) if($motor) $tabulky.=" LEFT JOIN Typ_karoserieOmezDil ON Dil.ID_Dil=Typ_karoserieOmezDil.ID_Dil"; else $tabulky.=",dil LEFT JOIN Typ_karoserieOmezDil ON Dil.ID_Dil=Typ_karoserieOmezDil.ID_Dil"; $where.=" AND ((Typ_karoserieOmezDil.ID_Dil=Dil.ID_Dil AND Typ_karoserieOmezDil.ID_Typ_karoserie=".$_SESSION['karoserie'].") OR Dil.nelibovolny_Typ_karoserie=0)"; $karoserie=true; if($motor==false AND $karoserie==false) $tabulky.=",dil"; if(isset($_session['kategorie']) AND $_SESSION['kategorie']!=0) $tabulky.=",podtyp_dilu"; $where.=" AND Dil.Podtyp_dilu=Podtyp_dilu.ID_Podtyp_dilu AND Podtyp_dilu.Typ_dilu=".$_SESSION['kategorie'].""; $uni=false; if(isset($_session['podkategorie']) AND $_SESSION['podkategorie']!=0) $where.=" AND Dil.Podtyp_dilu=".$_SESSION['podkategorie'].""; 11

$uni=false; $prikaz="select Dil.ID_Dil id, Dil.nazev nazev, MIN(Konkretni_dil.cena) cena, Dil.alternativni_ID alt, Dil.poznamka poznamka FROM ".$tabulky." WHERE ".$where; $prikaz.=" GROUP BY Dil.ID_Dil"; if($uni) $prikaz.=" UNION SELECT Dil.ID_Dil id, Dil.nazev nazev, MIN(Konkretni_dil.cena) cena, Dil.alternativni_ID alt, Dil.poznamka poznamka FROM Konkretni_dil,Dil WHERE Dil.univerzalni=1 GROUP BY Dil.ID_Dil ORDER BY 2"; else $prikaz.=" ORDER BY Dil.nazev"; Ilustrace 5: Kód vytváření příkazu select Tento poměrně složitý kód vznikl kvůli množství kombinací při zadávání informací pro vyhledávání náhradních dílů. Má za úkol vytvořit příkaz select, který by omezil počet vypsaných dílů, dle zadaných informací uživatele. Kód se dělí na dvě části. Na první část vytvářející příkaz select po zadání informace, která se vyhledává v názvu, poznámce a čísla výrobce dílu a druhou část, která vytváří příkaz select při zvolení postupného vyhledávání dílu. První část je vcelku jednoznačná, a proto přejdeme k části druhé. Na začátku si vytvoříme proměnnou v poli session, aby stránka index.php věděla, že má vypisovat (v levém sloupečku) uživatelem vybrané volby postupného vyhledávání. Poté si vytvoříme a naplníme pomocné proměnné, které budeme potřebovat později při vytváření příkazu select. Následuje krok, při kterém převádíme proměnné z pole post do pole session, kvůli již zmiňovanému výpisu stránky index.php. Dalšími kroky jsou již jednotlivá omezení, která skládají postupně příkaz select, odpovídající volbě uživatele. V každém kroku omezení se připojují pouze tabulky a podmínky, které se volby uživatele týkají. Příkaz vytvoříme spojením jeho jednotlivých částí s tabulkami a podmínkami. Sjednotíme agregovaná data, a připojíme příkaz pro vypisování univerzálních dílů (např. autobaterie, matice atd.). Nakonec necháme vysledek hledání seřadit podle abecedy (sestupně). 12

3.3.2 Výkreslení fotogalerie echo "<table style='background-color: black;'>"; for($i=0;$i<21;$i++) if(($i%6)==0) if($i!=0)echo "</tr>"; echo "<tr>"; $i++; if($i<18)echo "<td class='center'>"; else echo "<td class='center' colspan='2'>"; if($i<10)echo "<a href='images/foto/pic0".$i.".jpg' rel='lightbox[foto]'><img src='images/foto/pic0".$i.".jpg' width='100' height='75' alt='' /></a>"; else echo "<a href='images/foto/pic".$i.".jpg' rel='lightbox[foto]'><img src='images/foto/pic".$i.".jpg' width='100' height='75' alt='' /></a>"; echo "</td>"; $i--; echo "</tr>"; echo "</table>"; Ilustrace 6: Kód vykreslení fotogalerie Galerie je vypisovaná do tabulky pomocí jednoduchého cyklu for. Pro prohlížení fotogalerie je používaná technologie Lighbox 2. LightBox 2 je javascriptová (využívá knihovnu JQuery) open source fotogalerie. Mezi její přednosti patří jednoduchý design, snadná implementace a přehlednost pro uživatele. Samotné ovádáni je velice jednoduché. Poskytuje na výběr ze dvou možností a to buď pomocí šipek: doleva (předchozí fotografie), doprava (následující fotografie) a tlačítkem escape (ukončení prohlížení) nebo samotným stisknutím tlačítek. Cyklus for prochází čísla od 0 do 20, protože potřebujeme vypsat 21 obrázků. Poté provádíme modulo 6, protože potřebujeme šest obrázků na jednom řádku tabulky. A jelikož obrázků není takový počet, aby byl dělitelný šesti (beze zbytku), musíme u posledního řádku tabulky spojovat dva sloupečky do jednoho, abychom získali požadovaný počet buněk tabulky (21). 13

Závěr Aplikace byla úspěšně vytvořena, a vzniklo tak poměrně uživatelsky přátelské rozhraní, pro potenciální zákazníky autovrakoviště, které má jako jedinné svou vlastní evidenci náhradních dílů. Zpočátku bude naplnění databáze jistě zdlouhavé, ale jakmile se díly budou přidávat pouze při jejich příjmu, tak tento systém usnadní práci všem zaměstnancům vrakoviště a i jeho zákazníkům. Aplikace je samozřejmě nastavitelná dle požadavků vrakoviště, nyní je však nastavena dle požadavků Autovrakoviště Holasice. 14

Seznam zdrojů a použité literatury 1. CSS styly a html tagy (http://www.jakpsatweb.cz/) 2. SQL příkazy (http://www.w3schools.com/sql/default.asp) 3. JS měnící se obsah html selectů (http://www.javascriptkit.com/javatutors/selectcontent.shtml) 4. JS mizící divy (http://www.hotscripts.com/forums/javascript/41662-toggle-framevisibility-checkbox.html) 5. JS Lightbox 2 (http://www.huddletogether.com/projects/lightbox2/) 6. Informace o firmě, včetně obrázků (http://www.autovrakoviste-holasice.cz/) 7. Odkaz na mapu (http://www.mapy.cz/) 8. Informace o náhradních dílech (http://www.skoda-dily.cz/online-obchod.html) 9. Značky a modely automobilů (http://www.mobile.de/home/index.html) 10. Motory automobilů (http://en.wikipedia.org/) 15

Seznam ilustrací Ilustrace 1: Poptávkový formulář...3 Ilustrace 2: UML diagram tabulek databáze...5 Ilustrace 3: Ukázka designu stránky...6 Ilustrace 4: UML diagram případů užití...8 Ilustrace 5: Kód vytváření příkazu select...12 Ilustrace 6: Kód vykreslení fotogalerie...13 16

Seznam tabulek Tabulka 1: Přehled složek na serveru...8 Tabulka 2: Přehled souborů ve složce pages...9 17