OSUD Zlín-27.-28.04.2007

To takhle jednou v práci padl návrh, že bychom se mohli zúčastnit OSUDu, tak jsme se teda vrhli vstříc neznámu a dobrodružství a že to stálo za to!!

142-01

To takhle jednou v práci padl návrh, že bychom se mohli zúčastnit OSUDu, tak jsme se teda vrhli vstříc neznámu a dobrodružství a že to stálo za to!!

142-01

Osud, alias Od Soumraku Do Úsvitu je hra. Bližší informace jsou samozřejmě k mání na webu této hry, stručné informace říkají, že se jedná o hru, při které se tými pohybují terénem po stanovištích, na kterých jsou šifry, jejichž vyřešením je odkryto další stanoviště a takhle až do konce (v ideálním případě). Tato hra se odehrává ve Zlíně a naše premiéra (naše, nebolí týmu "The Beavers") se odehrála při čtvrtém jejím ročníku.

Hra začala v kině před hotelem Moskva, kde ji uvedl David Vávra hned po skončení "Šumného Zlína".

tisk00

A co že jsme tam dělali? Samozřejmě luštili

DSC06363

potom taky fotili

DSC06366

koukali na zajimavé exponáty

DSC06373

kochali se krásama nočního města Zlína

DSC06390

prolízali kanálem, což bylo naprosto super

DSC06407

a v neposlední řadě především chlastali

DSC06426

pobuřovali místní nevhodnými akcemi

DSC06436

a po ránu se potýkali s takovou věcí, ehrm, no, posuďte sami 😉

Každopádně, abych to nějak jednoduše shrnul, bylo to naprosto super, hodně dlouho jsem nezažil takovou suprovou akci! Sice jsem potom celé sobotní odpoledne prospal, ale co už nadělám. Doufám, že letošní ročník nebyl poslední, jak organizátoři slibují a na rok pojedu zase (ovšem každopádně počítám s akcemi jako Tmou, Krtčí norou atd.). Šifry i s komentáři jsou na webu akce, další fotky mám samozřejmě na flickru no a musím taky odkázat na sampLa, který tam byl taky a taky byl nadšenej jako já (phony zatím nemá žádnou výlevnu myšlenek, pokud vím, tak na toho odkazovat nebudu).

Zlobica-22.04.2007

"Přírodní památka Zlobice byla vyhlášena v roce 1984 na ploše 53 ha v k.ú. Malhostovice a Kuřim a je tvořena široce klenutým hřbetem se dvěma vrcholy, oddělenými širokým sedlem, se svahy různých expozic (290-394 m n.m.). Na východní straně jsou táhlé mírné svahy, na straně západní, severní a jižní jsou svahy strmější, místy podélně rozčleněné svahovými hřbety, úvaly až roklemi." (Český svaz ochránců přírody).

„Přírodní památka Zlobice byla vyhlášena v roce 1984 na ploše 53 ha v k.ú. Malhostovice a Kuřim a je tvořena široce klenutým hřbetem se dvěma vrcholy, oddělenými širokým sedlem, se svahy různých expozic (290-394 m n.m.). Na východní straně jsou táhlé mírné svahy, na straně západní, severní a jižní jsou svahy strmější, místy podélně rozčleněné svahovými hřbety, úvaly až roklemi.“ (Český svaz ochránců přírody).

Mapa Zlobica

Co je na tomto kopečku zajímavého? Ještě donedávna docela nic, kromě vojenského prostoru (tedy hromad dýmovnic, světlic, patronů, zákopů a podobného bordelu, alias bývalý výcvikový prostor pro studenty Vojenské akademie Brno). Roku 2003, se prostoru armáda vzdala ve prospěch obce Malhostovice, která jej záhy pronajala společnosti Oveko a.s. která zde pěstuje ovce a kozy. Mimo jiné zde taky stojí (snad v bývalé tělocvičně) hospoda, kde mají pifko a jídlo. Navíc se tu párkrát do roka konají společenské akce, které budou určitě rozepsané na webu oveka.

Nuž, vyrazili jsme okolo malhostovských jezírek (prostor Žalvíř)

04180017

prošli kolem vedení vysokého napětí

