Tvorba webových interaktívnych aplikácií pomocou nástroja Silverlight Interactive web applications using the Silverlight

Transcription

1 Bankovní institut vysoká škola Praha Zahraničná vysoká škola Banská Bystrica Katedra kvantitatívnych metód a informatiky Tvorba webových interaktívnych aplikácií pomocou nástroja Silverlight Interactive web applications using the Silverlight Diplomová práca Autor: Peter Chovanko Informační technologie a management Vedúci práce: Doc. RNDr. Juraj Pančík, CSc. Banská Bystrica jún, 2012

2 Vyhlásenie: Vyhlasujem, že som diplomovú prácu spracoval samostatne s použitím uvedenej literatúry. Svojím podpisom potvrdzujem, že odovzdaná elektronická verzia práce je identická s jej tlačenou verziou a som oboznámený so skutočnosťou, že sa práca bude archivovať v knižnici BIVŠ a ďalej bude sprístupnená tretím osobám prostredníctvom internej databázy elektronických vysokoškolských prác. V Banskej Bystrici dňa Peter Chovanko

3 Poďakovanie: Na tomto mieste sa chcem poďakovať vedúcemu mojej diplomovej práce Doc. RNDr. Jurajovi Pančíkovi, CSc. za jeho vecné rady, pripomienky a názory, a za čas venovaný konzultáciám pri písaní tejto diplomovej práce.

4 Anotácia Účelom diplomovej práce je popísať, analyzovať a navrhnúť webovú aplikáciu v prostredí Silverlight pomocou nástroja Microsoft Expression Blend. V teoretickej časti sa diplomová práca zameriava na popis prostredia Silverlight. V analytickej časti diplomová práca skúma využitie RIA (Rich Internet Apllication) technológií. Praktická časť diplomovej práce sa zaoberá návrhom a realizáciou webovej aplikácie. Annotation The purpose of this thesis is to describe, analyze and design a web application in a Microsoft Silverlight by using Expression Blend. In the theoretical part of the thesis focuses on the description of the Silverlight environment. The analytical part of the thesis examines the use of RIA (Rich Internet Apllication) technology. The practical part of the thesis deals with the design and implementation of web applications.

5 Obsah Úvod Teoretické východiská problematiky Silverlight Microsoft Silverlight História platformy Silverlight Webová technológia Silverlight Silverlight versus Windows Presentation Foundation (WPF) Nástroje pre vývoj Silverlight aplikácií Charakteristika.NET Framework Balík nástrojov - Microsoft Web Platform Rodina nástrojov Microsoft Expression Studio Microsoft Expression Blend Mirosoft Expression Web Webový štandard XML Jazyk XAML v spolupráci medzi návrhármi a vývojármi Vývoj technológie Silverlight Architektúra platformy Silverlight Bezpečnosť platformy Silverlight Opis používaných RIA technológií HTML Java JavaScript Ajax Adobe Flash Adobe Flex ASP.NET PHP Redakčné systémy Analýza využitia RIA technológií Adobe Flash vs. Microsoft Silverlight Vývojové prostredie Štruktúra aplikácie Audio a Video

6 2.1.4 Podporované obrazové formáty Dostupnosť Podpora operačných systémov Tvorba animácií Textová reprezentácia Podpora web kamery Rozmiestnenie súborov Webhosting Zhodnotenie Prieskum používaných RIA technológií v SR Metodológia získavania dát Zhodnotenie prieskumu Návrh a realizácia webovej aplikácie v prostredí Silverlight Nástroje na tvorbu RIA aplikácie a webu Realizácia webovej aplikácie Požiadavky na webovú aplikáciu Popis aplikácie Založenie nového projektu Tvorba klientskej aplikácie v prostredí Expression Blend Priradenie funkcii do aplikácie Realizácia Web stránky pre prezentáciu aplikácie Požiadavky na web stránku Vytvorenie webu založeného na šablóne Úprava šablóny DWT Úprava kaskádových štýlov Záver Zoznam použitej literatúry Zoznam obrázkov Zoznam tabuliek Zoznam použitých skratiek Prílohy

7 Úvod Internet.je v dnešnej dobe jedným z najdynamickejšie sa rozvíjajúcich projektov v moderných dejinách ľudstva. Bežní používatelia internetu však stále pociťujú rozdiel medzi webovými a klientskymi aplikáciami najmä v prezentačnom rozhraní a používateľskom komforte. Jednou z významných spoločností na poli internetu je aj Microsoft. V minulosti sa už pokúšal uspieť na trhu webových prehliadačov. Teraz Microsoft znovu skúša šťastie v oblasti multimediálnych rozšírení pre webové prehliadače. Technológia Silverlight z jeho dielne rozširuje prezentačnú úroveň prehliadača webového obsahu o nové možnosti. Silverlight je kompletne postavený na vektorovej grafike. V tejto oblasti má však vybudovanú veľmi silnú pozíciu spoločnosť Adobe so svojím produktom Flash, takže Silverlight to nebude mať v konkurenčnom boji ľahké. Cieľom tejto diplomovej práce je charakterizovať a opísať vytváranie a využitie interaktívnych aplikácií pomocou nástroja Silverlight. Prvá kapitola sa zameria na popis technológie Silverlight, nástrojmi ktoré slúžia na vytvorenie a úpravy prezentačnej vrstvy webových aplikácií. Podrobne opíšeme prostredie Microsoft Expression Blend 4. Bližšie rozoberieme webový štandard XML. Taktiež sa budeme zaoberať vývojom platformy Silverlight, jeho architektúrou a bezpečnosťou. V druhej podkapitole bližšie popíšeme používané RIA technológie. V druhej kapitole analyzujeme využitie RIA technológií. Prvá podkapitola bude zahŕňať vzájomné porovnanie RIA technológií Adobe Flash a Microsoft Silverlight. Druhá podkapitola bude zameraná na prieskum používaných RIA technológií v bankovom sektore SR. Posledná kapitola diplomovej práce bude zameraná na návrh a realizáciu prezentačného rozhrania založeného na technológií Microsoft Silverlight. Na tvorbu aplikácie bude využité prostredie Microsoft Expression Blend 4 a na tvorbu webovej stránky prostredie Microsoft Expression Web 4. 7

8 1 Teoretické východiská problematiky Silverlight Prvá kapitola je rozdelená na dve časti. Prvá časť sa bude zaoberať opisom technológie Silverlight. Druhá časť bližšie charakterizuje používané RIA technológie pri tvorbe webových aplikácií. 1.1 Microsoft Silverlight Microsoft Silverlight je plug-in nezávislý na platforme a internetovom prehliadači, ktorý umožňuje prácu s novou generáciou bohatých a interaktívnych internetových stránok a aplikácií (RIA), založených na platforme.net. Ako technológia Silverlight ponúka flexibilný programovací model, ktorý podporuje aj AJAX, VB, C#, Python a Ruby a zároveň umožňuje integráciu do existujúcich web aplikácií. (Microsoft, 2012) História platformy Silverlight História platformy Silverlight sa začala písať v septembri 2007, kedy spoločnosť Microsoft zároveň s finálnou verziou Silverlight 1 predstavila aj alfu verziu1.1 Táto verzia bola následne premenovaná na Silverlight 2 zatiaľ čo Silverlight 1 využíval ako programovací jazyk iba JavaScript. Vo verzii 2 už bolo možné v plnej miere využívať.net jazyky. V roku 2009 bola uvedená a krátko nato aj komerčne dostupná verzia Silverlight 3. Zdalo by sa, že pre tento rok je to z pohľadu histórie platformy Silverlight všetko, opak je však pravdou. Na konferencii PDC 09 (Prfessional Developer Conference) bola v novembri 2009 ohlásená verejne dostupná beta verzia Silverlight 4 (Anderson, 2010). Plná verzia Silverlight 4 bola vydaná v apríli V decembri 2010 bola ohlásená beta verzia Silverlight 5, ktorá vyšla v prvej polovici roku Plná verzia Silverlight 5 vyšla v decembri 2011 (Microsoft, 2012) Webová technológia Silverlight Nová beta. verzia technológie Silverlight 4 prišla len štyri mesiace po komerčnej dostupnosti verzie 3. Z najvýznamnejších noviniek spomenieme podporu webovej kamery a mikrofónu, multicast streaming, ktorý umožňuje aj zrýchlené, prípadne spomalené prehrávanie videa. Niektoré novinky, ako napríklad: výstup priamo na tlačiareň, zabudovaný Rich text editor a podpora schránky, čo umožňuje kopírovať Silverlight DataGrid tabuľky do Excelu, podpora pravého tlačidla myši, drag and drop (uchop a pusť) 8

9 a vloženie HTML stránky, sú určené pre tvorbu takzvaných biznis aplikácií. Nové možnosti poskytuje aj zdieľanie dll knižníc medzi platformami Silverlight 4 a.net Framework 4. Silverlight 4 je viac ako dvakrát rýchlejší, štartuje o tretinu rýchlejšie než predchádzajúce verzie (Michail, 2010). Za necelé dva roky svojej histórie vzrástol počet inštalácií na klientskych počítačoch až na 350 miliónov, pričom krivka rastu je exponenciálna. Technológiu Silverlight využíva viac než vývojárov a dizajnérov. Spoločnosť Microsoft má v súvislosti s touto technológiou 200 partnerov v 30 krajinách a využíva ju aj v takmer 200 svojich produktoch a webových projektoch. V globálnom meradle je k dispozícii viac než aplikácií (Michail, 2010). Obrázok 1: Nárast počtu používateľov produktu Silverlight Zdroj: (Michail, 2010) Silverlight versus Windows Presentation Foundation (WPF) Microsoft poskytuje dve moderné technológie pre tvorbu prezentačného rozhrania Windows Presentation Foundation, ktorý bol v etape vývoja označený ako Windows Presentation Foundation Everywhere (WPF/E) a Silverlight. V tomto označení sa skrýva aj vysvetlenie rozdielov medzi technológiami WPF a Silverlight. Zatiaľ čo WPF aplikácia beží len pod operačnými systémami Windows s nainštalovanou technologickou platformou.net Framework 3.0 (prípadne novou verziou 4.0, ktorá je súčasťou nového vývojového prostredia Visual Sudio 2010), teda Windows 7, Windows Vista alebo Windows XP, prípadne na operačných systémoch Windows Server 2008, Silverlight aplikácie bežia aj na iných klientskych platformách, napr. Mac. Zjednodušene by sa dalo povedať, že Silverlight je multiplatformová podmnožina WPF (Ghoda, 2010). 9

10 1.1.4 Nástroje pre vývoj Silverlight aplikácií Pre vývoj prezentačného rozhrania založeného na technológii Silverlight slúžia dva základné nástroje: návrhové prostredie Microsoft Expression Blend, ktoré je dostupné vo verzii 1-4, prípadne nová verzia, dostupná pod názvom Expression Blend 5 Developer Preview pre Silverlight 5, ktorá je dostupná od septembra 2011 a vývojové prostredie Visual Studio 2008, respektíve nová verzia Visual Studio Všetky moderné. vývojárske nástroje akceptujú a podporujú tímovú spoluprácu pri vývoji softwarových projektov ako jeden z hlavných pilierov svojej koncepcie (Microsoft, 2012) Charakteristika.NET Framework Zjednocujúcim prvkom pre aplikácie vyvíjané pomocou nástrojov Microsoftu je aj technologická platforma.net Framework. Tá poskytuje stavebné bloky, teda akýsi prefabrikovaný software pre riešenie častých programátorských úloh. Pripojené aplikácie využívajúce.net Framework efektívne modelujú procesy podnikateľskej sféry a uľahčujú integráciu systémov v heterogénnych prostrediach a tak podstatne znižujú potrebu písania programového kódu. Tým skracujú dobu vývoja a dovoľujú vývojárom sústrediť sa na riešenie vlastného problému..net Framework poskytuje rozhranie pre rýchlu a efektívnu tvorbu aplikácií (Ghoda, 2010) Balík nástrojov - Microsoft Web Platform Podľa najnovšej stratégie Microsoftu sú nástroje pre vývoj webových aplikácií sústredené v jednom inštalačnom balíku Microsoft Web Platform. Po spustení programu si môžete vybrať, ktoré nástroje si nainštalujete, prípadne si môžete nainštalovať Visual Web Developer 2008 alebo 2010 Epxpress Edition ako samostatný produkt a podľa potreby ho doplniť o rozšírený balík Silverlight 3 Tools, alebo Silverlight 4 Tools (Anderson, 2010). Ak sa rozhodnete robiť vlastné aplikácie, existuje veľa možností ako ich využiť pre svoje potreby. Je aj veľa dostupných aplikácií, ktoré poskytujú širokú škálu funkcií, ktoré môžete použiť pre svoj web. Najlepšie zo všetkého je, že mnohé z týchto aplikácií sú open source (voľne dostupné), čo znamená, že tvorca aplikácie robí zdrojový kód, ktorý je vám k dispozícii a zvyčajne si ho môžete prispôsobiť svojim vlastným potrebám. Toto zabráni nutnosti vytvoriť si vlastnú verziu tohto kódu (Anderson, 2010). 10

11 1.1.7 Rodina nástrojov Microsoft Expression Studio Microsoft, súčasne s vydaním platformy Silverlight, dal k dispozícii vývojárom produkty z rodiny Expression Studio. Vývojári si podľa svojich potrieb a požadovaného rozsahu práce môžu vybrať buď komplexný balík pre dizajnérov, tvorcov webov a grafiky pod názvom Microsoft Expression Studio, alebo jednotlivé časti samostatne. Balík Microsoft Expression Studio obsahuje: Microsoft Expression Web je najnovším nástrojom pre editáciu a správu webov. Jedná sa o profesionálny vývojový nástroj používaný pre vytváranie moderných webov tej najvyššej kvality. Aplikácia Expression Web obsahuje funkcie pomáhajúce zaistiť, že výsledný web bude zodpovedať štandardom W3C (World Wide Web Consortium) a taktiež jasne oddeliť obsah od formy s využitím možností kaskádových štýlov (CSS) (Leeds, 2009). Microsoft Expression Blend je profesionálny nástroj používaný pre vytváranie grafických aplikácií Windows. Pomáha pri tvorbe moderných a vizuálne prepracovaných aplikácií s interaktívnou podporou 3D zobrazovania a prehrávania multimédií. Microsoft Expression Blend umožňuje vytvorenie a úpravu prezentačnej vrstvy webových aplikácií (Lacko, 2010). Microsoft Expression Design obsahuje podporu vektorovej a bitmapovej grafiky a obidve tieto oblasti spája v jednom prostredí. Ako príklad spojenia vektorovej a bitmapovej grafiky môžeme uviesť grafický návrh tlačidla. V prostredí Expression Design môžeme vytvoriť vektorové tlačidlo do Windows Vista a zároveň bitmapové tlačidlo pre webovú aplikáciu. Expression Design je profesionálny grafický editor používaný pre vytváranie podmanivých grafických elementov nielen pre weby ale aj pre klasické aplikácie a ich užívateľské rozhranie. Aplikácia Expression Design je dostupná len ako súčasť balíka Expression Studio, nie je možné kúpiť ju samostatne (Leeds, 2009). Microsoft Expression Media je profesionálny nástroj pre úpravu a pokročilé vytváranie multimediálnych súborov. Podporuje viac ako sto rôznych multimediálnych formátov od RAW až po netradičné profesionálne multimediálne formáty a umožňuje aj 11

