Mendelova univerzita v Brně Provozně ekonomická fakulta
Webový návrhář uživatelských tiskových sestav v jazyce Java Diplomová práce
Vedoucí práce: Ing. Petr Jedlička, Ph.D
Petr Gola
Brno 2012
Rád bych touto cestou poděkoval Ing. Petru Jedličkovi, Ph.D. za veškerou trpělivost, projevenou důvěru, rady a připomínky, které mi poskytl při zpracování diplomové práce.
Prohlašuji, že jsem tuto diplomovou práci včetně vyvíjeného nástroje, který je její neoddělitelnou součástí, zpracoval samostatně s použitím uvedené literatury a pod odborným vedením Ing. Petra Jedličky, Ph.D.
V Brně 22. dubna 2012
................................................................
4
Abstract Gola, P. Web based report designer in Java language. Diploma thesis. Brno, 2012 This thesis deals with the facilitating of the creation of user reports in web applications built on the Java platform. Suitable solution for web browsers is designed based on the analysis and comparison of existing desktop designers and their functions. The focus is put on the requirement to use only standard web browser without installing additional tools or plugins. The goal is to create a comfortable web based user interface for designing reports on the Java platform.
Abstrakt Gola, P. Webový návrhář uživatelských tiskových sestav v jazyce Java. Diplomová práce. Brno, 2012 Tato práce se zabývá usnadněním tvorby tiskových sestav ve webových aplikacích postavených na platformě Java. Na základě analýzy a srovnání již existujících desktopových návrhářů a jejich funkcí je navrženo vhodné řešení pro webové prohlížeče. Důraz je kladen na to, aby uživateli stačil běžný webový prohlížeč bez nutnosti instalace dodatečných nástrojů nebo pluginů. Cílem práce je vytvoření komfortního webového uživatelského rozhraní pro návrh tiskových sestav na platformě Java.
5
OBSAH
Obsah 1 Úvod
7
2 Cíl a metodika práce 9 2.1 Cíl práce . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9 2.2 Metodika práce . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10 3 Požadavky na návrh tiskových sestav 3.1 Funkce pro tvorbu výstupů (server) . . 3.1.1 Výběr dat . . . . . . . . . . . . 3.1.2 Zpracování dat . . . . . . . . . 3.1.3 Prezentace dat . . . . . . . . . 3.2 Funkce uživatelského rozhraní (klient)
. . . . .
11 11 11 12 12 14
. . . .
16 16 17 19 22
5 Návrh řešení 5.1 Výběr reportovacího nástroje . . . . . . . . . . . . . . . . . . . . . . 5.2 Výběr webových technologií . . . . . . . . . . . . . . . . . . . . . . . 5.3 Přidání webového návrháře do reálných aplikací . . . . . . . . . . . .
23 23 24 26
6 Implementace 6.1 Nástroje pro implementaci . . . . . . . . . . . . . . . . . . . . . . 6.1.1 Vývojové prostředí NetBeans . . . . . . . . . . . . . . . . 6.1.2 Definice projektu pomocí Maven . . . . . . . . . . . . . . 6.2 Implementace uživatelského rozhraní . . . . . . . . . . . . . . . . 6.2.1 Webová technologie GWT . . . . . . . . . . . . . . . . . . 6.2.2 Webové komponenty Sencha GXT . . . . . . . . . . . . . 6.2.3 Základní rozložení uživatelského rozhraní . . . . . . . . . . 6.2.4 Navigátor . . . . . . . . . . . . . . . . . . . . . . . . . . . 6.2.5 Plátno – sekce . . . . . . . . . . . . . . . . . . . . . . . . 6.2.6 Plátno – elementy . . . . . . . . . . . . . . . . . . . . . . 6.2.7 Paleta . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6.2.8 Inspektor . . . . . . . . . . . . . . . . . . . . . . . . . . . 6.2.9 Konzole . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6.2.10 Výběr dat . . . . . . . . . . . . . . . . . . . . . . . . . . . 6.3 Správa šablon . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6.4 Integrace JasperReports . . . . . . . . . . . . . . . . . . . . . . . 6.4.1 Transformace modelu do formátu tiskové šablony (a zpět)
28 28 28 28 30 30 33 34 35 36 38 40 43 45 45 46 48 48
4 Srovnání dostupných nástrojů 4.1 Eclipse BIRT . . . . . . . . . 4.2 JasperReports . . . . . . . . . 4.3 Pentaho Reporting . . . . . . 4.4 Přehled vlastností generátorů
. . . .
. . . .
. . . .
. . . .
. . . .
. . . . . . . . .
. . . . . . . . .
. . . . . . . . .
. . . . . . . . .
. . . . . . . . .
. . . . . . . . .
. . . . . . . . .
. . . . . . . . .
. . . . . . . . .
. . . . . . . . .
. . . . . . . . .
. . . . . . . . .
. . . . . . . . .
. . . . . . . . .
. . . . . . . . .
. . . . . . . . .
. . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . .
6
OBSAH
6.4.2
Generování tiskové sestavy . . . . . . . . . . . . . . . . . . . . 52
7 Diskuze
56
8 Závěr
58
9 Reference
60
Přílohy
61
A Elektronická příloha
62
B Náhledy aplikace
63
1 ÚVOD
1
7
Úvod
Dnešní informační systémy zpracovávají ohromná množství dat. Tato data jsou již téměř bez výjimky zpracovávána počítačově, protože jiné formy zpracování prakticky nejsou realizovatelné. Ovšem úlohou běžného informačního systému není jen nasbíraná data tiše zpracovávat, ale také je společně s průběžnými výsledky zpracování poskytovat ve vhodné formě zpět jeho uživatelům. Vhodná prezentace zpracovaných dat se může velmi lišit – na základě množství prezentovaných dat (od desítek až po miliardy jednotlivých údajů), jejich struktuře (různorodost, vzájemné vazby) a charakteru (texty, čísla, časové údaje). Pokud z informačního systému potřebujeme informaci o aktuálním celkovém počtu registrovaných čtenářů knihovny, pravděpodobně nám postačí jedno číslo bez zvláštních požadavků na jeho prezentaci. Pokud ale budeme chtít znát historii a průběh celkového počtu registrovaných čtenářů za posledních pět let v rámci celé České republiky, a to na celém území, po jednotlivých krajích i okresech, budeme potřebovat přinejmenším tabulku s vhodným seskupováním a součty po krajích a okresech, a v ideálním případě také graf. Přitom požadavky na výstupy rozsáhlých informačních systémů mohou být ještě obsáhlejší. Důležité je také nezapomenout, že výslednou prezentaci sice připravuje počítač, ale číst ji bude člověk – je tedy nutné ji tomu přizpůsobit. Osvědčilo se jednotlivé oddíly vhodně rozlišit (barvou, písmem), větší množství dat vhodně rozdělit (stránkovat) a případně využít grafy pro snadnější a rychlejší orientaci. Tyto pokročilejší výstupy jsou obecně označovány jako tiskové sestavy“ ” – zejména z historických důvodů, kdy byly především tištěny na papír. Jelikož se požadavky na tyto výstupy mohou neustále měnit a často není možné je dopředu odhadnout, pokročilé informační systémy obsahují nejen předem připravené konkrétní tiskové sestavy (připravené dodavatelem informačního systému), ale také možnost tvořit sestavy nové, uživatelem definované. Nástroj, který slouží právě k přípravě vlastních tiskových sestav, je označován jako návrhář tiskových sestav“. Uživatel rozsáhlého informačního systému pak ” využívá tento nástroj pro svůj vlastní výběr dat a vlastní formu jejich prezentace. Tyto dvě funkce jsou pro uživatele klíčové. K výběru dat je možné využít například omezující podmínky nebo agregační funkce. Vlastní prezentace pak může být kombinací prostých seznamů, detailních tabulek, různých typů grafů a dalších forem prezentace (obrázky, čárové kódy). Moderní trend přesunu softwarových aplikací na web probíhá již dlouho a v posledních letech se týká i rozsáhlých informačních systémů. Podniky často spo-
1 ÚVOD
8
lečně s rozvojem outsourcingu přecházejí na nové informační systémy poskytované formou SAAS1 , zejména webové aplikace dostupné přes internet (uživateli pak stačí k úspěšnému používání pouze webový prohlížeč). Tyto informační systémy také využívají tiskových sestav a s narůstajícím počtem zákazníků je třeba nabídnout těm náročnějším odpovídající webový návrhář uživatelských tiskových sestav.
1
SAAS - z angl. Software as a service“ neboli software poskytovaný jako služba, obvykle za ” pravidelný měsíční nebo roční poplatek.
2 CÍL A METODIKA PRÁCE
2
9
Cíl a metodika práce
2.1
Cíl práce
Cílem této práce je usnadnění tvorby tiskových sestav běžnému uživateli ve webových aplikacích postavených na platformě Java. V současné době je nutné tiskové sestavy připravit předem programátorem, případně je uživatel nucen využít některý z existujících desktopových návrhářů, a to se sebou nese mnohé nevýhody. Uživatel musí desktopový nástroj dodatečně instalovat a tím se výrazně snižuje uživatelský komfort a nejvyšší výhoda jinak webové aplikace – její snadná přístupnost jen za pomocí webového prohlížeče a internetu. Následně je třeba nově vytvořené tiskové sestavy ručně nahrát zpět do webové aplikace, kde je teprve možno ověřit výsledek. Testování sestavy a její úpravy jsou pak zbytečně komplikované. Tyto problémy elegantně řeší vytvoření webového uživatelského rozhraní pro návrh vlastních tiskových sestav, které by bylo skutečnou náhradou jeho desktopové varianty. Je třeba, aby poskytovalo stejné i pokročilé funkce jako je určování přesných pozic všech objektů, volitelné opakování hlaviček, bohaté možnosti formátování textů, vlastní nastavení stránkování, vkládání obrázků, export do mnoha výstupních formátů apod. Požadavky na tyto funkce se neustále zvyšují, neustále se objevují nové formáty a jejich verze, proto je vhodné využít pro vlastní generování výstupu již některý z existujících a stále se vyvíjejících generátorů“ a zaměřit se především ” na vytvoření webového uživatelského rozhraní. Vzhledem k tomu, že s novým rozhraním bude pracovat také běžný uživatel, nikoliv programátor, je třeba, aby bylo dostatečně komfortní. Právě vytvoření komfortního a přitom webového rozhraní je zde skutečnou výzvou. Většina současných webových uživatelských rozhraní (nejen v oblasti různých návrhářů) zdaleka nedosahuje možností desktopových variant, zejména co se týče pokročilých funkcí jako je WYSIWYG2 včetně rychlého ovládání myší jako je Drag&Drop nebo dynamická změny velikosti prvků. Cílem je tedy vytvoření komfortního webového uživatelského rozhraní a jeho napojení na některý z již existujících generátorů tiskových sestav.
2
Způsob práce s dokumentem, při kterém uživatel přímo vidí jak bude vypadat výsledek. Zkratka vychází z anglické věty What you see is what you get“. ”
2 CÍL A METODIKA PRÁCE
2.2
10
Metodika práce
Prvníkm krokem k dosažení cíle této práce bude upřesnění obecných požadavků na návrh tiskových sestav – pokročilé funkce pro tvorbu výstupů na straně serveru (inteligentní stránkování, exporty do formátů HTML, PDF, Microsoft Word, apod.) a nároky na přívětivé uživatelské rozhraní (WYSIWYG, Drag&Drop a další) na straně klienta. Po výběru vhodných funkcí budou srovnány aktuálně dostupné generátory tiskových sestav na platformě Java (Eclipse BIRT, Jasper Reports, Pentaho Reporting) dle jejich funkcí pro tvorbu výstupů a dle možností napojení do nového uživatelského rozhraní. Následně bude navrženo vhodné řešení celého webové návrháře. Nejprve bude vybrán nejlépe vyhovující generátor s ohledem na poskytované funkce a možnosti integrace – podstatnou součástí návrhu je způsob napojení na vybraný reportovací nástroj. Dále je klíčový výběr vhodného webového frameworku na platformě Java, který umožní tvorbu vysoce komfortního uživatelského rozhraní. Výsledný webový návrhář musí být možno integrovat do skutečných aplikací. Poslední částí návrhu je tedy způsob propojení s reálnou aplikací. Na základě existujícího návrhu je webový návrhář implementován. Důraz je kladen na to, aby jeho uživateli stačil běžný webový prohlížeč bez nutnosti instalace dodatečných nástrojů nebo tzv. pluginů“. ” V závěru práce budou zhodnoceny dosažené výsledky a webový návrhář bude srovnán s existující desktopovou variantou.
3 POŽADAVKY NA NÁVRH TISKOVÝCH SESTAV
3
11
Požadavky na návrh tiskových sestav
Nejprve je třeba upřesnit obecné požadavky na uživatelský návrh tiskových sestav, které bude navržené řešení zahrnovat. Vlastní tvorba tiskových výstupů bude realizována za pomocí vybraného generátoru tiskových sestav, který poběží na straně serveru. Funkce uživatelského rozhraní musí být obsaženy na straně klienta přímo ve webovém prohlížeči. Jejich úkolem je zajistit dostatečný komfort při vytváření a úpravách tiskových sestav. Požadavky na tyto funkce jsou klíčovým podkladem pro výběr vhodného webového frameworku, který nebude sloužit jen k prezentaci informací jak je na internetu běžné, ale také k dynamické manipulaci s objekty na stránce (pro zajištění vlastnosti WYSIWYG).
3.1
Funkce pro tvorbu výstupů (server)
Nejprve se zaměřme na tvorbu konkrétních výstupů, která obvykle probíhá na serveru na základě existující tiskové šablony. Tisková šablona je předpis, podle kterého je společně s konkrétními daty možno vytvořit konkrétní tiskovou sestavu. Tvorbu tiskové sestavy je možno vyjádřit tímto jednoduchým vzorcem: Tisková šablona + Data => Tisková sestava V běžném informačním systému plní tiskové sestavy především funkce výběru, zpracování a následné prezentace dat. Tyto tři oblasti jsou zásadní a každý reportovací nástroj nabízí různou úroveň funkcí pro každou z nich. Některé nástroje ještě oddělují část funkce prezentace dat jako transformaci dat (například prosté číslo můžeme transformovat do výsledného formátu dle národních zvyklostí). 3.1.1
Výběr dat
Funkce pro výběr dat obvykle obsahují způsob získání dat. Většinou se jedná o čtení dat z databáze pomocí přímého spojení (JDBC), ze souboru (CSV, XML, TXT), případně napojení vlastního datového zdroje pomocí definovaného rozhraní. Někdy je možné data poskytovat i z více zdrojů najednou. Tato data je většinou možno určit výběrovým dotazem (SQL, XPath), případně je dodatečně omezit různými podmínkami nebo je dále seskupovat dle daných kritérií. Často je možné do šablony vložit i tzv. parametry, které mohou být vkládány aplikací automaticky nebo jako
3 POŽADAVKY NA NÁVRH TISKOVÝCH SESTAV
12
uživatelský vstup (např. datum pro generování tiskové sestavy statistiky dopravních přestupků vybraného dne na území České republiky, nebo příjmení vybraného zaměstnance pro generování jeho docházky za poslední měsíc). 3.1.2
Zpracování dat
Funkce pro zpracování dat umožňují zejména použití agregačních funkcí (součty, celkové počty, průměry, minima, maxima, atd.). Někdy je dostupné i pokročilé zpracování jednotlivých údajů pomocí tvorby vlastních funkcí, zejména využitím jazyka Java nebo JavaScript (funkce pro práci s řetězci, čísly, apod.). Pokročilé nástroje umožňují i průběžné vlastní výpočty během sestavování reportu, které jsou udržované v uživatelských proměnných. Jejich hodnoty je pak možno v tiskové sestavě využít stejně jako vybraná data. 3.1.3
Prezentace dat
Funkce pro prezentaci dat je možno rozdělit na textové a grafické. Textové funkce prezentace jsou zejména různé druhy výpisu textu, seznamy a tabulky (včetně pokročilých tabulek s více úrovněmi a mezisoučty nebo křížové tabulky). Pro grafickou prezentaci se využívají především grafy různých typů (lineární, sloupcové, koláčové, bublinové), dekorace (oddělující čáry, obdélníky, elipsy) a obrázky. Někdy je umožněno i vkládání čárových kódů nebo dokonce map. Tisková sestava se obvykle skládá ze sekcí, které se v závislosti na typu mohou opakovat. Sekce jsou vzájemně oddělené oblasti s definovanou velikostí (výškou) a logickým významem. Šířka je definovaná velikostí výstupního formátu (papíru). Na základě typu sekce může být sekce povinná (detail) nebo volitelná (patička stránky). Sekce se vypisují a opakují automaticky na základě zvolené velikosti výstupu a množství prezentovaných dat (např. na každé nové stránce je nejprve vytisknuta sekce hlavička stránky“). Obsahem jednotlivých sekcí jsou pak objekty ” sloužící pro vlastní prezentaci dat, dále označované jako elementy. Základní sekce tiskové sestavy jsou: • titulek (hlavička sestavy), • hlavička stránky, • hlavička tabulky, • hlavička skupiny,
3 POŽADAVKY NA NÁVRH TISKOVÝCH SESTAV
13
• detail (obvykle řádek výpisu dat), • patička skupiny, • patička tabulky, • patička stránky, • shrnutí (patička sestavy). Někdy je možno do tiskové sestavy vkládat i vlastní sekce v libovolném množství, které se vypisují dle vlastních podmínek – např. pro seskupování v tabulkách se používají tzv. skupinové sekce. Sekce obsahují elementy zajišťující vlastní prezentaci dat. Prezentovaný obsah každého elementu může být předem daný (statický, jako součást šablony) nebo vkládaný do šablony automaticky až v době generování tiskové sestavy (dynamický, vkládaný z vybraných dat). Základní elementy tiskové sestavy, které v nějaké formě obsahují všechny plnohodnotné reportovací nástroje, jsou: • textové pole, • statický text, • čára, • obdélník, • obrázek. Do funkcí pro prezentaci dat zařadíme i vlastní formu celého generovaného výstupu, tzv. výstupní formáty. Moderní generátory podporují mnoho výstupních formátů, do kterých je výsledek uložen. Některé formáty jsou vhodnější pro finální prezentaci, jiné pro další zpracování: • PDF, PPT, HTML, XHTML, RTF, DOC, DOCX, ODT (formáty vhodné pro prezentaci), • XML, XLS, XLSX, CSV, TXT (formáty vhodné pro zpracování).
3 POŽADAVKY NA NÁVRH TISKOVÝCH SESTAV
3.2
14
Funkce uživatelského rozhraní (klient)
Uživatelské rozhraní by mělo umožňovat snadnou a rychlou tvorbu nových šablon tiskových sestav stejně jako jejich následné úpravy. Dnešní vysoké nároky uživatelů již není možné uspokojit ručním psaním složitých kódů šablon (například v nějakém jazyku podobném HTML). Uživatelské rozhraní musí co v nejvyšší míře splňovat vlastnosti WYSIWYG, tedy „co vidíš, to dostaneš“. Uživatel očekává, že již během přípravy šablony bude vidět, jak bude vypadat výsledná tisková sestava. Pokud se rozhlédneme v nějakém existujícím desktopovém návrháři, pravděpodobně narazíme na několik zásadních částí uživatelského rozhraní, které umožňují efektivní práci s elementy a sekcemi. Tyto části je potřeba realizovat také v novém webovém uživatelském rozhraní. Navigátor umožňuje zobrazení stromové struktury a obsahu celého reportu. Je možné snadno vybrat požadovanou sekci nebo element pro další úpravu, či odstranění. Při jakékoliv editaci je vždy vybrán konkrétní objekt v navigátoru. Uživatel se tak lépe orientuje a snadněji vybírá objekty pro požadované úpravy. Plátno slouží k vlastnímu návrhu grafické podoby tiskové sestavy. Uživatel do něj vkládá sekce a jednotlivé elementy. Nastavuje pozice a velikosti jednotlivých objektů. Toto vše je třeba zprostředkovat s možností rychlých úprav myší – především Drag&Drop, změna pozice, změna velikosti. Důležité je také přehledné označení vybraného prvku přímo na plátně (např. barevným orámováním). Jelikož je na plátně obvykle mnoho objektů, je vhodné, aby bylo možné dočasně schovávat vybrané sekce. Inspektor umožňuje detailní zobrazení parametrů vybrané sekce nebo jednotlivého elementu včetně možnosti rychlých úprav. Pokud uživatel potřebuje nastavit konkrétní pozici nebo velikost sekce či elementu, označí jej a pomocí tohoto nástroje nastaví přesné hodnoty. Slouží také k nastavení pokročilých parametrů, které není možno zadat přímo na plátně. Paleta slouží k rychlému vkládání nových objektů na plátno. Umožňuje vkládání uživatelských sekcí nebo elementů (textových položek, obrázků, dekorací, grafů...). Mimo nástroje určené přímo pro práci s elementy a sekcemi jsou k dispozici i další funkce zprostředkované uživatelským rozhraním, bez kterých si není možné tvorbu tiskových sestav představit. Správa šablon slouží pro jejich uložení do souboru, načtení ze souboru, případně vytvoření zcela nové šablony. Některé nástroje obsahují i průvodce pro
3 POŽADAVKY NA NÁVRH TISKOVÝCH SESTAV
15
tvorbu šablony nebo připravené šablony pro rychlé seznámení s nástrojem. Výběr dat umožňuje určení datového zdroje (JDBC, XML, CSV, ...) a výběrového dotazu (např. SQL, XPath). Dále obsahuje nastavení parametrů, polí a proměnných. Generování tiskové sestavy je možné ještě ovlivnit výběrem výstupního formátu a následně sledovat za pomocí konzole, do které je vypisován průběh a případné chyby. Vytvoření těchto ovládacích prvků a nástrojů není ve webové aplikaci zdaleka jednoduché. Původní technologie pro webové stránky s takto dynamickými prvky nepočítaly – soustředily se na vlastní prezentaci dat a jejich vzájemné provázání pomocí odkazů. Dynamická práce s objekty na webové stránce je za rozumného úsilí možná až s moderními technologiemi. Díky nim je dnes již možné takové rozhraní vytvořit, nicméně podobných webových aplikací existuje stále poměrně málo.
4 SROVNÁNÍ DOSTUPNÝCH NÁSTROJŮ
4
16
Srovnání dostupných nástrojů
Mezi nejrozšířenější nástroje pro tvorbu výstupů na platformě Java můžeme jistě zařadit Eclipse BIRT, JasperReports a Pentaho Reporting (dříve JFreeReport). Tyto reportovací nástroje umožňují většinu ze zmíněných funkcí. Obsahují také mnoho dalších funkcí navíc. Všechny mají svůj vlastní oddělený generátor pro tiskové sestavy a také svůj desktopový návrhář. Pro náš nový webový návrhář potřebujeme vybrat zejména vhodný generátor, proto se při srovnávání zaměříme hlavně na kvalitu a funkce pro samotnou tvorbu výstupů. Existující desktopoví návrháři nám poslouží jen k rychlé orientaci a seznámení se s funkcemi konkrétního nástroje. Cílem srovnání je získat podklady pro vyběr nejvhodnějšího generátoru, který později napojíme na naše webové rozhraní.
4.1
Eclipse BIRT
Eclipse BIRT, neboli Business Intelligence and Reporting Tools“ je open source ” reportovací nástroj pro tvorbu tiskových sestav postavený na platformě Eclipse. Přesněji řečeno, desktopový návrhář je realizován pomocí Eclipse platformy, zatímco běhové prostředí pro generování reportů je možno provozovat i samostatně. Je možné jej do aplikace přidat jako samostatné knihovny, což je důležité pro nasazení na produkčních aplikačních serverech. Tento nástroj je Java vývojářům k dispozici již semd let, první verze vyšla 6. června 20053 . Vývoj nástroje je plně v rukou Eclipse Foundation, open source komunity, která se o tento produkt od počátku stará. Výběr dat je zprostředkován pomocí datových zdrojů, které je možno připojit ve formě JDBC spojení, Web Service nebo XML. Je možno využít také uživatelských proměnných, skriptů a výrazů, které je třeba psát v JavaScriptu. Nástroj pro definici jednotlivých oblastí reportu nevyužívá sekcí a je v tomto směru odlišný od ostatních. Rozložení prvků na tiskové sestavě je definováno pomocí speciálních elementů, které je možné do sebe opakovaně vkládat (jsou označovány jako kontejnery). Můžeme je tedy považovat za obdobu sekcí (např. tabulky mají také hlavičku a patičku). Tento systém pravděpodobně umožňuje bohatší možnosti tvorby výsledného vzhledu reportu, ale pro uživatele začátečníka je to poněkud 3
BIRT Project Plan Archive. THE ECLIPSE FOUNDATION. Eclipsepedia [online]. [2010] [cit. 2012-05-23]. Dostupné z: http://wiki.eclipse.org/BIRT_Project_Plan_Archive
4 SROVNÁNÍ DOSTUPNÝCH NÁSTROJŮ
17
nepřehledné. Mezi tyto speciální elementy (sekce) patří tabulky, mřížky (tj. tabulka bez hlavičky a patičky) a seznamy. Pro vlastní prezentaci dat je pak možné využít další již atomické elementy: • statické texty (popisky a texty), • textová pole (data a dynamické texty), • obrázky, • grafy (sloupcové, koláčové, spojnicové, plošné, bublinové, gantt). Pro vkládání krátkého neformátovaného statického textu slouží popisky“, naproti ” tomu pro dlouhý formátovaný text je nutno použít element text“. Obdobně pro ” texty získávané z datového zdroje jsou k dispozici elementy data“ (krátký nefor” mátovaný text) a dynamické texty“ (dlouhý formátovaný text). Pro obyčejného ” uživatele může být toto rozdělení příliš komplikované. Další možnosti nastavení elementů (pozice, velikost, okraje) a jejich formátování (barvy, fonty, zarovnání, ohraničení) jsou velmi bohaté. Šablony jsou ukládány ve formátu XML. Nicméně vzhledem k bohatým možnostem struktury reportu je výsledné XML poměrně složité. Jako výstupní formát je možno vybrat PDF, DOC, ODT, HTML, PostScript, ODP, ODS a XLS. Celkově působí Eclipse BIRT jako vysoce specializovaná aplikace, ovšem určená spíše pro pokročilého uživatele. Pravděpodobně je obvykle využívána přímo programátory pro návrh reportů v době vývoje cílové aplikace. Nástroj toho umožňuje velmi mnoho. Mimo jiné je možné do něj dopisovat vlastní funkce. Jeho ovládání ale není jednoduché. Náhled na desktopový návrhář BIRT je součástí přílohy jako Obrázek č. 2.
4.2
JasperReports
JasperReports je open source reportovací knihovna, za kterou stojí komerční společnost Jaspersoft. Jedná se o samostatný generátor pro tiskové sestavy. K dispozici je nicméně také desktopový návrhář. Ten je spravován jako samostatný projekt s názvem iReport. iReport běží na platformě Netbeans (konkurenční platforma Eclipse, kterou využívá dříve zmíněný Eclipse BIRT). Společnost Jaspersoft nabízí mnohé další produkty většinou zaměřené na Business Intelligence. Vybrané produkty nabízí jako open source a jejich další vývoj
4 SROVNÁNÍ DOSTUPNÝCH NÁSTROJŮ
18
řídí pomocí jí přímo podporované komunity JasperForge. Nástroj je k dispozici již od roku 2001 (ve verzi 0.15), verze 1.0 vyšla 20. července 20054 . Pro snadný výběr dat je podporováno neobvyklé množství různých datových zdrojů – JDBC, XML (lokální soubor i vzdálené ve formě URL), CSV, Hibernate, EJBQL XLS, JSON a další. Také je možno použít vlastní datový zdroj implementující předchystané rozhraní JRDataSource. Získaná data je možno dále doplnit a zpracovat za pomocí uživatelských parametrů a proměnných, které mohou obsahovat libovolný výpočetní výraz (v jazyce Java). Nástroj podporuje mnoho typů sekcí (titulek, hlavička stránky, hlavička tabulky, hlavička skupiny, detail, patička skupiny, patička tabulky, patička stránky, shrnutí a pozadí). Také umožňuje použít volitelné sekce žádná data“ (použije se ” v případě, že nejsou k dispozici žádná data) a patička poslední stránky. Navíc je možné přidávat libovolný počet vlastních skupin, které mají opět svoji hlavičku a patičku. Navíc je pro ně třeba specifikovat výraz, který určuje skupinu (pokud se při vyhodnocování hodnota výrazu změní, je do tiskové šablony vloženo nové opakování skupiny). Pokud by pro některé případy ani toto nebylo dostatečné, je možno vkládat jednotlivé reporty do sebe. Ze základních elementů jsou k dispozici: • statické texty, • textová pole, • dekorace (obdélníky, elipsy, čáry), • obrázky, • grafy (sloupcové, koláčové, spojnicové, plošné, bublinové), • čárové kódy, • tabulky, seznamy a vložené reporty. Mimo tyto základní elementy je v nabídce mnoho dalších pokročilých elementů jako vložení čistého HTML, Google mapy nebo křížové tabulky. Jako výstupní formát je možné zvolit opravdu z mnoha možností. Podporováno je PDF, HTML, XHTML, ODS, DOC, DOCX, ODT, RTF, PPTX, XLS, XLSX, XML, TXT, CSV. 4
All releases of JasperReports. JASPERSOFT. Freecode [online]. [2011] [cit. 2012-05-23]. Dostupné z: http://freecode.com/projects/jasperreports/releases
4 SROVNÁNÍ DOSTUPNÝCH NÁSTROJŮ
19
Šablony jsou ukládány ve formátu XML, který je na pohled velice příjemný a přehledný. JasperReports poskytuje nejen velmi mnoho funkcí ve všech třech oblastech (výběr, zpracování a prezentace dat), ale zachovává si přitom elegantní přímočarost a jednoduchost všech definicí. Náhled na desktopový návrhář iReport je součástí přílohy jako Obrázek č. 3.
4.3
Pentaho Reporting
Pentaho Reporting je open source nástroj pro tisk sestav, který tvoří především knihovna pro vlastní generování tiskových sestav. Jsou ale k dispozici i další části jako je desktopový návrhář nebo průvodci pro rychlou tvorbu nových tiskových sestav. Za tímto nástrojem stojí komerční společnost Pentaho Corporation. Desktopový návrhář je postaven na vlastní platformě (tedy nejedná se ani o jednu ze soupeřících platforem – Eclipse vs. Netbeans). Pentaho Reporting je součástí Pentaho BI Suite, což je rozsáhlá sada vzájemně integrovatelných nástrojů pro zpracování dat a Business Intelligence: • Pentaho Data Integration – nástroje pro integraci zpracování a transformace dat, • Pentaho Analysis Service – OLAP server s podporou MDX dotazovacího jazyka, • Pentaho Reporting – nástroj pro tvorbu tiskových sestav, • Pentaho Data Mining – nástroje pro strojové účení a data mining5 , • Pentaho DashBoard – dashboard uživatelské rozhraní, • Pentaho for Apache Hadoop – podpora pro distribuované zpracování dat. Nástroj je vyvíjen od roku 2002 pod názvem JFreeReport, od roku 2005 je součástí Pentaho BI Suite6 . 5
Vytěžování dat“. Metody sloužící k získávání užitečných informací z rozsáhlých dat All releases of JFreeReport. PENTAHO CORPORATION. Freecode [online]. [2003] [cit. 201205-23]. Dostupné z: http://freecode.com/projects/jfreereport/releases 6”
4 SROVNÁNÍ DOSTUPNÝCH NÁSTROJŮ
20
Zajímavostí je využití tohoto nástroje ve známém open source kancelářském balíku OpenOffice.org, kde je od roku 2007 využíván v aplikaci Base7 . Umožňuje tvorbu vlastních tiskových sestav nad uživatelskou databází v této aplikaci. Data jsou získávána z datového zdroje OLAP. Výběr dat je umožněn jak přes speciální rozhraní Pentaho integrující celé Pentaho BI Suite, tak přes standardní datové zdroje jako je JDBC, OLAP nebo XML. Pro vlastní sestavení dotazu je pak možné použít SQL, MDX nebo XPath. Další zpracování dat je umožněno pomocí funkcí a parametrů. Generátor podporuje jen základní tiskové sekce (hlavička stránky, hlavička reportu, detail, patička reportu, patička stránky a pozadí), ale je k dispozici libovolné množství skupin, u kterých uživatel může opět definovat hlavičku, detail a patičku. Do jednotlivých sekcí je možno vkládat: • textová pole (řetězec, číslo, datum), • popisky (statický text), • obrázky, • dekorace (obdélník, elipsa, čára), • grafy (sloupcové, koláčové, spojnicové, plošné, bublinové), • čárové kódy, • vložené tiskové sestavy. U textových elementů je nutné předem určit jejich datový typ, což není pohodlné. Možnosti nastavení a formátování jednotlivých elementů jsou standardní (pozice, velikost, barvy, fonty, zarovnání). Šablony jsou ukládány ve speciálním formátu PRPT, který je ve skutečnosti ZIP archivem obsahujícím jednotlivé definice reportu jako XML soubory (oblasti, styly, překlady) a další přílohy jako soubory v přirozených formátech (např. obrázky). Podporovány jsou výstupní formáty PDF, HTML, XLS, RTF a CSV. Pentaho Reporting nabízí mnoho funkcí, ale mírně pokulhává v jednoduchosti definice tiskové sestavy, která není výhodná pro snadnou integraci. Znesnadňuje 7
Pentaho Adds Reporting Solution to OpenOffice.org. PENTAHO CORPORATION. Pentaho [online]. 2007 [cit. 2012-05-23]. Dostupné z: http://www.pentaho.com/pressroom/releases/20070419_pentaho_adds_reporting_solution_to_openoffice
4 SROVNÁNÍ DOSTUPNÝCH NÁSTROJŮ
21
ji zejména nutnost určovat předem datový typ textových elementů nebo speciální formát pro ukládání šablon (rozdrobené definicemi v mnoha souborech zabalených do společného ZIP archivu). Náhled na desktopový návrhář Pentaho Reporting je součástí přílohy jako Obrázek č. 4.
22
4 SROVNÁNÍ DOSTUPNÝCH NÁSTROJŮ
4.4
Přehled vlastností generátorů
V Tabulce č. 1 – Srovnání reportovacích nástrojů je stručný přehled srovnávaných generátorů tiskových sestav, dle délky jejich vývoje, možností výběru dat (datové zdroje), dostupných sekcí a elementů, podporovaných výstupních formátů a také formátu pro ukládání vlastní tiskové šablony. Tabulka č. 1 – Srovnání reportovacích nástrojů Eclipse BIRT
JasperReports
Pentaho Reporting
Verze 1.0
6. 6. 2005
20. 7. 2005 (verze 0.1 v roce 2001)
Neznámé (verze 0.7 v roce 2002)
Datové zdroje
JDBC, WS, XML
JDBC, XML, Hibernate, EJBQL, XLS, JSON, CSV
Pentaho, JDBC, OLAP, XML
Sekce
Tabulka, mřížka, seznam, možnost vkládat elementy opakovaně do sebe
Sestava, stránka, skupina, detail, pozadí, tabulka, seznam, křížová tabulka
Sestava, stránka, skupina, detail, pozadí
Elementy
Statický text (2x), textové pole (2x), obrázek, graf
Statický text, textové pole, dekorace, obrázek, graf, čárový kód, HTML kód, Google mapa
Statický text, textové pole, dekorace, obrázek, graf, čárový kód
Výstupy
PDF, PS, HTML, DOC, ODT, ODP, ODS, XLS
PDF, HTML, XHTML, ODS, DOC, DOCX, ODT, RTF, PPTX, XLS, XLSX, XML, TXT, CSV
PDF, HTML, XLS, RTF, CSV
Šablona
XML (komplikovaná struktura)
XML (jednoduchá struktura)
PRPT (ZIP obsahující XML a další soubory)
Náhledy jednotlivých desktopových návrhářů, které využívají tyto generátory jsou součástí příloh (Obrázek č. 2–4).
5 NÁVRH ŘEŠENÍ
5
23
Návrh řešení
Před vlastní implementací je třeba vypracovat návrh řešení, který odpoví na většinu otázek od výběru a způsobu napojení reportovacího nástroje až po výběr vhodných webových technologií pro vlastní realizaci webového návrháře. Je třeba také zpracovat způsob používání vytvořeného webového návrháře v reálných webových aplikacích, které mohou být v různých technologiích. Cílem této práce je vypracování webového návrháře v jazyce Java, proto bude aplikace realizována na platformě Java EE 6. Aplikaci pak bude možné provozovat v libovolném JEE kontejneru – od nejjednodušších jako je Apache Tomcat až po vyspělé aplikační servery jako je Oracle GlassFish Server. Při návrhu aplikace je také nutné myslet na rozdílné licence jednotlivých částí a snažit se o to, aby byl výsledek co nejsnadněji použitelný v reálné aplikaci.
5.1
Výběr reportovacího nástroje
Výběr reportovacího nástroje je důležitým úkolem a podstatnou částí návrhu. Výsledky srovnání jednotlivých nástrojů jsou velmi těsné a všechny splňují vybrané funkce pro tvorbu výstupů, které byly definovány jako požadavky na návrh tiskových sestav (generování sestavy na straně serveru). Historie všech těchto nástrojů sahá v průměru 10 let zpět. JasperReports má za sebou dokonce dvanáctiletou historii. Nicméně dlouhá historie nemusí být zárukou kvality. Všechny nástroje podporují nejdůležitější datové zdroje pro připojení k databázi (na platformě Java k tomu slouží technologie JDBC) a poskytují i jednoduché napojení na datový zdroj ve formě XML, který může dnes s trochou snahy nabídnout téměř jakákoliv aplikace. Eclipse BIRT navíc poskytuje napojení na moderní webové služby. JasperReports nabízí navíc Hibernate, EJBQL, XLS, CSV a JSON. Toto kritérium o vítězi také nerozhodne. Co se týče možností definice oblastí tiskových sestav (sekcí) a vkládaných elementů, všechny nástroje poskytují základní prvky pro prezentaci textů, obrázků a grafů. Nicméně jsou zde již rozdíly v náročnosti používání jednotlivých prvků a výsledné složitosti definice ukládané tiskové sestavy. z této oblasti vychází nejlépe JasperReports, který nabízí nejen nejširší paletu použitelných elementů, ale také nejsnadnější definici celé tiskové sestavy včetně sekcí a elementů. Podpora výstupních formátů je pro koncového uživatele jistě důležitá, zejména pokud plánuje s výstupy ještě nějak dále pracovat. Pro prezentaci dat
5 NÁVRH ŘEŠENÍ
24
je nejvhodnější formát PDF. Pokud uživatel potřebuje ve výstupu před prezentací provést ještě nějaké úpravy, vhodnými formáty jsou HTML, XHTML, ODS, DOC, DOCX, ODT, RTF, PPTX, XLS nebo XLSX. V případě, že je třeba výstupy dále počítačově zpracovávat, je výhodné mít možnost exportu také do formátů XML, CSV nebo TXT. JasperReports nabízí všechny tyto formáty a dle tohoto kritéria je jasným vítězem. Komunikace mezi novým uživatelským rozhraním a vlastním tiskovým generátorem bude založena na vytvoření modelu tiskové šablony a následném převodu do nativního formátu tiskové šablony vybraného tiskového generátoru. Pro generování tiskových sestav pak bude do generátoru vložena tisková šablona ve zdrojovém formátu, určen datový zdroj a případné parametry a zvolen výstupní formát. Všechny zmíněné nástroje ukládají svoje šablony do XML, které se ale liší svojí komplikovaností, případně rozdělením do více souborů. Nejlépe se jeví JasperReports s jedním jasně strukturovaným a přehledným XML pro definici jedné šablony, což je velmi výhodné pro snadnou integraci s uživatelským rozhraním. Na základě předchozího zhodnocení dle podstatných kritérií je pro integraci do webového návrháře nejvhodnější tiskový generátor JasperReports. Poskytuje nejširší možnosti téměř ve všech oblastech, mnoho výstupních formátů (ty na rozdíl od jiných oblastí není možno kvalitním uživatelským rozhraním nijak kompenzovat) a jednoduchou definici šablony v souboru XML. JasperReports je dostupný pod licencí LGPL8 , takže je možné jej bez obav použít. Tato licence umožňuje použít tuto knihovnu i v uzavřené komerční aplikaci, která tedy nemusí být open source. Společnost Jaspersoft nabízí k tomuto produktu také placenou podporu, literaturu a semináře. Tento nástroj se bude s vysokou pravděpodobností dále rozvíjet, z čehož může webový návrhář v budoucnu čerpat další výhody.
5.2
Výběr webových technologií
Aby bylo možné uspokojit všechny požadavky na funkce uživatelského rozhraní, je nutné zvolit správné webové technologie. Na platformě Java EE je jich dnes nepře8
JasperReports Homepage. JASPERSOFT. JasperForge.org [online]. [2012] [cit. 2012-05-23]. Dostupné z: http://jasperforge.org/projects/jasperreports
5 NÁVRH ŘEŠENÍ
25
berné množství9 , které se liší nejen kvalitou a funkcemi, ale i cílovým zaměřením (od jednoduché prezentace dat až po bohaté uživatelské rozhraní). Má-li být vyhověno všem požadavkům bohatého a moderního uživatelského rozhraní, které odpovídá návrháři tiskových sestav, je třeba vybrat moderní webový framework s významnou podporu AJAX a mnoha pokročilými komponentami a funkcemi. Těmto požadavkům velmi dobře vyhovuje Google Web Toolkit (GWT). GWT je moderní nástroj pro psaní webových aplikací na platformě Java. Umožňuje psát uživatelské rozhraní přímo v jazyce Java, který je pro potřeby webových prohlížečů automaticky převáděn do JavaScriptu. Tento převod je vysoce optimalizovaný (pro každý prohlížeč se sestavuje samostatná aplikace) a umožňuje dosáhnout vysokého výkonu a kompatibility s mnoha webovými prohlížeči bez nutnosti rozsáhlých znalostí o jednotlivých prohlížečích. Toto je zcela zásadní výhoda a jiné webové technologie ji nemohou nabídnout. Převod do JavaScriptu má ovšem i svá úskalí a je třeba na tuto vlastnost stále pamatovat. Jazyky Java a JavaScript nejsou zcela kompatibilní (silně typový vs. netypový jazyk), proto tato technologie může nabídnout průnik možností těchto jazyků. Výsledné uživatelské rozhraní odpovídá aplikaci v JavaScript založené plně na technologii AJAX a JavaScript manipulací s objektovým modelem HTML stránky. Podpora AJAX je tak výrazná, že dokonce ani není možné psát synchronní dotazy na server. To může být z počátku náročné pro programátora, který si musí zvyknout na nové principy volání serverových metod. Nicméně pro uživatele to přináší jen výhody, které spočívají především v mnohem interaktivnějším uživatelském rozhraní. Tento nástroj od společnosti Google je dostupný pod Apache Licence 2.0, která je velmi svobodná a umožňuje bezproblémové využití i v komerčních aplikacích. Pro samotné komponenty uživatelského rozhraní je výhodné vybrat některou z dostupných sad komponent. Tyto komponenty mají mnohem větší možnosti než ty, které jsou standardní součástí čistého GWT. Zejména je třeba se zaměřit na dostupnost pokročilých funkcí bohatého uživatelského rozhraní, které budeme potřebovat při realizaci našeho návrháře. Pravděpodobně nejvyspělejšími komponentami v této technologii jsou komponenty od společnosti Sencha. Dříve byly známé pod názvem Ext GWT (Pozor GWT Ext“ je jiný produkt, který je mnohými začatečníky ” v této oblasti často zaměňován) a nyní jsou vydávány pod názvem Sencha GXT. 9
Situace je tak nepřehledná, že vzniklo několik webových stran se snahou vést jejich seznam a srovnání. Jedna z nich je k dispozici na stránkách Wikipedia: Comparison of web application frameworks. WIKIMEDIA FOUNDATION. Wikipedia [online]. 2012 [cit. 2012-05-23]. Dostupné z: http://en.wikipedia.org/wiki/Comparison_of_web_application_frameworks#Java
5 NÁVRH ŘEŠENÍ
26
Tyto komponenty poskytují nevídanou kompatibilitu s různými webovými prohlížeči (Safari 3+, FireFox 3.6+, Internet Explorer 6+, Chrome 6+ a Opera 10.5+)10 . Je zde k dispozici rozsáhlá sada komponent včetně pokročilých funkcí jako dynamická změna pozice pomocí Drag&Drop nebo změna velikosti. Produkt je neustále vyvíjen a každá nová verze obsahuje nové funkce a mnohá vylepšení. Taková rychlost vývoje by pravděpodobně nebyla bez komerčního modelu možná. Nevýhodou tohoto produktu je dvojí licencování11 . Je k dispozici open source licence GPL, která je k dispozici zdarma. Nicméně pokud tyto komponenty použijete ve vlastní aplikaci, musíte ji také uvolnit pod licencí GPL a tedy zveřejnit zdrojové kódy (obecná vlasnost GPL licence). Toto je možné částečně řešit vhodným rozdělením aplikace, které bude vysvětleno v následující kapitole Přidání webového návrháře do reálných aplikací. Druhou možností je zakoupení komerční licence, která při koupi samostatné licence bez podpory začíná na ceně 499$ pro jednoho vývojáře (asi 10 000 Kč). Nicméně pokud využijeme tuto kombinaci webových technologií, nebude nutné instalovat žádné dodatečné doplňky do prohlížeče. Tyto technologie nám umožní realizovat i pokročilé funkce jako přesné nastavování pozic a velikostí jednotlivých elementů formou WYSIWYG stejně jako inline úpravy v datových tabulkách pro rychlou úpravu vlastností vybraných objektů.
5.3
Přidání webového návrháře do reálných aplikací
Aby byl webový návrhář v praxi použitelný, je třeba navrhnout způsob, jakým bude využíván v konkrétních reálných aplikacích. Vzhledem k použitým technologiím je možné navrhnout minimálně dva způsoby integrace, které mají své výhody i nevýhody. Dále jej rozdělíme na externí napojení a interní napojení. Externí napojení představuje přidání návrháře jako samostatné aplikace komunikující s reálnou (zdrojovou) aplikací pomocí XML datového zdroje. Tento způsob má značné výhody ve vzájemné nezávislosti obou aplikací. Dokonce je možné takto napojit jakoukoliv webovou aplikaci, u které je možno využít (nebo do ní doplnit) XML datové zdroje. Tento způsob je tedy zcela nezávislý na technologii zdrojové aplikace (nemusí se jednat ani o Java aplikaci). Elegantně je také vyřešen problém s GPL licencí, protože návrhář je pak samostatná aplikace pouze zpracovávající 10
Sencha GXT 3. SENCHA INC. Sencha.com [online]. [2012] [cit. 2012-05-23]. Dostupné z: http://www.sencha.com/products/gxt/ 11 Sencha GXT Licensing Options. SENCHA INC. Sencha.com [online]. [2012] [cit. 2012-05-23]. Dostupné z: http://www.sencha.com/products/gxt/license/
5 NÁVRH ŘEŠENÍ
27
data, kterou je možné poskytovat i pod licencí GPL a není nutné pod ní licencovat samotnou zdrojovou aplikaci. Ovšem případný distributor si musí dát pozor na způsob distribuce. GPL aplikace návrháře nesmí být distribuována jako jeden balík společně s komerční aplikací. Zjevnou nevýhodou tohoto řešení je omezení XML formátem pro zdrojová data a XPath jazykem pro dotazy. Interní napojení umožňuje vložit celý návrhář jako součást uživatelského rozhraní cílové aplikace (např. GWT panel). Tento způsob umožňuje mnohem těsnější propojení obou aplikací. Návrhář je možné vložit do libovolné GWT aplikace jako panel a využívat všechny možnosti propojení – libovolné datové zdroje (především SQL databáze), vzájemnou interakci komponent nebo třeba tvorbu průvodců. Nevýhodou je nutnost zakoupení komerční licence pro komponenty od společnosti Sencha nebo nutnost zveřejnění kódu aplikace pod licencí GPL. Nicméně zakoupení těchto komponent má význam i pro samotnou reálnou aplikaci, která pak může využít stejné úrovně komfortu uživatelského rozhraní. Pomocí těchto dvou variant integrace je možné pokrýt převážnou většinu požadavků. Obě varianty umožňují elegantní nahrazení desktopových návrhářů.
6 Implementace
6
28
Implementace
Na základě výběru tiskového nástroje a vypracovaného návrhu je možné přejít k vlastní implementaci řešení. Nejprve je vhodné zvolit správné nástroje pro vlastní implementaci. Následuje implementace uživatelsky přívětivého webového rozhraní, jehož výstupem je objektový model tiskové šablony. Tento model je třeba transformovat do XML formátu, kterému rozumí vybraný tiskový generátor (JasperReports) a společně s daty jej předat k vlastnímu generování tiskové sestavy. Nakonec je třeba přidat funkce pro správu tiskových sestav – načtení či uložení tiskové sestavy. Implementovaný webový návrhář je dále označován názvem WebReports.
6.1
Nástroje pro implementaci
6.1.1
Vývojové prostředí NetBeans
Pro jazyk Java existuje mnoho kvalitních vývojových prostředí. Vývojové prostředí výrazně usnadňuje správu projektu, efektivní psaní kvalitního kódu a automatické sestavení celého projektu do jeho distribuční podoby (např. do formátu WAR pro webové aplikace). Nejrozšířenějšími vývojovými prostředními jsou NetBeans a Eclipse – v obou případech se jedná o open source projekty, za kterými stojí velké společnosti. Za NetBeans stojí přímo Oracle jako vlastník Javy, zatímco Eclipse je podporován společností Google. Historicky bylo prostředí NetBeans kvalitnější pro vývoj webových aplikací a Eclipse umožňoval rychlejší tvorbu desktopových aplikací. Aktuálně je již situace srovnatelná. Nicméně NetBeans mají stále lepší podporu standardizovaných Maven projektů, a to je nakonec hlavní důvod, proč bylo zvoleno toto vývojové prostředí. 6.1.2
Definice projektu pomocí Maven
Maven slouží k deklarativnímu popisu struktury projektu a jeho návazností. Struktura každého Maven projektu je pevně daná. Základem je projektový soubor, tzv. POM (Project Object Model), který obsahuje všechny informace o zdrojových souborech projektu (verze, znaková sada souborů, verze jazyka), potřebných knihovnách a dalších návaznostech na vývojové prostředí. Díky tomu je relativně snadné projekt sestavit – pokud je vše správně definováno, stačí vlastnit projektový soubor a Maven se sám postará o vše potřebné k sestavení distribuce (z internetu stáhne potřebné závislosti a nástroje pro sestavení projektu, následně projekt správným způsobem sestaví).
6 Implementace
29
Ukázka definice projektu WebReports - pom.xml: <project ...> <modelVersion>4.0.0
cz.gola <artifactId>WebReports <packaging>war
1.0.0 WebReports <dependencies> <properties> <maven.compiler.source>1.6 <maven.compiler.target>1.6 <maven.compiler.encoding>UTF-8 ... ... <dependencies> <dependency>
javax.servlet <artifactId>servlet-api
2.4 <scope>provided ... Maven má k dispozici velké množství pluginů, díky kterým je možné efektivně řídit celý vývojový cyklus projektu (průběžné spouštění automatických testů, statistických a syntaktických analýz kódu, generování dokumentace zdrojových kódů, aktualizace projektových webových stránek a mnoho dalšího). Výhody jsou u většího projektu zřejmé. Nesmíme zapomenout na skutečnost, že mnoho reálných aplikací je vyvíjeno formou Maven projektu a pokud má být integrace výsledného webového návrháře co nejsnadnější, je velmi užitečné mít tento projekt také v Maven formě.
6 Implementace
6.2 6.2.1
30
Implementace uživatelského rozhraní Webová technologie GWT
Podrobný popis Google Web Toolkit je bezpochyby úkolem na samostatnou knihu. Jedná se o velmi sofistikovaný nástroj, který je na jednu stranu velmi mocný a na druhou stranu velmi složitý. Základem je transformace standardního Java kódu do JavaScriptu, který je možno vykonávat v cílovém webovém prohlížeči. Část aplikace tedy běží na severu a druhá část v prohlížeči. Je to odlišný způsob práce s uživatelským rozhraním a pro programátory může být úvodní pochopení obtížné. Při vývoji je také třeba neustále myslet na to, jestli pracujeme na serveru nebo na klientovi. Podstatná je také skutečnost, že o vykreslení HTML stránky se nestará server v době zpracování HTTP požadavku (jak je tomu často u mnohých jiných webových frameworků), ale mezi serverem a klientskou aplikací jsou zasílány jen data a jinak žijí obě části vlastním životem. Výhodou je nižší náročnost na přenos dat mezi klientem (prohlížečem) a serverem a také, že část výkonu potřebná pro zpracování uživatelského rozhraní je distribována mezi jednotlivé klientské počítače (prohlížeče). Nevýhodou je pak složitost klientské aplikace, která musí obsahovat i logiku pro práci s komponentovým modelem. Převod Java kódu do JavaScriptu je výpočetně velmi náročnou operací. Převod probíhá pro každý podporovaný webový prohlížeč samostatně. Pro vyšší rychlost a znesnadnění útoku na klientskou aplikaci je výsledek navíc komprimován a zatemněn (tzv. obfuskace“, kdy jsou především nahrazovány názvy metod a pro” měnných nesmyslnými řetězci pro znesnadnění porozumění případným útočníkem). Toto umožňuje rychlý běh výsledné webové aplikace, nicméně velmi znesnadňuje její ladění. Proto je pro vývoj dostupný tzv. vývojový mód. V tomto režimu nedochází k výše zmíněným optimalizacím a Java kód je pro prohlížeč překládán do JavaScriptu přímo za běhu pomocí speciálního pluginu pro konkrétní prohlížeč. To umožňuje rychlé a snadné debuggování klientské aplikace, nicméně daní je mnohem nižší rychlost běhu aplikace v prohlížeči (jen během vývoje). Nastavení GWT projektu je realizováno pomocí speciálního konfiguračního souboru, v našem případě Application.gwt.xml: <module>
...
6 Implementace
31
<extend-property name="locale" values="cs"/> <entry-point class='cz.gola.webreports.client.Application'/> <source path='client' /> ... Nejdůležitější je nastavení cesty ke zdrojovým souborům, které jsou převáděny do JavaScriptu – zde celý balíček client. Také je nutné zvolit tzv. vstupní bod aplikace, který udává metodu spuštěnou po zobrazení aplikace v prohlížeči. Zajímavé je také nastavení lokalizace. Pro každý prohlížeč a danou lokalizaci je kompilována speciální verze aplikace, tedy pokud máme šest podporovaných prohlížečů a dvě lokalizace, dostáváme 12 verzí aplikace. Tento systém umožňuje skutečně vysoký výkon výsledné aplikace, ale kompilace trvá několik minut i výkonným počítačům. Nyní se zaměřme na vlastní kód GWT aplikace. Všechny požadavky na server jsou realizovány technologií AJAX, tedy jsou asynchronní. GWT dokonce záměrně neumožňuje volání synchronních metod a uživatelské rozhraní je tedy nutné psát s ohledem na tuto skutečnost. Pro mnoho programátorů je toto nové paradigma a uživatelské rozhraní je nutné řídit především událostmi, které by jinak nebyly třeba. Např. pro obnovení dat v tabulce je zavolán požadavek na data na server. Než se data vrátí, uživatelské rozhraní není zastaveno, je třeba ošetřit opakované volání požadavku, přepnutí na jinou záložku, atd. Jakmile data přijdou ze serveru, je vyvolána speciální událost, na kterou je třeba opět v uživatelském rozhraní reagovat. Tento systém se značně komplikuje v případě, že na událost reaguje více komponent v různém pořadí, které navíc v průběhu vysílají vlastní události. Pro udržení pořádku v této oblasti je doporučováno implementovat tzv. EventBus, což je jednotné místo pro sběr, zpracování a rozesílání událostí komponent. Jednou z možností jak volat vzdálené asynchronní metody je GWT RPC (vzdálené volání procedur), jehož podpora je v GWT přímo implementována. Je třeba si uvědomit, že volání je prováděno z klienta, vykonáváno na serveru a výsledek je opět přenesen zpět na klienta. Je zde tedy část potřebná pro klienta a část potřebná pro server. Podrobněji je tato technologie popsána v kapitole Generování ”
6 Implementace
32
tiskové sestavy“. Další nezvyklou vlastností je přímé napojení komponent na objektový model HTML stránky, tzv. DOM. v praxi to znamená, že manipulací s vlastnostmi komponenty (např. pozice, velikost, barva) dochází přímo ke změnám v DOM. Tato vlastnost je zvlášť výhodná pro náš webový návrhář – úpravy jsou přímo promítnuty do HTML stránky a ihned jsou viditelné. Nicméně opět jsou zde úskalí. Je třeba počítat s životním cyklem komponent. Některé vlastnosti komponent je možné nastavit až po jejich vykreslení (nikoliv v jejich konstruktoru). GWT komponenty proto obsahují speciální metody onRender(), které slouží k přepsání a doplnění požadovaných vlastností. GWT je primárně podporováno ve vývojovém prostředí Eclipse, které Google upřednostňuje. Pro podporu sestavování GWT projektu v NetBeans je třeba využít speciální GWT Maven plugin. Konfigurace je díky Maven snadná, stačí definovat závislosti na knihovnách GWT a GWT Maven pluginu v již zmíněním POM souboru: <dependencies> <dependency>
com.google.gwt <artifactId>gwt-servlet
2.4.0 <scope>runtime <dependency>
com.google.gwt <artifactId>gwt-user
2.4.0 <scope>provided ...
org.codehaus.mojo <artifactId>gwt-maven-plugin 2.4.0 ...
6 Implementace
33
Pro správné fungování vývojového módu je vhodné v sekci konfigurace nastavit také cílovou webovou adresu pro otevření po spuštění a nastavení vyšší paměti potřebné pro vývojový mód: .../Application.html <extraJvmArgs>-Xms1024m -Xmx1024m -XX:MaxPermSize=256m Nyní je technologie GWT plně připravena pro použití v naší aplikaci. Maven se již automaticky postará o stažení všech potřebných knihoven a nástrojů pro vývoj i finální sestavení aplikace. 6.2.2
Webové komponenty Sencha GXT
Tyto komponenty jsou určeny do webových aplikací postavených na technologii GWT. Společnost Sencha mimo jiné vyvíjí čistě JavaScriptové komponenty Ext JS, které jsou široce uznávané i mimo technologii GWT. Jejich produkt Sencha GXT je pak variantou Ext JS pro GWT. Nicméně skutečnost, že vycházejí z Ext JS má dopad ve formě mírně odlišného používání v GWT. Tyto komponenty mají vlastní strom událostí a vlastní životní cyklus, který je mírně odlišný od čistého GWT. Od aktuální verze 3.0 je viditelná snaha o sjednocení těchto rozdílů. Snadná integrace komponent do GWT projektu je umožněna využitím nástroje Maven, opět je třeba nejprve doplnit konfigurační projektový soubor POM: <dependency> com.extjs <artifactId>gxt 2.2.4 <scope>compile Dále je třeba definovat závislost Sencha GXT do naší GWT aplikace, aby kompilátor GWT věděl, že má při kompilaci připojit i komponenty Sencha. Tato technologie kompilace (Java do JavaScript) je mimo standardní proces kompilace Javy, proto nestačí jen definovat závislosti knihoven. Závislost definujeme v GWT konfiguračním souboru projektu Application.gwt.xml: ...
6 Implementace
34
Posledním krokem je připojení speciálních stylů a obrázků Sencha GXT komponent, které se provede přidáním celého adresáře resources (je obsažen v distribučním archivu komponent) do příslušného projektového adresáře staticweb. Nyní máme v našem projektu možnost využívat rozsáhlou sadu moderních webových komponent. 6.2.3
Základní rozložení uživatelského rozhraní
Abychom vyhověli všem požadavkům na funkce uživatelského rozhraní, je třeba do návrháře umístit následující prvky – plátno, navigátor, inspektor, paleta, správa šablon, výběr dat, ovládání generování a konzole. Správu šablon a výběr dat je vhodné umístit do horní části obrazovky formou nástrojové lišty. Tyto funkce jsou obvykle umísťovány horní části aplikace. Správa šablon bude obsahovat funkce pro vytvoření nové šablony, uložení šablony do souboru, otevření šablony ze souboru a funkci pro vytvoření ukázkové šablony (pro účely rychlého vyzkoušení a seznámení uživatele s návrhářem, případně pro prezentaci). Výběr dat a generování bude umožňovat určení XML datového zdroje, dotazu, parametrů, datových polí a proměnných a vlastní generování tiskové sestavy. Ve střední části obrazovky jsou umístěny všechny prvky pro vlastní správu šablony. Přitom jsou poskládány přirozeně zleva doprava, kdy vlevo vybíráme konkrétní prvek v navigátoru a vpravo nastavujeme jeho detailní vlastnosti v inspektoru. Uprostřed je plátno, které umožňuje rychlý výběr i rychlou změnu vybraných vlastností (pozice, velikost, text). Vlevo pod navigátorem je ještě umístěna paleta pro přidávání nových elementů do šablony a funkce pro odstraňování vybraných elementů ze šablony. Ve spodní části obrazovky je pak umístěna konzole pro výstup průběhu generování tiskové sestavy a případných chyb. Uživatelské rozhraní by mělo automaticky reagovat na změnu velikosti okna prohlížeče. GWT je založeno na principu kontejnerů a komponent. Do kontejnerů je možno vkládat další kontejnery nebo komponenty a ty jsou automaticky zarovnávány dle vybraného způsobu zarovnávání. Způsob zarovnávání určuje tzv. LayoutManager, kterých je k dipozici mnoho. Pro naše potřeby je výhodné využít rozložení BorderLayout, které umožňuje rozložit svůj obsah do jednotlivých částí (okrajů) podle světových stran a navíc automaticky rozšiřuje svoji středovou část na základě své velikosti. Základem naší aplikace je WebReportPanel, do kterého vložíme další části:
35
6 Implementace
BorderLayout borderLayout = new BorderLayout(); webReportPanel.setLayout(borderLayout); createToolbar(webReportPanel); createNavigator(webReportPanel); createInspector(webReportPanel); createScreen(webReportPanel); createConsole(webReportPanel);
// // // // //
vrchní část levý okraj pravý okraj střed spodní část
Pomocí tohoto rozložení je velmi snadné vložit některou část aplikace do zvolené oblasti: // vložení nástrojové lišty do vrchní části BorderLayoutData bld = new BorderLayoutData(LayoutRegion.NORTH); bld.setSize(100); webReportPanel.add(toolbar, bld); Pro správné fungování posuvníků při nedostatečné velikosti okna prohlížeče je třeba do sebe jednotlivé komponenty vkládat i za pomocí jiných rozložení – zejména FitLayout, který komponentu automaticky roztáhne po celém prostoru kontejneru. Systém rozložení komponent je velmi obsáhlý a správné používání vyžaduje značné znalosti a zkušenosti. Je sice možné dosáhnout téměř jakéhokoliv rozložení za pomocí opakovaného vkládání FitLayout a BorderLayout do sebe, ale tato technika má drastický dopad na výkon aplikace. Po několika úrovních zanoření je uživatelské rozhraní pomalé i na rychlejších počítačích. Důvodem je složité HTML pozadí těchto kontejnerů, kdy dochází k vkládání mnoha DIV do sebe a objektový model HTML stránky rychle roste. Výsledné rozložení uživatelského rozhraní je možné vidět na Obrázku č. 5 v příloze této práce. 6.2.4
Navigátor
Tato část slouží k přehlednému zobrazení a procházení stromové struktury celého reportu. Díky němu je možné vždy snadno vybrat požadovanou sekci nebo element pro další úpravu či odstranění, a to i v případě, že na plátně není tento objekt z nějakého důvodu vidět. Navigátor je realizován jako stromová komponenta TreePanel. Tato komponenta umí prezentovat stromová data, která implementují rozhraní TreeModel
6 Implementace
36
(umožňuje získat odkaz na rodiče a potomky). TreePanel umožňuje nastavení třídy IconProvider pro prezentaci správné ikonky u každého uzlu stromu. Ikonky usnadňují orientaci ve struktuře stromu. Rychlé vizuální rozlišení typu uzlu významně zpřehledňuje práci s navigátorem. Zajímavostí GWT je práce s drobnými obrázky uživatelského rozhraní. Ty nejsou stahovány a zobrazovány v prohlížeči samostatně, ale jako jeden velký obrázek dohromady, ze kterého se vždy zobrazuje na daném místě jen konkrétní část odpovídající požadovanému obrázku. To umožňuje významně snížit počet dotazů na sever (pro všechny drobné obrázky na stránce jen jeden dotaz). Pro vlastní ikonky je využito open source sady ikonek FamFamFam12 . Navigátor musí reagovat na výběr konkrétní sekce či elementu. Po výběru konkrétního elementu je tento označen i na plátně a opačně při výběru elementu přímo na plátně je vždy označen i odpovídající objekt v navigátoru. Pro označení na plátně je využito HTML vlastnosti border, která umožňuje nastavit rámeček kolem vybraného objektu. Vybraný objekt tedy označíme červeným rámečkem: public static void setFieldSelected(Component field) { El el = getInnerElementEl(field); el.setStyleAttribute("border-color", "red"); } Zde je vidět výhoda přímého přístupu komponent k DOM. Je tak mnohem snadnější docílit WYSIWYG rozhraní. Na navigátoru je závislý také inspektor, který vždy zobrazuje vlastnosti vybraného objektu v navigátoru – reportu, sekce nebo elementu. 6.2.5
Plátno – sekce
Plátno je nejdůležitější a také nejsložitější částí uživatelského rozhraní. Je třeba, aby vzhledově co nejvíce odpovídalo výsledné tiskové sestavě, a přitom musí umožňovat mnoho funkcí pro rychlou úpravu jako je přímá změna velikosti, pozice či textu uvnitř elementů. Plátno je rozděleno na sekce, které odpovídají logickým částem tiskové sestavy. U každé sekce je třeba umožnit uživateli nastavovat její výšku. Tato část je zvlášť náročná na webové uživatelské rozhraní, protože všechny elementy šablony 12
FAMFAMFAM Homepage. JAMES, Mark. FAMFAMFAM [online]. [2006] [cit. 2012-05-23]. Dostupné z: http://www.famfamfam.com/
6 Implementace
37
musejí dynamicky reagovat na změny velikostí jednotlivých sekcí. Bez kvalitního systému pro rozložení komponent by byla realizace této funkce velmi obtížná. Zde je možné opět s výhodou využít vlastností BorderLayout, které umožňuje pro jednotlivé oblasti nastavit uživatelská táhla pro dynamickou změnu velikosti včetně určení minimální a maximální velikosti oblasti. Toto rozložení také umožňuje definovat možnost schování vybrané oblasti, a tak můžeme uživateli dokonce umožnit dočasné skrytí vybrané sekce. Sekce jsou postupně vkládány do sebe tak, že si aplikace pamatuje poslední sekci a do ní vkládá sekci novou. Nová sekce je vždy vkládána do vrchní části centrálního panelu předchozí sekce: BorderLayoutData bld = new BorderLayoutData(LayoutRegion.NORTH); bld.setSize(height); bld.setMinSize(0); // nastavení minimální velikosti bld.setMaxSize(1000); // nastavení maximální velikosti bld.setCollapsible(true); // povoleno skrytí sekce bld.setSplit(true); // povolena uživatelská změna velikosti lastSectionCentralPanel.add(newSection, bld); V případě, že uživatel změní velikost některé ze sekcí pomocí inspektora, je třeba zajistit přepočítání velikostí, to je umožněno díky vkládání sekcí do sebe. Stačí tedy provolat přepočítání první sekce a dojde k automatickému přepočítání všech. void setSectionHeight(ContentPanel section, int height) { section.setHeight(height + HEADER_SIZE); firstSection.layout(true); // přepočítání velikosti sekcí } z předchozího kódu je patrný ještě jeden problém, který je nutné řešit. Skutečná velikost sekce neodpovídá zobrazované velikosti, která obsahuje navíc hlavičku. Proto je nutné provádět přepočet pomocí konstanty HEADER_SIZE. Speciálními sekcemi je „group 1 header“ a „group 1 footer“. Jsou to připravené sekce pro volitelné vložení skupiny do tiskové sestavy. Návrhář tedy nyní podporuje případné vložení jen jedné skupiny, nicméně to je pro většinu reportů dostatečné. Skupiny jsou založeny na principu průběžného vyhodnocování definovaného výrazu při každém výpisu řádku ze sekce detail – pokud se výraz změní, jedná se o novou skupinu a je vypsána nová hlavička. V případě, že jsme již uvnitř generování jiné skupiny, je nejprve ukončena patičkou skupiny. Stejně tak na konci je automa-
6 Implementace
38
ticky přidána patička poslední skupiny. Výraz je možné definovat výběrem hlavičky skupiny a upřesnit jej v příslušném řádku tabulky inspektoru. Možnosti práce se sekcemi odpovídají všem požadavkům funkcí tiskových sestav i komfortu uživatelského rozhraní, zejména vlastnosti WYSIWYG. 6.2.6
Plátno – elementy
Pokud máme plátno s nastavenými oblastmi pro sekce, můžeme pokračovat přidáváním elementů, které slouží pro vlastní prezentaci dat. Náš návrhář podporuje pět základních elementů běžných z desktopových návrhářů – statický text, textové pole, obdélník, čára a obrázek. Přitom statický text a textové pole (vkládané z dat) je realizováno jednou společnou komponentou textová položka, což umožňuje snadnější uživatelskou práci. Webový návrhář automaticky rozpozná typ podle vloženého textu na základě masky, která se používá pro výrazy textových položek (začíná znakem „$“, v opačném případě se jedná o statický text). Všem čtyřem elementům je možno nastavit přesnou pozici, velikost (šířku a výšku), barvu elementu a barvu pozadí. Další vlastnosti (velikost a název fontu, cesta k obrázku, směr čáry) se liší v závislosti na typu elementu. Elementy je umožněno dynamicky přesunovat pomocí funkce Drag&Drop, kterou Sencha GXT podporuje pomocí speciálního rozhraní Draggable: // povolení změny pozice Draggable d = new Draggable(field); d.setContainer(section); // zamezení přesunu mimo sekci d.addDragListener(new DragListener() { @Override public void dragEnd(DragEvent e) { int newX = e.getX() - section.getAbsoluteLeft(); int newY = e.getY() - section.getAbsoluteTop(); Info.display("New position", newX + "," + newY); ... super.dragEnd(e); reloadInspector(); } });
6 Implementace
39
Dokonce je možné nastavit omezení oblasti, ve které změna pozice bude probíhat – v našem případě s výhodou omezíme na oblast aktuální sekce. Funkci dynamické změny pozice elementu (Drag&Drop) je možné vidět na Obrázku č. 6 v příloze této práce. Elementy je také umožněno dynamicky zvětšovat a zmenšovat pomocí funkce změny velikosti, kterou Sencha GXT podporuje pomocí speciálního rozhraní Resizable: // povolení změny velikosti Resizable r = new Resizable(field); r.setMinHeight(0); r.setMinWidth(0); r.addResizeListener(new ResizeListener() { @Override public void resizeEnd(ResizeEvent e) { Component c = e.getComponent(); int newW = c.getOffsetWidth(); int newH = c.getOffsetHeight(); Info.display("New size", newW + "x" + newH); // pozor, mohlo dojit i~ke změně pozice int newX = c.getAbsoluteLeft() - section.getAbsoluteLeft(); int newY = c.getAbsoluteTop() - section.getAbsoluteTop(); ... super.resizeEnd(e); reloadInspector(); } }); U změny velikosti je potřeba hlídat i případnou změnu pozice, protože k ní může v průběhu dojít – pokud je element zmenšován či zvětšován z levého horního rohu, který jinak udává pozici komponenty. Funkci dynamické změny velikosti elementu je možné vidět na Obrázku č. 7 v příloze této práce. Pro změnu velikosti čáry jsou v závislosti na jejím typu (horizontální, vertikální) umožněny jen vybrané směry a rozsahy změn velikosti pomocí určení táhel (zkratky světových stran), minimálních a maximálních velikostí:
6 Implementace
40
public void addLineResizing(boolean horizontal, ...) { Resizable r; if (horizontal) { r = new Resizable(field, "ne se e nw sw w"); r.setMinHeight(1); r.setMaxHeight(1); r.setMinWidth(0); } else { r = new Resizable(field, "ne se n nw sw s"); r.setMinHeight(0); r.setMaxWidth(1); r.setMinWidth(1); } ... } Využití komponent Sencha GXT zde významným způsobem zvyšuje komfort uživatelského rozhraní. Úpravy všech elementů na plátně jsou plně WYSIWYG. 6.2.7
Paleta
Paleta je součástí navigátoru. Nachází se v jeho spodní části a slouží k přidávání nových elementů do šablony. Umožňuje přidat textovou položku, obdélník, čáru a obrázek. Nový element je vkládán do aktuálně zvolené sekce v navigátoru na výchozí pozici x=10, y=10. Obsahuje také funkci pro odstranění vybraného elementu ze šablony. Textová položka slouží pro vkládání textů do tiskové sestavy. Reprezentována je webovou komponentou TextField, do které je možno přímo vkládat uživatelský text nebo odkaz na datovou položku, např. $F{title}“. Také je možno nastavit ” velikost fontu a jeho název – tyto změny se po nastavení okamžitě promítnou a jsou viditelné v šabloně. public class TextElement extends TextArea { ... @Override protected void onRender(Element target, int index) { super.onRender(target, index);
6 Implementace
41
EM.setFieldForecolor(this, forecolor); EM.setFieldBackcolor(this, backcolor); EM.setFieldFontSize(this, fontSize); EM.setFieldFontName(this, fontName); setDefaultValues(); } ... } Obdélník se používá jako dekorace pro zvýraznění důležitých údajů. Reprezentován je webovou komponentou LayoutContainer, kde se s výhodou používá možnosti nastavit rámeček. public class RectangleElement extends LayoutContainer { ... @Override protected void onRender(Element target, int index) { super.onRender(target, index); EM.setFieldForecolor(this, forecolor); EM.setFieldBackcolor(this, backcolor); EM.setFieldBorder(this, "solid 1px black"); setDefaultValues(); } ... } Čára se používá opět jako dekorace ke zvýraznění důležitých částí, případně vizuálnímu oddělení jednotlivých údajů. Je možné určit zvolit horizontální nebo vertikální podobu. Na základě toho je elementu nastavena výška případně šířka jeden bod. Při změně směru jsou tyto rozměry prohozeny. Reprezentován je webovou komponentou LayoutContainer společně s nastaveným rámečkem. public class LineElement extends LayoutContainer { ... @Override protected void onRender(Element target, int index) { super.onRender(target, index); EM.setFieldForecolor(this, forecolor);
6 Implementace
42
EM.setFieldBackcolor(this, backcolor); EM.setFieldLineBorder(this, "solid 1px black"); setDefaultValues(); } public void setHorizontal(boolean horizontal) { if (this.horizontal != horizontal) { this.horizontal = horizontal; // prohozeni rozmeru int origWidth = getWidth(); setWidth(getHeight()); setHeight(origWidth); } } ... } Obrázek se používá pro vložení libovolné grafiky do tiskové sestavy. Reprezentován je opět webovou komponentou LayoutContainer. Pro vykreslení vlastního obrázku se využívá obecné CSS vlastnosti background-image HTML komponent, která umožňuje definovat obrázek dle zadané URL. public class ImageElement extends LayoutContainer { ... @Override protected void onRender(Element target, int index) { super.onRender(target, index); EM.setFieldForecolor(this, forecolor); EM.setFieldBackcolor(this, backcolor); EM.setFieldBackgroundImage(this, url); EM.setFieldBorder(this, "solid 1px gray"); setDefaultValues(); } ... }
6 Implementace
43
Vkládání nových elementů i jejich případné odstranění je ihned promítnuto do stromového seznamu navigátoru i do zobrazení šablony na plátně: public void refreshElementsGUI() { // překreslení stromového panelu a~jeho automatické rozbalení navigatorTree.getStore().removeAll(); navigatorTree.getStore().add(reportRootNode, true); navigatorTree.expandAll(); // překreslení plátna screen.layout(); } 6.2.8
Inspektor
Inspektor musí umožňovat přehledné zobrazení všech vlastností vybraného objektu. Také je třeba, aby v něm bylo možné provádět rychlé úpravy. Tyto parametry splňuje nejlépe komponenta tabulky s tzv. inline editací. Tzn., že uživatel může do tabulky přímo psát a nastavovat tak nové hodnoty. Tato vlastnost není u webových tabulek obvyklá, proto je velmi výhodné, že vybrané komponenty toto umožňují. Slouží k tomu komponenta EditorGrid, které je při vytváření předávána konfigurace jednotlivých sloupců a je umožněno nastavit editor pro vybraný sloupec: ColumnConfig column = new ColumnConfig(); column.setId("value"); column.setHeader("Value"); column.setWidth(200); // nastavení editoru column.setEditor(new CellEditor(new TextField())); Nicméně jelikož se tato tabulka standardně chová tak, že po úpravách je třeba zavolat její uložení a teprve poté jsou data přepsána, bylo třeba upravit chování CellEditoru. Po vložení hodnoty je hodnota automaticky uložena: cellEditor.addListener(Events.Complete, ... @Override public void handleEvent(BaseEvent be) { inspectorStore.commitChanges();
6 Implementace
44
updateFieldByInspector (); } }); Metoda updateFieldByInspector() se již postará o nastavení nových vlastností do aktuálně vybrané sekce nebo elementu a jejich promítnutí do uživatelského rozhraní. Pro získávání informací o vybrané sekci či elementu i jejich ruční nastavování byla vytvořena pomocná třída EM (Element Manager). Metody pro práci s absolutní pozicí elementu musejí pracovat s uloženými souřadnicemi z panelu: public static int getFieldX(Component field) { return get().getElementsAbsoluteData().get(field).getLeft(); } public static void setFieldX(Component field, int x) { get().getElementsAbsoluteData().get(field).setLeft(x); } // a obdobně pro pozici Y Metody pro získání velikosti využívají metody, které vracejí úplnou velikost včetně dekorací komponent (rámečky, stíny): public static int getFieldW(Component field) { return field.getOffsetWidth(); } public static void setFieldW(Component field, String w) { field.setHeight(w); } // a obdobně pro pozici H Pro nastavení barev vlastní komponenty a jejího pozadí je třeba vždy najít správný vnitřní HTML element (ten se liší podle druhu komponenty) a barvu převést do normalizovaného tvaru společného pro HTML i JasperReports. Normalizovaný tvar je #RRGGBB, kde RR je hexadecimální hodnota červené složky, GG hexadecimální hodnota zelené složky a BB hexadecimální hodnota modré složky. public static String getFieldForecolor(Component field) { El el = getInnerElementEl(field); final String color = el.getStyleAttribute("color");
6 Implementace
45
return getNormalizedColor(color); } // a obdobně pro backcolor Podobné jsou metody pro nastavení názvu a velikosti fontu (zde je zamezeno udávat velikost jinak než v bodech) či obrázku na pozadí. 6.2.9
Konzole
Během procesu kompilace, výběru dat, jejich zpracování a následném sestavování tiskové šablony může dojít k mnoha chybám. Uživatele je třeba o těchto skutečnostech informovat a k tomu slouží konzole ve spodní části návrháře. Výstup do konzole je zobrazován z návratových hodnot volaných asynchronních RPC metod. Pokud dojde během generování na serveru k chybě, je na klienta odeslána chybová zpráva. V opačném případě vrátí server prázdný řetězec. Před každým spuštěním generování nové tiskové sestavy je konzole nejprve vyčištěna a je do ní vložen aktuální čas zahájení generování. Po úspěšném dokončení generování je vložen také čas ukončení. 6.2.10
Výběr dat
Výběr dat umožňuje definovat XML datový zdroj pomocí URL. Pro otestování správně zadané cesty je k dispozici tlačítko Zobrazit zdroj“, které otevře dané ” URL do nové záložky prohlížeče. Ve vybraném datovém zdroji (XML) je třeba vybrat konkrétní datové položky pomocí dotazovacího jazyka pro XML – XPath. Vybraná data je třeba dále pojmenovat pomocí datových polí. U každého datového pole je třeba specifikovat název, který odpovídá XML uzlu vybraného XML elementu pomocí XPath dotazu. Je také možno specifikovat datový typ, pokud chceme data dále formátovat nebo je dále zpracovávat. Pojmenovaná datová pole je pak možno používat v šabloně pomocí identifikátorů ve tvaru $F{nazev_pole}“, ” který se vkládá do textových položek. Obdobně je možné specifikovat parametry reportu. Parametry je ovšem možné využít pouze v případě, že je návrhář integrován přímo a je možno mu předat parametry ze zdrojové aplikace. Posledním nástrojem pro výběr a zpracování dat jsou proměnné. U každé proměnné je možno specifikovat její název, datový typ, typ operace a výraz. Takto
6 Implementace
46
je například možné sečíst hodnoty všech položek ve skupině a zobrazit je v patičce skupiny. Jako příklad může sloužit tisková sestava, kde jsou vypisována města s počtem obyvatelů. Zde je možno vytvořit skupiny po krajích a pomocí definované proměnné sčítat a prezentovat celkový počet obyvatel v každém kraji.
6.3
Správa šablon
Aby bylo možné návrhář reálně používat, je třeba uživateli umožnit vytvořit novou prázdnou šablonu, uložit aktuálně rozpracovanou šablonu do souboru nebo otevřít již existující šablonu ze souboru. Funkce pro vytvoření nové šablony vytvoří novou prázdnou šablonu se základní sadou sekcí a výchozím nastavení jejich velikostí. Funkce pro uložení aktuální šablony převede objektový model reportu na JasperReports XML formát a ten umožní uživateli uložit na lokální disk. Převod probíhá v metodě buildXML(), která je podrobněji popsána v kapitole Transformace ” modelu do formátu tiskové šablony (a zpět)“. Sestavené XML je pomocí RPC metody odesláno z klienta na server, kde jej přijme webový servlet a vrátí ve standardní HTTP odpovědi jako soubor pro uložení. Pro odeslání šablony ve formě souboru je důležitých několik správných parametrů: public void saveReport() { ServletOutputStream out = response.getOutputStream(); try { ... // nastavení formátu a~kódování výstupu response.setContentType("text/xml;charset=UTF-8"); // nastavení, že se jedná o soubor pro uložení response.addHeader( "Content-Disposition", "attachment; filename=" + fileName); // odeslání dat ve správném kódování out.write(jasperSourceXML.getBytes("UTF-8")); } catch (Throwable ex) { throw new RuntimeException(ex); } finally { out.close(); }
6 Implementace
47
} Funkce pro načtení existující šablony umožňuje vybrat lokální soubor ve formátu JasperReports XML a odeslat jej do tiskového návrháře. Ten jej převede do objektového modelu pomocí metody parseXML() a zobrazí ji v uživatelském rozhraní. Metoda parseXML() je podrobněji popsána v kapitole „Transformace modelu do formátu tiskové šablony (a zpět)“. Vlastní odeslání je realizováno pomocí komponenty FileUpload, která ale využívá standardní HTTP POST metody k odeslání souborů. Pro jednodušší zpracování je třeba do projektu přidat knihovnu pro podporu zpracování nahrávaných souborů (do souboru pom.xml): <dependencies> ... <dependency> commons-fileupload <artifactId>commons-fileupload 1.2.1 jar Nyní je možné příchozí soubor zpracovat, přečíst obsah ve formě XML a odeslat na klienta pro vytvoření objektového modelu šablony potřebného pro uživatelské rozhraní: public void loadReport() { response.setContentType("text/html"); ServletOutputStream out = response.getOutputStream(); ... StringBuilder sb = new StringBuilder(); // načtení příchozího souboru Scanner scanner = new Scanner(stream, "UTF-8"); while (scanner.hasNextLine()) { sb.append(scanner.nextLine()).append("\n"); } String reportXml = sb.toString(); // odeslání XML na klienta out.write(reportXml.getBytes("UTF-8")); ...
6 Implementace
48
} Poslední funkcí správy šablon je vytvoření ukázkové šablony. Uživatel si tak může rychle vyzkoušet ovládání návrháře na funkční předloze.
6.4 6.4.1
Integrace JasperReports Transformace modelu do formátu tiskové šablony (a zpět)
Šablona, která je vytvořená v uživatelském rozhraní webového návrháře, je uchovávána v objektovém modelu komponent. Aby bylo možné tuto šablonu využít k tisku konkrétní tiskové šablony pomocí vybraného tiskového nástroje, je třeba ji převést do XML formátu JasperReports. Jelikož je podobný převod nutný i pro případ uložení šablony do souboru a jejího opětovného načtení, byl tento formát zvolen i pro další uchovávání šablon vytvořených v tomto rozhraní. To má velmi mnoho výhod. Šablonu vytvořenou v našem webovém rozhraní je možné otevřít i v oficiální desktopové variantě návrháře a zkontrolovat. Dokonce je možné otevřít i šablonu vytvořenou původně v desktopové variantě návrháře. Ovšem je třeba počítat s menším množstvím podporovaných funkcí – nemusí být tedy načten celý obsah šablony. Uložení šablony, neboli sestavení XML souboru na základě modelu sekcí a elementů je realizováno pomocí metody buildXML(). JasperReport XML formát je poměrně jednoduchý a hezky čitelný. Sestavení XML podle objektového modelu je přímočaré. Nejprve je třeba vložit kořenový element <jasperReport> s obecnými vlastnostmi (jmenné prostory, název), do kterého budou vkládány další elementy: <jasperReport ... name="nazev_reportu"> // parametry // dotaz (SQL nebo XPath) // datová pole // proměnné // skupiny // elementy skupiny // sekce // elementy sekce
6 Implementace
49
Dále jsou do šablony vloženy parametry, kterých může být libovolný počet: <parameter name="nazev_parametru" class="datovy_typ"/> Následuje specifikace dotazu, která je v šabloně jen jedenkrát: Datová pole, kterých může být libovolný počet: Proměnné, kterých může být opět libovolný počet: Skupiny, obsahující vždy výraz a sekce pro hlavičku a patičku skupiny (formát obsahu sekce je popsán dále): Následují sekce definovaných typů, které již obsahující konkrétní elementy. Pokud některá ze sekcí není v XML definovaná, znamená to, že je prázdná (ukázka sekce typu titulek):
6 Implementace
50
v rámci sekce je pak možné definovat jednotlivé elementy. Textové položky jsou vypisovány v závislosti na tom, jestli se jedná o statický text nebo výpis hodnoty datového pole: <staticText> ... Čáry a obdélníky jsou definovány podobně:
51
6 Implementace
forecolor="black" backcolor="transparent" /> Posledním popisovaným elementem je obrázek obsahující navíc URL k vlastnímu obsahu: Při sestavování XML bylo nutné vyřešit problémy s částmi CDATA, které ve výsledném XML nemohou být takto formátovány na nové řádky (zde je toto formátování využito kvůli přehlednosti). Pokud je před elementem CDATA nový řádek, nástroje pro zpracování obsahu XML nepracují správně. Načtení šablony, neboli sestavení objektového modelu pro uživatelské rozhraní z formátu tiskové šablony je realizováno v metodě parseXML(). Jelikož je šablona uchována ve formátu XML, pro jeho snadné zpracování je vhodné použít některý z nástrojů pro průchod objektovým modelem XML. Po srovnání několika variant byla vybrána knihovna Totoe podporující jazyk XPath. Přidání knihovny do projektu je snadné, opět je možno využít konfigurace Maven projektu: <dependencies> ... <dependency> name.pehl <artifactId>totoe 0.4 <scope>provided Jelikož XML formát pro šablony JasperReports obsahuje jmenné prostory, je třeba nezapomenout specifikovat tyto jmenné prostory při převodu XML do DOM a následně je uvádět v XPath výrazech:
6 Implementace
52
String namespaces = "xmlns:default=http://.../jasperreports"; Document dom = new XmlParser().parse(result, namespaces); Vlastní získávání hodnot z XML souboru je velmi usnadněno možností využívat XPath výrazy pro získávání seznamu elementů i konkrétních hodnot. Příklad získání seznamu všech parametrů a načtení jejich názvu a typu: List nds = dom.selectNodes("//default:parameter"); for (Node node : nds) { String name = node.selectValue("@name"); String type = node.selectValue("@class"); addParameter(name, type); } Úplný proces načítání šablony se skládá z načtení obecných vlastností šablony, dotazu (SQL nebo XPath výraz), seznamu datových polí, parametrů a proměnných, skupin, sekcí a jejich konkrétních elementů (statický text, textové pole, obdélník, čára, obrázek). Elementy statický text a textové pole jsou opět automaticky slučovány do jednoho elementu webového návrháře – textová položka. Načítání šablony je napsáno tak, aby byly případné nepodporované funkce či elementy automaticky přeskočeny. To je velmi výhodné, zvlášť budeme-li někdy chtít do systému nahrát šablony původně vytvořené v desktopové variantě návrháře. 6.4.2
Generování tiskové sestavy
Pro tvorbu tiskové sestavy potřebujeme šablonu v XML formátu JasperReports, datový zdroj a zvolený výstupní formát. Do webového návrháře byla přidána podpora výstupů do PDF, HTML a XML. Pro spuštění tohoto procesu je k dispozici služba generate(), která má právě tyto 3 parametry: generate(String jasperXML, String dataURL, String outputFormat); Tato služba je dostupná pomocí GWT RPC. Pro její implementaci je třeba nejprve vytvořit vlastní třídu služby na serveru rozšířením speciální třídy RemoteServiceServlet. v tomto případě ReportControllerImpl. Nově vytvořený servlet je pak nutné definovat v konfiguračním souboru JEE webové aplikace – web.xml: <servlet>
6 Implementace
53
<servlet-name>ReportController <servlet-class>...ReportControllerImpl <servlet-mapping> <servlet-name>ReportController .../reportController.rpc Dále je nutné vytvořit dvojici rozhraní pro server a klienta. Tato rozhraní musí být podobná, respektive klientské asynchronní rozhraní musí přesně odpovídat synchronní variantě serverového rozhraní. Asynchronní varianta se tvoří pomocí přesunu návratové hodnoty metody do asynchronního callbacku jako nového posledního parametru metody. Takto vypadá dvojice zápisu metod v synchronní a asynchronní variantě rozhraní: // serverové rozhraní public interface ReportController extends RemoteService { ... String generate(String jasperXML, String format, String dataURL); // klientské asynchronní rozhraní public interface ReportControllerAsync { ... void generate(String jasperXML, String format, String dataURL, AsyncCallback<String> callback); O vzájemné propojení a přenos dat se již postará GWT automaticky. Nyní je možné z klienta zavolat metodu pro generování tiskové sestavy: ReportControllerAsync.Pool.get().generate(jasperXML, outputFormat, dataSourceURL, new AsyncCallback<String>() { @Override public void onFailure(Throwable caught) { // došlo k chybě
6 Implementace
54
} @Override public void onSuccess(String result) { // vše proběhlo v pořádku } } ); Případné chyby v průběhu generování jsou předány jako návratový řetězec, který je možné zobrazit do konzole a umožnit uživateli nápravu. Vlastní generování probíhá v několika krocích. Po zavolání metody pro generování je na serveru nejprve uložena XML šablona do dočasného souboru, který vyžaduje API JasperReports: // uložení XML šablony do dočasného souboru JRXML File file = File.createTempFile("webreport-" + System.currentTimeMillis(), ".jrxml"); OutputStreamWriter fileWriter = new OutputStreamWriter(new FileOutputStream(file), "UTF-8"); fileWriter.append(jasperXML); fileWriter.close(); Dále je zpracován datový zdroj (XML): // vložení XML datového zdroje Document document = JRXmlUtils.parse( JRLoader.getLocationInputStream(dataSourceFile + ".xml")); Následujícím krokem je kompilace zdrojového souboru šablony JRXML do binárního formátu šablony JASPER: // kompilace šablony do JASPER souboru JasperCompileManager.compileReportToFile( templateId + ".jrxml", templateId + ".jasper"); Zkompilovaná šablona poskytuje vyšší výkon při opakovaném generování, což je možné s výhodou využít ve statických šablonách dodávaných společně s apli-
6 Implementace
55
kací. v tomto případě je třeba kompilovat šablonu vždy, respektive pro optimalizaci kompilace by bylo nutné implementovat cache, která rozpozná případnou změnu ve zdrojovém souboru šablony. Je již připravena pro plnění daty. Dále je vytvořen obecný tiskový výstup, do kterého jsou naplněna data: // vyplnění tiskové šablony vybranými daty JasperPrint jasperPrint = JasperFillManager.fillReport(templateId + ".jasper", params); Na závěr je obecný tiskový výstup včetně dat převeden do konkrétního výstupního formátu: // případný tisk do výstupního formátu HTML JasperExportManager.exportReportToHtmlFile(jasperPrint, targetFilePath); ... // případný tisk do výstupního formátu XML JasperExportManager.exportReportToXmlFile(jasperPrint, targetFilePath, true); ... // případný tisk do výstupního formátu PDF JasperExportManager.exportReportToPdfFile(jasperPrint, targetFilePath); ... Pokud proběhne celý proces generování tiskové sestavy úspěšně, je výsledný binární obsah zprostředkován zpět uživateli do webového prohlížeče za pomocí servletu. Binární soubor je zobrazen do nové záložky (pokud prohlížeč neumí zobrazit daný obsah v záložce, nabídne otevření přidruženou aplikací nebo uložení na disk).
7 DISKUZE
7
56
Diskuze
Implementace webového návrháře byla úspěšně dokončena. Nyní je čas se zamyslet, nakolik naplnila všechna naše očekávání, jaké jsou možné překážky při reálném nasazení a jakým směrem by se měl ubírat další vývoj. Hlavním impulsem pro tvorbu tohoto nástroje byla jeho reálná potřeba hned v několika webových projektech, kterých jsem se aktivně účastnil. Dosud se mi nepodařilo najít alternativní řešení, které by bylo dostečně uživatelsky přívětivé, přitom kvalitní a nejlépe ještě velmi snadno integrovatelné s používanými webovými technologiemi. Takový nástroj nebyl v době zadání k dispozici. Vzhledem k rychlému vývoji webových řešení je ale pravděpodobné, že se brzy takové řešení objeví za výrazné podpory některé z aktuálních společností zabývajících se touto problematikou. Je třeba zdůraznit, že tento návrhář má sloužit pro běžného uživatele bez speciálních znalostí či školení. Od začátku byl tvořen s důrazem na uživatelskou přívětivost a byly do něj vybrány jen nejpoužívanější funkce. Návrhář umožňuje externí napojení na libovolnou webovou technologii nebo přímé interní napojení v rámci technologie GWT. Oba způsoby mají své vhodné využití a jako čistě webové jsou obě nepochybně přínosem oproti standardnímu externímu používání desktopových návrhářů. Nicméně v některých případech může být napojení přes XML datový zdroj nedostatečné a integrovat jej přímo pomocí technologie GWT nemusí být možné (aplikace je postavena na jiné technologii, problém s licencí). Toto by bylo možné řešit doplněním externí integrace o vytvoření rozhraní pro přímé připojení do databáze pomocí JDBC. V případě, že by byla aplikace návrháře instalována na stejné lokální síti jako databáze pro následné získávání dat a bylo by zajištěné také spolehlivé přihlášení uživatele do webového návrháře, nemuselo být být toto otevřené spojení žádným bezpečnostním rizikem. Aktuálně návrhář poskytuje výběr nejpoužívanějších funkcí tiskových sestav a je skutečně možné jej nabídnout jako webovou alternativu desktopového. Pro běžné uživatelské reporty a jejich ad hoc úpravy je dostatečný. Nicméně pravděpodobně by nebylo spravedlivé jej plně srovnávat s více než 10 let vyvíjenými desktopovými variantami, které toho umí ještě podstatně více. Velmi zajímavé je porovnání uživatelského komfortu práce se šablonou tiskového výstupu webové a desktopové varianty (zejména manipulace se sekcemi a elementy). Dovolím si tvrdit, že komfort je téměř srovnatelný a to je pro webovou aplikaci velký úspěch. Stále zde zůstává velký prostor pro napojení mnoha dalších funkcí samotných
7 DISKUZE
57
tiskových sestav (grafy, podřízené reporty) nebo např. pro lokalizaci návrháře do více jazyků. Podstatné je, že v průběhu implementace webového uživatelského rozhraní nebyly objeveny žádné zásadní překážky, a tak je pravděpodobně možné postupně implementovat všechny funkce vybraného desktopového návrháře. Další rozvoj bude značně záviset na úspěchu při reálném použití. Nabízí se také varianta uvolnit celé řešení jako open source pod některou ze svobodných licencí. Nicméně vzhledem k použitým komponentám Sencha GXT by bylo možné přímo použít jen licenci GPL.
8 ZÁVĚR
8
58
Závěr
V souladu se zadáním této práce byl nejprve navržen a poté i úspěšně implementován webový návrhář uživatelských tiskových sestav v jazyce Java. Nejprve byly zhodnoceny současné požadavky na návrh tiskových sestav, a to jak z hlediska funkcí pro tvorbu výstupů, tak z hlediska funkcí uživatelského rozhraní návrháře. Na základě vybraných požadavků bylo provedeno srovnání dostupných nástrojů pro tvorbu tiskových sestav s důrazem na část zajišťující vlastní generování tiskových sestav. V části návrh řešení byl vybrán tiskový generátor JasperReports. Výsledky srovnání jednotlivých nástrojů byly těsné, ale přesto vybraný nabízí nejvíce funkcí pro prezentaci i zpracování dat, mnoho výstupních formátů a také nejjednodušší definici šablony ve formátu XML. Pro zajištění dostatečného komfortu uživatelského rozhraní byla vybrána kombinace webových technologií Google Web Toolkit a moderních komponent Sencha GXT, které umožňují realizaci mnohých pokročilých uživatelských funkcí. Využitelnost v současných webových aplikacích je zajištěna možností externího napojení do libovolné webové aplikace pomocí XML datového zdroje (skutečně libovolné, nemusí běžet nad platformou Java) nebo přímé integrace do libovolné GWT aplikace (pak je možno naopak využít libovolný datový zdroj). Implementace byla ve srovnání se standardní webovou aplikací velmi náročná. Samotná technologie GWT je skutečně mocná a automaticky vyřeší za programátora mnoho věcí (např. podporu více prohlížečů nebo používání jednoho jazyka na straně serveru i klienta), ale je také složitá. To má dopad nejen na náročnost na znalosti při psaní kódu, ale i na vlastní průběh a způsob vývoje aplikace. Automatický převod z jazyka Java do JavaScript pro všechny podporované prohlížeče je výpočetně náročný, a tak je i na rychlém počítači vývoj zdlouhavý – programátor musí často čekat. To částečně řeší vývojový mód, kdy nedochází k hromadnému převodu do JavaScriptu, ale ani tento režim není bez problémů a má zase jiná úskalí. Navíc je při složitější komunikaci se serverem třeba programovat pomocí událostí a jejich řízení, není možné synchronní volání metod. Takto je možno dosáhnout přívětivějšího uživatelského rozhraní, ale je třeba se naučit nové techniky programování. Když se k tomu přidají ještě komponenty Sencha GXT, které toho opět nabízí velmi mnoho, ale také je nutné mít nemalé znalosti pro jejich zdárné používání, nároky na programátora jsou opravdu vysoké. Nicméně i přes všechny tyto překážky se podařilo vytvořit skutečně komfortní
8 ZÁVĚR
59
uživatelské rozhraní, jehož tvorba by v jiných technologiích pravděpodobně stála ještě podstatně vyšší úsilí – pokud by vytvoření takového rozhraní bylo vůbec možné. Webový návrhář je zejména při práci se sekcemi a elementy tiskové šablony přibližně stejně uživatelsky přívětivý jako jeho desktopová varianta (podobnost uživatelských rozhraní je možné srovnat na Obrázcích č. 1–4 a vybrané pokročilé funkce jsou zachyceny na Obrázcích č. 5–7 v příloze této práce). Vzhledem k tomu, že jej není třeba instalovat a může být dokonce integrován ve webové aplikaci, je skutečně usnadněním tvorby uživatelských tiskových sestav. Původně nezamýšlenou funkcí navíc je pak možnost veřejného vystavení tohoto návrháře pro obecné použití. Tato vlastnost vyplývá z možnosti externího napojení na libovolný XML datový zdroj. Pokud bych byl postaven znovu před stejný úkol, zvolil bych pravděpodobně i přes vysokou náročnost stejné technologie i postup. Cílem nebylo usnadnění práce programátora, ale usnadnění práce uživatele. Výsledný komfort uživatelského rozhraní za tuto cenu stojí.
9
9
REFERENCE
60
Reference
AHAMMAD, Shamsuddin. iReport 3.7. Packt Publishing 2010. 236 s. ISBN 9781847198808. DANCIU, Teodor; CHIRITA, Lucian. The Definitive Guide to JasperReports. New York: Springer-Verlag New York Inc, 2007. 218 s. ASIN: B001E7LSRC. HANSON, Robert; TACY, Adam. GWT in Action : Easy Ajax with the Google Web Toolkit. Manning Publications, 2007. 600 s. ISBN 978-1933988238. HEFFELFINGER, R. David JasperReports for Java Developers. Packt Publishing, 2006. 339 s. ISBN 1-904811-90-6 HEROUT, P. Java - bohatství knihoven. České Budějovice: KOOP, 2006. 251 s. ISBN 80-7232-288-5. KAY, Michael.XPath 2.0 Programmer’s Reference (Programmer to Programmer). Wrox, 2004. 552 s. ISBN 978-0-764-56910-4. PEH, Diana; HAGUE, Nola; TATCHELL, Jane. BIRT: A Field Guide to Reporting. Pearson Education, 2008. 763 s. ISBN 978-0-321-58027-6. VAUGHAN, Daniel.Ext GWT 2.0: Beginner’s Guide. Packt Publishing, 2010. 320 s. ISBN 978-1-849-51184-1. WARD, John.Practical Data Analysis and Reporting with BIRT. Packt Publishing, 2009. 312 s. ISBN 978-1-847-19109-0. WEATHERSBY, Jason; BONDUR, Tom; CHATALBASHEVA, Iana. FRENCH, Don; Integrating and Extending BIRT. Pearson Education, 2008. 724 s. ISBN 978-0-321-58030-6. WILL, Gorman.Pentaho Reporting 3.5 for Java Developers Packt Publishing, 2009. 300 s. ISBN 978-1-847-19319-3.
Přílohy
A ELEKTRONICKÁ PŘÍLOHA
62
A Elektronická příloha Přílohou této práce je CD s elektronickým obsahem. • /WebReports.war - distribuce webového návrháře (Web application archive) • /dp.pdf - elektronická verze diplomové práce.
63
B NÁHLEDY APLIKACE
B Náhledy aplikace
Obrázek 1: Webový návrhář WebReports
Obrázek 2: Desktopový návrhář Eclipse BIRT
64
B NÁHLEDY APLIKACE
Obrázek 3: Desktopový návrhář iReport
Obrázek 4: Desktopový návrhář Pentaho Reporting
B NÁHLEDY APLIKACE
Obrázek 5: WebReports - rozložení ovládacích prvků
Obrázek 6: WebReports - dynamická změna pozice elementů (Drag&Drop)
Obrázek 7: WebReports - dynamická změna velikosti elementů
65