s odpov´ıdaj´ıc´ım form´atov´an´ım, pˇriˇcemˇz z˚ ustane zachov´ano rozdˇelen´ı obsahu do logick´ych celk˚ u.
2.1.2
Kask´ adov´ e styly
P˚ uvodn´ı uˇzivatelsk´e rozhran´ı aplikace bylo navrˇzeno tak, aby byl obsah aktu´alnˇe prohl´ıˇzen´eho dokumentu naˇcten rychle a bez zbyteˇcn´ych prvk˚ u, proto Spr´avce aˇz na mal´e v´yjimky nepouˇz´ıv´a ve sv´em layoutu obr´azky a jeho CSS ˇsablona je velmi struˇcn´a. Stylov´an´ı jednotliv´ych str´anek mˇen´ı jen pouˇzit´a p´ısma, barvy, pˇr´ıpadnˇe rozmˇery a tvary prvk˚ u. Design aplikace vyuˇz´ıv´a nov´e moˇznosti, totiˇz nastaven´ı kulat´ych roh˚ u. Prim´arnˇe lze tohoto efektu dos´ahnout CSS vlastnost´ı border-radius, kter´a ale nen´ı ˇ podporov´ana vˇsemi prohl´ıˇzeˇci (nebo jejich starˇs´ımi verzemi). Sablona stylu si tedy ˇz´ad´a pˇrinejmenˇs´ım doplnˇen´ı dalˇs´ıch adekv´atn´ıch vlastnost´ı tak, aby byl obsah dokument˚ u optimalizov´an pro vˇsechny prohl´ıˇzeˇce (v maxim´aln´ı moˇzn´e m´ıˇre).
2.1.3
JavaScript a jQuery
JavaScript m´a v cel´e aplikaci dvˇe jednoznaˇcn´e u ´ lohy – obsluhu a kontrolu formul´aˇr˚ u, jeˇz jsou ve vˇetˇsinˇe pˇr´ıpad˚ u technologi´ı AJAX odes´ıl´any ke zpracov´an´ı na server, a realizaci nˇekter´ych vizu´aln´ıch efekt˚ u a pˇridan´e kl´avesov´e podpory. Aby byla manipulace s prvky DOMu a obecnˇe cel´ym HTML dokumentem jednoduˇsˇs´ı, optimalizovan´a pro vˇsechny prohl´ıˇzeˇce a sn´aze zapsateln´a, vyuˇz´ıvaj´ı skripty aplikace knihovnu jQuery rozˇs´ıˇrenou o framework jQuery UI, jenˇz pˇripojuje nadstandardn´ı metody pro pr´aci s barvami ˇci podporu drag&drop vyuˇz´ıvanou pˇri sestavov´an´ı tras ˇridiˇc˚ u. 2
Anal´yza p˚ uvodn´ıho syst´emu
Programov´a struktura
I pˇres pouˇzit´ı tˇechto doplˇ nk˚ u je zdrojov´y text neorganizovan´y a obsahuje rozs´ahl´e funkce o nˇekolika des´ıtk´ach ˇr´adek s opakuj´ıc´ımi se pˇr´ıkazy – hlavn´ı soubor JavaSriptu je uk´azkou toho, ˇze pˇred zah´ajen´ım prac´ı na p˚ uvodn´ı verzi nebyla provedena ˇz´adn´a anal´yza a ˇze aplikace byla ps´ana rychle a neefektivnˇe. Mimo form´aln´ı nedostatky obsahuj´ı skripty i mezery vˇecn´e. Obzvl´aˇst’ zanedban´e je oˇsetˇrov´an´ı chyb AJAXu pˇri spojen´ı se serverem. Aˇckoliv aplikace implementuje z´akladn´ı oˇsetˇren´ı chyb (napˇr. pˇri HTTP stavov´em k´odu 500), dojde-li k automatick´emu odhl´aˇsen´ı uˇzivatele v d˚ usledku vyprˇsen´ı platnosti sezen´ı, nen´ı schopna na tuto skuteˇcnost jakkoliv zareagovat. Pokud uˇzivatel nepˇrejde do jin´e ˇc´asti Spr´avce, nedozv´ı se o automatick´em odhl´aˇsen´ı a aplikace se k nˇemu bude i nad´ale chovat jako k pˇrihl´aˇsen´emu. Pˇri zad´av´an´ı objedn´avky se tedy poˇzadavek na zaps´an´ı dat do datab´aze odeˇsle, ale na serveru se neprovede, coˇz m´a fat´aln´ı n´asledky.
2.1.4
PHP a mPDF
PHP skripty obsluhuj´ı v aplikaci veˇskerou dynamiku – komunikuj´ı s datab´az´ı, zpracov´avaj´ı z´ıskan´e v´ysledky, generuj´ı HTML ˇsablony a PDF v´ystupy. Vzhledem k tomu, ˇze ve Spr´avci nen´ı vyuˇz´ıv´ano objektov´eho programov´an´ı, p˚ usob´ı PHP skripty zcela chaoticky, coˇz umocˇ nuje i fakt, ˇze naprosto postr´adaj´ı koment´aˇre. Vytv´aˇren´ı ˇsablon zajiˇst’uj´ı pouze dvˇe funkce, kter´e pomoc´ı pˇr´ıkazu echo pos´ılaj´ı na v´ystupn´ı buffer HTML popis dokumentu. Pˇri generov´an´ı tedy nem´a program´ator pˇr´ıliˇs mnoho moˇznost´ı, jak vykreslen´ı layoutu ovlivnit. I kdyˇz se vzhled aplikace ve vˇetˇsinˇe pˇr´ıpad˚ u nemˇen´ı, m˚ uˇze b´yt obˇcas potˇreba deaktivovat nˇekter´e menu nebo skr´yt urˇcit´y prvek standardn´ı ˇsablony, coˇz v tomto pˇr´ıpadˇe nelze. Aplikace umoˇzn ˇ uje vytv´aˇret 8 r˚ uzn´ych sestav pˇripraven´ych k tisku nebo archivaci. Ze Spr´avce se odeˇsle poˇzadavek na konkr´etn´ı skript, jemuˇz je metodou GET pˇred´ana informace o tom, kter´y v´ypis uˇzivatel vyˇzaduje. Samotn´e vytvoˇren´ı PDF souboru zajiˇst’uje knihovna mPDF, jeˇz autor poskytuje pod GNU licenc´ı a kter´e je pˇred´an HTML v´ystup sestavy. Ten mPDF pouˇzije jako pˇredlohu pro generov´an´ı PDF dokumentu. Pr´avˇe takov´e zpracov´an´ı ale zˇrejmˇe pˇredstavuje pˇr´ıˇcinu vyˇcerp´an´ı poskytovatelem stanoven´eho memory limit (160 MB). K nˇemu doch´az´ı pˇredevˇs´ım pˇri generov´an´ı t´ydenn´ıho z´aznamov´eho archu ˇridiˇce, kter´y obsahuje rozs´ahlou tabulku se seznamem vˇsech z´akazn´ık˚ u v dan´e trase a odpov´ıdaj´ıc´ıch pol´ı pro zanesen´ı poˇct˚ u objednan´ych pokrm˚ u na cel´y t´yden.
2.1.5
MySQL
Datab´aze aplikace vyˇzaduje kompletn´ı pˇrepracov´an´ı, a to at’ uˇz kv˚ uli form´aln´ım nedostatk˚ um, tak kv˚ uli jej´ımu ˇspatn´emu n´avrhu. Z obr´azku 2.1 (str. 4) je patrn´e, ˇze byla vytv´aˇrena stejnˇe jako ostatn´ı souˇc´asti Spr´avce bez jak´ekoliv pˇredchoz´ı anal´yzy. Jednotliv´e tabulky jsou tedy prov´azany jen minim´alnˇe, neodpov´ıdaj´ı pˇresnˇe re´aln´ym model˚ um a nepouˇz´ıvaj´ı efektivn´ı principy.
3
Anal´yza p˚ uvodn´ıho syst´emu
customers
orders id onday customer A B C D E F G H M1 M2 M3 M4 P
int(11) int(11) int(11) smallint(3) smallint(3) smallint(3) smallint(3) smallint(3) smallint(3) smallint(3) smallint(3) smallint(3) smallint(3) smallint(3) smallint(3) smallint(3)
setting name value
Programov´a struktura
varchar(10) varchar(100)
id name address billAddress phone email ICO DIC packing payment note
drivers int(11) varchar(200) varchar(200) varchar(200) varchar(9) varchar(255) varchar(8) varchar(20) varchar(1) varchar(1) text
id name route
int(11) varchar(150) text
menuDaily onday id name description
int(11) varchar(2) varchar(255) varchar(255)
received index name email address phone text read
int(10) varchar(255) varchar(255) varchar(255) int(9) text varchar(1)
menuStatic id name description
varchar(1) varchar(255) varchar(255)
Obr´azek 2.1: ERA model p˚ uvodn´ı datab´aze Form´ aln´ı str´ anka datab´ aze Tabulky v datab´azi by mˇely dodrˇzovat urˇcit´e konvence jejich n´azv˚ u, pojmenov´an´ı sloupc˚ u, index˚ u apod. Toto pravidlo datab´aze aplikace v˚ ubec nedodrˇzuje. Nˇekter´e tabulky jsou pojmenov´any n´azvem objektu, kter´y reprezentuj´ı, v mnoˇzn´em ˇc´ısle a jin´e v jednotn´em (order a customers). Stejnˇe tak se n´azev sloupce s indexem napˇr´ıˇc tabulkami liˇs´ı (id a index). Prim´ arn´ı kl´ıˇ c Tabulky setting a menuDaily nemaj´ı definovan´y prim´arn´ı kl´ıˇc, pˇrestoˇze pr´avˇe ten slouˇz´ı k jednoznaˇcn´e identifikaci kaˇzd´e poloˇzky tabulky [1]. Datov´ e typy Velk´e mnoˇzstv´ı sloupc˚ u pouˇz´ıv´a pro uchov´av´an´ı hodnot neodpov´ıdaj´ıc´ı datov´e typy nebo typy se zbyteˇcnˇe velk´ym rozsahem. Pˇr´ıkladem m˚ uˇze b´yt pouˇzit´ı INT(11) pro uloˇzen´ı data (napˇr. sloupec onday v tabulce order), coˇz vyˇzaduje 4 bajty pamˇeti. Nen´ı ani nastaven atribut UNSIGNED, takˇze se vyuˇz´ıv´a pouze polovina rozsahu (ˇcasov´y otisk nem˚ uˇze b´yt z´aporn´y). Proto je v tomto pˇr´ıpadˇe mnohem vhodnˇejˇs´ı pouˇz´ıt datov´y typ DATE, kter´y pro uchov´av´an´ı takov´e informace slouˇz´ı, a nav´ıc pro nˇej vyˇzaduje pouze 3 bajty. Podobnˇe je tomu tak´e u sloupce phone, jenˇz se vyskytuje v tabulk´ach received a customers a uchov´av´a dev´ıtim´ıstn´e telefonn´ı ˇc´ıslo. V kaˇzd´e tabulce je ale definov´an jinak – jednou jako VARCHAR(9) a podruh´e INT(9). Pamˇet’ovˇe u ´ spornˇejˇs´ı je samozˇrejmˇe varianta, kdy se telefon uchov´av´a jako ˇc´ıslo, a vyˇzaduje tedy pouh´e 4 bajty. Druh´a moˇznost, pˇri n´ıˇz se telefon povaˇzuje za ˇretˇezec o 9 znac´ıch, pro sv´e uloˇzen´ı potˇrebuje 10 bajt˚ u (9 pro znaky, des´at´y pro uloˇzen´ı d´elky).
4
Anal´yza p˚ uvodn´ıho syst´emu
Bezpeˇcnost
Nevhodn´ e ukl´ ad´ an´ı tras Trasy ˇridiˇc˚ u se skl´adaj´ı z jednotliv´ych z´akazn´ık˚ u, kter´e mus´ı obslouˇzit. V datab´azi jsou vˇsechny obsluhovan´e osoby uloˇzeny jako ˇretˇezec jejich ID oddˇelen´ych znakem “, trasa je tedy reprezentov´ana jako jedna ” hodnota ve sloupci route. To samozˇrejmˇe poruˇsuje principy 1. norm´aln´ı formy, podle n´ıˇz maj´ı b´yt atributy atomick´e [1], a z´aroveˇ n tedy i znemoˇzn ˇ uje pˇr´ım´e propojen´ı tabulek customers a drivers pomoc´ı klauzule JOIN. Nav´ıc si zmˇena trasy pokaˇzd´e vyˇz´ad´a kompletn´ı vygenerov´an´ı nov´eho ˇretˇezce.
2.2 2.2.1
Bezpeˇ cnost Zabezpeˇ cen´ı pˇ renosu dat
Aplikace nepouˇz´ıv´a protokol se ˇsifrov´an´ım HTTPS. Poskytovatel hostingu [5], na nˇemˇz je aplikace provozov´ana, sice nab´ız´ı podporu HTTPS, ale neposkytuje potˇrebn´y certifik´at. Koncov´y uˇzivatel aplikace byl o pˇr´ıpadn´ych dopadech informov´an a souhlasil s pouˇzit´ım nezabezpeˇcen´eho protokolu HTTP.
2.2.2
Ochrana hesel
Aktu´aln´ı verze Spr´avce pracuje pouze s jedin´ym heslem, a t´ım je pˇr´ıstupov´e heslo. Protoˇze k aplikaci doposud pˇristupoval jedin´y uˇzivatel, bylo pˇri uveden´ı programu do provozu stanoveno pevn´e heslo, jeˇz se skr´yv´a pˇr´ımo ve zdrojov´em textu v podobˇe MD5 otisku. To sice znemoˇzn ˇ uje jeho odhalen´ı, ale tak´e nelze toto heslo mˇenit bez z´asahu do zdrojov´eho textu.
2.2.3
SQL a PHP injection
SQL injection je zp˚ usob u ´ toku, kdy se do SQL dotazu vloˇz´ı prostˇrednictv´ım uˇzivatelsk´eho vstupu posloupnost SQL pˇr´ıkaz˚ u. Pokud v´yvoj´aˇr s takovou situac´ı nepoˇc´ıt´a, dojde k u ´ pravˇe SQL dotazu do formy, kter´a m˚ uˇze u ´ toˇcn´ıkovi poskytnout citliv´e u ´ daje z datab´aze. Uvaˇzujme situaci, kdy v´yvoj´aˇr odes´ıl´a do datab´aze pomoc´ı PHP dotaz: mysql_query("SELECT heslo FROM uzivatel WHERE uzivatel.jmeno = '" . $_POST["login"] . "'"); Podstrˇc´ı-li uˇzivatel jako vstup v poli login ˇretˇezec nˇ ekdo’ OR ’1’ = ’1, bude ve v´ysledku datab´azi zasl´an dotaz SELECT heslo FROM uzivatel WHERE uzivatel.jmeno = 'nˇ ekdo' OR '1' = '1' Vybr´any tedy budou vˇsechny z´aznamy, protoˇze v´yraz ’1’ = ’1’ je vˇzdy pravdiv´y [6]. Takov´emu chov´an´ı se d´a zabr´anit adekv´atn´ım escapov´an´ım vybran´ych znak˚ u (napˇr. znaku apostrofu), kter´e pak ztrat´ı sv˚ uj v´yznam v SQL dotazu a jsou 5
Anal´yza p˚ uvodn´ıho syst´emu
Funkˇcn´ı celky aplikace
ch´ap´any jako ˇc´ast ˇretˇezce. Pro tyto u ´ˇcely slouˇz´ı tzv. sanitaˇcn´ı metody, mezi nˇeˇz se ˇrad´ı napˇr. mysql real escape string [3]. Spr´avce vˇsak uˇzit´ı t´eto ochrany naprosto opom´ıj´ı a potenci´aln´ımu u ´ toˇcn´ıkovi tak usnadˇ nuje pˇr´ıpadn´y u ´ tok. Obdobn´y probl´em pˇredstavuje PHP injection. V´yvoj´aˇr naˇc´ıt´a pomoc´ı funkce include extern´ı PHP skript, jehoˇz n´azev zm´ınˇen´e funkci pˇred´av´a hodnotou z pole $ GET. Napˇr.: http://stranky.cz/index.php?page=a.html ´ cn´ıkovi pak staˇc´ı vytvoˇrit skript s funkc´ı show source [2], jeˇz zobrazuje zdroUtoˇ jov´y text PHP skriptu s pˇredan´ym n´azvem, um´ıstit jej na nˇejak´y hosting a pak jen pˇredat jeho URL adresu jako hodnotu promˇenn´e $ GET["page"] [7]. Ve st´avaj´ıc´ı verzi Spr´avce nem˚ uˇze k PHP injection doj´ıt, protoˇze nen´ı nikde ve zdrojov´em textu pouˇzito vol´an´ı funkce include s promˇenn´ym argumentem. Nelze vˇsak vylouˇcit SQL injection, protoˇze v˚ uˇci takov´emu u ´ toku nen´ı aplikace chr´anˇena a vyˇzaduje si tedy v tomto smˇeru znaˇcn´e u ´ pravy.
2.3 2.3.1
Funkˇ cn´ı celky aplikace V´ ypisy
Spr´avce umoˇzn ˇ uje uˇzivateli pˇrev´adˇet vybran´e z´aznamy z datab´aze do lidsk´e“, ” a tedy i tisknuteln´e podoby, resp. do pˇrenositeln´eho form´atu PDF. Data a zp˚ usob jejich form´atov´an´ı pro tisk stanovuje internˇe aplikace, a proto je nemoˇzn´e v´ypis jakkoli pˇrizp˚ usobovat. Uˇzivatel m˚ uˇze jedinˇe ovlivnit specifikaci v´ybˇeru dat – ˇcasov´e rozmez´ı, ˇridiˇc, z´akazn´ık apod. St´avaj´ıc´ı aplikace nab´ız´ı osm vestavˇen´ych v´ypis˚ u, pˇriˇcemˇz jedinou moˇznost´ı, jak tento poˇcet zmˇenit, je z´asah do zdrojov´eho textu aplikace.
2.3.2
Pˇ r´ıchoz´ı objedn´ avky
Tato volba nebyla v prvotn´ı verzi programu obsaˇzena, protoˇze provozovatel zaˇr´ızen´ı pˇrij´ımal objedn´avky na pracovn´ı e-mail. K probl´em˚ um doˇslo ve chv´ıli, kdy se elektronick´e zpr´avy generovan´e e-shopem na str´ank´ach spoleˇcnosti pˇrestaly do schr´anky zas´ılat. Abychom se takov´e situaci do budoucna vyhnuli, spoleˇcnˇe se zas´ılanou zpr´avou se do datab´aze zaˇcal ukl´adat z´aznam o pˇrijet´ı nov´e objedn´avky. V menu Pˇr´ıchoz´ı m´a pak uˇzivatel kontrolu nad objedn´avkami pˇrijat´ymi pˇres e-shop v posledn´ıch 14 dnech. Nepˇreˇcten´e poloˇzky jsou oznaˇceny ˇcervenˇe a po klepnut´ı na jm´eno z´akazn´ıka se zobrazuje kompletn´ı objedn´avka. Uˇzivateli se nab´ız´ı tak´e otevˇren´ı e-mailov´e adresy objedn´avaj´ıc´ıho v´ychoz´ım poˇstovn´ım klientem.
6
Anal´yza p˚ uvodn´ıho syst´emu
2.3.3
Funkˇcn´ı celky aplikace
ˇ ci Ridiˇ
Spr´avce nab´ız´ı skuteˇcnˇe m´alo moˇznost´ı pro spr´avu ˇridiˇc˚ u. Jedin´ym u ´ dajem, kter´y ˇ ˇridiˇc m´a, je jm´eno. Menu Ridiˇci tedy slouˇz´ı pouze pro jejich editaci nebo vytvoˇren´ı/odstranˇen´ı st´avaj´ıc´ıho ˇridiˇce.
2.3.4
Z´ akazn´ıci
Menu Z´akazn´ıci nab´ız´ı uˇzivateli aplikace pˇrid´av´an´ı ˇci editaci z´akazn´ık˚ u. Kaˇzd´y nov´y z´akazn´ık m˚ uˇze b´yt vytvoˇren vyplnˇen´ım formul´aˇre, kter´y se permanentnˇe nach´az´ı v lev´e ˇc´asti obrazovky. Vpravo je pak um´ıstˇen seznam abecednˇe uspoˇr´adan´ych z´akazn´ık˚ u. S pˇrib´yvaj´ıc´ım poˇctem osob v adres´aˇri vˇsak pˇrest´av´a b´yt pˇrehledn´y, protoˇze uˇzivatel nem´a ˇz´adn´e prostˇredky k jeho filtrov´an´ı.
2.3.5
Trasy
Kaˇzd´y ˇridiˇc m´a dan´y seznam z´akazn´ık˚ u, kter´e mus´ı kaˇzd´y den obslouˇzit. Jejich poˇrad´ı a mnoˇzstv´ı lze editovat pr´avˇe t´ımto menu. Uˇzivatel zvol´ı ˇridiˇce, jehoˇz trasu chce upravit, a aplikace mu nab´ıdne pohled na aktu´aln´ı trasu a seznam z´akazn´ık˚ u, kteˇr´ı nejsou zaˇrazeni k ˇz´adn´emu ˇridiˇci. Taˇzen´ım uˇzivatel prov´ad´ı zmˇeny. Pro dokonˇcen´ı mus´ı klepnout na tlaˇc´ıtko Uloˇzit – mnohdy tak neuˇcin´ı, protoˇze na tento krok zapomene, a zapˇr´ıˇcin´ı tak ztr´atu proveden´ych zmˇen.
2.3.6
Objedn´ avky
Uˇzivatel potˇrebuje kaˇzd´y den komplexnˇe upravovat objedn´avky vˇsech z´akazn´ık˚ u, k ˇcemuˇz mu poskytuje odpov´ıdaj´ıc´ı moˇznosti toto menu. Po v´ybˇeru dne a ˇridiˇce se naˇcte trasa a poˇcty objednan´ych pokrm˚ u u jednotliv´ych z´akazn´ık˚ u. Tyto poˇcty m˚ uˇze uˇzivatel pˇr´ımo editovat a jejich zmˇena se okamˇzitˇe ukl´ad´a. Proces zad´av´an´ı objedn´avek totiˇz prob´ıh´a u vˇsech ˇridiˇc˚ u kaˇzd´y den a dohromady m˚ uˇze trvat aˇz 2 hodiny, proto je neˇz´adouc´ı, aby doˇslo k pˇr´ıpadn´e ztr´atˇe dat zp˚ usoben´e nepravideln´ym ukl´ad´an´ım zmˇen.
2.3.7
Nastaven´ı
V souˇcasn´e verzi Spr´avce nem´a uˇzivatel pˇr´ıliˇs mnoho moˇznost´ı personalizace ˇci jak´ehokoliv jin´eho pˇrizp˚ usoben´ı aplikace. Jedin´ymi dostupn´ymi volbami je nedostateˇcn´a editace cen´ıku pokrm˚ u, jeˇz uchov´av´a tˇri cenov´e hodnoty, a vytv´aˇren´ı z´alohy. Aktu´aln´ı zp˚ usob nastavov´an´ı ceny se vˇsak v˚ ubec nehod´ı. Pokud uˇzivatel cenu zmˇen´ı, zmˇen´ı se i cena jiˇz prodan´ych obˇed˚ u a nˇekter´e v´ypisy (napˇr. mˇes´ıˇcn´ı v´ypis) pak v˚ ubec neodpov´ıdaj´ı skuteˇcnosti.
7
Anal´yza p˚ uvodn´ıho syst´emu
2.4
Uˇzivatelsk´e rozhran´ı
Uˇ zivatelsk´ e rozhran´ı
Doposud pouˇz´ıval aplikaci jedin´y uˇzivatel, jenˇz byl zaˇskolen a kter´y s n´ı pracuje kaˇzd´y den. Avˇsak v pˇr´ıpadˇe, kdy by doˇslo k indispozici souˇcasn´eho uˇzivatele, musela by s aplikac´ı pracovat nov´a, nezaˇskolen´a osoba. S takovou situac´ı Spr´avce nepoˇc´ıt´a, a to je pr´avˇe patrn´e i z navrˇzen´eho uˇzivatelsk´eho rozhran´ı. Tato skuteˇcnost se mnohdy projevuje v drobn´ych detailech. Svoji roli zde opˇet hr´ala tak´e nedostateˇcn´a pˇredchoz´ı anal´yza – v´yvoj´aˇr nebyl plnˇe sezn´amen se syst´emem zaveden´ym ve spoleˇcnosti, postr´adal podrobnosti, a sbˇer informac´ı tedy nebyl dostateˇcn´y. Jak text jiˇz jednou uv´adˇel, program byl vyv´ıjen rychle a d˚ uraz byl kladen pˇredevˇs´ım na jeho praktickou str´anku a snadn´y bˇeh. Uˇzivatelsk´a pˇr´ıvˇetivost se tedy pˇresunula do pozad´ı. Nedostatky uˇzivatelsk´eho rozhran´ı Spr´avce podrobnˇeji popisuje nˇekolik n´asleduj´ıc´ıch podkapitol.
2.4.1
Glob´ aln´ı aspekty
Dostupnost hlavn´ıho menu Protoˇze se jedn´a o webovou aplikaci, nen´ı vertik´aln´ı rozmˇer HTML dokumentu nikterak omezen. Proto m˚ uˇze uˇzivatel obsah vˇetˇsiny ˇc´ast´ı programu rolovat pomoc´ı posuvn´ık˚ u. Vzhledem k tomu, ˇze v aplikaci ale neexistuj´ı ˇz´adn´e fixnˇe pozicovan´e elementy, odroluje se spolu s aktu´aln´ım obsahem tak´e hlavn´ı nab´ıdka. Pro pˇrechod do nˇekter´eho jin´eho funkˇcn´ıho celku pak mus´ı opˇet rolovat obsah zpˇet, aby mu bylo zobrazeno hlavn´ı menu. To m˚ uˇze zpomalovat pr´aci s aplikac´ı. Prvky prohl´ıˇ zeˇ ce Nˇekter´e ovl´adac´ı prvky prohl´ıˇzeˇce mohou v uˇzivateli vyvolat dojem, ˇze funguj´ı stejnˇe jako pˇri klasick´em proch´azen´ı webov´ych str´anek, coˇz ovˇsem nemus´ı b´yt vˇzdy pravda. Napˇr´ıklad tlaˇc´ıtko Zpˇet mnohdy neumoˇzn ˇ uje skuteˇcn´y krok navr´acen´ı v historii tak, jak by uˇzivatel oˇcek´aval. Nˇekter´e funkce jsou totiˇz obsluhov´any pomoc´ı technologie AJAX, kter´a webovou historii v˚ ubec neovlivˇ nuje. Absence upozornˇ en´ı pˇ ri navigaci St´avaj´ıc´ı aplikace neupozorˇ nuje uˇzivatele pˇri pˇrechodu do jin´eho funkˇcn´ıho celku (na jinou fyzickou str´anku), takˇze m˚ uˇze pomˇernˇe snadno doj´ıt ke ztr´atˇe prov´adˇen´ych zmˇen, napˇr´ıklad pˇri editaci tras ˇridiˇc˚ u. Klepne-li uˇzivatel na tlaˇc´ıtko Zpˇet ve sv´em prohl´ıˇzeˇci, nedok´aˇze na to Spr´avce adekv´atnˇe zareagovat tˇreba zobrazen´ım dotazu na uloˇzen´ı zmˇen.
8
Anal´yza p˚ uvodn´ıho syst´emu
2.4.2
Uˇzivatelsk´e rozhran´ı
Ovl´ adac´ı prvky
Volba data a datov´ eho rozmez´ı Doposud mˇel uˇzivatel moˇznost volit datum pouze prostˇrednictv´ım v´ybˇerov´eho pole. Jeho v´ychoz´ı hodnota byla zpravidla nastavena na aktu´aln´ı den ˇci jin´y den odpov´ıdaj´ıc´ı u ´ˇcelu v´ybˇeru (napˇr. pˇri volbˇe t´ydne obsahovalo jedno pole hodnotu prvn´ıho a druh´e pole hodnotu posledn´ıho dne v tomto t´ydnu, viz obr. 2.2). Zcela nepˇr´ıvˇetiv´a situace tedy nastala v okamˇziku, kdy chtˇel uˇzivatel zmˇenit tˇreba jiˇz zm´ınˇen´e ˇcasov´e rozmez´ı. V jednom v´ybˇerov´em poli musel vyhledat nov´y poˇc´atek t´ydne a podobnˇe zmˇenit i hodnotu druh´eho prvku. Obecnˇe vzato je v´ybˇer data, jenˇz se v aplikaci vyskytuje pomˇernˇe ˇcasto, ˇreˇsen neˇst’astnˇe. Vˇetˇsina uˇzivatel˚ u oˇcek´av´a pˇri volbˇe data zobrazen´ı kalend´aˇre ˇci jin´eho pomocn´eho prvku, kter´y jim usnadn´ı orientaci napˇr. zobrazen´ım po t´ydnech nebo zv´yraznˇen´ım aktu´aln´ıho dne.
Obr´azek 2.2: Volba datov´eho rozmez´ı
Obr´azek 2.3: Tabulka objedn´avek
Tabulka objedn´ avek Tabulka objedn´avek se skl´ad´a z mnoˇziny textov´ych pol´ı (obr. 2.3), jejichˇz hodnota informuje o poˇctu objednan´ych pokrm˚ u a lze tak´e okamˇzitˇe zmˇenit (vˇcetnˇe uloˇzen´ı 9
Anal´yza p˚ uvodn´ıho syst´emu
Uˇzivatelsk´e rozhran´ı
zmˇen). Prvek m´a pevnˇe stanovenou v´yˇsku, aby pˇri zmˇenˇe ˇridiˇce, jehoˇz objedn´avky jsou zaznamen´av´any, resp. prohl´ıˇzeny, nedoch´azelo ke zmˇen´am rozmˇer˚ u cel´eho HTML dokumentu. Z toho plyne, ˇze prvek mus´ı b´yt um´ıstˇen uvnitˇr posuvn´e vrstvy. To si tak´e vyˇzaduje fixn´ı z´ahlav´ı, aby pˇri rolov´an´ı obsahu tabulky nedoˇslo k jeho skryt´ı. Uˇzivatel m´a moˇznost pouˇz´ıvat pro pohyb mezi vstupn´ımi poli kurzorov´e kl´avesy, Enter a kl´avesy A–F, jeˇz odpov´ıdaj´ı oznaˇcen´ı pokrm˚ u ze st´al´e nab´ıdky (ty ovˇsem nejsou v˚ ubec vyuˇz´ıv´any). To s sebou pˇrin´aˇs´ı probl´emy pr´avˇe pˇri rolov´an´ı obsahu prvku – nen´ı-li pole, jeˇz z´ıskalo fokus, viditeln´e (resp. vyˇzaduje posun ke sv´emu zobrazen´ı), nˇekter´e prohl´ıˇzeˇce automaticky nutn´y u ´ sek odroluj´ı tak, aby dan´y prvek zobrazily. Avˇsak ne vˇsechny a ne vˇzdy. Nav´ıc odroluj´ı skuteˇcnˇe jen bezpodm´ıneˇcnˇe nutnou ˇc´ast a c´ılov´y prvek tedy zobraz´ı zcela u spodn´ıho okraje prvku rodiˇcovsk´eho. Aˇckoliv m´a uˇzivatelovu orientaci v tabulce usnadnit fixn´ı z´ahlav´ı, ne vˇzdy se mu to podaˇr´ı. Obsluhuj´ıc´ı osoba mnohdy potˇrebuje vˇedˇet, kter´y obˇed se skr´yv´a pod oznaˇcen´ım M1 v aktu´aln´ı den. Aby to zjistil, mus´ı v souˇcasn´e verzi Spr´avce pˇrej´ıt do zcela odliˇsn´eho menu, coˇz cel´y proces zaznamen´av´an´ı objedn´avek rapidnˇe zdrˇzuje a odv´ad´ı uˇzivatelovu pozornost. T´ım se samozˇrejmˇe zvyˇsuje riziko chyby lidsk´eho faktoru. Vzhledem k tomu, ˇze prvky tabulky maj´ı mimo funkci informativn´ı tak´e editaˇcn´ı, m˚ uˇze uˇzivatel libovolnˇe mˇenit jejich obsah, pˇriˇcemˇz ztr´ata fokusu prvku vyvol´a funkci pro uloˇzen´ı. Pˇri ukl´ad´an´ı m˚ uˇze doj´ıt k chyb´am – o tom je uˇzivatel informov´an zbarven´ım dan´eho pole do ˇcervena. V opaˇcn´em pˇr´ıpadˇe se pozad´ı editovan´eho prvku zmˇen´ı na zelenou barvu. Obsluhuj´ıc´ı osoba se uˇz v pˇr´ıpadˇe chyby ale nedozv´ı, co ji zb˚ usobilo/zp˚ usobuje. Editor trasy Editace trasy je realizov´ana dvˇema seznamy (viz obr. 2.4) – jeden zobrazuje aktu´aln´ı trasu ˇridiˇce a druh´y z´akazn´ıky, kteˇr´ı nejsou zahrnuti v ˇz´adn´e z tras. Pouh´ym pˇretaˇzen´ım lze editovat poˇrad´ı poloˇzek trasy a stejnˇe tak lze mezi obˇema seznamy jednotliv´e z´akazn´ıky pˇretahovat. Ve chv´ıli, kdy je jeden ze seznam˚ u delˇs´ı neˇz okno prohl´ıˇzeˇce, zaˇcne b´yt pˇretahov´an´ı velmi nepohodln´e. Uˇzivatel mus´ı pˇretahovanou poloˇzku podrˇzet u doln´ıho okraje okna prohl´ıˇzeˇce a ˇcekat, aˇz se odroluje potˇrebn´a ˇc´ast obsahu, aby mohl z´akazn´ıka um´ıstit na adekv´atn´ı pozici. Adres´ aˇ r z´ akazn´ık˚ u Pro zobrazov´an´ı z´akazn´ık˚ u je vyhrazena pouze polovina str´anky v menu Z´akazn´ıci. K zobrazen´ı vˇsech detail˚ u u jednotliv´ych poloˇzek adres´aˇre je tedy k dispozici skuteˇcnˇe m´alo prostoru, obzvl´aˇst’ protoˇze v jednom prvku lze poloˇzky i editovat (obr. 2.5). Z´akazn´ıky nen´ı moˇzn´e jakkoliv filtrovat, takˇze je obsluhuj´ıc´ı osoba nucena vˇzdy proch´azet cel´y seznam. Editace je realizov´ana tak, ˇze po klepnut´ı na odpov´ıdaj´ıc´ı tlaˇc´ıtko se rozbal´ı formul´aˇr pro u ´ pravu u ´ daj˚ u pˇr´ımo v adres´aˇri. 10
Anal´yza p˚ uvodn´ıho syst´emu
Uˇzivatelsk´e rozhran´ı
Obr´azek 2.4: Editor tras pˇri pˇresouv´an´ı z´akazn´ıka
Obr´azek 2.5: Prohl´ıˇzen´ı a editace z´akazn´ık˚ u
11
3 N´avrh nov´eho syst´emu 3.1 3.1.1
Obecn´ a charakteristika Rozsah projektu
Vyv´ıjen´y syst´em bude doplnˇen o spoustu nov´ych funkc´ı a tak´e ty st´avaj´ıc´ı projdou mnoˇzstv´ım zmˇen. Z toho plyne, ˇze rozsah projektu se uˇz jen d´ıky tˇemto faktor˚ um nˇekolikr´at zvˇetˇs´ı oproti syst´emu pouˇz´ıvan´emu v souˇcasnosti. Kompletn´ı podobu fin´aln´ıho produktu popisuje diagram funkˇcn´ıch celk˚ u, viz pˇr´ıloha A. Protoˇze se ale jedn´a o rozs´ahlou aplikaci, v r´amci t´eto bakal´aˇrsk´e pr´ace implementuji pouze z´akladn´ı funkcionalitu, pˇriˇcemˇz v pr´aci na dokonˇcen´ı syst´emu budu pokraˇcovat i po obhajobˇe. V souladu se zad´an´ım implementuji: uˇzivatelsk´e rozhran´ı, tj. nak´oduji grafick´ y layout aplikace, autorizaci a autentizaci uˇzivatele, spr´avu z´akazn´ık˚ u, objedn´avek a distribuce.
3.1.2
Kontext syst´ emu
Jak bylo zm´ınˇeno hned v u ´ vodu, administrativn´ı pracovnice stravovac´ıho zaˇr´ızen´ı moment´alnˇe aplikaci pro spr´avu pouˇz´ıv´a, avˇsak d˚ uvody uveden´e v kapitole 2 znemoˇznuj´ı jej´ı snadnou obsluhu, a nav´ıc program postr´ad´a nˇekter´e funkce. Novˇe vyv´ıjen´y syst´em, kter´y jiˇz bude moˇzn´e povaˇzovat za plnohodnotn´y softwarov´y produkt, tedy nahrad´ı st´avaj´ıc´ı aplikaci v pln´em rozsahu, pˇriˇcemˇz z˚ ustane zachov´ano jeho fyzick´e um´ıstˇen´ı.
3.1.3
Funkce produktu
Protoˇze se jedn´a o n´ahradu existuj´ıc´ıho syst´emu, z˚ ustanou samozˇrejmˇe zachov´any jeho p˚ uvodn´ı funkce, tj. spr´ava objedn´avek, z´akazn´ık˚ u a ˇridiˇc˚ u. Nav´ıc ale bude rozˇs´ıˇren o mnoho u ´ prav a dalˇs´ıch moˇznost´ı (kompletn´ı pˇrehled popisuje diagram, viz pˇr´ıloha A). Nov´a aplikace uˇzivateli poskytne tak´e n´asleduj´ıc´ı funkce: n´ astˇenka, kter´a nab´ıdne plochu pro pˇrip´ıchnut´ı“ l´ıstk˚ u s pozn´amkami a oka” mˇzit´y pˇr´ıstup k vyhled´av´an´ı v datab´azi; finance, pomoc´ı nichˇz m˚ uˇze uˇzivatel v´est penˇeˇzn´ı den´ık, spravovat pohled´avky a vytv´aˇret faktury (doposud muselo zaˇr´ızen´ı vyuˇz´ıvat dalˇs´ıho programu, a uchov´avat tak adresy a jm´ena z´akazn´ık˚ u duplicitnˇe); stravov´ an´ı, jeˇz nab´ıdne n´astroje pro spr´avu pˇripravovan´ych pokrm˚ u, zobraz´ı statistiky jejich obl´ıbenosti a umoˇzn´ı sestavovat a hromadnˇe rozes´ılat t´ydenn´ı j´ıdeln´ıˇcky.
12
N´avrh nov´eho syst´emu
3.1.4
Obecn´a charakteristika
Autentizace a autorizace
Autentizace slouˇz´ı k jednoznaˇcn´e identifikaci uˇzivatele, kter´y chce vstoupit do syst´emu [4]. V p˚ uvodn´ım syst´emu byla realizov´ana tak, ˇze jak´ekoliv osobˇe staˇcilo zn´at pˇr´ıstupov´e heslo a mohl se do syst´emu pˇrihl´asit – nebyl tedy identifikov´an jednoznaˇcnˇe. Tehdejˇs´ım poˇzadavk˚ um zadavatele tato alternativa vyhovala, jelikoˇz syst´em spravovali maxim´alnˇe dva uˇzivatel´e. Nov´a verze aplikace umoˇzn´ı vytv´aˇret uˇzivatelsk´e u ´ˇcty, ˇc´ımˇz zajist´ı jedineˇcnou identifikaci kaˇzd´e pˇristupuj´ıc´ı osoby. Autorizace pracuje s jiˇz autentizovan´ym uˇzivatelem a rozhoduje o tom, jak´a pr´ava jsou mu v syst´emu pˇridˇelena [4]. Aplikace pouˇz´ıvan´a v souˇcasnosti proces autorizace zcela vynech´av´a, logicky to plyne ze skuteˇcnosti, ˇze se v syst´emu m˚ uˇze vyskytovat jedin´a identita. Oproti n´ı novˇe navrˇzen´y syst´em s autorizac´ı poˇc´ıt´a, realizov´ana bude pomoc´ı ACL (Access Control List), kter´y pˇredstavuje sb´ırku omezen´ı a pˇr´ıstupov´ych pravidel pro jednotliv´e uˇzivatelsk´e role.
3.1.5
Provozn´ı prostˇ red´ı
Pˇri konzultaci v´yvoje aktu´alnˇe uˇz´ıvan´e aplikace zadavatel uvedl, ˇze by bylo vhodn´e, aby mohl do syst´emu vstupovat jak v prostor´ach stravovac´ıho zaˇr´ızen´ı, tak tak´e z osobn´ıho poˇc´ıtaˇce doma. Objedn´avky jsou sice zpravidla zad´av´any prostˇrednictv´ım poˇc´ıtaˇce v kancel´aˇri, avˇsak bˇehem t´ydne se shromaˇzd’uj´ı pˇredbˇeˇzn´e poˇcty pokrm˚ u na n´asleduj´ıc´ı t´yden a ty je potˇreba zan´est do datab´aze o v´ıkendu. Jedinˇe tak je moˇzn´e informovat na zaˇc´atku nov´eho t´ydne person´al kuchynˇe o pˇribliˇzn´em mnoˇzstv´ı objednan´ych pokrm˚ u, a poˇr´ıdit tak odpov´ıdaj´ıc´ı mnoˇzstv´ı potˇrebn´ych surovin. Tyto d˚ uvody tedy vyˇzadovaly, aby program sd´ılel data pˇres Internet. Stˇeˇzejn´ı skuteˇcnost tedy pˇredstavovalo rozhodnut´ı, zda koncipovat nov´y syst´em jako tenk´eho ˇci tlust´eho klienta. V druh´em pˇr´ıpadˇe by se nab´ızelo vytvoˇrit aplikaci napˇr´ıklad v jazyce Java, kter´y by pak komunikoval s datab´az´ı um´ıstˇenou v s´ıti. Tento zp˚ usob by vˇsak vyˇzadoval distribuci aplikace na vˇsechny poˇc´ıtaˇce, kter´e by mˇely pr´aci se syst´emem umoˇznit, coˇz je typick´ym znakem tlust´eho klienta. Zvolil jsem tedy radˇeji alternativu tenk´eho klienta, a to v podobˇe webov´e aplikace. Syst´em spr´avy tak nen´ı nutn´e ˇs´ıˇrit na v´ıce poˇc´ıtaˇc˚ u, protoˇze uˇzivatel m˚ uˇze k administraˇcn´ımu rozhran´ı pˇristupovat pˇres webov´y prohl´ıˇzeˇc z jak´ehokoliv poˇc´ıtaˇce. Tato koncepce sice vyˇzaduje pr´aci online, tj. trp´ı typickou nev´yhodou tenk´eho klienta [8], ale i pˇresto z˚ ustane zachov´ana u nov´e verze programu, i nad´ale p˚ ujde o webovou aplikaci. U nov´eho syst´emu se znatelnˇe rozˇs´ıˇr´ı ˇsk´ala uˇzivatel˚ u, kteˇr´ı k nˇemu budou pˇristupovat. Spolu s rozvojem firmy totiˇz doch´az´ı k drobnˇejˇs´ımu rozdˇelen´ı jednotliv´ych u ´ kon˚ u, a tak administrativn´ı pracovnice spravuje z´akazn´ıky a pˇrij´ım´a pouze elektronick´e objedn´avky, zat´ımco jejich denn´ı aktualizaci prov´ad´ı sami ˇridiˇci. I pˇres nav´yˇsen´ı poˇctu uˇzivatel˚ u a pˇr´ıpadnou dalˇs´ı distribuci, bude aplikace lokalizov´ana pouze v ˇcesk´em jazyce. Vyuˇzit´ı pl´anovan´ych technologi´ı vˇsak pomˇernˇe snadno dovol´ı pˇr´ıpadnou lokalizaci do jin´eho jazyka dodateˇcnˇe prov´est. 13
N´avrh nov´eho syst´emu
Obecn´a charakteristika
Obr´azek 3.1: Graf zn´azorˇ nuj´ıc´ı objem pˇrenesen´ych dat v r´amci webov´ych str´anek stravovac´ı spoleˇcnosti a j´ı pouˇz´ıvan´ym syst´emem spr´avy (statistiky poskytovatele hostingov´ych sluˇzeb)
3.1.6
Omezen´ı n´ avrhu a implementace
Samotn´y proces v´yvoje aplikace nen´ı nijak ˇcasovˇe omezen, protoˇze stravovac´ı zaˇr´ızen´ı v souˇcasnosti pouˇz´ıv´a p˚ uvodn´ı verzi spr´avce, kter´a je plnˇe funkˇcn´ı, aˇckoliv v n´ı uˇzivatel postr´ad´a nˇekter´e zm´ınˇen´e funkce ˇci jejich u ´ pravy. Jak jiˇz bylo zm´ınˇeno v kapitole 3.1.1, v r´amci t´eto pr´ace bude vytvoˇrena z´akladn´ı kostra syst´emu, na jej´ımˇz dalˇs´ım v´yvoji budu intenzivnˇe pokraˇcovat i po obhajobˇe. Implementaci omezuj´ı pouze parametry webhostingu, na nˇemˇz je program provozov´an (endora.cz). Vzhledem k tomu, ˇze zadavatel byl jiˇz dˇr´ıve ochoten zakoupit hostingov´y program, kter´y nab´ız´ı nejlepˇs´ı moˇzn´e vlastnosti, jsou omezen´ı skuteˇcnˇe mal´a. Program Mega [5] (k 8. dubnu 2013) nab´ız´ı 100GB mˇes´ıˇcn´ı limit pˇrenosu dat, jenˇz pravdˇepodobnˇe nebude nikdy vyˇcerp´an (viz obr´azek 3.1), garantuje z´alohu jak datab´aze, tak i soubor˚ u aplikace, poskytuje PHP memory limit 160 MB a maxim´aln´ı dobu bˇehu skriptu 30 sekund, umoˇzn ˇ uje rozeslat 400 email˚ u za hodinu, poskytuje MySQL datab´azi typu InnoDB s velikost´ı aˇz 150 MB.
14
N´avrh nov´eho syst´emu
3.1.7
Inovace a nov´e funkce
Syst´ em jako softwarov´ y produkt
Jelikoˇz byla aktu´alnˇe pouˇz´ıvan´a aplikace vyv´ıjena pro jedinou spoleˇcnost, neuvaˇzoval jsem nad jej´ım pojmenov´an´ım a pro oznaˇcen´ı pouˇz´ıval obecn´eho jm´ena spr´avce. Bˇehem anal´yzy a v´yvoje nov´eho syst´emu, kdy bylo potˇreba konzultovat zmˇeny se zadavatelem, se bˇeˇzn´e oznaˇcen´ı pouˇz´ıvalo jako n´azev, a tak byla aplikace alternativnˇe pojmenov´ana Spr´avce. Z hlediska pˇr´ıpadn´e propagace ˇci distribuce syst´emu jako softwarov´eho produktu nepˇredstavuje toto oznaˇcen´ı vhodn´y n´azev, proto jsem sestavil seznam moˇzn´ych alternativ a konzultoval fin´aln´ı v´ybˇer se zadavatelem a 5 nez´avisl´ymi osobami. Nejv´ıce kladn´ych ohlas˚ u z´ıskalo pojmenov´an´ı Gadmin tvoˇren´e spojen´ım v´yraz˚ u gastro a administration. K n´azvu byl vytvoˇren tak´e logotyp, viz obr. 3.2.
Obr´azek 3.2: Logotyp nov´eho syst´emu Gadmin
3.2
Inovace a nov´ e funkce
N´asleduj´ıc´ı kapitoly detailnˇeji popisuj´ı nov´e funkce syst´emu, popˇr. u ´ pravy, kter´ymi se Gadmin od dˇr´ıve uˇz´ıvan´e aplikace odliˇsuje. Kompletn´ı n´avrh syst´emu a prov´azanost mezi jednotliv´ymi funkˇcn´ımi celky demonstruje diagram, viz pˇr´ıloha A.
3.2.1
N´ astˇ enka
Podobnˇe jako ve vˇsech kancel´aˇr´ıch i v adminstrativn´ım prostˇred´ı stravovac´ıho zaˇr´ızen´ı jsou pracovn´ı st˚ ul a zed’ posety l´ısteˇcky s informacemi r˚ uzn´eho charak’ teru. At uˇz se jedn´a o zapsan´e telefonn´ı ˇc´ıslo, dodateˇcnou objedn´avku ˇci instrukce, jak´e suroviny maj´ı b´yt objedn´any na dalˇs´ı t´yden, mohou se ve velk´em mnoˇzstv´ı dalˇs´ıch pap´ır˚ u a pozn´amek pomˇernˇe snadno ztratit. Neblah´ym n´asledkem pak m˚ uˇze b´yt nespokojenost c´ılov´eho z´akazn´ıka, jenˇz napˇr. neobdrˇz´ı obˇed. Pr´avˇe tomuto l´ısteˇckov´an´ı“ m´a zamezit nov´a ˇc´ast syst´emu – N´astˇenka. ” Uˇzivatel syst´emu m˚ uˇze pˇrid´avat l´ısteˇcky na virtu´aln´ı n´astˇenku, kter´a vyluˇcuje jejich ztr´atu. Prostˇrednictv´ım tohoto menu m´a nav´ıc rychl´y pˇr´ıstup k vyhled´av´an´ı v datab´azi ˇci vygenerov´an´ı ˇcasto generovan´ych v´ypis˚ u.
15
N´avrh nov´eho syst´emu
Inovace a nov´e funkce
Dostupn´ e interakce L´ısteˇcky mohou b´yt pˇrid´av´any, editov´any nebo odeb´ır´any. Pokud uˇzivatel neodebere l´ıstek s´am, po uplynut´ı nastaven´eho term´ınu, kter´y je pro kaˇzdou pozn´amku jin´y, dojde k automatick´emu odstranˇen´ı. Panel pro vyhled´av´an´ı nab´ız´ı uˇzvateli proch´azet datab´azi podle telefonn´ıch ˇc´ısel, jmen, typu balen´ı apod. Jeho koncepce se zamˇeˇruje pˇredevˇs´ım na rychl´y pˇr´ıstup k poˇzadovan´ym dat˚ um napˇr. bˇehem telefonn´ıho hovoru.
3.2.2
Z´ akazn´ıci
Z´akazn´ıci mohou b´yt dvoj´ıho druhu – fyzick´e osoby nebo spoleˇcnosti. Doposud je syst´em nijak nerozliˇsoval, coˇz uˇzivatele aplikace znaˇcnˇe omezovalo. Nemohl totiˇz k jednomu z´akazn´ıkovi pˇripojit v´ıce e-mailov´ych adres nebo telefonn´ıch ˇc´ısel, protoˇze datab´aze automaticky operovala se z´akazn´ıkem jako jednotlivcem. Gadmin novˇe nab´ıdne u spoleˇcnost´ı uv´adˇet kontaktn´ı osoby a s nimi i u ´ daje tohoto charakteru. Samotn´e menu Z´akazn´ıci se transformuje na regul´ern´ı adres´aˇr. Uˇzivatel m˚ uˇze zobrazit seznam vˇsech z´akazn´ık˚ u, ˇradit jej a filtrovat nebo pˇrej´ıt na kartu vybran´eho z´akazn´ıka, a z´ıskat tak kompletn´ı pˇrehled o jeho posledn´ıch objedn´avk´ach a dalˇs´ıch informac´ıch. Se syst´emem Gadmin se tak´e zcela mˇen´ı zp˚ usob kalkulace cen objedn´avek. Dˇr´ıvˇejˇs´ı aplikace zav´adˇela jednotnou cenu pro vˇsechny objedn´avky. Protoˇze ale nˇekter´e vˇetˇs´ı spoleˇcnosti mohou pro sv´e zamˇestnance z´ıskat mnoˇzstevn´ı slevu na stravov´an´ı, m´a nyn´ı administrativn´ı pracovnice stravovny moˇznost zmˇenit cenu pokrmu u kaˇzd´eho z´akazn´ıka. Dostupn´ e interakce Adres´aˇr z´akazn´ık˚ u m˚ uˇze uˇzivatel filtrovat a ˇradit. D´ale m´a moˇznost pˇrid´avat z´akazn´ıky, editovat jejich kontaktn´ı a odbˇerov´e u ´ daje (zp˚ usob balen´ı, platby), skr´yvat je nebo jim zaslat e-mail pˇr´ımo prostˇrednictv´ım aplikace. Z´akazn´ıka nelze trvale odstranit, protoˇze je v´az´an na sv´e objedn´avky z dˇr´ıvˇejˇs´ıho obdob´ı. Z karty z´akazn´ıka lze pak pˇrej´ıt do menu Finance (viz kapitola 3.2.5) a zobrazit jeho pohled´avky v˚ uˇci stravovac´ımu zaˇr´ızen´ı.
3.2.3
Distribuce
Toto menu z˚ ust´av´a t´emˇeˇr v nezmˇenˇen´e podobˇe. Jedin´e v´yrazn´e odliˇsen´ı od pˇredchoz´ıho syst´emu pˇredstavuje rozdˇelen´ı distribuce na ˇridiˇce a v´ydejny. Jedn´a se vˇsak pouze o terminologii, protoˇze oba dva v´ydejn´ı prvky se v r´amci aplikace chovaj´ı stejnˇe.
16
N´avrh nov´eho syst´emu
Inovace a nov´e funkce
Dostupn´ e interakce Uˇzivateli je poskytnuta moˇznost zakl´adat nov´e ˇridiˇce (resp. v´ydejny), upravovat jejich u ´ daje a trasu. Editace trasy spoˇc´ıv´a v pˇrid´av´an´ı/odeb´ır´an´ı z´akazn´ık˚ u nebo zmˇenˇe jejich poˇrad´ı. Podobnˇe jako z´akazn´ıci (kapitola 3.2.2) i u ˇridiˇc˚ u a v´ydejen m˚ uˇze obsluha aplikace zobrazit kartu s detaily.
3.2.4
Objedn´ avky
Kv˚ uli tomu, ˇze samotn´a stavba datab´aze programu projde markantn´ımi zmˇenami, se tak´e syst´em objedn´av´an´ı znatelnˇe zmˇen´ı. V souˇcasnosti se z´aznamy o objednan´ych pokrmech uchov´avaj´ı pouze po dobu 90 dn˚ u. Uk´azalo se ale, ˇze pro potˇreby stravovac´ıho zaˇr´ızen´ı je tento limit pˇr´ıliˇs omezuj´ıc´ı (nˇekdy se vyˇzaduje pˇr´ıstup k objedn´avk´am starˇs´ım i v´ıce neˇz p˚ ul roku), proto budou v nov´em syst´emu objedn´avky zaznamen´any permanentnˇe. Podobnˇe jako v menu Z´akazn´ıci (kapitola 3.2.2) i u objedn´avky m´a novˇe uˇzivatel moˇznost explicitnˇe zmˇenit cenu. Prim´arn´ı cena je reprezentov´ana hodnotou uvedenou v nastaven´ı cen´ık˚ u, sekund´arnˇe ji m˚ uˇze ovlivnit cena specifikovan´a u jednotliv´ych z´akazn´ık˚ u a pˇri zad´av´an´ı objedn´avky pak lze dvˇe zm´ınˇen´e hodnoty nahradit pˇr´ımo vloˇzenou hodnotou. Tento syst´em zajist´ı, ˇze v´ypisy, kter´e nˇejak´ym zp˚ usobem operuj´ı s cenami pokrm˚ u, budou vracet i v pˇr´ıpadˇe p˚ ul roku star´ych dat korektn´ı v´ystup. Ve st´avaj´ıc´ı aplikaci tomu tak nebylo – zmˇena glob´aln´ı ceny totiˇz zapˇr´ıˇcinila tak´e zmˇenu ve star´ych v´ypisech. Takov´e chov´an´ı samozˇrejmˇe nen´ı ˇz´adouc´ı. Mimo tˇr´ı´ urovˇ nov´e stanoven´ı cen poskytne nov´y program moˇznost definovat tak´e cenu obalov´eho materi´alu, kter´a se automaticky pˇripoˇcte k celkov´e hodnotˇe objedn´avky. Koncepce vkl´ad´an´ı objedn´avek rovnˇeˇz projde zmˇenami. Jedn´ım z poˇzadavk˚ u zadavatele bylo, aby aplikace umoˇzn ˇ ovala vkl´adat objedn´avky pro cel´y t´yden najednou. Doposud mohl uˇzivatel zad´avat poˇcty pokrm˚ u jen na jeden den a pot´e musel pˇrepnout na dalˇs´ı. Explicitn´ı pˇ rijet´ı elektronick´ e objedn´ avky Z´akazn´ıci stravovac´ıho zaˇr´ızen´ı maj´ı moˇznost objedn´avat obˇedy prostˇrednictv´ım rozhran´ı na webov´ych str´ank´ach, pokaˇzd´e vˇsak mus´ı zadat doruˇcovac´ı u ´ daje, aby mohla administrativn´ı pracovnice z´akazn´ıka bezprobl´emovˇe identifikovat. Objedn´avka takov´eho charakteru se pak automaticky odeˇsle na e-mail spoleˇcnosti, z nˇehoˇz mus´ı obsluha stravovny data pˇren´est do syst´emu spr´avy. Proto byla souˇcasnˇe se syst´emem Gadmin pˇredloˇzena koncepce z´akaznick´eho ID, jeˇz by nutnost zad´an´ı kontaktn´ıch u ´ daj˚ u z´akazn´ıkem a n´asledn´y pˇresun do syst´emu eliminovala. V pˇr´ıpadˇe, kdy z´akazn´ık vyuˇzije t´eto funkce, zobraz´ı se spolu s pˇr´ıchoz´ı objedn´avkou novˇe moˇznost jej´ıho explicitn´ıho pˇrijet´ı, tzn. automatick´e zaˇrazen´ı poˇzadavku do spr´avy objedn´avek k z´akazn´ıkovi s odpov´ıdaj´ıc´ım identifik´atorem. 17
N´avrh nov´eho syst´emu
Inovace a nov´e funkce
Dalˇ s´ı dostupn´ e interakce Osoba obsluhuj´ıc´ı aplikaci m˚ uˇze volit mezi zp˚ usoby, jak´ymi bude poˇcty objednan´ych pokrm˚ u vkl´adat – bud’to vybere jedin´y den, nebo zvol´ı zad´av´an´ı objedn´avek na cel´y t´yden pro vybranou trasu. Pro u ´ pravu vloˇzen´ych dat pouˇzije stejn´e prostˇred´ı. Prostˇrednictv´ım menu Objedn´avky m´a tak´e pˇr´ıstup k novˇe pˇr´ıchoz´ım poˇzadavk˚ um, jejich spr´avˇe ˇci pˇr´ıpadn´emu pˇresunu do datab´aze.
3.2.5
Finance
Menu Finance pˇredstavuje zcela novou souˇc´ast syst´emu. Moment´alnˇe mus´ı administrativn´ı pracovnice pro vytv´aˇren´ı faktur a veden´ı penˇeˇzn´ıho den´ıku pouˇz´ıvat ´ CTO. ˇ aplikaci U Tento produkt vˇsak v prostˇred´ı stravovac´ıho zaˇr´ızen´ı neslouˇz´ı pro kompletn´ı u ´ˇcetn´ı spr´avu, n´ybrˇz je vyuˇz´ıv´an pouze k veden´ı elektronick´ych z´aznam˚ u informuj´ıc´ıch o finanˇcn´ıch pohybech ve stravovnˇe atp. (ofici´aln´ı u ´ˇcetnictv´ı se prov´ad´ı mimo toto zaˇr´ızen´ı). To s sebou vˇsak pˇrin´aˇs´ı urˇcitou duplicitu dat – z´akazn´ıci vyˇzaduj´ıc´ı faktury mus´ı b´yt vedeni jak v syst´emu spr´avy, tak i ve zm´ınˇen´em u ´ˇcetn´ım programu. Jakoukoliv zmˇenu v datech mus´ı tedy uˇzivatel ´ CTO ˇ prov´est v obou aplikac´ıch. Nav´ıc nep˚ usob´ı faktury vygenerovan´e syst´emem U nikterak reprezentativnˇe. Tyto d˚ uvody vedly zadavatele k poˇzadavku integrace podobn´e funkcionality do aplikace Gadmin. Mimo spr´avu faktur m´a nov´y syst´em umoˇznit tak´e veden´ı penˇeˇzn´ıho den´ıku, tj. poskytnout rozhran´ı pro pˇrid´av´an´ı z´aznam˚ u o pˇr´ıjmu a v´ydeji penˇez. Dalˇs´ı souˇc´ast menu pˇredstavuje pˇrehled pohled´avek, jenˇz obsluze stravovny nab´ıdne seznam uhrazen´ych a neuhrazen´ych obˇed˚ u, umoˇzn´ı je filtrovat podle ˇridiˇc˚ u apod. Uˇzivatel tak z´ısk´a ucelen´y pohled na dluˇzn´e ˇc´astky a stav kasy. Dostupn´ e interakce Autorizace t´ımto menu je povolena jen dan´ym uˇzivatelsk´ym rol´ım, protoˇze se jedn´a o citliv´a data, k nimˇz nemohou pˇristupovat osoby ze vˇsech uˇzivatelsk´ych tˇr´ıd. Pokud tedy vyuˇz´ıv´a v´ıce osob t´e role, jeˇz pˇr´ıstup dovoluje, mohou editovat pouze data, jeˇz do datab´aze vloˇzili. Jak jiˇz bylo v t´eto kapitole zm´ınˇeno, osoba obsluhuj´ıc´ı syst´em (s patˇriˇcn´ym opr´avnˇen´ım) m˚ uˇze vkl´adat z´aznamy o v´ydeji ˇci pˇr´ıjmu hotovosti do penˇeˇzn´ıho den´ıku. Tyto poloˇzky lze kategorizovat do skupin (definov´any v menu Nastaven´ı, kapitola 3.2.8). Gadmin tak´e uˇzivateli poskytuje n´astroje pro vytv´aˇren´ı, editaci a prohl´ıˇzen´ı faktur. Hlavn´ı funkce menu Finance doplˇ nuje kalkulaˇcka nomin´aln´ıch hodnot, kter´a umoˇzn ˇ uje snadno pˇrepoˇc´ıt´avat hotovost ˇci stravovac´ı poukazy v kase. Pozn´ amka: Toto menu nebude implementov´ano v r´amci bakal´aˇrsk´e pr´ace.
18
N´avrh nov´eho syst´emu
3.2.6
Inovace a nov´e funkce
Stravov´ an´ı
Jedn´a se o dalˇs´ı zcela novou souˇc´ast syst´emu. Doposud byly j´ıdeln´ıˇcky uv´adˇeny na web pomoc´ı redakˇcn´ıho syst´emu. Ten vˇsak nijak nespolupracoval s aplikac´ı pro spr´avu, proto bylo nutn´e kaˇzd´y novˇe vytvoˇren´y j´ıdeln´ıˇcek publikovan´y na webu exportovat do syst´emu. Tam byla data pouˇz´ıv´ana pro generov´an´ı pˇrehled˚ u z´akazn´ıky zakoupen´ych pokrm˚ u. Gadmin spoj´ı tyto dvˇe oddˇelen´e jednotky do jedn´e, a novˇe tak nab´ıdne u ´ plnou spr´avu pokrm˚ u a j´ıdeln´ıˇck˚ u pˇr´ımo uvnitˇr syst´emu. Obsluha stravovny tedy nebude muset zad´avat stejn´a j´ıdla opakovanˇe, protoˇze syst´em je automaticky registruje a s´am nab´ıdne pˇri dalˇs´ım sestavov´an´ı j´ıdeln´ıˇcku. D´ıky permanentn´ımu uchov´av´an´ı objedn´avek (viz kapitola 3.2.4) nav´ıc aplikace umoˇzn´ı zobrazen´ı statistik obl´ıbenosti jednotliv´ych pokrm˚ u. Dostupn´ e interakce Uˇzivateli se zpˇr´ıstupˇ nuj´ı n´astroje pro sestavov´an´ı a proch´azen´ı t´ydenn´ıch j´ıdeln´ıˇck˚ u. Ty sest´avaj´ı z registrovan´ych pokrm˚ u, jeˇz m˚ uˇze obsluha syst´emu takt´eˇz editovat. Pˇri vytv´aˇren´ı nov´eho j´ıdeln´ıho l´ıstku lze explicitnˇe vloˇzit nov´y pokrm bez nutnosti pˇrechodu do menu spr´avy pokrm˚ u. Syst´em totiˇz zjist´ı, ˇze v datab´azi se takov´y zat´ım nenach´az´ı, a proto jej automaticky vloˇz´ı. Mimo automatick´e vkl´ad´an´ı pokrm˚ u kontroluje syst´em tak´e ˇcetnost jejich pouˇzit´ı. Snadno se m˚ uˇze st´at, ˇze vytv´aˇr´ı-li uˇzivatel j´ıdeln´ıˇcek manu´alnˇe, nevˇedomky nˇekter´e pokrmy opakuje ˇcastˇeji, ˇcehoˇz si zaruˇcenˇe vˇsimne c´ılov´y z´akazn´ık. Gadmin jej na skuteˇcnost, ˇze se chyst´a pouˇz´ıt ned´avno nab´ızen´y pokrm znovu, upozorn´ı. Dalˇs´ı novinkou je hromadn´e rozesl´an´ı j´ıdeln´ıˇck˚ u formou e-mailov´e PDF pˇr´ılohy. Administrativn´ı pracovnice doposud musela j´ıdeln´ı l´ıstek vytvoˇren´y v aplikaci Microsoft Word rozes´ılat standardn´ım zp˚ usobem na e-maily z´akazn´ık˚ u, kter´e vˇsak byly uchov´av´any ve form´atu vCard (souborov´y form´at pro v´ymˇenu osobn´ıch dat, elektronick´a podoba obchodn´ı vizitky). Novˇe m˚ uˇze uˇzivatel e-maily odeslat jedn´ım kliknut´ım, protoˇze veˇsker´e e-mailov´e adresy jsou uvedeny u z´akazn´ık˚ u v datab´azi. Pozn´ amka: Toto menu nebude implementov´ano v r´amci bakal´aˇrsk´e pr´ace.
3.2.7
V´ ypisy
Stejnˇe jako p˚ uvodn´ı syst´em i Gadmin umoˇzn´ı vytv´aˇret na z´akladˇe v´ystupu z datab´aze tisknuteln´e a pˇrenositeln´e v´ystupy ve form´atu PDF. Ty slouˇz´ı napˇr´ıklad pro ˇridiˇce, person´al kuchynˇe, obsluhu v´ydejny apod. Novˇe bude toto menu koncipov´ano jako spr´avce instalovan´ych modul˚ u v´ypisu. Pokud si tedy uˇzivatel v budoucnu vyˇz´ad´a nov´y v´ystup (napˇr. tisk statistik), v´yvoj´aˇr mu pouze dod´a soubor modulu a po instalaci jej bude moˇzn´e ihned pouˇz´ıvat. Z´asadn´ı rozd´ıl tedy 19
N´avrh nov´eho syst´emu
Inovace a nov´e funkce
spoˇc´ıv´a v tom, ˇze kaˇzd´y modul bude v nov´em syst´emu um´ıstˇen do vlastn´ıho souboru, nikoliv do jednoho spoleˇcn´eho. Dostupn´e interakce samozˇrejmˇe z´avis´ı na zvolen´em modulu. Standardnˇe budou k dispozici n´asleduj´ıc´ı: adres´aˇr s kontakty, pˇrehled objedn´avek z´akazn´ıka, pˇrehled pohled´avek pro ˇridiˇce (tabulka se seznamem z´akazn´ık˚ u na trase ˇridiˇce a pˇrehledem ˇc´astek, jeˇz maj´ı uhradit), z´aznamov´ y arch (pr´azdn´a tabulka se z´akazn´ıky na trase ˇridiˇce a buˇ nkami pro zanesen´ı objedn´avek na nov´y t´yden), tisk pˇrijat´e objedn´avky, mˇes´ıˇcn´ı pˇrehled, denn´ı v´ ypis pro kuchyni (obsahuje poˇcty pokrm˚ u filtrovan´e dle tras ˇridiˇc˚ u a zp˚ usobu balen´ı), tisk faktury, tisk j´ıdeln´ıˇcku, tisk v´ yˇcetky (v´ystup z kalkulaˇcky nomin´aln´ıch hodnot)
Pozn´ amka: Toto menu nebude implementov´ano v r´amci bakal´aˇrsk´e pr´ace.
3.2.8
Nastaven´ı
Oproti st´avaj´ıc´ı verzi syst´emu poskytne Gadmin ˇsirok´e moˇznosti personalizace a dalˇs´ıho nastaven´ı syst´emu. Cel´e menu bude rozdˇeleno na podmenu, na nˇeˇz se detailnˇeji zamˇeˇruj´ı n´asleduj´ıc´ı kapitoly. Personalizace syst´ emu Jelikoˇz nov´y syst´em poskytuje ˇsirˇs´ı moˇznosti neˇz p˚ uvodn´ı aplikace, objevuje se i vˇetˇs´ı mnoˇzstv´ı pˇrizp˚ usobiteln´ych prvk˚ u. Nav´ıc se novˇe zav´ad´ı uˇzivatelsk´e role, a tedy se tak´e poˇc´ıt´a s vˇetˇs´ım poˇctem uˇzivatel˚ u programu. Ne kaˇzd´y bude cht´ıt sd´ılet stejn´e nastaven´ı jako ostatn´ı, a proto dostane moˇznost zmˇenit pomoc´ı tohoto menu pˇrinejmenˇs´ım n´ıˇze uveden´e atributy uˇzivatelsk´eho u ´ˇctu: podpis – jm´eno, pod n´ımˇz uˇzivatel v syst´emu vystupuje (nikoliv uˇzivatelsk´e jm´eno), heslo a e-mail, zobrazen´ı tip˚ u – vypnut´ı/zapnut´ı zobrazov´an´ı struˇcn´ych n´apovˇed.
20
N´avrh nov´eho syst´emu
Inovace a nov´e funkce
Z´ alohov´ an´ı Aˇckoliv p˚ uvodn´ı syst´em urˇcit´ym zp˚ usobem z´alohov´an´ı podporoval, neumoˇzn ˇ oval definovat, jak ˇcasto a jak´ym zp˚ usobem m´a b´yt na vytvoˇren´ı z´alohy uˇzivatel upozorˇ nov´an. Gadmin nab´ıdne nastaven´ı tˇechto atribut˚ u (autorizovan´ym uˇzivatel˚ um), a nav´ıc umoˇzn´ı obnovu ze z´alohy nahr´an´ım odpov´ıdaj´ıc´ıho souboru pro pˇr´ıpad, kdy by doˇslo k selh´an´ı datab´aze. Stravov´ an´ı a distribuce Pˇredmˇetem tohoto podmenu je pˇrizp˚ usoben´ı samotn´eho menu Stravov´an´ı a jeho v´ystup˚ u. Stravovac´ı zaˇr´ızen´ı pouˇz´ıv´a k jednoznaˇcn´e identifikaci speci´aln´ı oznaˇcen´ı obˇed˚ u (napˇr. M1 pˇredstavuje pokrm denn´ıho menu ˇc. 1, B oznaˇcuje pokrm st´al´eho menu ˇc. 2). Poˇcet tˇechto oznaˇcen´ı se zpravidla nemˇen´ı, nicm´enˇe se nab´ız´ı uˇzivateli umoˇznit spr´avu takov´ych symbol˚ u a neimplementovat je internˇe. Podmenu tedy uˇzivateli poskytne n´asleduj´ıc´ı moˇznosti: pˇrid´av´an´ı/´ uprava oznaˇcen´ı (zm´ınˇeno v´yˇse), pˇrid´av´an´ı/´ uprava typ˚ u balen´ı, prodleva opakov´an´ı – ˇcasov´ yu ´ daj definuj´ıc´ı, s jak´ym minim´aln´ım odstupem se mohou pokrmy v j´ıdeln´ıˇcc´ıch opakovat, aktivace automatick´eho ukl´ad´an´ı pokrm˚ u – volba, kter´a umoˇzn´ı novˇe pouˇzit´a j´ıdla automaticky zan´est do spr´avy pokrm˚ u, rozes´ılat j´ıdeln´ıˇcky kontaktn´ım osob´am – nastav´ı, zda se pˇri hromadn´em odesl´an´ı nov´eho j´ıdeln´ıˇcku maj´ı e-maily pro firemn´ı z´akazn´ıky smˇerovat na adresu cel´e spoleˇcnosti nebo na adresy jej´ıch kontaktn´ıch osob.
Finance a cen´ıky Souˇcasn´y syst´em umoˇzn ˇ oval pouze jednoduch´e nastaven´ı cen, tj. definici ceny samotn´e pol´evky, samotn´eho hlavn´ıho j´ıdla a zv´yhodnˇen´eho kompletn´ıho menu. Bˇehem t´emˇeˇr dvoulet´eho provozu se vˇsak mˇenily obchodn´ı principy zaveden´e ve stravovac´ım zaˇr´ızen´ı, a tak nyn´ı zadavatel vyˇzaduje zaveden´ı dalˇs´ıch cen a tˇr´ı´ urovn ˇ ov´e cenov´e hierarchie. Prim´arn´ı cenu pokrmu stanovuje hodnota nastaven´a v tomto menu, sekund´arn´ı tvoˇr´ı u ´ daj uveden´y u jednotliv´ych z´akazn´ık˚ u a jako terci´arn´ı lze pouˇz´ıt hodnotu uvedenou pˇr´ımo pˇri vytvoˇren´ı objedn´avky. Dalˇs´ı souˇc´ast menu Finance a cen´ıky pˇredstavuje editace skupin pro kategorizaci z´aznam˚ u penˇeˇzn´ıho den´ıku, nastaven´ı kalkulaˇcky nomin´aln´ıch hodnot a definice form´atov´an´ı faktur. Obsluha aplikace bude m´ıt k dispozici volby, jeˇz urˇc´ı, zda m´a b´yt na faktuˇre zobrazen n´azev banky atp. D˚ uleˇzit´ym nastaven´ım, jeˇz menu Finance a cen´ıky poskytne, je editace dan´ı vyuˇz´ıvan´ych ve faktur´ach ˇci penˇeˇzn´ım den´ıku. 21
N´avrh nov´eho syst´emu
Koncepce uˇzivatelsk´eho rozhran´ı
Kalend´ aˇ r Speci´aln´ım pˇr´an´ım zadavatele bylo, aby jej aplikace upozorˇ novala na narozeniny a sv´atky zamˇestnanc˚ u stravovac´ıho zaˇr´ızen´ı. K tomuto u ´ˇcelu slouˇz´ı pr´avˇe kalend´aˇr, kam m˚ uˇze k jednotliv´ym dn˚ um pˇriˇradit upozornˇen´ı. Kalend´aˇr nav´ıc automaticky integruje ˇcesk´e st´atn´ı sv´atky a jmeniny a v budoucnu pravdˇepodobnˇe dovol´ı tak´e zaznamen´avat term´ıny zamˇestnaneck´ych dovolen´ych. V´ ypisy Protoˇze u pˇredchoz´ı verze syst´emu zadavatel nˇekdy potˇreboval urˇcit´e ˇc´asti z dan´eho v´ypisu odstranit nebo je zobrazit jinak, vzniklo tak´e toto podmenu, kter´e umoˇzn ˇ uje glob´alnˇe pracovat s dokumenty v´ypis˚ u. Obsluha aplikace m˚ uˇze definovat, jak´y text se m´a zobrazovat v z´ahlav´ı, z´apat´ı, jak´e jsou rozmˇery str´anky a odsazen´ı od jej´ıho okraje a pˇredevˇs´ım pak, zda m´a b´yt v´ystup ve form´atu PDF ˇci HTML.
3.3
Koncepce uˇ zivatelsk´ eho rozhran´ı
Doposud aplikaci pouˇz´ıvala pouze jedin´a osoba – administrativn´ı pracovnice stravovac´ıho zaˇr´ızen´ı. Pˇri v´yvoji prvn´ı verze syst´emu byly tedy br´any v u ´ vahu pouze jej´ı pˇripom´ınky a vlastn´ı n´avrhy v´yvoj´aˇre. Jiˇz nˇekolikr´at zmiˇ novan´a nedostateˇcn´a anal´yza zaveden´ych postup˚ u v tomto zaˇr´ızen´ı zapˇr´ıˇcinila vznik nedostatk˚ u, a to nejen v oblasti funkˇcnosti, ale tak´e v r´amci pouˇzitelnosti a pˇr´ıvˇetivosti uˇzivatelsk´eho rozhran´ı. Nov´y syst´em tedy mus´ı nab´ıdnout jednoduch´y a pˇrehledn´y zp˚ usob spr´avy spoleˇcnosti tak, aby jej mohl bez vˇetˇs´ıch probl´em˚ u obsluhovat i uˇzivatel, jenˇz nebyl kompletnˇe s aplikac´ı Gadmin sezn´amen. N´asleduj´ıc´ı odstavce struˇcnˇe popisuj´ı zmˇeny v jednotliv´ych oblastech rozhran´ı syst´emu ˇci novˇe pouˇzit´e ovl´adac´ı prvky. Hlavn´ı panel Hlavn´ı panel p˚ uvodn´ıho programu zcela zbyteˇcnˇe zab´ıral spoustu prostoru v horn´ı ˇc´asti HTML dokumentu. Ten vˇsak mohl b´yt vyuˇzit pro zobrazen´ı podstatnˇejˇs´ıch prvk˚ u syst´emu. Souˇc´ast panelu pˇredstavovalo tak´e hlavn´ı, jedno´ urovˇ nov´e menu. Syst´em Gadmin jej dekomponuje na tˇri ˇc´asti (obr. 3.3): hlavn´ı nab´ıdku, kde uˇzivatel zvol´ı modul, s n´ımˇz chce pracovat (napˇr. Z´akazn´ıci nebo Stravov´an´ı); podnab´ıdku, jej´ıˇz obsah z´avis´ı na volbˇe modulu; vˇzdy vˇsak obsahuje tlaˇc´ıtko Zpˇet pro n´avrat do pˇredchoz´ıho menu; menu uˇzivatele, kter´e slouˇz´ı pro personalizaci syst´emu a k odhl´aˇsen´ı z u ´ˇctu.
22
N´avrh nov´eho syst´emu
Koncepce uˇzivatelsk´eho rozhran´ı
D˚ uleˇzitou zmˇenou je tak´e zv´yraznˇen´ı aktu´alnˇe vybran´eho modulu. Doposud totiˇz uˇzivatele syst´em nijak neinformoval o tom, ve kter´e jeho ˇc´asti se nach´az´ı. Hlavn´ı panel d´ale doplˇ nuje navigaˇcn´ı liˇsta um´ıstˇen´a na konci kaˇzd´e str´anky, jeˇz obsahuje pouze dvˇe tlaˇc´ıtka pro rychlejˇs´ı navigaci – Zpˇet a Nahoru. pevná šířka 900 px datum, narozeniny
název modulu ←
uživatelské menu
aktivní modul
název modulu
podmenu aktivního modulu obsah aktivního podmenu
Obr´azek 3.3: N´avrh horn´ıho panelu syst´emu Gadmin
Vˇ etˇ s´ı interakce prvk˚ u Gadmin nab´ıdne spoustu nov´ych moˇznost´ı pˇredevˇs´ım u tabulkov´ych prvk˚ u, kde uˇzivatel obvykle vyˇzaduje pohodln´e proch´azen´ı, ˇrazen´ı a filtrov´an´ı poloˇzek. Pr´avˇe tyto funkce novˇe poskytne vyv´ıjen´y syst´em, a zajist´ı tak obsluze rychl´y pˇr´ıstup k poˇzadovan´ym dat˚ um. Dostupnost kl´ avesnic´ı Aˇckoliv pˇredeˇsl´y syst´em nab´ızel nadstandardn´ı moˇznosti pro proch´azen´ı prvk˚ u str´anky pomoc´ı kl´aves, nerespektoval z´akladn´ı pravidla, a to aktivaci prvk˚ u ve spr´avn´em poˇrad´ı pomoc´ı kl´avesy Tab. Gadmin jednoznaˇcenˇe definuje, ˇze prvn´ı pozice obsad´ı poloˇzky menu a pot´e postupnˇe obdrˇz´ı tab-index i prvky formul´aˇr˚ u. Nov´ e ovl´ adac´ı prvky Nab´ıdka formul´aˇrov´ych prvk˚ u HTML dokumentu v urˇcit´ych pˇr´ıpadech nepokr´yv´a poˇzadavky v´yvoj´aˇre nebo uˇzivatele, jedn´a se napˇr´ıklad o v´ybˇer datov´eho rozmez´ı. Gadmin proto implementuje element pro pohodln´y v´ybˇer data (obr. 3.4). Novˇe tak´e poskytne uˇzivateli pˇri zad´av´an´ı objedn´avky kontextov´e menu, pomoc´ı nˇehoˇz bude moci obsluha zmˇenit explicitnˇe typ balen´ı ˇci cenu objedn´avky.
23
N´avrh nov´eho syst´emu
Souhrn poˇzadavk˚ u na nov´y syst´em pohyb po dnech
út 24. dubna 2013 pohyb po týdnech
Obr´azek 3.4: N´avrh prvku pro v´ybˇer data Kontextov´ e n´ apovˇ edy (hints) Aby uˇzivatelsk´emu rozhran´ı a funkc´ım syst´emu porozumˇel bez vˇetˇs´ıch pot´ıˇz´ı kaˇzd´y uˇzivatel, budou vybran´e prvky doplnˇeny o popisek, kter´y se zobraz´ı, kdyˇz nad nimi uˇzivatel podrˇz´ı kurzor. Eliminuje se tak nejednoznaˇcnost nˇekter´ych prvk˚ u a nezkuˇsen´y uˇzivatel bude informov´an o funkcionalitˇe bez nutnosti vˇse vyzkouˇset. Aˇz se bude v aplikaci plnˇe orientovat, m˚ uˇze zobrazov´an´ı vypnout v nastaven´ı sv´eho u ´ˇctu.
3.4
Souhrn poˇ zadavk˚ u na nov´ y syst´ em
N´asleduj´ıc´ı v´yˇcet uv´ad´ı poˇzadavky kladen´e na syst´em Gadmin vˇcetnˇe tˇech, kter´e nebudou v r´amci bakal´aˇrsk´e pr´ace zpracov´any. Pˇr´ıstup v´ıce uˇzivatel˚ u s r˚ uzn´ymi rolemi a pˇr´ıstupov´ymi pr´avy, spr´ava z´akazn´ık˚ u, ˇridiˇc˚ u, v´ydejen a u spoleˇcnost´ı moˇznost pˇripojen´ı dalˇs´ıch kontaktn´ıch osob, bezpeˇcn´e vkl´ad´an´ı denn´ıch a t´ ydenn´ıch objedn´avek; pˇri chybˇe mus´ı b´yt uˇzivatel informov´an, zaveden´ı flexibiln´ıho urˇcov´an´ı cen – glob´aln´ı cena, cena z´akazn´ıka a cena objedn´avky, zaveden´ı ceny za balen´ı pokrmu, vytv´aˇren´ı l´ıstk˚ u s pozn´amkami, pˇripojov´an´ı pozn´amky k denn´ım objedn´avk´am, spr´ava penˇeˇzn´ıho den´ıku a pohled´avek z´akazn´ık˚ u v˚ uˇci strav. zaˇr´ızen´ı, spr´ava pokrm˚ u a j´ıdeln´ıˇck˚ u, automatizace vytv´aˇren´ı nov´eho j´ıdeln´ıho l´ıstku, rozˇs´ıˇren´e moˇznosti nastaven´ı a personalizace syst´emu, registrace narozenin zamˇestnanc˚ u a st´atn´ıch sv´atk˚ u, zobrazen´ı prostˇrednictv´ım kalend´aˇre a upozornˇen´ı na liˇstˇe, generov´an´ı pˇrenositeln´ ych a tisknuteln´ych v´ystup˚ u z datab´aze dle poˇzadavk˚ u uˇzivatele, perzistence dat objedn´avek pˇri zmˇenˇe cen a jin´ ych faktor˚ u.
24
4 Implementace syst´emu Gadmin Tato kapitola popisuje, jak prob´ıhala volba vhodn´ych technologi´ı a jak´ym zp˚ usobem byl syst´em n´aslednˇe realizov´an. Popis nezach´az´ı do detail˚ u zdrojov´ych soubor˚ u, k tomuto u ´ˇcelu slouˇz´ı kompletn´ı dokumentace um´ıstˇen´a pˇr´ımo ve zdrojov´em textu ve formˇe dokumentaˇcn´ıch koment´aˇr˚ u.
4.1
Srovn´ an´ı a volba technologi´ı
Ve chv´ıli, kdy je podoba nov´eho syst´emu podloˇzena odpov´ıdaj´ıc´ı anal´yzou star´e verze (kapitola 2) a podrobn´ym n´avrhem funkcionality schv´alen´ym zadavatelem (kapitola 3, pˇr´ıloha A), nab´ız´ı se zvolit adekv´atn´ı technologie a prostˇredky k jej´ı realizaci. U p˚ uvodn´ı aplikace byl tento krok stejnˇe jako anal´yza zaveden´ych postup˚ u ve stravovac´ı spoleˇcnosti vypuˇstˇen a o implementaci pˇr´ıpadn´ych rozˇs´ıˇren´ı ˇci knihoven se rozhodovalo aˇz v okamˇziku, kdy se jejich pouˇzit´ı jevilo jako nezbytnˇe nutn´e.
4.1.1
Generov´ an´ı HTML obsahu
Zdrojov´y text programu pouˇz´ıvan´eho v souˇcasn´e chv´ıli byl skuteˇcnˇe obt´ıˇznˇe ˇciteln´y. Sv˚ uj pod´ıl na jeho nepˇrehlednosti nesl i zp˚ usob, jak´ym se generoval HTML obsah – poˇzadovan´y HTML dokument na v´ystup pos´ılala funkce echo. V jednoduch´ych pˇr´ıpadech, napˇr. pˇri generov´an´ı hypertextov´eho odkazu, by tento postup jeˇstˇe nebyl tak nevhodn´y jako pˇri vytv´aˇren´ı tabulek ˇci jin´ych sloˇzit´ych prvk˚ u, jeˇz jsou sloˇzeny z mnoha HTML tag˚ u. PHP skripty pak tedy obsahovaly rozs´ahl´e konkatenovan´e ˇretˇezce. Tyto d˚ uvody tedy volaly po zmˇenˇe zp˚ usobu generov´an´ı obsahu jednotliv´ych nab´ıdek. Aby bylo moˇzn´e aplikaci pohodlnˇe vyv´ıjet, v ide´aln´ım pˇr´ıpadˇe vyuˇz´ıt objektovˇe orientovan´eho PHP (tedy aˇz ve verzi 5), zajistit jej´ı bezprobl´emov´y a rychl´y chod a koncipovat ji tak, aby mohla b´yt snadno rozˇsiˇriteln´a, mus´ı v´yvoj´aˇr pro jej´ı realizaci zvolit framework. V dneˇsn´ı dobˇe nab´ız´ı Internet ˇsirokou ˇsk´alu webov´ych framework˚ u, kter´e jsou mnohdy dostupn´e pod open-source licenc´ı. Po prostudov´an´ı vlastnost´ı nˇekolika z nich patˇrily mezi hlavn´ı favority n´asleduj´ıc´ı: Yii (http://yiiframework.com), Zend (http://framework.zend.com), Nette (http://nette.org).
Vˇsechny zm´ınˇen´e projekty pracuj´ı s MVC (Model-View-Component) modelem, nab´ız´ı validaci vstup˚ u formul´aˇr˚ u, keˇsov´an´ı, prostˇredky pro autorizaci a auten25
Implementace syst´emu Gadmin
Srovn´an´ı a volba technologi´ı
tizaci, rychl´y a bezpeˇcn´y bˇeh aplikace, DRY (Don’t Repeat Yourself) principy a podporuj´ı AJAX. Pro v´yvoj syst´emu Gadmin byl nakonec vybr´an framework Nette. Nepochybnˇe pˇrevyˇsuje zbyl´e dva projekty ˇcesk´ym manu´alem a komunitou, kterou si vytvoˇril ˇ e republice. Lokalizace dokumentace vˇsak nebyla d´ıky tomu, ˇze vznikl pr´avˇe v Cesk´ jedin´ym faktorem, kter´y o v´ybˇeru Nette rozhodl. Na rozd´ıl od ostatn´ıch projekt˚ u nab´ız´ı tak´e ˇsablonovac´ı jazyk Latte, kter´y velmi zjednoduˇsuje vytv´aˇren´ı ˇsablon dokument˚ u, ˇcehoˇz lze pr´avˇe pˇri v´yvoji syst´emu Gadmin velmi dobˇre vyuˇz´ıt. Dalˇs´ı souˇc´ast, jiˇz ocen´ı jistˇe kaˇzd´y v´yvoj´aˇr, pˇredstavuj´ı siln´e ladic´ı n´astroje. Nette pro tyto u ´ˇcely pouˇz´ıv´a tzv. Ladˇenku, kter´a standardn´ı chybov´e hl´aˇsen´ı PHP pˇretransformuje do elegantn´ı, snadno ˇciteln´e podoby, a nav´ıc jej dopln´ı o u ´ seky zdrojov´ych text˚ u, v nichˇz chyba vznikla. Neopomenutelnou v´yhodou zvolen´eho frameworku je d˚ uraz kladen´y na zabezpeˇcen´ı. Nette automaticky escapuje jak´ykoliv v´ystup do HTML dokumentu, ˇc´ımˇz zabraˇ nuje XSS u ´ tok˚ um a stejnˇe tak prov´ad´ı i sanitaci dat odes´ılan´ych do datab´aze prostˇrednictv´ım dotaz˚ u, a t´ım p´adem chr´an´ı pˇred SQL injection (kapitola 2.2.3, dalˇs´ı poskytovanou ochranu uv´ad´ı zdroj [9]).
4.1.2
Datab´ aze
Volbu datab´aze ve velk´e m´ıˇre omezuj´ı parametry hostingu, na nˇemˇz bude v´ysledn´y syst´em provozov´an, k dispozici je totiˇz pouze MySQL datab´aze. Aˇckoliv existuj´ı jin´e pouˇziteln´e varianty srovnateln´e se zm´ınˇen´ym datab´azov´ym syst´emem, napˇr. SQLite nebo PostgreSQL, vyuˇzije Gadmin pro uchov´av´an´ı dat MySQL datab´azi, protoˇze hosting jinou moˇznost nenab´ız´ı. D˚ uleˇzitou roli d´ale hraje volba u ´ loˇziˇstˇe jednotliv´ych tabulek. Spousta webov´ych aplikac´ı dnes vyuˇz´ıv´a pro jejich uchov´an´ı typ MyISAM, jenˇz ale nenab´ız´ı podporu ciz´ıch kl´ıˇc˚ u, kter´a pˇredstavuje jeden z hlavn´ıch poˇzadavk˚ u na nov´y syst´em – zachov´an´ı referenˇcn´ı integrity. Ta je zodpovˇedn´a za to, ˇze nedojde k naruˇsen´ı vztah˚ u mezi daty z tabulek na sobˇe z´avisl´ych. Pˇr´ıkladem, kdy je referenˇcn´ı integrita vyˇzadov´ana, m˚ uˇze b´yt situace, pˇri n´ıˇz se uˇzivatel pokouˇs´ı z jedn´e tabulky odstranit z´akazn´ıka navzdory tomu, ˇze m´a tento z´akazn´ık v jin´e tabulce zaznamen´any objedn´avky ˇcekaj´ıc´ı na vyˇr´ızen´ı. Kdyby tak doˇslo skuteˇcnˇe k jeho smaz´an´ı, nevyˇr´ızen´e objedn´avky by osiˇrely“, protoˇze odkaz na jejich rodiˇcovsk´y ” z´aznam, tj. onoho z´akazn´ıka, by ztratil platnost [1]. Proto bylo zvoleno u ´ loˇziˇstˇe InnoDB, kter´e ciz´ı kl´ıˇce podporuje a souˇcasnˇe zajiˇst’uje tak´e dodrˇzen´ı referenˇcn´ı integrity – zmˇeny zp˚ usobuj´ıc´ı jej´ı poruˇsen´ı automaticky zavrhne. Referenˇcn´ı integritu lze alternativnˇe zachov´avat i u MyISAM u ´ loˇziˇstˇe implementac´ı potˇrebn´ych podm´ınek pˇr´ımo v aplikaci. Framework Nette ale prim´arnˇe (bez urˇcit´ych modifikac´ı) nen´ı schopen pracovat s jin´ym typem u ´ loˇziˇstˇe, neˇz je InnoDB.
26
Implementace syst´emu Gadmin
Srovn´an´ı a volba technologi´ı
D´ıky j´ım poskytnut´ym ciz´ım kl´ıˇc˚ um a zachov´an´ı jist´ych konvenc´ı pro pojmenov´an´ı totiˇz m˚ uˇze automaticky tabulky propojovat a uˇsetˇrit tak v´yvoj´aˇre konstruov´an´ı sloˇzit´ych dotaz˚ u – ty sestavuj´ı metody tˇr´ıd vrstvy pro komunikaci s datab´az´ı Nette\Database [10].
4.1.3
Dynamika
Dnes je prakticky vylouˇceno, aby existovala netrivi´aln´ı webov´a aplikace, kter´a uˇzivateli nenab´ız´ı dynamiku v re´aln´em ˇcase, aplikace, kter´a mus´ı pro jakoukoliv modifikaci str´anky znovu naˇc´ıst kompletn´ı obsah. Do jist´e m´ıry si s urˇcitou podporou okamˇzit´e interakce mezi uˇzivatelem a prohl´ıˇzeˇcem porad´ı skriptovac´ı jazyk JavaScript, jenˇz umoˇznuje kontrolovat data ve formul´aˇri, zobrazovat jednoduch´a dialogov´a okna ˇci mˇenit vlastnosti prvk˚ u DOMu. Jeho interpretace se vˇsak v prohl´ıˇzeˇc´ıch mnohdy liˇs´ı a celkovˇe se jedn´a o nepˇr´ıliˇs uspoˇr´adan´y jazyk. Knihovna jQuery Zm´ınˇen´e neduhy JavaScriptu ˇc´asteˇcnˇe ˇreˇs´ı knihovna jQuery, kter´a v´yraznˇe zjednoduˇsuje proch´azen´ı DOM struktury, st´ır´a rozd´ıly mezi r˚ uzn´ymi interpretacemi jazyka jednotliv´ymi prohl´ıˇzeˇci a doplˇ nuje jej o spoustu uˇziteˇcn´ych funkc´ı, jako jsou animace, snadn´a manipulace s DOMem a v neposledn´ı ˇradˇe tak´e prov´adˇen´ı HTTP poˇzadavk˚ u technologi´ı AJAX. Pˇredevˇs´ım posledn´ı zm´ınˇen´y bod pˇredstavuje velk´y pˇr´ınos pˇri v´yvoji syst´emu Gadmin, jelikoˇz ten bude pro zmˇenu zobrazen´ı menu pouˇz´ıvat pr´avˇe pˇrenos dat na pozad´ı prohl´ıˇzeˇce, tedy zm´ınˇen´y AJAX. Knihovna jQuery UI Kapitola 3.3 uv´ad´ı, ˇze nov´y syst´em pouˇzije ovl´adac´ı prvky, kter´e HTML standardnˇe neposkytuje. S pomoc´ı jQuery by se tvorba takov´ych objekt˚ u oproti pouˇzit´ı samotn´eho JavaScriptu v´yraznˇe usnadnila, nicm´enˇe v´yvoj´aˇrsk´y t´ym t´eto knihovny vyvinul rozˇs´ıˇren´ı jQuery UI urˇcen´e pr´avˇe pro u ´ˇcely implemetace nov´ych prvk˚ u. Samo o sobˇe nav´ıc nab´ız´ı ˇsirokou ˇsk´alu element˚ u a rozˇs´ıˇren´e moˇznosti pro animov´an´ı ˇci zv´yˇsen´ı interakce [11]. Plugin dataTables Protoˇze bude syst´em vyuˇz´ıvat napˇr´ıˇc celou aplikac´ı zobrazen´ı informac´ı formou tabulky, uˇzivatel pravdˇepodobnˇe ocen´ı, kdyˇz mu program umoˇzn´ı takto prezentovan´a data ˇradit, filtrovat a bezesporu tak´e str´ankovat. Implementovat takovou funkcionalitu by bylo pomˇernˇe sloˇzit´e a pˇredevˇs´ım zbyteˇcn´e, protoˇze existuje spousta plugin˚ u, kter´e transformuj´ı standardn´ı HTML tabulku na vysoce interaktivn´ı prvek, jenˇz umoˇzn ˇ uje prohled´avat pˇres vybran´e sloupce a stejnˇe tak je i ˇradit. Plugin dataTables nab´ız´ı pr´avˇe tyto moˇznosti.
27
Implementace syst´emu Gadmin
Architektura syst´emu
Plugin powerTip Syst´em Gadmin je koncipov´an tak, aby s n´ım mohla pracovat i osoba, kter´a nebyla zauˇcena a nem´a s n´ım ˇz´adn´e zkuˇsenosti. Ve vˇetˇsinˇe pˇr´ıpad˚ u se ale nepodaˇr´ı designerovi uˇzivatelsk´eho rozhran´ı navrhnout aplikaci, v n´ıˇz m´a kaˇzd´y prvek na prvn´ı pohled zˇrejm´y v´yznam. Z toho d˚ uvodu b´yvaj´ı objekty uˇzivatelsk´eho rozhran´ı opatˇreny kontextovou n´apovˇedou. Webov´e prohl´ıˇzeˇce ji internˇe implementuj´ı pomoc´ı atributu title, jenˇz m˚ uˇze b´yt pˇriˇrazen jak´emukoliv HTML elementu [12]. Vzhled a zpoˇzdˇen´ı jej´ıho zobrazen´ı se vˇsak napˇr´ıˇc prohl´ıˇzeˇci odliˇsuj´ı, nav´ıc takto vytvoˇren´a kontextov´a n´apovˇeda nem˚ uˇze obsahovat text form´atovan´y pomoc´ı HTML, coˇz pˇri objasˇ nov´an´ı v´yznamu sloˇzitˇejˇs´ıho prvku mnohdy pˇredstavuje nedostatek. Plugin powerTip nab´ız´ı moˇznost urˇcit, jak´ym smˇerem m´a b´yt kontextov´a n´apovˇeda orientov´ana, po jak´e prodlevˇe se zobraz´ı a pˇredevˇs´ım umoˇzn ˇ uje vzhled boxu s textem (libovolnˇe form´atovan´ym pomoc´ı HTML) pˇrizp˚ usobit pomoc´ı kask´adov´ych styl˚ u.
4.1.4
Uˇ zivatelsk´ e rozhran´ı
U webov´ych aplikac´ı neexistuje pˇr´ıliˇs mnoho prostˇredk˚ u, jak definovat jejich vzhled. Urˇcitou podporu sice nab´ız´ı samotn´e HTML, avˇsak jeho moˇznosti jsou znaˇcnˇe omezen´e – umoˇzn ˇ uje zmˇenit ˇrez p´ısma, barvu, rozmˇery obr´azku apod. Vesmˇes tyto vlastnosti funguj´ı jako form´atov´an´ı podobn´e tomu, se kter´ym se bˇeˇzn´y uˇzivatel setk´av´a u textov´ych editor˚ u. I kdyby si v´yvoj´aˇr vystaˇcil s uveden´ymi moˇznostmi, musel by form´at definovat pro kaˇzd´y prvek dokumentu. Pr´avˇe pro takov´e u ´ˇcely vznikly kask´adov´e styly (CSS) – jazyk pro popis zp˚ usobu zobrazen´ı HTML dokument˚ u. Nejenˇze d´avaj´ı v´yvoj´aˇri stejn´e moˇznosti form´atov´an´ı jako HTML, ale rozˇsiˇruj´ı je o spoustu dalˇs´ıch, jako jsou napˇr. definice pozicov´an´ı, r´ameˇck˚ u, pozad´ı a od verze 3 novˇe tak´e pr˚ uhlednosti prvk˚ u, st´ın˚ u, animovan´ych pˇrechod˚ u apod. Syst´em Gadmin tedy vyuˇzije pro stylov´an´ı uˇzivatelsk´eho rozhran´ı kask´adov´e styly CSS3 a potˇrebn´e obrazov´e soubory pro realizaci ikon ˇci pozad´ı ve form´atu PNG nebo GIF, jimiˇz je grafika webov´ych aplikac´ı obvykle doplˇ nov´ana.
4.2 4.2.1
Architektura syst´ emu Adres´ aˇ rov´ a struktura Nette, resp. aplikace
Nette na sv´ych ofici´aln´ıch str´ank´ach (nette.org) nab´ız´ı ke staˇzen´ı tzv. sandbox. Jedn´a se o pˇredpˇripravenou adres´aˇrovou strukturu projektu vytvoˇren´eho v tomto frameworku. Z´aroveˇ n tak tato hierarchie sloˇzek pˇredstavuje koneˇcnou podobu organizace zdrojov´ych soubor˚ u syst´emu Gadmin (viz obr. 4.1).
28
Implementace syst´emu Gadmin
Architektura syst´emu
app ........................veškeré PHP skripty a třídy config .............konfigurace frameworku, definice služeb a připojení k databázi model .............třídy pro komunikaci s databází a třídy mapující entity databáze entity......třídy mapující databázové entity na objekty static ......pomocné statické třídy presenters.......třídy presenterů router.............třídy pro překlad akcí presenterů na URL templates .......Latte šablony jednotlivých menu libs.........................knihovny používané frameworkem, v této verzi systému pouze Nette log .........................adresář pro zaznamenávání chyb v produkčním módu temp ......................adresář pro cache vytvářené frameworkem www ......................adresář se soubory přístupnými prostřednictvím prohlížeče a index.php css ..................soubory kaskádových stylů images............soubory a adresáře s obrazovými soubory js ....................podpůrné JavasScriptové soubory, např. jQuery plugins....pluginy pro jazyk JavaScript modules ..JavaScriptová podpora pro moduly systému
Obr´azek 4.1: Adres´aˇrov´a struktura frameworku Nette, resp. syst´emu Gadmin (ˇcern´e sloˇzky patˇr´ı do sandboxu, ˇsed´e byly doplnˇeny v r´amci aplikace)
4.2.2
MVC a MVP vzor
V´yrazy MVC (Model-View-Controller) i MVP (Model-View-Presenter) oznaˇcuj´ı softwarovˇe-architektonick´e vzory, jejichˇz hlavn´ım c´ılem je oddˇelit od sebe tˇri z´akladn´ı vrstvy aplikace s uˇzivatelsk´ym rozhran´ım, a to sice vrstvu aplikaˇcn´ı logiky (model), zobrazen´ı dat (view, pohled) a ˇr´ızen´ı (controller, ovladaˇc), resp. prezentace dat (presenter) [13]. Hlavn´ı rozd´ıl mezi tˇemito dvˇema pojmy tvoˇr´ı vztahy jednotliv´ych vrstev. Zat´ımco v pˇr´ıpadˇe MVC vyvol´av´a uˇzivatel zmˇenu pomoc´ı ovladaˇce a v´ysledek mu pohled pouze zobrazuje, u MVP vzoru prob´ıh´a veˇsker´a interakce v´yhradnˇe prostˇrednictv´ım pohledu [14]. V MVP vzoru tedy plnou kontrolu nad bˇehem aplikace z´ısk´av´a presenter, kter´y rozhoduje o tom, jak´y pohled m´a b´yt pro zobrazen´ı pouˇzit a souˇcasnˇe reaguje na akce vyvolan´e uˇzivatelem, kter´e mu pohled pˇred´av´a. Rozd´ıly ilustruj´ı obr´azky 4.2 a 4.3. Pˇr´ıkladem funkce MVP m˚ uˇze b´yt situace, kdy uˇzivatel v aktu´aln´ım pohledu odeˇsle formul´aˇr. Pohled vyvol´a v presenteru poˇzadovanou akci, v jej´ımˇz r´amci se provede napˇr. validace formul´aˇre, a n´aslednˇe data odeˇsle do modelu, kter´y je pomoc´ı datab´azov´eho dotazu uchov´a. At’ uˇz se jedn´a o MVP ˇci MVC vzor, v obou pˇr´ıpadech je organizace zdrojov´ych text˚ u cel´eho programu mnohem pˇrehlednˇejˇs´ı a pozdˇejˇs´ı pˇr´ıpadn´e u ´ pravy lze mnohem snadnˇeji realizovat.
29
Implementace syst´emu Gadmin
Architektura syst´emu
pohled
model
pohled
model
view
view
controller
ovladač
presenter
Obr´azek 4.2: Diagram MVC vzoru
Obr´azek 4.3: Diagram MVP vzoru
4.2.3
Detailn´ı model syst´ emu Gadmin
Samotn´y MVP vzor pˇredstavuje pouze povrchn´ı reprezentaci skuteˇcn´e struktury syst´emu. Framework Nette spoleˇcnˇe s n´avrhem Gadminu dekomponuje vrstvu modelu na tˇri samostatn´e jednotky, viz obr´azek 4.4. Repozit´ aˇ re Repozit´aˇr funguje jako sluˇzba pro presenter, poskytuje mu metody k z´ısk´av´an´ı informac´ı z datab´aze, aniˇz by s´am musel zn´at n´azvy tabulek nebo sloupc˚ u. V kaˇzd´em cyklu aplikace, tj. pˇri obsluze ud´alosti vyvolan´e uˇzivatelem, se vytv´aˇr´ı jedin´a instance potˇrebn´ych repozit´aˇr˚ u, kter´a je pˇr´ıstupn´a pr´avˇe presenteru. Ten m˚ uˇze se z´ıskan´ym v´ysledkem manipulovat nebo jej pˇredat zvolen´emu pohledu, resp. Latte ˇsablonˇe. Sluˇzby repozit´aˇr˚ u jsou v Nette frameworku definov´any pomoc´ı konfiguraˇcn´ıho souboru (kapitola 4.2.6). Entity Vrstva entit shlukuje tˇr´ıdy, jejichˇz instance reprezentuj´ı datab´azov´e entity, se kter´ymi syst´em v dan´em cyklu pracuje. I tyto instance mohou komunikovat s datab´az´ı, dˇeje se tak napˇr´ıklad ve chv´ıli, kdy chce uˇzivatel zjistit, jak´y typ balen´ı z´akazn´ık vyˇzaduje. Protoˇze se jedn´a o konkr´etn´ı osobu, nevyˇzaduje presenter data od repozit´aˇre, n´ybrˇz pˇr´ımo od instance tˇr´ıdy Customer (z´akazn´ık). Vol´an´ım getteru $packing = $customer->getPacking(); tak pˇr´ımo z´ısk´a instanci tˇr´ıdy Packing. Na pozad´ı t´eto metody je odesl´an dotaz do datab´aze vyˇzaduj´ıc´ı vr´acen´ı takov´eho typu balen´ı, jehoˇz ID uv´ad´ı instance z´akazn´ıka. Rozd´ıl mezi entitou a repozit´aˇrem lze tak´e ch´apat na z´akladˇe vztah˚ u mezi daty. Pokud v´yvoj´aˇr poˇzaduje objekty, kter´e jsou nˇejak´ym zp˚ usobem z´avisl´e na jin´ych (v´yˇse zm´ınˇen´y pˇr´ıpad), vyuˇzije vol´an´ı jejich getter˚ u.
30
Implementace syst´emu Gadmin
Architektura syst´emu
Naproti tomu ve chv´ıli, kdy potˇrebuje obdrˇzet prvky, kter´e nejsou nijak z´avisl´e na jin´ych, m´a k dispozici repozit´aˇr (napˇr. v´ybˇer vˇsech z´akazn´ık˚ u). Z pˇr´ıkladu a z obr´azku 4.4 plyne, ˇze pˇr´ıstup k datab´azi maj´ı jak tˇr´ıdy z vrstvy entit, tak i repozit´aˇre a ˇze presenter m˚ uˇze pracovat s obˇema tˇemito vrstvami.
uživatel
webový prohlížeč view
Latte šablona presenter
presenter
repozitáře (repositories) entity
model
Nette\Database\Connection
databáze Obr´azek 4.4: Detailn´ı diagram struktury syst´emu
4.2.4
Presentery
Pˇredchoz´ı text jiˇz nˇekolikr´at zmiˇ noval, ˇze presenter slouˇz´ı pˇredevˇs´ım k pˇred´av´an´ı dat uˇzivateli v lidsk´e podobˇe. Obstar´av´a prostˇrednictv´ım repozit´aˇr˚ u a entit potˇrebn´e informace z datab´aze, n´aslednˇe je zpracov´av´a a ve v´ysledku vkl´ad´a do pohledu. Kaˇzd´y presenter pˇri obsluze ud´alosti vyvolan´e uˇzivatelem prov´ad´ı sv˚ uj tzv. ˇzivotn´ı cyklus, jehoˇz podobu ilustruje obr´azek 4.5. V´ıce informac´ı o presenterech nab´ız´ı ofici´aln´ı dokumentace frameworku [16].
31
Implementace syst´emu Gadmin
Architektura syst´emu
startup action
přesměrování vrácení výsledku AJAX požadavku
beforeRender render
renderování šablony
shutdown
ˇ Obr´azek 4.5: Zivotn´ ı cyklus presenteru ve frameworku Nette [16] ˇ Zivotn´ ı cyklus presenteru 1. startup – inicializuje promˇenn´e a pˇr´ıpadnˇe pomoc´ı ACL ovˇeˇruje, zda m˚ uˇze uˇzivatel k presenteru pˇristupovat. 2. action
4.2.5
Pohledy
Pohled pˇred´av´a pomoc´ı Latte ˇsablony data z´ıskan´a z presenteru prohl´ıˇzeˇci, jenˇz je zobraz´ı uˇzivateli. Z toho plyne, ˇze se mus´ı jednat o HTML dokument, do nˇehoˇz jsou jen dosazeny vyˇzadovan´e informace. Aby Nette psan´ı takov´ych ˇsablon zjednoduˇsilo, implementuje ˇsablonovac´ı jazyk Latte. Pokud v´yvoj´aˇr uloˇz´ı standardn´ı HTML dokument jako ˇsablonu (tedy 32
Implementace syst´emu Gadmin
Architektura syst´emu
s pˇr´ıponou .latte), m˚ uˇze mimo HTML tagy vyuˇz´ıvat tzv. maker, kter´a mu v´yraznˇe zjednoduˇs´ı v´ypis z´ıskan´ych dat. Pˇr´ıkladem m˚ uˇze b´yt skupina n-maker, jeˇz se chovaj´ı jako HTML atribut. Hlavn´ı rozd´ıl ale spoˇc´ıv´a v tom, ˇze jejich hodnota pˇri pˇrekladu ˇsablony rozhodne o tom, jak bude prvek, v nˇemˇz se nach´azej´ı, vypadat nebo zda se v˚ ubec ve v´ystupu objev´ı. Jedn´ım z tˇechto maker, kter´e syst´em Gadmin hojnˇe vyuˇz´ıv´a, je n:if. Jeho uplatnˇen´ı demonstruje n´asleduj´ıc´ı uk´azka. Tento u ´ sek k´odu vyp´ıˇse r´amec s kontaktn´ımi osobami z´akazn´ıka, ovˇsem jen tehdy, jedn´a-li o spoleˇcnost, nikoliv fyzickou osobu, tzn. isCompany vrac´ı hodnotu true. V opaˇcn´em pˇr´ıpadˇe vypust´ı cel´y prvek fieldset vˇcetnˇe jeho obsahu. Jinou uk´azkou pˇr´ıkaz˚ u Latte pˇredstavuj´ı standardn´ı makra. Ta se vˇzdy uzav´ıraj´ı do sloˇzen´ych z´avorek, pˇriˇcemˇz bezprostˇrednˇe za otev´ıraj´ıc´ı z´avorkou mus´ı n´asledovat text pˇr´ıkazu, jinak se sloˇzen´a z´avorka vyhodnot´ı jako obyˇcejn´y znak. ˇ Sablony syst´emu Gadmin velmi ˇcasto vyuˇz´ıvaj´ı makro foreach, jehoˇz pouˇzit´ı je n´asleduj´ıc´ı: <select name='packing'> {foreach $packings as $packing} {/foreach} kde $packings reprezentuje pole instanc´ı tˇr´ıdy Packing (typ balen´ı). Pˇr´ıkaz foreach pˇres nˇej tedy iteruje a pro kaˇzd´y prvek vygeneruje poloˇzku rozev´ırac´ıho seznamu. Uk´azka tak´e zobrazuje zp˚ usob v´ypisu promˇenn´e nebo hodnoty vr´acen´e volanou metodou, a sice {$nazev promenne} nebo {volana funkce()}. Nespornou v´yhodou Latte pˇri v´ypisu promˇenn´ych jsou tzv. helpery, metody, kter´e promˇennou zform´atuj´ı a teprve pot´e pˇredaj´ı k v´ypisu. Aˇckoliv Nette standardnˇe nab´ız´ı pomˇernˇe ˇsirokou ˇsk´alu helper˚ u (napˇr. date pro form´atov´an´ı data, truncate pro zkr´acen´ı vypisovan´eho ˇretˇezce a jin´e), v´yvoj´aˇr m˚ uˇze definovat dalˇs´ı. Jejich pouˇzit´ı vypad´a takto: vytvoˇ reno dne: {$datum|date, 'd.m.Y'}
33
Implementace syst´emu Gadmin
Architektura syst´emu
Pˇr´ıklad oˇcek´av´a, ˇze promˇenn´a $datum pˇredstavuje instanci tˇr´ıdy DateTime. Znak svisl´e ˇc´ary pak pˇri pˇrekladu upozorˇ nuje, ˇze na ni m´a b´yt nejdˇr´ıve aplikov´an helper, ˇ zde konkr´etnˇe date. Retezec uveden´y za ˇc´arkou slouˇz´ı jako dalˇs´ı parametr pro helper, v pˇr´ıpadˇe data se jedn´a o jeho form´atov´an´ı (dle konvenc´ı PHP). Gadmin implementuje vlastn´ı form´atov´an´ı data dateLoc, ceny price nebo telefonu phone – veˇsker´e dodateˇcn´e helpery obsahuje statick´a tˇr´ıda Helper. Dalˇs´ı informace o ˇsablon´ach pohled˚ u, makrech a helperech uv´ad´ı ofici´aln´ı dokumentace [17].
4.2.6
Konfigurace frameworku
Pˇri prvn´ım spuˇstˇen´ım sandboxu Nette automaticky otestuje, zda bˇehov´e prostˇred´ı splˇ nuje minim´aln´ı poˇzadavky (zejm´ena PHP verze 5.2.0 a vyˇsˇs´ı). Ale pˇredt´ım, neˇz je moˇzn´e s frameworkem Nette v˚ ubec zaˇc´ıt pracovat, mus´ı v´yvoj´aˇr definovat jeho d˚ uleˇzit´a nastaven´ı. S´am sandbox jiˇz obsahuje urˇcitou konfiguraci, s n´ıˇz je moˇzn´e jej spustit, takov´a ale pochopitelnˇe neodpov´ıd´a poˇzadavk˚ um syst´emu Gadmin. Soubor /app/config/config.neon Prakticky veˇsker´a konfigurace frameworku se nach´az´ı v souboru config.neon, jenˇz dodrˇzuje NEON syntaxi. Ta je svou stavbou velmi bl´ızk´a form´atu YAML, kter´y data zapisuje v podobˇe ˇciteln´e jak pro ˇclovˇeka, tak i pro poˇc´ıtaˇc. Mimo nastaven´ı ˇcasov´eho p´asma, expirace z´aznam˚ u o sezen´ı a v´ychoz´ıho presenteru pro zobrazen´ı chyby, definuje parametry pˇripojen´ı k datab´azi, kter´e je potˇreba pˇred spuˇstˇen´ım aplikace Gadmin spr´avnˇe uv´est. V pˇr´ıpadˇe lok´aln´ıho serveru mohou vypadat napˇr´ıklad takto1 : dsn: 'mysql:host=localhost;dbname=gadmin' user: 'root' password: Dalˇs´ı d˚ uleˇzitou souˇc´ast konfiguraˇcn´ıho souboru pˇredstavuje nastaven´ı a definice sluˇzeb, o nichˇz se text zmiˇ noval jiˇz v souvislosti s presentery. Jako sluˇzby registruje konfiguraˇcn´ı soubor jednotliv´e repozit´aˇre, takˇze jsou pak dostupn´e pro presenter. Novou sluˇzbu lze vytvoˇrit n´asledovnˇe: services: nazevSluzby: nazevRepozitare Kter´ykoliv presenter pak m˚ uˇze k metod´am tˇr´ıdy nazevRepozitare pˇristupovat direktivou $this->context->nazevSluzby. V´yznam repozit´aˇr˚ u a sluˇzeb pˇribliˇzovala kapitola 4.2.3. 1
U lok´aln´ıho serveru nen´ı potˇreba pˇred´ avat datab´azov´emu spojen´ı heslo.
34
Implementace syst´emu Gadmin
Architektura syst´emu
Soubor /app/router/RouterFactory.php Tˇr´ıda RouterFactory slouˇz´ı k pˇrekladu akc´ı presenter˚ u na URL dodrˇzuj´ıc´ı SEO principy pro pˇrizp˚ usoben´ı str´anek internetov´ym vyhled´avaˇc˚ um. Takov´a optimalizace aplikace ale v pˇr´ıpadˇe Gadminu nehraje v˚ ubec roli, jednak protoˇze syst´em nen´ı veˇrejnˇe dostupn´y a za druh´e se jeho veˇsker´y obsah pokaˇzd´e naˇcte technologi´ı AJAX, tedy URL nebude viditeln´a. Nicm´enˇe RouterFactory ukr´yv´a jin´e, podstatn´e nastaven´ı, a to sice definici v´ychoz´ıho presenteru, v pˇr´ıpadˇe syst´emu tedy menu, kter´e bude zobrazeno pˇri spuˇstˇen´ı aplikace (pokud bude uˇzivatel u ´ spˇeˇsnˇe autentizov´an). N´asleduj´ıc´ı pˇr´ıkazy uv´ad´ı zp˚ usob, jak´ym se standardn´ı presenter ve tˇr´ıdˇe RouterFactory urˇc´ı. public function createRouter() { $router = new RouteList(); $router[] = new Route('<presenter>/
4.2.7
Datab´ aze
N´avrh podoby datab´aze syst´emu Gadmin vych´azel z diagramu funkˇcn´ıch celk˚ u aplikace (pˇr´ıloha A), jenˇz detailnˇe popisuje pˇr´ıpady uˇzit´ı a moˇznosti jednotliv´ych modul˚ u. Pˇri sestavov´an´ı ERA modelu byla obzvl´aˇst’ vˇenov´ana pozornost uchov´av´an´ı tras distributor˚ u a jednotliv´ych objedn´avek. Datab´aze p˚ uvodn´ıho syst´emu nesplˇ novala ani podm´ınky I. norm´aln´ı formy, protoˇze trasa ˇridiˇce nebyla ukl´ad´ana atomicky [1] (viz kapitola 2.1.5). Nov´y n´avrh tedy data maxim´alnˇe dekomponuje, tak aby byly z´aznamy atomick´e a splˇ novaly 3 III. norm´aln´ı formu. Jeho kompletn´ı podobu ilustruje pˇr´ıloha B. Realizace datab´aze vyˇzadovala pouˇzit´ı pohledu4 , customerNotInRoute, jenˇz specifikuje z´akazn´ıky, kteˇr´ı se nenach´azej´ı na ˇz´adn´e z tras. Pohled tvoˇr´ı sice pomˇernˇe jednoduch´y dotaz, ale nelze jej realizovat v Nette frameworku podobn´ym zp˚ usobem jako ostatn´ı. Pohled tvoˇr´ı n´asleduj´ıc´ı pˇr´ıkaz: 2 Nette\Application\Routers\Route je tˇr´ıda frameworku Nette a nem´ a nic spoleˇcn´eho s tˇr´ıdou Gadmin\RouteItem, kter´ a reprezentuje poloˇzku trasy distributora. 3 Pˇr´ıloha B popisuje pouze tu ˇca´st datab´aze, kter´ a je souˇca´st´ı bakal´aˇrsk´e pr´ace. Nezobrazuje tedy tabulky pro moduly Finance, Nastaven´ı apod. 4 Nejedn´a se o pohled, kter´ y zmiˇ novaly kapitoly zab´ yvaj´ıc´ı se MVC vzorem, n´ ybrˇz o datab´ azov´ y objekt podobn´ y tabulce.
35
Implementace syst´emu Gadmin
Popis obecn´e funkcionality
SELECT customer.* FROM customer LEFT JOIN routeItem ON routeItem.customer_id = customer.customer_id WHERE routeItem.position IS NULL ORDER BY CONCAT(customer.surname, customer.name) Nalezne tedy takov´e z´akazn´ıky, pro nˇeˇz neexistuje z´aznam v tabulce routeItem (pˇripojen´y sloupec routeItem.position je nulov´y), a seˇrad´ı je dle jm´ena a pˇr´ıjmen´ı. Dotaz u ´ myslnˇe vyuˇz´ıv´a MySQL funkci CONCAT, jeˇz spojuje dva a v´ıce ˇretˇezc˚ u. Sloupec customer.surname je u firemn´ıch z´akazn´ık˚ u totiˇz nulov´y, takˇze zm´ınˇen´a funkce vr´at´ı pouze hodnotu customer.name, ˇc´ımˇz se doc´ıl´ı spr´avn´eho abecedn´ıho seˇrazen´ı jak firemn´ıch z´akazn´ık˚ u, tak i jednotlivc˚ u.
4.3
Popis obecn´ e funkcionality
4.3.1
Navigace a AJAX
Modern´ı webov´e aplikace naˇc´ıtaj´ı t´emˇeˇr veˇsker´y sv˚ uj obsah technologi´ı AJAX. Pomoc´ı JavaScriptu vyˇslou poˇzadavek na server, ten jej zpracuje (zpravidla z´ısk´a informace z datab´aze) a odpovˇed’ zaˇsle zpˇet. Obsluˇzn´a metoda na stranˇe klienta, tzv. callback, obdrˇz´ı objekt s odpovˇed´ı a m˚ uˇze na nˇej adekv´atnˇe reagovat napˇr. zmˇenou prvku HTML dokumentu [18], viz obr´azek 4.6. Cel´y proces tedy prob´ıh´a na pozad´ı, aniˇz by uˇzivatel tuˇsil, ˇze se nˇejak´a data pˇren´aˇsej´ı.
databáze
uživatel interakce
webový layout
SQL dotaz
data změna layoutu
callback
AJAX mechanismus
volání JS klient
data
server HTTP požadavek server
Obr´azek 4.6: Sch´ema zpracov´an´ı HTTP poˇzadavku pomoc´ı AJAXu D˚ uvod˚ u, proˇc se AJAX tak hojnˇe vyuˇz´ıv´a, je hned nˇekolik. Pˇri pˇrechodu uˇzivatele na jinou str´anku, resp. modul nebo jeho menu, nen´ı nutn´e naˇc´ıst cel´y nov´y dokument, n´ybrˇz jen jeho vybran´e ˇc´asti. Celkovˇe se tak zrychl´ı pr´ace s aplikac´ı a jej´ı chov´an´ı se pˇribl´ıˇz´ı standardn´ımu desktopov´emu softwaru. S uˇzit´ım AJAXu lze rovnˇeˇz plnˇe pˇrevz´ıt kontrolu nad pohybem uˇzivatele v syst´emu, nab´ıdnout mu modifikovanou historii a zastavit jej ve chv´ıli, kdy by 36
Implementace syst´emu Gadmin
Popis obecn´e funkcionality
mohl pˇrechodem na jinou str´anku ztratit data. V´yhoda u ´ pravy seznamu historie spoˇc´ıv´a ve vypuˇstˇen´ı tˇech URL, kter´e slouˇzily pro odesl´an´ı formul´aˇre, zamez´ı se tedy v´yskytu dialogov´eho okna Odeslat znovu formul´aˇr?“, jeˇz se zobrazuje pˇri ” n´avratu na str´anku s formul´aˇrem. Gadmin odes´ıl´a veˇsker´e takov´e poˇzadavky s vyuˇzit´ım funkce ajax implementovan´e knihovnou jQuery. Pˇr´ısluˇsn´e obsluˇzn´e funkce, at’ uˇz pro ozn´amen´ı chyby, automatick´eho odhl´aˇsen´ı ˇci standardn´ı zpracov´an´ı odpovˇedi, poskytuje objekt Ajax (Ajax.js). Vol´an´ı funkce ajax pro ud´alost kliknut´ı (click) hypertextov´ych odkaz˚ u (kter´e nejsou oznaˇceny tˇr´ıdou notAjaxize – nezajaxovat“) vypad´a n´asle” dovnˇe: function(event) { ... event.preventDefault(); ... $.ajax(this.href, { cache: false, dataType: 'json', isBack: false, isForm: false, success: Ajax._success, beforeSend: Ajax._beforeSend, error: Ajax._error }); } kde event pˇredstavuje objekt ud´alosti klepnut´ı a identifik´ator this referenci na odkaz, kter´y akci inicializoval. Vol´an´ı pˇr´ıkazu preventDefault umoˇznuje zablokovat obvykl´e chov´an´ı pˇri t´eto ud´alosti, v pˇr´ıpadˇe hypertextov´eho odkazu tedy pˇrechod na poˇzadovanou str´anku. Z pˇr´ıkladu je patrn´e, ˇze funkci ajax se pˇred´avaj´ı dva parametry, a sice c´ılov´a URL (hodnota atributu href) a JSON objekt s konfigurac´ı (detaily uv´ad´ı specifikace [19]). Vlastnosti isBack a isForm nejsou standardn´ı souˇc´ast´ı konfigurace, jedn´a se o pˇridan´e atributy definuj´ıc´ı, jak´eho typu poˇzadavek je – zda uˇzivatel odes´ıl´a formul´aˇr nebo se vrac´ı o krok zpˇet v historii. Pokud jsou oba nepravdiv´e, zaˇrad´ı objekt Ajax tento poˇzadavek do z´asobn´ıku historie proch´azen´ı. Atributy success, beforeSend, error urˇcuj´ı, jak se m´a aplikace zachovat pˇri kl´ıˇcov´ych ud´alostech zpracov´av´an´ı AJAX poˇzadavku. Za obzvl´aˇst’ podstatn´y lze povaˇzovat success, jenˇz aplikace vol´a v okamˇziku, kdy dojde k u ´ spˇeˇsn´emu z´ısk´an´ı odpovˇedi od serveru. AJAX mechanismus t´eto funkci jako argument pˇred´av´a objekt, kter´y vr´atil server.
37
Implementace syst´emu Gadmin
Popis obecn´e funkcionality
Snippety Pouˇzit´ı frameworku Nette v´yraznˇe zjednoduˇsuje proces ajaxifikace cel´eho syst´emu. Nab´ız´ı totiˇz Latte makro {snippet}, jeˇz umoˇznuje oznaˇcit a pojmenovat u ´ sek HTML dokumentu, potaˇzmo Latte ˇsablony, naz´yvan´y snippet (v´ystˇriˇzek). Pokud je pak proveden poˇzadavek na akci presenteru, jej´ıˇz v´ysledn´y pohled obsahuje snippety, jejich obsah dosad´ı presenter do objektu odpovˇedi serveru. Callback funkce poˇzadavku pak nahrad´ı st´avaj´ıc´ı obsah snippetu t´ım, jejˇz z´ısk´a v objektu odpovˇedi. Proces ilustruje obr´azek 4.7. V´yvoj´aˇr m˚ uˇze stanovit, kter´e snippety vyˇzaduj´ı zmˇenu sv´eho obsahu, a to tzv. invalidac´ı, tedy oznaˇcen´ım snippetu jako neplatn´eho. Takov´y presenter pak zahrne do odpovˇedi odes´ılan´e v r´amci AJAX poˇzadavku [20].
uživatel
vygenerovaný pohled #2
interakce
#1
#3 volání JS
aktuální pohled
odpověď serveru
AJAX
#2
nahrazení obsahu snippetu #3
požadavek na presenter
#1
#3
životní cyklus presenteru
presenter zvolené menu mění obsah snippetu #3, ten jediný bude zahrnut do odpovědi serveru
Obr´azek 4.7: Proces v´ymˇeny obsahu snippetu pomoc´ı AJAXu
4.3.2
Autentizace a autorizace
V´yznamem tˇechto dvou pojm˚ u a rozd´ıly mezi nimi se podrobnˇeji zab´yv´a kapitola 3.1.4. Aby mohl b´yt uˇzivatel autorizov´an pro akce jednotliv´ych modul˚ u, mus´ı nejdˇr´ıve proj´ıt autentizac´ı. Ta v syst´emu Gadmin prob´ıh´a ihned pˇri jeho spuˇstˇen´ı. Kaˇzd´a osoba opr´avnˇen´a aplikaci pouˇz´ıvat disponuje vlastn´ım uˇzivatelsk´ym jm´enem o maxim´aln´ı d´elce deseti znak˚ u a heslem, jeˇz zad´av´a k ovˇeˇren´ı sv´e totoˇznosti. Prohl´ıˇzeˇc m˚ uˇze uˇzivatele z bezpeˇcnostn´ıch d˚ uvod˚ u automaticky odhl´asit pˇri dlouhodob´e neˇcinnosti. Protoˇze se tak ale m˚ uˇze st´at napˇr´ıklad pˇri zan´aˇsen´ı poˇctu pokrm˚ u do syst´emu, tedy pˇri pouˇz´ıv´an´ı editoru objedn´avek, kter´y plnˇe vyuˇz´ıv´a AJAXu, nab´ız´ı aplikace moˇznost obnoven´ı pˇrihl´aˇsen´ı bez nutnosti opˇetovn´eho naˇcten´ı cel´e str´anky. Ve chv´ıli, kdy vyprˇs´ı platnost sezen´ı a obsluha programu vyvol´a poˇzadavek odeslan´y AJAXem, ovˇeˇr´ı presenter, zda je uˇzivatel pˇrihl´aˇsen, a pokud ne, odeˇsle v odpovˇedi tak´e informaci o tom, ˇze doˇslo k automatick´emu odhl´aˇsen´ı. Callback funkce na to zareaguje zobrazen´ım dialogov´eho okna, kter´e umoˇzn ˇ uje sezen´ı obnovit. Jakmile uˇzivatel vstoup´ı do syst´emu, mus´ı se pˇri kaˇzd´e jeho akci ovˇeˇrit, zda m´a pr´avo ji prov´est. M˚ uˇze se jednat o pouh´y pˇresun do jin´eho menu, ale tak´e o edi38
Implementace syst´emu Gadmin
Funkˇcn´ı moduly
taci informac´ı apod. Pro tyto u ´ˇcely slouˇz´ı tzv. ACL, seznam opr´avnˇen´ı pˇr´ıstupu. Pomoc´ı ACL v´yvoj´aˇr specifikuje uˇzivatelsk´e role, kter´e rozliˇsuj´ı pˇristupuj´ıc´ı osoby (napˇr. ˇridiˇc, distributor, host), zdroje, jeˇz oznaˇcuj´ı objekty, u nichˇz je pˇr´ıstup ovˇeˇrov´an (v pˇr´ıpadˇe Nette frameworku se jedn´a o presentery), a opr´avnˇen´ı, kter´a definuj´ı akce zdroje, k nimˇz uˇzivatele dan´a role opravˇ nuje.
Gadmin v r´amci bakal´aˇrsk´e pr´ace pracuje pouze s jedinou uˇzivatelskou rol´ı (root), jeˇz m´a opr´avnˇen´ı ke vˇsem akc´ım. V budoucnu ovˇsem vzniknou tak´e role driver pro umoˇznˇen´ı omezen´eho pˇr´ıstupu ˇridiˇc˚ um a guest slouˇz´ıc´ı pouze pro prohl´ıˇzen´ı, nikoliv modifikaci dat. Nette nab´ız´ı um´ıstˇen´ı definice ACL do konfiguraˇcn´ıho souboru (kapitola 4.2.6). V´ıce informac´ı o sestavov´an´ı statick´eho ACL v tomto frameworku uv´ad´ı ˇcl´anek [21].
4.4 4.4.1
Funkˇ cn´ı moduly Z´ akazn´ıci
Modul, kter´y pˇredstavuje z´akladn´ı stavebn´ı k´amen cel´eho syst´emu. Jedn´a se ou ´ plnou spr´avu z´akazn´ık˚ u, pˇriˇcemˇz kaˇzd´y z nich m´a svoji vlastn´ı kartu s kontakty, detaily odbˇeru a statistikami. Kontaktn´ı osoby Speci´aln´ım pˇr´an´ım zadavatele byla moˇznost rozˇsiˇrov´an´ı firemn´ıch z´akazn´ık˚ u o dodateˇcn´e kontakty. Spoleˇcnost totiˇz mnohdy uv´ad´ı sv´e ofici´aln´ı, glob´alnˇe pouˇz´ıvan´e telefonn´ı ˇc´ıslo, nicm´enˇe objedn´avky velmi ˇcasto vyˇrizuje konkr´etn´ı osoba s jin´ym kontaktem (telefonem, e-mailem). Kaˇzd´y z´akazn´ık typu spoleˇcnost je tedy rozˇs´ıˇren moˇznost´ı pˇridat kontaktn´ı osobu, pˇriˇcemˇz jejich celkov´y pˇrehled nab´ız´ı pˇr´ımo karta z´akazn´ıka. Odsud lze tak´e kontakty odeb´ırat. Odstranˇ en´ı z´ akazn´ıka Nov´y syst´em na rozd´ıl od pˇredchoz´ıho uchov´av´a veˇsker´a data neomezenˇe. Pokud tedy existuj´ı rok star´e objedn´avky, mus´ı b´yt st´ale propojeny se z´akazn´ıkem, kter´y byl tehdy jejich p˚ uvodcem. Pokud by Gadmin spol´ehal pouze na referenˇcn´ı integritu zmiˇ novanou v kapitole 4.1.2, nemohl by uˇzivatel odstraˇ novat z´akazn´ıky, kteˇr´ı maj´ı jednu a v´ıce objedn´avek. Ve vˇetˇsinˇe pˇr´ıpad˚ u ale administrativn´ıho pracovn´ıka stravovny nevede nic k tomu, aby uchov´aval osoby, jeˇz si kdysi objednaly jedin´y obˇed. 39
Implementace syst´emu Gadmin
Funkˇcn´ı moduly
Proto je obsluze aplikace sice nab´ıdnuta moˇznost odstranit z´akazn´ıka, ale skr´yv´a se pod n´ı v´ıce neˇz hrub´e smaz´an´ı odpov´ıdaj´ıc´ı poloˇzky v datab´azi. Pˇri tomto poˇzadavku vykon´av´a program n´asleduj´ıc´ı pˇr´ıkazy: try { $res = $customer->getRow()->delete(); ... } catch(\PDOException $e) { ... $customer->getRouteItem()->getRow()->delete(); $this->update($customer); ... } Syst´em se pokus´ı z´aznam skuteˇcnˇe odstranit a v pˇr´ıpadˇe, ˇze dotyˇcn´y z´akazn´ık nen´ı nijak v´az´an na jin´a data, se mu to tak´e podaˇr´ı. V opaˇcn´e situaci, tj. pˇri naruˇsen´ı referenˇcn´ı integrity (detekov´ano vznikem v´yjimky PDOException), z˚ ustane poloˇzka zachov´ana, pouze se zmˇen´ı hodnota sloupce is visible, jenˇz informuje o tom, ˇze z´akazn´ık m´a b´yt skryt. Pˇ reddefinovan´ e ceny Syst´em Gadmin pracuje s tˇr´ı´ urovˇ nov´ym stanovov´an´ım cen, o kter´em se text zmiˇ noval jiˇz v kapitole 3.2.4, coˇz s sebou pˇrin´aˇs´ı oproti p˚ uvodn´ı aplikaci sloˇzitˇejˇs´ı v´ypoˇcet ceny objedn´avky. Uˇzivatel m˚ uˇze na kartˇe z´akazn´ıka urˇcit, jak´a ˇc´astka mu m´a b´yt prim´arnˇe u ´ˇctov´ana za pol´evky a za hlavn´ı pokrmy. Zp˚ usob, jak´ym se urˇcuje cena objedn´avky (kterou m˚ uˇze obsluha ve v´ysledku tak´e zmˇenit), uv´ad´ı obr´azek 4.8.
4.4.2
Distribuce
Ve stravovac´ım zaˇr´ızen´ı existuje nˇekolik ˇridiˇc˚ u a kaˇzd´y z nich obsluhuje svoji vlastn´ı trasu. Mimo ˇridiˇce funguj´ı na u ´ zem´ı okresu tak´e v´ydejny, kter´e sice nab´ız´ı obˇedy i n´ahodn´ym kolemjdouc´ım, ale stejnˇe tak mohou v´est evidenci sv´ych z´akazn´ık˚ u. V´ydejny a ˇridiˇci se tedy v nov´em syst´emu souhrnˇe oznaˇcuj´ı jako distributoˇri. Propojen´ı s uˇ zivatelsk´ ym u ´ˇ ctem Doposud zad´avala do syst´emu nov´e objedn´avky pouze administrativn´ı pracovnice. Veden´ı stravovac´ıho zaˇr´ızen´ı vˇsak pl´anuje pˇresmˇerovat tuto ˇcinnost pˇr´ımo na ˇridiˇce a to tak, ˇze po dokonˇcen´ı obsluhy trasy a n´avratu do zaˇr´ızen´ı, zanesou do syst´emu nov´e objedn´avky od sv´ych“ z´akazn´ık˚ u sami. ”
40
Implementace syst´emu Gadmin
Funkˇcn´ı moduly
objednávka
Má již stanovenou cenu?
+
vrať cenu objednávky
-
Jedná se o polévku?
+
-
Má zákazník individ. cenu pro hlavní chody?
-
-
+ použij individ. cenu pokrmu
Má zákazník individ. cenu pro polévky? +
použij standard. cenu položky
použij individ. cenu polévky
přičti cenu balení vrať sumu
Obr´azek 4.8: V´yvojov´y diagram procesu urˇcov´an´ı ceny objedn´avky K tomu, aby mohli do syst´emu pˇristupovat, potˇrebuj´ı pˇrihlaˇsovac´ı u ´ daje, a tedy tak´e uˇzivatelskou roli, pod n´ıˇz budou v r´amci Gadminu vystupovat – driver. Po jejich pˇrihl´aˇsen´ı by vˇsak nebyl syst´em schopen urˇcit, kter´a z tras uˇzivateli patˇr´ı, protoˇze trasa se v´aˇze na objekt distributora, kter´y nem´a s uˇzivatelem nic spoleˇcn´eho. Pˇredchoz´ı odstavec tedy uv´ad´ı d˚ uvod pro vznik tzv. sp´arov´an´ı distributora a uˇzivatele. Osoba spojen´a s ˇridiˇcem m´a pak po pˇrihl´aˇsen´ı pˇr´ıstup v´yhradnˇe ke sv´e trase, nem˚ uˇze tak ovlivnit z´aznamy ostatn´ıch distributor˚ u. Editace trasy Syst´em Gadmin zachov´av´a stejnou koncepci editace trasy jako jeho pˇredchoz´ı verze, avˇsak snaˇz´ı se editor poloˇzek vylepˇsit, aby byla manipulace s jednotliv´ymi z´akazn´ıky pohodlnˇejˇs´ı a rychlejˇs´ı. Za t´ım u ´ˇcelem byly oba seznamy (obsluhovan´ych a nezaˇrazen´ych z´akazn´ık˚ u) rozˇs´ıˇreny o prvky pro rychl´e prohled´av´an´ı. Ty umoˇzn ˇ uj´ı uˇzivateli po zad´an´ı dvou a v´ıce znak˚ u filtrovat zobrazen´e poloˇzky, ˇc´ımˇz redukuj´ı rozs´ahl´y seznam (mnohdy aˇz se 100 z´akazn´ıky) na minimum. Editor ilustruje obr´azek 4.9.
41
Implementace syst´emu Gadmin
Funkˇcn´ı moduly
Obr´azek 4.9: Editor trasy distributora
4.4.3
Objedn´ avky
Modul Objedn´avky sluˇcuje dohromady dvˇe sluˇzby – vkl´ad´an´ı nov´ych objedn´avek, jejich editaci a souˇcasnˇe spr´avu poloˇzek pˇr´ıch´azej´ıc´ıch z e-shopu. Identifikace odesilatele pˇ r´ıchoz´ı objedn´ avky Aby syst´em Gadmin usnadnil uˇzivateli pr´aci s pˇr´ıchoz´ımi objedn´avky, pokouˇs´ı se automaticky detekovat z´akazn´ıka, kter´y objedn´avku odeslal. N´avˇstˇevn´ık e-shopu je povinen pˇri odes´ıl´an´ı vyplnit sv´e jm´eno, telefon a e-mail. Pr´avˇe posledn´ı dva zm´ınˇen´e u ´ daje mohou slouˇzit t´ emˇ eˇ r jako jedineˇcn´e identifik´atory. Nepˇredpokl´ad´a se totiˇz, ˇze v datab´azi existuje v´ıce z´akazn´ık˚ u se spoleˇcn´ym e-mailem. Pokud tedy aplikace nalezne z´aznam s odpov´ıdaj´ıc´ı e-mailovou adresou, navrhne obsluze jeho spojen´ı s objedn´avkou, viz obr´azek 4.10.
Obr´azek 4.10: Uk´azka detekce z´akazn´ıka
Pˇ rijet´ı pˇ r´ıchoz´ı objedn´ avky Ve chv´ıli, kdy je objedn´avka spojena se z´akazn´ıkem, m˚ uˇze ji uˇzivatel pˇresunout mezi ostatn´ı schv´alen´e objedn´avky. Pˇred potvrzen´ım lze nav´ıc vybran´e pˇr´ıchoz´ı 42
Implementace syst´emu Gadmin
Funkˇcn´ı moduly
poloˇzky odznaˇcit, a zamezit tak jejich pˇresunu. Funkce pˇrijet´ı m´a za c´ıl minimalizovat faktor lidsk´e chyby pˇri schvalov´an´ı objedn´avky. Doposud totiˇz mohla obsluha pˇren´est pˇr´ıchoz´ı poloˇzky pouze ruˇcnˇe, a to pˇrepisem u ´ daj˚ u z e-mailov´e zpr´avy do editoru objedn´avek. Nyn´ı staˇc´ı klepnut´ı na jedin´e tlaˇc´ıtko a aplikace vˇse provede sama. Editor objedn´ avek Jedn´a se o rozhran´ı slouˇz´ıc´ı k hromadn´e u ´ pravˇe objedn´avek v datab´azi nebo k jejich vloˇzen´ı. V p˚ uvodn´ı verzi syst´emu fungoval ˇcistˇe jen jako formul´aˇr pro zanesen´ı poˇctu pokrm˚ u, nyn´ı vˇsak novˇe poskytuje rozˇs´ıˇren´e sluˇzby. Z´ahlav´ı tabulky doplˇ nuje kontextov´a n´apovˇeda informuj´ıc´ı o n´azvu pokrmu, jenˇz bude ve vybran´y den pod´av´an jako pˇr´ısluˇsn´a poloˇzka j´ıdeln´ıho l´ıstku. Editor tak´e zamezuje zobrazov´an´ı pol´ı, pro nˇeˇz na dan´y den neexistuje z´aznam v j´ıdeln´ım l´ıstku. Dˇr´ıve se textov´e vstupy urˇcuj´ıc´ı poˇcet pokrm˚ u objevovaly i u pokrm˚ u, kter´e ve skuteˇcnosti jeˇstˇe neexistovaly – uˇzivatel tedy mohl vytvoˇrit nesmyslnou objedn´avku. Gadmin pracuje s tˇr´ı´ urovˇ novou definic´ı ceny objedn´avky, a proto mus´ı umoˇznit jej´ı zmˇenu u kaˇzd´e jednotliv´e poloˇzky. Nav´ıc na z´akladˇe poˇzadavku zadavatele poskytuje moˇznost specifikace balen´ı pˇr´ımo u objedn´avky, nikoliv pouze glob´alnˇe. K tˇemto u ´ˇcel˚ um je editor vybavem kontextov´ym menu (obr´azek 4.11), jeˇz lze vyvolat stiskem kl´avesy Ctrl nebo dvojklikem v aktivn´ım poli.
Obr´azek 4.11: Uk´azka kontextov´eho menu pole objedn´avky Protoˇze zad´av´an´ı objedn´avek pˇredstavuje pomˇernˇe ˇcasovˇe n´aroˇcnou ˇcinnost, vyˇzaduje se, aby bˇehem jej´ıho prov´adˇen´ı nemohlo doj´ıt ke ztr´atˇe dat. Z toho d˚ uvodu ukl´ad´a editor objedn´avek veˇsker´e zmˇeny okamˇzitˇe, tj. pˇri zmˇenˇe obsahu aktivn´ıho pole nebo nastaven´ı v kontextov´e nab´ıdce – v obou pˇr´ıpadech tedy ve chv´ıli, kdy je vyvol´ana ud´alost change. O u ´ spˇeˇsnosti ukl´ad´an´ı informuje uˇzivatele zbarven´ı pole do zelena, resp. do ˇcervena v pˇr´ıpadˇe chyby. 43
Implementace syst´emu Gadmin
Funkˇcn´ı moduly
V pˇredchoz´ı verzi syst´emu obsluze programu velmi znepˇr´ıjemˇ novalo zad´av´an´ı objedn´avek nepˇrirozen´e posouv´an´ı obsahu editoru. Pokud uˇzivatel pouˇz´ıval pro pohyb mezi textov´ymi vstupy kl´avesy, oˇcek´aval, ˇze aplikace sama potˇrebn´y obsah editoru odroluje. Ve chv´ıli, kdy ale bylo aktivn´ı pole skryto pod okrajem viditeln´e plochy, doˇslo k jeho zobrazen´ı aˇz po vloˇzen´ı ˇc´ıslice. Nejenˇze byl tedy aktivn´ı prvek po urˇcit´e dobˇe st´ale v doln´ım okraji rolovateln´e plochy, ale nav´ıc mohlo tak´e doj´ıt k jeho opoˇzdˇen´emu zobrazen´ı. Tento probl´em ˇreˇs´ı umˇel´e centrov´an´ı aktivn´ıho pole. Pˇri pˇrechodu na jin´y textov´y vstup se vˇzdy odroluje potˇrebn´a ˇc´ast obsahu editoru tak, aby novˇe se aktivovan´y prvek zobrazil na stˇredu plochy. V´ypoˇcet pozice lze prov´est dle n´asleduj´ıc´ıho vzorce (v´yznam potˇrebn´ych hodnot ilustruje obr´azek 4.12): t′s = ti − td + ts −
hc − hi 2
kde t′s je nov´a odrolovan´a v´yˇska, kter´a m´a b´yt kontejneru editoru nastavena, aby byl prvek vycentrov´an, rozd´ıl ti a td pˇredstavuje vertik´aln´ı pozici pole v˚ uˇci r´amu kontejneru, po pˇriˇctˇen´ı ts pak pozici v˚ uˇci cel´emu obsahu kontejneru. Na vypoˇctenou pozici se rolov´an´ı nastav´ı pomoc´ı jQuery funkce animate, kter´a zajist´ı plynul´y posun poloˇzek.
td
ts ti
hi hc
viditelná oblast
Obr´azek 4.12: V´yznamy jednotliv´ych hodnot pouˇzit´ych ve vzorci pro v´ypoˇcet centrov´an´ı
44
Implementace syst´emu Gadmin
4.5 4.5.1
Uˇzivatelsk´e rozhran´ı
Uˇ zivatelsk´ e rozhran´ı Pouˇ zit´ e techniky a jejich pˇ r´ıpadn´ e nedostatky
Pˇ ret´ ek´ an´ı DIV elementu Aˇckoliv nov´a verze kask´adov´ych styl˚ u CSS3 nab´ız´ı skuteˇcnˇe revoluˇcn´ı metody pro rozm´ıstˇen´ı obsahu HTML dokumentu, ne vˇsechny tyto vlastnosti jsou podporov´any bˇeˇznˇe pouˇz´ıvan´ymi prohl´ıˇzeˇci. Pˇretrv´avaj´ı tedy i nad´ale urˇcit´e nedostatky starˇs´ı verz´ı styl˚ u, jako je napˇr´ıklad vyt´ek´an´ı“ DIV prvk˚ u, jejichˇz CSS vlast” nost float nab´yv´a hodnoty left. Pokud je takov´ych prvk˚ u vedle sebe nˇekolik, vyˇcn´ıvaj´ı ze sv´eho rodiˇcovsk´eho elementu, jak ilustruje obr´azek 4.13. Aby v´yvoj´aˇr zamezil takov´emu chov´an´ı, mus´ı definovat prvek se speci´aln´ım stylem, kter´y bude fungovat jako jak´asi zar´aˇzka. Spodn´ı hranu DIV element˚ u ohraniˇc´ı, a donut´ı tak rodiˇcovsk´y prvek zvˇetˇsit svoji v´yˇsku na adekv´atn´ı hodnotu [22]. Jeho CSS styl vypad´a n´asledovnˇe: clear: both; height: 1px; margin-top: -1px; visibility: hidden; line-height: 1px; font-size: 1px; Takto ostylovan´y prvek nezab´ır´a v dokumentu ˇz´adn´y prostor, protoˇze jeho jednopixelov´a v´yˇska (height) je anulov´ana z´aporn´ym odsazen´ım shora (margin-top), a ˇreˇs´ı zm´ınˇen´y probl´em. V´ysledn´y efekt ilustruje obr´azek 4.14.
DIV
DIV
DIV
float: left
float: left
float: left
rodičovský element DIV prvků
jiné prvky (nesprávně překryty)
Obr´azek 4.13: Uk´azka vyt´ek´an´ı“ prvk˚ u z rodiˇcovsk´eho elementu ”
45
Implementace syst´emu Gadmin
Uˇzivatelsk´e rozhran´ı
DIV
DIV
DIV
float: left
float: left
float: left
rodičovský element DIV prvků
„zarážka“ Obr´azek 4.14: V´ysledn´y efekt vloˇzen´ı elementu funguj´ıc´ıho jako zar´aˇzka“ ” Kask´ adov´ e styly CSS3 Aby syst´em Gadmin nesplˇ noval pouze funkˇcn´ı poˇzadavky, ale byl z´aroveˇ n tak´e uˇzivatelsky pˇr´ıvˇetiv´y a jeho vzhled p˚ usobil na obsluhu pˇr´ıjemnˇe, pouˇz´ıv´a ke definici vzhledu prvk˚ u kask´adov´e styly CSS3. Seznam vˇsech nov´ych vlastnostn´ı uv´ad´ı zdroj [23]. Syst´em vyuˇz´ıv´a zejm´ena tˇechto: border-radius – zaoblen´ı roh˚ u r´ameˇcku, box-shadow – vnitˇrn´ı a vnˇejˇs´ı st´ın objektu, opacity – pr˚ uhlednost, transition – animace zmˇeny CSS vlastnosti.
Vˇetˇsinu z uveden´ych vlastnost´ı ale starˇs´ı verze prohl´ıˇzeˇc˚ u pˇr´ımo nepodporuj´ı. Nab´ız´ı m´ısto nich atributy s tzv. vendor-prefixem [24], pˇredponou specifickou pro kaˇzd´y prohl´ıˇzeˇc. Pokud tedy v´yvoj´aˇr CSS3 vlastnost dopln´ı o alternativy s vendor-prefixy, zv´yˇs´ı tak pravdˇepodobnost podpory efektu ve vˇetˇs´ı ˇsk´ale prohl´ıˇzeˇc˚ u. Nicm´enˇe ani tak si nem˚ uˇze b´yt jist, ˇze se poˇzadovan´y styl zobraz´ı stejnˇe ve vˇsech verz´ıch. Soubory ikon a direktiva data Pokud v´yvoj´aˇr vytv´aˇr´ı prvky, kter´e disponuj´ı tzv. hover efektem, zmˇenou podoby ve chv´ıli, kdy je nad nimi podrˇzen kurzor, a jeˇz jsou tvoˇreny obr´azkem (napˇr. tlaˇc´ıtka s ikonou), mus´ı pˇripravit grafiku pro oba stavy, a obvykle tedy i dva obrazov´e soubory. Pokud m´a uˇzivatel pomalejˇs´ı internetov´e pˇripojen´ı, pak pˇri podrˇzen´ı kurzoru nad prvkem zmiˇ novan´eho typu dojde k probliknut´ı“, jeˇz je zp˚ usobeno prodlevou ” pˇri stahov´an´ı obr´azku pro hover efekt. Aby tomu v´yvoj´aˇr zabr´anil, m˚ uˇze obr´azky um´ıstit do jednoho souboru a pˇri aktivaci hover stavu pouze zmˇenit CSS vlastnost background-position (viz obr´azek 4.15).
46
Implementace syst´emu Gadmin
Uˇzivatelsk´e rozhran´ı
40 px grafika pro hover stav 60 px
grafika pro standardní stav
Obr´azek 4.15: Uk´azka organizace obrazov´eho souboru pro tˇri tlaˇc´ıtka s hover efektem a rozmˇery 20×20 pixel˚ u Syst´em Gadmin u urˇcit´ych objekt˚ u pouˇz´ıv´a velmi mal´e obr´azky. Pˇr´ıkladem m˚ uˇze b´yt ikona d´arku nebo ˇsipka symbolizuj´ıc´ı rozbalovac´ı uˇzivatelsk´e menu v informaˇcn´ı liˇstˇe. Aby nemusel pro kaˇzd´y takov´y prvek existovat samostatn´y obrazov´y soubor, umoˇzn ˇ uje CSS syntax pouˇz´ıt direktivu data n´asledovanou base64 form´atem dat grafiky [25], napˇr´ıklad: background: url('data:image/png;base64,iVBORw0KGgoAAAANSUh...');
4.5.2
Nov´ e ovl´ adac´ı prvky
Interaktivn´ı tabulka Aplikace ve velk´e vˇetˇsinˇe pˇr´ıpad˚ u zobrazuje data formou tabulky, jej´ıˇz obsah mnohdy pˇrekraˇcuje hranici sta ˇr´adk˚ u. Takto pˇreplnˇen´a tabulka zaˇc´ın´a b´yt nepˇrehledn´a a jej´ı proch´azen´ı se znaˇcnˇe znesnadˇ nuje. Proto Gadmin vyuˇz´ıv´a jQuery plugin dataTables, kter´y z obyˇcejn´eho HTML prvku vytv´aˇr´ı plnˇe interaktivn´ı element, jenˇz data automaticky str´ankuje, umoˇzn ˇ uje je prohled´avat a ˇradit (obr´azek 4.16).
Obr´azek 4.16: Tabulka transformovan´a na interaktivn´ı prvek pomoc´ı dataTables
47
Implementace syst´emu Gadmin
Uˇzivatelsk´e rozhran´ı
Podobnˇe jako ostatn´ı jQuery pluginy i tento se inicializuje vol´an´ım funkce se stejn´ym n´azvem, tedy dataTables, pˇriˇcemˇz se m˚ uˇze volitelnˇe pˇred´avat tak´e objekt s konfigurac´ı, v pˇr´ıpadˇe tohoto pluginu tak´e lokalizac´ı do ˇceˇstiny. Transformace tabulky m˚ uˇze vypadat napˇr. takto: $("#customerTable").dataTable({ "oLanguage" : Gadmin._DATA_TABLE_LANG, "sDom" : '<"dataTables-headbar"<"content"<"filter"f>...', "iDisplayLength": 25, "aaSorting": [[ 1, "asc" ]], "aoColumns": [ { "bSortable": false }, { "asSorting": ["asc", "desc"] }, { "bSortable": false }, { "asSorting": ["asc", "desc"] }, { "bSortable": false }, { "asSorting": ["asc", "desc"] }, { "bSortable": false } ] }); kde konstanta Gadmin. DATA TABLE LANG obsahuje objekt s ˇceskou lokalizac´ı, vlastnost sDom definuje, jak m´a vypadat DOM struktura tabulky, aaSorting uv´ad´ı, kter´y sloupec m´a b´yt standardnˇe ˇrazen, a aaColumns zp˚ usoby ˇrazen´ı zbyl´ych sloupc˚ u. V´ıce informac´ı o jednotliv´ych vlastnostech konfigurace popisuje ofici´aln´ı dokumentace [26]. V´ ybˇ er data Prvek dayPicker, jak je oznaˇcov´an i ve zdrojov´em textu, byl implementov´an v r´amci v´yvoje syst´emu a podobnˇe jako ostatn´ı jQuery pluginy i tento vyuˇz´ıv´a rozhran´ı pro tvorbu rozˇs´ıˇren´ı Widget z knihovny jQuery UI. Z´aroveˇ n stav´ı na jiˇz existuj´ıc´ım pluginu pro podobn´e u ´ˇcely, a sice na datePickeru, kter´y ovˇsem zobrazuje pouze kalend´aˇr. Za hlavn´ı pˇrednost dayPickeru lze povaˇzovat pˇredevˇs´ım pˇridan´a tlaˇc´ıtka pro rychl´y posun. Ta umoˇzn ˇ uj´ı uˇzivateli mˇenit vybran´e datum po dnech ˇci t´ydnech, a to bez nutnosti hled´an´ı v kalend´aˇri. Plugin nav´ıc ignoruje v´ıkendy, obsluha tedy nem˚ uˇze zvolit datum mimo pracovn´ı dny, dayPicker automaticky po p´atku zobrazuje pondˇel´ı.
48
Implementace syst´emu Gadmin
Uˇzivatelsk´e rozhran´ı
Obr´azek 4.17: jQuery plugin dayPicker
4.5.3
Prostˇ redky n´ apovˇ edy
Jeden z hlavn´ıch aspekt˚ u, na kter´y byl pˇri v´yvoji syst´emu Gadmin obzvl´aˇst’ kladen d˚ uraz, pˇredstavovala snaha o doc´ılen´ı vysok´e m´ıry intuitivnosti a jednoduchosti ovl´ad´an´ı i pro nezaˇskolen´e uˇzivatele. Aplikace, jeˇz aspiruje na takov´e vlastnosti, nesm´ı postr´adat efektivn´ı n´apovˇedu. Ta by mˇela b´yt uˇzivateli dostupn´a v kter´emkoliv okamˇziku a ve struˇcn´e a srozumiteln´e formˇe. Kontextov´ a n´ apovˇ eda Tou nejstruˇcnˇejˇs´ı formou, kterou syst´em uˇzivatele informuje o funkcionalitˇe prvk˚ u, je kontextov´a n´apovˇeda. Existuj´ı prvky, jejichˇz v´yznam nemus´ı b´yt na prvn´ı pohled nebo pˇri prvn´ım pouˇzit´ı okamˇzitˇe jasn´y. Podrˇz´ı-li uˇzivatel u takov´ych prvk˚ u kurzor, zobraz´ı se bublina“ se struˇcn´ym popisem objektu. ” Aplikace pro tento u ´ˇcel pouˇz´ıv´a jQuery plugin powerTip, jenˇz umoˇzn ˇ uje urˇcit pozici boxu s n´apovˇedou v˚ uˇci prvku (nav´ıc disponuje mechanismem, kter´y je schopen automaticky detekovat ide´aln´ı um´ıstˇen´ı) a pˇredevˇs´ım pak pouˇz´ıt HTML form´atov´an´ı. Toto rozˇs´ıˇren´ı vyˇzaduje, aby prvky, u nichˇz se m´a pomocn´y popisek zobrazit, obsahovaly tzv. data-atribut, konkr´etnˇe data-powertip, jehoˇz hodnotu pˇredstavuje pr´avˇe text n´apovˇedy. Pˇri naˇcten´ı str´anky pak mus´ı b´yt vol´ana konstrukce, kter´a ke vˇsem takov´ych element˚ um na z´akladˇe jejich data-atributu vytvoˇr´ı prvek bubliny“. Ta vypad´a n´asledovnˇe: ” $("*[data-powertip]").powerTip({ smartPlacement: true, fadeInTime: 300; }); Vol´an´ı jQuery funkce ($) s t´ımto parametrem vybere z DOMu dokumentu vˇsechny prvky s atributem data-powertip a aplikuje na nˇe plugin powerTip. 49
Implementace syst´emu Gadmin
Uˇzivatelsk´e rozhran´ı
Pokud se jedn´a o prvek formul´aˇre, oznaˇc´ı jej Gadmin nav´ıc ikonou otazn´ıku, ˇc´ımˇz uˇzivatele upozorn´ı na to, ˇze m´a pro toto pole k dispozici doprovodn´y text, viz obr´azek 4.18.
Obr´azek 4.18: Kontextov´a n´apovˇeda pro pole formul´aˇre
Pr˚ uvodce Tipy & triky Uˇzivateli, kter´y se se syst´emem Gadmin nikdy nesetkal, by samotn´e kontextov´e n´apovˇedy patrnˇe nepomohly. Proto je aplikace vybavena pr˚ uvodcem tipy&triky. T´emˇeˇr kaˇzd´e menu obsahuje vlastn´ı sadu struˇcn´ych text˚ u, jeˇz obsluhu programu rychle seznamuj´ı s funkcemi, kter´e by mohly ocenit nebo o jejichˇz existenci by se za norm´aln´ıch okolnost´ı dozvˇedˇeli jen zˇr´ıdka. Uˇzivatel tak nen´ı nucen ˇc´ıst rozs´ahl´e pˇr´ıruˇcky, z nichˇz si stejnˇe nebude vˇse pamatovat, protoˇze m˚ uˇze kdykoliv bˇehem pr´ace se syst´emem potˇrebn´e informace z´ıskat pr´avˇe z pr˚ uvodce (obr´azek 4.19).
Obr´azek 4.19: Interaktivn´ı pr˚ uvodce aplikac´ı Tipy&triky se zobrazuj´ı po klepnut´ı na odpov´ıdaj´ıc´ı tlaˇc´ıtko v menu aktivn´ıho modulu. V prav´em doln´ım rohu obrazovky se po jejich vyvol´an´ı objev´ı ˇcern´y r´am s textem prvn´ıho tipu. Z´aroveˇ n syst´em oznaˇc´ı ˇcerven´ym r´ameˇckem prvek, k nˇemuˇz se n´apovˇeda vztahuje. Uˇzivatel m´a k dispozici tlaˇc´ıtka, pomoc´ı nichˇz
50
Implementace syst´emu Gadmin
Uˇzivatelsk´e rozhran´ı
m˚ uˇze mezi tipy a triky pˇrep´ınat. Gadmin pˇri kaˇzd´em pˇrechodu odroluje obsah str´anky tak, aby byl textem zmiˇ novan´y prvek dobˇre viditeln´y. Definice tip˚ u a trik˚ u je realizov´ana pomoc´ı Latte makra {block}, jeˇz umoˇznuje dosazovat ˇc´ast z jedn´e ˇsablony do jin´e. Hlavn´ı layout aplikace tedy oˇcek´av´a, ˇze ˇsablona modulu obsahuje blok s tipy a triky, a pokud jej skuteˇcnˇe nalezne, dosad´ı ho do v´ysledn´eho dokumentu a jednotliv´e poloˇzky pak po zobrazen´ı pr˚ uvodce proch´az´ı pomoc´ı jQuery. K tomu je ale tak´e zapotˇreb´ı, aby presenter pˇredal ˇsablonˇe promˇennou $showHints, kter´a zajist´ı zobrazen´ı tlaˇc´ıtka pro vyvol´an´ı pr˚ uvodce.
51
5 Testov´an´ı Jedn´ım z hlavn´ıch u ´ kol˚ u t´eto bakal´aˇrsk´e pr´ace bylo prov´est adekv´atn´ı testov´an´ı vyvinut´e aplikace, resp. jej´ı implementovan´e ˇc´asti. N´asleduj´ıc´ı kapitoly se zab´yvaj´ı zp˚ usoby, jeˇz mohou b´yt pro testov´an´ı pouˇzity, uv´ad´ı, kter´e z nich se pro ovˇeˇren´ı funkˇcnosti a pouˇzitenosti syst´emu hod´ı, a vyhodnocuj´ı z´ıskan´e v´ysledky.
5.1
Dostupn´ e metody testov´ an´ı
Protoˇze u webov´ych aplikac´ı existuje spousta aspekt˚ u, jeˇz je moˇzn´e provˇeˇrovat, lze metody testov´an´ı kategorizovat. N´asleduj´ıc´ı v´yˇcet uv´ad´ı vlastnosti syst´emu, kter´e je moˇzn´e testovat. Kompatibilita s prohl´ıˇzeˇci, bezpeˇcnost, zat´ıˇzen´ı aplikace, poˇzadovan´a funkcionalita, pouˇzitelnost a intuitivita rozhran´ı.
Vˇetˇsinu tˇechto aspekt˚ u lze testovat pomoc´ı aplikac´ı vyvinut´ych k tomuto u ´ˇcelu. Mezi velice popul´arn´ı patˇr´ı napˇr. n´astroj Selenium, jenˇz poskytuje v´yvoj´aˇr˚ um moˇznost definice automatick´ych test˚ u. Protoˇze ale bude aplikace testov´ana re´aln´ymi osobami, nen´ı potˇreba sluˇzby tohoto n´astroje vyuˇz´ıvat. Syst´em Gadmin je postaven na frameworku Nette, u nˇehoˇz jsou rizika bezpeˇcnostn´ıch mezer a pˇr´ıpadn´ych u ´ tok˚ u jiˇz oˇsetˇrena [9], proto z hlediska bezpeˇcnosti nebude tak´e nijak testov´an. Tot´eˇz plat´ı pro zat´ıˇzen´ı aplikace – vzhledem k tomu, ˇze program mohou pouˇz´ıvat pouze zamˇestnanci stravovac´ıho zaˇr´ızen´ı, nehroz´ı nebezpeˇc´ı toho, ˇze by mohla zkolabovat vlivem pˇret´ıˇzen´ı. Ostatn´ı aspekty testov´an´ı ˇreˇs´ı n´asleduj´ıc´ı kapitoly.
5.2
Testov´ an´ı kompatibility
Syst´em Gadmin je prim´arnˇe doporuˇceno spouˇstˇet v prohl´ıˇzeˇci Google Chrome. Tuto skuteˇcnost zadavatel pˇrijal, a proto nebyl br´an zˇretel na interpretaci syst´emu v jin´ych prohl´ıˇzeˇc´ıch. Protoˇze se vˇsak jedn´a o aplikaci splˇ nuj´ıc´ı validaˇcn´ı standardy, i ostatn´ı prohl´ıˇzeˇce by mˇely b´yt schopn´e umoˇznit (aspoˇ n ˇc´asteˇcnˇe) korektn´ı chod Gadminu. Pro ovˇeˇren´ı kompatibility byli zvoleni pˇredn´ı z´astupci v souˇcasnosti pouˇz´ıvan´ych program˚ u pro prohl´ıˇzen´ı webov´ych str´anek [27]. Nav´ıc je doplnil i Internet Explorer verze 7, kter´y doposud stravovac´ı zaˇr´ızen´ı pouˇz´ıvalo. N´aslednˇe vznikl 52
Testov´ an´ı
Manu´aln´ı testov´an´ı
seznam potenci´alnˇe probl´emov´ych oblast´ı syst´emu, jeˇz by mohly v prohl´ıˇzeˇc´ıch zp˚ usobit chybu ˇci fungovat nespr´avnˇe. Ve vˇetˇsinˇe pˇr´ıpad˚ u se jedn´a o funkce, kter´e pracuj´ı s nov´ymi vlastnostmi kask´adov´ych styl˚ u ˇci JavaScriptem. Testovan´e oblasti a jejich podporu ze strany prohl´ıˇzeˇc˚ u popisuje pˇr´ıloha D.
V´ ysledek testov´ an´ı kompatibility Pˇr´ıloha zcela jasnˇe potvrzuje plnou kompatibilitu prohl´ıˇzeˇce Google Chrome se syst´emem Gadmin. Souˇcasnˇe lze ale i dalˇs´ı dva konkurenˇcn´ı programy, Opera a Mozilla Firefox, povaˇzovat za aplikace, jeˇz pr´aci se syst´emem v omezen´e m´ıˇre umoˇzn ˇ uj´ı. Nutno zd˚ uraznit, ˇze v pˇr´ıpadˇe Opery vˇsak mus´ı uˇzivatel db´at na to, aby nepouˇz´ıval navigaci prohl´ıˇzeˇce, tu zde totiˇz nen´ı moˇzn´e blokovat jako u ostatn´ıch, a m˚ uˇze tak doj´ıt ke ztr´atˇe neuloˇzen´ych dat. Nejh˚ uˇre v testech dopadly prohl´ıˇzeˇce Internet Explorer, kter´e nepodporuj´ı provˇeˇrovan´e vlastnosti Gadminu ani ze 75 %, a to v obou zmiˇ novan´ych verz´ıch. Aˇckoliv lze ˇr´ıci, ˇze verze 9 m˚ uˇze b´yt v krajn´ıch pˇr´ıpadech pro pr´aci se syst´emem pouˇz´ıv´ana (protoˇze jej´ı nedostateˇcn´a podpora kask´adov´ych styl˚ u omezuje pouze vzhled, nikoliv funkˇcnost), rozhodnˇe to nem˚ uˇzeme tvrdit o verzi 7, kter´a aplikaci takˇrka v˚ ubec nepodporuje.
5.3
Manu´ aln´ı testov´ an´ı
Hlavn´ı roli pˇri ovˇeˇrov´an´ı funkˇcnosti a celkov´e pouˇzitelnosti syst´emu hr´aly manu´aln´ı testy, tedy testy prov´adˇen´e skuteˇcn´ymi osobami. Jejich c´ıl pˇredstavovalo jak prozkouˇsen´ı poˇzadovan´e funkcionality, tak i posouzen´ı pˇr´ıvˇetivosti a intuitivity uˇzivatelsk´eho rozhran´ı. Pro tyto u ´ˇcely vznikl testovac´ı arch (pˇr´ıloha C), jenˇz se skl´ad´a ze tˇr´ı ˇc´ast´ı: profil testera, kter´ y umoˇzn´ı pracovat s v´ysledky relevantnˇeji, testovac´ı sc´en´aˇr, jenˇz provˇeˇr´ı funkcionalitu implementovanou v r´amci bakal´aˇrsk´e pr´ace a z´aroveˇ n tak´e orientaci uˇzivatele v rozhran´ı aplikace, a z´avˇereˇcn´ y pr˚ uzkum slouˇz´ıc´ı k p´ısemn´emu vyj´adˇren´ı tester˚ u, k vytvoˇren´ı prostoru pro sdˇelen´ı pˇripom´ınek, n´avrh˚ u apod.
Pro testov´an´ı byl zvolen vzorek dvan´acti tester˚ u tak, aby se jednalo o osoby s r˚ uzn´ymi z´ajmy, profesemi, popˇr. obory, v nichˇz se vzdˇel´avaj´ı. Graf na obr´azku 5.1 uv´ad´ı sloˇzen´ı osob na z´akladˇe jejich profesn´ıho stavu a na obr´azku 5.2 pak procentu´aln´ı zastoupen´ı dovednost´ı mezi vˇsemi testery. Co se t´yˇce samotn´eho pr˚ ubˇehu testov´an´ı, mˇel uˇzivatel k dispozici nejdˇr´ıve tzv. hˇriˇstˇe, instalaci aplikace speci´alnˇe urˇcenou k experiment˚ um, kde mohl tester dle sv´e libosti manipulovat s daty, a t´ım si tak pr´aci se syst´emem osvojit. V druh´e f´azi pak pˇreˇsel k jin´e instalaci syst´emu, jej´ıˇz souˇc´ast´ı je datab´aze pˇredpˇripraven´a pro testovac´ı sc´en´aˇr. S pˇrechodem do t´eto f´aze se tak´e inicializoval 53
Testov´ an´ı
Manu´aln´ı testov´an´ı
skript TestLogger, jehoˇz hlavn´ı n´aplˇ n spoˇc´ıv´a v zaznamen´av´an´ı veˇsker´e testerovy interakce, pˇredevˇs´ım pak pˇrechod˚ u mezi moduly ˇci menu (poˇzadavky AJAX). Vˇsechny tyto z´aznamy TestLogger vkl´ad´a do jedin´eho souboru, jenˇz tester na konci plnˇen´ı sc´en´aˇre mus´ı uloˇzit. Dalˇs´ım zpracov´an´ım tohoto souboru pak bylo moˇzn´e odhalit, kter´a z testov´ych ˇc´ast´ı uˇzivateli trvala nejd´ele, zda ji skuteˇcnˇe splnil nebo jestli poˇzadovanou funkci hledal v jin´em menu.
student/nezaměstnaný
23,1 %
zaměstnanec stravovny 15,4 %
61,5 %
zaměstnanec/podnikatel
Obr´azek 5.1: Graf zn´azorˇ nuj´ıc´ı sloˇzen´ı tester˚ u na z´akladˇe jejich profesn´ıho stavu
100,0 % 80,0 % 60,0 % 40,0 % 20,0 %
In te
rn
et
u
0,0 %
Obr´azek 5.2: Graf procentu´aln´ıho zastoupen´ı dovednost´ı tak, jak je uvedli testeˇri 54
Testov´ an´ı
5.3.1
Manu´aln´ı testov´an´ı
V´ ysledky testovac´ıch sc´ en´ aˇ r˚ u
Pr˚ ubˇeh testov´an´ı u jednotliv´ych uˇzivatel˚ u tak, jak jej zaznamenal TestLogger, uv´ad´ı graf v pˇr´ıloze E. Zobrazuje ˇcasy, v nichˇz uˇzivatel dokonˇcil danou u ´ lohu v r´amci testovac´ıho sc´en´aˇre. Kˇrivka testera tedy urˇcuje celkovou d´elku testov´an´ı, ale tak´e ˇcasovou prodlevu mezi jednotliv´ymi kroky. Jiˇz pˇri prvn´ım pohledu na tento graf je patrn´e, ˇze nejvˇetˇs´ı pot´ıˇze pro testery pˇredstavoval krok, pˇri nˇemˇz mˇeli vloˇzit novou objedn´avku do datab´aze. U tohoto u ´ kolu totiˇz ve vˇetˇsinˇe pˇr´ıpad˚ u kˇrivka pr˚ ubˇehu strmˇe roste, coˇz signalizuje vˇetˇs´ı ˇcasovou prodlevu. Celkovou n´aroˇcnost cel´e testovac´ı ˇc´asti III nav´ıc dokresluje tak´e graf v pˇr´ıloze F, jenˇz ji oznaˇcuje v porovn´an´ı s ostatn´ımi za nejobt´ıˇznˇejˇs´ı (s pr˚ umˇerem 2,25). Podobn´y n´ar˚ ust je sice patrn´y i u vkl´ad´an´ı nov´eho z´akazn´ıka a distributora, avˇsak pˇri tˇechto dvou kroc´ıch mus´ı tester do formul´aˇre zan´est textov´e u ´ daje. Pokud tedy neovl´ad´a psan´ı vˇsemi deseti prsty ˇci je jeho schopnost psan´ı na kl´avesnici jinak omezena, zvˇetˇs´ı se prodleva i u tˇechto dvou u ´ kon˚ u. Nˇekteˇr´ı z uˇzivatel˚ u, napˇr. tester A, F ˇci H, vybran´e u ´ koly neprovedli spr´avnˇe, nebo dokonce v˚ ubec, proto je jejich kˇrivka pˇreruˇsena. Za ide´aln´ıho uˇzivatele aplikace lze povaˇzovat testera G, jehoˇz pr˚ ubˇeh pr´ace s Gadminem je zcela plynul´y, bez chyb a ve v´yborn´em ˇcase 14 minut a 50 sekund. V r´amci manu´aln´ıho testov´an´ı byl cel´y sc´en´aˇr u tˇretiny uˇzivatel˚ u proveden znovu s odstupem 2 dn˚ u. Toto opˇetovn´e testov´an´ı si kladlo za c´ıl odhalit, zda po prvotn´ım sezn´amen´ı se syst´emem bude uˇzivatel schopen pracovat s jistou znalost´ı aplikace rychleji. Jak ukazuje pˇr´ıloha G, graf rozd´ıl˚ u prodlev mezi u ´ koly v prvn´ım a druh´em testov´an´ı, ve vˇetˇsinˇe pˇr´ıpad˚ u doˇslo v pr˚ umˇeru k minutov´emu zlepˇsen´ı. Obzvl´aˇst’ patrn´a zmˇena se pak projevila v oblasti, kter´a byla v prvn´ı f´azi testov´an´ı vyhodnocena jako kritick´a, tedy v u ´ kolu vkl´ad´an´ı objedn´avky.
5.3.2
V´ ysledky z´ avˇ ereˇ cn´ eho pr˚ uzkumu
Protoˇze se jedn´a o p´ısemnou ˇc´ast testovac´ıho archu, nelze jej´ı v´ysledky sjednotit ani nijak globalizovat. Z toho d˚ uvodu se budou jednotliv´ym ot´azk´am pr˚ uzkumu vˇenovat n´asleduj´ıc´ı podkapitoly. Vzhled a prvky uˇ zivatelsk´ e rozhran´ı Vˇsichni uˇzivatel´e, kteˇr´ı se testov´an´ı u ´ˇcastnili, povaˇzuj´ı vzhled syst´emu Gadmin za modern´ı a pˇrehledn´y, l´ıb´ı se jim. Ve vˇetˇsinˇe pˇr´ıpad˚ u souhlas´ı i s volbou barevn´ych kombinac´ı, pouze tester C uv´ad´ı, ˇze v urˇcit´ych pˇr´ıpadech shled´av´a barvy p´ısma a pozad´ı m´alo kontrastn´ımi, m´a obt´ıˇze se ˇcten´ım tˇechto u ´ sek˚ u. Nˇekolik uˇzivatel˚ u d´ale poznamenalo, ˇze velikost navigaˇcn´ıho tlaˇc´ıtka Zpˇet je v porovn´an´ı s ostatn´ımi prvky menu velmi mal´a, mus´ı tedy kurzor myˇsi umist’ovat pˇr´ımo na ikonu ˇsipky. Tester C nav´ıc uvedl, ˇze povaˇzuje mezeru oddˇeluj´ıc´ı menu modulu a jeho samotn´y obsah za zbyteˇcnou. Obecnˇe nabyl bˇehem testov´an´ı dojmu, ˇze ve spoustˇe 55
Testov´ an´ı
Manu´aln´ı testov´an´ı
pˇr´ıpad˚ u musel pˇr´ıliˇs mnoho rolovat obsah obrazovky. Z tˇechto d˚ uvod˚ u by mezery (tedy CSS vlastnosti padding a margin) zmenˇsil ˇci zcela odstranil. Koncepce menu Organizaci menu a dalˇs´ıch nab´ıdek shled´avali testeˇri vyhovuj´ıc´ımi. V´yjimku tvoˇr´ı um´ıstˇen´ı editoru trasy distributora. Ten je dostupn´y pouze prostˇrednictv´ım ikony mapov´eho terˇc´ıku v tabulce distributor˚ u. Vˇetˇsina uˇzivatel˚ u (66 %) vˇsak oˇcek´avala (a vypl´yv´a to tak´e ze z´aznam˚ u skriptu TestLogger), ˇze tuto funkci naleznou na kartˇe distributora, a proto uvedla tuto skuteˇcnost jako nevyhovuj´ıc´ı. Menˇs´ımu poˇctu tester˚ u (33 %) se pak jako nedostatek jevilo oznaˇcen´ı editoru objedn´avek. Ten je moment´alnˇe dostupn´y v modulu Objedn´avky pod poloˇzkou spravovat. Nˇekteˇr´ı uˇzivatel´e si vˇsak nespojili spr´avu objedn´avek s moˇznost´ı jejich vloˇzen´ı a marnˇe se pokouˇseli nal´ezt prvek s popiskem vloˇzit. K t´eto dezorientaci pˇrispˇela tak´e vysok´a pravdˇepodobnost z´amˇeny pˇr´ıchoz´ı (menu pˇr´ıchoz´ı) a pˇrijat´e objedn´avky (menu spravovat). V z´avˇeru tester L uvedl, ˇze postr´ad´a zv´yraznˇen´ı podmenu (menu modulu) podobn´ym zp˚ usobem, jak´ym je realizov´ano v nab´ıdce modul˚ u. Pr˚ uvodce tipy&triky T´emˇeˇr vˇsichni uˇzivatel´e oznaˇcili tohoto pr˚ uvodce aplikac´ı za uˇziteˇcn´eho a v pr˚ uzkumu zm´ınili, ˇze d´ıky nˇemu pro nˇe byla obsluha aplikace snazˇs´ı (dle z´aznam˚ u skriptu TestLogger pouˇzil pr˚ uvodce kaˇzd´y tester v pr˚ umˇeru ˇctyˇrikr´at). V´yjimku tvoˇr´ı tester C, jenˇz povaˇzuje texty t´eto n´apovˇedy za pˇr´ıliˇs rozs´ahl´e. Naproti tomu tester G navrhoval rozˇs´ıˇren´ı pr˚ uvodce o dalˇs´ı uˇziteˇcn´e tipy. Celkovˇe lze tedy tipy&triky oznaˇcit za uˇziteˇcnou formu n´apovˇedy, coˇz moˇzn´a ilustruje i n´asleduj´ıc´ı odpovˇed’ testera I na ot´azku, zda je pr˚ uvodce uˇziteˇcn´y: Urˇcitˇe v´ıce neˇz n´apovˇeda ve Windows. I kdyˇz srovn´av´an´ım s n´ı bych tyto tipy&triky jen ur´aˇzel. Hodnocen´ı funkc´ı Testeˇri byli v r´amci pr˚ uzkumu poˇz´ad´ani, aby oznaˇcili funkce syst´emu Gadmin, o nichˇz si mysl´ı, ˇze jsou uˇziteˇcn´e, ˇci naopak. Tˇri testeˇri shodnˇe ocenili editor tras a moˇznost filtrace poloˇzek v nˇem obsaˇzen´ych. Jin´ı tˇri oznaˇcili za uˇziteˇcnou funkci pr˚ uvodce, jemuˇz se vˇenovala pˇredchoz´ı podkapitola. Tester I povaˇzuje za prospˇeˇsn´e okamˇzit´e pˇrijet´ı pˇr´ıchoz´ı objedn´avky bez nutnosti pˇrepisov´an´ı poˇctu pokrm˚ u a tester G uvedl, ˇze se mu l´ıb´ı koncepce N´astˇenky, kter´a sice nebyla v r´amci bakal´aˇrsk´e pr´ace implementov´ana, ale ze syst´emu lze vysledovat, k jak´ym u ´ˇcel˚ um poslouˇz´ı. Tester C se zamˇeˇril pˇredevˇs´ım na negativn´ı postˇrehy a v r´amci pr˚ uzkumu poznamenal, ˇze mu nevyhovuje zp˚ usob v´ybˇeru distributora v editoru objedn´avek.
56
Testov´ an´ı
V´ysledky a jejich v´yznam pro dalˇs´ı v´yvoj
V´ybˇer je nyn´ı realizov´an pomoc´ı prvku SELECT, tento tester vˇsak navrhoval hromadn´e zobrazen´ı distributor˚ u napˇr. v jedn´e ˇr´adce.
5.4 5.4.1
V´ ysledky a jejich v´ yznam pro dalˇs´ı v´ yvoj Uˇ zivatelsk´ e rozhran´ı, intuitivita
Jak uv´ad´ı pˇredchoz´ı kapitola, vˇsichni testeˇri byli se vzhledem rozhran´ı syst´emu spokojen´ı a oznaˇcili jej jako modern´ı. Nˇekolik z nich vˇsak povaˇzuje tlaˇc´ıtko Zpˇet za pˇr´ıliˇs mal´e. Zpˇet je skuteˇcnˇe menˇs´ı neˇz ostatn´ı poloˇzky menu, obsazuje plochu o rozmˇerech 9×13 pixel˚ u, coˇz lze u jednoho z hlavn´ıch navigaˇcn´ıch prvk˚ u povaˇzovat skuteˇcnˇe za nedostatek. Uˇzivatel mus´ı (v z´avislosti na nastaven´ı myˇsi) pro um´ıstˇen´ı kurzoru nad tento objekt vynaloˇzit urˇcit´e u ´ sil´ı, coˇz ub´ır´a na rychlosti jeho pouˇzit´ı. Pˇri dalˇs´ım v´yvoji syst´emu bude tedy toto tlaˇc´ıtko rozˇs´ıˇreno na 50 pixel˚ u ˇs´ıˇrky a 40 pixel˚ u v´yˇsky (stejnˇe jako ostatn´ı poloˇzky menu). Nezanedbateln´y poˇcet tester˚ u tak´e upozornil na nevhodn´e um´ıstˇen´ı editoru tras. Pˇri dalˇs´ıch u ´ prav´ach syst´emu tedy bude pˇresunut na kartu distributora, aby byly veˇsker´e informace s n´ım spojen´e dostupn´e v jednom menu. Tester C ve sv´em vyj´adˇren´ı uv´adˇel, ˇze povaˇzuje za zbyteˇcn´e mezery mezi jednotliv´ymi prvky menu, ˇze je tak nucen rolovat zbyteˇcnˇe velk´e mnoˇzstv´ı obsahu. Tyto mezery, tedy vlastnosti margin (vnˇejˇs´ı odsazen´ı) a padding (vnitˇrn´ı odsazen´ı), vˇsak maj´ı v layoutu syst´emu sv˚ uj v´yznam. Prvky od sebe opticky oddˇeluj´ı a design aplikace celkovˇe provzduˇsn ˇ uj´ı“. Nelze popˇr´ıt, ˇze d´ıky nim mus´ı uˇzivatel ” odrolovat v´ıce obsahu, nemus´ı vˇsak posouvat obsah str´anky zpˇet – za t´ım u ´ˇcelem je Gadmin doplnˇen funkc´ı nahoru. Tester L se trefnˇe zm´ınil o absenci zv´yraznˇen´ı aktivn´ıho podmenu. Stejnˇe jako moduly prostˇrednictv´ım ikon indikuj´ı, kter´y z nich uˇzivatel aktivoval, i jejich podmenu by mˇelo na prvn´ı pohled informovat, kde se obsluha programu nach´az´ı. Presentery jednotliv´ych modul˚ u tedy budou novˇe mimo promˇennou $selectedMenu odes´ılat ˇsablonˇe tak´e promˇennou $selectedSubmenu, kter´a umoˇzn´ı aktivn´ı podmenu oznaˇcit.
5.4.2
Funkcionalita
Hlavn´ım nedostatkem v t´eto oblasti se stalo pravdˇepodobnˇe vkl´ad´an´ı objedn´avky a editace jej´ıho typu balen´ı ˇci ceny – vypl´yv´a to jak ze z´avˇereˇcn´eho pr˚ uzkumu, tak i ze z´aznam˚ u skriptu TestLogger, z nˇehoˇz je patrn´e, ˇze nejv´ıce ˇcasu testerovi nezabralo samotn´e vloˇzen´ı objedn´avky, n´ybrˇz nalezen´ı menu, kde m˚ uˇze tento u ´ kon prov´est. Proto dojde v syst´emu k pˇrejmenov´an´ı menu spravovat na vloˇzit / upravit, coˇz sice vyjadˇruje tot´eˇz, avˇsak se zv´yraznˇen´ım moˇznosti vkl´ad´an´ı. Co se t´yˇce u ´ prav vlastnost´ı objedn´avky, doposud musel uˇzivatel stisknout v aktivn´ım poli s objedn´avkou kl´avesu Ctrl nebo v nˇem poklepat lev´ym tlaˇc´ıtkem myˇsi. Aˇckoliv se tento zp˚ usob jevil jako snadno odhaliteln´y zejm´ena proto, ˇze 57
Testov´ an´ı
V´ysledky a jejich v´yznam pro dalˇs´ı v´yvoj
editace dvojklikem pˇredstavuje zaveden´y princip, spousta tester˚ u se o zp˚ usobu vyvol´an´ı t´eto funkce dozvˇedˇela aˇz s pouˇzit´ım pr˚ uvodce tipy&triky a nebo v˚ ubec. Z toho d˚ uvodu bude aktivn´ı pole editoru vˇzdy opatˇreno tlaˇc´ıtkem s ikonou ˇsipky (podobn´ym tomu, kter´e vyuˇz´ıv´a prvek SELECT), jeˇz uˇzivatele bez pochyb upozorn´ı na skryt´e kontextov´e menu slouˇz´ıc´ı k editaci vlastnost´ı objedn´avky. Tester C uvedl, ˇze mu nevyhovuje zp˚ usob v´ybˇeru distributora v editoru objedn´avek, navrhoval um´ıstit vˇsechny distributory vedle sebe do jedn´e ˇr´ady. Rozd´ıl mezi n´avrhem testera a souˇcasnou realizac´ı v´ybˇeru vˇsak spoˇc´ıv´a v jedin´em klepnut´ı myˇsi nav´ıc, jeˇz jen stˇeˇz´ı m˚ uˇze rychlost pr´ace z´avratnˇe ovlivnit. Pro zachov´an´ı souˇcasn´eho stavu nav´ıc hovoˇr´ı skuteˇcnost, ˇze nelze pˇredpokl´adat ˇz´adn´y pˇredem dan´y poˇcet distributor˚ u, snadno by pak tedy mohlo doj´ıt k situaci, kdy by se vˇsichni distributoˇri do z´ahlav´ı tabulky editoru neveˇsli, a zvˇetˇsili by tak rozmˇery z´ahlav´ı, nebo naopak nebyli v˚ ubec viditeln´ı.
5.4.3
Prostˇ redky n´ apovˇ edy
Jak uk´azaly v´ysledky test˚ u, vˇetˇsina uˇzivatel˚ u velmi ocenila pr˚ uvodce nab´ızej´ıc´ıho tipy&triky. Tester C ve sv´em archu nevyj´adˇril, zda tipy&triky pouˇz´ıval (z´aznamy z jeho testov´an´ı uv´ad´ı, ˇze nikoliv, avˇsak pr˚ uvodce mohl zobrazit tak´e na hˇriˇsti), ale texty povaˇzoval za pˇr´ıliˇs dlouh´e. Pˇri sestavov´an´ı tip˚ u&trik˚ u byl kladen d˚ uraz na popularizaci pˇr´ıruˇckov´ych text˚ u – jde tedy o zp˚ usob popisu funkc´ı, kter´y by uˇzivatele nemˇel nudit a pˇrirozenou formou mu osvˇetlil v´yznam vybran´ych prvk˚ u uˇzivatelsk´eho rozhran´ı. Lze oˇcek´avat, ˇze texty takov´eho charakteru nabudou u vybran´ych menu vˇetˇs´ıch rozmˇer˚ u, v pˇr´ıpadˇe Gadminu se jedn´a pˇredevˇs´ım o spr´avu objedn´avek, jeˇz vyˇzaduje rozs´ahlejˇs´ı popis funkcionality. Proto nedojde v budoucnu k jejich zkr´acen´ı, naopak bude pr˚ uvodce rozˇs´ıˇren o dalˇs´ı tipy vztahuj´ıc´ı se jak k nov´ym funkc´ım, tak i k tˇem, u nichˇz testy prok´azaly urˇcit´e nedostatky.
5.4.4
Dalˇ s´ı u ´ pravy
Testov´an´ı aplikace Gadmin odhalilo i nedostatky, kter´e uˇzivatel´e nezpozorovali. Jedn´ım z nich je napˇr. vznik duplicit pˇri nespr´avn´em zach´azen´ı s pˇr´ıchoz´ımi objedn´avkami. Pokud se z´akazn´ık nach´az´ı v datab´azi syst´emu, ale pˇresto pˇri odes´ıl´an´ı elektronick´e objedn´avky nepouˇzil sv´e ID, Gadmin jej identifikuje, avˇsak vyˇzaduje po obsluze, aby jeho spojen´ı s objedn´avkou potvrdila (pˇr´ıpad Jana Peˇcen´eho v testovac´ım sc´en´aˇri, pˇr´ıloha C). Aplikace na skuteˇcnost, ˇze z´akazn´ıka rozpoznala, upozorn´ı zobrazen´ım odkazu s textem Nen´ı to ...?“. Nˇekolik tester˚ u to vˇsak ” pˇrehl´edlo a z´akazn´ıka vloˇzilo do syst´emu, ˇc´ımˇz vznikla duplicita liˇs´ıc´ı se napˇr. jen jm´enem nebo mezerou nechtˇenˇe vloˇzenou do adresy. Syst´em z´akazn´ıky identifikuje na z´akladˇe e-mailov´e adresy a telefonn´ıho ˇc´ısla. Pokud by se tedy v budoucnu pokouˇsel tester prov´est zm´ınˇen´e operace, aplikace mu to nedovol´ı, protoˇze bude
58
Testov´ an´ı
V´ysledky a jejich v´yznam pro dalˇs´ı v´yvoj
vyˇzadovat pro kaˇzd´eho z´akazn´ıka v datab´azi unik´atn´ı e-mail a telefonn´ı ˇc´ıslo. Tyto dva u ´ daje se u osoby objedn´avaj´ıc´ı obˇedy totiˇz nikdy nemohou opakovat. Tester C ve sv´em archu mimo jin´e uvedl, ˇze by bylo vhodn´e, aby se v editoru objedn´avek pole s poloˇzkami, jejichˇz vlastnosti (typ balen´ı, cena) byly pomoc´ı kontextov´eho menu zmˇenˇeny, nˇejak´ym zp˚ usobem oznaˇcovala. Administrativn´ı pracovn´ık zaˇr´ızen´ı jistˇe ocen´ı, kdyˇz v editoru na prvn´ı pohled rozpozn´a objedn´avky, jejichˇz typ balen´ı ˇci cena se liˇs´ı oproti standardn´ımu nastaven´ı u dan´eho z´akazn´ıka. Zm´ınˇenou funkcionalitu lze realizovat pomoc´ı odpov´ıdaj´ıc´ı CSS tˇr´ıdy, o jej´ımˇz pˇriˇrazen´ı k prvku rozhodne porovn´an´ı atribut˚ u objedn´avky s vlastnostmi definovan´ymi u z´akazn´ıka.
59
6 Z´avˇer Tato bakal´aˇrsk´a pr´ace si kladla za c´ıl vytvoˇrit nov´y, snadno rozˇsiˇriteln´y syst´em spr´avy pro stravovac´ı zaˇr´ızen´ı. Ve spoleˇcnosti zad´avaj´ıc´ı tento projekt jiˇz podobn´a aplikace existuje. Ta vˇsak nesplˇ nuje vˇsechny poˇzadavky administrativn´ı pracovnice, a proto byla prvn´ım krokem pr´ace d˚ ukladn´a anal´yza programu, jejˇz m´a zm´ınˇen´a firma moment´alnˇe k dispozici. Na z´akladˇe odhalen´ych nedostatk˚ u mohl b´yt sestaven hrub´y n´avrh nov´eho syst´emu a datab´aze, kter´y po nˇekolika konzultac´ıch n´aslednˇe doplnily dalˇs´ı poˇzadavky zadavatele. Pˇri vytv´aˇren´ı kompletn´ı podoby n´avrhu byl obzvl´aˇst’ kladen d˚ uraz na logick´e rozm´ıstˇen´ı jednotliv´ych nab´ıdek a jejich smyslupln´e prov´az´an´ı. Obdobn´a pravidla pak platila tak´e pˇri n´avrhu uˇzivatelsk´eho rozhran´ı, kter´e se snaˇz´ı b´yt maxim´alnˇe pˇr´ıvˇetiv´e a intuitivn´ı. Pro jeho realizaci byly zvoleny modern´ı kombinace barev, ikony jednoznaˇcnˇe nesouc´ı v´yznam a pˇredevˇs´ım pak prostˇredky kontextov´e n´apovˇedy, jeˇz maj´ı uˇzivatele uˇsetˇrit listov´an´ı v pˇr´ıruˇcce. Protoˇze mˇel b´yt nov´y syst´em zvan´y Gadmin snadno rozˇsiˇriteln´y, byl k jeho implementaci vyuˇzit framework, kter´y aplikaci rozdˇeluje na vrstvy, vyuˇz´ıv´a zaveden´ych vzor˚ u, a celkovˇe tak strukturu zdrojov´ych soubor˚ u velmi zpˇrehledˇ nuje. Rovnˇeˇz tedy umoˇzn ˇ uje souˇcasnou podobu syst´emu snadno upravit nebo ji obohatit o nov´e moduly ˇci funkce. Protoˇze syst´em spr´avy stravovac´ıho zaˇr´ızen´ı pˇredstavuje rozs´ahl´y komplex funkc´ı, kter´y nelze v ˇcase vyhrazen´em pro pˇr´ıpravu bakal´aˇrsk´e pr´ace implementovat, byly v jej´ım r´amci realizov´any pouze moduly nezbytnˇe nutn´e pro z´akladn´ı funkcionalitu aplikace. Aby se mohla ovˇeˇrit spr´avn´a funkˇcnost vytvoˇren´e ˇc´asti syst´emu a z´aroveˇ n aplikace odhalila sv´e nedostatky, vyz´yval posledn´ı bod zad´an´ı pr´ace k provˇeˇren´ı pouˇzitelnosti a pˇr´ıvˇetivosti uˇzivatelsk´eho rozhran´ı. Za t´ımto u ´ˇcelem obdrˇzelo dvan´act uˇzivatel˚ u odliˇsn´ych profes´ı a technick´ych dovednost´ı testovac´ı archy obsahuj´ıc´ı sc´en´aˇr, hodnocen´ı pr´ace se syst´emem a z´avˇereˇcn´y pr˚ uzkum urˇcen´y k p´ısemn´emu vyj´adˇren´ı testera. Testy sledovaly jak ˇcas a spr´avnost proveden´ı u ´ kol˚ u, tak i pohyb uˇzivatele v prostˇred´ı aplikace a ˇcetnost vyuˇzit´ı prostˇredk˚ u n´apovˇedy. V´ysledky testov´an´ı dokazuj´ı, ˇze ve vˇetˇsinˇe pˇr´ıpad˚ u syst´em splnil poˇzadavky kladen´e zadavatelem i poˇzadavky, jeˇz stanovil v´yvoj´aˇr. Testeˇri jej ohodnotili jako modern´ı a pˇrehledn´y a t´emˇeˇr vˇsichni zvl´adli bez jak´ehokoliv pˇredch´azej´ıc´ıho zauˇcen´ı a bez vˇetˇs´ıch obt´ıˇz´ı splnit poˇzadovan´e u ´ koly. Jejich pˇripom´ınky a n´avrhy byly posl´eze zapracov´any v kapitole 5.4. V´yvoj syst´emu Gadmin bude i nad´ale pokraˇcovat. V prvn´ı ˇradˇe se zamˇeˇr´ı na realizaci u ´ prav a doporuˇcen´ı z´ıskan´ych od tester˚ u, a n´aslednˇe pak zah´aj´ı druhou f´azi implementac´ı zb´yvaj´ıc´ıch modul˚ u, kter´e uˇzivateli zajist´ı plnou kontrolu nad sestavov´an´ım j´ıdeln´ıˇck˚ u, spr´avou financ´ı a nastaven´ım syst´emu.
60
Pˇ rehled pouˇ zit´ ych zkratek a pojm˚ u ACL
(Access Control List) n´astroj pro ˇr´ızen´ı pˇr´ıstupu a pr´av pomoc´ı definice uˇzivatelsk´ych rol´ı, zdroj˚ u a opr´avnˇen´ı
AJAX
(Asynchronous Javascript And XML) technologie pˇrenosu dat na pozad´ı webov´e str´anky prostˇrednictv´ım skriptovac´ıho jazyka JavaScript a XML
ajaxifikace
(ajaxification) proces, pˇri nˇemˇz je bˇeˇzn´a webov´a str´anka pˇrevedena na webovou aplikaci vyuˇz´ıvaj´ıc´ı pro zas´ıl´an´ı HTTP poˇzadavk˚ u AJAX mechanismus
CSS
(Cascade Style Sheet) jazyk pro popis stylu zobrazen´ı prvk˚ u hypertextov´eho dokumentu
DOM
(Document Object Model) objektovˇe orientovan´y model XML (potaˇzmo HTML) dokumentu umoˇzn ˇ uj´ıc´ı manipulaci s jeho jednotliv´ymi prvky
drag&drop
zp˚ usob ovl´ad´an´ı prvk˚ u uˇzivatelsk´eho rozhran´ı; uchopen´ı, n´asledn´e taˇzen´ı a upuˇstˇen´ı objektu
DRY
(Don’t Repeat Yourself) principy pro programov´an´ı bez zbyteˇcn´eho opakov´an´ı informac´ı a zdrojov´eho textu
ERA model
(Entity Relationship Attribute) abstrakt popisuj´ıc´ı vztahy mezi entitn´ımi mnoˇzinami datab´aze
escapov´an´ı
zp˚ usob zak´odov´an´ı znak˚ u, kter´e mohou b´yt interpretov´any jinak neˇz jako znaky ˇretˇezce
fokus
stav, jenˇz prvek uˇzivatelsk´eho rozhran´ı obdrˇz´ı, je-li vybr´an pro vkl´ad´an´ı vstupn´ı informace
framework
abstrakce slouˇz´ıc´ı jako programov´a podpora pro v´yvoj dalˇs´ıch aplikac´ı
61
GIF
(Graphics Interchange Format) grafick´y form´at pro rastrovou grafiku s podporou animac´ı
GUI
(Graphical User Interface) grafick´e uˇzivatelsk´e rozhran´ı, vizu´aln´ı prostˇredky (napˇr. tlaˇc´ıtka, tabulky, menu, ikony) umoˇzn ˇ uj´ıc´ı snadn´e ovl´ad´an´ı aplikace
HTML
(HyperText Markup Language) znaˇckovac´ı jazyk s´emanticky popisuj´ıc´ı hypertextov´e dokumenty
HTTP
(HyperText Transfer Protocol) bezstavov´y protokol pro komunikaci mezi serverem a klientem pouˇz´ıvan´y pˇredevˇs´ım pro pˇrenos webov´ych str´anek
HTTPS
(HyperText Transfer Protocol Secure) HTTP protokol ˇsifrovan´y pomoc´ı SSL, chr´anˇen´y proti odposlechu a podvrˇzen´ı dat
JavaScript
interpretovan´y jazyk pouˇz´ıvan´y pˇredevˇs´ım pro zajiˇstˇen´ı interakce v hypertextov´em dokumentu
jQuery
JavaScriptov´a knihovna rozˇsiˇruj´ıc´ı moˇznosti samotn´eho jazyka, kter´a se snaˇz´ı zajistit jednotnou interpretaci JavaScriptu ve vˇsech prohl´ıˇzeˇc´ıch
MD5
(Message Digest Algorithm) kryptografick´a haˇsovac´ı funkce, kter´a ze vstupn´ıho ˇretˇezce libovoln´e d´elky vytvoˇr´ı v´ystup o pevn´e d´elce (hash, otisk)
MVC
(Model-View-Controller) softwarovˇe-architektonick´y vzor rozdˇeluj´ıc´ı aplikaci na tˇri vstrvy – datovou (model), ˇr´ıd´ıc´ı (controller) a vrstvu uˇzivatelsk´eho rozhran´ı (view)
MySQL
datab´azov´y syst´em poskytuj´ıc´ı komunikaci pomoc´ı dotaz˚ u jazyka SQL
open-source
software, jenˇz je volnˇe dostupn´y a s n´ım i jeho zdrojov´y text, kter´y m˚ uˇze uˇzivatel za urˇcit´ych podm´ınek nejen prohl´ıˇzet, ale i modifikovat
NEON
form´at serializace dat vyvinut´y v r´amci frameworku Nette, jeho syntaxe je velmi podobn´a YAML
PDF
(Portable Document Format) datov´y form´at pro generov´an´ı snadno pˇrenositeln´ych a tisku pˇrizp˚ usoben´ych dokument˚ u
sezen´ı
(session) informace o uˇzivateli doplˇ nuj´ıc´ı kontext HTTP poˇzadavk˚ u
62
PHP
programovac´ı, od verze 5 plnˇe objektovˇe orientovan´y jazyk pro vytv´aˇren´ı dynamick´ych str´anek
PNG
(Portable Network Graphics) grafick´y form´at pro rastrovou grafiku s podporou alfa kan´alu
XML
(eXtended Markup Language) znaˇckovac´ı jazyk s´emanticky popisuj´ıc´ı dokumenty
XSS
(Cross Site Scripting) u ´ tok podstrˇcen´ım vlastn´ıch (zpravidla ˇskodliv´ych) pˇr´ıkaz˚ u webov´ym str´ank´am s neoˇsetˇren´ymi v´ystupy
YAML
(YAML Ain’t Markup Language) form´at pro serializaci dat do podoby ˇciteln´e jak ˇclovˇekem, tak i poˇc´ıtaˇcem
SEO
(Search Engine Optimization) principy vytv´aˇren´ı webov´ych str´anek optimalizovan´ych pro internetov´e vyhled´avaˇce
URL
(Uniform Resource Locator) textov´y ˇretˇezec pˇresnˇe specifikuj´ıc´ı um´ıstˇen´ı dokumentu ˇci sluˇzby
vCard
souborov´y form´at pro v´ymˇenu osobn´ıch dat pouˇz´ıvan´y pˇredevˇs´ım jako elektronick´a podoba obchodn´ı vizitky
63
Literatura [1] ELMASRI, R. – NAVATHE, S. B. Fundamentals of Database Systems. 6. vyd´an´ı. USA: Addison-Wesley Publishing, 2010. ISBN-10: 0136086209, ISBN-13: 978-0136086208. [2] PHP: show source – Manual [online]. ©2001–2013 The PHP Group, posledn´ı zmˇena 19.4.2013 [cit. 24.4.2013]. Dostupn´e z: http://php.net/manual/en/function.show-source.php [3] PHP: mysql escape real string – Manual [online]. ©2001–2013 The PHP Group, posledn´ı zmˇena 19.4.2013 [cit. 25.4.2013]. Dostupn´e z: http://php.net/manual/en/function.mysql-real-escape-string.php [4] GROSS, J. Authentication and Authorization [online]. 13.3.1997 [cit. 7.3.2013]. Dostupn´e z: http://www.acm.uiuc.edu/workshops/security/auth.html [5] Srovn´an´ı parametr˚ u [online]. ©2013 Freehosting ENDORA.cz [cit. 8.4.2013]. Dostupn´e z: http://endora.cz/vlastnosti [6] FRIEDL, Stephen. SQL Injection Attacks by Example [online]. 27.12.2004, posledn´ı zmˇena 10.11.2007 [cit. 14.12.2012]. Dostupn´e z: http://www.unixwiz.net/techtips/sql-injection.html [7] Surprer. PHP Injection [online]. 11.6.2006 [cit. 14.12.2012]. Dostupn´e z: http://www.soom.cz/index.php?name=usertexts/show &aid=284&title=PHP-Injection [8] Thin Client Definition [online]. ©2013 TechTerms.com [cit. 24.4.2013]. Dostupn´e z: http://www.techterms.com/definition/thinclient [9] Zabezpeˇcen´ı pˇred zranitelnostmi [online]. ©2008–2013 Nette Foundation [cit. 25.4.2013]. Dostupn´e z: http://doc.nette.org/cs/vulnerability-protection 64
[10] Datab´aze & ORM [online]. ©2008–2013 Nette Foundation [cit. 29.4.2013]. Dostupn´e z: http://doc.nette.org/cs/database [11] About jQuery UI [online]. ©2013 jQuery Foundation [cit. 29.4.2013]. Dostupn´e z: http://jqueryui.com/about/ [12] HTML Global title Attribute [online]. ©1999–2013 Refsnes Data [cit. 26.4.2013]. Dostupn´e z: http://www.w3schools.com/tags/att global title.asp [13] McARTHUR, K. Pro PHP: Patterns, Frameworks, Testing and More. USA: Apress, 2008. ISBN-10: 1590598199, ISBN-13: 978-1590598191. [14] GRUDL D. Nette Framework: MVC & MVP [online]. 24.3.2009 [cit. 26.4.2013]. Dostupn´e z: http://www.zdrojak.cz/clanky/nette-framework-mvc-mvp [15] Routov´an´ı URL [online]. ©2008–2013 Nette Foundation [cit. 26.4.2013]. Dostupn´e z: http://doc.nette.org/cs/routing [16] MVC aplikace & presentery [online]. ©2008–2013 Nette Foundation [cit. 27.4.2013]. Dostupn´e z: http://doc.nette.org/cs/presenters ˇ [17] Sablony [online]. ©2008–2013 Nette Foundation [cit. 27.4.2013]. Dostupn´e z: http://doc.nette.org/cs/templating [18] ZAKAS N. C. – McPEAK J. – FAWCETT J. Professional Ajax. 2. vyd´an´ı. USA: John Wiley & Sons, 2007. ISBN-10: 0470109491, ISBN-13: 978-0470109496. [19] jQuery.ajax() [online]. ©2013 jQuery Foundation [cit. 29.4.2013]. Dostupn´e z: http://api.jquery.com/jQuery.ajax [20] AJAX & snippety [online]. ©2008–2013 Nette Foundation [cit. 29.4.2013]. Dostupn´e z: http://doc.nette.org/cs/ajax [21] HL´INA I. Statick´e ACL v modul´arnej aplik´acii [online]. ©2008–2013 Nette Foundation, posledn´ı zmˇena 1.2.2013 [cit. 29.4.2013]. Dostupn´e z: http://pla.nette.org/cs/staticke-acl 65
[22] COYIER C. All About Floats [online]. 8.7.2009 [cit. 1.5.2013]. Dostupn´e z: http://css-tricks.com/all-about-floats [23] CSS3 Properties [online]. ©2000–2013 Quackit.com [cit. 1.5.2013]. Dostupn´e z: http://www.quackit.com/css/css3/properties [24] KYRNIN J. What Are CSS Vendor Prefixes [online]. ©2013 About.com [cit. 1.5.2013]. Dostupn´e z: http://webdesign.about.com/od/css/a/css-vendor-prefixes.htm [25] COYIER C. Data URIs [online]. 25.3.2010 [cit. 1.5.2013]. Dostupn´e z: http://css-tricks.com/data-uris [26] DataTables – API [online]. ©2008–2013 SpryMedia [cit. 1.5.2013]. Dostupn´e z: http://www.datatables.net/api [27] Browsers Statictics [online]. ©1999-2013 Refsnefs Data [cit. 6.5.2013]. Dostupn´e z: http://www.w3schools.com/browsers/browsers stats.asp
66
Pˇ r´ılohy A
Diagram funkˇcn´ıch celk˚ u syst´emu Gadmin
B
N´avrh datab´aze syst´emu Gadmin
C
Testovac´ı arch
D
Testy kompatibility
E
ˇ Casov´ y pr˚ ubˇeh test˚ u
F
Hodnocen´ı GUI
G
Graf uˇcen´ı
H
Posudek zadavatele
I
Obsah pˇriloˇzen´eho CD
A Diagram funkčních celků systému Gadmin upravit/přidat lístek
nástěnka
vyhledat
výsledky hledání
zobrazit položku
výpisy poslat e-mail
nastavení
nový e-mail
poslat e-mail zobrazit položku
zákazníci
spravovat
karta zákazníka
přehled
přidat zákazníka
nový zákazník
přehled přidat řidiče/výdejnu
nový řidič
instalovat nový
finance
uživatel
kalendář
zálohování
výpisy
stravování
generovat uložit
generátor PDF výpisů
obsluhován řidičem
řidiči & výdejny
přidat
adresář s kontakty
přehled objednávek
přehled pohledávek trasy
přehled trasy
tisk přijaté objednávky
tisk záznamového archu
tisk výňatku z peněž. deníku
měsíční přehled
odpovědět
přidat záznam
tisk faktury
denní výpis pro kuchyni
tisk jídelníčku
tisk výčetky
zobrazit položku
karta řidiče
uložit uložit
upravit trasu
editace trasy zobrazit příchozí objednávky
zobrazit detaily
objednávky
příchozí
detail objednávky potvrdit, spojit se zákazníkem
spravovat
finance
peněžní deník
uložit
nový záznam
zobrazit pohledávky
Legenda
zobrazit detaily
pohledávky
detail pohledávky
některé prvky stránky lze upravovat, stránka má jak editační funkci, tak i informativní
potvrdit úhradu zobrazit vydané faktury
potvrdit úhradu
výstupní soubor
upravit
faktury
obsah stránky může být filtrován, přičemž nedojde k přechodu na jinou stránku / přechod způsobí na cílové stránce filtrování
editace faktury upravit
vytvořit fakturu
uložit
zobrazit detail
kalkulačka
nová faktura
uložit
detail faktury
některé položky na stránce lze editovat jen vybranými uživateli / přechod může provést jen privilegovaný uživatel
vydat fakturu uložit
stravování
jídelníčky
vytvořit
zobrazit jídelníček
detail jídelníčku přidat pokrm
přechod mezi funkčními celky (jednotlivými stránkami), popisek udává název volby, která přechod vyvolala
α
standardní funkční celek (stránka)
α
položka hlavního menu – modul
sestavit nový nový pokrm
správa pokrmů
α
hromadně rozeslat
B Návrh databáze systému Gadmin customer
routeItem
customer_id int(11) packing_id int(11) payment_id int(11) added date is_visible tinyint(1) is_company tinyint(1) name varchar(50) surname varchar(50) addr_street varchar(40) addr_house_no smallint(5) addr_city varchar(40) addr_zipcode varchar(5) phone int(11) email varchar(255) note text price float price_soup float requires_mail_sending tinyint(1)
customer_id distributor_id position
distributor int(11) int(11) smallint(6)
distributor_id user_id name phone is_canteen
user int(11) varchar(10) varchar(50) int(11) varchar(1)
user_id password role firstname surname
todo varchar(10) varchar(60) varchar(10) varchar(30) varchar(40)
todo_id user_id text date remove_on_expire
int(11) varchar(10) varchar(255) date tinyint(1)
contactPerson contactPerson_id customer_id firstname surname phone email
int(11) int(11) varchar(30) varchar(40) int(11) varchar(255)
menuItem
menuItemIdentificator
userSetting
menuItem_id int(11) menuItemIdentificator_id varchar(2) menu_id int(11) meal_id int(11) sideDish_id int(11) on_date date
menuItemIdentificator_id varchar(2) tax_id tinyint(4) label varchar(30) price float position smallint(6)
user_id name value
menu
meal
varchar(10) varchar(10) text
order order_id customer_id menuItem_id packing_id amount date price
payment payment_id title
int(11) int(11) int(11) int(11) smallint(4) date float
int(11) varchar(20)
received packing packing_id title price tax_id
int(11) varchar(20) float tinyint(4)
received_id customer_id is_served send_time firstname surname addr_street addr_house_no addr_city phone email note
menu_id is_approved is_static firstday
int(11) tinyint(1) tinyint(1) date
receivedItem int(11) int(11) tinyint(1) timestamp varchar(40) varchar(50) varchar(40) smallint(6) varchar(40) int(11) varchar(255) text
receivedItem_id received_id menuItem_id amount on_date
meal_id name description is_soup
int(11) varchar(100) varchar(255) tinyint(1)
sideDish int(11) int(11) int(11) tinyint(4) date
sideDish_id name
int(11) varchar(100)
tax tax_id name percentage
tinyint(4) varchar(30) tinyint(4)
Legenda Bachmanova notace
Označení klíčů
0..1 1 0..N 1..N
primární klíč cizí klíč standardní sloupec
Tento ERA model popisuje pouze tu část databáze, jež je využívána moduly aplikace implementovanými v rámci bakalářské práce, nikoliv kompletní databázi.
C Testovac´ı arch Aplikace Gadmin, kterou v n´asleduj´ıc´ıch chv´ıl´ıch budete testovat, slouˇz´ı ke snadn´e spr´avˇe stravovac´ıho zaˇr´ızen´ı, tj. umoˇzn ˇ uje obsluze pˇrij´ımat a zpracov´avat objedn´avky, definovat ˇci editovat trasy distributor˚ u a v neposledn´ı ˇradˇe uˇzivateli poskytuje kompletn´ı pˇrehled nad jeho z´akazn´ıky. Pˇredem dˇekuji za Vaˇsi spolupr´aci. Michal Kacerovsk´y
Informace o testov´ an´ı Jm´eno a pˇr´ıjmen´ı testera
.................................................
Datum testov´an´ı
.................................................
Pokyny pro testera 1. Testovan´a verze aplikace je plnˇe optimalizov´ana pouze pro prohl´ıˇzeˇc Google Chrome. Aˇckoliv ji lze spustit i v jin´ych prohl´ıˇzeˇc´ıch, nen´ı v nich zaruˇcena 100% kompatibilita, a proto pros´ım pouˇzijte v´yhradnˇe zm´ınˇen´y Google Chrome. 2. Pˇred samotn´ym testov´an´ım budete vyzv´ani k sezn´amen´ı se s prostˇred´ım aplikace. Nezlehˇcujte pros´ım tento poˇzadavek, skuteˇcnˇe si projdˇete jednotliv´a menu a pokuste se porozumˇet jednotliv´ym funkc´ım. 3. Pˇri testov´an´ı je d˚ uleˇzit´e, abyste se vˇenovali pouze instrukc´ım v testovac´ım archu a nebyli nuceni testy pˇreruˇsit. Pˇri testov´an´ı se zaznamen´av´a veˇsker´a Vaˇse interakce s aplikac´ı a s n´ı i ˇcasov´e u ´ daje. Pauzy mezi jednotliv´ymi kroky testov´an´ı by tedy mohly v´ysledky znehodnotit. Ujistˇete se proto pros´ım, ˇze testy nebudete muset pˇreruˇsit, a pokud se tak stane, vyˇz´adejte si pros´ım nov´y testovac´ı arch a proved’te je znovu. 4. Pokud m´ate zkuˇsenosti s ovl´ad´an´ım pˇredchoz´ı verze aplikace (oznaˇcov´ana jako Spr´avce), pokuste se pˇri testov´an´ı sledovat, jak se jednotliv´e ˇc´asti syst´emu zmˇenily, zda je jejich ovl´ad´an´ı nyn´ı pohodlnˇejˇs´ı ˇci naopak. 5. Pˇri hodnocen´ı pouˇz´ıvejte hodnoty 1–5 jako zn´amky ve ˇskole. Pˇri urˇcov´an´ı n´aroˇcnosti konkr´etn´ıho kroku berte v potaz, ˇze hodnota 1 znamen´a nejniˇzˇs´ı obt´ıˇznost. 1
Profil testera Pro vyhodnocen´ı v´ysledk˚ u je d˚ uleˇzit´e vˇedˇet, jak´e jsou Vaˇse dovednosti pro pr´aci s poˇc´ıtaˇcem a jak ˇcasto s programy charakternˇe podobn´ymi Gadminu pracujete. Zaˇskrtnˇete pros´ım pravdiv´a tvrzen´ı. Um´ım: vytvoˇrit jednoduch´y dokument v textov´em editoru, vytvoˇrit tabulku s pouˇzit´ım z´akladn´ıch funkc´ı (napˇr. SUMA, PR˚ UMˇ ER) v tabulkov´em procesoru, zmenˇsit fotografii a upravit jej´ı barvy v grafick´em editoru, komunikovat prostˇrednictv´ım instant-messanger˚ u (napˇr. Skype), odes´ılat a pˇrij´ımat e-maily, pouˇz´ıvat online n´astroje, jako jsou napˇr. Google Docs, Mapy.cz, Aukro.cz. pouˇz´ıvat kl´avesov´e zkratky pro pr´aci s prvky formul´aˇre (Tab, Shift+Tab)
V minulosti jsem pracoval(a) s pˇredchoz´ı verz´ı syst´emu, kaˇzd´y den vyuˇz´ıv´am internetov´ych sluˇzeb, dok´aˇzi rozliˇsit a popsat pojmy tlaˇc´ıtko, odkaz, menu a zaˇskrt´avac´ı pole.
Jsem: student / nezamˇestnan´y zamˇestnanec stravovac´ıho zaˇr´ızen´ı zamˇestnanec nebo podnikatel v jin´em odvˇetv´ı
Spuˇstˇ en´ı aplikace Otevˇrete prohl´ıˇzeˇc Google Chrome a pˇrejdˇete na adresu http://varimevam.cz/gadmin-playground Zobraz´ı se u ´ vodn´ı obrazovka aplikace. Jako pˇrihlaˇsovac´ı u ´ daje pouˇzijte jm´eno tester a heslo test. Klepnut´ım na pˇrihl´asit vstoup´ıte do syst´emu. 2
Sezn´ amen´ı s aplikac´ı N´asleduj´ıc´ı ˇc´ast nen´ı souˇc´ast´ı testov´an´ı, pouze V´am d´av´a prostor pro sezn´amen´ı se s aplikac´ı. Prohl´ednˇete si jednotliv´a menu, prozkoumejte jejich obsah a v´yznam, vyzkouˇsejte funkcionalitu ovl´adac´ıch prvk˚ u. V tuto chv´ıli m˚ uˇzete v aplikaci prov´adˇet libovoln´e zmˇeny. Ke snadnˇejˇs´ı orientaci v syst´emu Gadmin by V´am mˇela pomoci kontextov´a n´apovˇeda, kterou jsou opatˇreny t´emˇeˇr vˇsechny podstatn´e prvky – podrˇz´ıte-li na mal´y okamˇzik kurzor nad vybran´ym objektem, zobraz´ı se ˇcern´a bublina se struˇcn´ym popisem v´yznamu prvku nebo s detaily, kter´e se k dan´e poloˇzce vztahuj´ı. Aplikace je tak´e vybavena interaktivn´ım pr˚ uvodcem, jenˇz m´a sezn´amen´ı se syst´emem zjednoduˇsit a urychlit. Pokud aktu´alnˇe zobrazen´e menu obsahuje tohoto pr˚ uvodce, zobraz´ı se na liˇstˇe um´ıstˇen´e pod hlavn´ım menu tlaˇc´ıtko tipy & triky. Klepnut´ım na nˇej otevˇrete v prav´em doln´ım rohu obrazovky pr˚ uvodce s tipy. Prvek, k nˇemuˇz se text vztahuje, vˇzdy aplikace oznaˇc´ı ˇcerven´ym r´ameˇckem. Tipy & triky m˚ uˇzete kdykoliv zobrazit i bˇehem testov´an´ı. Aˇz budete m´ıt pocit, ˇze se v aplikaci orientujete, pˇrejdˇete na adresu http://varimevam.cz/gadmin Aplikace se V´as zept´a, zda chcete ze str´anky skuteˇcnˇe odej´ıt. Vyberte Opustit tuto str´anku. Nyn´ı se nach´az´ıte ve verzi aplikace urˇcen´e k testov´an´ı.
ˇ ast I / Nov´ C´ y z´ akazn´ık Stravovac´ı zaˇr´ızen´ı z´ıskalo nov´eho z´akazn´ıka. Ten si pˇreje odeb´ırat pokrmy v kastr˚ ulc´ıch a platit je pˇrevodem. S t´ımto z´akazn´ıkem jste se dohodli na sn´ıˇzen´ı ceny pol´evky o 20 %, tj. jej´ı cena bude ˇcinit 16 Kˇc. Vloˇ zte z´ akazn´ıka na z´akladˇe uveden´ych u ´ daj˚ u do datab´aze. ˇ VSEZEP, s.r.o. – H´ajek 35, 345 06 Vˇseruby Tel.: +420 379 562 311 Zamˇestnanec t´eto spoleˇcnosti, Petr Vondr´aˇcek, kter´y s V´ami odbˇer obˇed˚ u vyjedn´aval, telefonoval z ˇc´ısla +420 774 153 339, uvedl tak´e svoji e-mailovou adresu vondraˇ [email protected]. Pˇ ripojte tento kontakt k z´akazn´ıkovi VSEZEP, s.r.o., vytvoˇren´emu v pˇredchoz´ım kroku. pˇrehlednost formul´aˇre nov´y z´akazn´ık
1
2
3
4
5
vkl´ad´an´ı kontaktn´ı osoby k z´akazn´ıkovi
1
2
3
4
5
celkov´a n´aroˇcnost ˇc´asti I
1
2
3
4
5
3
ˇ ast II / Distribuce C´ ˇ Novˇe pˇridan´y z´akazn´ık VSEZEP, s.r.o, se sice nyn´ı nach´az´ı v datab´azi z´akazn´ık˚ u, ale zat´ım jej nikdo neobsluhuje – nen´ı zahrnut v trase nˇekter´eho z distributor˚ u, proto pˇ ridejte nov´ eho ˇ ridiˇ ce s Vaˇs´ım jm´enem a smyˇslen´ym telefonn´ım ˇc´ıslem. Tohoto ˇridiˇce propojte s uˇzivatelsk´ym u ´ˇctem, k nˇemuˇz jste nyn´ı pˇrihl´aˇseni (Pavel Nov´ak). Z trasy ˇridiˇce Ondra odeberte n´ asleduj´ıc´ı z´ akazn´ıky: • Tesaˇr´ık Frantiˇsek • SANO, s.r.o. • Peˇcen´y Jan Zm´ınˇen´e z´akazn´ıky vloˇ zte do trasy ˇridiˇce s Vaˇs´ım jm´enem. Pˇridejte k nim tak´e ˇ z´akazn´ıka VSEZEP, s.r.o. (Na poˇrad´ı z´akazn´ık˚ u v trase nez´aleˇz´ı.) pˇrehlednost formul´aˇre nov´y distributor
1
2
3
4
5
editace trasy
1
2
3
4
5
celkov´a n´aroˇcnost ˇc´asti II
1
2
3
4
5
ˇ ast III / Objedn´ C´ avky ˇ Z´akazn´ık VSEZEP, s.r.o., si na u ´ ter´y 23. dubna 2013 pˇreje objednat pokrmy uveden´e v tabulce n´ıˇze. Nepˇrehl´ednˇete, ˇze si z´akazn´ık u posledn´ı poloˇzky vyˇz´adal zmˇenu balen´ı! Po jejich vloˇzen´ı do datab´aze ovˇeˇrte na kartˇe z´akazn´ıka v r´ameˇcku Statistiky, ˇze jeho celkov´a u ´ trata nyn´ı ˇcin´ı 340,00 Kˇc (za 5 pol´evek a 5 pokrm˚ u). 5× pol´evka
Kulajda
3× pokrm 1
Vepˇrov´a krkovice po selsku, houskov´y knedl´ık
2× st´al´y pokrm 2 Smaˇzen´y vepˇrov´y ˇr´ızek, brambory (zabalit do vaxu) pr´ace s editorem objedn´avek
1
2
3
4
5
zp˚ usob zmˇeny balen´ı a ceny u konkr´etn´ıho pokrmu
1
2
3
4
5
celkov´a n´aroˇcnost ˇc´asti III
1
2
3
4
5
4
ˇ ast IV / Pˇ C´ r´ıchoz´ı objedn´ avky Gadmin po celou dobu signalizuje, ˇze v menu Objedn´avky ˇcekaj´ı na odbaven´ı 3 pˇr´ıchoz´ı poˇzadavky. Zobrazte pˇr´ıchoz´ı objedn´avku od Am´alie Kr´alovcov´e. V souˇcasn´e chv´ıli nen´ı moˇzn´e objedn´avku schv´alit, protoˇze syst´em osobu s t´ımto jm´enem nenalezl v datab´azi. Proto je nutn´e, abyste tuto novou z´akaznici pˇ ridali do syst´ emu (lze jedn´ım kliknut´ım). Jakmile pan´ı Kr´alovcovou pˇrid´ate do datab´aze a vr´at´ıte se k jej´ı objedn´avce, Gadmin V´as upozorn´ı, ˇze pravdˇepodobnˇe rozpoznal odesilatele a nab´ıdne V´am jeho spojen´ı s touto objedn´avkou. Ve chv´ıli, kdy je pˇr´ıchoz´ı objedn´avka propojena se z´akazn´ıkem, m˚ uˇzete jej´ı poloˇzky vloˇzit do datab´aze. V pˇr´ıpadˇe pan´ı Kr´alovcov´e tedy potvrd´ıte objedn´avku boloˇ nsk´ych ˇspaget. Zobraz´ı se v´ystraha – Kr´alovcov´a Am´alie totiˇz nen´ı zaˇrazena do ˇz´adn´e z tras, proto ji pˇriˇrad’te k nˇekter´emu z distributor˚ u podobnˇe jako v pˇredchoz´ı ˇc´asti. N´aslednˇe pˇrijmˇete tak´e objedn´avky Tomanov´e Zdeˇnky a Peˇcen´eho Honzy. Pot´e pomoc´ı editoru objedn´avek zmˇ en ˇ te balen´ı objedn´avky Zdeˇnky Tomanov´e (dne 29. dubna, ˇridiˇc Ondra) na vax a cenu upravte na 35,00 Kˇc. Stejn´a ˇc´astka by se pak mˇela objevit v celkov´e u ´ tratˇe na kartˇe tohoto z´akazn´ıka. automatick´e pˇrid´an´ı z´akazn´ıka na z´akladˇe u ´ daj˚ u z pˇr´ıchoz´ı objedn´avky
1
2
3
4
5
pˇr´ıjem (schv´alen´ı) pˇr´ıchoz´ı objedn´avky
1
2
3
4
5
celkov´a n´aroˇcnost ˇc´asti IV
1
2
3
4
5
Dokonˇ cen´ı testov´ an´ı Abyste u ´ spˇeˇsnˇe dokonˇcili testov´an´ı, klepnˇete v uˇzivatelsk´em menu (jm´eno Pavel Nov´ak v horn´ı ˇc´asti aplikace) na poloˇzku Ukonˇcit testov´an´ı. Aplikace vygeneruje soubor se souhrnem Vaˇs´ı interakce bˇehem testov´an´ı a nab´ıdne jej ke staˇzen´ı. Uloˇzte jej a odeˇslete na e-mail [email protected]. Pozn´ amka M˚ uˇze se st´at, ˇze syst´em nenab´ıdne soubor ke staˇzen´ı, ale zobraz´ı jej pˇr´ımo v prohl´ıˇzeˇci. V takov´em pˇr´ıpadˇe pros´ım klepnˇete prav´ym tlaˇc´ıtkem a vyberte moˇznost Uloˇzit jako.... N´aslednˇe jej odeˇslete na uveden´y e-mail.
5
Z´ avˇ ereˇ cn´ y pr˚ uzkum N´asleduj´ıc´ı ot´azky sleduj´ı, jak se V´am se syst´emem Gadmin pracovalo, a poskytuj´ı V´am moˇznost vyj´adˇrit se k jeho souˇc´astem p´ısemnou formou. Jak na V´as p˚ usob´ı vzhled aplikace? .............................................................................. Je hlavn´ı menu a podmenu dobˇre koncipov´ano? Provedli byste v nˇem zmˇeny? .............................................................................. .............................................................................. Je pr˚ uvodce tipy&triky uˇziteˇcn´y? Pomohl V´am l´epe se orientovat? .............................................................................. Rozumˇeli jste vˇsem funkc´ım a ikon´am? Pokud ne, kter´ym? .............................................................................. .............................................................................. Kter´e funkce V´am pˇripadaj´ı uˇziteˇcn´e a mysl´ıte si, ˇze najdou sv´e vyuˇzit´ı? Kter´e naopak ne? Postr´ad´ate nˇejakou v r´amci implementovan´eho rozsahu? .............................................................................. .............................................................................. .............................................................................. Zde m˚ uˇzete vyj´adˇrit V´aˇs n´azor na aspekty, jeˇz nebyly zm´ınˇeny. Co je podle V´as nejvˇetˇs´ım pˇr´ınosem v nov´e verzi syst´emu oproti star´e? (odpov´ı pouze ti, co se starou verz´ı pracovali) .............................................................................. .............................................................................. .............................................................................. .............................................................................. .............................................................................. .............................................................................. .............................................................................. 6
dynamika
uživatelské rozhraní 1
dodržení layoutu kulaté rohy rámečku barevný přechod tlačítek vnitřní/vnější stín stín textu animace CSS vlastností průhlednost grafika s alfa kanálem vytažení objektu (outline) ajaxifikace odkazů ajaxifikace formulářů ostatní AJAX plugin dataTables plugin powerTip plugin dayPicker editor objednávek centrování aktiv. pole editoru editace položek trasy filtrace položek editoru trasy blokování navigace v prohlížeči průvodce tipy&triky obnovení přihlášení funkce nahoru placeholder vstupu podpora systému Gadmin
3
1
4
2
100 %
90 %
96 %
69 %
ukládá i vstupy, jejichž hodnota nebyla změněna; pouze získaly a ztratily fokus při změně tipu nedochází ke správnému zarovnání boxu do pravého dolního rohu 3 nezobrazuje šipku směřující na prvek, k němuž je kontextová nápověda vázána 4 nesprávně zobrazen, drop efekt má neobvyklé chování (nebránící správné funkcionalitě) 2
Internet Explorer 7.0
Internet Explorer 9.0
Mozilla Firefox 20.0
Opera 12.15
Google Chrome 26.0
D Testy kompatibility
17 %
E Časový průběh testů
0 min 5 min 10 min 15 min 20 min 25 min 30 min 35 min 40 min 45 min 50 min
tester A
tester B
tester C
tester D
tester E
tester F
tester G
tester H
tester I
tester J
tester K
tester L
F Hodnocení GUI
přehlednost formuláře nový zákazník vkládání kontaktní osoby celková náročnost části I přehlednost formuláře nový distributor
5
4
3
2
1,83
1,75
2,17
editace trasy
práce s editorem objednávek způsob změny balení a ceny u pokrmu
1,58
celková náročnost části III automatické přidání zákazníka z příchozí objednávky
1,83
1,58
2,25
1,75
nejhorší hodnocení
celková náročnost části II
průměrné hodnocení
schválení příchozí objednávky celková náročnost části IV nejlepší hodnocení
1,33
1
1,08
1,25
1,17
G Graf učení 0
2 min
4 min
vložen zákazník
vložena kontaktní osoba
vložen řidič
odstraněni zákazníci z trasy
vloženi zákazníci do trasy
vložena objednávka
balení objednávky editováno
vložen zákazník z příchozích
zákazník spojen s objednávkou I
objednávka I schválena
zákazník zařazen do trasy
objednávka II schválena
zákazník spojen s objednávkou III
objednávka III schválena
změna ceny a balení objednávky II tester A
tester B
tester C
tester E
6 min
8 min
H Posudek zadavatele Uˇz p˚ uvodn´ı program mi pomohl vyˇreˇsit spoustu starost´ı a probl´em˚ u, avˇsak postupem ˇcasu se objevily dalˇs´ı. Ty nejvˇetˇs´ı vˇsak spoˇc´ıvaly v placen´ı obˇed˚ u, protoˇze m´a naˇse spoleˇcnost mnoho z´akazn´ık˚ u, u nichˇz se cena m˚ uˇze liˇsit (napˇr. v z´avislosti na zp˚ usobu balen´ı odeb´ıran´ych pokrm˚ u). Nov´a verze t´eto aplikace n´am vˇsak umoˇzn´ı spoˇc´ıtat celkovou trˇzbu za urˇcit´e obdob´ı mnohem snadnˇeji. Umoˇzn´ı pˇriˇc´ıtat k cenˇe obˇeda i n´aklady na jeho balen´ı, coˇz jsem byla doposud nucena dˇelat ruˇcnˇe, na pap´ıˇre. Obzvl´aˇst’ nadˇsen´a jsem z automatick´eho vkl´ad´an´ı pˇr´ıchoz´ıch objedn´avek. Tato funkce mi uˇsetˇr´ı hodnˇe ˇcasu, protoˇze nebudu muset kaˇzd´y den sˇc´ıtat objedn´avky z e-mail˚ u pˇrijat´ych od z´akazn´ık˚ u. I celkov´y pohled na aplikaci je nyn´ı mnohem lepˇs´ı. Zlepˇsila se pˇrehlednost jednotliv´ych panel˚ u a tak´e jejich funkcionalita proˇsla ˇr´adn´ymi zmˇenami. Velice praktick´y mi pˇripad´a pr˚ uvodce tipy&triky, kter´y si mohu zobrazit, kdyˇz zrovna potˇrebuji. Rovnˇeˇz oceˇ nuji informaci o tom, kdo aktu´alnˇe slav´ı sv´atek, a funkci n´astˇenky, kter´a mi bude pˇripom´ınat d˚ uleˇzit´e u ´ koly, na nˇeˇz bych mohla jinak snadno zapomenout. Tak´e ikonky, kter´e pˇr´ımo v objedn´avce signalizuj´ı, jak´ym zp˚ usobem bude pokrm balen, jsou bez pochyby usnadnˇen´ım a zrychluj´ı orientaci. Urˇcitˇe existuje mnoho vˇec´ı, kter´e bych pochv´alila, ale nedok´aˇzu si vˇsechny vybavit najednou, pravdˇepodobnˇe je vˇsak ocen´ım pˇri nasazen´ı syst´emu do provozu. Tak rozmanit´y objedn´avkov´y syst´em, kter´y naˇse stravovac´ı zaˇr´ızen´ı nyn´ı m´a, nebyli schopni vytvoˇrit ani specializovan´ı odborn´ıci z Prahy, kteˇr´ı mˇe nutili pˇripravovat si do jejich aplikace tabulky v Excelu, a to vˇcetnˇe vzorc˚ u. Za tuto radu si u ´ˇctovali nemalou ˇc´astku. Dlouho jsme hledali program, kter´y by zvl´adal vˇsechny poˇzadovan´e funkce, a ani jsme nedoufali, ˇze jej nˇekdo dok´aˇze vytvoˇrit. Nyn´ı jsme ho naˇsli, to je on.
Hana Markov´a administrativn´ı pracovnice stravovac´ıho zaˇr´ızen´ı
I Obsah pˇ riloˇ zen´ eho CD Adres´ aˇ rov´ a struktura disku source-files ..................zdrojové soubory systému database..............sady příkazů pro vytvoření struktury a vzorových dat v databázi gadmin ................zdrojové soubory webové aplikace Gadmin testlogger ............skript pro zaznamenávání interakce při testování thesis-text ...................zdrojové soubory textu práce complete..............kompletní sazba bakalářské práce v PDF formátu source-files...........soubory a adresáře s obrazovými soubory appendices...PDF soubory příloh document.....zdrojové TEX soubory a EPS obrázky
Zprovoznˇ en´ı syst´ emu Syst´em Gadmin je webov´a aplikace, pro jej´ıˇz instalaci mus´ı prostˇred´ı webov´eho serveru splˇ novat minim´aln´ı poˇzadavky frameworku Nette1 a poskytovat datab´azov´y syst´em MySQL, vˇcetnˇe typu u ´ loˇziˇstˇe InnoDB. Gadmin je plnˇe kompatibiln´ı s aktu´aln´ı verz´ı prohl´ıˇzeˇce Google Chrome. Chcete-li jej spouˇstˇet v jin´em prohl´ıˇzeˇci, ovˇeˇrte nejdˇr´ıve, do jak´e m´ıry syst´em podporuje (viz pˇr´ıloha D). 1. Pˇreneste obsah sloˇzky /source-files/gadmin do adres´aˇre webov´eho serveru, z nˇehoˇz m´a b´yt Gadmin dostupn´y. 2. Do datab´aze importujte SQL soubory ze sloˇzky /source-files/database v poˇrad´ı 1 - struktura.sql, 2 - data.sql a nakonec 3 - integrita.sql. Import vˇsech tˇr´ı soubor˚ u v uveden´em poˇrad´ı je nezbytnˇ e nutn´ y pro spr´avn´y chod aplikace. 3. Z adres´aˇre instalace pˇrejdˇete do /app/config a otevˇrete soubor config.neon. Je-li potˇreba, upravte pˇr´ıstupov´e u ´ daje k datab´azi (podrobnˇeji se konfiguraci v textu pr´ace vˇenuje kapitola 4.2.6). Ujistˇete se, ˇze v souboru nedoˇslo k nahrazen´ı znak˚ u tabul´atoru mezerami, a uloˇzte jej. 4. Gadmin je nyn´ı plnˇe funkˇcn´ı. K pˇr´ıstupu do syst´emu pouˇzijte uˇzivatelsk´e jm´eno tester a heslo test. 1
Poˇzadavky frameworku jsou dostupn´e z: http://doc.nette.org/cs/requirements