12 import konkurenčných katalógov multimediálneho obsahu. Je možné ho použiť pre vytváranie zaujímavých a upravovateľných webových galérií (Lacko, 2010). Microsoft Expression Encoder umožňuje prekódovanie a úpravu video súborov. Priamo v prostredí Expression Encoder môžeme exportovať videá so Silverlight prehrávačom a ukladať ich priamo na web. Je to zaujímavý spôsob, ako vytvárať videá vo formáte Microsoft Silverlight. (Lacko, 2010) Microsoft Expression Studio je ucelený balík zahrňujúci všetky doteraz uvedené nástroje. Pokrýva podporu grafikom, dizajnérom a tvorcom webov, aby mohli čo najefektívnejšie vytvárať vizuálne príťažlivé a užívateľsky zaujímavé aplikácie do prostredí operačných systémov všetkých počítačov Microsoft Expression Blend Nástroj Microsoft Expression Blend slúži na vytvorenie a úpravy prezentačnej vrstvy webových aplikácií. Využíva značkovací jazyk XAML. Prostredie Expression Blend podporuje programovanie v.net jazykoch C# a Visual Basic. Funkcie: Účinná spolupráca s vývojármi Kreatívne nástroje Interaktivita bez kódu Účinná spolupráca s návrhármi Poskytovanie lepších prostredí (MacDonald, 2010) Základnou úlohou nástroja Expression Blend je vizuálny návrh web stránok alebo web aplikácií. Na základe vizuálneho návrhu sa automaticky generuje kód v jazyku XAML. Môžeme postupovať aj opačne a ručne editovať XAML kód, pričom zmeny sa zobrazia v návrhovom zobrazení. Na obrázku 2 je znázornené prostredie Expression Blend 4 a popis jeho jednotlivých častí. 12

13 Obrázok 2: Jednotlivé časti prostredia Expression Blend 4 Zdroj: (Microsoft Silverlight, 2010) V ľavej časti. sa nachádza panel nástrojov (1), ktorý obsahuje často používané nástroje. Nájdeme tu napríklad nástroj pre presun, lupu a pod. Jedná sa o nástroje známe z grafických editorov. Druhý blok (2) obsahuje 3 záložky: Projects, Assetes a States. Projects obsahuje zoznam projektov, s ktorými aktuálne pracujeme, a ich súbory. Assets ponúka dostupné komponenty, ktoré môžeme v projekte použiť voľným pretiahnutím na pracovnú plochu. Nájdeme tu napríklad tlačidlo kalendár, dostupné štýly a ďalšie. States popisuje jednotlivé stavy prvkov aplikácie a prechody medzi nimi. V ľavej dolnej časti sa nachádza panel (3) obsahujúci objektový model aktuálneho projektu. Môžeme tu vidieť celú hierarchiu prvkov a spôsob, akým sú jednotlivé prvky do seba navzájom poskladané. Okrem ich statického uloženia tu vidíme aj časovú os, ktorá slúži pre jednoduchú tvorbu animácií (Microsoft Silverlight, 2010). Hore, uprostred lišty (4), sa nachádza zoznam aktuálne otvorených súborov. Obsah zvoleného súboru je potom zobrazený na pracovnej ploche (6). Pomocou prepínača (5) je možné voliť niekoľko spôsobov zobrazenia. K dispozícií je potom režim návrhu (kde vidíme, ako bude výsledok vyzerať), režim kódu (kedy je zobrazený priamo XAML) a kombinovaný režim, kedy sa pracovná plocha rozpolí a je možné vidieť obidve časti, ktoré sa navzájom aktualizujú (Microsoft Silverlight, 2010). 13

14 Druhý veľký blok s tromi záložkami (7) je zobrazený v pravej časti. Skladá sa zo záložiek: Properties, Resources a Data. Properties ponúka súpis vlastností zvoleného prvku pracovnej plochy. Tieto vlastnosti sú z dôvodu prehľadnosti zoskupené do niekoľkých skupín. Nadefinovať tak môžeme farbu, ohraničenie a umiestnenie na ploche, ale aj pokročilejšie prvky. Keď kliknete na prepínač (9), zobrazí sa zoznam udalostí, ktoré je schopný daný prvok vygenerovať. Dvojklikom do políčka vedľa názvu udalostí sa presunieme do kódu obslužnej rutiny. V prípade, že kód nie je ešte vytvorený, vytvorí sa prázdna obslužná metóda v príslušnom súbore CS (VB). Záložka Resources obsahuje definované prostriedky a zdroje, ako napríklad obrázky a pod. Záložka Data uvádza zoznam definovaných dátových zdrojov. Posledná oblasť (8) zoskupuje pomocné nástroje. V poradí zľava sú to konkrétne: Zoom priblíženie pracovnej plochy, Rendering of effects vypnutie/zapnutie efektov pre vykresľovaní, Snap grid zobrazí/skryje mriežku, Snapping to gridlines zapne/vypne prichytávanie prvkov k mriežke, Annotations zobrazí/skryje poznámky (Microsoft Silverlight, 2010) Mirosoft Expression Web Ide o úplne nový produkt, ktorého jadro presne interpretuje kód založený na súčasnom štandarde XHTML. Komunitu profesionálnych návrhárov webu určite nadchne to, že je Expression Web zameraný na tvorbu stránok založených na štandardoch s využitím všetkých, dnes odporúčaných, technológií ako sú XHTML, CSS a XML. Pracovné prostredie poskytuje kompletnú ponuku funkcií pre profesionálny dizajn a dáva užívateľovi pri vizuálnom návrhu istotu, že vytváraný kód bude bezchybný a účelný. To všetko (a navyše schopnosť využívať pri návrhu webových aplikácií ASP.NET) znamená, že sa Expression Web uplatní ako vynikajúci nástroj dnes i v budúcnosti (Microsoft, 2010). Pri tvorbe webových aplikácií sa používa množstvo technológií. Každá z nich vyžaduje, aby sa dizajnér vysporiadal s celou radou zložitého kódu, ktorý patrí skôr do programátorského sveta. Expression Web využíva schopnosti ASP.NET a dovoľuje dizajnérom, aby si vyberali z bohatej ponuky ovládacích prvkov, preťahovali ich myšou na pracovnú plochu a naformátovali ich bez toho, aby potrebovali pracovať s kódom na pozadí. Projekt sa môže sťahovať od vývojárov k dizajnérom webu tak často, ako je potrebné, lebo vývojári používajú Visual Web Developer a Visual Studio 2008 a dizajnéri Expression Web (Microsoft, 2010). 14

15 Webový štandard XML XML (Extensible Markup Language - rozšíriteľný jazyk so značkami). XML je určený k vyjadreniu čistých informácií úplne bez údajov o tom, ako sa tieto dáta majú spracovať. Je to jednoduchý jazyk, ktorý je čisto textový, takže je zvlášť vhodný na prenášanie textovými protokolmi, ako je napríklad HTTP a nemá žiadne preddefinované značky, ako je tomu v prípade HTML. XML zjednodušuje život tým, že sa jedná o vynikajúci jazyk. To zjednodušenie vyplýva z toho, že nástroje pre čítanie, zápis a manipuláciu s dátami XML sú dnes takmer obvyklé ako textové procesory (Prosise, 2003). Jazyk XML spája jednotnú úpravu s rozšíriteľnosťou, ďalej s možnosťami konverzie dát z jedného dátového formátu do iného a je relatívne bezproblémovým prenosom informácií medzi jednou XML aplikáciou založenou na tomto jazyku a inou aplikáciou. XML je určený pre tvorbu ďalších jazykov. Užívateľské jazyky sa nazývajú aplikácie a práve vďaka spoločnému základu sú navzájom zlúčiteľné. To v praxi znamená, že ľubovoľný syntaktický analyzátor jazyka XML je schopný porozumieť všetkým aplikáciám a taktiež aplikácie môžu medzi sebou zdieľať svoje dáta (Špinar, 2004). XAML (Extensible Application Markup Language) je nový druh značkovacieho jazyka pre tvorbu aplikačného rozhrania. Jeho formát vychádza z populárneho formátu dokumentov XML. XAML stránky ako by sme takýmto aplikáciám mohli populárne hovoriť, umožňujú dynamicky reagovať na interakciu používateľa s ovládacími prvkami na stránkach. Na rozdiel od iných prezentačných technológií (Java, ActiveX a Flash), ktoré posielajú prehliadaču binárny obsah, takže môžu mať problémy s firewall-mi, ale hlavne s kompatibilitou operačných systémov a prehliadačov na strane klienta a navyše každá zmena vyžaduje aktualizáciu celej aplikácie, XAML je textový formát. Pri použití technológie Silverlight sa po zmene obsahu vytvorí nový XAML súbor, ktorý sa prenesie na klientsku stranu automaticky pri ďalšej návšteve predmetnej stránky (MacDonald, 2010) Jazyk XAML v spolupráci medzi návrhármi a vývojármi Všetky moderné. vývojárske nástroje akceptujú a podporujú tímovú spoluprácu pri vývoji softvérových projektov ako jeden z hlavných pilierov svojej koncepcie. Možnosti 15

16 integrácie vývojárskych nástrojov pre jednotlivé fázy cyklu spolu s možnosťami plánovania a modelovania procesu vývoja zaistia priebežné zachovanie kvality a zvýšia efektívnosť a produktivitu procesu vývoju softvéru (MacDonald, 2010). Obrázok 3: Schéma vývoja webových aplikácií Zdroj: (MacDonald, 2010) Zameriame sa na spoluprácu dizajnéra prezentačnej vrstvy aplikácie a vývojára. Keď návrhár predloží definitívny návrh ako by mala aplikácia vyzerať, začnú vývojári pracovať na implementácii tohto návrhu. Vývojár sa pri implementácii návrhov dizajnéra riadi možnosťami prezentačnej vrstvy a návrhového prostredia, takže výsledná podoba niektorých ovládacích prvkov je iná než bola pôvodne navrhnutá (Ghoda, 2010). 16

17 Obrázok 4: Spolupráca návrhára a vývojára pri návrhu prezentačnej vrstvy Zdroj: (Ghoda, 2010) Vývojár sa pri implementácií návrhov dizajnéra riadi možnosťami prezentačnej vrstvy a návrhového prostredia. Naproti tomu, ak je dizajnérov návrh vytvorený v takom prostredí a formáte, ktorý je podporovaný aj vývojovými prostrediami, je zaručené, že výsledná podoba aplikácie bude presne zodpovedať návrhu dizajnéra. V praxi to funguje tak, že dizajnér odovzdá svoj návrh vývojárskemu tímu v jazyku XAML a vývojársky tím do návrhu naprogramuje aplikačnú logiku (Ghoda, 2010). Jazyk XAML sa využíva vo viacerých technológiách.net Frameworku od verzie 3 hlavne v technológiách Silverlight a WPF, kde slúži k popisu užívateľského rozhrania, nadviazania grafických prvkov na zdroj dát, prípadne k previazaniu prvkov navzájom (jeden prvok je zdrojom a druhý konzumentom údajov). Využíva sa aj pre volanie procedúr udalostí a správu objektov (Lacko, 2010). 17

18 Obrázok 5: XAML ako rozhranie pri návrhu webovej aplikácie Zdroj: (Ghoda, 2010) Všetko, čo možno vytvoriť v XAML, môže byť rovnako vyjadrené aj s použitím tradičnejších.net jazykov ako C# či Visual Basic. Kľúčovou výhodou technológie XAML je, že nevyžaduje natoľko komplikované postupy, ako zmieňované programovacie jazyky. V procese vývoja softwaru je potom oveľa jednoduchšie si vymeniť informácie medzi architektom informačných systémov, analytikom, návrhárom a programátorom, a to behom celého životného cyklu aplikácie. Napríklad kvôli zmenám, ktoré návrhár po konzultáciách s užívateľmi zapracuje, nie je nutné zasahovať do samotného aplikačného kódu programu, ktorý má na starosti už len zabezpečiť funkčnosť prvku bez ohľadu na to, ako je prvok vizuálne spracovaný (Lacko, 2010). Denník (protokol) je textový súbor uložený na serveri. Aplikácie aktualizuje tento súbor vždy, keď sa niečo stane napríklad keď niekto požiada o súbor alebo keď dôjde ku chybe. V takom prípade je do súboru vložený nový riadok, ktorý dotyčnú udalosť zapíše do protokolu. Existujú tri typy protokolov: Protokol prístupu (zaznamenáva každú požiadavku) Protokol chýb (zaznamenáva každú chybu alebo každé varovanie) Vlastný protokol (zaznamenáva čokoľvek, čo si budete priať) (Naromore, 2006) 18

19 Z protokolov sa dá vyčítať napríklad: Môžete sa dozvedieť, aké IP adresy používajú vyši navštevníci Môžete sa dozvedieť, aké prehliadače návštevníci používajú Môžete zistiť, ktoré stránky sú najžiadanejšie Môžete zistit, či návštevnosť stránok narastá, alebo klesá Môžete zistiť, ktoré stránky a procesy sú problémové atď (Naromore, 2006) Súbory protokov sú umiestnené na rôznych miestach v závislosti na tom, ako ich program vytvoril a aké sú ich funkcie. Väčšinu z nich nájdete mimo adresárovu štruktúru webového serveru, kde sú hlavne preto, aby k nim užívatelia nemali prístup (Naromore, 2006) Vývoj technológie Silverlight Cesta k súčasnej verzii Silverlight 5, nebola priama a viedla občas aj cez slepé uličky. Zároveň s finálnou verziou Silverlight 1.0 totiž Microsoft predstavil aj ďalšiu alfa verziu tohto produktu s onačením 1.1. Táto verzia bola následne po dopracovaní premenovaná na Silverlight 2. Kým Silverlight 1.0 využíval ako programovací jazyk JavaScript, od verzie 2 je možné v plnej miere využívať.net jazyky (Lacko, 2010). Tabuľka 1: Porovnanie verzií Silverlight 1.0 a Zdroj: (Lacko, 2010) 19

20 Silverlight 1.0 a 2 Platforma Silverlight 1.0 ma dve základné časti. Prvou časťou je prezentačná vrstva, ktorá zahŕňa komponenty a služby orientované na generovanie užívateľského rozhrania a interakciu s užívateľom. Užívateľské rozhranie využíva renderovanie (tvorba reálneho obrazu na základe počítačového modelu, najčastejšie 3D).vektorovej grafiky, textový výstup, animácie a prezentáciu multimediálneho obsahu vo formáte WMA, VC1 a MP3. Interakcia s užívateľom obsahuje obsluhu udalostí generovaných užívateľom pomocou myši a klávesnice. Druhá časť je inštalačný a aktualizačný komponent pre internetový prehliadač (MacDonald, 2010). Verzia Silverlight 2 rozšírila verziu 1.0 o nové vlastnosti. Priniesla niektoré nové ovládacie prvky, štýly a šablóny. Táto verzia už umožnila u klienta na lokálnom úložisku údajov (inteligentnejšia verzia cookies) uložiť až 10 MB dát. Hlavnou novinkou však bola podpora.net. Od verzie Silverlight 2 je súčasťou zásuvného modulu aj vlastný.net Framework, ktorý je minimalizovaný a zoptimalizovaný tak, že sa do priestoru približne 4 MB podarilo zmestiť všetky funkcie, ktoré sú potrebné k spusteniu aplikácií v rámci internetového prehliadača. Vznikla tak nová architektúra vykonávania internetových aplikácií, ktorá minimalizuje záťaž serveru a presúva jadro vykonávania na klienta. Veľkou výhodou a jedným zo základných pilierov popularity a predpokladom mäsového rozšírenia je kompatibilita tohto orezaného jadra s.net Frameworkom, čiže vývojári môžu naplno využiť svoje znalosti a skúsenosti. Podobne môžu aj návrhári zúročiť svoje skúsenosti pri návrhu prezentačného rozhrania aplikácií a XAML kódu so sesterskou platformou WPF (Lacko, 2010). Možnosť použitia štandardných programovacích jazykov.net, objektov, ako aj tvorby aplikácií v kombinácii s možnosťou vytvorenia graficky a mediálne bohatého užívateľského rozhrania bez nutnosti enormnej záťaže serverovej strany, dáva vývojárom do rúk.net technológiu a nástroje na tvorbu internetových aplikácií pre web novej generácie, pre ktorý sa vžilo označenie Web 2. Táto nová generácia webu sa už nezameriava na technologické aspekty, ale ich vhodným spojením umožňuje efektívne vytvárať aplikácie, kde sa prvoradý dôraz kladie na spokojnosť užívateľa a možnosť funkcionality. Nezanedbáva sa ani efektivita a rýchlosť vývoja, ku ktorej prispieva opätovná použiteľnosť objektov a komponentov (Lacko, 2010). 20