04180023

staré vojenské hlásky

04180028

a pak už prošli branou

04180029

dali si pivko v kolibě (lidí tu bylo jak na*), hromada cyklistů i pejskařů, se kterými počítají, tak je tu erární miska s pitím pro tyto čtyřnohé miláčky

04180037

pokochali se pohledem na Kuřim a ovce

04180034

a lesem opět vyrazili směrem k domovu.

04190004

Celkem, pokud počítám správně měl tento trip 2924+5205=8129m, výškově jsme vycházeli z 275mnm a vršek Zlobice má 391mnm.

No a jak už tu bývá zvykem, fotky jsou na flickru otagované jako Zlobica.

Stanoviska-15.04.2007

Tož po celotýdenním sezení v kanclu a sobotním hrbení se ve škole jsem v neděli dostal spásný nápad, že bych mohl zhuntovat nohy a psa menším výletem do blízkých kopečků.

Tož po celotýdenním sezení v kanclu a sobotním hrbení se ve škole jsem v neděli dostal spásný nápad, že bych mohl zhuntovat nohy a psa menším výletem do blízkých kopečků.

Nuže, vyšel jsem na zahradu, rozhlédl se po okolí, vybral si cíl naší cesty a vyrazil. Po chvíli jsem si uvědomil, že jsem doma zapomněl foťák, takže jsem se ještě kousek vracel, ovšem pořád příjemně naladěn tímto plánem.

Bohužel ještě pořád nemám GPSku, takže trasa cesty je v následující hybridní mapce vyznačena od oka.

mapa_stanoviska
Mapka naší cesty-modrá tam, červená zpět

