BAKALÁŘSKÁ PRÁCE. Grafický actor systém pro výuku programování. Graphical actor system for programming education
|
|
- Rostislav Růžička
- před 8 lety
- Počet zobrazení:
Transkript
1 BAKALÁŘSKÁ PRÁCE Grafický actor systém pro výuku programování Graphical actor system for programming education
2 Un ico rn Co lle ge Un ico rn Co lle ge, V K ap slo vn ě /2, P ra h a 3, Ná ze v p rá ce v ČJ: Ná ze v p rá ce v AJ: G ra f ický a cto r syst é m p ro výu ku p ro gra m o vá n í G ra p h ica l a cto r syst e m f o r p ro gra m m in g ed uca t ion Au to r: Pa t rik Ma jko wski Aka de m ický ro k: Ko nt a kt: E -ma il: pa t rik.m a jko wski@ gm a il. co m Te l. : (+4 20 )
3 1. ZADÁNÍ 3
4 2. ABSTRAKT Cílem této práce je realizovat systém pro výuku programování a algoritmizace. Toto je zatím doménou především mnoha desktopových aplikací a jazyků. Právě proto bude tento systém zpracován s využitím moderních technologií : jazyk Ruby s nadstavbou Ruby on Rails, JavaScript s knihovnou jquery a podobně. Takovéto aplikaci říkáme webová aplikace - uživatel má pouze webový prohlížeč a aplikace samotná běží na vzdáleném stroji - serveru. Tento přístup má kromě nesporných výhod i řadu nevýhod, cílem práce je s využitím JavaScriptu dosáhnout chování co nejblíže klasické desktopové aplikaci. Další částí práce je formální charakteristika systému - popisy jednotlivých use-case, class diagramy důležitých sekcí nebo ostatní zajímavé diagramy. Zároveň je také součástí kompletní uživatelská příručka. V té je popsáno veškeré API přístupné pro uživatele, pomocí kterého může testovat svoje algoritmy. Klíčová slova: výuka programování, algoritmizace, Ruby on Rails, webová aplikace, JavaScript, webový prohlížeč, AJAX, jquery 4
5 3. ABSTRACT The aim of this work is to implement system for education on topics of programming and algorithm design. For now, it is domain of many desktop applications and languages. Because of this, the application will be deployed with usage of modern technologies : Ruby language with Ruby on Rails framework, JavaScript with jquery library and so on. Such application is called web application user only has a web browser and the application itself runs at remote computer - server. This ap proach has many advantages, but also a few disadvantages, this work aims to minimize those by using JavaScript, and achieve almost similar behavior to a desktop application. Another part ot the work is formal definition of the application - descriptions of all use-cases, class diagrams of import ant section or other important diagrams. Next part is complete user's manual. It contains definition of an API that users can use to implement and test their algorithms. Keywords: programming teaching, algorithmization, Ruby on Rails, web application, JavaScript, web browser, AJAX, jquery 5
6 4. PROHLÁŠENÍ Prohlašuji, že svou bakalářskou práci na téma jsem vypracoval samostatně pod vedením vedoucího bakalářské práce a s použitím odborné literatury a dalších informačních zdrojů, které jsou v práci citovány a jsou též uvedeny v seznamu literatury a použitých zdrojů. Jako autor uvedené bakalářské práce dále prohlašuji, že v souvislosti s vytvořením této bakalářské práce jsem neporušil autorská práva třetích osob, zejména jsem nezasáhl nedovoleným způsobem do cizích autorských práv osobnostních a jsem si plně vědom následků porušení ustanovení 11 a následujících autorského zákona č. 121/2000 Sb. V Praze dne Patrik Majkowski 6
7 5. PODĚKOVÁNÍ Děkuji vedoucímu bakalářské práce Tomášovi Holasovi za účinnou metodickou, pedagogickou a odbornou pomoc a další cenné rady při zpracování mé bakalářské práce. 7
8 6. OBSAH Zadání... 3 Abstrakt... 4 Abstract... 5 Prohlášení... 6 Poděkování... 7 Obsah... 8 Úvod Přehled jazyků určených pro výuku programování Logo Squeak Karel Pascal Java (BlueJ) Ostatní jazyky Robot Karel Online High-level pohled Use-case model Datový model Tabulka Actors Tabulka Maps Tabulka Simulations Tabulka SimulationSteps Komponenta Map_controller Založit vzor mapy Editovat vzor mapy Zobrazit vzor mapy Smazat vzor mapy Komponenta Actors_controller Založit vzor aktéra Editovat vzor aktéra Zobrazit vzor aktéra Smazat vzor aktéra Komponenta Simulations_controller Založit simulaci Editovat aktéry simulace Provést simulaci Sledovat simulaci Smazat simulaci Uživatelská příručka Úvodní stránka Správa vzorů map Správa vzorů aktérů Správa simulací API aktéra Objekt Vector Metody aktéra Shrnutí API Příkladová data Mapy Aktéři Simulace
9 Závěr Conclusion Seznam použité literatury Seznam použitých symbolů a zkratek...57 Seznam obrázků Seznam tabulek Seznam příloh
10 7. ÚVOD Princip fungování algoritmů, základní programátorských konstrukcí, datových typů atd. je pro každého budoucího programátora naprosto základní znalost. Každé školní zařízení, které si klade za cíl vychovávat budoucí vývojáře k tomuto problému přistupuje jinak. Některé školy využívají nějaký z běžně používaných programovacích jazyků. Tento přístup má výhodu v praktičnosti výsledky jsou tak úplně běžnými programy, což může studenty motivovat k dalšímu bádání. Velkou nevýhodou je ale absence okamžitého, dobře viditelného výsledku. Ve většině případů je první forma rozhraní, s kterou přijdou studenti do styku, textová konzole. Teď je na místě si připomenout, že se bavíme o uživatelích nejnižšího stupně znalostí - chce si vyzkoušet fungování svých algoritmů a okamžitě vidět výsledek. Textové výpisy na konzoli toto do jisté míry umožňují, avšak některé uživatele mohou odrazovat. Možností, jak toto řešit, je rovnou dát studentům nástroje pro tvorbu GUI (grafické uživatelské rozhraní). Toto s sebou ale nese další komplikace - GUI je prakticky vždy svázáno s objektově orientovaným přístupem (OOP). Tento přístup, ačkoliv je dnes uznávaný jako správný přidává další úroveň znalostí, která je nezbytná pro studenty, a proto dále komplikuje počáteční výukový proces. Aby bylo možné programování a algoritmizaci přiblížit např. dětem nebo naprostým začátečníkům, vznikla řada specializovaných jazyků určených právě pro výuku algoritmizace. Podrobný přehled a popis těchto jazyků je náplní další části tohoto textu. Internet je dnes fenoménem, jehož vývoj za posledních 10 let šel velice rychle kupředu. Web, jakožto stěžejní služba Internetu se také přizpůsoboval bouřlivému vývoji. Z původně statických stránek, které byly pouze formou zobrazení dokumentů, se vyvinuly dnešní Web aplikace. Ohromnou výhodou webových aplikací oproti konvenčním je její dostupnost kdekoliv, kde se nachází připojení k Internetu. Zároveň je aplikace sdílená všemi uživateli, což přináší možnost jejich interakce. Aplikace, jež je praktickou součástí této práce má za cíl spojit oba tyto světy - inspiruje se programovacím jazykem Karel jakožto specializovaným nástrojem pro výuku programování. Zároveň je realizována jako Web 2.0 aplikace, uživateli tedy pro použití stačí používat moderní prohlížeč a být připojen k Internetu. Cílem je ukázat, že webové aplikace se dají využít i pro tuto problémovou doménu, se všemi výhodami, které přináší. 1 Termín Web 2.0 je ustálené označení pro etapu vývoje webu, v níž byl pevný obsah webových stránek nahrazen prostorem pro sdílení a společnou tvorbu obsahu. Týká se období od roku 2004 do současnosti. (zdroj: 10
11 8. PŘEHLED JAZYKŮ URČENÝCH PRO VÝUKU PROGRAMOVÁNÍ Tato kapitola obsahuje nejznámější ze specializovaných jazyků určených pro výuku programování. Čerpá především z článku o těchto jazycích na Logo Dle mého názoru jeden z nejzajímavějších jazyků pro tuto problémovou doménu. Vznikl už v roce 1967 a celý je orientovaný na 2-rozměrné pole, po kterém se pohybuje aktér - želva. Tento aktér je vybaven perem, které za ním kreslí stopu, toto pero se dá programově ovládat (vypnutí/zapnutí). Aktér rozumí těmto příkazům: Příkaz Parametr Význam forward počet kroků Posun želvy dopředu o zadaný počet kroků back počet kroků Posun želvy zpět o zadaný počet kroků left úhel ve stupních Natočení želvy doleva o zadaný úhel right úhel ve stupních Natočení želvy doprava o zadaný úhel penup Zvednutí pera (vypnutí kreslení čáry) pendown Položení pera (zapnutí kreslení čáry) stop Ukončení procedury Tabulka 1 - Příkazy jazyka Logo Tento velice jednoduchý a pochopitelný princip umožňuje uživatelům tvořit programy s jasným a rychlým výstupem, kterým si mohou ověřit správnost jimi navrženého algoritmu. Interpret Loga také umožňuje používat všechny potřebné programátorské konstrukce : podmínky, cykly, definice procedur a rekurzi. Pro příklad uvedeme následující zdrojový text zapsaný v jazyce Logo : to ctverec :velikost repeat 4 [ forward :velikost right 90 ] end to obrazec :pocet repeat :pocet [ ctverec
12 ] left 360/:pocet end obrazec 20 Zdrojový text 1 - Příklad v jazyce Logo Jedná se o definici 2 procedur : ctverec a obrazec. Každá z nich přijímá jeden parametr, u procedury ctverec určuje délku hrany generovaného čtverce, u procedury obrazec určuje počet generovaných čtverců rovnoměrně pootočených. Nakonec probíhá volání procedury obrazec s parametrem 20. Po spuštění tohoto programu v programu FMSLogo (jeden z mnoha interpreterů loga pro Windows) získáme následující výstup (trojúhelník ve středu reprezentuje aktéra, nejedná se o výstup programu): Obrázek 1 - Výstup prvního příkladového programu jazyce Logo V jazyce Logo lze s využitím rekurze napsat i mnohem pokročilejší algoritmy, například pro vykreslování fraktálních obrazců (zdrojový text převzat od : ) : TO SNOWFLAKE.SIDE :LENGTH :DEPTH IF :DEPTH = 0 [ FORWARD :LENGTH STOP ] SNOWFLAKE.SIDE :LENGTH / 3 :DEPTH
13 LEFT 60 SNOWFLAKE.SIDE :LENGTH RIGHT 120 SNOWFLAKE.SIDE :LENGTH LEFT 60 SNOWFLAKE.SIDE :LENGTH END / 3 :DEPTH - 1 / 3 :DEPTH - 1 / 3 :DEPTH - 1 TO SNOWFLAKE :LENGTH :DEPTH REPEAT 3 [ SNOWFLAKE.SIDE :LENGTH :DEPTH RIGHT 120 ] END SNOWFLAKE Zdrojový text 2 - Pokročilejší příklad v jazyce Logo Výstupem je známý fraktál sněhové vločky : Obrázek 2 - Výstup druhého příkladového programu v jazyce Logo (zdroj: Squeak Výukový projekt, který staví na objektově orientovaném jazyku Smalltalk. Tento jazyk je takzvaně čistě objektový, to znamená, že i základní datové typy jako je celé číslo nebo hodnota pravda/nepravda jsou objekty (na rozdíl např. od jazyka Java, kde se jedná o tzv. primitivní datové 13
14 typy). S tím také souvisí mechanismus komunikace jednotlivých objektů mezi sebou, kdy se komunikuje výhradně přes tzv. zprávy. Tyto zprávy mohou být 3 různých typů: Unární zpráva Binární zpráva Zpráva s obecným počtem parametrů Unární zpráva neobsahuje žádné parametry, jediným způsobem, jak zjistit její význam je přímo její název (tzv. selektor). Příkladem unární zprávy je například zjištění absolutní hodnoty čísla : -42 abs > 42 Číslo -42 je objektem celého čísla, které umí reagovat na přijetí zprávy abs - navrácením své absolutní hodnoty. Binární zpráva pracuje s dvojicí objektů, prvním objektem je příjemce zprávy, tedy objekt, který zprávu zpracovává. Druhým objektem je parametr zprávy. Je nezvyklé, že na zprávách jsou ve Squeaku postaveny i základní aritmetické a logické operace. Nezvyklé proto, že u nich neplatí priorita operátorů, jak bývá na tomto místě zvykem. Například výraz * 2 se vyhodnotí jednoduše zleva doprava, čili jako 18, ačkoliv matematicky správný výsledek je, s ohledem na prioritu násobení před sčítáním, 13. Samozřejmě je zde možnost vynutit prioritu použitím kulatých závorek, dalším pravidlem je priorita zpracovávání jednotlivých typů zpráv : unární, binární, obecný počet parametrů. Zpráva s obecným počtem parametrů je zobecněním předchozích typů zpráv. Obsahuje libovolné množství klíčových slov ukončených dvojtečkou, za každým klíčovým slovem následuje parametr. Situaci lépe ilustruje převzatý obrázek, který srovnává binární zprávu a zprávu s obecným počtem parametrů: 14
15 Obrázek 3 - Syntaxe binární zprávy a zprávy s proměnným počtem parametrů (zdroj: Jak je z obrázku patrné, selektorem zprávy jsou potom všechna zadaná klíčová slova. Nelze tedy nějaké zprávě zadat špatný počet parametrů, v případě, že nějaký parametr zapomeneme nebo naopak přebývá, tak příjemce zprávy zahlásí chybu, že takovou zprávu nezná. Squeak nabízí velmi pokročilé prostředí pro vývoj programů. Umožňuje dokonce si otáčet okna o libovolný úhel a celé působí velmi hravě. Screenshot s tímto prostředím obsahuje následující obrázek. Obrázek 4 - Vývojové prostředí Squeaku (zdroj: 15
16 Dle mého mínění je Squeak skvělou volbou pro pokročilejší studenty, kteří už mají základní znalosti a chtěli by se naučit programovat objektově, jak je to dnes již v podstatě standardem. 8.3 Karel Dostáváme se k jazyku, který je hlavní inspirací a vzorem pro aplikaci která je součástí této bakalářské práce. Vznikl v roce 1981 a je pojmenován podle jména Karla Čapka, spisovatele, který napsal hru R.U.R. - v té se poprvé vyskytlo slovo robot, které se dnes používá po celém světě. Robot je také hlavním aktérem v tomto jazyce. Pohybuje se po 2D souřadnicovém systému, který kromě něj může obsahovat ještě zdi a značky. Zeď je neprůchozím elementem zatímco značka může být robotem zvednuta a přesunuta jinam. Robot se může pohybovat pouze do čtyř základních směrů (nahoru, dolů, doleva, doprava) a velikost jednoho kroku je fixní. Oproti Logu je tedy pohyb robota velmi jednoduchý, to je zároveň důvod, proč je tento jazyk asi nejvhodnější pro úplné začátečníky. Instrukční sada robota obsahuje : Klíčové slovo Význam KROK Posun o jedno políčko vpřed ve směru pohybu VLEVO-VBOK Otočení aktéra o 90 stupňů doleva ZVEDNI Zvedne značku, pokud tam nějaká je POLOZ Položí značku kterou robot drží Tabulka 2 - Instrukční sada jazyka Karel Instrukční sada je tedy naprosto minimální a důležitou součástí je tzv. slovník. V podstatě se jedná o uložené procedury. Idea je taková, že uživatel si pomocí elementárních příkazů dodefinuje svoje, vlastní. Typickým příkladem je procedura pro orientaci robota např. na sever NA-SEVER ZNAMENA KDYZ JE SEVER KONEC JINAK VLEVO-VBOK NA-SEVER KONEC KONEC Zdrojový text 3 - Procedura v jazyce Karel 16
17 Vzhled jednoho z mnoha prostředí implementujících jazyk Karel je vidět na následujícím obrázku. Obrázek 5 - Prostředí Karel na platformě Windows (zdroj: ) 8.4 Pascal Nemohu zapomenout ne tento dnes již archaický jazyk, který je ale dodnes používán na mnoha školách (byl i mou první zkušeností s programováním). Byl navržen v roce 1969 pro účely výuky tak, aby v něm bylo možné psát programy splňující zásady strukturovaného programování. Strukturovaným programováním myslíme rozpad programu na jednotlivé dílčí funkčnosti procedury a funkce, které problém postupně řeší. Důležitou ideou je maximální vyhýbání se instrukci GOTO a její náhrada strukturovanými bloky podmínek a cyklů. Jazyk obsahuje spoustu knihoven pro práci s grafikou a podobně. Ve své původní podobě nebyl objektový, to ale změnila 17
18 nadstavba Object Pascal. Velice známé je i prostředí Delphi, které vyvíjela a udržovala firma Borland. Delphi ve verzi 7 je údajně prý stále používáno 2, což je důkazem jeho popularity. Toto IDE umožňuje velice rychle vyvíjet aplikace s GUI rozhraním. Výhodou je nenáročnost pro studenty, ačkoliv se jedná o OOP jazyk, tak pro ně stačí pochopit princip asynchronních událostí např. po kliknutí na tlačítko. Obrázek 6 - Prostředí Borland Delphi 7 (zdroj: ) 8.5 Java (BlueJ) Javu jistě není potřeba blíže představovat. Dnes se jedná o jeden z nejvíce používaných OOP jazyků v business sféře. BlueJ je speciální IDE pro tento jazyk, které je specificky určeno pro výuku. Uživatel například vidí graficky strukturu tříd jeho programu, může ji jednoduše klikáním modifikovat zatímco IDE na pozadí upravuje zdrojové soubory tak, aby odpovídaly této struktuře. Také může snadno volat metody na těchto třídách jednoduše pomocí myši. Jedná se o drobná usnadnění, která ale dle mého názoru dost usnadňují poznávání novým uživatelům. 2 Podle článku na 18
19 Obrázek 7 - BlueJ běžící na Mac OS X (zdroj: ) 8.6 Ostatní jazyky Do této skupiny jsem se rozhodl zařadit další jazyky, které jsou vhodné pro výuku programování. Především se jedná o jazyky Ruby a Python. Oba jsou objektově orientované a interpretované, což je velká výhoda při výuce. Interpretovaný jazyk totiž můžeme prozkoumávat ve formě interaktivní konzole, kde se dá velice rychle vyzkoušet některé jednoduché konstrukce, popřípadě ověřit fungování nějakého algoritmu. Obrázek 8 - IRB (Interative RuBy) konzole demonstrující vlastnosti objektu textového řetězce (String) 19
20 Na konec této kapitoly bych rád dodal, že i jazyky, které zde nejsou zmíněny se dají použít na výuku programování. Jazyk je pouze nástrojem, jak dosáhnout implementace nějakého algoritmu. Pokud se student naučí algoritmicky myslet, tak mu může být jedno, v jakém jazyce bude problém řešit (samozřejmě po seznámení se s syntaxí nebo speciálními vlastnostmi jazyka). Každý jazyk, který naučí studenta používat základní programátorské konstrukce tak jde klasifikovat, jako jazyk vhodný pro výuku programování. 20
21 9. ROBOT KAREL ONLINE Obsahem této kapitoly je popis aplikace Robot Karel online která je praktickou součástí této bakalářské práce. Jsou v ní popsány jednotlivé komponenty, spolupráce mezi nimi, použité technologie a podobně. High-level pohled Obsahuje Obsahuje Mapa Databáze Vzor aktéra Obsahuje Je vytvořena podle vzoru Vzor mapy Zdrojový kód Jsou vytvořeni podle vzorů 9.1 Simulace Aktér Instance zdrojového kódu Simulační krok Obrázek 9 - High level pohled na aplikaci Robot Karel 3 3 Barvy entit určují jejich prioritu podle zásad UUBML (Unicorn Unified Business Modeling Language), tedy: světle žlutá - nejvyšší priorita (např. Simulace) světla modrá - vysoká priorita (např. Mapa) šedá - normální priorita (např. Vzor mapy) světle šedá - nízká priorita (v tomto diagramu není využita) Toto platí dále pro všechny diagramy, ve kterých se budou tyto barvy vyskytovat. 21
22 Na diagramu vidíme nejdůležitější entity v aplikaci. Začneme u simulace - ta reprezentuje chování jednoho nebo více aktérů, kteří jsou její součástí. Tito aktéři jsou vytvořeni podle nějakého vzoru aktéra, od kterého přebrali jeho zdrojový kód - ten určuje, jak se budou v simulaci pohybovat a chovat. Další součástí simulace je také mapa, která definuje velikost pole, po kterém se mohou aktéři pohybovat a zároveň pozice zdí, přes které aktéři nemohou projít. Mapa je také založena podle již existující šablony, kterou zkopíruje. Důležitou vlastností obou vzorů (mapy i aktéra) je to, že po založení simulace a zkopírování vlastností vzoru vazba mezi vzorem a jeho instancí (to, co je součástí simulace) zaniká. Pokud tedy modifikujeme například některý z vzorů mapy, tak se tato změna na již existujících simulacích neprojeví. To samé platí i pro aktéry. Zatímco mapa je po té, co se stane součástí simulace už dále needitovatelná, u aktérů (respektive jejich zdrojových kódů) toto neplatí. Pro účely výuky je žádoucí, aby bylo možné zdrojový kód jednoduše měnit a sledovat výsledek. Proto má aktér obsaženu tzv. instanci zdrojového kódu. Ta má vyjadřovat, že na začátku byla vytvořena zkopírováním nějakého vzoru aktéra, ale na toto nelze spoléhat, protože uživatel ji může velmi snadno měnit. Poslední součástí každé simulace je množina jejich simulačních kroků. Jeden simulační krok obsahuje pozice a orientaci všech aktérů na dané mapě v jednom okamžiku. Zároveň obsahuje také pořadové číslo kroku, které zajišťuje jednoznačné uspořádání tohoto kroku mezi ostatními kroky simulace. Pokud si budeme přehrávat kroky od nejnižšího k nejvyššímu, tak získáme kompletní výstup simulace, tedy pozici a orientace všech jejich aktérů od začátku do konce. Konec simulace určuje uživatel, který si vždy může určit, kolik kroků simulace chce spočítat dopředu. Výpočet kroků simulace zajišťuje jádro aplikace - podle výchozí pozice aktérů a jejich instancí zdrojového kódu vypočte jejich další pozici. Poté tento výpočet opakuje, dokud nevygeneruje potřebný počet simulačních kroků. Databáze má za úkol zajistit perzistentní uchovávání veškerých dat, které během chodu aplikace vznikají. Jsou v ní tedy uloženy veškeré vzory map i aktérů. Zároveň ukládá i kompletní stav každé simulace, tedy její mapu, všechny aktéry včetně instancí zdrojových kódů a veškeré vypočtené simulační kroky. Ukládání simulačních kroků s sebou nese jednu výhodu : pokud uživatel nijak nemodifikoval parametry simulace (zejména počet, pozici aktérů, jejich orientaci a zdrojové kódy), tak není nutno znova počítat simulační kroky, pokud už tak bylo jednou uděláno. Postačuje pouze z databáze přečíst všechny simulační kroky, provést jejich seřazení a výstup prezentovat uživateli. 22
23 9.2 Use-case model <<include>> UC01 - Vytvořit vzor mapy UC02 Editovat vzor mapy UC03 Zobrazit vzor mapy UC04 Smazat vzor mapy UC05 - Vytvořit vzor aktéra UC06 - Editovat vzor aktéra UC07 Smazat vzor aktéra UC08 - Vytvořit simulaci Uživatel UC09 Editovat aktéry simulace UC10 - Provést simulaci UC11 Sledovat simulaci UC12 Smazat simulaci UC13 Zobrazit nápovědu Obrázek 10 - Use-case model 23
24 Use-case model (model případů užití) nám ukazuje jednotlivé funkčnosti aplikace z pohledu koncového uživatele. Na první pohled je zřejmé, že uživatelé aplikace nejsou nijak klasifikováni z hlediska přístupových práv a podobně. Tuto část jsem vynechal, protože mým hlavním cílem bylo navrhnout motor aplikace, než řešit další problémy spojené s implementací uživatelských účtů a bezpečností. Těchto 13 případů užití má za cíl umožnit všechny operace s entitami popsané v high-level pohledu. Posledním případem užití je zobrazení rychlé nápovědy, která je vyvolána jako první stránka při přístupu ke kořenovému adresáři aplikace. Některé případy užití jsou triviální z hlediska implementace a proto jsou na modelu případů užití značeny normální prioritou. Případy užití označené vysokou prioritou již obnášejí více záležitostí ohledně asynchronní komunikace s aplikací pomocí AJAXu4 a podobně. Případy užití označené nejvyšší prioritou tvoří zmiňovaný motor aplikace. 9.3 Datový model 1 Actor Map Simulation * SimulationStep Obr Datový model aplikace Na první pohled překvapí datový model svou jednoduchostí. Tabulky Actor a Map obsahují vzory aktérů a map, mezi simulací a těmito tabulkami neexistuje žádná vazba kvůli tomu, že nechceme, aby se po změně nějakého vzoru toto projevilo v existujících simulacích. Simulace má větší množství simulačních kroků. Celá databáze se tedy skládá ze 4 tabulek. Tento model vznikl postupným vývojem, kdy se neustále objevoval problém omezení klasických SQL databází. Jedná se o to, že nejsou vhodné na uchovávání proměnlivého množství dat (počet aktérů v simulaci, různé velikosti map). Optimálním řešením se nakonec ukázalo použití formátu YAML5 nebo JSON6. Jelikož bylo jasné využití JavaScriptu jako jazyka na straně prohlížeče, tak padla volba na formát JSON. JSON je formát, který umožňuje převádět objekty umístěné v paměti programu do jejich reprezentace běžným textovým řetězcem a obráceně. Zároveň definuje i pole, 4 AJAX je zkratkou pro Asynchronous JavaScript and XML - jedná se o mechanismus, kdy může webová stránka komunikovat se serverem mimo klasický model požadavek/odpověď. Toto umožňuje stránkám dynamicky zobrazovat a aktualizovat obsah bez nutnosti neustálého obnovování okna prohlížeče. Díky tomu se mohou aplikace chováním více podobat klasickým desktopovým. 5 YAML Ain't Markup Language - Formát serializace objektů široce využívaný v jazyce Ruby a frameworku Ruby on Rails. 6 JavaScript Object Notation - Lehký a jednoduchý formát výměny dat. Je založený na syntaxi JavaScriptu. 24
25 do kterého je možno těchto objektů umístit více za sebe. Syntaxe není až tak důležitá, pro její definici navštivte: Rozhraní JSONu je velmi jednoduché, programátorovi poskytuje 2 metody. První metoda očekává jako parametr nějaký objekt, vrací řetězec s JSON reprezentací tohoto objektu. Druhá metoda funguje přesně obráceně - očekává JSON reprezentaci objektu, který posléze vrací. Se znalostí JSONu a jeho výhod můžeme přejít na popis tabulek a jejich sloupců. Pokud název nějakého sloupce končí _json, tak to označuje, že je tento sloupec využit na ukládání dat ve formátu JSON. To automaticky znamená, že při čtení z tohoto sloupce je potřeba jej zpracovat JSON parserem. To samé platí i pro ukládání, akorát je proces obrácený. Dále to již text nebude zmiňovat. Každá tabulka obsahuje sloupec id s primárním klíčem. Toto zajišťuje automaticky platforma Rails, proto dále nebude tento sloupec zmiňován Tabulka Actors Název sloupce Datový typ (Rails) Obsah name string Název aktéra description string Popis aktéra source_code binary Zdrojový kód pro jeden krok aktéra static_code binary Zdrojový kód vykonáváný pouze na začátku hitpoints integer Počet životů aktéra na začátku Tabulka 3 - Sloupce tabulky Actors Tabulka obsahuje pouze veškeré údaje vzorů aktéra. JSON jako takový není použitý, protože zde pro to není důvod Tabulka Maps Název sloupce Datový typ (Rails) Obsah name string Název mapy data_json binary Mapa ve formátu JSON Tabulka 4 - Sloupce tabulky Maps Zde již je využito formátu JSON pro uložení mapy. Mapa je 2-rozměrné pole (pole polí) - délky těchto polí určují velikost mapy, ačkoliv aplikace je omezena pouze na čtvercové mapy maximální velikosti 40 (kvůli grafickým prvkům na této mapě). Vnitřní pole může být buďto prázdné (potom je políčko volné) nebo může obsahovat řetězec wall, který označuje, že na tomto políčku se nachází zeď. Mapa neobsahuje žádné pozice aktérů - více o tomto rozhodnutí v dalších kapitolách. 25
26 Jako příklad toho, jak vypadá uložená mapa ve formátu JSON, si nejprve ukažme mapu vizuálně: Obrázek 12 - Příkladová mapa7 Je to tedy mapa velikosti 3x3, která má 3 zdi na svojí hlavní diagonále. JSON reprezentace této mapy vypadá takto: [ [["wall"],[],[]], [[],["wall"],[]], [[],[],["wall"]] ] Zdrojový kód 4 - Příkladová mapa ve formátu JSON Znaky '[' a ']' označují začátek a konec pole, prvky tohoto pole jsou odděleny čárkou. Pro zpřehlednění výpisu byly do kódu přidány znaky nového řádku, aby byla zjevná analogie mezi mapou a její JSON reprezentací. Ve skutečné databázi se JSON ukládá vždy maximálně jednoduše, tedy bez znaků nových řádků. Naopak se většinou automaticky tzv. vyescapuje znak uvozovky (") protože SQL dotaz použitý při manipulaci s tímto znakem by nebyl validní. Escapovaním myslíme přidání znaku \ před problémový znak - to zajistí validnost výsledného dotazu Tabulka Simulations Název sloupce Datový typ (Rails) Obsah name string Název simulace map_json binary Instance mapy pro tuto simulaci ve formátu JSON actors_json binary Instance aktérů pro tuto simulaci ve formátu JSON Tabulka 5 - Sloupce tabulky Simulations Simulace již využívá naplno možností formátu JSON. Sloupec map_json obsahuje 1:1 zkopírovanou mapu ze vzoru mapy, podle které byla tato simulace založena. Sloupec actors_json obsahuje definici aktérů - jedná se o pole N objektů (kde N je počet aktérů v simulaci). Prvkům tohoto pole říkáme pracovně ActorDef (definice aktéra) a obsahuje tyto atributy: 7 Červené políčko označuje zeď, bílé je volné políčko. 26
27 Název atributu Význam id ID aktéra pro tuto simulaci. Je použito pro spárování s dalšími objekty v simulaci name Název aktéra source_code Instance zdrojového kódu vykonávaného při každém kroku static_code Instance zdrojového kódu vykonávaného jednorázově na začátku simulace hitpoints Počet životů aktéra Tabulka 6 - Atributy objektu ActorDef Tyto objekty slouží k uchovávání dat o aktérech která se v průběhu simulace nemění. Nabízí se totiž možnost pro jednoduchost duplikovat všechna data o aktérech do všech vygenerovaných simulačních kroků. Zde je však na místě šetřit prostorem v databázi i přenosovým pásmem. Proto jsou tato data oddělena od ostatních. Na klientu se poté provádí párování těchto neměnných dat s ostatními podle ID interního pro každou simulaci Tabulka SimulationSteps Název sloupce Datový typ (Rails) Obsah simulation_id integer ID simulace ke které tento krok patří data_json binary Stav jednoho simulačního kroku step_no integer Pořadové číslo kroku Tabulka 7 - Sloupce tabulky SimulationSteps Do této tabulky se ukládá výsledek simulace po zpracování. Každá simulace tedy má nějaký počet simulačních kroků, pokud si je přehrajeme seřazené podle pořadového čísla (step_no), tak získáme kompletní popis jednoho běhu simulace. Obsah každého kroku je uložen ve sloupci data_json. Jedná se o objekt s atributy actors - pole délky M (kde M je počet všech aktérů v simulaci) s objekty, které nazýváme ActorMapDef (actor map definition). Tyto objekty popisují pozici a orientaci aktéra v daném kroku simulace. Zároveň obsahují i položku ID pro spárování s ActorDef objektem. markers - pole délky N (kde N je počet značek v simulaci) s objekty, které popisují pozici těchto značek v simulaci. battle_msg - řetězec obsahující zprávu s informacemi o zbývajících životech všech aktérů. 27
28 9.4 Komponenta Map_controller Smyslem této komponenty je zajistit správu vzorů map. Jedná se o operace (v závorce je uveden název použitý v implementaci aplikace, toto platí i pro všechny ostatní ): založit vzor mapy (new, create) editovat vzor mapy (edit) zobrazit vzor mapy (show) smazat vzor mapy (destroy_it) Založit vzor mapy Při zakládání nového vzoru mapy je od uživatele nejprve zjištěn a validován název mapy a její rozměry. Po přijetí těchto dat je založen v databázi objekt vzoru mapy se zadanými vlastnostmi. Do jeho JSON kódu je vygenerována mapa se zadaným rozměrem. Tato mapa obsahuje zatím samá volná políčka. Nad touto mapou je okamžitě zavolána funkčnost editace vzoru mapy Editovat vzor mapy Tato funkčnost je vždy volána nad nějakou existující mapou (podle ID). Pokud není mapa nalezena v databázi, tak okamžitě vrací chybu. V opačném případě je mapa přečtena z databáze a zaslána javascriptovému modulu map-editor. Tento modul zajišťuje vykreslování aktuálního stavu mapy, jeho editace uživatelem pomocí myši a odeslání změněné mapy zpět na server, pokud došlo ke změně. Mapu je možno odeslat na server explicitně uživatelským požadavkem, nebo se automaticky uloží při opuštění funkčnosti. Funkce související s vykreslováním mapy jsou sjednoceny do dalšího javascriptového modulu který se jmenuje canvas. Canvas je také název elementu, který je využit pro samotné zobrazování vykreslené mapy a jejich aktérů. Jedná se o nový element související s HTML5, umožňuje jednoduchou práci s 2D i 3D obsahem pomocí JavaScriptu. V době psaní tohoto textu (květen 2011) již je podporován v posledních verzích všech majoritních prohlížečů (Internet Explorer verze 9, Mozilla Firefox verze 4.0, Google Chrome verze 11). Pro jednodušší práci s JavaScriptem a AJAXem obecně aplikace využívá javascriptovou knihovnu jquery8, která zjednodušuje práci. Pro kontextová menu nad mapou je využito pluginu do 8 Pro více informací o jquery navštivte její domovskou stránku 28
29 jquery s názvem ContextMenu9. Pohled na celou funkčnost by měl zpřesnit následující komunikační diagram: 1. přesměrování na edit.html Webový prohlížeč Canvas 6. vykreslení mapy 2. předání ID mapy Webový server aplikace 3. požadavek na mapu 4. odpověď s mapou 5. inicializace objektu 8. uložení mapy Mapa 7. editace mapy Map-editor Uživatel Obrázek 13 - Komunikační diagram operace Editace vzoru mapy Číslo kroku Popis 1 Operace začíná tím, že server zná ID mapy, kterou chce uživatel editovat. Toto ID obdržel buďto přímo od uživatele (explicitní požadavek na editaci), nebo je automaticky předáno předchozím krokem zakládání mapy. Server vygeneruje editační stránku do které je zakódován i fragment JavaScriptu, který zajistí, že klient obdrží ID mapy pro editaci. 2 ID mapy vložené serverem do editační stránky je zpracováno klientským JavaScriptem a uloženo. 3 Je zaslán AJAX požadavek na získání JSON dat se stavem mapy. 9 Pro více informací o tomto pluginu navštivte jeho domovskou stránku 29
30 4 Server vrací JSON kód se stavem mapy klientovi. 5 Klient převede dodaná JSON data na objekt mapy. 6 Modul Canvas vykreslí objekt mapy do elementu canvas. 7 Uživatel provádí změny mapy pomocí myši a kontextového menu. Po každé změně se automaticky provede opět krok 6 kvůli obnovení grafického stavu. 8 Klient vezme aktuální stav mapy, převede na formát JSON a odešle serveru k uložení. Tabulka 8 - Posloupnost činností operace Editace vzoru mapy Zobrazit vzor mapy Tato funkčnost je oproti předchozí dosti jednoduchá, protože je zde využito sdílení kódu. Zobrazení mapy využívá již existující javascriptový modul canvas. Modul zajišťující zobrazení mapy se jmenuje map-display, jeho implementace je ale naprosto triviální, pouze volá inicializační metodu modulu canvas. 1. přesměrování na show.html Webový prohlížeč Canvas 6. vykreslení mapy 2. předání ID mapy Webový server aplikace 3. požadavek na mapu 4. odpověď s mapou 5. inicializace objektu Map-display Mapa Obrázek 14 - Komunikační diagram operace zobrazení mapy Jelikož činnosti jsou prakticky identické s předchozí operací, tak je tabulka s podrobným popisem vynechána. 30
31 9.4.4 Smazat vzor mapy Tato operace obnáší pouze nalezení záznamu o mapě v databázi a jeho smazání. Jelikož jednotlivé simulace nemají žádnou vazbu na tento objekt, tak není nutné řešit referenční integritu a podobně. Mazání bude úspěšné vždy. 9.5 Komponenta Actors_controller Tato komponenta zajišťuje správu veškerých vzorů aktérů v aplikaci. Poskytuje tyto operace : založit vzor aktéra (new, create) editovat vzor aktéra (edit, update) zobrazit vzor aktéra (show) smazat vzor aktéra (destroy_it) Založit vzor aktéra Založení aktéra začíná zobrazením formuláře s jeho atributy. Ty jsou uživatelem vyplněny. Poté v databázi vzniká objekt vzoru aktéra, který je naplněn zadanými atributy Editovat vzor aktéra Nejprve je vybrán vzor aktéra podle jeho ID. Je zobrazen formulář s atributy načtenými z databáze. Uživatel změní některá data a po potvrzení uživatelem je objekt v databázi aktualizován Zobrazit vzor aktéra Vzor aktéra je v databázi nalezen podle svého ID. Uživateli je zobrazen formulář pouze pro čtení s údaji zvoleného aktéra Smazat vzor aktéra Vzor aktéra je v databázi nalezen podle svého ID. Poté je provedeno smazání tohoto objektu z databáze. Opět platí neexistence vazby mezi simulací a vzorem aktéra, proto bude mazání vždy úspěšné. 31
32 9.6 Komponenta Simulations_controller Toto je skutečný motor aplikace. Komponenta zajišťuje zakládání a mazání simulací. Především ale umožňuje uživateli se simulací interagovat a sledovat její výstupy. Poskytuje následující operace: založit simulaci (new, create) editovat aktéry simulace (edit_actors) - zároveň používá interní operace get_actors, get_map, get_initial_state, save_sim pro AJAXová volání provést simulaci (simulate) sledovat simulaci (watch) - zároveň používá interní operace get_actors, get_map, get_story pro AJAXová volání smazat simulaci (destroy_it) Založit simulaci Od uživatele je nejprve zjištěn požadovaný název simulace a vzor mapy, která bude použita pro simulaci. Poté je v databázi založen objekt simulace. Následuje zkopírování mapy ze vzoru do nově založené simulace. Pokud uživatel explicitně nezrušil volbu, tak je volána operace editovat aktéry simulace nad nově založenou simulací Editovat aktéry simulace Tato operace umožňuje uživateli, aby do existující simulace umístil aktéry - tedy objekty, které se chovají podle svého zdrojového kódu. Zároveň může také umisťovat značky, což je speciální druh aktéra. Jako takový nic nedělá, ostatní aktéři je však mohou přenášet. Dále má uživatel možnost existující aktéry editovat a mazat. Po ukončení editace je podle stavu aktérů vytvořen první simulační krok, který je základem pro další kroky generované v operaci provést simulaci. Veškerá funkčnost je implementována podobně, jako v modulu map-editor, tedy pomocí canvasu a jquery 32
33 kontextových menu. Navíc je zde využito služeb pluginu SimpleModal 10 který umožňuje vytvářet ekvivalent modálních11 oken v prohlížeči. Situaci dále popisuje komunikační diagram: 1. přesměrování na edit_actors.html Webový server aplikace Webový prohlížeč Canvas 7. požadavek na počáteční stav 8. odpověď s počátečním stavem 6. vykreslení mapy 4. odpověď s mapou 2. předání ID simulace 3. požadavek na mapu 10. vykreslení aktérů 13. uložení počátečního stavu 5. inicializace objektu Počáteční stav simulace 12.2 modifikace objektu 9.1 inicializace objektu 12.1 modifikace objektu 9.2 inicializace objektu Actor-editor Mapa 11. modifikace aktérů Aktéři simulace Uživatel Obrázek 15 - Komunikační diagram operace Editovat aktéry simulace Číslo kroku Popis 1 Operace začíná tím, že server zná ID simulace, které zakóduje do stránky edit_actors.html a tu nechá zobrazit. 2 ID simulace se uloží do modulu actor-editor. 3 AJAXovým voláním je zaslán požadavek na 10 Pro více informací o pluginu navštivte jeho domovskou stránku 11 Modálním oknem rozumíme takové okno, které je na popředí a blokuje zbytek aplikace, dokud není zavřeno. 33
34 mapu pro simulaci podle ID simulace. 4 Je obdržena JSON reprezentace mapy. 5 Mapa je dekódována a je podle ní inicializován její objekt. 6 Mapa je modulem canvas vykreslena. 7 Je zaslán AJAXový požadavek na obdržení počátečního stavu simulace. 8 Je obdržena JSON reprezentace počátečního stavu simulace (tento stav může být prázdný). 9.1, 9.2 Počáteční stav je dekódován a podle něj jsou inicializovány objekty počátečního stavu a aktérů. V případě, že byl počáteční stav prázdný, jsou tyto objekty inicializovány na prázdnou hodnotu. 10 Aktéři jsou vykresleni pomocí modulu canvas. 11 Uživatel změnil aktéry simulace (přidal/editoval/odebral). 12.1,12.2 Je provedena modifikace objektů počátečního stavu a aktérů tak, aby reflektovaly změnu. Zároveň se volá krok 10 pro obnovení grafiky. 13 Počáteční stav je odeslán na server. Tam je dekódován a uložen jako 1. simulační krok dané simulace. Tato funkčnost je volána buďto manuálně uživatelem z kontextového menu nebo automaticky při opuštění funkčnosti. Tabulka 9 - Činnosti operace Editovat aktéry simulace Provést simulaci Smyslem této operace je vygenerovat průběh simulace, do které již byli umístěni aktéři. Vygenerováním simulace rozumíme vytvoření N simulačních kroků, kde N je voleno uživatelem. Simulační kroky existují jako řádky tabulky SimulationSteps, samotné generování nemá žádný grafický výstup. Tato operace je určena k tomu, aby byla volána z operace sledovat simulaci. Jelikož obecně v simulaci může existovat více aktérů, tak je nutno zavést pravidla pro jejich chování v rámci simulace: Během jednoho kroku se může aktér pohnout maximálně o jedno políčko (ale nesmí přitom útočit). Během jednoho kroku může aktér jinému udělit poškození o velikosti 1 (musí ale být jeho bezprostředním sousedem). Potom se ale nemůže v tomto kroku pohnout. Aktér může zvednout značku, pokud se na ní nachází. 34
35 Maximální počet značek na jednom políčku je 4. Pokud má aktér 0 životů, je ze simulace odebrán. Při útočení na jiného aktéra je mu poškození způsobeno až v dalším kroku. Pro splnění těchto pravidel a zvýšení robustnosti výsledného kódu je implementován následující mechanismus: při zavolání metody např move() pro posun k tomuto posunu ihned nedochází. Místo toho na objektu ActorImpl12 existují 3 stavové proměnné, každá z nich může nabývat hodnoty pravda/nepravda: move - aktér se chce pohnout o jedno políčko drop - aktér chce položit značku, kterou nese pickup - aktér chce zvednou značku, na které se nachází Tyto stavové proměnné jsou vyhodnoceny objektem SimulationRunner po vykonání uživatelského kódu a stavy aktérů jsou poté podle nich aktualizovány. Poté jsou všechny stavové proměnné nastaveny na nepravda a pokračuje se dalším krokem. Díky tomu snadno zajistíme splnění všech uvedených pravidel13. Souboje aktérů mezi sebou jsou řešeny způsobem, který zajišťuje férovost za každé situace. Jedná se o to, že v rámci každého tahu je vypočten tzv. battle plán - ten určuje kolik životů ztratí každý z aktérů. Aktérům je poté až po kompletním sestavení battle plánu nastaveno poškození, které je na začátku dalšího tahu způsobeno atomicky všem aktérům. Neexistuje zde tedy výhoda prvního útoku nebo podobně. Například pokud budou spolu bojovat 2 aktéři se stejným počtem životů, tak se oba navzájem zničí v danou chvíli. Algoritmus generování dalších kroků funguje takto: 1. Způsobit poškození aktérům zadané v minulém kroku. 2. Smazat všechny aktéry s 0 životy 3. Zajistit zvednutí / položení značek 4. Přesunout aktéry 5. Vykonat zdrojový kód (to znamená opět nastavit příznaky jednotlivých akcí) 6. Uložit simulační krok do databáze. 12 Tento objekt je reprezentací aktéra po dobu generování simulačních kroků. 13 Hlavní motivací bylo vynutit první pravidlo, tedy aby uživatel nemohl v kódu řetězit více příkazů pro pohyb. To teď udělat může, ale aktér se pohne jenom jednou za krok. 35
36 Toto pořadí kroků je především kvůli uživatelské přívětivosti - součástí mnoha algoritmů jsou ladící výpisy, u kterých uživatel očekává, že budou odpovídat skutečné poloze aktéra. Nastal čas zmínit se o vnitřnostech mechanismu vykonávání kódu jednotlivých aktérů. Nabízela se možnost navrhnout svůj vlastní jazyk. Výhodou tohoto přístupu je kompletní kontrola nad bezpečností vygenerovaného kódu, velkou nevýhodou je však pracnost (je v podstatě potřeba napsat kompletní překladač, včetně podmínek, cyklů a podobně). Druhou možností je využít existujícího jazyka - Ruby a vykonávat jej pomocí metody eval14. Výhodou je, že odpadá pracná implementace překladače - je dostupný kompletně celý jazyk Ruby včetně veškerých jeho kladných vlastností. Problémem tohoto přístupu je ale bezpečnost - pokud dáme uživateli možnost vykonávat obecný kód, tak tento kód je vykonáván, jakoby byl součástí hlavní aplikace. To má za následek nepříjemné vlastnosti jako možnost vynutit pád aplikace, prohlížet a editovat soubory na serveru (Ruby umožňuje samozřejmě i spouštět další programy) a podobně. Pro aplikaci byla zvolena cestu eval-u s tím, že bude implementována nějaká forma sandboxu 15 pro vykonávaný kód. Tento mechanismus funguje na dvou úrovních. První úroveň je třída Evaluator - v té probíhá samotné vykonávání kódu a obsahuje API, s pomocí kterého se pracuje s aktérem. Toto API je ve skutečnosti implementováno v instanci aktéra - třída Evaluator má na tuto třídu referenci a zprostředkovaně volá metody. Toto nám zajistí přesnou kontrolu nad tím, co lze z uživatelského kódu volat. Tato úroveň ale nedostačuje sama, protože uživatel by snadno mohl pomocí reference na instanci aktéra přistupovat k interním objektům simulace a podobně. Proto přichází ke slovu druhá úroveň zabezpečení a tou je BlackList. Jedná se o prostý výčet zakázaných slov, které se nesmí v kódu vyskytovat, jinak nastává vyjímka. Tento seznam podchycuje právě věci jako jako přístup k referenci na instanci aktéra, ukončení aplikace, volání programu z příkazové řádky a podobně. Samozřejmě, že toto zabezpečení pravděpodobně není 100% a existuje způsob, jak aplikaci shodit. Jsem však názoru, že po identifikaci takového problému a zakázání příslušných klíčových slov lze dosáhnout odolnosti proti většině pokusů. 14 Z anglického evaluate - vykonat. Jedná se o metodu, která na vstupu přijímá textový řetězec, který chápe jako zdrojový kód v daném jazyce a ten ihned vykoná. 15 Sandboxováním myslíme bezpečné oddělení tohoto kódu od zbytku aplikace. 36
37 1. vytvoření instancí Počáteční stav simulace SimulationRunner Instance aktérů 3. vykonání zdrojového kódu Aktéři simulace 2. smazání všech existujících kroků 5. uložení kroku simulace Evaluator 4. validace zdrojového kódu SimulationSteps BlackList Obrázek 16 - Komunikační diagram operace Provést simulaci Číslo kroku Popis 1 SimulationRunner obdrží první krok simulace (objekt ActorMapDef) a definici všech aktérů (objekt ActorDef). Podle těchto 2 objektů založí objekty ActorImpl (implementace aktéra) název a zdrojové kódy zjistí z objektu ActorDef, pozici a směr z objektu ActorMapDef. 2 Jsou smazány veškeré existující simulační kroky. Toto je nezbytné pro zaručení konzistence nově generovaných kroků. 3 Třída Evaluator je požádána o vykonání zdrojového kódu aktéra. 4 Implementace vykonávání kódu uvnitř třídy Evaluator zajistí ověření kódu oproti objektu BlackList. 5 Po vykonání kódu (úspěšném i neúspěšném) je vytvořen simulační krok a uložen do databáze. Tento krok obsahuje pozice a směry pohybu 37
38 všech aktérů - tyto pozice se získá z atributů ActorImpl objektů. Tabulka 10 - Činnosti operace provést simulaci Sledovat simulaci Sledováním simulace myslíme grafické vyjádření jednotlivých simulačních kroků pro uživatele. Tyto simulační kroky byly vykonány v předchozí operaci. Uživatel má možnost tyto simulační kroky sledovat buďto za sebou, nebo je možné je převíjet a začínat od daného kroku. Důležitou vlastností této operace je to, že nedochází k žádné modifikaci dat v perzistentním úložišti. Pouze se načtou odpovídající řádky tabulky SimulationSteps, převedou do JSONu a pošlou klientskému JavaScriptu. Ten zajistí zobrazení uživateli. 1. přesměrování na watch.html 4. odpověď s mapou 7. požadavek na příběh simulace 8. odpověď s příběhem 13. vykreslení aktérů 10. požadavek na aktéry simulace 9 inicializace objektu Příběh simulace 5. inicializace objektu Simulation-player 12. inicializace objektu 11. odpověď s aktéry simulace Canvas 6. vykreslení mapy 3. požadavek na mapu Webový prohlížeč 2. předání ID simulace Webový server aplikace Mapa 14. požadavek na změnu zobrazení Aktéři simulace Uživatel Obrázek 17 - Komunikační diagram operace Sledovat simulaci Číslo kroku Popis 1 Server zná ID simulace, kterou chce uživatel přehrát, vygeneruje stránku watch.html do které je toto ID zakódováno. 38
39 2 JavaScriptový modul simulation-player si uloží ID simulace. 3 Je zaslán požadavek na získání mapy podle ID simulace. 4 Odpověď s mapou dorazila. 5 Mapa je dekódována a je inicializován její objekt. 6 Mapa je vykreslena modulem canvas. 7 Je zaslán požadavek na získání příběhu simulace (story). Tento příběh jsou jednotlivé simulační kroky seřazené za sebou a vložené do pole. 8 Odpověď s příběhem dorazila. 9 Příběh je dekódován a je inicializován jeho objekt. 10 Je zaslán požadavek na získaní objektů ActorDef pro tuto simulaci. 11 Dorazila odpověď s aktéry simulace. 12 Je inicializován objekt s aktéry. 13 Modul canvas vykreslí všechny aktéry na grafiku mapy. 14 Uživatel změnil např. číslo vykreslovaného kroku nebo zapnul automatické přehrávaní, je automaticky volána činnost 13 pro obnovení grafiky. Tabulka 11 - Činnosti operace Sledovat simulaci V implementaci této operace je opět využit modul canvas jako správce grafiky. Modul simulationplayer poskytuje API pro manipulací se stavem simulace, který chceme vykreslovat. Je opět využit modul ContextMenu a SimpleModal do jquery pro implementaci pokročilých prvků GUI. Navíc je zde použit plugin Timers16. Tento plugin umožňuje snadno implementovat události opakující se v čase. V tomto případě se jedná o možnost, kdy uživatel nechce neustále klikat na tlačítko další krok - timer(časovač) zajistí automatické volání teto funkčnosti s daným intervalem. Kontextové menu je využito pro možnost zobrazit si zdrojový kód nějakého aktéra - stačí na něj kliknout pravým tlačítkem a vybrat si, který chceme zobrazit. Při sledování simulace není možnost měnit zdrojový kód aktéra ihned. K tomuto rozhodnutí jsem dospěl, při pomyšlení na matení uživatele, kdy např. 50% simulace bude vygenerováno pomocí jednoho kódu, ten se poté změní a zbytek bude vygenerován podle jiného kódu. Také by bylo nutné zavést nějaký mechanismus, jak spojit vygenerovaný krok se zdrojovým kódem. Hlavním důvodem, na který jsem narazil při pokusu toto implementovat, je ale uložení kontextu aktéra. Oproti originálnímu Karlovi jsem chtěl umožnit, aby každý aktér mohl mít svoje lokální proměnné. 16 Pro více informací o pluginu navštivte jeho domovskou stránku 39
40 Typickým příkladem užití je algoritmus procházení bludiště, který je součástí aplikace (jeden ze vzorů aktéra). U toho algoritmu má aktér ve svém statickém zdrojovém kódu definovanou proměnnou, do které si ukládá již navštívené uzly. Pokud bychom chtěli implementovat možnost dynamicky měnit zdrojový kód, tak by bylo nutné nějak zajistit, aby se do perzistentního úložiště uložily i tyto lokální proměnné. Napadla mě možnost heuristicky projít statický zdrojový kód a hledat definice proměnných, pro velkou pracnost a nespolehlivost takového řešení jsem se mu rozhodl vyhnout. Jediný způsob, jak tedy změnit zdrojový kód aktéra, je spustit nad simulací operaci Editovat aktéry simulace. Po ukončení této operace je zaručeno, že simulace bude obsahovat pouze jeden krok (=počáteční stav, to co uživatel nastavil) a vygenerovaná simulace tedy bude konzistentní a podle jednoho zdrojového kódu pro každého aktéra Smazat simulaci Implementačně velice jednoduchá operace. Server dostane ID simulace, kterou chce uživatel smazat a provede její odstranění z perzistentního úložiště. Zároveň se díky referenční integritě provede smazání všech simulačních kroků (pokud je simulace má). Tyto simulační kroky samy o sobě totiž nedávají smysl a jejich znovupoužití nepřipadá v úvahu. 40
41 10. UŽIVATELSKÁ PŘÍRUČKA Obsahem této kapitoly je manuál k použití aplikace. Měl by každému pomoci v pochopení fungování aplikace a možnost snadno a rychle začít psát svoje vlastní algoritmy. Dále následuje popis API aktéra, který je taktéž nezbytný k efektivní realizaci různých algoritmů Úvodní stránka Obrázek 18 - Úvodní stránka aplikace Tato stránka je první která se zobrazí po zadání URL aplikace a obsahuje krátký návod k použití (anglicky). Zároveň je na ní vidět hlavní menu, které se nachází v horní části a je přístupné z kterékoliv stránky. Toto menu slouží pro přístup ke skupinám jednotlivých funkčností: Welcome (úvodní stránka) Map templates (správa vzorů map) Actor templates (správa vzorů aktérů) Simulations (správa simulací) 41
42 10.2 Správa vzorů map Obrázek 19 - Správa vzorů map Účelem této stránky je umožnit uživateli vytvářet, mazat, editovat a zobrazovat vzory map. Veškeré vzory map uložené v databázi jsou zde zobrazeny v seznamu. Pomocí odkazu Show se provede zobrazení vzoru mapy. Pomocí tlačítka Destroy můžeme smazat existující vzor mapy. Pod tabulkou nalezneme odkaz New Map, který slouží k založení nového vzoru mapy: Obrázek 20 - Založení nového vzoru mapy 42
43 Zde potřebujeme zadat 2 parametry: název mapy, kterým bude mapa identifikována a její rozměry (mapa je vždy čtvercová, proto se zadává strana tohoto čtverce, maximální velikost z důvodu grafiky je 30 políček). Odkaz Back vede zpátky na seznam vzorů map. Po stisknutí tlačítka Create Map je v databázi založen objekt mapy a uživatel je okamžitě přesměrován na stránku editoru mapy (stejný editor se spustí pomocí odkazu Edit nad již existující mapou): Obrázek 21 - Náhled editoru mapy Největší část obrazovky zabírá zobrazení mapy. Při kliknutí pravým tlačítkem v oblast mapy se zobrazí kontextové menu: Obrázek 22 - Kontextové menu editoru mapy 43
44 Význam jednotlivých položek menu je následující: Select brush wall - vybírá nástroj kreslicí zdi Select eraser - vybírá nástroj na mazání Save - ukládá mapu na server Výchozím po spuštění je mazací nástroj. Po vybrání nástroje je možno jej pomocí levého tlačítka používat - tedy buďto kreslit zdi, nebo je mazat. Rozměry mapy nelze v tomto místě měnit. Mapa se ukládá při použití příslušné volby v menu nebo při opuštění stránky / zavření tabu (záložky v prohlížeči). Pod zobrazením mapy je odkaz Back, který se vrací na obrazovku správy map Správa vzorů aktérů Obrázek 23 - Správa vzorů aktérů Na této stránce můžeme podobně jako mapy zobrazovat, editovat a mazat vzory aktérů. Jelikož aktéři neobsahují žádné speciální grafické prvky, které by bylo nutné popisovat, tak pouze textově: odkaz Show zobrazuje informace o tomto aktérovi - jeho název (Name), popis (Description), zdrojový kód (Source code) a statický zdrojový kód (Static code). Pod popisem nalezneme tlačítko edit, které spouští následující funkčnost a Back, které vede zpět na seznam vzorů aktérů. 44
45 odkaz Edit umožňuje editovat informace existujícího aktéra. Zobrazení je stejné, jako u odkazu Show, akorát je zde možnost údaje měnit. Zdrojový kód v tomto místě není nijak validován ani spouštěn. odkaz Destroy slouží ke smazání existujícího aktéra ze simulace Správa simulací Obrázek 24 - Správa simulací Na této stránce můžeme vytvářet nové simulace, mazat existující, měnit aktéry v existující a také sledovat vygenerované výstupy. Odkaz New Simulation, ten nás přesměruje na stránku: 45
46 Obrázek 25 - Založení nové simulace Zde je zobrazen formulář sloužící k zadání vlastností nové simulace. Název (Name) by měl stručně popisovat obsah mapy, rozbalovací box (Map template) je určen k výběru šablony mapy podle názvu. Po vytvoření simulace je uživatel ihned přesměrován na obrazovku editace aktérů této simulace: Obrázek 26 - Editor aktérů Stránka editoru aktérů vypadá prakticky stejně, jako editor map, pouze smysl kontextového menu je jiný. Umožňuje nám editovat existující aktéry na mapě, vytvářet nové, nebo je mazat. Podle toho na jaké políčko klikneme, tak se zobrazí menu s možnostmi relevantními pro toto políčko. Při kliknutí na prázdné (bílé) políčko můžeme: 46
43 HTML šablony. Záložka Šablony v systému
43 HTML šablony Modul HTML šablony slouží ke správě šablon pro výstupy z informačního systému modularis ve formátu HTML. Modul umožňuje k šablonám doplňovat patičku, dokumentaci a vázat šablony na konkrétní
VíceProgramování v jazyku LOGO - úvod
Programování v jazyku LOGO - úvod Programovací jazyk LOGO je určen pro výuku algoritmizace především pro děti školou povinné. Programovací jazyk pracuje v grafickém prostředí, přičemž jednou z jeho podstatných
VícePostupy práce se šablonami IS MPP
Postupy práce se šablonami IS MPP Modul plánování a přezkoumávání, verze 1.20 vypracovala společnost ASD Software, s.r.o. dokument ze dne 27. 3. 2013, verze 1.01 Postupy práce se šablonami IS MPP Modul
VíceReliance 3 design OBSAH
Reliance 3 design Obsah OBSAH 1. První kroky... 3 1.1 Úvod... 3 1.2 Založení nového projektu... 4 1.3 Tvorba projektu... 6 1.3.1 Správce stanic definice stanic, proměnných, stavových hlášení a komunikačních
VíceDUM 06 téma: Tvorba makra pomocí VBA
DUM 06 téma: Tvorba makra pomocí VBA ze sady: 03 tematický okruh sady: Tvorba skript a maker ze šablony: 10 Algoritmizace a programování určeno pro: 4. ročník vzdělávací obor: 18-20-M/01 Informační technologie
VíceNový způsob práce s průběžnou klasifikací lze nastavit pouze tehdy, je-li průběžná klasifikace v evidenčním pololetí a školním roce prázdná.
Průběžná klasifikace Nová verze modulu Klasifikace žáků přináší novinky především v práci s průběžnou klasifikací. Pro zadání průběžné klasifikace ve třídě doposud existovaly 3 funkce Průběžná klasifikace,
VíceZEMĚMĚŘICKÝ ÚŘAD. Uživatelská příručka - Metadatový editor MDE. Pod Sídlištěm 9/1800, Praha 8. Verze IS nebo části IS: 1.01. Účel poslední změny:
ZEMĚMĚŘICKÝ ÚŘAD Pod Sídlištěm 9/1800, Praha 8 Uživatelská příručka - Metadatový editor MDE Verze IS nebo části IS: Účel poslední změny: Počet listů dokumentu: 1.01 úprava dokumentace 8 Číslo jednací dokumentu:
Více1 Webový server, instalace PHP a MySQL 13
Úvod 11 1 Webový server, instalace PHP a MySQL 13 Princip funkce webové aplikace 13 PHP 14 Principy tvorby a správy webového serveru a vývojářského počítače 14 Co je nezbytné k instalaci místního vývojářského
VíceMATLABLINK - VZDÁLENÉ OVLÁDÁNÍ A MONITOROVÁNÍ TECHNOLOGICKÝCH PROCESŮ
MATLABLINK - VZDÁLENÉ OVLÁDÁNÍ A MONITOROVÁNÍ TECHNOLOGICKÝCH PROCESŮ M. Sysel, I. Pomykacz Univerzita Tomáše Bati ve Zlíně, Fakulta aplikované informatiky Nad Stráněmi 4511, 760 05 Zlín, Česká republika
VíceTÉMATICKÝ OKRUH Softwarové inženýrství
TÉMATICKÝ OKRUH Softwarové inženýrství Číslo otázky : 25. Otázka : Komponentní technologie - základní pojmy a principy, metody specifikace komponent. Obsah : 1. Základní pojmy 1.1 Komponenta Komponenta
VíceNastavení provozního prostředí webového prohlížeče pro aplikaci
Nastavení provozního prostředí webového prohlížeče pro aplikaci IS o ISVS - Informační systém o informačních systémech veřejné správy verze 2.03.00 pro uživatele vypracovala společnost ASD Software, s.r.o.
VíceUživatelský manuál. Aplikace GraphViewer. Vytvořil: Viktor Dlouhý
Uživatelský manuál Aplikace GraphViewer Vytvořil: Viktor Dlouhý Obsah 1. Obecně... 3 2. Co aplikace umí... 3 3. Struktura aplikace... 4 4. Mobilní verze aplikace... 5 5. Vytvoření projektu... 6 6. Části
VíceANOTACE vytvořených/inovovaných materiálů
ANOTACE vytvořených/inovovaných materiálů Číslo projektu Číslo a název šablony klíčové aktivity Tematická oblast Formát Druh učebního materiálu Druh interaktivity CZ.1.07/1.5.00/34.0722 III/2 Inovace a
VíceTechnologické postupy práce s aktovkou IS MPP
Technologické postupy práce s aktovkou IS MPP Modul plánování a přezkoumávání, verze 1.20 vypracovala společnost ASD Software, s.r.o. dokument ze dne 27. 3. 2013, verze 1.01 Technologické postupy práce
VíceUživatelský manuál aplikace. Dental MAXweb
Uživatelský manuál aplikace Dental MAXweb Obsah Obsah... 2 1. Základní operace... 3 1.1. Přihlášení do aplikace... 3 1.2. Odhlášení z aplikace... 3 1.3. Náhled aplikace v jiné úrovni... 3 1.4. Změna barevné
VíceManuál pro žadatele OBSAH
Manuál pro žadatele OBSAH 1. Úvod... 2 2. Registrace žadatele do systému... 3 3. Přihlášení... 5 4. Změna hesla... 6 5. Obnova zapomenutého hesla... 7 6. Vyplňování formuláře žádosti o dotaci... 8 6.1.
VíceSignEditor 1 - návod k použití
SignEditor 1 - návod k použití Tomáš Ryba tryba@kky.zcu.cz Zdeněk Krňoul zdkrnoul@kky.zcu.cz Jakub Kanis jkanis@kky.zcu.cz 27. března 2012 1 Vznik za podpory projektu Pojabr - Potlačení jazykové bariéry
Více1 Administrace systému 3. 1.3 Moduly... 3 1.4 Skupiny atributů... 4 1.5 Atributy... 4 1.6 Hodnoty atributů... 4
CRM SYSTÉM KORMORÁN PŘÍRUČKA ADMINISTRÁTORA Obsah 1 Administrace systému 3 1.1 Uživatelské účty.................................. 3 1.2 Přístupová práva................................. 3 1.3 Moduly.......................................
VíceManuál pro obsluhu Webových stránek
ResMaster Systems s.r.o. Truhlářská 1119/20, 110 00 Praha 1 Manuál pro obsluhu Webových stránek (Prosinec 2018) Jana Vítová, +420 225 388 130 2018 Obsah Úvod Webové stránky... 3 Slovník pojmů... 3 URL
VíceMaturitní otázky z předmětu PROGRAMOVÁNÍ
Wichterlovo gymnázium, Ostrava-Poruba, příspěvková organizace Maturitní otázky z předmětu PROGRAMOVÁNÍ 1. Algoritmus a jeho vlastnosti algoritmus a jeho vlastnosti, formy zápisu algoritmu ověřování správnosti
VíceSvolávací systém Uživatelský manuál
Uživatelský manuál TTC TELEKOMUNIKACE, s.r.o. Třebohostická 987/5 100 00 Praha 10 tel.: 234 052 111 fax.: 234 052 999 e-mail: ttc@ttc.cz http://www.ttc-telekomunikace.cz Datum vydání: 14. srpna 2013 Číslo
Více02. HODINA. 2.1 Typy souborů a objektů. 2.2 Ovládací prvky Label a TextBox
02. HODINA Obsah: 1. Typy souborů a objektů 2. Ovládací prvky Label a TextBox 3. Základní příkazy a vlastnosti ovládacích prvků 4. Práce s objekty (ovládací prvky a jejich vlastnosti) 2.1 Typy souborů
VíceTECHNOLOGIE ELASTICKÉ KONFORMNÍ TRANSFORMACE RASTROVÝCH OBRAZŮ
TECHNOLOGIE ELASTICKÉ KONFORMNÍ TRANSFORMACE RASTROVÝCH OBRAZŮ ÚVOD Technologie elastické konformní transformace rastrových obrazů je realizována v rámci webové aplikace NKT. Tato webová aplikace provádí
VíceFFUK Uživatelský manuál pro administraci webu Obsah
FFUK Uživatelský manuál pro administraci webu Obsah FFUK Uživatelský manuál pro administraci webu... 1 1 Úvod... 2 2 Po přihlášení... 2 3 Základní nastavení webu... 2 4 Menu... 2 5 Bloky... 5 6 Správa
VíceManuál k programu KaraokeEditor
Manuál k programu KaraokeEditor Co je KaraokeEditor? Program slouží pro editaci tagů v hudebních souborech formátu mp3. Tagy jsou doprovodné informace o písni, uložené přímo v mp3. Aplikace umí pracovat
VíceAthena Uživatelská dokumentace v
Athena Uživatelská dokumentace v. 2.0.0 OBSAH Obsah... 2 Historie dokumentu... 3 Popis systému... 4 Založení uživatele... 5 Přihlášení uživatele... 7 První přihlášení... 8 Založení profilu zadavatele/dodavatele...
VíceSemestrální práce 2 znakový strom
Semestrální práce 2 znakový strom Ondřej Petržilka Datový model BlockFileRecord Bázová abstraktní třída pro záznam ukládaný do blokového souboru RhymeRecord Konkrétní třída záznamu ukládaného do blokového
VícePrůvodce aplikací FS Karta
Průvodce aplikací FS Karta Základní informace k Aplikaci Online aplikace FS Karta slouží k bezpečnému ukládání osobních údajů fyzických osob a k jejich zpracování. Osobní údaje jsou uloženy ve formě karty.
VíceComenius Logo. Princip programování. Prostředí Comenius Logo
Comenius Logo je objektově orientovaný programovací nástroj pracující v prostředí Windows. Byl vyvinut na Slovensku jako nástroj k výuce programování na základních školách. Rozvíjí tvořivost a schopnost
VíceDSL manuál. Ing. Jan Hranáč. 27. října 2010. V této kapitole je stručný průvodce k tvorbě v systému DrdSim a (v
DSL manuál Ing. Jan Hranáč 27. října 2010 V této kapitole je stručný průvodce k tvorbě v systému DrdSim a (v současné době krátký) seznam vestavěných funkcí systému. 1 Vytvoření nového dobrodružství Nejprve
VíceNÁVOD NA OBSLUHU INTERNETOVÉ PREZENTACE. Ataxo Czech s.r.o.
NÁVOD NA OBSLUHU INTERNETOVÉ PREZENTACE Ataxo Czech s.r.o. ÚVOD Internetové stránky vytvořené společností Ataxo v rámci produktu Mini web můžete jednoduše a rychle upravovat prostřednictvím on-line administrace.
VícePříručka pro editaci kontaktů na eagri
Obsah Úvod... 1 Uživatel a subjekt... 1 Kontakty... 1 Validace hodnoty kontaktu... 2 GPS souřadnice... 3 Datová schránka... 3 Adresy... 3 Speciální PSČ... 4 Adresy s P.O. Box... 4 Klíč pro WS... 4 Uživatelé...
VícePočítačová Podpora Studia. Přednáška 5 Úvod do html a některých souvisejících IT. Web jako platforma pro vývoj aplikací.
Přednáška 5 1. Stručný přehled vývoje html H T m l (HTML...XML... html5), (Web API, JSON, REST,AJAX) 2. Některé související IT IP adresa, doménová adresa, name servery JavaScritp, Jquery, Angular PHP vs
VíceSTŘEDNÍ ŠKOLA INFORMAČNÍCH TECHNOLOGIÍ A SOCIÁLNÍ PÉČE
STŘEDNÍ ŠKOLA INFORMAČNÍCH TECHNOLOGIÍ A SOCIÁLNÍ PÉČE WEBOWÉ STRÁNKY TŘÍD KAMIL POPELKA ZÁVĚREČNÁ MATURITNÍ PRÁCE BRNO 2011 Prohlášení Prohlašuji, že maturitní práce je mým původním autorským dílem, které
VíceOutdoor Expert. Uživatelský manuál. Verze aplikace: OutdoorExpert_Manual.docx 1 /
Outdoor Expert Uživatelský manuál Verze aplikace: 1.0 28. 12. 2014 OutdoorExpert_Manual.docx 1 / 35 2015-01-01 Obsah 1 ÚVOD... 3 2 POPIS FUNKČNOSTÍ APLIKACE... 3 2.1 SPUŠTĚNÍ APLIKACE... 3 2.2 ZALOŽENÍ
VíceManuál pro práci s modulem Otázky a odpovědi
Manuál pro práci s modulem Otázky a odpovědi Užitečné postupy a doporučení Obsah 1 Role uživatelů...3 2 Odesílání otázek...3 3 Přehled otázek...4 3.1 Orientace v přehledu...4 3.2 Základní údaje otázky...5
VíceObsah. 1.1 Práce se záznamy... 3 1.2 Stránka Dnes... 4. 2.1 Kontakt se zákazníkem... 5
CRM SYSTÉM KORMORÁN UŽIVATELSKÁ PŘÍRUČKA Obsah 1 Základní práce se systémem 3 1.1 Práce se záznamy................................. 3 1.2 Stránka Dnes.................................... 4 1.3 Kalendář......................................
Vícexrays optimalizační nástroj
xrays optimalizační nástroj Optimalizační nástroj xoptimizer je součástí webového spedičního systému a využívá mnoho z jeho stavebních bloků. xoptimizer lze nicméně provozovat i samostatně. Cílem tohoto
VícePřehledy pro Tabulky Hlavním smyslem této nové agendy je jednoduché řazení, filtrování a seskupování dle libovolných sloupců.
Přehledy pro Tabulky V programu CONTACT Professional 5 naleznete u firem, osob a obchodních případů záložku Tabulka. Tuto záložku lze rozmnožit, přejmenovat a sloupce je možné definovat dle vlastních požadavků
VíceRoční periodická zpráva projektu
WAK-1F44C-2005-2 WAK System Název projektu: Automatizovaná výměna dat mezi informačními systémy krizového řízení v dopravě s jednotným univerzálním a implementovaným rozhraním založeným na standardu webových
VíceLokality a uživatelé
Administrátorský manuál TTC TELEKOMUNIKACE, s.r.o. Třebohostická 987/5 100 00 Praha 10 tel.: 234 052 111 fax.: 234 052 999 e-mail: ttc@ttc.cz http://www.ttc-telekomunikace.cz Datum vydání: 15.října 2013
VíceTento projekt je spolufinancován Evropským sociálním fondem a státním rozpočtem České republiky. PORTÁL KUDY KAM. Manuál pro administrátory. Verze 1.
Tento projekt je spolufinancován Evropským sociálním fondem a státním rozpočtem České republiky. PORTÁL KUDY KAM Manuál pro administrátory Verze 1.0 2012 AutoCont CZ a.s. Veškerá práva vyhrazena. Tento
VícePravidla a plánování
Administrátorský manuál TTC TELEKOMUNIKACE, s.r.o. Třebohostická 987/5 100 00 Praha 10 tel.: 234 052 111 fax.: 234 052 999 e-mail: ttc@ttc.cz http://www.ttc-telekomunikace.cz Datum vydání: 7. května 2013
VíceAplikace pro srovna ní cen povinne ho ruc ení
Aplikace pro srovna ní cen povinne ho ruc ení Ukázkový přiklad mikroaplikace systému Formcrates 2010 Naucrates s.r.o. Veškerá práva vyhrazena. Vyskočilova 741/3, 140 00 Praha 4 Czech Republic tel.: +420
VíceFormy komunikace s knihovnami
Formy komunikace s knihovnami Současné moderní prostředky Jiří Šilha a Jiří Tobiáš, Tritius Solutions a.s., Brno Osnova Základní požadavky na komunikaci s knihovnami Historie komunikace s knihovnami Confluence
VícePlatforma.NET 11.NET Framework 11 Visual Basic.NET Základní principy a syntaxe 13
Obsah Úvod 11 Platforma.NET 11.NET Framework 11 Visual Basic.NET 12 1 Základní principy a syntaxe 13 Typový systém 13 Hodnotové typy 13 Struktury 15 Výčtové typy 15 Referenční typy 15 Konstanty 16 Deklarace
VíceComenius Logo. Úterý 20. března. Princip programování. Prostředí Comenius Logo
Úterý 20. března Comenius Logo je objektově orientovaný programovací nástroj pracující v prostředí Windows. Byl vyvinut na Slovensku jako nástroj k výuce programování na základních školách. Rozvíjí tvořivost
VíceModul IRZ návod k použití
Modul IRZ návod k použití Verze: 2 Datum: 26. 2. 2016 Tento dokument představuje stručný návod na použití modulu IRZ v programu EVI 8. Modul IRZ je určen na evidenci odpadů pro IRZ provozovny a hlášení
VíceProgramujeme v softwaru Statistica
Programujeme v softwaru Statistica díl třetí Newsletter Statistica ACADEMY Téma: Programování, makra, skripty Typ článku: Návody V předchozích článcích (díl první, díl druhý) jsme si osvětlili základní
VíceReportní systém MANTIS
TD-IS s.r.o. Sladkovského 43 32600 Plzeň verze: 1.9 Reportní systém MANTIS http://mantis.td-is.cz 1. Přístup k aplikaci Aplikace MANTIS je čistě internetová aplikace, z čehož vyplívá, že jediný přístup
VíceProjektová dokumentace GED 2006
Projektová dokumentace GED 2006 20.4.2006 Řešitelé týmu a podíl práce na projektu: Kamil Dudka xdudka00 objektový návrh uživatelské rozhraní podpora plug-in programů kreslící plocha vkládání textu programová
Více2 PŘÍKLAD IMPORTU ZATÍŽENÍ Z XML
ROZHRANÍ ESA XML Ing. Richard Vondráček SCIA CZ, s. r. o., Thákurova 3, 160 00 Praha 6 www.scia.cz 1 OTEVŘENÝ FORMÁT Jednou z mnoha užitečných vlastností programu ESA PT je podpora otevřeného rozhraní
Více45 Plánovací kalendář
45 Plánovací kalendář Modul Správa majetku slouží ke tvorbě obecných ročních plánů činností organizace. V rámci plánu je třeba definovat oblasti činností, tj. oblasti, ve kterých je možné plánovat. Každá
VíceNástrojová lišta v editačním poli
Nástrojová lišta v editačním poli Název projektu PŘEJÍT NA konkrétní sekci webu ZOBRAZIT zobrazí a) pracovní verzi webu (tj. nepublikovanou) b) publikovanou verzi webu a) Odstranit odstraní zobrazenou
VíceOBSAH. 1. Úvod Požadavky na SW vybavení... 3
Obsah OBSAH 1. Úvod... 3 1.1 Požadavky na SW vybavení... 3 2. Popis Reliance J... 4 2.1 Start vizualizace... 4 2.2 Hlavní okno... 5 2.2.1 Menu Služby... 6 2.2.2 Menu Nápověda... 8 2.3 Nastavení hodnoty...
VícePrůvodce aplikací GTS Webový portál pro správce
Průvodce aplikací GTS Webový portál pro správce www.centrex.gts.cz Strana 1 z 14 Obsah 1 Přihlášení do portálu Centrex... 3 2 Hlavní stránka aplikace základní popis... 3 3 Použití interaktivní nápovědy...
VícePHP framework Nette. Kapitola 1. 1.1 Úvod. 1.2 Architektura Nette
Kapitola 1 PHP framework Nette 1.1 Úvod Zkratka PHP (z anglického PHP: Hypertext Preprocessor) označuje populární skriptovací jazyk primárně navržený pro vývoj webových aplikací. Jeho oblíbenost vyplývá
VíceALGORITMIZACE A PROGRAMOVÁNÍ
Metodický list č. 1 Algoritmus a jeho implementace počítačovým programem Základním cílem tohoto tematického celku je vysvětlení pojmů algoritmus a programová implementace algoritmu. Dále je cílem seznámení
VíceDOKUMENTACE REDAKČNÍHO SYSTÉMU PINYA
DOKUMENTACE REDAKČNÍHO SYSTÉMU PINYA Obsah Obsah... 4 Pinya CMS... 5 Přihlášení do systému... 6 Položky v menu administrace... 7 Uživatelé... 8 Správa uživatelů... 8 Nový uživatel... 9 Role... 10 Vytvoření
VícePracovní výkazy. návod k použití. Internetová aplikace Pracovní výkazy slouží k zadávání pracovních výkazů od zaměstnanců a externích pracovníků.
1 Popis aplikace Pracovní výkazy návod k použití Internetová aplikace Pracovní výkazy slouží k zadávání pracovních výkazů od zaměstnanců a externích pracovníků. 2 Technické požadavky klienta Internetový
VíceHLEDEJCENY.mobi. Obsah. Mobilní verze e-shopu. Důvody instalace
Obsah HLEDEJCENY.mobi Mezi Vodami 1952/9 e-mail: info@hledejceny.cz HLEDEJCENY.mobi... 1 Mobilní verze e-shopu... 1 Důvody instalace... 1 Výhody... 2 Co je k mobilní verzi potřeba... 2 Objednávka služby...
VíceKRAJSKÝ ÚŘAD KARLOVARSKÉHO KRAJE. Manuál. Uživatele aplikace informačního systému pro
Manuál Uživatele aplikace informačního systému pro zjišťování údajů a vypracování Přehledu o předběžném odhadu nákladů na obnovu majetku sloužícího k zabezpečení základních funkcí v území Karlovarského
VíceMS SQL Server 2008 Management Studio Tutoriál
MS SQL Server 2008 Management Studio Tutoriál Vytvoření databáze Při otevření management studia a připojením se ke konkrétnímu sql serveru mám v levé části panel s názvem Object Explorer. V tomto panelu
VíceMasarykova střední škola zemědělská a Vyšší odborná škola, Opava, příspěvková organizace
Masarykova střední škola zemědělská a Vyšší odborná škola, Opava, příspěvková organizace Číslo projektu Číslo materiálu Autor Průřezové téma Předmět CZ.1.07/1.5.00/34.0565 VY_32_INOVACE_284_Programovací_jazyky
VíceMožnosti tisku v MarushkaDesignu
0 Možnosti tisku v MarushkaDesignu OBSAH 1 CÍL PŘÍKLADU...2 2 PRÁCE S PŘÍKLADEM...2 3 UKÁZKA DIALOGOVÉHO OKNA...3 4 STRUČNÝ POPIS PŘÍKLADU V MARUSHKADESIGNU...5-1 - 1 Cíl příkladu V tomto příkladu si ukážeme
VíceProgramátorská příručka
KAPITOLA 1. PROGRAMÁTORSKÁ PŘÍRUČKA Kapitola 1 Programátorská příručka 1.1 Úvod 1.1.1 Technologie Program je psaný v jazyce Java 1.7. GUI je vytvářeno pomocí knihovny SWT. (http://eclipse.org/swt/) Pro
VíceObrázek 1: Struktura programu z hlediska zapojení
MANUÁL K PROGRAMU DBADVOKÁT Program byl vytořený za účelem třídění a uchovávání jednotlivých spisů (elektronické dokumenty [doc, xls, odt, pdf, xml,...], emaily a další důležité soubory) v centralním počítači
VíceGEOM LITE - MANUÁL hlavní obrazovka
GEOM LITE - MANUÁL hlavní obrazovka Levý panel Pomoci levého panelu je možné vybírat aktivní vrstvy, měnit jejich průhlednost a pořadí. V dolní části je zobrazena legenda. Horní panel V horním panelu se
VíceUživatelská příručka pro ředitele škol
Národní šetření výsledků žáků v počátečním vzdělávání Uživatelská příručka pro ředitele škol Název souboru: Modul IDM - Uživatelská příručka pro ředitele škol V2.doc Strana 1 Obsah 1 Úvod... 3 2 Přihlášení
VícePrvní kroky s METEL IEC IDE
První kroky s poskytuje programování v IEC 61131-3 jazycích, podporuje jak grafickou tak textovou podobu. Umožňuje vytvářet, upravovat a ladit IEC 61131-3 (ST, LD, IL, FBD) programy pro řídicí jednotky
VíceNápověda pro ovládání automaticky čtené učebnice
Speciální vzdělávací pomůcky k podpoře výuky slabozrakých žáků Nápověda pro ovládání automaticky čtené učebnice Požadavky na počítač Pro používání čtených pomůcek Vám postačí běžný osobní počítač, reproduktory
Víceplussystem Příručka k instalaci systému
plussystem Příručka k instalaci systému Tato příručka je určena zejména prodejcům systému a případně koncovým uživatelům. Poskytuje návod, jak provést potřebná nastavení komponent. ITFutuRe s.r.o. 26.2.2015
Více1. Úvod do Ajaxu 11. Jak Ajax funguje? 13
Obsah Úvodem 9 1. Úvod do Ajaxu 11 Jak Ajax funguje? 13 Popis 13 Ukázky 13 Jaké jsou možnosti tvorby interaktivních webových aplikací? 15 Co je třeba znát? 16 Jak fungují technologie Ajaxu 16 Jak funguje
VíceDIPL 2. Stručný manuál pro vysokoškolské kvalifikační práce.
DIPL 2 Stručný manuál pro vysokoškolské kvalifikační práce. Obsah STUDENTI VYTVOŘENÍ VOLNÉHO TÉMATU VŠKP VÝBĚR TÉMATU VŠKP Z VOLNÝCH TÉMAT KONTROLA ZADÁNÍ TÉMATU FORMÁLNÍ ÚPRAVA VYPLNĚNÍ ÚDAJŮ ELEKTRONICKÉ
VíceVersiondog 3.1.0 Lukáš Rejfek, Pantek (CS) s.r.o. 7/2014
Versiondog 3.1.0 Lukáš Rejfek, Pantek (CS) s.r.o. 7/2014 Strana 2 Versiondog 3.1.0 Nová verze systému Versiondog 3.1.0 přináší oproti předchozí verzi 3.0.3 celou řadu nových funkčností. Zásadní změnou
VíceEQAS Online. DNY kontroly kvality a speciálních metod HPLC, Lednice 8.-9.11.2012
EQAS Online DNY kontroly kvality a speciálních metod HPLC, Lednice 8.-9.11.2012 Co je program EQAS Online Nový program od Bio-Radu pro odesílání výsledků externího hodnocení kvality Přístupný je prostřednictvím
VíceUživatelská příručka administrativního rozhraní Vědecké knihovny v Olomouci
Držitel certifikátu jakosti ISO 9001:2001 Uživatelská příručka administrativního rozhraní Vědecké knihovny v Olomouci Stránka 1/44 Obsah 1.Redakční systém...4 1.1. Povolené jazykové mutace...4 5.2.1 Překlad
Více[APLIKACE PRO PŘEHRÁVÁNÍ VIDEA - PROJEKT MIAMI - SERVEROVÁ ČÁST]
[APLIKACE PRO PŘEHRÁVÁNÍ VIDEA - PROJEKT MIAMI - SERVEROVÁ ČÁST] [Aktualizace dokumentu: 27.8.2011 3:02:37 Verze dokumentu: 1.0 Obsah Obsah... 2 1. Struktura databáze a souborů... 3 2. Soubor registerdevice.php...
VíceQuestionnaire příručka uživatele
Questionnaire příručka uživatele Obsah: K čemu aplikace slouží? Popis funkcí Návod k použití o Úvodní dialogové okno o Pro respondenty o Pro administrátory K čemu aplikace slouží? Program questionnaire
VíceUživatelská příručka. 06/2018 Technické změny vyhrazeny.
Uživatelská příručka 1 OBSAH 1 ÚVOD... 3 1.1 Merbon SCADA... 3 1.1.1 K čemu program slouží...3 2 Přihlášení a odhlášení z programu... 4 3 Projekty... 5 3.1 Výběr zobrazení... 5 3.2 Schémata... 6 3.3 Grafy...
VíceBALISTICKÝ MĚŘICÍ SYSTÉM
BALISTICKÝ MĚŘICÍ SYSTÉM UŽIVATELSKÁ PŘÍRUČKA Verze 2.3 2007 OBSAH 1. ÚVOD... 5 2. HLAVNÍ OKNO... 6 3. MENU... 7 3.1 Soubor... 7 3.2 Měření...11 3.3 Zařízení...16 3.4 Graf...17 3.5 Pohled...17 1. ÚVOD
Více1. Webový server, instalace PHP a MySQL 13
Úvod 11 1. Webový server, instalace PHP a MySQL 13 Princip funkce webové aplikace 13 PHP 14 Principy tvorby a správy webového serveru a vývojářského počítače 14 Co je nezbytné k instalaci místního vývojářského
VíceČtvrtek 3. listopadu. Makra v Excelu. Obecná definice makra: Spouštění makra: Druhy maker, způsoby tvorby a jejich ukládání
Čtvrtek 3. listopadu Makra v Excelu Obecná definice makra: Podle definice je makro strukturovanou definicí jedné nebo několika akcí, které chceme, aby MS Excel vykonal jako odezvu na nějakou námi definovanou
VíceUKÁZKA PORTÁLU IS KP14+
UKÁZKA PORTÁLU IS KP14+ INFORMAČNÍ SYSTÉM KONEČNÉHO PŘÍJEMCE 1. Jak vypadá a funguje IS KP14+ 2. Založení a vyplnění žádosti KDE HLEDAT INFORMACE Příručky OPZ Pokyny k vyplnění žádosti v IS KP14+: http://www.esfcr.cz/file/9143/
VíceMS Excel makra a VBA
Autor: RNDr. Obsah: MS Excel makra a VBA 1 Využití, ukázky, výhody a nevýhody... 2 2 Makra a zabezpečení... 2 2.1 Nastavení zabezpečení Excelu... 2 2.2 Uložení maker do sešitu a osobního sešitu maker...
VíceTÉMATICKÝ OKRUH Softwarové inženýrství
TÉMATICKÝ OKRUH Softwarové inženýrství Číslo otázky : 24. Otázka : Implementační fáze. Postupy při specifikaci organizace softwarových komponent pomocí UML. Mapování modelů na struktury programovacího
VíceSimBIm uživatelská dokumentace
SimBIm uživatelská dokumentace SimBIm (zkratka pro Similarity Between Images) je webová aplikace určená pro sběr uživatelských hodnocení podobnosti mezi obrázky. Tyto nasbíraná hodnocení jsou pak většinou
Více1 Příručka používání Google Apps
1 Příručka používání Google Apps Tento manuál vznikl pro účel seznámení se základní funkčností balíku Google Apps a má za úkol Vás seznámit s principy používání jednotlivých služeb (Gmail, Kalendáře, Disk).
VíceInformační systém pro e-learning manuál
Informační systém pro e-learning manuál Verze 1.00 Úvod Tento dokument popisuje způsob práce s informačním systémem pro elektronické vzdělávání. Systém je určený pro vytvoření elektronického kurzu a jeho
VíceUživatelská příručka
PŘÍLOHA B Uživatelská příručka Před prvním spuštění aplikace je nezbytné ujasnit si některé pojmy: web URL webových stránek, pro které se budou zjišťovat pozice. klíčové slovo - Slovní spojení nebo samostatné
VíceUživatelská příručka pro respondenty
Uživatelská příručka pro respondenty Statistický informační systém Českého statistického úřadu Subsystém DANTE WEB Funkční blok Objednavatel: Český statistický úřad Na padesátém 81, 100 82 Praha 10 Dodavatel:
VíceČNHP. Příručka pro pacienty. Institut biostatistiky a analýz. Vytvořil:
ČNHP Vytvořil: Institut biostatistiky a analýz OBSAH. VSTUP DO REGISTRU... 3. ZAPOMENUTÉ HESLO... 3 2. ZÁKLADNÍ OKNO REGISTRU... 4 3. VYHLEDÁVÁNÍ PACIENTA... 5 3. NAPOSLEDY OTEVŘENÍ PACIENTI... 5 4. PRÁCE
Více4. blok část A Logické operátory
4. blok část A Logické operátory Studijní cíl Tento blok je věnován představení logických operátorů AND, OR, NOT v jazyce SQL a práce s nimi. Doba nutná k nastudování 1-2 hodiny Průvodce studiem Při studiu
VícePráce s texty, Transformace rastru, Připojení GPS
Školení programu TopoL xt Práce s texty, Transformace rastru, Připojení GPS Obsah: 1. Uživatelské rozhraní (heslovitě, bylo součástí minulých školení) 2. Nastavení programu (heslovitě, bylo součástí minulých
VíceNápověda k aplikaci EA Script Engine
Nápověda k aplikaci EA Script Engine Object Consulting s.r.o. 2006 Obsah Nápověda k aplikaci EA Script Engine...1 1. Co je EA Script Engine...2 2. Důležité upozornění pro uživatele aplikace EA Script Engine...3
VíceWR Reality. Web Revolution. Uživatelský manuál administračního rozhraní
WR Reality Web Revolution Uživatelský manuál administračního rozhraní Web Revolution s. r. o. 2010 WR Reality Administrace uživatelský manuál Praktický průvodce administrací webové aplikace WR Reality
VíceUniLog-D. v1.01 návod k obsluze software. Strana 1
UniLog-D v1.01 návod k obsluze software Strana 1 UniLog-D je PC program, který slouží k přípravě karty pro záznam událostí aplikací přístroje M-BOX, dále pak k prohlížení, vyhodnocení a exportům zaznamenaných
VíceTvorba kurzu v LMS Moodle
Tvorba kurzu v LMS Moodle Před počátkem práce na tvorbě základního kurzu znovu připomínám, že pro vytvoření kurzu musí být profil uživatele nastaven administrátorem systému minimálně na hodnotu tvůrce
Více