21 Silverlight 3 Ďalšia verzia na seba nenechala dlho čakať a bola predstavená už v júli roku Táto verzia sa stala zlomovou v zmysle razantného zmenšenia rozdielu medzi webovou a desktopovou aplikáciou. Od tej doby už môžu Silverlight aplikácie bežať aj mimo prehliadač v takzvanom režime Out of Browser. Užívateľ si môže aplikáciu nainštalovať do lokálneho operačného systému, vytvoriť si zástupcu na pracovnej ploche a v podstate nespozná rozdiel od klasickej aplikácie. Taká aplikácia si však so sebou nesie rovnaké obmedzenia, akoby bežala v prehliadači. Nachádza sa v tzv. sandboxe, čo je izolovaný priestor, ktorý slúži k odtieneniu aplikácie od priameho prístupu k systému. Je tak zaistená ochrana proti škodlivým aplikáciám (Paries, 2009). Vylepšenia sa dočkala podpora viazania dát (databinding) na úrovni XAML kódu a tiež aj podpora pre business objekty. Dôležitou novinkou je aj podpora SEO, tz. podpora indexovania pre internetové vyhľadávače. V tretej verzii sa objavujú aj prvky pre ľahšie vykonávanie animácií, resp. pre ich nelineárny beh. Teraz možno pomocou tzv. Animation Easing napríklad simulovať odrážajúci sa predmet na úrovni XAML-u bez nutnosti programového zásahu do kódu na pozadí (Paries, 2009). Od grafiky sme sa cez novinky v animácií prepracovali až k podpore pre video a audio vo vysokej kvalite. Vo verzií Silverlight 3 je k dispozícii podpora živého i ondemand streamovania v úplnom HD rozlíšení kombinovaného s technológiou Smooth Streaming. To prispieva k plynulosti prehrávania obrazu bez rušivých trhavých úsekov. Okrem kodeku VC-1/WMA je k dispozícii aj podpora pre MPEG4 vo formáte H.264 s ACC pre kvalitné audio. Pri vykresľovania HD videa sa využíva aj GPU akcelerácia (Paries, 2009). Silverlight 4 Novinky verzie Silverlight 4 sa dajú rozdeliť na tri hlavné oblasti: Návrh business aplikácií Vizuálne zobrazenie Komunikácia na pozadí webového prehliadača (Microsoft Silverlight, 2010) 21

22 Pre komplexnú prácu s formátovaným textom, teda nielen pre jeho zobrazenie ale aj editovanie, slúži prvok RichTextBox. Pomocou klávesových skratiek je možné priamo ovládať funkcie pre formátovanie textu, prípadne jeho kopírovanie do schránky. Podporuje tiež udalosti generované myšou. Tieto vlastnosti ho priamo predurčujú pre tvorbu editačných okien. Je logické, že RichTextBox nemá integrované vizuálne ovládacie prvky, pretože požiadavky na design a filozofiu ovládania editovania sú rôzne, v závislosti na oblasti nasadenia. Do aplikácie je potrebné pridať ovládacie prvky a doprogramovať ich funkcionalitu, napríklad zmenu fontu, farby, ukladania textu do súboru a podobne (Lacko, 2010). Jednou z najčastejšie používaných foriem vizuálnej prezentácie obchodných údajov sú tabuľky a maticové tabuľky. Na platforme Silverlight sa vytvárajú s využitím prvkov DataGrid. Vo verzii 4 je možné nastaviť automatickú šírku stĺpcov, ale hlavne kopírovať údaje z tabuľky do schránky. Vylepšenie grafickej prezentačnej vrstvy medzi jednotlivými verziami platformy Silverlight bola vždy citeľná, napríklad Silverlight 4 je viac než dvakrát rýchlejší než predchádzajúce verzie (Ghoda, 2010). Od. verzie Silverlight 4 je možné v aplikáciách využívať aj koliesko a pravé tlačidlo myši. V starších verziách sa po stlačení pravého tlačidla myši zobrazila len jedna položka kontextového menu s názvom Silverlight, ktorá aktivuje konfiguračný dialóg zásuvného modulu, prípadne pokiaľ vytvoríme kontextové menu pre kopírovanie obsahu do/zo schránky. Silverlight aplikácia umožňuje programovo modifikovať obsah schránky, čo však môže predstavovať potenciálne bezpečnostné riziko. Preto je v takomto prípade o pripravovanej akcii informovaný najprv užívateľ, ktorý ju musí povoliť. Tvorcovia grafických interaktívnych aplikácií určite ocenia funkciu drag and drop, pomocou ktorej je možné premiestňovať prvky na ploche Silverlight aplikácie. Tá umožní napríklad vytvorenie aplikácií pre intuitívne usporiadanie fotografií ich presúvaním, zväčšovaním alebo zmenšovaním pomocou približovania a odďaľovania palca a ukazováka. (Ghoda, 2010) Pri vývoji novej verzie Silverlightu boli zohľadnené aj dve najčastejšie požiadavky domácich užívateľov ohľadne podpory webovej kamery a mikrofónu. Táto, z vizuálneho hľadiska pravdepodobne najatraktívnejšia novinka poskytuje netušené možnosti zábavy a komunikácie a je jedným z hlavných predpokladov pre integráciu Silverlight aplikácií so 22

23 sociálnymi sieťami. Prístup Silverlight aplikácie ku kamere a mikrofónu je nutné najprv povoliť zo strany užívateľa, takže nám určite nehrozí žiadne špehovanie (Ghoda, 2010). Silverlight 5 Najnovšia veria Silverlight 5 bola vydaná vlani v decembri. Silverlight 5 stavia na základoch Silverlight 4, ponúka novinky v oblasti médií, vo vývoji aplikácií a obsahuje viac ako 40 nových funkcií, ktoré zvyšujú produktivitu vývojárov. Silverlight 5 je posledná verzia celej technológie. Silverlight 5 má tiež veľmi dlhú podporu, ktorá skončí až v roku K dispozícii je pre prehliadače Internet Explorer, Firefox, Chrome a Safari (Microsoft, 2012). Medzi najzaujímavejšie novinky vo verzii 5 patria: hardwarové dekódovanie H.264 médií, ktoré zaisťuje výrazné zvýšenie výkonu, vďaka dekódovaniu nechráneného obsahu pomocou GPU (Graphics processing unit), 3D grafika, diaľkové ovládanie, podpora 64- bitových systémov, nové funkcie pre prehrávanie multimediálneho obsahu, rýchlejší štart aplikácie, upravovateľná rýchlosť spusteného média (audio / video) s automatickou úpravou zvuku (doladenie), zjasnenie textu (lepšia čitateľnosť) (Microsoft, 2012) Architektúra platformy Silverlight Silverlight neslúži len na zobrazenie interaktívneho webového obsahu jeho užívateľom, ale je to tiež veľmi schopná platforma pre vývoj komerčných aplikácií, ktoré integrujú služby a dáta z množstva rôznorodých zdrojov (Ghosh, 2010). Platforma Silverlight Platforma Silverlight sa skladá z dvoch hlavných častí, ktoré dopĺňajú komponenty pre inštaláciu a aktualizáciu. Prvá z hlavných častí Core presentation framework sa skladá z komponentov a služieb orientovaných na užívateľské rozhranie a interakciu, ktorá zahrňa užívateľský vstup, prehrávanie médií, správu digitálnych práv (Digital Rights Management DRM), viazanie dát (data binding) a funkcie pre prezentáciu obsahu ako vektorovú grafiku, text, animácie a obrázky. Obsahuje tiež jazyk XAML pre špecifikáciu rozloženia obsahu (Silverlight 3.0, 2010). 23

24 Druhá časť.net framework for Silverlight je podmnožinou veľkého.net Frameworku, ktorá obsahuje komponenty a knižnice zahŕňajúce integráciu dát, rozšíriteľné ovládacie prvky Windows, prácu so sieťou, knižnice základných tried, garbage collection a common language runtime (CLR). Vaša aplikácia však môže vyžadovať ďalšie knižnice, ktoré nie sú v.net Framework for Silverlight obsiahnuté, ale zároveň sa nachádzajú v Silverlight SDK. V takom prípade sú tieto knižnice v aplikácií pribalené a stiahnuté do prehliadača. Ako príklad môžeme uviesť nové ovládacie prvky užívateľského rozhrania, XLINQ, Syndication (RSS/Atom), serializáciu XML alebo dynamic language runtime (DLR). Ovládacie prvky pre inštaláciu a aktualizáciu majú za úlohu zjednodušiť proces inštalácie pre užívateľov, ktorý aplikáciu spúšťajú prvý krát a následne umožňujú jej jednoduchú aktualizáciu (Silverlight 3.0, 2010). 24

25 Nasledujúca schéma ukazuje časti architektúry technológie Silverlight. Obrázok 6: Architektúra technológie Silverlight Zdroj: (Silverlight 3.0, 2010) Ako je to vidieť na obrázku, architektúra kombinuje množstvo nástrojov, technológii a služieb, ktoré pomáhajú vývojárom vytvárať bohaté a interaktívne aplikácie. Teraz si detailne predstavíme jednotlivé časti. Hlavné súčasti platformy Silverlight Časť Core Presentation Components sa skladá z prvkov, ktoré sú popísané v tabuľke 2. 25

26 Tabuľka 2: Komponenty Core Presentaton Components Funkcia Input UI rendering Media Deep Zoom Controls Layout Data binding DRM XAML Popis Zachytáva vstupy z hardwarových zariadení, akými sú napríklad klávesnica, myš a rôzne ďalšie zariadenia pre vstup alebo kreslenie. Vykresľuje vektorovú a rastrovú grafiku, animácie a text. Zaisťuje prehrávanie a správu rôznych druhov audio a video súborov, ako napríklad.wmp a MP3 súbory. Umožňuje inteligentné približovanie obrázkov vo vysokom rozlíšení. Podporuje rozšíriteľné ovládacie prvky, ktoré sú prispôsobiteľné pomocou štýlov a šablón. Umožňuje dynamické polohovanie prvkov užívateľského rozhrania. Umožňuje zviazanie dátových objektov s prvkami užívateľského rozhrania. Poskytuje správu digitálnych práv (DRM) multimediálneho obsahu. Poskytuje analyzátor pre jazyk XAML. Zdroj: (Microsoft Silverlight, 2010) Vývojári môžu spolupracovať s prezentačnými časťami pomocou posledne menovaného jazyka XAML, ktorý je hlavným prostredníkom medzi :NET Frameworkom a prezentačnou vrstvou. Rovnakú funkcionalitu je možné dosiahnuť aj spravovaným kódom na pozadí, avšak taký kód nie je príliš prehľadný a vďaka jeho množstvu sa stáva neefektívnym (Microsoft Silverlight, 2010). Silverlight. V tabuľke 3 je popísaný Softvérový rámec pre Silverlight -.NET Framework for 26

27 Tabuľka 3: Komponenty.NET Framework for Silverlight Funkcia Data Base class library Popis Podporuje funkcie LINQ a LINQ to XML, ktoré zjednodušujú proces integrácie a práce s dátami rôznorodých zdrojov. Podporuje tiež XML a serializáciu pre spracovanie dát. Množina knižníc.net Frameworku, ktoré poskytujú základné programové funkcie, ako napríklad spracovanie reťazcov, regulárne výrazy, vstupy a výstupy, reflexiu, kolekcie a globalizáciu. Window Communication Foundation (WCF) Poskytuje funkcie pre zjednodušenie prístupu ku vzdialeným službám a dátam. CLR (common language runtime) Poskytuje správu pamäti, kontrolu typovej bezpečnosti a zachytávanie výnimiek. WPF (Windows Presentation Foundation) controls Poskytuje bohatú množinu ovládacích prvkov obsahujúcich prvky Button, Calendar, CheckBox, DataGrid, DatePicker, HyperlinkButton, ListBox, RadioButton a ScrollViewer. DLR (dynamic language runtime) Podporuje dynamickú kompiláciu a spúšťanie skriptovacích jazykov, ako napr. JavaScript a IronPython, pre tvorbu aplikácií založených na Silverlightu. Zdroj: (Microsoft Silverlight, 2010).NET Framework for Silverlight je podmnožina celého.net Frameworku. Poskytuje základy pre objektívne orientovaný vývoj aplikácií. Vývojári môžu s vrstvou.net Framework for Silverlight komunikovať pomocou riadeného kódu s použitím jazykov C# a Visual Basic. (Microsoft Silverlight, 2010) 27

28 Ďalšie funkcie platformy Silverlight Silverlight poskytuje niekoľko ďalších funkcií, ktoré vývojárom pomáhajú vytvárať bohaté a interaktívne aplikácie, vybrané z nich sú obsiahnuté v nasledujúcej tabuľke 4. Tabuľka 4: Ďalšie komponenty technológie Silverlight Funkcia Isolated storage Asynchronous programming File management Popis Poskytuje bezpečný prístup klienta Silverlightu k operačnému systému lokálneho počítača. Umožňuje lokálne ukladanie dát a ukladanie do medzipamäte, ktoré sú určené konkrétnemu užívateľovi. Vlákno na pozadí vykonáva programové úlohy, zatiaľ čo aplikácia samotná je pripravená na interakciu s užívateľom. Poskytuje dialóg pre otvorenie súboru pre zjednodušené nahrávanie súborov. HTML managed code interaction Poskytuje vývojárom platformy.net priamu manipuláciu s HTML prvkami grafického rozhrania webovej stránky. Serialization Packaging XML libraries Poskytuje podporu pre serializáciu typov CLR do JSON a XML. Poskytuje triedu Application a nástroje pre zostavenie a vytvorenie balíčkov XAP. Balíčky XAP obsahujú aplikáciu a vstupný bod, ktorý sa má spustiť pomocou pluginu Silverlight. Triedy XmlReader a XmlWriter zjednodušujú prácu s XML dátami z webových služieb. Funkcia XLinq umožňuje vývojárom dotazovať sa na XML dáta priamo bez jazykov.net Frameworku. Zdroj: (Microsoft Silverlight, 2010) Bezpečnosť platformy Silverlight Platforma Microsoft Silverlight je situovaná do oblasti aplikácií RIA (Rich Internet Applications), ktorá predpokladá vykonávanie plnohodnotného objektového kódu na strane klienta na pozadí klientskeho prehliadača. Aby mohla byť platforma Silverlight používaná 28

29 v bežnej praxi, musí byť zaistená bezpečnosť vykonávania kódu, aby nedošlo k narušeniu bezpečnosti klientskeho počítača. Plnohodnotný kód Silverlight aplikácie musí byť skrátka držaný na uzde, aby pri prípadnom nekalom zámere jeho tvorcov nebola ohrozená bezpečnosť počítača klienta a nemohlo dôjsť k úniku údajov na ňom uložených. Silverlight aplikácie bežia v bezpečnostnej obálke tzv. Sandboxe. Vývojári nemajú možnosť nijak ovplyvniť tento Sandbox na klientskej strane, takže nemôžu prekonať obmedzenia a dostať sa so svojim kódom mimo túto vymedzenú bezpečnostnú obálku (Lacko, 2010). Zabezpečenie na platfome.net Framework Rozhranie.NET Framework je neoddeliteľnou súčasťou systému Windows, ktorá podporuje vytváranie a spúšťanie aplikácií a XML webových služieb novej generácie. Rozhranie.NET Framework je navrhnuté tak, aby spĺňalo tieto ciele: 1. Poskytnúť konzistentné objektovo orientované programovacie prostredie, kde je kód objektu uložený a spustený lokálne, ale distribuovaný prostredníctvom Internetu alebo spustený vzdialene 2. Poskytnúť prostredie pre spracovanie kódu, ktoré minimalizuje konflikty nasadenia a správy verzií softvéru 3. Poskytnúť prostredie pre spracovanie kódu, ktoré propaguje bezpečné spracovanie kódu vrátane kódu, ktorý je vytváraný neznámou alebo čiastočne dôveryhodnou treťou stranou 4. Poskytnúť prostredie pre spracovanie kódu, ktoré eliminuje výkonnostné problémy skriptovacích prostredí 5. Činiť vývojárske skúsenosti konzistentnými naprieč najrôznejšími typmi aplikácií, ako sú napríklad aplikácie určené pre systém Windows alebo webové aplikácie 6. Vytvárať komunikáciu na priemyselných štandardoch, aby sa zabezpečilo to, že kód založený na rozhraní.net Framework je možné integrovať s akýmkoľvek iným kódom (Microsoft, 2012) Rozhranie.NET Framework má dve hlavné zložky: spoločný jazykový modul runtime a knižnicu tried.net Framework. Modul CLR (Common Language Runtime) je základom rozhrania.net Framework. Runtime modul si možno predstaviť ako agenta, ktorý spravuje kód v čase vykonávania poskytuje základné služby, ako je napríklad správa pamäte, správa vlákien, vzdialená komunikácia a súčasne tiež zaisťuje prísnu bezpečnosť 29