Cesta vzhůru měřila cca 4650m a na konečné (Loc: 49°21'34.14"N,16°28'21.82"E) si moje psisko lehlo do stínu za mě a odmítalo pokračovat zpátky ;-). Vyrazili jsme z nadmořské výšky 278m a vyšli na 469m.

 

 

DSC06196

Takovouhle pěknou cestou jsme se ubírali vzhůru

DSC06199

Pohled dolů do nížiny (Boskovická brázda), žádná extra výška, ale dlouho jsem tu nebyl, tak se mi to líbilo 😉

DSC06205

Samozřejmě musím připojit foto mé "milované rodné vísky"

DSC06216

Divočení na vršku

Nahoře pěkně foukalo, ovšem na to, že byla teprve polovina dubna a já tam běhal jenom v tříčtvťákách a tričku, bylo dost teplo. Vršek je pěkná rovinka, jsou tam koně a nějakej kluk tam jezdil v jakési mini teréní bugině, u čehož se mu povedlo pěkně rozjet užovku, bastard.

Dali jsme si menší občerstvovačku, skládající se z jabka a vody, přijali telefonát s pozvánkou na večerní grilovačku a natěšení vyrazili 4200m dlouhou cestu zpátky o cca 200m níž.

 

Další fotky (možná i zajímavější než těch pár tady) jsou na FLICKRu, otagované "Stanoviska".

Když jsem došel domů napadlo mě, že bych mohl vyšplhat na střechu, udělat panoramatické foto a obejít všechny kopečky v okolí, které na té fotce budou vidět. Tak se do toho asi od příštího týdne pustím!

6 Použitá literatura

[1] GARRETT, Jesse James. Ajax: A new approach to Web Applications [online]. 2005-02-18.<http://www.adaptivepath.com/publications/essays/archives/000385.php> [2] ORT, Ed – BASLER, Mark. Ajax Design Strategise. Sun Developer Network [online]. 2006-09.<http://java.sun.com/developer/technicalArticles/J2EE/AJAX/DesignStrategies/> [3] TIM O'REILLY. What Is Web 2.0. O'Reilly Network [online]. 2005-09-30<http://www.oreillynet.com/pub/a/oreilly/tim/news/2005/09/30/what-is-web-20.html> [4] GEHTLAND, J. – GALBRAITH, B. – ALMAER, D. Pragmatic Ajax, The PragmaticBookshelf, 2006. ISBN 0976694085. [5] … Pokračovat ve čtení „6 Použitá literatura“

[1] GARRETT, Jesse James. Ajax: A new approach to Web Applications [online]. 2005-02-18.<http://www.adaptivepath.com/publications/essays/archives/000385.php>

[2] ORT, Ed – BASLER, Mark. Ajax Design Strategise. Sun Developer Network [online]. 2006-09.
<http://java.sun.com/developer/technicalArticles/J2EE/AJAX/DesignStrategies/>

[3] TIM O'REILLY. What Is Web 2.0. O'Reilly Network [online]. 2005-09-30
<http://www.oreillynet.com/pub/a/oreilly/tim/news/2005/09/30/what-is-web-20.html>

[4] GEHTLAND, J. – GALBRAITH, B. – ALMAER, D. Pragmatic Ajax, The Pragmatic
Bookshelf, 2006. ISBN 0976694085.

[5] JACOBI, J. – FALLOWS, J. R. Pro JSF and Ajax, Apres, 2006. ISBN 1590595807.

[6] ASLESON, R. – SCHUTTA, N. T. Foundations of Ajax, Apress, 2006. ISBN 1590595823.

[7] GROSS, CH. Ajax Patterns and Best Practices, Apress, 2006. ISBN 1590596161.

5 Závěr

Cílem tohoto projektu bylo nastudování dvou moderních a velice perspektivních technologií.
Jak Java Server Faces, tak i technologie AJAX mě velmi zaujaly, navíc jsem získal mnoho nových informací z oblasti vývoje webových aplikací, které v praxi vyvíjím. Stejně tak prostředí Java Studio Creator mě velice mile překvapilo a troufám si říci, že se jedná o velice komplexní a kvalitní nástroj pro vývoj tohoto druhu aplikací.

Cílem tohoto projektu bylo nastudování dvou moderních a velice perspektivních technologií.
Jak Java Server Faces, tak i technologie AJAX mě velmi zaujaly, navíc jsem získal mnoho nových informací z oblasti vývoje webových aplikací, které v praxi vyvíjím. Stejně tak prostředí Java Studio Creator mě velice mile překvapilo a troufám si říci, že se jedná o velice komplexní a kvalitní nástroj pro vývoj tohoto druhu aplikací.
Výhodou tohoto řešení je především dobrá dokumentace a podpora jak ze strany Sunu, tak i komunity, které vyvíjejí množství knihoven s otevřeným kódem, tak i aplikací, odkud je možné čerpat inspiraci a poučení. Dalším velkým kladem je platformová nezávislost Javy, která je základním kamenem technologie Java Server Faces a samozřejmě možnost generování výstupu na základě požadavků uživatele. Prakticky tedy není problém využívat služeb tohoto řešení na mobilních telefonech, PDA či jakýchkoliv jiných zařízeních.
Pokud vezmeme v úvahu, jak vypadaly webové aplikace v poměrně nedávné době a jak je tomu teď, kdy společnosti jako Google tlačí směr vývoje směrem kupředu v podobě webových kancelářských balíků, poštovních klientů kvalitnějších než standardní desktopové nástroje, připojíme takřka neomezenou kapacitu prostoru na webu a zvyšující se kapacity přípojek koncových uživatelů je jasné, že tuto oblast čeká další velký vývoj.

4 Ukázková aplikace

Jako ukázku práce s použitými technologiemi se pokusím projít část aplikace, jíž jsem spoluřešitelem. Tuto aplikaci vyvíjím pomocí nástroje Sun Java Studio Creator s interně distribuovanými knihovnami komponent a balíčkem ICEfaces, jedná se tedy o předposlední výše uvedenou strategii vývoje – „Použití knihoven Java Scriptu“.

Jako ukázku práce s použitými technologiemi se pokusím projít část aplikace, jíž jsem spoluřešitelem. Tuto aplikaci vyvíjím pomocí nástroje Sun Java Studio Creator s interně distribuovanými knihovnami komponent a balíčkem ICEfaces, jedná se tedy o předposlední výše uvedenou strategii vývoje – „Použití knihoven Java Scriptu“.

4.1 Prostředí nástroje Sun Java Studio Creator

Sun Java Studio Creator (konkrétně mnou požívaná verze 2 update 1) je velice komfortní RAD (Rapid Application Development) vývojové prostředí pro vývoj webových aplikací založených na technologii JSF. Prostředí je velice intuitivní, skládá se z hlavního editačního okna a roletek s komponentami vlevo a menu s vlastnostmi vložených komponent vpravo; každá editovaná webová stránka má tři režimy editace: jednak design mód, kdy je zobrazena mřížka, na kterou jsou ukotvovány jednotlivé komponenty, druhak JSP kód editované stránky, kde je možné ručně upravovat JSF tagy a v neposlední řadě mód umožňující editaci Javového zdrojového kódu příslušného backing beanu.
Součástí distribuce je i Sun Java System Application Server, já však jako webový kontejner využíval Apache Tomcat, kam stačilo nahrát distribuční adresářovou strukturu projektu (případně vytvořený .war archiv, který Java Studio Creator umí rovněž vytvořit).

Free Image Hosting at www.ImageShack.us

Obr.5: Prostředí Sun Java Studio Creatoru

 

4.2 ICEfaces – Objekt Tree

Při vytváření aplikace jsem využil aplikační framework ICEfaces, jehož knihovny tagů je možné importovat přímo do Java Studio Creatoru (na Obr.5 je vidět část komponent v okně Palette).
V této části práce bych se chtěl zmínit především o dynamicky generované adresářové struktuře, která využívá komponentu ICEfaces – Tree.
Požadavkem bylo zobrazit stromovou strukturu adresářů pouze do úrovně, kterou má uživatel otevřenou jako nejnižší. Struktura každého dalšího otevíraného adresáře musí být načtena v reálném čase přímo ze serveru a to bez nutnosti znovunačtení stránky, případně změně / uzavření jiných větví stromu.

4.2.1 Vytvoření BackingBeans

Jak jsem uvedl výše, použil jsem komponentu Tree. Každá větev tohoto stromu je objekt (TreeObject), který rozšiřuje třídu IceUserObject. Tato třída je zodpovědná za vytváření, mazání a kopírování sebe sama, zároveň drží některé informace o svém předku a v mé implementaci objekt s informacemi o adresáři, příznak rozbalení větve a příznak ooznačení.
Tyto větve jsou uloženy v TreeBeanu, což je upravený SessionBean. V tomto Beanu je zároveň definován objekt DefaultTreeModel, což je proměnná, na kterou je navázána komponenta Tree.

 

<managed-bean>
<managed-bean-name>tree</managed-bean-name>
<managed-bean-class>icefacewebapplication1.TreeBean</managedbean-
class>
<managed-bean-scope>session</managed-bean-scope>
</managed-bean>

Tab. XXII: Definice beanu

 

Strom je vytvářen v Session Beanu, kde je objekt TreeBeanu definován a naplněn. Nejprve je načtena částečná adresářová struktura – kořen adresářového stromu a bezprostřední podadresáře – z databáze, potom jsou tato data postupně vkládána do vytvořeného stromu.

 

 

// vytvoreni roota a nacteni bezprostrednich podadresaru
Directory rootDir = thcSession.tHCClassFactory.getRoot();
this.directoryTreeBean.RenameRoot(rootDir);
List rootSubdirs = rootDir.getSubDirectories();
// vytvoreni bezprostrednich podadresaru roota
Directory tempDir;
for(int i = 0; i < rootSubdirs.size(); i++){
tempDir = (Directory)rootSubdirs.get(i);
this.directoryTreeBean.getRootTreeNode(). add(this.directoryTreeBean.CreateNode(tempDir));
}

Tab. XXIII: Vytvoření kořenového adresáře a bezprostředních podadresářů

Stejným způsobem jsou vytvářeny i všechny další podadresáře, ovšem pouze v případě klepnutí na konkrétní větev (a nenastaveného příznaku Explored).

4.2.2 Vytvoření komponenty a její napojení

Komponenta Tree je přímo napojena na DefaultTreeModel, což je objekt definovaný v TreeBeanu a předáván skrze BackingBean zobrazované stránky – Page1.jsp.

Free Image Hosting at www.ImageShack.us

Obr.6: Napojení komponenty na proměnnou s daty – dialog

<ice:tree binding="#{Page1.tree1}" id="tree1"
value="#{Page1.tree1Model}" var="item">

</ice:tree>

Tab. XXIV: Napojení komponenty na datový model – zápis v JSP

V takto nadefinovaném těle stromu jsou umístěny jednotlivé položky, treeNodes. A sice se jedná o grafickou ikonku se složkou (graphicImage) a text s názvem adresáře, což je vlastně odkaz (ovšem negenerující žádný case identifikátor pro navigační strom) – commandLink – který má definovánu jednak akci, při které jsou vytvářeny příslušné další větve (SessionBean1.nodeClicked) a jednak actionListener, jehož obslužná rutina je přímo v konkrétním objektu – TreeObject, který je volaný ještě před voláním vlastní akce, a v podstatě nedělá nic jiného, než nastaví v Session Beanu danou větev jako aktivní (přímo v Session Beanu se tato akce provést nedá).

 

<ice:treeNode binding="#{Page1.treeNode1}" id="treeNode1">
<f:facet name="icon">
<ice:panelGroup binding="#{Page1.panelGroup1}" id="panelGroup1">
<ice:graphicImage binding="#{Page1.graphicImage1}"
id="graphicImage1" value="#{item.userObject.icon}"/>
</ice:panelGroup>
</f:facet>
<f:facet name="content">
<ice:panelGroup>
<ice:commandLink action="#{SessionBean1.nodeClicked}"
actionListener="#{item.userObject.nodeClicked}"
binding="#{Page1.commandLink1}" id="commandLink1"
value="#{item.userObject.text}"/>
</ice:panelGroup>
</f:facet>
</ice:treeNode>

Tab. XXV: Definice větve stromu

Daný action Listener je metoda třídy TreeObject, která jako parametr vyžaduje předaný objekt ActionListener, který je při klepnutí na odkaz generován.

public void nodeClicked(ActionEvent event) {
treeBean.setSelectedNodeObject(this);
}

Tab. XXVI: Metoda volaná při stisku tlačítka – Action Listener

Stejně tak je definovaná metoda akce, ovšem tato je ve tříde SessionBean, nemá žádné parametry a vrací typ string, což je case identifikátor pro navigační strom, tedy v mém případě vrací null.

public String nodeClicked() {
// Jestlize jeste neni vetev prozkoumana…
if(!directoryTreeBean.getSelectedNodeObject().isNodeExplored()){
// Nacteni podadresaru vybraneho adresare z databaze

// vytvoreni bezprostrednich vetvi ve stromu

}
return null;
}

Tab. XXVII: Metoda volaná při stisku tlačítka – Action

 

4.3 Zhodnocení projektu

Projekt vytvářený v Java Studio Creatoru je možné vytvořit doslova několika klepnutími myši. Komponenty je možné vkládat pomocí myši, většina kódu je generována automaticky, stejně tak proměnné pro beany – vkládají se pomocí kontextového menu, gettery a settery jsou generovány automaticky.
Troufám si říci, je Java Studio Creator je silný nástroj pro tvorbu aplikací založených na JSF, před který je velice rychle pochopitelný i pro člověka, který se s touto technologií nikdy nesetkal a který neovládá ani jazyk Java. Velice rychle se s ním naučí pracovat a stejně tak rychle pronikne i do jazyka Java.

Free Image Hosting at www.ImageShack.us

Obr.7:Výsledná podoba komponenty – nerozbalený a rozbalený strom

 

Americký brouk

Zlí imperialisté ze západu k nám v krabičkách a skleničkách přenášeli tohoto špatného brouka, aby ničil úrodu brambor pro naše těžce pracující ;-).

