VYSOKÁ ŠKOLA POLYTECHNICKÁ JIHLAVA Katedra elektrotechniky a informatiky
Webová aplikace – internetová hra „Bitevní pole“ bakalářská práce
Autor: Jan Pošvář Vedoucí práce: PaedDr. František Smrčka, Ph.D. Jihlava 2013
ANOTACE Tato bakalářská práce se zabývá návrhem webové aplikace obsahující online tahovou strategii situovanou do prostředí novověké Evropy a diskusní fórum pomocí frameworku ASP.NET MVC3 od společnosti Microsoft. Nejprve jsou popsány a vysvětleny použité technologie, poté se práce zabývá analýzou, návrhem a realizací aplikace.
ABSTRACT This bachelor thesis describes the design of web application including online turn-based strategy situated in early modern Europe and forum using Microsoft’s ASP.NET MVC3 framework. In the first part are described technologies. The second part deals with a detailed development of application. This section is generally divided into two stages that describe the analysis and implementation.
KEYWORDS Web application, ASP.NET, Model-View-Controller, Transact-SQL, Razor View Engine, online strategy, forum
Poděkování Na tomto místě bych velmi rád poděkoval vedoucímu své bakalářské práce PaedDr. Františkovi Smrčkovi, Ph.D. za pomoc a čas, který mi věnoval při konzultacích, i za jeho cenné rady.
Prohlašuji, že předložená bakalářská práce je původní a zpracoval jsem ji samostatně. Prohlašuji, že citace použitých pramenů je úplná, že jsem v práci neporušil autorská práva (ve smyslu zákona č. 121/2000 Sb., o právu autorském, o právech souvisejících s právem autorským a o změně některých zákonů, v platném znění, dále též „AZ“). Souhlasím s umístěním bakalářské práce v knihovně VŠPJ a s jejím užitím k výuce nebo k vlastní vnitřní potřebě VŠPJ. Byl jsem seznámen s tím, že na mou bakalářskou práci se plně vztahuje AZ, zejména § 60 (školní dílo). Beru na vědomí, že VŠPJ má právo na uzavření licenční smlouvy o užití mé bakalářské práce a prohlašuji, že s o u h l a s í m s případným užitím mé bakalářské práce (prodej, zapůjčení apod.). Jsem si vědom toho, že užít své bakalářské práce či poskytnout licenci k jejímu využití mohu jen se souhlasem VŠPJ, která má právo ode mne požadovat přiměřený příspěvek na úhradu nákladů, vynaložených vysokou školou na vytvoření díla (až do jejich skutečné výše), z výdělku dosaženého v souvislosti s užitím díla či poskytnutím licence. V Jihlavě dne 14.12.2012 .......................................................... Podpis
Seznam použité literatury ........................................................................................ 41
8
Seznam obrázků....................................................................................................... 42
9
Seznam tabulek ........................................................................................................ 43
10 Seznam zkratek ........................................................................................................ 44
1 Úvod Když jsem se ve svých šestnácti letech poprvé připojil na vlastním počítači na internet, věděl jsem, že si nevystačím s pouhým prohlížením obsahu stránek, ale že budu tento obsah vytvářet včetně samotných webových aplikací. Jakmile jsem se dozvěděl pár základních informací o HTML, vytvořil jsem své první stránky. Když počáteční nadšení opadlo, zjistil jsem, že moje první stránka je pouhý statický web plný nesmyslných prvků a ani obsahově to nebyl žádný zázrak. Přesto jsem se nevzdal a započal tak dlouhou cestu sebezdokonalování, objevování nových technologií a nových postupů při tvorbě webových aplikací. Po dlouhé době, kdy jsem poznával kouzlo technologií jako je CSS, Javascript, PHP a MySQL jsem se dostal na rozcestí. Bylo mi jasné, že pro moji budoucnost bude klíčové mít co nejhlubší znalosti nějakého skriptovacího jazyka a vhodného SQL. Otázka byla, které by to měly být? Nabízelo se mi pokračování v získávání znalostí o PHP, ale na druhou stranu jsem věděl, že existují jiné technologie, které nejsou tak úzce zaměřené na tvorbu webových aplikací. Když na odborné praxi jsem se naučil něco málo o technologii ASP.NET a T-SQL, měl jsem v tom jasno. Vybral jsem si tento projekt, který je založený především na pochopení a použití frameworku ASP.NET MVC3 od společnosti Microsoft postaveného, jak je ze jména patrné, na technologii ASP.NET a architektuře Model-View-Controller. K tomu jsem se rozhodl využít vývojové prostředí Visual Studio, konkrétně Visual Web Developer Express 2010, který se používá pro tvorbu webových stránek, webových aplikací a webových služeb a je poskytován zdarma. Jako úložiště dat jsem si zvolil taktéž zdarma poskytovaný Microsoft SQL Server 2008 R2 Express. Hlavní náplní tohoto projektuje vytvoření online tahové strategie včetně diskusního fóra. Důvodem volby byl výrazný ústup mého oblíbeného žánru her – tahových strategií. V dnešní době je dáván důraz především na akci, rychlost a jednoduchost her, jinak tomu není ani u internetových online her. Nejrozšířenější druh internetových online strategií (např. Travian, Pán hradu, Divoké kmeny, apod.) mají v zásadě podobný princip – něco postavit, vytvořit obrovské množství jednotek a někam je poslat. Stavba, zisk, přesuny jednotek apod. probíhají v závislosti na čase. Pokud hráč přistupuje častěji do hry, dosahuje zpravidla lepších 9
výsledků. Zbytky jakékoliv vyváženosti hry pak naprosto ničí placené služby, které jakkoliv zasahují do hry (rychlejší příjmy, rychlejší stavba, silnější jednotky apod.). Jiným, ale bohužel taktéž nepovedeným způsobem, je vytváření internetových online verzí starých počítačových her. Většinou se sice jedná o jiný žánr (např. Quake Live), ale v minulém roce vyšla i realtime strategie Age of Empires online. Přestože byl povětšinou zachován původní princip hry, byly přidány placené služby umožňující stavbu silnějších jednotek, lepších budov, větších příjmů z těžby surovin apod. Pro občasného hráče je tato hra potom naprosto nepřijatelná. Nezmínil jsem ještě jednu skupinu her. Tím jsou klasické online hry založené na přepočtech (např. Dark Elf, Berlin Game, Insect World). Jejich vývoj je povětšinou zastaven. Jednalo se o jednoduché hry, kde hráč měl přidělené nějaké prostředky a kola na jeden den. Po odehrání všech kol pak bylo nutné čekat na tzv. přepočet, který vyhodnotil hráčovi tahy a přidělil nová kola. V tomto případě byl největším problémem nutný přístup ke hře každý den a naprostá nezáživnost v počátcích hry. Moje aplikace nabídne hráčům hru, kde nebude záležet na penězích do hry vložených, ani na obětovaném čase. Každá dvojice hráčů si bude moci zvolit vlastní tempo hraní, budou mít v maximální možné míře co nejrovnější startovní podmínky.
10
2 Vývojová prostředí 2.1
Visual Studio 2010 Express
Microsoft Visual Studio je vývojové prostředí od spolčenosti Microsoft. Může být použito pro vývoj konzolových aplikací a aplikací s grafickým rozhraním spolu s aplikacemi Windows Forms, webovými stránkami, webovými aplikacemi a webovými službami jak ve strojovém kódu, tak v řízeném kódu na platformách Microsoft Windows, Windows Mobile, Windows CE, .NET, .NET Compact Framework a Microsoft Silverlight. Visual Studio podporuje jazyky prostřednictvím jazykových služeb, což umožňuje, aby editor kódu a debugger podporoval jakýkoliv programovací jazyk. Mezi vestavěné jazyky patří C/C++ (použitím Visual C++), VB.NET (použitím Visual Basic .NET) a C# (použitím Visual C#). Podpora dalších jazyků jako Oxygene, F#, Python a Ruby spolu s ostatními mohou být přidána jazykovými službami, které ale musí být nainstalovány zvlášť. Také je podporováno XML/XSLT, HTML/XHTML, JavaScript a CSS. Visual Studio Express jsou sady odlehčených individuálních IDE, které jsou poskytovány zdarma. Obsahují jen malou sadu nástrojů v porovnání s ostatními systémy od Microsoftu. Jsou zbavené podpory vzdálené databáze pro designer dat, designer tříd a několik dalších nástrojů a prvků, stejně jako podpory rozšíření. Nejsou k dispozici x64 překladače. Express edice také nepoužívají celou MSDN knihovnu, ale používají MSDN Express Library.[1]
2.2
Microsoft SQL Server 2008 R2 Express
Microsoft SQL Server je relační databázový a analytický systém vyvinutý společností Microsoft. Používá Transact-SQL (verze jazyku SQL od firmy Microsoft). Ve verzi Express je poskytován zdarma a obsahuje hned několik omezení jako maximální velikost databáze, maximální velikost operační paměti a využití pouze jednoho procesoru. Mně postačí pouze samotný databázový stroj, který je potřeba pro používání databázových souborů ve Visual Studiu. Vytvořené databázové soubory pak lze pomocí nástroje SQL Database Publishing Wizard naimportovat do MS SQL databáze pokud
11
není na serveru povolen přístup přímo k databázovému stroji. SQL Database Publishing Wizard je taktéž zdarma poskytovaný nástroj od společnosti Microsoft.
2.3
Firebug
Firebug je doplňkem pro internetový prohlížeč Mozilla Firefox. Umožňuje kontrolu a úpravu HTML kódu, práci s kaskádovými styly, zobrazení jednotlivých stylů ke každému elementu a případnou jejich editaci, zobrazení měřítka na obrazovce, sledování všech dotazů vyvolaných ze stránky. Obsahuje i ladící nástroj pro Javascript včetně konzole pro příkazy, okno pro zobrazení chyb, které se vyskytly při zobrazení stránky. Tento doplněk lze nainstalovat i na Internet Explorer, Safari a Opera, ale v jeho zjednodušenější verzi Firebug Lite. Je šířen jako opensource pod BSD licencí.
12
3 Využité technologie 3.1
HTML
HyperText Markup Language je jedním z jazyků pro vytváření stránek v systému World Wide Web, který umožňuje publikaci dokumentů na Internetu. Je charakterizován množinou značek (tzv. tagů) a jejich atributů definovaných pro danou verzi. Mezi značky se uzavírají části textu dokumentu a tím se určuje význam obsaženého textu. Momentálně se nachází ve verzi 4.01 vydána 24. prosince 1999. Podle původního předpokladu se mělo jednat o poslední verzi, po které by se přešlo na XHTML, přesto je dnes ve vývoji verze 5, která přináší mnoho nových prvků, které u starších verzí bylo zvykem vytvářet s použitím jiných technologií.[2]
3.2
CSS
Cascading Style Sheets je jazyk pro popis způsobu zobrazení stránek napsaných v jazycích HTML, XHTML nebo XML. Jazyk byl navržen standardizační organizací W3C. Hlavním smyslem je umožnit návrhářům oddělit vzhled dokumentu od jeho struktury a obsahu. Byly vydány zatím dvě úrovně specifikace CSS1 a CSS2, 7. června 2011 byla dokončena revize CSS2.1 a pracuje se na verzi CSS3. [3]
3.3
Javascript
Používá se jako interpretovaný programovací jazyk pro WWW stránky, často vkládaný přímo do HTML kódu stránky. Jsou jím obvykle ovládány různé interaktivní prvky GUI (tlačítka, textová políčka) nebo tvořeny animace a efekty obrázků. Jeho syntaxe patří do rodiny jazyků C/C++/Java, ale s programovacím jazykem Java jej vedle názvu spojuje jen podobná syntaxe. Program v Javascriptu se obvykle spouští až po stažení WWW stránky z Internetu (tzv. na straně klienta). Z toho plynou jistá bezpečností omezení, Javascript např. nemůže pracovat se soubory, aby tím neohrozil soukromí uživatele. [4]
13
3.4
jQuery
jQuery je malá javascriptová knihovna, která klade důraz na interakci mezi Javascriptem a HTML. Je multiplatformní pod duální licencí MIT a GPL. Microsoft tuto knihu převzal a použil v ASP.NET AJAX a ASP.NET MVC frameworku.[5]
3.5
ASP.NET
ASP.NET je součást .NET Frameworku pro tvorbu webových aplikací a služeb. Je nástupcem technologie ASP (Active Server Pages) a přímým konkurentem JSP (Java Server Pages). Ačkoliv název ASP.NET je odvozen od starší technologie pro vývoj webů ASP, obě technologie jsou velmi odlišné. ASP.NET je založen na CLR (Common Language Runtime), který je sdílen všemi aplikacemi postavenými na .NET Frameworku. Programátoři tak mohou realizovat své projekty v jakémkoliv jazyce podporujícím CLR. Aplikace založené na ASP.NET jsou také rychlejší, neboť jsou předkompilovány do jednoho či několika málo DLL souborů, na rozdíl od ryze skriptovacích jazyků, kde jsou stránky při každém přístupu znovu a znovu parsovány.[6]
3.6
C#
C# je vysokoúrovňový objektově orientovaný programovací jazyk vyvinutý společností Microsoft zároveň s platformou .NET Framework. Tento jazyk je založený na jazycích C++ a Java (je tedy nepřímým potomkem jazyka C, ze kterého čerpá syntaxi). Jeho vlastnosti jsou ty, že je case sensitive, neobsahuje a ani nepotřebuje dopřednou deklaraci, je typově bezpečnější než C++, neexistují žádné globální proměnné a metody, všechny funkce a metody musí být deklarovány uvnitř tříd, každá třída může být potomkem pouze jedné třídy, jednodušší práce s datovým atributem při zachování principu zapouzdření (pomocí Property, která zvenčí funguje jako datový atribut, ale uvnitř Property si můžeme definovat get a set metody. V roce 2010 vyšla verze 4.0.[7]
3.7
T-SQL
Transact-SQL je proprietární rozšíření pro SQL od společností Microsoft a Sybase. Microsoft tento jazyk používá ve svých produktech Microsoft SQL Server. T-SQL 14
poskytuje
širokou
škálu
funkcionality
pro
programátory
nebo
databázové
administrátory. Transact-SQL umožňuje řízení SQL dotazů, podmíněné zpracování konstrukcemi IF, ELSE, CASE nebo WHILE, využití zabudovaných funkcí MSSQL serveru, nebo také sekvenční zpracování pomocí kurzorů. Velká síla T-SQL je v uložených procedurách, díky nimž mohou programátoři definovat dávky SQL a znovu využívat kód, definovat triggery, nebo například řešit část aplikační logiky už na databázovém serveru.[8]
3.8
LINQ
Language Integrated Query, tedy integrovaný dotazovací jazyk přináší nový způsob pro dotazování nad jakýmikoliv daty, usnadňuje jejich tvorbu, třídění a vyhledávání v nich. LINQ to Objects umožňuje dotazování nad normálními objekty (respektive jejich kolekcemi), LINQ to SQL přináší nový způsob pro práci s databázemi a LINQ to XML umožňuje pracovat s XML soubory.[9]
3.9
ASP.NET MVC
ASP.NET MVC je oficiální framework postavený na technologii ASP.NET. Umožňuje snadněji vyvíjet aplikace podle architektury Model-View-Controller. ASP.NET MVC má představovat alternativu oproti Web Forms.
3.9.1
Web Forms
Cílem této technologie je přiblížit možnosti vývoje webových aplikací možnostem vývoje desktopových aplikací. Proto se Microsoft snažil skrýt jak HTTP, tak HTML na základě modelování uživatelského rozhraní pomocí objektů řízených serverem. Používá k tomu ViewState, který uchovává informace mezi opakovaným odesíláním formulářů na server (tzv. PostBack) v zakódovaném tvaru ve skrytých formulářových polích, a Session State, který ukládá všechny informace na server a předává pouze jednoznačný identifikátor.
15
3.9.2
Hlavní nevýhody Web Forms
Přenos obrovského množství dat (klidně i stovky kilobajtů) pomocí ViewState způsobuje pomalejší odezvy webové aplikace. Nemusí se jednat o rozsáhlé webové aplikace, stává se to zvláště při špatném používání ViewState. Aplikaci lze sice rozdělit na několik vrstev (Bussines Layer, Data Access Layer, Presentation Layer, apod.), ale není to tak jednoznačné a lze velmi snadno vkládat aplikační logiku přímo do prezentačního kódu. To pak znemožňuje jakékoliv testování. Ovládací prvky řízené serverem se překládají do HTML ovšem nekontrolovaným vlastním způsobem. To může komplikovat použití kaskádových stylů. Také přidělování nepředvídatelných a složitých identifikátorů skoro znemožňuje použití javascriptů.
3.9.3
Architektura Model-View-Controller
ASP.NET MVC obsahuje vlastní upravenou variantu poměrně staré architektury Model-View-Controller (existuje již od roku 1978). Tato architektura je založena na rozdělení aplikace na tři části: •
Model – zajišťuje práci s daty
•
View – pouze zobrazuje uživatelské rozhraní
•
Controller – stará se o komunikaci s uživatelem, zachytávání událostí, apod.
Model je základním stavebním kamenem celé aplikace. Obsahuje veškerou práci s daty, jejich čtení, zpracování, zápis např. do databáze, XML souborů a dalších. Veškerá View pak obsahují logiku potřebnou k zobrazení dat z Modelu, a nic víc. Nestará se o akce uživatele. S Modelem přímo vůbec nekomunikuje. Všechny požadavky ze stran klienta přijímá a zpracovávají přímo Controllery. V nich se pak rozhoduje, které View se zobrazí a které operace z Modelu se budou volat. Všechny tyto tři části jsou v maximální možné míře na sobě nezávislé. Změny provedené v jedné části neovlivňují ostatní. Také tím, jak tato architektura funguje, dává programátorovi jasně najevo, kam který kód má napsat. Mnohem snazší je testování aplikací. Také je možné vyvíjet aplikace paralelně. V ASP.NET MVC jsou vlastní Controllery odvozené ze System.Web.Mvc.Controller. Každá public metoda vlastní třídy se nazývá action metodou, která je spojena
16
s konfigurovatelnou URL prostřednictvím routovacího systému ASP.NET. Tento systém funguje tak, že uživatel zadá do prohlížeče URL adresu s požadavkem. Ten se nejprve dostane do routovacího modulu. Tento modul je pouze tabulkou se seznamem pravidel, podle kterých se rozhoduje, která action metoda Controlleru se bude volat. Na Obrázek 1: Interakce v aplikaci ASP.NET MVC je vidět, jak probíhá interakce mezi Controllerem, Modelem a View.
Obrázek 1: Interakce v aplikaci ASP.NET MVC [10]
3.9.4
Razor View Engine
ASP.NET MVC umožňuje volbu View Engine. Lze si vybrat mezi standardním ASP.NET View Enginem, který zpracovává ASPX stránky, nebo Razor View Enginem, který kombinuje HTML s dvěma hlavními jazyky .NET platformy – C# a VB.NET (soubory mají příponu .CSHTML a .VBHTML). Nahrazuje tradiční bloky <% %> jediným znakem @.Výsledný kód je tak lépe čitelný než dosavadní ASPX stránky. Podporuje sdílení kódu mezi více View. Razor také obsahuje doplněnou knihovnu Html.Helpers o nové třídy Chart (vykreslování grafů podobně jako to je v ASP.NET 4), WebGrid (vykresluje Data Grid včetně s možností řazení a stránkování), Crypto (používá hashovaní algoritmy), WebImage, WebMail. Samozřejmostí je podpora IntelliSense (automatické doplňování) ve Visual Studiu.
3.9.5
Porovnání ASP.NET MVC s Web Forms
ASP.NET MVC není nástupcem Web Forms, je pouze alternativou. To dokazuje společnost Microsoft, která tvrdí, že obě technologie jsou stále aktivně vyvíjeny a podporovány a neexistuje žádný plán upustit od Web Forms. Výběr mezi nimi je tedy záležitost pouze filozofie vývoje.
17
Web Forms stojí na tom, že by mělo být UI stavové, a pro tento účel dodává sofistikovanější abstraktní vrstvu nad HTTP a HTML. To je vhodné pro programátory, kteří jsou navyklí stylu programování drag-and-drop z Windows Forms. ASP.NET MVC nechává HTTP bezstavové a nutí programátora porozumět, jak webové aplikace skutečně fungují. To ale není na škodu, naopak to umožňuje psát webové aplikace moderně a s čistým kódem, který je jednodušší rozšířit a udržovat. [10]
18
4 Analýza a návrh aplikace Následující kapitoly se věnují vývoji samotné aplikace. Způsob, jakým aplikaci vyvíjím je založen na vodopádovém modelu. Tzn., že jednotlivé etapy jsou seřazeny za sebou a přechod z předcházející do následující etapy je možný pouze až po ukončení předcházející etapy. Výhodou tohoto modelu je jednoduchost, každá etapa je jednoznačná. Nevýhodou je nemožnost změn v ukončených etapách. Často pak je nutné začít od úplného začátku. Navzdory těmto výrazným nevýhodám je tento model naprosto dostačující pro podobné projekty jako tento, kdy se programátor zaměřuje hlavně na pochopení nových technologií.
4.1
Specifikace požadavků
Požadavky mé aplikace jsou především cíle této bakalářské práce. Požaduje se následující: •
Aplikace bude umožňovat hraní hry registrovaným uživatelům mezi sebou. Před samotným hraním je nejprve nutné umožnit volbu vstupních podmínek do hry (volba jednotek).
•
Každá hra bude zaznamenávána, aby bylo možné ji znovu zrekonstruovat. Zobrazené záznamy pak bude možné okomentovat a ohodnotit.
•
Pro komunikaci bude diskusní fórum, kde budou zprávy členěny na kategorie. Tyto kategorie budou vytvářeny pouze administrátory. Uživatelé budou moci mazat vlastní příspěvky, administrátoři pak jakékoliv příspěvky nebo rovnou celé kategorie.
•
Vyhledávač uživatelů, pomocí kterého si uživatel najde hledaný profil, zobrazí jej a bude mít možnost vyhledaného uživatele ohodnotit nebo přidat mezi přátele. Superadministrátor bude mít navíc možnost uživatele smazat.
19
4.2
Use Case Diagram
Na základě popsané funkcionality jsem vytvořil Use Case Diagram, který zobrazuje
s
chování systému z hlediska uživatele.
<>
maže uživatele
hodnotí uživatele
přidá přítele
superadministrátor maže kategorii
vytvoří kategorii
<> maže zprávu
<>
píše zprávu
<> prohlíží profil hráče
s
<> vybírá kategorii
administrátor
vytvoří nový profil
maže komentář
<> píše komentář
<>
<>
prohlíží hru
hodnotí hru
s
vyzívá hráče
user hraje hru
odhlašuje se
přihlašuje se
ruší výzvu
s
přijímá výzvu
visitor
Obrázek 2: Use Case Diagram
20
4.2.1
Popis aktérů z diagramu na Obrázek 2: Use Case Diagram
Visitor je neregistrovaný uživatel, který se může pouze registrovat, všechny funkce webu jsou mu ukryty. User, jinak také registrovaný uživatel, může hrát hru, psát zprávy do diskusního fóra, hodnotit ostatní hráče nebo si je přidávat mezi přátele, hodnotit, komentovat hru, prohlížet veškeré dostupné informace na webu. Administrátor je registrovaný uživatel, který má navíc za úkol mazat nevhodné zprávy a komentáře, řídí tak celé diskusní fórum. Superadministrátor je správce hry. Jemu jedinému je umožněno promazávání uživatelských účtů.
4.2.2
Popis a scénáře některých případů užití
Vytvoří nový profil – neregistrovaný uživatel vytvoří nový profil. Tabulka 1: Vytvoří nový profil Aktéři: Visitor Vstupní podmínky: Kroky Role
Akce
1
Aktér
vybere nabídku Registrovat
2
Systém
zobrazí formulář registrace
3
Aktér
vyplní a odešle formulář
4
Systém
provede registraci uložením údajů do databáze, uživatel bude rovnou
přihlášený Alternativní scénář 4A – špatně vyplněné údaje A1
Systém
zobrazí chybové hlášení
A3
Systém
pokračuje od bodu 2.
Alternativní scénář 3B – předčasné ukončení registrace B1
Aktér
zruší zadávání
B2
Systém
neprovede zadávání a zobrazí úvodní stránku
Přihlašuje se – registrovanému uživateli se po zadání přihlašovacího jména a hesla zpřístupní funkce systému. Tabulka 2: Přihlašuje se Aktéři: Superadministrátor, Administrátor, User Vstupní podmínky: Kroky Role
Akce
1
Systém
zobrazí formulář přihlášení
2
Aktér
vyplní jméno, heslo a odešle formulář
3
Systém
provede přihlášení a zobrazí úvodní stránku se zprávou o úspěšném přihlášení
21
Alternativní scénář 4A – špatně vyplněné údaje A1
Systém
zobrazí chybové hlášení
A3
Systém
pokračuje od bodu 1.
Alternativní scénář 3B – předčasné ukončení přihlášení B1
Aktér
zruší zadávání
B2
Systém
neprovede zadávání
Vybírá kategorii – uživatel vybere kategorii a čte zprávy cizích uživatelů v ní obsažené. Tabulka 3: Vybírá kategorii Aktéři: Superadministrátor, Administrátor, User Vstupní podmínky: Uživatel je přihlášen Kroky Role
Akce
1
Aktér
zvolí nabídku Diskuze
2
Systém
zobrazí formulář pro výběr kategorie
3
Aktér
vybere kategorii
4
Systém
vyhledá a zobrazí požadované zprávy z kategorie
Alternativní scénář 3A – předčasné ukončení při vyplňování A1
Aktér
zruší zadávání
A2
Systém
ukončí zadávání a zobrazí úvodní stránku
Píše zprávu – uživatel vkládá nové zprávy do zvolené kategorie. Tabulka 4: Píše zprávu Aktéři: Superadministrátor, Administrátor, User Vstupní podmínky: Uživatel je přihlášen Kroky Role
Akce
1
---
<> Vybírá kategorii
2
Aktér
zvolí nabídku Přidat zprávu
3
Systém
zobrazí formulář
4
Aktér
vyplní formulář
5
Systém
uloží zprávu
Alternativní scénář 4A – předčasné ukončení při vyplňování A1
Aktér
zruší zadávání
A2
Systém
ukončí zadávání
22
4.3
E-R model
Entity-relationship model se používá pro abstraktní a konceptuální znázornění dat a umožňuje vytvoření popisu dat v databázi nezávisle na jejich uložení. E-R model pro webovou aplikaci „Bitevní pole“ obsahuje 7 entit. První a nejdůležitější entitou je USER (uživatel) s atributy user_name (přihlašovací jméno uživatele, které musí být jedinečné), user_password (heslo uživatele), user_registration_date (datum registrace uživatele) a user_permision (oprávnění uživatele). Uživatel má vztah sám se sebou, FRIEND, takový, že několik uživatelů může mít několik přátel. Jeden uživatel může vytvořit několik kategorií, to reprezentuje vztah s entitou CATEGORY. Jeden uživatel může napsat několik zpráv, to je vztah s entitou MESSAGE. MESSAGE je slabý entitní typ. Má vztah s entitou CATEGORY takový, že jedna kategorie obsahuje několik zpráv. Entita MESSAGE je závislá právě na entitě CATEGORY. Obsahuje atributy message_id (unikátní identifikační číslo zprávy), message_title (titulek, nadpis zprávy), message_date (datum a čas vytvoření zprávy) a message_text (samotný text zprávy). Entita CATEGORY obsahuje atributy category_id (unikátní identifikační číslo kategorie), category_name (název kategorie) a category_description (popis kategorie). Jeden uživatel může udělit několik uživatelských hodnocení,
to je entita
USER_RATING a několik uživatelských hodnocení náleží jednomu uživateli. USER_RATING je slabý entitní typ závislý na entitě USER. Obsahuje jediný atribut rating_value (udělená známka). GAME_REPORT je entita reprezentující záznamy odehraných i probíhajících her. report_id (unikátní identifikační číslo reportu) a report_content
Obsahuje atributy
(obsah reportu, je v něm uložen celý průběh hry). Jeden uživatel může být v několika hrách jako první hráč nebo jako druhý hráč (vyzyvatel, vyzvaný). Jeden uživatel může udělit několik hodnocení her, to je reprezentováno entitou GAME_RATING
a
několik
hodnocení
her
náleží
jednomu
záznamu
hry.
GAME_RATING je slabý entitní typ závislý na entitách USER i GAME_REPORT. Obsahuje jediný atribut rating_value (udělená známka).
23
Jeden uživatel může napsat několik komentářů her, reprezentované entitou GAME_COMMENT, a několik komentářů her náleží jednomu záznamu hry. GAME_COMMENT je slabý entitní typ závislý na entitách USER i GAME_REPORT. Obsahuje atributy comment_id (unikátní identifikační číslo komentáře), comment_date (datum a čas vytvoření komentáře) a comment_text (obsah komentáře). Databáze bude obsahovat hned několik integritních omezení. User_permission (atribut entity USER představující rozdělení uživatelů může nabývat hodnot od 1 do 3 (1 pro běžného uživatele, 2 pro administrátora, 3 pro superadministrátora). Do vztahu entity USER s entitou CATEGORY pak mohou vstupovat pouze uživatelé s user_permission hodnotou 2 nebo 3. Atributy rating_value u entit USER_RATING a GAME_RATING mohou nabývat hodnot od 1 do 5, kdy 1 je nejlepší známka. Veškeré další neklíčové atributy
musí
být
nenulové
vyjma
category_description,
comment_author,
message_author, category_author, first_player nebo second_player (ne však oba současně).
Obrázek 3: E-R diagram
24
Na Obrázek 3: E-R diagram je vidět celý ER model včetně legendy. Zvolené názvy jsou v angličtině, protože se držím základním pravidel pro psaní srozumitelného kódu (psát anglicky, používat popisné názvy, nepoužívat kryptické kódování).
4.4
Transformace E-R modelu do RMD
Výsledkem konceptuálního modelování je E-R model, který může být dost vzdálený logickému modelu, proto je nutné převést E-R model do relačního modelu. user (user_name, user_password, user_registration_date, user_email, user_permission) friend (user_like, user_is_liked) user_challenging (user_challenge, user_is_challenging, points) user_rating(rating_value, user_rate, user_is_rated) category (category_id, category_name, category_author, category_description) message (message_id, message_title, message_date, message_text, message_author, message_category) game_report (report_id, report_date, report_content, first_player, second_player) game_rating (rating_value, user_id, report_id) game_comment (comment_id,
comment_text,
comment_date,
comment_author,
belong_to_report) Takto navržené tabulky splňují podmínky třetí normální formy (3.NF). To znamená, že každý její atribut obsahuje jen atomické hodnoty, každý neklíčový atribut je plně závislý na celém primárním klíči (nikoliv jenom na nějaké jeho podmnožině) a žádný z jejich atributů není tranzitivně závislý na klíči.
4.5
Funkční analýza
DFD se skládá ze čtyř základních prvků. Proces (funkce) představuje část systému, která provádí transformaci vstupů na výstupy. Datový sklad znázorňuje uchovávaná data. Datový tok (šipka) popisuje přesun skupiny údajů mezi jednotlivými částmi
25
systému nebo mezi systémem a okolím. Terminátory představují zdroje nebo příjemce dat v okolí systému. K funkci přidává přítele je potřeba seznam uživatelů a seznam oblíbených uživatelů. Reprezentuje situaci, kdy uživatel si zadává oblíbené uživatele. Funkce hodnotí hráče reprezentuje situaci, kdy uživatel uděluje jinému uživateli známku. Potřebuje k tomu seznam uživatelů. Tvoří kategorii potřebuje seznam uživatelů a evidenci kategorií, představuje vytváření kategorie uživatelem. Vytváří zprávu vyžaduje seznam uživatelů, evidenci kategorií a seznam uložených zpráv, reprezentuje vytváření zprávy uživatelem. Funkce vytváří report potřebuje seznam uživatelů a seznam uložených reportů, představuje uložení výsledného záznamu hry do databáze. Hodnotí hru vyžaduje seznam uložených reportů a seznam hodnocení her, představuje udělení známky záznamu uživatelem. Píše komentář reprezentuje psaní komentáře u reportu hry uživatelem, potřebuje seznam uložených reportů a seznam komentářů.
Obrázek 4: Funkční analýza
26
5 Realizace Před samotnou implementací jsem ještě učinil důležité rozhodnutí. ASP.NET MVC obsahuje vlastní mechanismy na autentizaci a autorizaci, ale abych měl nad tím absolutní kontrolu, budu to řešit vlastním způsobem. Budu používat cookie, ve které bude uloženo jméno a oprávnění a ověřovací řetězec. Jméno a oprávnění budou tak jednoduše přístupné a při zobrazení stránek, které s těmito informacemi pracují, nehrozí žádné prodlevy. Ověřovací řetězec pak bude vyžadován a kontrolován vždy, pokud uživatel provádět nějakou akci.
5.1
Vytvoření databáze
Při vytváření databáze jsem nemohl v případě, kdy jsem vztah N:N jedné entity sama se sebou realizoval pomocí tabulky obsahující dva cizí klíče, definovat automaticky akce, které mají nastat při pokusu o změnu nebo mazání záznamů v cizí tabulce (pomocí příkazu references … on delete cascade). Proto, pokud to bylo nutné, jsem entitám vytvořil triggery. Konkrétně u následujícího trigerru spouštěného při mazání v tabulce USER bylo potřebné změnit nebo smazat vazby na mazaného uživatele. Nejprve smaže záznamy z tabulky
USER_RATING,
stejným
způsobem
USER_CHALLENGING a GAME_RATING. v tabulkách
MESSAGE,
CATEGORY,
z
tabulek
FRIEND,
Nakonec provede změnu záznamů
GAME_COMMENT
a GAME_REPORT,
kde může být nastavena hodnota null.
27
ALTER TRIGGER user_trigger ON dbo.[user] FOR DELETE AS BEGIN DECLARE @deleted_name varchar(50); SELECT @deleted_name = [user_name] FROM deleted; DELETE FROM dbo.[user_rating] WHERE [user_rate] = @deleted_name OR [user_is_rated] = @deleted_name; DELETE FROM dbo.[friend] WHERE [user_like] = @deleted_name OR [user_is_liked] = @deleted_name; DELETE FROM dbo.[user_challenging] WHERE [user_challenge] = @deleted_name OR [user_is_challenged] = @deleted_name; UPDATE dbo.[message] SET message_author = NULL WHERE message_author = @deleted_name; UPDATE dbo.[category] SET category_author = NULL WHERE category_author = @deleted_name; UPDATE dbo.[game_comment] SET comment_author = NULL WHERE comment_author = @deleted_name; UPDATE dbo.[game_report] SET first_player = NULL WHERE first_player = @deleted_name; UPDATE dbo.[game_report] SET second_player = NULL WHERE second_player = @deleted_name; END
Dále jsem na základě funkční analýzy napsal skladové procedury pro přidávání a mazání záznamů. Zároveň dodávám do procedur i ošetření integritních omezení. Např. v proceduře WRITE_MESSAGE se nejprve jednoduchým dotazem zjistí, zda existuje alespoň jeden záznam z tabulky USER a CATEGORY, který má shodný primární klíč s parametry procedury. Až poté se vkládají hodnoty z parametrů do tabulky včetně vytvoření nového unikátního identifikátoru funkcí NEWID() a získání serverového času funkcí GETDATE(). ALTER PROCEDURE dbo.write_message (@message_title varchar(50), @message_text text, @message_author varchar(50), @message_category uniqueidentifier) AS DECLARE @check_user int = 0; DECLARE @check_category int = 0; SELECT @check_user = COUNT([user_name]) FROM dbo.[user] WHERE [user_name] = @message_author; SELECT @check_category = COUNT([category_id]) FROM dbo.[category] WHERE [category_id] = @message_category; IF (@check_user > 0 AND @check_category > 0) INSERT INTO dbo.[message] VALUES(NEWID(), @message_title, GETDATE(), @message_text, @message_author, @message_category); RETURN
Zpětně jsem pak vytvářel i některé funkce, když bylo potřeba použít v dotazech agregační funkce. Přestože dotazování v LINQ to SQL podporuje specializované operátory Count, LongCount, Sum, Min, Max a Average, jejich použití může způsobit výjimku v případě, že by výsledkem byl null. Je pak nutné výsledek převádět na typ
28
povolující null. Tomu jsem se raději vyhnul. Jeden příklad za všechny je funkce AVERAGE_USER_RATING, která vrací průměrné hodnocení uživatele. ALTER FUNCTION dbo.average_user_rating (@user_name varchar(50)) RETURNS REAL AS BEGIN DECLARE @count real; DECLARE @sum real; SELECT @count = COUNT([user_is_rated]) FROM dbo.[user_rating] WHERE [user_is_rated] = @user_name; if (@count > 0) BEGIN SELECT @sum = SUM([user_rating]) FROM dbo.[user_rating] WHERE [user_is_rated] = @user_name; RETURN @sum / @count; END RETURN 0; END
5.2
Model
Model z architektury MVC zajišťuje pouze práci s daty. ASP.NET MVC3 defaultně nabízí generování tříd Modelu s využitím ADO.Net Entity Framework (jinak také LINQ to Entities). Využití ADO.Net Entity Framework se hodí spíše do rozsáhlých projektů a samotné generování tříd v mém případě nemá smysl, když veškeré vkládání, upravování a mazání dat řeším pomocí skladových procedur.
5.2.1
LINQ to SQL
Pro propojení Modelu s databází jsem použil technologii LINQ to SQL. Pomocí Object Relational Designeru jsem namapoval tabulky, funkce a skladové procedury z databáze. Výsledkem jsou vygenerované třídy v uložené v souboru .dbml, který jsem pojmenoval DataClasses.
29
Obrázek 5: Diagram tříd vygenerovaných pomocí LINQ to SQL
V níže vloženém kódu vytvářím instanci třídy DataClassesDataContext. Tato třída zajišťuje připojení k databázi. Díky ní pak lze volat skladovou proceduru nebo funkci v databázi, konkrétně rate_user, přes namapovanou metodu. private DataClassesDataContext DB = new DataClassesDataContext(); DB.rate_user(userRate, userIsRated, rating);
Jak jsem se již zmínil, pomocí LINQ to SQL realizuji jednoduché dotazy. Např. pro vyhledávání uživatele jsem vytvořil jednoduchý dotaz, který mi vrátí všechny uživatele obsahující zadaný řetězec (v proměnné userName). Protože výsledkem dotazování může být kolekce různého typu, je nutné používat klíčové slovo var. Ze získané kolekce pak lze pomocí příkazu foreach postupně přistupovat ke všem najitým výsledkům a ty uložit do vlastního seznamu. Pro vypočítání průměrného hodnocení zde používám volanou funkci z databáze. Protože výsledkem není přímo číslo typu Double, ale struktura Double?, je zde použita metoda ToDouble třídy Convert. To samé lze vyřešit přistoupením přímo k vlastnosti Value ze třídy Double?.
30
List<UserProfileView> Users = new List<UserProfileView>(); var result = from o in DB.users where o.user_name.Contains(userName) select new {Name = o.user_name, Email = o.user_email, RegistrationDate = o.user_registration_date, Permission = o.user_permission}; foreach (var n in result) { UserProfileView user = new UserProfileView(); user.Name = n.Name; user.Email = n.Email; user.RegistrationDate = n.RegistrationDate; user.Permission = n.Permission.ToString(); user.Rating = Convert.ToDouble(DB.average_user_rating(n.Name)); Users.Add(user); }
V diskusním fóru je potřebné použít stránkování. Základem toho je dotaz, který nejprve setřídí sestupně všechny zprávy dané kategorie podle atributu message_date, přeskočí zvolený počet záznamů (podle proměnné i) a vybere 20 záznamů. var result = (from o in DB.messages where o.message_category == categoryGuid orderby o.message_date descending select new { ID = o.message_id, Title = o.message_title, Date = o.message_date, Text = o.message_text, Author = o.message_author }).Skip(i).Take(20);
V některých případech mě zajímá pouze první výsledek (většinou z toho důvodu, že je očekáván právě jediný výsledek). Tím odpadá použití foreach pro získávání dat z kolekce výsledků. Nejprve se výsledek otestuje na přítomnost jakéhokoliv záznamu metodou Any(). Následně se získá z kolekce Enumerator. Tento objekt má metodu MoveNext(), pomocí kterého se posouvá na další prvek kolekce. Vlastností Current lze přistupovat k aktuálnímu prvku na který Enumerator odkazuje. Po vytvoření Enumerator ukazuje před začátek kolekce a až prvním voláním metody MoveNext() se dostane na první prvek v kolekci. var result = from o in DB.users where o.user_name == userName select o.user_email; if (result.Any()) { var enumerator = result.GetEnumerator(); if (enumerator.MoveNext()) { user.Email = enumerator.Current; } }
5.2.2
Object Managers a View Models
Třídy použité v Modelu jsem rozdělil do dvou skupin. Object Managers obsahují právě ty metody, které pracují s daty z databáze. V těchto metodách je použito právě výše zmíněné dotazování na data pomocí LINQ. Každá třída obsahuje pouze jedinou 31
vlastnost a tou je instance třídy DataClassesDataContext. Veškeré metody jsou internal, tzn. jsou přístupné pouze ze stejné sestavy. Metoda CheckCookie kontroluje data ze třídy HttpCookie. Nejprve je třeba získat z databáze datum zaregistrování cookie, aby se mohl vytvořit kontrolní řetězec a porovnat se s kontrolním řetězcem v cookie. K tomu je třeba použít třídu Encoder, aby datum převedl na bajtové pole a pomocí třídy SHA1CryptoServiceProvider vytvořil kontrolní otisk. internal bool CheckCookie (HttpCookie Cookie) { var result = from o in DB.users where o.user_name == Cookie.Values["Name"] select o.cookie_registration_date; if (result.Any()) { DateTime dateTime = new DateTime(); var enumerator = result.GetEnumerator(); if (enumerator.MoveNext()) { dateTime = Convert.ToDateTime(enumerator.Current); } ASCIIEncoding Encoder = new ASCIIEncoding(); byte[] ByteArray = Encoder.GetBytes(dateTime); SHA1 Sha1 = new SHA1CryptoServiceProvider(); string hashSHA1 = Convert.ToBase64String(Sha1.ComputeHash(ByteArray)); if (hashSHA1 == Cookie.Values["Check"]) { return true; } } return false; }
View Models jsou třídy reprezentující strukturu zobrazovaných dat. Díky jmenému prostoru
System.ComponentModel.DataAnnotations
lze
jednotlivým
vlastnostem
nastavovat validátory. Např. UserView je třída, reprezentující základní informaci o uživateli (jeho jméno a oprávnění). Pokud bude ověřována validita, kontrolovat se bude, zda Name je vůbec nenulové (atribut Required), poté jestli je řetězec alespoň o délce dvou znaků (atribut StringLength). Display je pak atribut, který lze využít při popisu dat.
32
public class UserView { [Required] [StringLength(50, ErrorMessage = "Min. délka je {2}.",MinimumLength = 2)] [Display(Name = "Jméno:")] public string Name { get; set; } [Display(Name = "Oprávnění:")] public string Permission { get; set; } }
UserLoginView je potomkem UserView. Navíc obsahuje vlastnost Password, u které je nastaven atribut DataType, který pak určuje, o jaký druh dat jde. public class UserLoginView : UserView { [Required] [DataType(DataType.Password)] [StringLength(50, ErrorMessage = "Min. délka je {2}.", MinimumLength = 6)] [Display(Name = "Heslo:")] public string Password { get; set; } }
Třída UserRegistrationView je potomkem UserLoginView. Jsou do ní přidány další dvě vlastnosti. Řetězec ConfirmPassword s atributem Compare, který při ověřování validity zajišťuje porovnávání s jiným řetězcem. Vlastnost Email pak obsahuje atribut RegularExpression. Ten obsahuje regulární výraz. V této podobě šel nahradit atributem [DataType(DataType.EmailAddress)]. public class UserRegistrationView : UserLoginView { [Required] [DataType(DataType.Password)] [Display(Name = "Potvrzení hesla:")] [Compare("Password", ErrorMessage = "Hesla se musí shodovat.")] public string ConfirmPassword { get; set; } [Required] [RegularExpression(@"^([a-zA-Z0-9_\-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[09]{1,3}\.)|(([a-zA-Z0-9\-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$", ErrorMessage = "Neplatná e-mailová adresa.")] [Display(Name = "E-mail:")] public string Email { get; set; } }
33
5.3
Controller
Action metoda LogIn třídy AccountController získá metodou POST data odpovídající struktuře třídy UserLoginView. V chráněném bloku se kontroluje, jestli zaslaná data jsou validní. Pokud ano, vytvoří se instance třídy UserManager (jeden z Object Managers) a zavolá se její metoda, která ověří uživatelské jméno a heslo. Pak se vytvoří instance třídy HttpCookie, uloží se do ní veškeré údaje včetně kontrolního řetězce a nastavení její doby platnosti. Nakonec se vytvoří skutečná cookie v prohlížeči metodou Add() třídy Cookies v Response a dojde přesměrování na akci Index v Controlleru Home. [HttpPost] public ActionResult LogIn(UserLoginView User) { try { if(ModelState.IsValid) { UserManager userManager = new UserManager(); byte Permission = userManager.LogIn(User.Name, User.Password); if (Permission > 0 && Permission < 4) { HttpCookie Cookie = new HttpCookie("BitevniPoleUser"); Cookie.HttpOnly = true; Cookie.Values["Name"] = User.Name; Cookie.Values["Permission"] = Permission.ToString(); Cookie.Values["Check"] = userManager.getCheckCookie(User.Name, Permission, DateTime.Now); Cookie.Expires = DateTime.Now.AddDays(1); Response.Cookies.Add(Cookie); return RedirectToAction("Index", "Home"); } } } catch { ModelState.AddModelError("", "Došlo k selhání aplikace, kontaktujte Superadministrátora."); } return View("Index"); }
Action metoda Accept třídy GameController získá metodou POST data reprezentující výzvu ke hře, pak zkontroluje cookie v prohlížeči, poté získá informace pro založení nové hry a uloží je do instance třídy GameBeginView. Dále získá seznam jednotek (tato tabulka v databázi nemá žádný vztah, obsahuje pouze statické údaje, které jsem nechtěl mít napsané přímo v aplikaci), vytvoří instanci Tuple ze seznamu jednotek a informacemi pro založení hry a tu odešle do View BeginTheGame.
34
[HttpPost] public ActionResult Accept(ChallengeSendView challenge) { try { HttpCookie Cookie = new HttpCookie("BitevniPoleUser"); Cookie = Request.Cookies.Get("BitevniPoleUser"); UserManager userManager = new UserManager(); if (Cookie != null) { if (userManager.CheckCookie(Cookie)) { if (ModelState.IsValid) { GameManager gameManager = new GameManager(); GameBeginView gameBegin = gameManager.BeginTheGame(challenge); List troops = gameManager.GetAllTypeOfTroops(); Tuple> gameBeginingSettings = new Tuple>(gameBegin,troops); return View("BeginTheGame", gameBeginingSettings); } } } } catch { ModelState.AddModelError("", "Došlo k selhání aplikace, kontaktujte Superadministrátora."); } return RedirectToAction("Index", "Home"); }
5.4
View
Základem samotných webových stránek je sdílené View, které obsahuje následující kód. V těle HTML se skrývá základní rozvržení stránky pomocí nastylovaných divů. Div s identifikátorem wrap obaluje veškerý obsah a stará se o vycentrování. Div s identifikátorem header vykresluje pruh pod nadpisem BITEVNÍ POLE. Div s identifikátorem strip pak vymezuje prostor v tom samém pruhu pro vkládání formuláře na přihlášení. Div s identifikátorem menu obaluje nastylované odkazy. Nakonec div s identifikátorem kontent tvoří prostor pro samotné dynamické vytváření textů, formulářů nebo tabulek. Příkaz Html.Partial() vnořuje zadané View do stránky. Příkaz Html.ActionLink() generuje odkazy na příslušnou akci Controlleru. Hodnoty ViewBag se mohou nastavovat ve View a zobrazovat je zde. Obsah View se pak renderuje příkazem RenderBody().
35
BITEVNÍ POLE
@Html.Partial("_LogInPartial")
@Html.ActionLink("Úvodem", "Index", "Home")
@ViewBag.Message
@RenderBody()
Následující View je právě nastaveno příkazem Layout tak, aby se renderovalo v příkazu RenderBody() v určeném sdíleném View. Nastavení ViewBag se projeví ve sdíleném View, kontrétně Title se zobrazuje v titulku stránky a Message vytváří nadpis. Příkaz model určuje, jak vypadá struktura přijímaných dat. To výrazně urychluje práci, protože pak je možné přistupovat k modelu jako běžné třídě napsané v C#. Do View jsou vloženy skripty, které umožňují validovat obsah formuláře podle pravidel napsané v deklaraci třídy modelu už přímo v prohlížeči. Proto je nutné použít následující příkazy pro generování formuláře na stránce podle vybraných vlastností třídy modelu. Příkaz Html.LabelFor() vytváří popisek podle atributu Display, příkaz Html.EditorFor() vytváří input s určenými vlastnostmi podle atributu Datatype (např. pokud by se jednalo o Password,
automaticky
by
se
vytvářel
input
s typem
password).
Příkaz
Html.ValidationMessageFor() pak zajišťuje zobrazení chybových zpráv. Na závěr formuláře je pak nutné vložit ručně input s typem submit.
36
@model BitevniPole.Models.ViewModels.ChallengeView @{ ViewBag.Title = " - Založení nové hry"; ViewBag.Message = "Založení nové hry"; Layout = "~/Views/Shared/_NonpublicLayout.cshtml"; } <script src = "@Url.Content("~/Scripts/jquery.validate.min.js")" type = "text/javascript"> <script src = "@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type = "text/javascript"> @using (Html.BeginForm()) { @Html.ValidationSummary(true)
Pokud je potřeba ve View vykreslit obsah seznamu, např. uživatelských profilů, je to řešeno následujícím způsobem. Modelem je List, pokud obsahuje alespoň jeden záznam (kontroluje se metodou Any()), je příkazem foreach každý prvek seznamu přeposílán do partial View, které zajistí jeho vykreslení podle vlastních pravidel. Pokud záznamy neobsahuje, vypíše se obsah druhé podmínky. @model List …
@if (Model.Any()) {
Jméno
E-mail
Registrace
Hodnocení
foreach (var d in Model) { Html.RenderPartial("PartialOfListOfUsers", d); } }
@if (!Model.Any()) { <span style="color: #f00;">Nebyl nalezen žádný záznam. }
37
Partial View pak vypadá následovně. Vytvoří jeden řádek tabulky. Pro zobrazení vlastností modelu lze také použít příkaz Html.DisplayFor() a pro níže uvedený formulář a jeho inputy s typem hidden šlo použít příkaz Html.HiddenFor(). V tomto případě je vše napsáno vlastním způsobem, protože automatické vytváření formuláře zde selhávalo. Formulář je sestaven tak, aby odpovídal struktuře UserProfileView. Hodnoty z inputů jsou pak předány akci Detail z Controlleru User a použity pro následné dohledání dalších informací o uživateli a ty pak zobrazeny v jiném View. @model BitevniPole.Models.ViewModels.UserProfileView
@Model.Name
@Model.Email
@Model.RegistrationDate.ToShortDateString()
@String.Format("{0:#.##}", @Model.Rating)
38
6 Závěr Díky této bakalářské práci jsem pochopil nové technologie, které se přímo na VŠPJ nevyučují, a na základě nově nabytých znalostí jsem pak vytvořil moderní webovou aplikaci. Vývoj aplikace trval necelé čtyři měsíce. Nejprve jsem vypracovával návrh webové aplikace. Přitom jsem využil dosavadních znalostí z předmětů Softwarové Inženýrství a Databázové Systémy 1 a 2. S pomocí tohoto návrhu jsem poté realizoval webovou aplikaci založenou na frameworku ASP.NET MVC3. Vytvořil jsem funkční webovou aplikaci, která splňuje rozsáhlou funkcionalitu rozdělenou do uživatelských rolí (registrovaný
uživatel,
administrátor
a
superadministrátor).
Neregistrovaným
uživatelům je umožněno pouze se registrovat, registrovaní uživatelé pak mohou využívat veškerých služeb (přijímat, rušit výzvy ke hraní, hrát samotnou hru, vyhledávat hráčské profily, hodnotit je a přidávat si je do oblíbených, zobrazovat odehrané hry, přispívat do diskusního fóra). Administrátoři jsou registrovaní uživatelé, kterým se zobrazují formuláře pro správu kategorií a jejich obsahu. Superadministrátor pak jako jediný může mazat samotné uživatele. Nepodařilo se mi zprovoznit zobrazení záznamu hry. Aplikaci teď čeká testování a odlaďování chyb. Na adrese http://bitevnipole.aspone.cz/ běží její zkušební verze. Při tvorbě jsem se zaměřil v první řadě na možnost rozšíření. Tomu pomáhá nejenom použitá architektura Model-View-Controller, ale také srozumitelný a okomentovaný kód. U samotné architektury bylo klíčové pochopení její struktury a rozhodování, co do které části patří. U psaní kódu jsem se držel základních pravidel pro psaní srozumitelného kódu. Tzn. psal jsem anglicky, používal popisné názvy a vyhnul se použití kryptického kódování. V druhé řadě jsem se věnoval ošetřením vstupů. Provádím dvojí kontrolu. Nejprve javascriptem bez zatížení serveru a pro maximální možnou rychlost reakce na uživatelovo zadávání vstupů. Tato kontrola ale může selhat, proto kontroluji vstupy i po odeslání na server. Při samotné implementaci jsem často potýkal s problémy související s přechodem z programování v jazyce PHP a C++ do programování v jazyce C#. Ty se ale dařilo řešit díky inteligentnímu vývojovému prostředí a rozsáhlé nápovědě přímo od společnosti Microsoft.
39
Myslím si, že by se dalo ještě několik věcí na mojí aplikaci vylepšit. Např. chybí jakékoliv statistiky. Pokud hráči budou hrát delší dobu, jistě by je zajímalo, s kým kdy hráli a jaké měli výsledky. To lze zatím pouze pracně dohledat v záznamech her. Dále by se mohl vylepšit i design webu, zatím je použité jednoduché nastylování prvků. Pokud by hra měla jít do ostrého provozu, neměla by odpuzovat svým příliš strohým vzhledem. Také domluva mezi hráči je zatím možná pouze pomocí diskusního fóra, proto by bylo vhodné aplikaci doplnit i o možnost posílání zpráv přímo mezi hráči. Samotná hra obsažená v aplikaci by se mohla modifikovat (např. přepracovat herní pole, přidat nové herní principy). Taková rozšíření mohou být předmětem jiné bakalářské práce. Veškeré nabyté znalosti a získané dovednosti jsou velmi dobře použitelné v praxi. ASP.NET MVC je neustále vyvíjený framework a společně s vývojovým prostředím Visual Studio je samotná implementace snadnější a je možné se zaměřit na řešení komplexnějších problémů. Všechny zmíněné technologie se běžně používají v softwarových firmách.
40
7 Seznam použité literatury 1. Microsoft Visual Studio. Wikipedie [online]. 2012 [cit. 2012-12-09]. Dostupné z: http://cs.wikipedia.org/wiki/Visual_Studio 2. HyperText Markup Language. Wikipedie [online]. 2012 [cit. 2012-12-09]. Dostupné z: http://cs.wikipedia.org/wiki/HyperText_Markup_Language 3. Kaskádové styly. Wikipedie [online]. 2012 [cit. 2012-12-09]. Dostupné z: http://cs.wikipedia.org/wiki/Css 4. JavaScript. Wikipedie [online]. 2012 [cit. 2012-12-09]. Dostupné z: http://cs.wikipedia.org/wiki/Javascript 5. JQuery. Wikipedia [online]. 2012 [cit. 2012-12-09]. Dostupné z: http://en.wikipedia.org/wiki/JQuery 6. ASP.NET. Wikipedie [online]. 2012 [cit. 2012-12-09]. Dostupné z: http://cs.wikipedia.org/wiki/ASP.NET 7. C Sharp. Wikipedie [online]. 2012 [cit. 2012-12-09]. Dostupné z: http://cs.wikipedia.org/wiki/C_Sharp 8. Techniky T-SQL. Referaty [online]. 2009 [cit. 2012-12-09]. Dostupné z: http://www.cecak.cz/fel/dba/referaty/mssql/pokrocile_techniky_v_tsql_funkce_podminene_zpracovani_rizeni_toku_kurzory_ulozene_procedury_zprac ovani_chyb 9. LINQ. Wikipedie [online]. 2012 [cit. 2012-12-09]. Dostupné z: http://cs.wikipedia.org/wiki/LINQ 10. FREEMAN, Adam. Pro ASP.NET MVC 3 framework. 3rd. ed. New York: Apress, c2011, xxv, 824 s. The expert's Voice in.NET. ISBN 978-1-4302-3404-3.
41
8 Seznam obrázků Obrázek 1: Interakce v aplikaci ASP.NET MVC ......................................................... 17 Obrázek 2: Use Case Diagram ...................................................................................... 20 Obrázek 3: E-R diagram ................................................................................................ 24 Obrázek 4: Funkční analýza .......................................................................................... 26 Obrázek 5: Diagram tříd vygenerovaných pomocí LINQ to SQL ................................ 30
42
9 Seznam tabulek Tabulka 1: Vytvoří nový profil ..................................................................................... 21 Tabulka 2: Přihlašuje se ................................................................................................ 21 Tabulka 3: Vybírá kategorii .......................................................................................... 22 Tabulka 4: Píše zprávu .................................................................................................. 22