30 typov a ďalšie formy presnosti kódu, ktoré podporujú zabezpečenie. V skutočnosti koncept správy kódu je základný princíp modulu runtime. Kód, ktorý sa zameriava na modul runtime, je známy ako spravovaný kód. Kým kód, ktorý sa nezameriava na modul runtime, je známy ako nespravovaný kód. Knižnica tried, ďalší hlavný komponent rozhrania.net Framework, je všeobecná, objektovo orientovaná kolekcia opakovane použiteľných typov, ktoré možno použiť na vývoj aplikácií..net Framework môžeme použiť od tradičných aplikácií pre príkazový riadok alebo aplikácií s grafickým užívateľským rozhraním (GUI) až po aplikácie založené na najnovších inováciách poskytovaných technológií ASP.NET, ako sú napríklad Webové formuláre alebo XML webové služby (Microsoft, 2012). Zabezpečenie Silverlight aplikácií Zabezpečenie na platforme Silverlight funguje presne naopak. V jadre platformy Silverlight je implementované špeciálne Common Language Runtime (CLR), ktoré sa nazýva coreclr. Každý blok kódu, ktorý sa ide zaviesť cez coreclr, získava len čiastočné práva a nemá oprávnenie volať metódy vyžadujúce vyššie oprávnenie (Michail, 2010). Silverlight aplikácie využívajú koncepciu bezpečnosti zloženú z troch atribútov: SecurityTransparent kód s čiastočnou dôveryhodnosťou SecuritySafeCritical kód, ktorý je označený týmto atribútom, sa považuje za dôveryhodný a môže byť volaný akýmkoľvek kódom SecurityCritical kód označený týmto atribútom má plnú dôveru (Michail, 2010) Na rozdiel od.net Frameworku Silverlight coreclr za takýto kód považuje všetky zdrojové súbory, ktoré nie sú označené iným atribútom, tj. aj súbory bez označenia bezpečnostnej úrovne. Znamená to, že akýkoľvek kód obsiahnutý v Silverlight aplikácií, nemôže vykonávať akékoľvek kritické operácie alebo pristupovať na operačný systém. Ako je možné vidieť v rámci jednotlivých druhov bezpečnostných atribútov, safe-critical atribut v.net Frameworku neexistuje. Bol pridaný len pre bezpečnostný model aplikácií Silverlight. Jeho úlohou je identifikovať prepojenie medzi aplikačným kódom, ktorý užívatelia stiahnu z Internetu a ktorý môže obsahovať škodlivé bloky. Aplikačný kód môže byť len transparentný, akýkoľvek pokus o volanie, označené ako Critical, má za následok okamžité vyvolanie výnimky bezpečnostného prístupu. Kód Silverlight aplikácie síce môže obsahovať závislosti na iných vlastných knižniciach a balíčkoch, ale sú to silné 30

31 obmedzenia. Aplikácia môže odkazovať len na knižnice, ktoré boli vytvorené a kompilované ako Silverlight Class Libraries. Existujúce knižnice tak musia byť prekompilované, prípadne čiastočne prispôsobené tak, aby mohli byť prekompilované ako knižnice typu Silverlight. Bezpečnostný model corecrl umožňuje programátorovi derivovať nové triedy len z tried, ktoré sú označené aplikačnou platformou ako security transparent. Za takúto sa považuje každá, ktorá neobsahuje bezpečnostný atribút typu SafeCritical alebo Critical (Michail, 2010). Autentizácia a autorizácia Mottom webovej aplikácie všeobecne býva zverejňovať a zviditeľňovať, preto umožňuje väčšina webových aplikácií voľný pohyb návštevníkov takmer po celej webovej prezentácií. Je to pochopiteľné, ich prevádzkovatelia sa pomocou webovej aplikácie snažia propagovať svoju spoločnosť, ich produkty alebo služby. Personálne stránky zase vo väčšine prípadov propagujú záujmy majiteľov. Existujú aj aplikácie, kedy sa užívateľ potrebuje presunúť do určitej zóny a tam napríklad pri Internet banking-u vykonať požadované transakcie, v internetovom obchode si niečo záväzne objednať, prípadne to pomocou kreditnej karty aj zaplatiť, prečítať si na y svoje vlastné správy a podobne. V prípadoch, kedy sa klient pri svojom prístupe na webové stránky nijako nepreukazuje ani neautorizuje, jedná sa o anonymný prístup (Lacko, 2010). Autentizácia na úrovni ASP.NET aplikácie Je potrebné. si uvedomiť, že v Silverlight projektoch je Silverlight aplikácia hosťovaná ako zásuvný modul v ASP.NET aplikácií. ASP.NET aplikácie využívajú pre autentizáciu súčinnosť so službou IIS (Internet Information Services). Táto autentizácia používa cookies na overenie identity užívateľov a umožňuje aplikácií vykonať vlastné overenie prihlasovacích údajov. Je dôležité si uvedomiť, že autentizačné služby ASP.NET sú podriadené autentizačným službám poskytnutým IIS. V rámci URL autorizácie sa anonymný užívateľ porovnáva s konfiguračným údajom ASP.NET aplikácie. Pokiaľ je prístup povolený pre dané URL, požiadavka je autorizovaná. (Michail, 2010) Pre aktiváciu autentizačnej služby ASP.NET je potrebné nastaviť element * v konfiguračnom súbore aplikácie. Výhodnejšie je použiť pre tento účel nástroj ASP.NET Web Site Administration Tool. Pre Silverlight aplikácie sa nastavuje autentizácia typu Forms. Autentizačné služby ASP.NET riadia cookies a smerujú neautorizovaných 31

32 užívateľov na prihlasovaciu stránku. Autentizácia sa spravidla odohráva zadaním mena a hesla v prihlasovacom dialógu alebo pomocou autentizačného hardweru, napríklad prístupových kľúčov alebo biometrických zariadení. Pri pokuse užívateľa o prístup na chránenú stránku bude najprv presmerovaný na autentizačný dialóg. Presmerovanie sa vykoná na základe údajov z konfiguračného súboru web. Config zo sekcie * (Michail, 2010). Väčšina webových aplikácií vytvorených pomocou ASP.NET spadá do jednej z troch kategórií: 1. Aplikácie, ktorých obsah je dostupný všetkým. 2. Internetové aplikácie, ktoré slúžia obecnej populácii, pred zobrazením určitých stránok však vyžadujú prihlásenie. Dobrým príkladom takého serveru je ebay. Stránkami ebay môže prechádzať každý a môže tak sledovať prebiehajúce aukcie. Keď však chcete pridať ponuku, požaduje od vás užívateľské meno a heslo. 3. Intranetové aplikácie, ktoré vystavujú obsah populácií užívateľov napríklad zamestnancom nejakej spoločnosti, ktorí majú účty v doméne Windows. Niekedy tieto webové servery podporujú v obmedzenej miere tiež internetový prístup, takže autorizovaní užívatelia môžu k týmto webovým serverom pristupovať zo všetkých miest na svete, kde je k dispozícii pripojenie na Internet (Prosise, 2003). Webové servery spadajú do prvej kategórie, nevyžadujú žiadnu zvláštnu ochranu nad rámec poskytovaný webovým serverom. Webové servery v druhej a tretej kategórií vyžadujú nejakú formu zabezpečenia na úrovni aplikácie, ktorá identifikuje autorizovaných užívateľov a zabraňuje neoprávnenému prístupu. ASP.NET poskytuje práve túto bezpečnosť na úrovni aplikácie. Pracuje v spojení s IIS a s bezpečnostným podsystémom Windows a ponúka dokonalé základy pre vystavanie bezpečných webových serverov. Navyše ASP.NET stavia na tom, čo ponúka IIS, aby bolo zavádzanie bezpečných webových serverov čo najľahšie (Prosise, 2003). 1.2 Opis používaných RIA technológií Microsoft Silverlight nie je jediná aplikácia zameraná na tvorbu RIA. RIA sú vysoko interaktívne aplikácie, ktoré dokážu reagovať na rôznorodé akcie užívateľa takmer okamžite. Hoci názov Rich Internet Application bol prvýkrát použitý v oficiálnej správe spoločnosti Macromedia v roku 2002, idea a konceptuálne návrhy aplikácií, bežiacich v 32

33 prehliadači a poskytujúce možnosti klasických programov a rôzne technické riešenia boli navrhnuté a implementované už koncom deväťdesiatych rokov dvadsiateho storočia a umožnili rozšírenie interaktívnych možností komunikácie cez webový prehliadač (RIA, ). V dnešnej dobe existuje okrem Silverlight-u mnoho aplikácií a technológií zameraných na tvorbu RIA, ktoré používajú rôzne techniky a prístupy k tvorbe a distribúcii obsahu. Niektoré riešenia sú licencovanými zdrojovými kódmi a vývojovými nástrojmi, iné sú otvorenými zdrojovými kódmi a sú dostupné bezplatne širokej verejnosti. Rôzny je aj prístup k údajom a ich prenos medzi serverom a klientským prehliadačom. Okrem Silverligthu sú najznámejšie: Adobe Flash, Java, HTML a iné (RIA, ). V popise si najprv rozoberieme technológie vytvorené na strane klienta (HTML, Java, JavaScript, Ajax, Adobe Flash a Adobe Flex) a následne na strane servera ( ASP.NET, PHP a Redakčné systémy). Budeme postupovať od jednoduchých po zložitejšie technológie HTML HTML je skratka pre Hypertext Markup Language, čo znamená hypertextový značkovací jazyk. Je to jazyk, ktorý sa skladá zo značiek a jeho zmyslom je umožniť zobrazenie textového a obrazového obsahu stránok a zároveň prepojiť jednotlivé stránky medzi sebou pomocou tzv. odkazov. Jazyk HTML bol vytvorený k tomu, aby dal obsahu WWW stránky (teda ich textom a ďalším prvkom) zmysel. Jazyk HTML je základný jazyk pre značkovanie webových stránok. Pomocou jazyka HTML vytvárame logickú štruktúru dokumentu (Domes, 2008). Jazyk je aplikáciou skôr vyvinutého rozsiahleho univerzálneho značkovacieho jazyka SGML (Standard Generalized Markup Language). Vývoj HTML bol ovplyvnený vývojom webových prehliadačov, ktoré spätne ovplyvňovali definíciu jazyka (W3C, 2012). Jazyk HTML umožňuje: Publikovanie online dokumentov s nadpismi, text, tabuľky, zoznamy, fotografie, atď. Načítať on-line informácie prostredníctvom hypertextových odkazov Zahŕňa tabuľkové procesory, videoklipy, zvukové klipy a ďalšie aplikácie priamo do svojich dokumentov (W3C, 2012) 33

34 XHTML XHTML (extensible hypertext markup language - "rozšíriteľný hypertextový značkovací jazyk") je značkovací jazyk pre tvorbu hypertextových dokumentov v prostredí WWW vyvinutý W3C. Berie si to lepšie z jazyka HTML, v kombinácií so značkovacím jazykom XML. XHTML je navrhnutý tak, aby ho bolo možné použiť len k priradeniu významu www stránke, nie k určeniu vzhľadu stránky. Pôvodne sa predpokladalo, že sa stane nástupcom jazyka HTML, ktorého vývoj bol vo verzií 4.01 ukončený. V roku 2007 však došlo k založeniu pracovnej skupiny, ktorá má za cieľ vytvoriť novú verziu HTML, ktorá ponesie označenie HTML 5 a jej XML variantu XHTML 5. Okrem toho paralelne pokračuje aj vývoj XHTML 2.0. Verzia HTML 5 už vyšla (W3C, 2012). HTML 5 Tento jazyk je jednoduchý podobne ako HTML. Zaraďuje sa medzi plnohodnotné RIA jazyky s jednou odlišnosťou a to tou, že nie je potrebná inštalácia žiadneho programu u konečného užívateľa. Pre túto vlastnosť a jednoduchosť sa niektorí domnievajú, že HTML 5 nahradí Flash a aj JavuFX. Zatiaľ nepodporuje fullscreen a nezobrazuje reklamu a ani titulky (HTML 5, 2012). Pozostáva z niekoľkých nezávislých častí: Nové HTML značky (tagy) definujúce štruktúru stránky Stále úložisko formou asociatívneho poľa Relačné databázy s podporou transakcií Podpora offline aplikácií (HTML 5, 2012) Pomocou HTML5 je napríklad možné vytvoriť aplikáciu, ktorá funguje v prehliadači aj vtedy, keď užívateľ nemá internetové pripojenie a ktorá ukladá dáta do lokálneho úložiska na užívateľovom počítači. Ak je internetové pripojenie k dispozícii, môže aplikácia synchronizovať dáta so vzdialeným serverom (HTML 5, 2012). CSS CSS (Cascading Style Sheets) je skratka pre šablóny kaskádových štýlov. CSS je jazyk pre popis spôsobu zobrazenia stránok napísaných v jazykoch HTML, XHTML alebo XML. Pomocou kaskádových štýlov sa vytvárajú štruktúrované dokumenty, teda oddeľuje 34

35 sa obsah dokumentu (HTML) od jeho vzhľadu (CSS). CSS poskytuje všetko podstatné pre určenie vzhľadu akejkoľvek www stránky (W3C, 2012). Jazyk bol navrhnutý organizáciou W3C, autorom prvotného návrhu bol Hakone Wium Lie. Zatiaľ boli vydané dve úrovne špecifikácie CSS1 a CSS2. Dňa 7. júna 2011 bola dokončená revízia CSS 2.1 a pracuje sa na verzii CSS3. Hlavným zmyslom je umožniť návrhárom oddeliť vzhľad dokumentu od jeho štruktúry a obsahu. Pôvodne to mal umožniť už jazyk HTML, ale v dôsledku nedostatočných štandardov a konkurenčného boja výrobcov prehliadačov sa vyvinul inak. Staršia verzia HTML obsahujú celý rad elementov, ktoré nepopisujú obsah a štruktúru dokumentu, ale aj spôsob jeho zobrazenia (CSS3, 2011) Java Java je objektovo orientovaný programovací jazyk vyvinutý firmou Sun Microsystems ako hlavný komponent rovnomennej platformy. Syntax jazyka vychádza hlavne z jazykov C a C++, avšak oproti nim obsahuje menej nízkoúrovňových prostriedkov a zameriava sa na objektovo orientovaný model programovania. Aplikácie v Jave sa nekompilujú do strojového kódu, ale do medzistupňa tzv. bytecode, ktorý nie je závislý na konkrétnej platforme. O jeho exekúciu sa stará Java Virtual Machine (JVM). Java je moderný programovací jazyk okolo ktorého sa združuje jedna z najväčších softvérových komunít. Aplikácie na báze objektovo orientovaného jazyka Java prinášajú rozšírenia webových prezentácií umožňujúce dynamickú zmenu obsahu (Java Sun, 2010). Java môže pokrývať rôzne aspekty webovej aplikácie, ale v zásade má dva prístupy. V prvom prístupe je Java vývojárskym popisom webovej aplikácie prostredníctvom určitej objektovej štruktúry na strane serveru, pričom smerom ku klientovi väčšinou dochádza k transformácii na technológie bližšie prehliadaču. Do rodiny rozšírení patria Javové applety, JavaScript, JavaFX a taktiež aplikácie programované v samotnej Jave. Pri druhej možnosti je Java vývojárskym aj prehliadačovým popisom a implementuje všetky aspekty webovej aplikácie prostredníctvom Java appletu cez jednotlivé balíčky a rozhrania jazyka Java. Java applet je distribuovaný prehliadaču vo forme byte kódu. Ten ho interpretuje, ak má k dispozícii JVM. Java platforma zabezpečuje kompatibilitu medzi operačnými systémami (Java Sun, 2010). 35