Zlí imperialisté ze západu k nám v krabičkách a skleničkách přenášeli tohoto špatného brouka, aby ničil úrodu brambor pro naše těžce pracující ;-).

Videjko je ke skouknuti na YouTube.

A já bych snad jenom dodal…

3.6 Strategie návrhu

Pro vývojáře existuje mnoho možností, jak zahrnout podporu AJAXu do aplikace [2].
Může se jednat o kompletně vlastní kód na straně klienta i serveru, o využití existujících knihoven JavaScript kódu, kompletních frameworků se zabudovanou podporou AJAXu, či možnosti vývojových prostředí, které obsahují „kompilátor“ jazyka Java do JavaScriptu. Při návrhu aplikace je nutné zvážit všechna pro i proti jednotlivých metod, ne každá je vhodná pro řešení daného problému.
V této kapitole se pokusím nastínit vlastnosti jednotlivých metod, včetně jejich dobrých i špatných vlastností a uvést příklady knihoven či aplikací, které jsou na nich založeny.

Pro vývojáře existuje mnoho možností, jak zahrnout podporu AJAXu do aplikace [2].
Může se jednat o kompletně vlastní kód na straně klienta i serveru, o využití existujících knihoven JavaScript kódu, kompletních frameworků se zabudovanou podporou AJAXu, či možnosti vývojových prostředí, které obsahují „kompilátor“ jazyka Java do JavaScriptu. Při návrhu aplikace je nutné zvážit všechna pro i proti jednotlivých metod, ne každá je vhodná pro řešení daného problému.
V této kapitole se pokusím nastínit vlastnosti jednotlivých metod, včetně jejich dobrých i špatných vlastností a uvést příklady knihoven či aplikací, které jsou na nich založeny.