36 Java applety Java applety sú programové moduly, ktoré sa môžu jednoduchým spôsobom zaradiť na webovú stránku. Applet sa vloží do svojho dokumentu formou odkazu, aktiváciou ktorého prehliadač stiahne applet podobne ako obrázok. Kontrolu správnosti preneseného bajtového kódu a jeho následnú interpretáciu na cieľovom (klientskom) počítači realizuje modul Java Virtual Machine (JVM), ktorý je súčasťou Netscape Communicatora. Niektoré applety sú jednoúčelové a pri ich zaradení do svojej webovej stránky nemusíme ich činnosť bližšie špecifikovať. Častejší je ale prípad univerzálnejších appletov, ktorých činnosť môžeme prispôsobiť svojim požiadavkám pomocou parametrov appletu. Parametre appletu uvádzame v tele príkazu <APPLET> pomocou príkazov <PARAM>. Každý z týchto príkazov má dva parametre - NAME (udáva meno parametra appletu) a VALUE (udáva hodnotu parametra appletu - môže to byť číslo alebo reťazec znakov v úvodzovkách) (Java applety, 2009). V súčasnej dobe sú applety často využívané ku tvorbe grafických efektov pre oživenie webových stránok. Ich nevýhodou oproti dynamickému HTML a JavaScriptu je malá rýchlosť, vzniknutá nutnosťou načítať veľké množstvo tried. Na druhej strane možnosti Javy ďaleko presahujú využitie pre blikajúce tlačidlá či rozbaľujúce sa menu. Java applety sa často nachádzajú tam, kde skriptovacie jazyky nestačia zložitejšie algoritmy, graficky alebo časovo náročné prezentácie (Java applety, 2009). Najčastejšie sa applety používajú na oživenie webových stránok formou animovanej grafiky a zvukových efektov: Cyklicky sa meniaci text vo vodorovnom okne Reklamná tabuľa - analógia jednoriadkových svetelných reklám s textom pohybujúcim sa v rôznych smeroch so zmenou farieb a ďalšími efektmi Ubiehajúci panoramatický obrázok vo vodorovnom okne JavaFX Pri aktivácii stránky sa štartuje zvuková nahrávka (hovorené slovo, hudobný motív, zvukový efekt) (Java applety, 2009) JavaFX označuje balík produktov, ktorá obsahuje dve technológie: JavaFX Script a JavaFX Mobile. Ako platforma je založená na platforme Java, preto má aj rovnakú 36

37 prenositeľnosť, robustnosť a spoľahlivosť. JavaFX Script je skriptovací jazyk vyvinutý spoločnosťou Sun Microsystems za účelom zjednodušenia vytvárania grafických používateľských rozhraní pre vývojárov, programátorov a tvorcov internetových stránok, ktorý patrí do technológie JavaFX. Je to deklaratívny, objektovo orientovaný programovací jazyk. Jeho hlavnými vlastnosťami sú: Inkrementálne vyhodnocovanie a triggre, podporujúce štruktúru model-view Schopnosť využívať triedy jazyka Java First-class funkcie (využívajú sa vo funckionálnych jazykoch) Zrozumiteľnosť a ľahká čitateľnosť (Java, 2010) JavaScript JavaScript je skriptovací jazyk, ktorého kód beží lokálne v majoritných prehliadačoch. Je teda vhodný na implementáciu interakcií na strane klienta. V prípade nášho modelu aspektov webového formulára to znamená, že môže implementovať interaktívnosť v prehliadačovej rovine. Pri mnohých riešeniach tomu tak je napriek tomu, že existujú menšie odchýlky v jeho interpretácii v jednotlivých prehliadačoch a väčšie odchylky, spôsobené rôznou implementáciou DOM (Document Object Model), pomocou ktorého pristupuje k elementom. DOM je aplikačné rozhranie umožňujúce prístup alebo modifikáciu obsahu, štruktúry alebo štýlu dokumentu, prípadne jeho častí (Java, 2010). Jazyk Java je na jednej strane programátorský nástroj, na druhej strane je však pomerne náročný na zvládnutie. Firma Netscape navrhla kompromisné riešenie - 'zjednodušenú' Javu - JavaScript. Zvládnu ho bez problémov aj používatelia Internetu s neveľkými programátorskými skúsenosťami. Pri riešení jednoduchých úloh často siahnu po JavaScripte aj skúsení programátori. Hlavné rozdiely medzi Javou a JavaScriptom sú nasledovné: Program v JavaScripte interpretuje priamo prehliadač na klientskom počítači (žiadny preklad do bajtového kódu ako v Jave) JavaScript nie je v pravom slova zmysle objektovo orientovaný - nepozná triedy ani dedičnosť; samotní autori ho označili ako 'jazyk založený na objektoch', pretože poskytuje sadu predpripravených rozšíriteľných objektov 37

38 V Jave sú objekty prepájané už v priebehu prekladu do bajtového kódu, zatiaľ čo v JavaScripte už v priebehu programu (prípadné chyby zistí až prehliadač) Programy v JavaScripte sú pomalšie ako v Jave Celý zdrojový text programu v JavaScripte je obsiahnutý vo webovskom dokumente (v prípade jednoduchého programu to môže byť skôr výhoda), v prípade Javy je v dokumente iba príkaz volania appletu (Java, 2010) Knižnica jquery Knižnica jquery je ľahká cross-browser JavaScript knižnica, ktorá kladie dôraz na interakciu medzi JavaScriptom a HTML. Vydal ju v januári 2006 v BarCamp NYC vývojár John Resig. Je používaná na viac ako 34% z milióna najnavštevovanejších web stránok. jquery je aktuálne najpoužívanejšia knižnica. jquery je slobodný a otvorený software pod duálnou licenciou MIT a GPL v2. Syntax jquery je navrhnutý pre jednoduchšiu navigáciu dokumentu, výber DOM elementov, vytváranie animácií, spracovanie udalostí a vývoj Ajax aplikácií. jquery tiež poskytuje možnosti pre vývojárov na vytváranie pluginov, postavených na tejto JavaScript knižnici. Microsoft a Nokia na svojich platformách dodávajú jquery (jquery, 2012). jquery obsahuje nasledovné funkcie: Prechádzanie a modifikácia DOM (vrátane podpory pre CSS 1-3) Udalosti CSS manipulácia Efekty a animácie Ajax Rozšíriteľnosť pomocou pluginov (jquery, 2012) Ajax Ajax (Asynchronous JavaScript and XML) - je obecné označenie pre technológie vývoja interaktívnych webových aplikácií, ktoré menia svoj obsah bez nutnosti opakovaného načítania stránky. Ajax sa používa na tvorbu vysoko interaktívnych aplikácií. Bez použitia Ajaxu by užívateľ webovej aplikácie musel čakať na odpoveď od webového serveru. Aplikácia, ktorá používa Ajax, sa odošle ako príkaz na pozadie webového servera, zatiaľ čo užívateľ aplikáciu ďalej používa. (Ajax, 2005) 38

39 Ajax zahŕňa JavaScript, (X)HTML, CSS, DOM, XML na strane klienta a rôzne aplikačné riešenia na strane serveru, najčastejšie naprogramované v jazykoch PHP,.NET, Java. JavaScript na strane prehliadača vykonáva takmer všetku aplikačnú logiku. Patrí sem prenos údajov zo serveru, manipulácia s vizuálnymi prvkami pomocou DOM, úprava a prvotné spracovanie údajov získaných od užívateľa, ako aj užívateľovi prezentovaných. XHTML a CSS vytvárajú užívateľské rozhranie. Keďže sú štandardizované W3C, tvoria prostredie pre implementáciu grafického rozhrania, ktoré bude zobrazené takmer rovnako v rôznych prehliadačoch. V kombinácií s kaskádovými štýlmi a vhodným dizajnom poskytuje takáto aplikácia skvelú úžitkovú hodnotu a zachováva si takú portabilitu, akú môžu ponúknuť len webové aplikácie (Ajax, 2005). Aplikácie, využívajúce Ajax, sa môžu zdať zložité, ale proces odoslania požiadavky a spracovanie odpovede je vcelku nekomplikovaný. Jeden zo základných princípov Ajaxu je použitie skriptu pracujúceho na strane serveru a spätné získanie dát. Okrem mnohých výhod má Ajax aj nevýhody. Za najväčšiu možno pokladať celkovú náročnosť programovania a ladenia aplikácie pre rôzne webové prehliadače. Rámce postavené nad Ajaxom sa snažia čo najviac eliminovať vyššie spomínanú nevýhodu. Ajaxové rámce poskytujú rozsiahle knižnice preddefinovaných komponentov a na strane servera sa snažia poskytnúť čo najväčšiu modularitu a funkčnosť pre rôzne použitie aplikácie (Ajax, 2005) Adobe Flash Adobe Flash je multimediálna platforma, ktorá slúži na tvorbu webových animácií, videí a interaktívnych webových stránok. Flash sa často používa hlavne pre reklamy a hry. Flash upravuje vektorovú grafiku (označuje spôsob definovania obrazových informácií pomocou základných geometrických primitív akými sú bod, úsečka (vektor), priamka, krivka, mnohouholník, ktoré sa dajú vyjadriť matematickými rovnicami) a rastrovú grafiku (označuje spôsob uloženia grafickej informácie popisom jednotlivých bodov usporiadaných v pomyslenej mriežke), pre animácie textu, kresieb a fotografií. Podporuje obojsmerný prenos zvuku a obrazu, môže zachytiť vstup užívateľa pomocou myši, klávesnice, mikrofónu a kamery. Flash je založený na objektovo-orientovanom jazyku ActionScript. Obsah Flash aplikácie môže byť zobrazený na rôznych počítačových 39

40 systémoch a zariadeniach s použitím prehrávača Adobe Flash Player, ktorý je zdarma k dispozícii pre bežné webové prehliadače, niektoré mobilné telefóny a niekoľko ďalších elektronických zariadení. Adobe Flash je určený najmä pre grafikov. Kladie dôraz na vizuálnu stránku výsledného produktu a je tomu prispôsobený. Flash bol a stále je určený na tvorbu a publikovanie vektorovej grafiky a animácií na webe. Použitie tejto technológie je spravidla pre užívateľa internetu obťiažne (reklamné banery a vstupné animácie na stránku). Objavili sa už napríklad aj rozšírenia Firefoxu, ktoré Flash buď dočasne alebo úplne zakazujú (Adobe, 2011). Bližšie sa technológií Adobe Flash venujeme v podkapitole Adobe Flex Adobe Flex je kolekciou technológií tvoriacich rámec umožňujúci rýchly vývoj multiplatformových interaktívnych internetových aplikácií. Flex je orientovaný primárne na programátora. Na rozdiel od vývoja flashových aplikácií pomocou nástroja Adobe Flex si však kladie za ciel zjednodušiť tvorbu RIA. Flex definuje mnohé grafické komponenty a objekty, čím uľahčuje programátorovi prácu pri tvorbe grafického rozhrania, prináša nové ActionScript triedy, preddefinované komponenty grafického rozhrania a formát MXML na definíciu vizuálneho rozloženia aplikácie. Taktiež umožňuje tvoriť samostatné aplikácie na báze platformy Adobe AIR (Adobe Integrated Runtime) (Adobe, 2011). Rámec Flex je vysoko produktívny systém určený na tvorbu expresívnych mobilných, webových a počítačových aplikácií. Flex umožňuje vytvárať webové a mobilné aplikácie, ktoré zdieľajú spoločný zdrojový kód, čím sa znižuje čas aj náklady potrebné na vytvorenie aplikácie a jej dlhodobú údržbu. Hoci možno aplikácie Flex vytvárať iba pomocou bezplatnej súpravy Flex SDK, softvér Adobe Flash Builder môže zrýchliť vývoj prostredníctvom funkcií ako inteligentné úpravy kódu, ladenie s krokovaním, nástroje na profilovanie pamäte, výkonu a vizuálny dizajn. Nespornou výhodou Flashových a teda aj Flexových aplikácií je ich medziplatformová prenosnosť a nezávislosť na použitom operačnom systéme. Flex patrí medzi open source rámce, teda jeho SDK (knižnice, prekladač) a dokumentácia sú dostupné a šíriteľné zadarmo, čo umožňuje vývoj aplikácií v rôznych vývojových prostrediach. Spoločnosť Adobe taktiež poskytuje kompletnú online dokumentáciu a podporu vývojárom na svojom webovom portáli. Ako pri iných open source riešeniach existuje početná komunita vývojárov, ktorí 40

41 rozširujú základné možnosti rámca o mnohé vlastné knižnice a nadstavby nad Flex. Snahou týchto rozšírení je uľahčiť a centralizovať rôzne opakované alebo časovo náročné postupy spojené s tvorbou aplikácií. Vývoj aplikácií, doplnkov a nadstavieb rámca je možný úplne zadarmo, pri použití voľne dostupných nástrojov (Adobe, 2011) ASP.NET ASP.NET je súčasť.net Frameworku firmy Microsoft pre tvorbu webových aplikácií a služieb. Je nástupcom technológie ASP (Active Server Pages) a priamym konkurentom JSP (Java Server Pages). Aj keď názov ASP.NET je odvodený od staršej technológie pre vývoj webov ASP, obidve technológie sú veľmi odlišné. ASP.NET je založený na CLR (Common Language Runtime), ktorý je zdieľaný všetkými aplikáciami postavenými na.net Frameworku. Programátori tak môžu realizovať svoje projekty v akomkoľvek jazyku podporujúcom CLR, napr. Visual Basic.NET, JScript.NET, C#, Managed C++, ale aj mutácie Perlu, Pythonu a ďalších (Microsoft, 2012). ASP.NET uľahčuje programátorom prechod od programovania klasických aplikácií pre Windows do prostredia webu: stránky sú poskladané z objektov, ovládacích prvkov (Controls), ktoré sú obdobou ovládacích prvkov vo Windows. Pri tvorbe webových stránok je teda možné používať ovládacie prvky ako tlačidlo (Button), nápis (Label) a ďalšie. Týmto prvkom je možné priraďovať určité vlastnosti, zachytávať na nich udalosti, apod. Tak ako sa ovládacie prvky pre Windows samy kreslia do formulárov na obrazovku, kompilátor produkuje z webových ovládacích prvkov HTML kód, ktorý tvorí časť výslednej stránky poslanej do klientovho prehliadača (Microsoft, 2012) PHP PHP (PHP Hypertext Preprocessor) je open source programovací jazyk pôvodne navrhnutý na tvorbu dynamických webových stránok. Jazyk PHP je veľmi mocným skriptovacím jazykom nezávislým na platforme. Ak počítač podporuje jazyk PHP a má ho nainštalovaný na vami používanom serveri, môžete tento jazyk použiť bez ohľadu na typ servera. Keď si prehliadač vyžiada stránku PHP, skript PHP sa spustí na serveri a výsledná stránka HTML sa odošle prehliadaču. Stránky PHP môžu obsahovať text, kód HTML, kód PHP a ponúka funkcionalitu podobnú stránkam starších verzií jazyka ASP (PHP, ). 41

42 V súčasnosti sa hlavne používa v kooperácii s Apache HTTP Serverom a MySQL databázou. Spolu s Linuxom je táto kombinácia známa pod skratkou LAMP. Syntax jazyka kombinuje niekoľko programovacích jazykov (Perl, C, Pascal, Java). PHP bol vyvíjaný ako štruktúrovaný programovací jazyk. Objektovo orientovaný prístup je naplno podporovaný až od verzie 5. PHP je možné nasadiť na rôzne webové servery a operačné systémy. Obsahuje rozsiahle knižnice s funkciami pre spracovanie textu, grafiky, prácu so súbormi, prístup k väčšine SRBD a podporu celej rady sieťových protokolov. V PHP je naprogramovaných mnoho úspešných internetových projektov, napríklad Drupal, Joomla, Wordpress a MediaWiki (PHP, ) Redakčné systémy Redakčný systém (Content Management System - CMS) je systém, ktorý slúži na tvorbu a správu prezentácií na internete. Podstatou práce v redakčnom systéme je tvorba obsahu, ktorý je oddelený od dizajnu a funkcionality (sú dané na základe špeciálnych šablón) stránky. Obsahová zmena si nevynúti zmenu dizajnu alebo opravu ostatných informácií. Vďaka redakčnému systému má používateľ možnosť meniť obsah stránok a nemusí pritom ovládať programovací alebo skriptovací jazyk. Každý výrobca ponúka možnosť viacerých modulov, ktoré si používateľ podľa svojich potrieb a požiadaviek zakúpi. Náklady investované do redakčného systému sa vrátia vďaka nižším nákladom na údržbu a vytváranie podstránok a vzniká priestor pre ďalšie úspory (Mauthe, 2004). Požiadavky na redakčný systém v sebe zahŕňajú nasledovné: Funkcie vyhľadávania, ktoré sú pre návštevníkov webu veľmi dôležité Prispôsobenie individuálnym požiadavkám používateľa, aby sa podľa požiadaviek a potrieb mohol používateľ dostať čo najrýchlejšie k informáciám Možnosť viacerých jazykových variantov Archivácia verzií obsahu, pre prípad, že by bolo potrebné vrátiť sa k staršej verzii (Mauthe, 2004) WordPress WordPress je open source redakčný systém CMS (Content Management System) pre blogy a webstránky založený na technológií PHP. WordPress užívatelia si môžu nainštalovať a následne prepínať medzi jednotlivými témami. Témy umožňujú užívateľom meniť vzhľad a funkčnosť webových stránok WordPress alebo zariadení bez toho, aby sa 42

43 zmenil ich informačný obsah. Témy môžu byť nainštalované pomocou Wordpress "Dashboard" nástroja pre správu, alebo pomocou nahrávania cez FTP. PHP a HTML kód v témach možno tiež upravovať pre pokročilejšie úpravy. Veľmi populárnym rysom WordPress je jeho bohatá plugin architektúra, ktorá umožňuje používateľom a vývojárom rozšíriť svoje schopnosti na funkcie, ktoré sú súčasťou základnej inštalácie. WordPress má databázu viac ako pluginov (WordPress, 2012). WordPress má širokú užívateľskú a vývojársku komunitu, počet stiahnutí aktuálnej verzie 3.3 dosahuje vyše 19 miliónov. WordPress je používaný na viac ako dvanástich percentách celého svetového internetu, prekonáva tak OpenSource CMS ako Joomla či Drupal, ktoré se držia pod desiatimi percentami (W3Techs, 2012). Slovenský WordPress Autor úplne prvého prekladu do slovenčiny nám nie je známy. Slovenský preklad WordPress ponúkal na stiahnutie Meneldur na dnes už neexistujúcej stránke priestor.podklenbou.sk do leta Niesom prebral po Meneldurovi preklad Wordpresu od verzie 2.2 v auguste 2007 a pracoval na ňom do decembra Po vzájomnej spolupráci pri preklade WordPress modulov v roku 2008 pripravil preklad WordPress 2.7 Savione. V septembri 2007 bolo spustené diskusné fórum o webe a internetových technológiách na adrese ktorého najaktívnejšou časťou bola a aj naďalej je téma Podpora pre WordPress (sk.wordpress, 2012). Okrem aktívnej práce na preklade samotného WordPress, začali vďaka Techforum.sk vznikať aj preklady rôznych WordPress modulov, čím slovenská WordPress komunita nabrala nový spád. Ten sa spečatil v januári 2009 rozhodnutím autorov slovenského prekladu vytvoriť samostatnú slovenskú webstránku špecializovanú iba na WordPress. Po úspešných rokovaniach s WordPress Deutschland bola doména WordPress.sk presunutá do slovenských rúk a 16. januára 2009 bol spustený portál WordPress Slovensko pre všetkých používateľov WordPress v slovenčine (sk.wordpress, 2012). DotNetNuke DotNetNuke je open source webový redakčný systém na báze Microsoft. NET. DotNetNuke bol napísaný v jazyku VisualBasic.NET, ale neskôr ho od verzie 6 vývojári 43

44 prepísali do jazyka C #. Užívateľské rozhranie DotNetNuke 6 si výrazne zvyšuje produktivitu tým, že sa v ňom oveľa jednoduchšie budujú a udržiavajú webové stránky. Nový ovládací panel, aktualizované moduly správy a mega-menu spoločne zaisťujú vysoko modernú platformu pre budovanie a prevádzkovanie webových stránok. DotNetNuke systém umožňuje správu webových stránok bez znalosti programovacieho jazyka (DotNetNuke, 2012). DotNetNuke Corporation je správcom zdrojového DotNetNuke open source projektu. Open source verzia DotNetNuke sa nazýva Community Edition a je k dispozícii bezplatne na stiahnutie. Community Edition zahŕňa prístup k rámcu (frameworku) zdrojovému kódu a štandardnej inštalácii modulov (DotNetNuke, 2012). 44

45 2 Analýza využitia RIA technológií V prvej časti druhej kapitoly budeme vzájomne porovnávať dve RIA technológie Adobe Flash a Microsoft Silverlight. V druhej časti spravíme prieskum používaných RIA technológií v bankovom sektore SR. 2.1 Adobe Flash vs. Microsoft Silverlight Pri porovnaní prostredí Adobe Flash a Microsoft Silverlight sme sa zamerali na technické rozdiely a na niekoľko hlavných odlišností, ktoré sa nachádzajú medzi konkurentskými produktmi. Porovnávali sme nasledujúce časti: Vývojové prostredie Štruktúra aplikácie Video a Audio Podporované obrazové formáty Dostupnosť Podpora operačných systémov Tvorba animácií Textová reprezentácia Podpora web kamery Rozmiestnenie súborov Media Streaming Vývojové prostredie Adobe Flash používa vývojové prostredie Adobe Flash Professional. Je to nástroj, ktorý slúži na vytváranie multimediálneho obsahu, ako sú webové aplikácie, hry, filmy a mobilné aplikácie. Adobe Flash Professional je nástupca softvérového produktu známeho ako Future Splash Animator. Išlo o program, založený na vektorovej grafike, ktorý vyšiel v máji Future Splash Animator bol vyvinutý malou spoločnosťou FutureWave Software, pre ktorú to bol prvý softvérový produkt. V decembri 1996 FutureWave kúpila Macromedia a Future Splash Animator premenovala a vydala ako Macromedia Flash 1.0. V roku 2005 spoločnosť Adobe Systems prevzala Macromediu a následne bol v roku 2007 vydaný Adobe Flash CS3 Professional (Gay, 2012). 45

46 Obrázok 7: Vývojové prostredie Adobe Flash Zdroj: (Google, 2011) Microsoft Silverlight používa vývojové prostredie Microsoft Expression Blend alebo Visual Studio. Prostredie Microsoft Expression Blend je opísané v kapitole Štruktúra aplikácie Štruktúra aplikácie je u oboch technológií veľmi podobná, kde je grafický výzor definovaný v jazykoch postavených na XML. Pri prostredí Flesh je to MXML. Čo sa týka samotného programového kódu, Flesh aplikácie používajú jazyk ActionScript. ActionScript je objektovo orientovaný jazyk s plnou škálou ovládačov pre navrhovanie užívateľských prostredí (interfejsov). Pomocou jazyka ActionScript sa dajú vytvárať komplexné internetové aplikácie a animácie. Flash je primárne vektorovo orientovaný a text je tiež reprezentovaný vektorovo. Jeho kopírovanie a vyhľadávanie na stránke (ctrl+f) nie je možné. Ak je účelom stránky textová informácia, alebo práca s textom, nie je Flash tou najsprávnejšou voľbou (Adobe, 2011). Pri programovaní Silverlight aplikácií je dizajn zapísaný v XAML súbore, v inom súbore je k tomuto pripojený programový kód vo zvolenom programovacom jazyku - teda dizajn je od kódu oddelený. Pre programovanie Silverlight aplikácií si môžeme vybrať z dvoch.net programovacích jazykov Visual C# a Visual Basic. Visual C# je objektovo 46

47 orientovaný programovací jazyk. Medzi jeho najdôležitejšie vlastnosti patrí hlavne odolnosť a produktivita. C# je jazyk zameraný na tvorbu zložitejších aplikácií pre operačné systémy, od veľmi veľkých systémov používajúcich sofistikované operačné systémy po veľmi malé zariadenia pre špecializované úlohy. Visual Basic (VB) je pomerne jednoduchý programovací jazyk pre začiatočníkov, ale aj pokročilý programátor tu nájde pokročilé koncepty napr. ako objektové programovanie. Je vhodný pre aplikácie na jedno použitie, testovacie aplikácie a podobne (Microsoft Silverlight, 2010) Audio a Video Flash audio podporuje H.264 (MPEG-4 Part 10), AAC (MPEG-4 Part 3), F4V, MP4 (MPEG-4 Part 14), M4V, M4A, 3GP and QTFF (QuickTime File Format). Flash video podporuje formáty súborov videa SWF, FLV a F4V. Dáta v súboroch FLV sú kódované rovnakým spôsobom ako sú v súboroch SWF. Formát F4V je založený na základnom formáte mediálnych súborov ISO. Všetky tri formáty sú podporované v aplikácii Adobe Flash Player (Adobe Flash Video, 2010). Silverlight implementuje priemyselný štandard VC-1 kodek pre video a podporuje formáty H.264 (MPEG-4 Part 10), WMV (Windows Media Video), WMA (Windows Media Audio), AVC (Advanced Video Coding), AAC, MP3 vo všetkých podporovaných prehliadačoch (Firefox, Google Chrome, Safari, Internet Explorer), bez nutnosti použiť Windows Media Player, Windows Media Player ActiveX alebo Windows Media plug-iny (Microsoft, 2012) Podporované obrazové formáty Flash podporuje GIF, JPEG, PNG a PICT (Adobe Flash Video, 2010). Silverlight podporuje formáty súborov PNG, JPEG, GIF a Bitmap (Microsoft, 2012) Dostupnosť Flash poskytuje bohatú podporu funkcií pre užívateľov, ktorí majú sluchové či zrakové problémy. Poskytuje titulky videí pre sluchovo postihnutých, nástroje pre ľudí ktorí sú slepí alebo slabo vidiaci, ako je napr. čítačka obrazovky a lupa. Užívatelia, ktorí sa spoliehajú na prístup z klávesnice, môžu využiť známe skratky pre ovládanie videa, napr. tlačidlá ako Prehrávanie/Pauza, Zastavenie, Pretočenie, ktoré sa aktivujú medzerníkom. Pre ovládanie polohy je možné využitie šípkových klávesov. Ovládanie hlasitosti je 47

48 prístupné cez kurzorové klávesy, podobne ako klávesy Home a End pre pohyb na začiatok a koniec obsahu. Hlasitosť je tiež možné ovládať cez numerické klávesy (Flash vs.silverlight, 2009). Silverlight je prvý zásuvný modul pre prehliadač umožňujúci prístup ku všetkým systémovým farbám, umožňujúci ľuďom s čiastočnou poruchou zraku používať nástroje operačného systému pre realizáciu zmien, ako je prepínanie kontrastu alebo farebnosti pre uľahčenie čitateľnosti. Aj technológia Silverlight pochopiteľne umožňuje zachytávať udalosti z klávesnice a myši. Prehrávaný obsah je tiež možné bez problémov zväčšovať pomocou lupy a ďalších nástrojov pre zjednodušenie prístupu (Flash vs.silverlight, 2009) Podpora operačných systémov Posledná verzia Flash Playera 11.1 je dostupná pre operačné systémy Windows 7/ Vista/XP/Home/2000, Windows Server 2003/2008, Mac OS X, Linux, Solaris, HP-UX, OS/2, QNX, BeOS, a IRIX (Adobe, 2011). Silverlight podporuje iba Windows 7/Vista/XP/Home/2000, Windows Server 2003/2008, Mac OS X. Linux a Solaris chýbajú pretože, používatelia týchto systémov zvyčajne nemajú skúsenosti s technológiou Silverlight na ich počítačoch (Microsoft Silverlight, 2010) Tvorba animácií Flash pri tvorbe animácií používa animačný model, založený na sekvenčnom prechádzaní snímok na časovej osi (frame-based animation model). V animácii snímka za snímkou (frame-by-frame animation) vytvára objekt pre každú snímku, aby sa vytvorila animačná sekvencia (Adobe, 2011). Silverlight je založený na animačnom modely WPF, ktorý je založený na časovej osi a nie na snímkach, takže sa definujú začiatočné a koncové podmienky a Silverlight vypočíta ako to dosiahnuť. Nie je potrebné zaoberať sa maticami, ako vo Flash-i. Taktiež nie je potrebné počítať pozície objektov v jednotlivých snímkach (Microsoft Silverlight, 2010). 48

49 2.1.8 Textová reprezentácia Flash ukladá fonty ako definíciu tvaru, preto nevie oddeliť textovú vrstvu od animácie. Text typicky napísaný vo Flash komponente nebol nikdy priateľský k SEO (Optimalizácia pre vyhľadávače), hoci Adobe vytvoril inovácie pre Flash tak, že môže byť indexovaný a vyhľadávače ho začali indexovať (Flash vs.silverlight, 2009). V Silverlight aplikáciách sú používateľské rozhrania definované v XAML kóde a programy využívajú.net Framework. XAML sa používa pre značkovanie vektorovej grafiky a animácií. Text je generovaný na web serveri ako oddelená entita a dá sa čítať a sprístupniť zvlášť. Textový obsah vytvorený Silverlight-om je ľahko prehliadateľný a tým aj zapisovateľný, pretože nie je skomprimovanou súčasťou, ale je reprezentovaný ako text (XAML) (Flash vs.silverlight, 2009) Podpora web kamery Flash podporuje web kameru a mikrofón ako živú video a audio transmisiu a je v ňom naozaj ľahko použiteľná (Adobe Flash Video, 2010). Verzie Silverlight 1 až 3 nepodporujú web kameru ani mikrofón. Verzie Silverlight 4 a 5 už podporujú aj webovú kameru aj mikrofón, teda doplnky, ktoré sú k dispozícii už na prakticky každom notebooku, vrátane najlacnejších netbookov (Microsoft, 2012) Rozmiestnenie súborov Aplikácia alebo animácia Flash obsahuje iba jeden.swf súbor a všetky obrázky, texty a animácie sú uložené v tomto súbore. Kvôli komprimovanej povahe Flash komponentov nie sú obrázky ani text indexované vyhľadávacími prostriedkami, a teda nie sú prehliadateľné. Flash exportuje súbory do dvoch základných formátov:.swf v tomto formáte má súbor malú veľkosť, môže byť prehrávaný vo webovom prehliadači, ale potom je nutné nainštalovať prehrávač Adobe Flash Player, ktorý je voľne na stiahnutie na stránkach spoločnosti Adobe,.exe formát je určený pre spúšťanie v OS Windows (nie je nutné nainštalovať ďalší prehrávač), súbor má väčšiu veľkosť. Hovorí sa mu tiež projektor, pretože má v sebe implementovaný FlashPlayer (Flash vs.silverlight, 2009). 49