3.6.1 Vlastní

Touto metodou se rozumí napsání všech částí aplikace ručně: tedy vytvořením DOM s CSS a napojením na JavaScript s ošetřením XMLHttpRequest počínaje a obslužnými rutinami pro zachytávání požadavků, jejich zpracování a vytváření odpovědí na straně serveru konče.
Nevýhody tohoto řešení jsou dobře viditelné: především je to ohled na bezpečnost – je nutné do aplikace vnést zabezpečovací mechanizmy a především dobře ošetřit neočekávané vstupy jak na straně serveru, tak klienta. Stejně tak je potřebná velmi dobrá znalost všech použitých technologií, protože veškerý kód bude nutné psát ručně (snad s výjimkou generování DOM a CSS). Další nevýhodou je optimalizace kódu pro funkčnost ve více prohlížečích a ošetření používání tlačítka zpět.
Na stranu druhou výhodou toho řešení je dokonalý přehled nad všemi částmi projektu a výborná kontrola nad vším, co se v aplikaci děje.

 

3.6.2 Použití knihoven JavaScriptu

Díky využití existujících knihoven JavaScriptu je možné skrýt nízkoúrovňové operace s objektem XMLHttpRequest. Klientská strana aplikace se také stane bezpečnější (JavaScriptový kód v knihovně je ověřen mnoha uživateli a vývojáři, na rozdíl od vlastního nízkoúrovňového kódu).
Knihovny JavaScriptu přináší také další, nepřímé, možné výhody: jsou jimi např. jednodušší operace s objekty v DOM, efekty zpříjemňující uživateli práci.
Jednotlivá řešení jsou také optimalizovaná alespoň na nejpoužívanější prohlížeče, není tedy nutné tento problém řešit, případně alespoň částečně pokrývají i možné použití tlačítka zpět, či požadavek o uložení stránky mezi oblíbené (v daném rozložení).
Mezi nevýhody může patřit potřeba využití více různých knihoven zároveň, když jedna nepokrývá všechny potřebné oblasti. Stejně tak se vývojář musí orientovat v JavaScriptu, i když základní nízkoúrovňová volání pokrývají knihovny, stále je potřeba propojit objekty v DOM s událostmi a akcemi.
Mezi známější knihovny patří Dojo toolkit (AFD, BSD licence), Prototype (MIT licence), Script.aculo.us (MIT licence) a Rico (Apache 2.0 licence).

 