50 Rozmiestnenie Silverlight komponentov je omnoho komplexnejšie, alebo všetky individuálne komponenty je potrebné umiestniť zvlášť. Nasledovné komponenty dostanú správu od klienta pre každú web požiadavku Silverlight-u. XML súbory XAP súbory DLL súbory (ak sú potrebné) Silverlight.js súbor Nejaký ďalší JavaScript súbor Zdroje (obrázky, audio, video) (Flash vs.silverlight, 2009) Webhosting Flash neposkytuje až taký servis na hostenie obsahu a aplikácií, preto tvorba video web stránok vo Flash-i nie je až tak cenovo výhodná, ako využitie technológie Silverlight (Flash vs.silverlight, 2009). Microsoft Silverlight využíva služby Windows Live, ktorá ho robí jednoduchým pre vývojárov a dizajnérov, aby doručili svoje bohaté médiá k používateľom ako súčasť Silverlight aplikácie. Služba tiež umožňuje web vývojárom a dizajnérom hosťovať média a interaktívne aplikácie, pre Windows a Mac. Táto služba sa môže kombinovať s Microsoft Expression Studio a ostatnými nástrojmi k tvorbe interaktívneho obsahu stránok (Flash vs.silverlight, 2009) Zhodnotenie Nasledujúca tabuľka sumarizuje jednotlivé aspekty. Nejedná sa o jednoznačné závery, ktoré by presadzovali jednu z technológií, ale ide skôr o poukázanie na to, kedy a v akej oblasti danú technológiu použiť. 50

51 Tabuľka 5: Zhodnotenie technológií Flash a Silverlight Vlastnosť Flash Silverlight Vývojové prostredie x Štruktúra aplikácie x Audio a Video x Podpora obrázkov x Dostupnosť x Podpora OS x Tvorba animácií x Textová reprezentácia x Podpora web kamery x Rozmiestnenie súborov x Media streaming x Zdroj: (Flash vs.silverlight, 2009) 2.2 Prieskum používaných RIA technológií v SR Prieskum bol zameraný na používanie RIA technológií v bankovom sektore Slovenskej republiky. Do prieskumu bolo zahrnutých 51 web stránok z oblasti bankovníctva a financií. V prieskume sme sledovali použitie týchto technológií: Adobe Flash, Google Analytics, knižnica jquery, Silverlight, značkovací a skriptovací jazyk na strane klienta. Uvedené technológie sme do prieskumu zahrnuli pre lepší prehľad používaných technológií v oblasti programovania web stránok. Všetky sledované web stránky a údaje o použitých technológiách sú zahrnuté v Prílohe č. 1. Z prieskumu sme zistili nasledovné údaje: Technológiu Adobe Flash z 51 sledovaných web stránok využíva 22 stránok (43,14%), 29 stránok (56,86%) Adobe Flash aplikácie nevyužíva. Technológiu Google Analytics z 51 sledovaných web stránok vyžíva 32 stránok (62,75%), 19 stránok (37,25%) technológiu Google Analytics nevyužíva. Knižnicu jquery z 51 sledovaných web stránok využíva 29 stránok (56,86%), 22 stránok (43,14%) knižnicu jquery nevyužíva. Technológiu Silverlight nevyužíva žiadna web stránka zahrnutá do prieskumu. Všetky stránky zahrnuté do prieskumu využívajú na strane klienta značkovací jazyk HTML. Skriptovací jazyk JavaScript využíva na strane klienta 50 stránok, stránka nevyužíva JavaScript. Zistené údaje sú zobrazené na obrázkoch

52 Obrázok 8: Využitie Adobe Flash aplikácií Zdroj: (Vlastné spracovanie) Obrázok 9: Využitie technológie Google Analytics Zdroj: (Vlastné spracovanie) 52

53 Obrázok 10: Využitie knižnice jquery Zdroj: (Vlastné spracovanie) Metodológia získavania dát Pri zbere dát o jednotlivých technológiách použitých na web stránkach sme postupovali nasledovne: Prvým krokom je zobrazenie zdrojového kódu stránky. Ten si zobrazíme pomocou kliknutia pravého tlačidla myši na položku Zobraziť zdrojový kód. Následne sa zobrazí zdrojový kód celej web stránky. Druhým krokom je stlačenie kláves Ctrl+F, kde sa následne zobrazí okno Hľadať. Tretím krokom ja zadanie požadovanej skratky do poľa Hľadať. Obrázok 11: Zobrazenie okna pre hľadanie Zdroj: (Vlastné spracovanie) Technológia Adobe Flash je v zdrojovom kóde definovaná pomocou formátu.swf (ShockWave Flash). V zdrojovom kóde web stránok má formát SWF nasledovnú formu: 53