3.6.3 Použití frameworku

Do této kategorie spadají především řešení, kde základním kamenem je použití technologie JSF. Silný základ v podobě knihoven komponent, spolu s obslužným kódem, běžící na straně serveru je dále rozšiřován o propojení aplikační logiky pomocí JavaScriptu pro jednotlivé komponenty na straně klienta. Samozřejmostí je možnost vytváření nových komponent, případně úprava již stávajících pro vlastní potřebu.
Snad největší výhodou je možnost využití vizuálního nástroje pro tvorbu takovéto aplikace – například Sun Java Studio Creator, kde je možné tvořit aplikaci metodou drag-and-drop, čímž odpadá požadavek dokonale se orientovat v jednotlivých použitých technologiích (alespoň teoreticky). Výhodou je také znovupoužitelnost vytvořených komponent, díky jejich „balíčkování“.
Využití specializovaného vývojového nástroje pro tvorbu tohoto druhu aplikace dále přináší možnost krokování kódu, tedy větší možnosti pro ladění aplikace.
Možné nevýhody mohou být snížená orientace v kódu, protože velkou část generuje vývojové prostředí automaticky, případně při tvorbě vlastních komponent je nutná opět velmi dobrá znalost používaných technologií, nutnost ošetřování nekompatibility jednotlivých prohlížečů, ukládání do záložek a ošetření tlačítka zpět.
Mezi nejznámější frameworky užívající tuto strategii patří ICEFaces (Mozilla Public 1.1 licence i komerční řešení), Ajax4jsf (Common Development and Distribution licence), Java Blueprints (BSD licence) a částečně i Google Web Toolkit (Apache 2.0 licence).

 