54 <script type="text/javascript" src="/java/swfobject.js"></script>. Pri knižnici jquery je formát definovaný pomocou jquery.js, kde zdrojový kód vyzerá nasledovne: <script type="text/javascript" src="/java/jquery.js"></script>. Technológia Google Analytics je v zdrojovom kóde web stránok definovaná nasledujúcimi spôsobmi: <script type="text/javascript" src="/cmsscripts/analytics.js"></script>, <script type="text/javascript" src="/sites/all/modules/contrib/ google_analytics/googleanalytics.js?c"> </script>, <script type="text/javascript"> var gajshost = ((" == document.location.protocol)? " : " document.write(unescape("%3cscript src='" + gajshost + "googleanalytics.com/ga.js' type='text/javascript'%3e%3c/script%3e")); </script>. Značkovací jazyk HTML je v zdrojovom kóde web stránok zapísaný nasledovne: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " <html xmlns=" Skriptovací jazyk JavaScript je v zdrojovom kóde web stránok zapísaný nasledovne: <script type="text/javascript"> Technológiu Silverlight, nakoľko ju nevyužíva žiadna z web stránok zahrnutých do prieskumu, sme sa pokúsili definovať na zahraničných web stránkach. Ako zdroj sme použili web stránku Pri web stránkach sme prítomnosť technológie Silverlight identifikovali tromi spôsobmi: 1. Na webovej stránke sa pri stlačení pravého tlačidla myši zobrazí položka Silverlight, napr. na web stránke 2. V zdrojovom kóde web stránky je technológia Silverlight definovaná pomocou formátu.xap (extensible Ajax Platform), napr. na web stránke Zápis formátu.xap v zdrojovom kóde web stránky vyzerá nasledovne: <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="700" height="550" backcolor="#0388b2"> <param name="source" value="clientbin/asteroid_command.xap"/>; 54

55 3. Tretí spôsob identifikácie technológie Silverlight je pomocou formátu Silverlight.js, viď napr. stránku V zdrojovom kóde je zapísaný nasledovne: <script type="text/javascript" src="silverlight.js"></script> Zhodnotenie prieskumu Výsledkom prieskumu je, že technológiu Silverlight vývojári pri tvorbe web stránok v oblasti bankovníctva a financií na Slovensku nevyužívajú, orientujú sa väčšinou na technológiu Adobe Flash. Pri tvorbe web stránok na strane klienta vývojári využívajú značkovací jazyk HTML a skriptovací jazyk JavaScript. Technológie Google Analytics a knižnice jquery neobsahujú všetky web stránky zahrnuté v prieskume. 55

56 3 Návrh a realizácia webovej aplikácie v prostredí Silverlight Posledná kapitola tejto práce bude zameraná na tvorbu aplikácie v prostredí Microsoft Expression Blend 4 a na tvorbu webovej stránky v prostredí Microsoft Expression Web 4. V prvej podkapitole si rozpíšeme jednotlivé nástroje, ktoré bude potrebné nainštalovať. V druhej podkapitole si opíšeme realizáciu webovej aplikácie. V záverečnej podkapitole sa budeme venovať tvorbe web stránky pre našu aplikáciu. 3.1 Nástroje na tvorbu RIA aplikácie a webu Microsoft Expression Blend 4 Základným nástrojom pri tvorbe aplikácie je prostredie produktu Microsoft Expression Blend 4, ktorý je bližšie opísaný v podkapitole Microsoft.NET Framework 4 Pred inštaláciou nástroja Expression Blend 4 treba do operačného systému nainštalovať Microsoft.NET Framework 4, ktorý obsahuje rozširujúce knižnice pre spustenie mnohých programov a aplikácií. Rozhranie Microsoft.NET Framework 4 je potrebné ku spusteniu a vývoju aplikácie určenej pre prostredie Microsoft Silverlight. Microsoft Silverlight A nakoniec, aby sa aplikácia spustila v prehliadači, je potrebné nainštalovať doplnok Microsoft Silverlight, ktorý je bližšie popísaný v kapitole 1. Všetky potrebné inštalačné súbory pre aplikáciu sú dostupné na web stránke - Microsoft Expression Web Pre tvorbu Web stránky sme použili vývojové prostredie Microsoft Expression Web 4. Nástroj Microsoft Expression Web je bližšie opísaný v podkapitole Realizácia webovej aplikácie Pri realizácii aplikácie sme si najprv stanovili funkčné a nefunkčné požiadavky a ďalej sme sa venovali samotnej tvorbe aplikácie. 56

57 3.2.1 Požiadavky na webovú aplikáciu Požiadavky na aplikáciu popisujú naše nároky na funkcionalitu, správanie a vzhľad aplikácie. Požiadavky sme rozdelili do dvoch skupín podľa typu na funkčné požiadavky a nefunkčné požiadavky. My sme si stanovili nasledovné požiadavky: Funkčné požiadavky 1. Operačný systém Windows 2003 a vyššie alebo Mac a vyššie 2. Prehliadač Internet Explorer 6 a vyššie, Mozilla Firefox 2.5 a vyššie, Opera 5 a vyššie, Google Chrome alebo Safari 3. Internet Information Services (IIS) pre Windows Server 4. Webový server Apache a vyššie 5. Zabezpečený užívateľský prístup do webovej aplikácie Nefunkčné požiadavky 1. Vývojové prostredie Microsoft Expression Blend 4 6. Vývojové prostredie Microsoft Expression Web 4 7. Nástroje Microsoft.NET Framework 4 a Microsoft Silverlight 8. Programovanie v.net jazyku C# a v značkovacom jazyku XAML Popis aplikácie Aplikácia je vytvorená na báze hry. Hra obsahuje herné pole, ktoré pozostáva z tehličiek, loptičky a podložky. Používateľ v nej musí loptičkou trafiť všetky tehličky. Pre každý prvok je potrebné definovať jeho umiestnenie v rámci plochy Canvas, ktorá bude zabezpečovať relatívnu polohu prvkov voči sebe aj pri prípadnej zmene veľkosti okna. Najprv sa budeme venovať vizuálnemu návrhu stránky, tvorbe jednotlivých objektov a pridaniu ovládacích prvkov. Nakoniec priradíme týmto objektom želanú funkcionalitu. Časť zdrojových kódov aplikácie je priložených v prílohách č. 2 a Založenie nového projektu Nový projekt internetovej aplikácie vytvoríme týmto spôsobom: 1. Na hlavnej stránke Start Page klikneme na File a vyberieme položku New Project 2. Vyberieme projektovú šablónu Silverlight Application + Website 3. Do textového poľa Name napíšeme názov aplikácie 4. Do textového poľa Location zadáme umiestnenie aplikácie 5. V textovom poli Language vyberieme Visual C# alebo Visual Basic 57

58 6. V textovom poli Version vyberieme verziu 3.0 alebo Uskutočnené zmeny potvrdíme stlačením tlačidla OK (viď obr. 12) Obrázok 12: Založenie nového projektu v Microsoft Expression Blend 4 Zdroj: (Vlastné spracovanie) Ďalej sa zobrazí pracovné prostredie Microsoft Expression Blend 4, ktoré je znázornené a detailne popísané na obrázku Tvorba klientskej aplikácie v prostredí Expression Blend 4 Ako prvé si vytvoríme pozadie hry. Nájdeme si ľubovoľný obrázok na internete a vložíme ho do adresára Game, kde sa nachádza hra. Obrázok sa v pracovnom prostredí Expression Blend nachádza v ľavej hornej časti s názvom Projects (viď obr. 13). Ďalej si musíme nastaviť potrebné rozhranie obrázku, aby sa nám pri spustení zobrazil na celú obrazovku. Rozhranie si nastavíme v časti Layout, kde zadáme šírku a výšku obrázku. Vodorovné a vertikálne rozhranie nastavíme na celú plochu (Strench) (viď obr. 14). 58

59 Obrázok 13: Načítanie obrázku na pracovnú plochu Zdroj: (Vlastné spracovanie) Obrázok 14: Rozhranie aplikácie pre notebook (15,4) Zdroj: (Vlastné spracovanie) Ďalej vytvoríme jednotlivé objekty hry. Pri tvorbe tehličky (Brick_uc) na ľavej strane vyberieme objekt Ellipse a vložíme ho na pracovnú plochu. Následne v pravej hornej časti v záložke Properties, klikneme na udalosť Brushes a vyberieme si požadovanú farbu objektu. Nakopírujeme ich pomocou CTRL+C a vložíme pomocou CTRL+V. V ďalšej udalosti Appearance si zvolíme vzhľad objektu a nakoniec v udalosti Layout si zvolíme požadovanú veľkosť obejktu. Podobne pokračujeme aj pri loptičke (Ball). Pri vytvorení podložky (Paddle) vyberieme objekt Rentagle. Viď zvýraznené časti na obrázku

60 Obrázok 15: Vloženie objektu Ellipse Zdroj: (Vlastné spracovanie) Vľavo hore je umiestnené malé tlačidlo (btfs), ktoré slúži na zobrazenie aplikácie na celú plochu. Po zobrazení aplikácie stačí stlačiť klávesu Enter Priradenie funkcií do aplikácie Teraz sa pustíme do kódovej časti stránky, aby sme do vložených objektov implementovali požadovanú funkcionalitu. Všetky funkcie sú voľné dostupné na webovej stránke Pri našej hre budeme potrebovať funkcie: Collision, GameEnvironment, FollowMouse, Motion, LastScore, Score a Lives. Funkcie si najskôr musíme stiahnuť do adresára Game. Funkcie priraďujeme z časti Assets - Behaviors (viď obr. 16). Ako prvú pridáme funkciu GameEnvironment do poľa LayoutRoot. Jednoducho ju len chytíme myšou a vložíme do LayoutRoot. Rovnako sa pridávajú aj ostatné funkcie. 60

61 Obrázok 16: Nahrávanie funkcií do projektu Zdroj: (Vlastné spracovanie) Teraz začneme funkciou pre loptičku, ku ktorej pridáme funkciu odrážania a pohybu. Sú to funkcie Collision a Motion. Pri funkcii Collision zvolíme v časti Change Properties v priečinku Action možnosť Motion_ChangeDirection. Pre funkciu Motion v časti Motion Properties si zvolíme smer (Direction) -60 a rýchlosť (Speed) 17 (viď obr. 17). Pre podložku sú to funkcie FollowMouse a Collision. Pri funkcii FollowMouse v časti Mouse Properties v okne Follow Position zvolíme X, aby sa podložka hýbala len vo vodorovnej polohe a pri funkcii Collision v časti Collision Properties označíme CollideWithAll (viď obr. 18). Obrázok 17: Definovanie funkcií pre loptičku Zdroj: (Vlastné spracovanie) Obrázok 18: Definovanie funkcií pre podložku Zdroj: (Vlastné spracovanie) 61

62 Pri tehličkách bude potrebná len funkcia Collision. V Collison Properties postupujeme rovnako ako pri podložke a v časti Change Properties v priečinku Action zvolíme možnosť GoToState v priečinku Value možnosť IsCollided. (viď obr. 19) Obrázok 19: Definovanie funkcií pre podložku Zdroj: (Vlastné spracovanie) Dôležitým objektom v našej aplikácii sú aj audio zvuky pri nárazoch loptičky a steny aplikácie, aby sa loptička odrážala. Steny a mp3 zvuky si tiež stiahneme zo stránky Microsoftu a nahráme si ich do adresára aplikácie. Do našej hry musíme pridať všetky štyri steny, ku každej musíme pridať funkciu Collision a v časti Collision Properties označiť CollideWithAll, pri spodnej stene (Bottom_Wall) musíme v priečinku Lives napísať hodnotu -1, aby sa nám loptička neodrážala naspäť. (viď obrázok 20) Obrázok 20: Definovanie funkcie pre spodnú stenu Zdroj: (Vlastné spracovanie) Pri nahrávaní mp3 zvukov do hry postupujeme rovnako ako pri nahrávaní stien aplikácie. Zvuky nahrávame len na steny, podložku a tehličky. Pri tehličke v časti Collision Properties v priečinku Audio vyberieme možnosť block.mp3. Pri podložke a stenách sa postupuje rovnako. (viď obr. 18) Praktická ukážka internetovej aplikácie sa nachádza na web stránke

63 3.3 Realizácia Web stránky pre prezentáciu aplikácie Web stránku sme vytvorili pre účely prezentácie webovej aplikácie Požiadavky na web stránku Funkčné požiadavky 1. Zabezpečený užívateľský prístup do webovej aplikácie 2. Podpora vybraných prehliadačov 3. Aplikácia je schopná komunikovať so serverom pomocou webových služieb Nefunkčné požiadavky 1. Vývojové prostredie Microsoft Expression Web 4 2. Úprava šablóny DWT 3. Úprava kaskádových štýlov 4. Publikovanie stránky na free-hostingový server Vytvorenie webu založeného na šablóne Webová stránka bola zhotovená pomocou nástroja Microsoft Expression Web 4. Nový web vytvoríme týmto spôsobom: 1. V hlavnej ponuke klikneme na Site (stránka) a vyberieme položku New Site (nová stránka). Zobrazí sa dialóg New (nový) s otvorenou záložkou Templates (šablóny) 2. Zo záložky Templates (šablóny) vyberieme vhodnú šablónu, v našom prípade je to Organization 5 3. Do textového poľa Location zadáme umiestnenie aplikácie 4. Do textového poľa Name napíšeme názov aplikácie 5. Uskutočnené zmeny potvrdíme stlačením tlačidla OK (viď prílohu č. 4) 6. V paneli Folder List (zoznam položiek) klikneme na súbor default.html pre zobrazenie šablóny DWT Pre vytvorenie webovej stránky sme použili jednu z kolekcie predinštalovaných šablón, ktoré v začiatkoch tvorby webu veľmi uľahčujú samotnú prácu na webe. V týchto šablónach nájdeme kód HTML a rozloženie založené na kaskádových štýloch (CSS). Každá šablóna sa pre prezentáciu a rozvrhnutie stránky riadi šablónou DWT (Dynamic Web Template). Šablóny sú rozdelené do troch skupín: Organization, Personal a Small Business. Pomocou kaskádových štýlov sa vytvárajú štruktúrované dokumenty, teda 63

64 oddeľuje sa obsah dokumentu (HTML) od jeho vzhľadu (CSS). Expression Web plne podporuje dizajn s využitím CSS Úprava šablóny DWT Pri úprave šablóny postupujeme nasledovne: 1. V paneli Folder List (Zoznam položiek) klikneme na súbor master.dwt pre otvorenie šablóny DWT pre editáciu 2. V náhľade Design (Návrh) postupne klikneme na jednotlivé nadpisy, ktoré chceme zmeniť a jednoducho ich prepíšeme, alebo vymažeme pomocou tlačidla Delete (viď prílohy č. 5 a 6) 3. Pre vloženie hypertextového odkazu klikneme pravým tlačidlom myši napr. na Kontakt a vyberieme položku Hyperlink Properties. V dialógovom okne Edit Hyperlink otvoríme súbor Kontakt a klikneme na default.htm. (viď prílohu č. 7) Pri ostatných nadpisoch pokračujeme podobne, a stlačíme OK 4. Následne v paneli Design klikneme v dolnej časti stránky tesne pred znak a postupujeme podľa bodu 2 5. Pre vloženie hypertextového odkazu postupujeme podľa bodu 3 6. V súbore Obrázky si budeme ukladať všetky obrázky, ktoré sme stiahli z internetu. Pre vloženie na plochu jednoducho zvolený obrázok chytíme myšou a vložíme ho na zvolené miesto (viď prílohu č. 8) 7. V ponuke File (súbor) klikneme na položku Save All (uložiť všetko). V dialógu pre potvrdenie aktualizácií, ktorý sa následne ukáže, stlačíme Yes (viď prílohu č. 9) Úprava kaskádových štýlov Pri úprave kaskádových štýlov postupujeme nasledovne: 1. Ak chceme zmeniť štýl stránky, otvoríme súbor master.dwt. V ponuke Format (formát) klikneme na položku CSS Styles (štýly CSS) a potom na položku Manage Style Sheet Links (správa webových šablón). Zobrazí sa dialóg Link Style Sheet (Pripojiť šablónu štýlov). V počiatočnom nastavení používa šablóna DWT tohto webu šablónu style2.css nachádzajúcu sa v zložke css (viď prílohu č. 10) 2. Klikneme na záznam styles/style2.css a stlačíme tlačidlo Remove (odstrániť). Potom klikneme na tlačidlo Add (pridať), vyhľadáme zložku styles a klikneme na súbor style1.css alebo style3.css. Stlačíme tlačidlo OK (viď prílohu č. 10) 64

65 3. V ponuke File (súbor) klikneme na položku Save All (uložiť všetko) 4. V paneli Manage Styles (Správa štýlov) klikneme pravým tlačidlom myši na v poradí druhú položku #masthead a potom klikneme na položku Modify Style (upraviť štýl). Otvorí sa dialóg Modify Style (viď prílohu č. 11) 5. V zozname Category (kategória) klikneme na položku Background (Pozadie) a zmeníme hodnotu vlastnosti backgorund-color z #fafaff na #C0C0C0. Potom stlačíme tlačidlo Browse (prechádzať), vyhľadáme zložku obrázky a dvakrát klikneme na obrázok liquid.jpg. Vlastnosť background-repeat nastavíme na hodnotu no-repeat. Vlastnosť (x)background-position nastavíme na hodnotu right, Vlastnosť (y)background-position nastavíme na hodnotu center, vlastnosť (x)background-size nastavíme na hodnotu 1128 a stalčíme OK (viď prílohu č. 11) 6. V zozname Category klikneme na položku Position (pozícia). Do poľa height zadáme hodnotu 100 a stlačíme OK 7. Uložíme súbor master.dwt. Otvorí sa dialóg Save Embedded Files (uložiť vložené súbory), potvrdíme počiatočú akciu Overwrite (prepísať) a stlačíme OK 65

66 Záver Cieľom tejto diplomovej práce bolo charakterizovať a opísať vytváranie a využitie interaktívnych aplikácií pomocou nástroja Silverlight. Prvým čiastkovým cieľom tejto práce bola analýza používaných technológií pre interaktívne webové aplikácie v oblasti bankovníctva a financií. Domnievame sa, že tento cieľ sme splnili v podkapitole 1.2, kde sú opísané jednotlivé RIA technológie, ktoré sa používajú pri tvorbe interaktívnych webových stránok a aplikácií. Využite technológií v oblasti bankovníctva a financií sme zahrnuli do prieskumu v podkapitole 2.2. Druhým čiastkovým cieľom práce bol prieskum využívania vybraných technológií v SR. Myslíme si, že tento cieľ sme splnili v podkapitole 2.2, kde sme preskúmali využitie RIA technológií na web stránkach bánk a ďalších finančných inštitúcií v SR. V tretej záverečnej kapitole sme navrhli a realizovali webovú aplikáciu založenú na technológií Microsoft Silverlight. Tento čiastkový cieľ sme splnili v podkapitole 3.2. Taktiež sme navrhli web stránku za účelom prezentácie webovej aplikácie. Domnievame sa, že splnením čiastkových cieľov sme splnili hlavný cieľ tejto diplomovej práce. Jej prínosom je podľa nášho názoru prieskum používaných RIA technológií v SR ako aj praktická ukážka vytvorenia webovej aplikácie v prostredí Microsoft Expression Blend 4. 66

67 Zoznam použitej literatúry Knižná literatúra: 1. ANDERSON, CH Pro Business Applications with Silverlight 4.New York: Apress, s. ISBN DOMES, M Tvorba WWW stránek. Brno: Computer Press, s. ISBN GHODA, A Introducing Silverlight 4. New York: Apress, s. ISBN GHOSH, J. - CAMERON, R Silverlight Recipes. New York: Apress, s. ISBN LAIR, R Beginning Silverlight. New York: Apress, s. ISBN LACKO, L Silverlight. Brno: Computer Press, s. ISBN LEEDS,Ch Microsoft Expression Web 2. Brno: Computer Press, s. ISBN MACDONALD, M Pro Silverlight 4 in VB. New York: Apress, s. ISBN MICHAIL, A Essential Silverlight 3. Boston: Pearson Education, s. ISBN NARAMORE, E. a kol Vytváříme webove aplikace. Brno: Computer Press, s. ISBN PROSISE, J Progamování v Microsoft.NET. Brno: Computer Press, s. ISBN PARIES, J Silverlight 3. New York: Apress, s. ISBN SHANNON, H Microsoft Silverlight 3. New York: Apress, s. ISBN ŠPINAR, D Tvoříme přístupné webové stránky. Brno: Zoner Press, s. ISBN MAUTHE, A Professional Content Management Systems. New York: Apress, s. ISBN

68 Internet: 16. Adobe. [Online] [cit ]. Dostupné na: < > 17. Adobe Flash Video. [Online] [cit ]. Dostupné na: < > 18. Ajax. [Online] [cit ]. Dostupné na: < > 19. CSS3. [Online] [cit ]. Dostupné na: < 20. DotNetNuke. [Online] [cit ]. Dostupné na: < DotNetNuke-6.aspx> 21. Flash vs. Silverlight [Online] [cit ]. Dostupné na: < > 22. HTML 5. [Online] [cit ]. Dostupné na: < > 23. Java. [Online] [cit ]. Dostupné na: < > 24. Java apllety. [Online] [cit ]. Dostupné na: < > 25. Java Sun. [Online] [cit ]. Dostupné na: < > 26. Jonathan Gay: The History of Flash [Online] [cit ]. Dostupné na: < > 27. jquery. [Online] [cit ]. Dostupné na: < > 28. Microsoft. [Online] [cit ]. Dostupné na: < > 29. Microsoft Silverlight. [Online] [cit ]. Dostupné na: < > 30. PHP. [Online] [cit ]. Dostupné na: < 31. RIA. [Online] [cit ]. Dostupné na: < > 68

69 32. Silverlight 3.0. [Online] [cit ]. Dostupné na: WordPress. [Online] [cit ]. Dostupné na: < WordPress Slovensko. [Online] [cit ]. Dostupné na: < W3C. [Online] [cit ]. Dostupné na: < > 36. W3techs. [Online] [cit ]. Dostupné na: < 69

70 Zoznam obrázkov Obrázok 1: Nárast počtu používateľov produktu Silverlight... 9 Obrázok 2: Jednotlivé časti prostredia Expression Blend Obrázok 3: Schéma vývoja webových aplikácií Obrázok 4: Spolupráca návrhára a vývojára pri návrhu prezentačnej vrstvy Obrázok 5: XAML ako rozhranie pri návrhu webovej aplikácie Obrázok 6: Architektúra technológie Silverlight Obrázok 7: Vývojové prostredie Adobe Flash Obrázok 8: Využitie Adobe Flash aplikácií Obrázok 9: Využitie technológie Google Analytics Obrázok 10: Využitie knižnice jquery Obrázok 11: Zobrazenie okna pre hľadanie Obrázok 12: Založenie nového projektu v Microsoft Expression Blend Obrázok 13: Načítanie obrázku na pracovnú plochu Obrázok 14: Rozhranie aplikácie pre notebook (15,4) Obrázok 15: Vloženie objektu Ellipse Obrázok 16: Nahrávanie funkcií do projektu Obrázok 17: Definovanie funkcií pre loptičku Obrázok 18: Definovanie funkcií pre podložku Obrázok 19: Definovanie funkcií pre podložku Obrázok 20: Definovanie funkcie pre spodnú stenu Zoznam tabuliek Tabuľka 1: Porovnanie verzií Silverlight 1.0 a Tabuľka 2: Komponenty Core Presentaton Components Tabuľka 3: Komponenty.NET Framework for Silverlight Tabuľka 4: Ďalšie komponenty technológie Silverlight Tabuľka 5: Zhodnotenie technológií Flash a Silverlight

71 Zoznam použitých skratiek Adobe AIR (Adobe Integrated Runtime) - Multiplatformové prostredie vyvinuté pre budovanie bohatých internetových aplikácií (RIA), ASP (Active Server Pages) - je skriptovacia platforma spoločnosti Microsoft, určená pre dynamické spracovanie webových stránok na strane serveru, CMS (Content Management System) - je systém na správu obsahu, ktorý slúži na organizáciu a vytváranie dokumentov a rôzneho obsahu. CLR (Common Language Runtime) - Virtuálna súčasť.net Frameworku, ktorá je zodpovedná za riadenie výkonu.net programov, DataGrid - Dátovo viazaná tabuľka s pripraveným rozhraním, DLL (Dynamic Link Library) - je skratka pre dynamicky spojenú knižnicu, DOM (Document Object Model) - je objektovo orientovaná reprezentácia dokumentu XML alebo HTML, FTP (File Transfer Protocol) - je štandardný sieťový protokol používaný pre prenos súborov z jedného hostiteľa na iného hostiteľa, napríklad Internet, GPU (Graphics processing unit) - Jednotka grafického spracovania, JSP (Java Server Pages) - Skriptovacia platforma pre vývoj webových aplikácií,.net - Vývojové prostredie pre programovanie a spoluprácu rôznych programovacích jazykov a knižníc, Plugin (Zásuvný modul alebo prídavný modul) je počítačový program, ktorý rozširuje funkcie iného programu alebo ho dopĺňa, RAW -Audio formát pre ukladanie neskomprimovaného zvuku, RIA (Rich Internet Application) - Bohaté internetové aplikácie, SEO ( Search Engine Optimization) - Optimalizácia web stránok pre vyhľadávače, Webhosting - Prevádzka webovej stránky na serveri, WPF (Windows Presentation Foundation) - Grafické prostredie spoločnosti Microsoft pre písanie Windows aplikácií, XAP (extensible Ajax Platform) - Rozšírenie súborov pre Microsoft Silverlight. 71

72 Prílohy 72

73 Príloha č. 2: Zdrojový C# kód aplikácie Zdrojový C# kód aplikácie má 38 riadkov 73

74 Príloha č. 3: Časť zdrojového XAML kódu aplikácie Kompletný zdrojový XAML kód aplikácie má 579 riadkov 74

75 75

76 Príloha č. 4: Výber šablóny Zdroj: (Vlastné spracovanie) Príloha č. 5: Šablóna pred úpravou Zdroj: (Vlastné spracovanie) 76

77 Príloha č. 6: Šablóna po úprave Zdroj: (Vlastné spracovanie) Príloha č. 7: Vloženie hypertextového odkazu Zdroj: (Vlastné spracovanie) 77

78 Príloha č. 8: Vloženie obrázku Zdroj: (Vlastné spracovanie) Príloha č. 9: Aktualizovať všetky stránky spojené zo šablónou DWT Zdroj: (Vlastné spracovanie) Príloha č. 10: Zmena štýlu šablóny Zdroj: (Vlastné spracovanie) 78

79 Príloha č. 11: Úprava štýlu Zdroj: (Vlastné spracovanie) 79