3.6.4 Generování z jazyka Java

Poslední z možností (poslední z hlediska členění odstavců této práce) je použití frameworku Google Web Toolkit (opensource produkt společnosti Google pod licencí Apache 2.0). Jedná se o balík obsahující Java-To-JavaScript kompilátor, prohlížeč (upravený Mozilla Firefox), knihovnu emulující JRE a knihovnu vlastních UI komponent.
Výhoda tohoto řešení spočívá v tvorbě aplikace čistě v jazyce Java. Díky tomu je možné využít jakékoliv vývojové prostředí pro vývoj a odladění Java aplikace s podporou GWT a poté aplikaci zkompilovat kompilátorem J2JS a nechat běžet jako čistě HTML/JavaScript aplikaci (tzv. Web mode) např. ve webovém kontejneru, nebo program přeložit do Java Bajtkódu a nechat běžet v Java Virtual Machine (tzv. hosted mode), kdy je možno využít možnosti ladění v rámci prostředí, včetně nastavení breakpointů a krokování aplikace.
Zřejmě jedinou nevýhodou tohoto řešení je, že veškerý JavaScript kód je generován J2JS kompilátorem, čili hledání případné chyby či nestandartního chování může být poměrně náročné.

public class Hello implements EntryPoint {
public void onModuleLoad() {
Button b = new Button("Click me", new ClickListener() {
public void onClick(Widget sender) {
Window.alert("Hello, AJAX");
}
});
RootPanel.get().add(b);
}
}

Tab. XXI: Příklad jednoduché aplikace založené na GWT

3.5 Anatomie činnosti AJAXu

Webové stránky využívající AJAX jsou stránky zapsané pomocí značkovacího jazyka HTML, nebo XHTML (mohou být samozřejmě generované na straně serveru, např. pomocí JSP).
Výhodou Javy na straně serveru (konkrétně Java Platform, Enterprise Edition) je přímá podpora validace dat, správa identity uživatele a především perzistentnost. Díky tomu je programátor ušetřen vytváření vlastních rutin pro tyto akce.

Webové stránky využívající AJAX jsou stránky zapsané pomocí značkovacího jazyka HTML, nebo XHTML (mohou být samozřejmě generované na straně serveru, např. pomocí JSP).
Výhodou Javy na straně serveru (konkrétně Java Platform, Enterprise Edition) je přímá podpora validace dat, správa identity uživatele a především perzistentnost. Díky tomu je programátor ušetřen vytváření vlastních rutin pro tyto akce.

Obr.4: Model klasické webové aplikace a model aplikace postavené na AJAXu (převzato z [1] )

3.5.1 Generování události

Funkce JavaScriptu jsou volány důsledkem události vyvolané uživatelem. Je možné tedy namapovat funkci na event např. onClick na tlačítku. Pokud je tlačítko stisknuto, je volána tato metoda a stránka nadále zůstavá beze změny.

<input type=“button“ value=“Odeslat“ onClick=“odesli();“ />

Tab. XIV: JSP kód pro komponentu button s propojením na obsluhu události

3.5.2 Vytvoření objektu XMLHttpRequest

V závislosti na typu prohlížeče je vytvořen objekt XMLHttpRequest, je ověřen a provázán s obsluhou události návratu – callback() funkce. Pro otevření spojení jsou potřeba tři parametry: http metoda (v tomto případě POST či GET), adresu komponenty na straně serveru, která bude požadavek zpracovávat a boolovskou příznak, zda bude požadavek zpracováván asynchronně.

if(window.XMLHttpRequest)
var xmlhttp = new XMLHttpRequest;
else if(window.ActiveXObject)
var xmlhttp = new ActiveXObject („Microsoft.XMLHTTP“);
else
return false;
xmlhttp.open(metoda, url, typ);
xmlhttp.onreadystatechange = function() {
obsluha(xmlhttp);
};

Tab. XV: Příklad vytvoření požadavku

3.5.3 Připojení na server

Odeslání požadavku je realizováno funkcí xmlhttp.send(content). Pokud je pro
spojení použitá metoda GET (tu je vhodné použít v případě, že pro stejný odesílaný obsah je očekáván pokaždé stejná odpověd), u které může být obsah ponechán prázdný, jsou data připojena jako parametr k url. V důsledku toho je limitována velikost (délka řetězce) těchto dat.
Pokud jsou data odesílaná metodou POST (ta se využívá v případě, že odesílaná data zasáhnou do stavu serverové aplikace), je nutné připojit hlavičku Content-type. V tomto případě není velikost odesílaných dat nijak omezena (snad jenom možným vypršením časového limitu na straně serveru).

xmlhttp.setRequestHeader(„Content-Type“,
„application/x-www-form-urlencoded“);
xmlhttp.send(content);

Tab. XVI: Odeslání požadavku na server

3.5.4 Zpracování požadavku serverem

Na straně serveru je volána obslužná rutina, spojená s daným URI. V jazyce Java se jedná o třídu dědící z třídy HttpServlet. Tato rutina zpracuje požadavek, provede příslušné akce a odešle zpět odpověď.

public class SomeActionServlet extends HttpServlet {
private ServletContext context;
public void init(ServletConfig config) throws ServletException {
super.init(config);
this.context = config.getServletContext();
}
public void doGet(HttpServletRequest request,
HttpServletResponse response)
throws IOException, ServletException {
String parametr = request.getParameter(„parametr“);
if (parametr != null) {
response.setContentType(„text/xml“);
response.setHeader(„Cache-Control“, „no-cache“);
response.getWriter().write(„<odpoved>zpracovano</odpoved>“);
} else {
response.setContentType(„text/xml“);
response.setHeader(„Cache-Control“, „no-cache“);
response.getWriter().write(„<odpoved>chyba</odpoved>“);
}
}

Tab. XVII: Jednoduchý příklad zpracování požadavku a odeslání odpovědi

3.5.5 Zpracování odpovědi objektem XMLHttpRequest

Klientská aplikace (prohlížeč) volá přidruženou callback funkci vždy, když dojde ke změně stavu atributu readyState objektu XMLHttpRequest. V této funkci je testován stav a pokud odpověď dorazila v pořádku (http status 200), je možné přečíst odpověď.

function obsluha(xmlhttp) {
if (xmlhttp.readyState == 4) {
if(xmlhttp.status == 200) {
var odpoved =
xmlhttp.responseXML.getElementsByTagName(‚odpoved’);

Tab. XVIII: Zpracování odpovědi – kontrola stavu HTTP odpovědi

3.5.6 Aktualizace HTML DOM reprezentace

Objekt v DOM, který bude měněn musí být identifikován jednoznačným ID, pomocí kterého JavaScript rozpozná, kde v dokumentu má provést změny.


<div id=“co_zmenit_id“> Obsah, který bude přepsán </div>

Tab. XIX: Identifikace objektu, který bude měněn
Obsah tohoto objektu (to, co je uzavřené mezi těmito tagy) je potom přepsán doručenou odpovědí, případně chybovým hlášením (v případě http status rozdílného stavu 200).

document.getElementById(‚co_zmenit_id‘).innerHTML = odpoved;

Tab. XX: Funkce měnící obsah specifikovaného objektu