Flash MX 2004 pro vývojáře webových aplikací

CYAN

MAGENTA

YELOW

CYAN

BLACK

MAGENTA

E N C Y K L O P E D I E

Flash MX 2004

pomocí Flash Remoting, nebo webových služeb.

• Udržování a sdílení stavu mezi

• Flash MX pro serverové

„zažrance“ pracující v ColdFusion, ASP.NET, Java...

• Programování ve skriptovacím jazyku ActionScript 2.0.

• Budování rozkošných formulářů pomocí Flashe

• Připojování sad záznamů k vizuálním ovládacím prvkům pomocí nových databázových schopností Flashe...

www.zoner.cz © Foto: Jiří Heller, www.heller.cz Fotografie z nabídky fotobanky HELLER.CZ

E N C Y K LO P E D I E W E B D E S I G N E R A

KATALOGOVÉ ČÍSLO: ZR411

ISBN 80-86815-12-9

pro vývojáře

rozhraními Flashe a webovými sezeními.

Pod tímto logem vycházejí publikace určené pro každého, kdo se zajímá o tvorbu webových stránek. Od ryze praktických příruček a průvodců až po komplexní publikace o všem, co potřebuje webdesignér při každodenní práci. Na slevy, které můžete získat, a vydavatelský plán, v němž vedle knih domácích odborníků najdete celou řadu titulů světově uznávaných autorů, se informujte na adrese vydavatelství.

Věrným čtenářům je určen výhodný PRÉMIOVÝ PLUS PROGRAM.

webových aplikací

• Využití Flashe při tvorbě

dynamických webových aplikací.

• Komunikace se servery, výměna

dat, načítání a rozklad XML, připojování k webovým službám a další pokročilá témata.

FLASH ASH

• Volání metod na serveru

pro vývojáře

MX 2004

a serverem přes čistě textové soubory nebo XML.

PROFESSIONAL

• Výměna dat mezi klientem

Flash MX 2004

webových aplikací

Nate Weiss

Tato kniha je speciálně určena webovým vývojářům – serverovým „kejklířům“–, kteří se chtějí naučit, jak pomocí Flashe zdokonalit své webové aplikace. Vývojové a programovací postupy ve Flashi se zde učí praxí, vytvářením ukázkových objektů a vizuálních rozhraní, přičemž všechny předvádějí jistý druh integrace se serverem.

Proč byste se měli nejdříve učit Flash, a teprve pak o integraci dat?

Tato kniha vás naučí obojí najednou. Všechny příklady v knize obsahují jak kód na serveru, tak i kód u klienta. Oba kódy spolupracují tak, aby prezentovaly vaše data působivě a interaktivně. Ukázky zahrnují posouvací rozhraní, sdílené prvky dat, animované sloupcové grafy, zobrazování v reálném čase a řadu dalších. Ve všech příkladech jsou k dispozici samostatné kódy na serveru pro vývojáře ColdFusion, ASP. NET a Java. Kromě toho se velmi pečlivě vysvětluje kód u klienta, s četnými poznámkami a křížovými odkazy na dokumentaci Macromedia.

Mezi klíčová témata patří: Flashe se servery v ColdFusion, ASP.NET nebo Java.

• Ukázkové příklady kódu na straně serveru ve formě pro ColdFusion, ASP.NET a Java/J2EE.

• Flash a sezení, cookies,

formuláře a ověřování dat, práce s obrazovkami...

flash_geeks.indd 1

YELOW

Nate Weiss

www.zonerpress.cz

ZONER software, s.r.o., Koželužská 7, 602 00 Brno

MAGENTA

© Foto: Jiří Heller

Nate Weiss

Zoner Press tel.: 532 190 883 fax: 543 257 245 e-mail: knihy@zoner.cz http://www.zonerpress.cz

CYAN

W E B D E S I G N E R A

PROFESSIONA L

ZONER software, s.r.o. významný producent software v oblasti digitální fotografie, počítačové grafiky a multimédií, poskytovatel internetových služeb, souvisejících s prezentací na internetu a e-komercí, a nakladatelství odborné literatury.

pro vývojáře

• Integrace klientských rozhraní

BLACK

ENCYKLOPEDIE WEBDESIGNERA

PROFESSIONAL

webových aplikací

YELOW

9 7 8 8 0 8 6

BLACK

8 1 5 1 2 1

CYAN

MAGENTA

YELOW

BLACK 1.10.2004 12:37:02

Flash MX Professional 2004 pro vývojáře webových aplikací

Flash MX 2004 PROFESSIONAL

webových aplikací

pro vývojáře

Nate Weiss

Authorized translation from the English language edition, entitled MACROMEDIA FLASH MX PROFESSIONAL 2004 FOR SERVER GEEKS, 1st Edition, 0735713820 by WEISS, NATE, published by Pearson Education, Inc, publishing as New Riders, Copyright © 2004 by Nate Weiss.

All rights reserved. No part of this book may be reproduced or transmitted in any form or by any means, electronic or mechanical, including photocopying, recording or by any information storage retrieval system, without permission from Pearson Education, Inc. CZECH language edition published by ZONER software s.r.o., Copyright © 2004 Autorizovaný překlad anglického vydání nazvaného MACROMEDIA FLASH MX PROFESSIONAL 2004 FOR SERVER GEEKS, první vydání, 0735713820 autor WEISS, NATE, vydal Pearson Education, Inc, ve vydavatelství New Riders; Copyright © 2003 New Riders Publishing.

Všechna práva vyhrazena. Žádná část této publikace nesmí být reprodukována nebo rozšiřována žádnou formou nebo způsobem, elektronicky ani mechanicky, včetně fotokopií a natáčení, ani žádnými jinými systémy pro ukládání dat bez výslovného svolení Pearson Education, Inc. České vydání vydal ZONER software s.r.o., Copyright © 2004.

Macromedia Flash MX Professional 2004 pro vývojáře webových aplikací Autor: Nate Weiss Copyright © ZONER software s.r.o. Vydání první v září 2004. Všechna práva vyhrazena.

KATALOGOVÉ ČÍSLO: ZR411 Zoner Press ZONER software s.r.o.

Koželužská 7, 602 00 Brno Překlad: RNDr. Jan Pokorný Odpovědný redaktor: Ing. Pavel Kristián DTP: Pavel (Mr.Penguin) Kristián © Cover foto: Jiří Heller, HELER.CZ s.r.o., www.heller.cz © Cover a layout: Ing. Pavel Kristián Informace, které jsou v této knize zveřejněny, mohou byt chráněny jako patent. Jména produktů byla uvedena bez záruky jejich volného použití. Při tvorbě textů a vyobrazení bylo sice postupováno s maximální péčí, ale přesto nelze zcela vyloučit možnost výskytu chyb.

Vydavatelé a autoři nepřebírají právní odpovědnost ani žádnou jinou záruku za použití chybných údajů a z toho vyplývajících důsledků.

Všechna práva vyhrazena. Žádná část této publikace nesmí být reprodukována ani distribuována žádným způsobem ani prostředkem, ani reprodukována v databázi či na jiném záznamovém prostředku či v jiném systému bez výslovného svolení vydavatele s výjimkou zveřejnění krátkých částí textu pro potřeby recenzí.

Veškeré dotazy týkající se distribuce směřujte na: Zoner Press ZONER software s.r.o.

Koželužská 7, 602 00 Brno tel.: 532 190 883, fax: 543 257 245 e-mail: knihy@zoner.cz http://www.zonerpress.cz

ISBN 80-86815-12-9

5

Přehled Úvod . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19

Část I

Rychlý vstup do Flashe

23

Seznamte se s Flashem . . . . . . . . . . . . . . . . . . . . . . . 25 Vaše první rozhraní ve Flashi . . . . . . . . . . . . . . . . . . . . 43 Kopeme víc do hloubky . . . . . . . . . . . . . . . . . . . . . . . 91

Část II

Klíčové pojmy Flashe z hlediska vývojáře

119

Slabikář ActionScriptu . . . . . . . . . . . . . . . . . . . . . . 121 Animační klipy jako objekty. . . . . . . . . . . . . . . . . . . . 177

Část III

Připojování k datům

213

Připojování k serverům pomocí čistých textových souborů . . . . . . 215 Připojování k serverům pomocí XML . . . . . . . . . . . . . . . 249 Připojování k serverům pomocí Flash Remoting. . . . . . . . . . . 283 Připojování k serverům pomocí webových služeb . . . . . . . . . . 335

Část IV

Využívání Flashe pro sběr dat

383

Flash a sezení . . . . . . . . . . . . . . . . . . . . . . . . . . 385 Budování lepších formulářů s Flashem . . . . . . . . . . . . . . . 429

Část V

Dodatky

479

Připomínky k budování komponenty SimpleBarChart . . . . . . . . 481 Politiky přístupu k datům přes domény v přehrávači Flashe 7 . . . . . 507

Rejstřík . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 513 Tabulky . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 526 Výpisy . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 527

6

FLASH MX Professional 2004 pro vývojáře webových aplikací

7

Obsah O autorovi O odborných recenzentech Poděkování Sdělte nám svůj názor

15 15 16 18

Úvod . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19 Mé vlastní prvotní zážitky s Flashem Komu je kniha určena?

Pro koho kniha vhodná není?

Část I KAPITOLA

1

Závěrem...

21

Rychlý vstup do Flashe

23

Seznamte se s Flashem . . . . . . . . . . . . . . . . . . . . . . . 25 Proč Flash?

Co se v něm hodí pro vás?

Jak se Flash připojuje k serverům

Jaké jazyky budete používat Stručná lekce z terminologie Historický vývoj Flashe Stručná projížďka integrovaným vývojovým rozhraním Flashe První pohledy Časová osa Panel nástrojů Plocha Panel komponent Panel akcí Panel vlastností Panel nápovědy

Příprava vašeho serveru pro příklady knihy Příprava databáze Příprava softwaru serveru, který jste si zvolili Umístění ukázkových souborů do kořenové složky dokumentů webového serveru

Shrnutí KAPITOLA

2

19 20 20

25 26 26

27 28 30 32 32 34 35 35 36 37 37 37

38 38 39 41

41

Vaše první rozhraní ve Flashi . . . . . . . . . . . . . . . . . . . . 43 Příprava: dodávaní dat do Flashe Kódování dat pro Flash ve formě prostých „proměnných“ Jak se to udělá v ColdFusion Jak se to udělá v ASP.NET

43 44 45 47

8

FLASH MX Professional 2004 pro vývojáře webových aplikací

Jak se to udělá s Javou

Budování Flashového rozhraní Přidávání vizuálních prvků Načtení a zobrazení dat pomocí ActionScriptu Publikování a testování rozhraní Přístup k animačnímu klipu z hlavní časové osy

Vytváření navigace pomocí tlačítek a XML Dodávání informací do Flashe v podobě XML Dodávání XML z ColdFusion Dodávání XML z ASP.NET Dodávání XML z Javy Rychlé seznámení s objektem XML Flashe Prohlížení výstupů generovaných příkazy trace Načtení externího SWF při běhu Vytváření prostých tlačítek reagujících na přítomnost kurzoru myši Přidání ActionScriptu událostem tlačítka Vytvoření ArtistButtonClip pro každého hudebníka při běhu Otestování tlačítek

Přidání rozhraní do webové stránky Kopírování a vkládání HTML Relativní versus absolutní URL pro načítání dat serveru Hej, mrkněte se na velikost tohoto souboru!

Tak co, nebylo to až tak hrozné, že?

Shrnutí KAPITOLA

3

51

52 52 55 61 63

64 65 66 67 68 69 72 73 75 79 81 83

84 84 88 88

89 89

Kopeme víc do hloubky . . . . . . . . . . . . . . . . . . . . . . . 91 Co je to knihovna a symboly Symboly a instance Další schopnosti dostupné v knihovně

Co je časová osa Časová osa v IDE Flashe Přidání animace pomocí časové osy Řízení přehrávání animace z ActionScriptu Skok na snímek pomocí názvu, ne pomocí čísla Vyrovnání vykreslované animace, aby byla přirozenější Rozhodnutí, na který snímek skočit při běhu

Doplňující informace o tlačítcích Změna vzhledu tlačítka, když se na ně umístí kurzor myši Události tlačítka Neviditelná tlačítka a snímek Hit

Další informace o animačních klipech Hlavní časová osa versus časové osy animačních klipů Časové osy jako stavový mechanizmus

91 92 95

96 96 97 101 103 105 105

106 107 108 110

111 112 113

Obsah

Cílové cesty, rodiče a potomci Několik slov ke klíčovému slovu this Události animačních klipů

Část II KAPITOLA

4

9 113 115 116

Co jsou komponenty Co bude dál Shrnutí

116 117 118

Klíčové pojmy Flashe z hlediska vývojáře

119

Slabikář ActionScriptu . . . . . . . . . . . . . . . . . . . . . . 121 Informace o ActionScriptu Vztah ActionScriptu k JavaScriptu a k ECMAScriptu Stručná historie Co je nového v ActionScriptu 2.0

IDE dělá práci za vás Umístění a aktivace panelu Actions Nástroje panelu Actions Pomozte panelu akcí rozpoznat, jakého typu jsou vaše proměnné Preference panelu Actions Panel nápovědy

Základní prvky jazyka

121 122 123 123

124 124 126 129 132 133

133

Komentáře Základy syntaxe Proměnné Podmínkové příkazy Výrazy Cykly

133 134 136 140 142 144

Zábava s datovými typy

147

Čísla Řetězce Datum Pole Asociativní pole

Vytváření vlastních funkcí Základy Argumenty Návratové hodnoty funkcí Striktní typování Ukládání funkcí do separátních souborů ActionScriptu

Vytváření vlastních tříd Jak se dají vytvářet nové třídy Dědění

147 147 148 149 150

151 151 151 153 153 154

155 156 167

10

FLASH MX Professional 2004 pro vývojáře webových aplikací

Reakce na události Reakce na události pomocí klasického událostního modelu Reakce na události pomocí událostního modelu naslouchajících objektů

Shrnutí KAPITOLA

5

Vybudování jednoduchého příkladu, v němž se využije pás Členy podomácku vyrobené třídy GestureMovieClip Prohlídka kódu GestureMovieClip

Animační klipy v knihovně Specifikace tříd ActionScriptu 2.0 pro symboly v knihovně Připojování animačních klipů z knihovny pomocí identifikátorů vazby Změna vzhledu a pozice klipu Odstraňování klipů

Reakce na pohyby myši Drobný úkrok stranou: Plánování volání metod pomocí setInterval() Zjištění aktuální pozice kurzoru myši Okamžitá aktualizace změn v klipu pomocí updateAfterEvent()

Přidávání obsahu do animačních klipů při běhu Kreslení čar a obrazců programátorsky Vytváření maskovacích klipů programátorsky Přeměna klipů na komponenty Shrnutí

KAPITOLA

Připojování k datům 6

Získávání strukturovaných dat Zobrazování strukturovaných dat jako reklamní upoutávky Průzkum ukázkového dokumentu newsTicker.fla Zachytíme textová data a provedeme jejich rozklad sami Výlety tam a zpět: odesílání proměnných na server

Další prostředky pro odesílání a načítání proměnných Shrnutí 7

174 177 183 184 188 190

192 192 195 198 199

200 200 202 204

205 206 207 210 212

213

Připojování k serverům pomocí čistých textových souborů . . . . . . 215 Práce s třídou LoadVars

KAPITOLA

170 172

Animační klipy jako objekty. . . . . . . . . . . . . . . . . . . . 177 Třída MovieClip Výuka příkladem: objekt filmového pásu řízený myší

Část III

169

215 217 225 226 232 238

247 248

Připojování k serverům pomocí XML . . . . . . . . . . . . . . . .249 Práce s třídou XML Stručný přehled terminologie XML Členy třídy XML

249 250 252

Obsah

Typický způsob práce s XML Naplnění svitku řízeného gesty pomocí XML

Použití XPath ve Flashi Jak vašemu dokumentu zpřístupníte třídu XPathAPI Základy práce s XPathAPI Konkrétní příklad

Práce s komponentou XMLConnector Shrnutí KAPITOLA

8

11 255 256

271 272 273 274

279 282

Připojování k serverům pomocí Flash Remoting. . . . . . . . . . . 283 Úvod do Flash Remoting Flash Remoting versus webové služby Které aplikační servery se podporují? Špetka terminologie Remoting

Přípravné práce Instalace klientských komponent do IDE Flashe Instalace komponent na serveru

Váš první projekt Flash Remoting Kód na serveru ASP.NET Práce u klienta Několik podrobností k adresám URL brány Podrobnosti k funkcím odpovědi Podrobnosti k reakcím na stavové události

283 284 285 286

286 287 288

289 290 291 293 298 301 302

Práce se speciálním odlaďovačem Flash Remoting Třídy Flash Remoting: miniaturní referenční příručka

303 304

Třída NetServices: připojování ke vzdálenému serveru Třída NetConnection: připojování ke specifické službě Třída RecordSet: přístup k výsledkům dotazu

304 305 305

Vyspělejší příklad Na serveru U klienta

Flash Remoting a vázání dat Spolupráce RecordSet a DataSet Úvod do komponenty DataSet Přidání komponent pro vázání dat do příkladu Song Rater Základní členy třídy DataSet

Co jste se o Flash Remoting nedozvěděli Postupně načítané sady záznamů Podrobnosti vztahující se k serverům Pole a jiné datové typy Řazení a filtrování sady záznamů u klienta

307 308 310

320 321 321 323 330

331 332 332 333 333

12

FLASH MX Professional 2004 pro vývojáře webových aplikací

Open Source Remoting – alternativní implementace a nástroje Shrnutí KAPITOLA

9

333 334

Připojování k serverům pomocí webových služeb . . . . . . . . . . 335 Přehled podpory webových služeb ve Flashi

335

Co jsou to webové služby?

Jak člověk vytvoří webovou službu?

Několik stručných definic Flash jako klient webové služby Volby pro připojování k webovým službám

335 336 336 338 338

Práce s komponentou WebServiceConnector

339

Kód na serveru Komponenty použité v příkladu Rating Chart Referenční příručka komponenty WebServiceConnector Základní způsob používání komponenty WebServiceConnector Několik slov ke komponentě SimpleBarChart Kód ActionScriptu

Panel Web Services Protokolování činností komponent WebServiceConnector Připojování k webové službě pouze pomocí skriptu Webové služby a vázání dat

341 356 358 360 363 364

369 370 371 376

Kód na serveru 376 Komponenty WebServiceConnector, DataSet a ovládací prvky uživatelského rozhraní 377 Změny v kódu ActionScriptu 377

Bezpečnostní politiky Flashe a webové služby jiných výrobců Shrnutí

Část IV KAPITOLA

Využívání Flashe pro sběr dat 10

382 382

383

Flash a sezení . . . . . . . . . . . . . . . . . . . . . . . . . . 385 Pojmy týkající se stavu sezení – stručná rekapitulace Předávání proměnných URL a formuláře Krok 1. Předávání proměnných do Flashe Krok 2. Předávání proměnných zpět na server

386 387 387 390

Sdílení proměnných sezení s Flashem

393

Flash jako účastník sezení Udržování stavu sezení bez cookies

393 395

Sdílení cookies s Flashem Uchovávání dat pomocí lokálních sdílených objektů Třída SharedObject Jak se souborům SWF umožní sdílet stejné lokální sdílené objekty

396 397 398 400

Obsah

Lokální sdílené objekty a velikostní limity

Dáme všechno do kupy: sledujeme přihlašování uživatelů Kód na serveru Kód u klienta Otestujeme to

Shrnutí KAPITOLA

11

403 416 426

427 430

Výhody a nevýhody formulářů založených na Flashi Které ovládací prvky máte k dispozici Bohatě vybavené internetové aplikace

430 432 433

Úvahy o ověřování platnosti dat na formulářích Jednoduché ověřování založené na skriptu Ověřování platnosti vázaných dat Ověřování platnosti dat v reálném čase na serveru Příklad pořizování dat o zákazníkovi

Načítání externího obsahu do obrazovek Specifikace externího obsahu v době návrhu Načítání externího obsahu přes skript Přístup k externímu obsahu poté, co se načetl Přidání komponenty ProgressBar

Shrnutí

Dodatky A

401

Flash jako motor pohánějící formulářovou prezentaci

Dva druhy dokumentů založených na obrazovkách Vytváření dokumentů založených na obrazovkách Skriptování obrazovkových formulářů Připojování kódu ActionScriptu k obrazovkám

DODATEK

400

Budování lepších formulářů s Flashem . . . . . . . . . . . . . . . 429

Základy odesílání formulářů Úvod do formulářových obrazovek

Část V

13

434 436 436 437 442 446

449 451 454 460 461

473 473 474 475 475

478

479

Připomínky k budování komponenty SimpleBarChart . . . . . . . . 481 Informace o komponentách Flashe MX 2004 Rozdíly mezi komponentami a obyčejnými animačními klipy Informace o komponentě SimpleBarChart Referenční příručka SimpleBarChart Vytvoření komponenty SimpleBarChart

481 482 483 483 485

Co byste si měli vyhledat ve zdrojovém dokumentu Požadované prvky v souboru ActionScriptu komponenty Označení vlastností tak, aby byly nastavitelné v době návrhu Zdrojový kód ActionScriptu komponenty SimpleBarChart

485 487 489 490

14

FLASH MX Professional 2004 pro vývojáře webových aplikací

Opětovná kompilace komponenty pro provedení změn Shrnutí DODATEK B

504 506

Politiky přístupu k datům přes domény v přehrávači Flashe 7 . . . . . 507 Jak se politika vynucuje Vytvoření souboru politiky přes domény Záležitosti, které nesmíte pustit se zřetele

508 509 510

Obecné věci týkající se souboru politiky Soubory politik a verze přehrávače Flashe

511 511

REJSTŘÍK . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .513 TABULKY . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 526 VÝPISY . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 527

15

O autorovi Nate Weiss buduje komerční aplikace s různými technologiemi webových serverů asi tak 7 či 8 posledních let.

V těchto aplikacích používá stále větší počet objektů založených na Flashi, aby se zvýšila použitelnost a kompatibilita vybraných uživatelských rozhraní.

Nate vystupuje na vývojářských konferencích společnosti Macromedia a na setkáních uživatelských skupin na řadu témat, od XML až po skriptování. Několik let byl členem podpůrné skupiny týmu Macromedia a jeho příspěvkem byl SDK do projektu Open WDDX. Byl přispěvovatelem do řady bestsellerů Bena Forty o ColdFusion. Zabývá se i výrobou komponent a podniká různé další experimenty s kódem, které jsou dostupné na jeho webu www.nateweiss. com. Můžete mu psát na nate@nateweiss.com.

O odborných recenzentech Oba uvedení recenzenti přispívali značnou měrou svými ručně prováděnými expertízami po celou dobu procesu vývoje knihy. Jakmile jsem napsal nějakou kapitolu, prohlédli tito zasvěcení profesionálové veškerou látku po odborné stránce a prověřili uspořádání i logický sled výkladu. Jejich připomínky byly klíčové proto, aby bylo zajištěno, že text – a soubory Flashe, ActionScriptu, ColdFusion, ASP.NET a Java, které ho doprovázejí – uspokojí touhu čtenářů pro odborných informacích nejvyšší kvality.

John Grden je hlavní vývojář Macromedia Flash u Zing.com a také zakladatel a vlastník AcmeWebWorks.com. Zing.com je dnes přední 3D interaktivní web typu chat. Rozhraní Zing.com je kompletně udělané ve Flashi a pracuje v součinnosti s několika serverovými technologiemi, jako jsou Flash Communication Server MX, ASP a Java. Kromě moderování jedné z nejrozsáhlejších uživatelských konferencí na internetu vztahujících se k Macromedia, tráví John většinu svého flashového vývojářského času tím, že vytváří jedny z nejpůsobivějších webových flashových her. V současné době je zaměstnaný opětovným vytvářením specifických her založených na populárních akčních seriálech. Nejsou k dispozici jen na jeho webu, ale brzy budou dostupné na www.TheForce.net. John má certifikát Macromedia Flash Designer. Další informace o něm a o tom, co dělá, najdete na AcmeWebWorks.com.

Kathy Hester tráví většinu svého času jako školitelka webových designérů a vývojářů. Když zrovna nevede tréninky, pracuje jako nezávislá designérka. Ve svém volném čase řídí New Orleans ColdFusion User Group a spolu s Hal Helmsem vyučuje metodologii Fusebox. Můžete jí psát na kathyhes@realsheep.com.

16

FLASH MX Professional 2004 pro vývojáře webových aplikací

Poděkování Dobrá, pokusím se o to v chronologickém pořadí.

Zaprvé musím poděkovat Charlie Arehartovi, nejen za to, že přišel s originálním námětem na tuto knihu, ale že mi také její projekt přepustil. Bylo to něco v tom stylu, jako když je hollywoodský režisér požádán, aby adaptoval nějaký oblíbený román nějakého skvělého moderního spisovatele: režisér se všemožně snaží, aby zachoval ducha originálu, ale nakonec publikum pokrčí rameny a valný dojem to na ně neudělá. („Jo, docela to ušlo. Kniha je ale lepší.“) Nebo strýček ve velkoměstě, který byl požádán, aby se v létě staral o bratrova puberťáka. („Co se to stalo s mým chlapečkem? Tys mu dovolil ta tetování? To nemáš doma tekoucí vodu? A co to má v nose?“) Každopádně si Charlie myslím, že to jsi v zásadě měl na mysli. Ještě jednou díky.

Musím také poděkovat Benovi Fortovi, patronu vydavatelských činností vztahujících se k Macromedia, že pomohl Charliemu a mně s počátečními nápady pro knihu, odpovídal na mé dotazy a trpělivě mě vybavoval potřebnými informacemi. Když jsem knihu psal, často mi přes levé rameno nakukovalo černé svědomí v podobě miniaturního Bena (fuj, to jsem se lekl – myslím, že za mým pravým ramenem zase na mě vybafla Linda), což mě podněcovalo a inspirovalo k tomu, abych své příklady ještě trochu více propracoval a ještě trochu lépe vysvětlil.

Díly patří také Angele Kozlowski, Robinu Dennisovi a Sáře Hohnové, že si udělali čas a poskytli mi své rady a své profesionální názory na knihu ještě před tím, než jsem ji začal psát.

Děkuji své tetě a svému strýčkovi, Gigi a Donu Spatesovým, za jejich společnost, a za to, že jsem mohl používat při psaní několika prvních kapitol knihy jejich rybník, verandu a dům, na tak příjemném místě, jakým je North Fork na Long Islandu.

Prostřední kapitoly knihy jsem psal v úžasném a krásném městě Seattle ve státě Washington, kde jsem se měl opravdu skvěle, i když jsem pracoval více méně nepřetržitě. Nedokázal bych to, kdyby okolo mě nebyli Heather Greene a Matt Gershoff, mí bezvadní, neuvěřitelně vstřícní přátelé a kamarádi na cestách. Mraky díků Pam Robertsonové za to, že byla svolná mě ubytovat, že byla svolná vzít za vděk mnou a že byla celkově úžasná, pozitivně naladěná, vstřícná a že byla zrzavá. Díky patří i dalším: Apple a Tucker Martine, Keith, Eric, Floyd, Nineteen Pound Hammer, Jen, Calla, i tomu bezva chlápkovi ve žlutém tričku, že jsem měl tak příjemné zážitky. Také Amandě Wilde, Johnovi ráno a dalším DJ u KEXP (www.kexp.org), že mi poskytovali soundtrack. A taky kavárnám, Vita, Vivace, Ladro a Bauhaus, kde jsem trávil celé dny pitím toho nejprímovějšího kafé laté.

Vraťme se zpět do New Yorku. Zde bych chtěl poděkovat Jeanmarie a Stanu Williamsovým za jejich neutuchající podporu při dokončovacích pracích na knize. Všem mým kamarádům v New Yorku za jejich podporu a přátelství a za to, že nezapomněli, že existuji, i když jsem celé měsíce nevytáhl paty z bytu: Heather Greene a Matt Gershoff (ještě jednou), Liz a Andy Gershoff, Melissa Caruso a John Scott, Jenny Turner, Jason Stover, Jason Weeden, Desia a Brian Zumhagen, Rebekkah Linton, Shira Machleder, Dawne Eng, Jennifer Sainato, Lisa, Lars, Lucas a Lea Blackmore, Lee Gregory, Mary Godinho a Stephanie Hawkins. Také jsem zavázán několika báječným veřejným místům na Manhattanu: Rose Reading Room ve veřejné knihovně New

Poděkování

17

Yorku na 42. ulici, Cafe at HERE a Starbucsk na náměstí Astor (kde jsem byl jedním z několika otřesně vypadajících pozdně nočních návštěvníků). V Brooklynu: Flying Saucer Café, Ozzie’s na Páté a nový Tea Lounge na Union.

Velmi moc děkuji slečně Jen deHaan, která se potýkala se spoustou čtení beta-fór, se spoustou psaní ActionScriptu, se spoustou žádostí o posuvníky, se spoustou důvěrných dohod. Neobyčejně vitální vývojářka a designérka, která stahovala své zprávy i v parných letních večerech, kdy každý, komu ještě zbylo trochu zdravého rozumu, vypadl z New York City někam na zelené pláně Ohia.

Díky za podporu patří samozřejmě mé matce Sally, mé sestře Liz, mé sestřenici Carrie a příteli mé sestry Kenovi. Možná si to nemyslíte, ale všichni jste mi s tím moc pomohli. Díky také mému bratrovi Jonovi a mému otci Georgovi, že v duchu byli při mě.

Díky patří mým absolutně báječným odborným recenzentům, Kathy Hester a John Grden, za veškerou jejich pomoc, vedení a trpělivost, když jsem prozkoumával všechny možné škvíry, které oni už dobře znali. Konkrétně, Johne, ty jsi byl absolutně skvělý – a i když jsem ve Flashi o celou knihu dál, nedostal jsem se o nic blíž k tomu, abych pochopil, jak jsi dal dohromady ty kouzelné hry Star Wars.

Asi největší díky patří všem dobrým lidem u New Riders, kteří se postarali o to, abyste knihu dostali do rukou. Někteří lidé dělají týmovou práci a podporu docela dobře, ale tyto bohyně odborného publikování vynesly frázi „skupinové úsilí“ na zcela novou úroveň. Tisíceré díky mé vydavatelce, Stephanie Wall, že věřila v můj projekt, postrkovala mě po telefonu dopředu, a tu a tam vyházela některé mé lajdáckosti. Miliardy díků jdoucích přímo od srdce patří mé editorce, Lindě Bump, za její neuvěřitelnou, neochvějnou podporu a porozumění, a za to, že mě po celou dobu motivovala a dodávala mi dobrou náladu.

Nesčetné díky patří také mému korektorce, Jill Batistick, která tak pečlivě dohlížela na to, jak se vyjadřuji, vždy byla na mé straně, vydržela to se mnou, a vypořádala se s všemi mými nekonzistencemi a hloupém tvrdošíjném trvání na jistých frázích.

A děkuji také Tobě, laskavý čtenáři a excentrický kámoši serveru – ať jsi kdo jsi a kde jsi. Mášli nějaké potíže, dotazy nebo komentáře, klidně mi napiš na nate@nateweiss.com. Možná nebudu sto na všechny dotazy odpovědět, ale udělám, co budu moci.

-Nate

18

FLASH MX Professional 2004 pro vývojáře webových aplikací

Sdělte nám svůj názor Jako čtenáři knihy jste pro nás těmi nejdůležitějšími kritiky a komentátory. Vážíme si vašeho názoru, proto bychom rádi věděli, co děláme dobře a co bychom mohli dělat lépe, které oblasti byste chtěli rozebrat podrobněji. Oceníme i jakékoli jiné připomínky, které jste ochotni nám předat.

Jakožto hlavní redaktorka zodpovědná za příspěvky u New Riders Publishing vítám vaše komentáře. Můžete mi poslat fax, e-mail, případně mi napsat normálně o tom, co se vám na knize líbí nebo nelíbí. Nebo co bychom měli udělat, aby byly naše knihy poutavější. Pokud mi napíšete, nezapomeňte prosím připsat název knihy, ISBN a jména autorů, a také vaše jméno a telefon nebo fax. Vaše připomínky si pečlivě přečtu a podělím se o ně s autory a s redaktory, kteří na knize pracovali.

Vezměte prosím na vědomí, že vám nemohu pomoci s odbornými problémy, které se vztahují k tématům knihy, a že vzhledem k vysokému počtu emailů, které dostávám, možná nebudu sto odpovědět na každou zprávu.

Fax: e-mail: Pošta:

317-428-3382 linda.bump@newriders.com Linda Bump Senior Acquisitions Editor New Riders Publishing 800 East 96th Street, 3rd Floor Indianapolis, IN 46240 USA

Čtenáři českého překladu knihy mohou využít kontakt na vydavatele – Zoner Press: Zoner Press ZONER software s.r.o.

Koželužská 7 602 00 Brno Telefon: 532 190 883 Fax: 543 257 245 e-mail: knihy@zoner.cz http://www.zonerpress.cz

19

Úvod Milá čtenářko, milý čtenáři, začátkem roku jsem měl zajímavý telefonický hovor. Volal mi můj vysoce vážený kolega Charlie Arehart. Poskytuje poradenství a výuku všeho druhu pro webové vývojáře – obzvláště pro ty, kdo pracují pro firmy, které užívají technologie společnosti Macromedia. Charlie mi vysvětlil, že dostává stále víc a víc požadavků na informace a výuku ohledně napojení front-endů Flashe na databáze a na jiné back-endové systémy. A požadavky že přicházejí ne od dlouhodobých uživatelů Flashe, ale od nadšených přívrženců ColdFusion, od vývojářů ASP.NET a od programátorů Javy.

Problém je v tom, vysvětloval Charlie, že není dost knih o Flashi, o které by se mohl webový vývojář opřít. Jistě, existuje spousta obecných knih o Flashi, a většina z nich má na konci jednu či dvě kapitoly o integraci se serverem. Existuje sice pár knih, které se plně věnují technologiím integrace se specifickými servery, jako jsou Flash Remoting nebo Flash Communication Server, ty ale zase mají sklon předpokládat, že už je čtenář ve Flashi jako doma. Na stejném předpokladu bývají založeny i knihy o programování v ActionScriptu ve Flashi.

Protože nejsou k mání knihy, které by byly napsané přímo pro webové vývojáře, musejí si skoupit mnoho různých knih, a z každé přečíst několik málo kapitol. Nebo se musejí pokusit naučit se všechno sami. Online jsou sice dostupné menší nebo větší porce informací v podobě návodů, článků databáze vědomostí, uživatelských fór, webových uživatelských skupin a dokonce i tištěných časopisů, ale vyhledat všechny potřebné informace dá práci, a zabere to také dost času – a čas je něco, co vývojáři prostě nemají nazbyt.

Takže Charlieho idea byla, že by se měla o Flashi napsat taková kniha, která by považovala webové vývojáře za občany první kategorie. Kniha by měla vývojáře dostat „za vodu“, aniž by je nutila trávit mládí informacemi o kreslení, animacích a designu. Kniha že by se neměla snažit, aby obsahovala všechno pro všechny. Že by se měla soustředit na ty aspekty Flashe, o které se budou nejvíce zajímat vývojáři.

Byl jsem pro?

Samozřejmě. Přesně po takové knize jsem toužil, když jsem se sám učil Flash. Když už o tom mluvím...

Mé vlastní prvotní zážitky s Flashem Před několika lety jsem usoudil, že by se mi v dynamických webových aplikacích, které jsem tehdy vytvářel, mohl hodit Flash. Požadavky kladené na projekt volaly po tricích, které se rodily opravdu v bolestech, když jste je měli dělat pomocí obvyklých technik skriptování u klienta a HTML. O Flashi jen nevěděl prakticky nic, jen jsem už jistou dobu sledoval vývoj technologií.

Bylo mi známo, že stále víc a víc lidí Flash využívá pro shromažďování a prezentování aktuálních

20

FLASH MX Professional 2004 pro vývojáře webových aplikací

informací z databází a tak podobně. Takže jsem si řekl, že by nemělo být příliš obtížné, aby Flash dělal to, co potřebuji.

A skutečně, nebylo to příliš obtížné. Problém byl v tom, že to ale nebylo nijak zvlášť snadné. Při práci jsem se stále nemohl zbavit dojmu, že jsem se ocitl někde, kde ale vůbec nejsem jako doma. Pracovní prostředí Flashe bylo evidentně vyvinuté pro umělce a grafické designéry – a zdálo se, že je posedlé abstraktními pojmy, jako jsou gradientní barvy a časové osy, které mi k ničemu nebyly. Připadalo mi to, jako kdybych vpadl na večírek umělecko průmyslové školy – milé a příjemné místo na návštěvu, ale ne místo, kde bych to se svým talentem někam dotáhl.

Kromě všeobecného pocitu, že jsem mimo, byla tu také fakt, že ty části Flashe, které by mi vypomohly při komunikaci s mým serverem, jsem poněkud postrádal. Jistě, mohl jsem volat svůj server a vyměňovat data, ale celý proces vypadal trochu sflikovaný. Zdálo se mi, že chybí jasný, strukturovaný model pro budování takových rozhraní, jaké jsem chtěl pro své uživatele.

To se všechno stalo už před nějakou dobou, kdy aktuální verzí byl Flash 4. Od té doby ušel dlouhou cestu. Většina věcí, která byla obtížná, je snazší. S každou novou verzí jsou také stále vyspělejší schopnosti týkající se připojování k serverům. Současný Flash je plnohodnotný nástroj pro vývoj aplikací právě tak jako pro design, pokud víte, jak s ním pracovat. Je to skvělý produkt, schopný podivuhodně různorodých věcí a zažijete hodně radosti a zábavy, když se s ním seznámíte.

Komu je kniha určena?

Knihu jsem napsal pro vývojáře webových aplikací, kteří neznají Flash, kteří ho ale chtějí využít ve svých internetových/intranetových/extranetových aplikacích. V ideálním případě se poměrně málo zajímáte o vytváření obrovitých „čistě Flashových“ webů, které používají Flash proto, aby se vyhnuly zážitkům s prohlížeči. Spíše se zajímáte o občasné využití Flashe při řešení specifických úloh, které nejde snadno vyřešit tradičními technikami HTML a skriptování.

Abyste z knihy vytěžili co nejvíc, musíte znát alespoň jedno z těchto vývojových prostředí: ColdFusion MX, ASP.NET nebo Java/JSP/J2EE. Pracujete-li s PHP, Perlem nebo s jiným prostředím pro vývoj webových aplikací, i tak vám kniha pomůže, budete si ale muset kód na straně serveru přizpůsobit tak, aby pracoval ve vašem prostředí. (Adaptace by neměla být příliš náročná, protože jsem se snažil kód týkající se serveru udržet tak jednoduchý, jak to jen šlo.)

Pro koho kniha vhodná není?

Dobrá otázka. Jak to vidím já, není pro vás kniha vhodná tehdy, když je pravdivé alespoň jedno z následujících tučných konstatování: • Neznáte servery. Kniha byla napsána pro lidi, kteří rozumějí vývoji aplikací s ColdFusion, ASP.NET nebo ve stylu J2EE. Lidem, kteří používají Perl nebo PHP, se může kniha také hodit, protože většinu příkladů velmi snadno předělají do svého jazyka. Pokud ale o vývoji na straně serveru nevíte nic, budete z většiny příkladů – řekněme – zmateni.

Úvod

21

• Chcete se dozvědět všechno o Flashi. Kniha se záměrně vyhýbá tomu, aby se snažila naučit vás o Flashi vše, co potřebujete znát. Flash je totiž příliš rozsáhlý produkt, takže se nedají v rozumném rozsahu kompletně vysvětlit všechna témata. Proto se soustřeďujeme na takové schopnosti, které pravděpodobně budete potřebovat hned, a abyste také mohli začít budovat aplikace Flashe pracující s daty s uspokojivým pohodlím. Chcete-li se naučit Flash zgruntu, raději se poohlédněte po jiné knize.

• Používáte starší verzi Flashe a nechcete se trápit s přizpůsobováním příkladů. Přestože jsou obecné principy probírané v knize většinou aplikovatelné i na starší verze, mnohé konkrétní příklady závisejí na schopnostech obsažených ve vydání MX 2004. Všeobecně řečeno, kapitoly 1 až 8 jsou použitelné v jakékoli rozumné nepříliš staré verzi Flashe (verze 5 a novější). Kapitoly 9 až 11 se dají použít jen s verzí Flash MX 2004 Professional. (Chcete-li se dozvědět podrobnosti o tom, co je nového ve Flashi MX 2004, skočte hned do kapitoly 1, „Seznámení s Flashem“.)

Za předpokladu, že nepatříte ani do jedné ze tří výše uvedených skupin, vybízím vás, abyste teď prolistovali několik kapitol, podívali se na pár obrázků, a přitom se mrkli na kód několika příkladů. Jestliže se vám zdá, že by se daly adaptovat na problémy, které máte řešit, kupte knihu a začněte s ní pracovat. Jestliže ne, je asi nejlepší, když se naše cesty rozejdou (mějte ale knihu v povědomí, co kdyby se hodila některému z vašich známých!).

Závěrem...

Jestliže jste se pro knihu rozhodli, věřím, že vám hodně pomůže na cestě k tomu, aby se Flash stal součástí vašich nových i existujících webových aplikací. Zlomte vaz a užívejte si!

- Nate Weiss

43 kapitola 

Vaše první rozhraní ve Flashi V kapitole 1, „Seznámení s Flashem“, jste se dozvěděli něco málo o Flashi, co pro vás, jakožto webového vývojáře, může znamenat. Také jste se něco dozvěděli o vývojovém prostředí.

V kapitole 2 stavím na těchto základech a ukážu vám, jak se vybuduje prosté, ale funkční rozhraní Macromedia Flashe, které zobrazí informace získané při běhu z vašeho serveru. V průběhu prací se také něco dozvíte o ActionScriptu, animačních klipech, oborech proměnných a dalších pojmech Flashe a o terminologii.

Naše první flashové rozhraní bude zobrazovat informace o hudebnících z ukázkové databáze Venue. Nejprve dáme dohromady jednoduchý kód na serveru, který „dodá“ informace o hudebnících do Flashe. Pak sestavíme prosté uživatelské rozhraní, které získané informace zobrazí v přehrávači Flashe.

Skočíme tady do toho po hlavě a rovnou na hloubku. No dobrá, možná se neponoříme až tak hluboko (potápění ve skafandru přijde později). Půjde-li vám při čtení kapitoly trochu hlava kolem, nic si z toho nedělejte. Šlo mi jen o to, abyste se osmělili a ponořili tak rychle, jako je to jen možné – podrobnosti přijdou později. Abych to řekl jinak: pojďte, ve vodě je príma!

Příprava: dodávaní dat do Flashe V knize chápeme Flash většinou jako „klientskou“ část volně definované aplikace typu klient/ server. Máte informace nebo logiku, které sídlí na vašem serveru, a chcete je vystavit pomocí Flashe nějakým zajímavým nebo pohodlným způsobem vašim uživatelům. Proto vyžaduje většina projektů Flashe v této knize jistou porci kódu na serveru (napíšete ho v jakémkoli jazyce, který je vhodný pro váš oblíbený aplikační server), plus něco skriptů u klienta, které budou v interakci s kódem na serveru, aby získaly data, aktualizovaly je, nebo jinak manipulovaly s daty dostupnými v části na straně serveru.

Jistě máte už v tomto místě spoustu otázek, jako „Jak přesně dodám data do Flashe?“ a „Jaký formát musí data mít, aby je Flash zvládl?“ a „Když má Flash nějaké informace, jak je zobrazím uživateli?“ No, to jsou opravdu skvělé otázky, takže vám na ně dám stručné odpovědi hned teď.

(Dlouhé odpovědi tvoří vlastně většinu textu knihy.)

Data můžete do Flashe dostat kteroukoli z těchto technik: • Jako čistý text. Váš server dodá text, který je složený z dvojic název/hodnota, a se stejnými symboly & a =, které používáte v části URL zvané „dotazovací řetězec“. Flash získá text a zpřístupní dvojice název/hodnota ActionScriptu jako prosté řetězcové proměnné.

44

FLASH MX Professional 2004 pro vývojáře webových aplikací

• Jako XML. Flash získá XML z vašeho serveru, udělá jeho rozklad a učiní různé prvky a atributy v XML dostupnými pro ActionScript jako objekty. Pokud vám to pomůže, dívejte se na funkcionalitu XML pojmově jako na jistou obdobu rozhraní ve stylu SAX nebo DOM, které poskytují jiné parsery XML. • Prostřednictvím Flash Remoting. Flash Remoting ještě více usnadňuje výměnu dat mezi vaším serverem a Flashem. Flash Remoting je zahrnutý do ColdFusion a JRun; pracujete-li s .NET nebo s jiným serverem J2EE, musíte si serverovou část zakoupit od společnosti Macromedia (je to finančně celkem výhodné vzhledem k tomu, co za své peníze dostanete).

• Prostřednictvím nějaké webové služby. Jestliže jazyk, nebo programovací prostředí, které jste si zvolili, poskytuje snadný způsob vytváření webových služeb, můžete vytvořit službu, která vystaví taková data, jaká jsou třeba. Flash může volat metody služby právě tak, jako jakýkoli jiný konzument této služby.

Každé z technik je věnovaná samostatná kapitola v části III, „Připojování k datům“ knihy.

Prozatím se hodlám soustředit jen na první techniku, protože je nejjednodušší a uvidíte hned nějaké výsledky – bez ohledu na to, jaký aplikační server používáte. Ostatní techniky pochopíte snadněji, když už budete vědět, jak to celé funguje.

Kódování dat pro Flash ve formě prostých „proměnných“ Jak jste se právě dozvěděli, můžete do Flashe dodat data jako čistý text, jako XML, nebo prostřednictvím Remoting či webových služeb. V tomto oddílu se podíváme na první možnost, kdy server informace zpřístupňuje pomocí velmi prostého formátu „čistý text“. Jestliže nějaká stránka na vašem serveru ví, jak vrátit data v tomto formátu (což je protiklad k tomu, co vaše stránky obvykle vracejí, bývá to HTML nebo XHTML), Flash snadno text shrábne a učiní ho dostupným pro vaše uživatele.

Buďme trochu konkrétnější. Speciální formát „čistý text“ (plain-text), o kterém mluvím, je prostě stejný formát, který už používáte, když dodáváte do svých dynamických webových stránek parametry URL, nebo proměnné. Jistě víte, jak to funguje: všemu, co se nachází v URL za symbolem ?, se říká dotazovací řetězec. Uvnitř dotazovacího řetězce se dá dodat libovolný počet dvojic název/hodnota, přičemž název a hodnota jsou oddělené znakem =, jednotlivé dvojice jsou oddělené znaky &. Uvnitř hodnoty jsou všechny „zvláštní“ znaky“ (jako jsou mezery, lomítka atd.) převedené pomocí kódů znaků a znaku %.

Poznámka To asi také všechno znáte jako malou násobilku, takže se s tím nebudu zaobírat. Bylo to určeno už dávno, tehdy, když se vytvářely specifikace HTTP a CGI. Chcete-li se o těchto věcech dozvědět něco konkrétnějšího, připojte se a rychlým hledáním najděte standardní formát aplication/x-wwwurlformencoded.

Vaše první rozhraní ve Flashi

45

Protože se jedná o formát, kterým se dodávají hodnoty do nějaké webové stránky, má určitý smysl, že vám Macromedia povoluje použít stejný formát i pro předávání hodnot ze stránky.

Uvažme prostý scénář: máte na svém serveru nějakou stránku, která přijímá identifikační číslo hudebníka jako parametr URL, a odpoví informacemi o zadaném hudebníkovi. URL, kterou použijete pro svůj požadavek na informace od serveru, by mohla vypadat takto: http://wwww.mojefirma.com/mojestranka.jsp?idArtist=5

Váš kód na serveru by pomocí dodaného identifikačního čísla získal informace o hudebníkovi z nějaké databáze. Pak by odpověděl třeba jménem a věkem hudebníka a jaký druh hudby provozuje, například: artistName=Natalie%20Weiss&artistAge=19&musicType=Pop

Jestliže bylo přehrávači Flashe řečeno, aby načetl ze serveru tento řádek textu, skončilo by to tím, že by se vytvořily tři proměnné: • artistName (obsahovala by hodnotu “Natalie Weiss“) • artistAge (obsahovala by hodnotu “19“) • musicType (obsahovala by hodnotu “Pop“) Zapamatujte si, že kód na serveru by odpovídal pouze tímto řádkem dvojic název/hodnota.

Stránka by nevracela žádný HTML, ani nic jiného, co by vracela za normálních okolností, aby to mělo smysl zobrazit v prohlížeči. Abych to vyjádřil jinak, URL, které dodávají data do Flashe, nejsou určené k tomu, aby je viděli koneční uživatelé. Má je vidět pouze Flash.

Poznámka Všechny proměnné vyměňované mechanizmem „čistý text“ získá ActionScript jako řetězcové proměnné (konkrétně jsou to instance třídy String. O tom se více dozvíte v kapitole 4, „Slabikář ActionScriptu”). Chcete-li, aby zbytek kódu interpretoval některou z proměnných jako číslo, booleovskou hodnotu, datum, nebo jako nějaký jiný datový typ, musíte provést potřebné konverze typu sami (nebojte se, je to snadné). Také o tom se více dozvíte v kapitole 4.

Jak se to udělá v ColdFusion Pojďme se teď podívat na jednoduchý kód, který budeme potřebovat, chceme-li dodat data ve formátu čistý text, o němž jsme právě hovořili. Začnu s ColdFusion (není za tím skrytý žádný úmysl, něčím začít musím). Dáváte-li přednost ASP.NET nebo Javě, klidně rovnou skočte k výpisům 2.2 a 2.3. Všechny výpisy jsou neobyčejně prosté a v zásadě jsou to jisté transkripce mezi jednotlivými jazyky.

Podívejte se na výpis 2.1. Jak vidíte, moc toho v něm není. Připomínám, že se předpokládá, že už jste pomocí ColdFusion Administrator vytvořili datový zdroj s názvem VenueDB, který ukazuje na ukázkovou databázi knihy. (Pokud jste datový zdroj ještě nepřipravili, vraťte se na konec kapitoly 1, kde najdete potřebné pokyny.)

46

FLASH MX Professional 2004 pro vývojáře webových aplikací

Výpis 2.1 artistVarSource.cfm – Dodání dvojic název/hodnota z ColdFusion <!--- Tato stránka vyžaduje v URL parametr "idArtist" ---> <cfparam name="URL.idArtist" type="numeric"> <!--- Jednoduchý dotaz, který vytáhne údaje o hudebníkovi z tabulky Artists databáze ---> <cfquery name="ArtistQuery" datasource="VenueDB"> SELECT sArtistName, sImageName, sDescription FROM Artists WHERE idArtist = #URL.idArtist# </cfquery> <!--- Vynechají se ladicí informace a vše, co není v blocích <cfoutput> ---> <cfsetting showdebugoutput="No" enablecfoutputonly="Yes"> <!--- Nastaví se typ obsahu MIME odpovědi na "text/plain" ---> <cfcontent type="text/html" reset="yes"> <!--- Výstup informací ---> <!--- (kód je zde na více řádcích, ---> <!--- ve skutečnosti je ale výstupem jediný řádek) ---> <cfoutput>artistName=</cfoutput> <cfoutput>#URLEncodedFormat(ArtistQuery.sArtistName)#</cfoutput> <cfoutput>&imageName=</cfoutput> <cfoutput>#URLEncodedFormat(ArtistQuery.sImageName)#</cfoutput> <cfoutput>&description=</cfoutput> <cfoutput>#URLEncodedFormat(ArtistQuery.sDescription)#</cfoutput>

Parametr <cfparam> deklaruje, že stránka vyžaduje v URL proměnnou s názvem idArtist.

Zadaná hodnota se použije v <cfquery>, který získá informace z odpovídajícího záznamu hudebníka z naší ukázkové databáze. Na konci výpisu se výstup dvojic název/hodnota realizuje pomocí prostých bloků <cfoutput>. Všimněte si, že je každá hodnota obalena funkcí ColdFusion s názvem URLEncodedFormat(), která se postará v hodnotách o převod všech speciálních znaků (jako jsou mezery nebo lomítka).

Značky <cfsetting> a <cfcontent> jsou v tomto případě volitelné, ale bývá dobrým zvykem dávat je v této podobě do stránek, které poskytují dvojice název/hodnota pro Flash. Značka <cfsetting> vypne ladicí výstup ColdFusion pro tuto stránku, pokud byl náhodou na úrovni serveru zapnut, protože stránka má vygenerovat pouze dvojice název/hodnota, žádný další HTML nebo text, jako jsou ladicí zprávy. Dále sděluje ColdFusion, aby na výstup zařadil pouze text umístěný ve značkách <cfoutput>, čímž se zamezí různým potížím způsobených vygenerovanými prázdnými znaky. Značka <cfcontent> nastaví typ obsahu odpovědi stránky na text/ plain místo výchozího typu obsahu text/html. Flashi by ve skutečnosti nevadilo, kdybyste ten-

Vaše první rozhraní ve Flashi

47

to krok vynechali, je ale rozumné nastavit obsah typu na text/plain, protože výstup stránky neobsahuje žádné značky HTML. Pokračujte dál a navštivte stránku v prohlížeči. Zadejte do URL idArtist=1 a zkontrolujte výsledky (obrázek 2.1). Podle toho, jaký prohlížeč používáte, se možná obsah objeví ve vašem výchozím textovém editoru, nebo budete vyzváni, abyste obsah uložili do souboru (různé prohlížeče zacházejí s obsahem text/plain různě). Ale na ničem z toho v podstatě nezáleží.

Cílem je, abyste dostali řádek textu s informacemi o hudebníkovi ve formě dvojic název/hodnota. Dostanete-li místo toho nějakou chybovou zprávu, pravděpodobně bude nutné opravit něco, co se týká datového zdroje pro naši ukázkovou databázi.

Obrázek 2.1. Kontrola dvojic název/hodnota v prohlížeči.

Jak se to udělá v ASP.NET Dáváte-li přednost práci v ASP.NET, je výpis 2.2 ekvivalentem výpisu 2.1. Předpokládá se, že jste už vytvořili zdroj dat ODBC s názvem VenueDB, který ukazuje na ukázkovou databázi knihy.

Výpis byste měli být schopni otestovat tím, že do URL předáte jako parametr idArtist=1 (viz obrázek 2.1).

Poznámka Příklad se opírá o jmenný prostor System.Data.ODBC, který je součástí verze 1.1 .NET Framework.

Používáte-li jeho verzi 1.0, budete si muset stáhnout balíček System.Data.ODBC z webových stránek společnosti Microsoft, chcete-li, aby tento výstup fungoval tak, jak je napsaný.

48

FLASH MX Professional 2004 pro vývojáře webových aplikací

Výpis 2.2 artistVarSource.aspx – Dodání dvojic název/hodnota z ASP.NET <%@ Page Language="vb" Debug="true" %> <%@ Import Namespace = "System.Data.ODBC" %> <script runat="server"> Sub Page_Load ' Definuje databázové připojení Dim ConnStr as String = "DSN=VenueDB" Dim conn as OdbcConnection = new OdbcConnection(ConnStr) ' Připraví Dim CmdStr + "WHERE Dim cmd as

dotaz as String = "SELECT * FROM Artists " _ idArtist = " + Request.Item("idArtist") OdbcCommand = new OdbcCommand(CmdStr, conn)

' Zřídí připojení a vykoná dotaz conn.Open() Dim reader As OdbcDataReader = cmd.ExecuteReader() ' Načte první (a jediný) řádek dat reader.Read() ' Nastaví typ obsahu MIME naší odpovědi na "text/plain" Response.ContentType = "text/plain" ' Výstup informací ' (kód je zde na více řádcích, ' ve skutečnosti je ale výstupem jediný řádek) Response.Write("artistName=" _ + Server.URLEncode(reader.Item("sArtistName"))) Response.Write("&imageName=" _ + Server.URLEncode(reader.Item("sImageName"))) Response.Write("&description=" _ + Server.URLEncode(reader.Item("sDescription"))) End Sub </script>

Poznámka Samozřejmě je to jen jeden z mnoha možných způsobů, jak kód příkladu zapsat. Přirozeně by se mohl tentýž příklad transkribovat do JScript nebo C#, a mohli byste použít datové objekty a metody ze jmenných prostorů System.Data.OleDb nebo System.Data.SQLClient, ne jmenný prostor System.Data.

ODBC. Příklad jsem zapsal takto proto, aby byly věci pokud možno jasné, relativně nezávislé na typu databáze a v souladu s ostatními typy serveru, s nimiž se v knize pracuje. Podle toho, na co se cítíte, klidně změňte skriptovací jazyk nebo specifika načítání dat.

Vaše první rozhraní ve Flashi

49

Poznámka překladatele (1) Pro čtenáře, kteří už mají stahování plné zuby, chtějí pracovat stále s Framework 1.0 a s příkladem „prorazit“ co nejrychleji, připojuji variantu výpisu 2.2. Když se využije veřejných rozhraní jmenného prostoru System.Data, naznačuje výpis, jak se dá příklad zároveň připravit pro OleDb (třeba Access), i pro SqlClient (Microsoft SQL Server ). Obejdete se také bez vytváření zdroje dat ODBC. Všimněte si, že v této variantě nezáleží na názvech polí tabulky, ale na jejich pořadí. <%@ Page Language="vb" Debug="true" %> <%@ Import Namespace = "System.Data.OleDb" %> <script runat="server"> Sub Page_Load(ByVal sender As System.Object, _ ByVal e As System.EventArgs) Handles MyBase.Load Dim pripojeni As System.Data.IDbConnection Dim prikaz As System.Data.IDbCommand Dim ctenar As System.Data.IDataReader ' příprava pro OleDb Dim ConStr As String = "Provider=Microsoft.Jet.OLEDB.4.0; _ Data Source=D:\Inetpub\wwwroot\venue\database\venue.mdb" Dim conn As OleDbConnection = New OleDbConnection(ConStr) Dim CmdStr As String = "SELECT * FROM Artists " _ + "WHERE idArtist = " + Request.Item("idArtist") Dim cmd As OleDbCommand = New OleDbCommand(CmdStr, conn) Dim reader As OleDbDataReader ' ' ' ' '

tady se dá připravit připojovací řetězec, připojení, čtenář dat i příkaz pro SQLServer nastaví se pak v nějaké podmínkové konstrukci (která tu chybí) podle toho, zda se pracuje s OleDb nebo s SqlClient:

pripojeni = conn prikaz = cmd ctenar = reader pripojeni.Open() ctenar = prikaz.ExecuteReader With ctenar .Read Response.Write("artistName=" + Server.UrlEncode(.Item(1))) Response.Write("&imageName=" + Server.UrlEncode(.Item(2))) Response.Write("&description=" + Server.UrlEncode(.Item(3))) End With

50

FLASH MX Professional 2004 pro vývojáře webových aplikací ctenar.Close() pripojeni.Close() End Sub </script>

(2) Autor sice v knize tu tam zmiňuje komunitu „Open Source“, neboli společenství, kde je téměř vše zadarmo, ale neutrousil ani jediný konkrétní příklad. Takže alespoň jeden, který jsem se snažil udělat ve stylu autora co nejkratší. Ukazuje, jak by úloha vypadala, kdybyste se obraceli na databázi MySQL (zkoušel jsem to na verzi 5.0 alfa) prostřednictvím PHP (verze 4.3). Kód na serveru se nezabývá připojovacími záležitostmi, je ale připraven pro načítání po řádcích (když neuvedete v URL žádný parametr, vrátí všechny záznamy). <?php # artistVarSource.php – vypíše obsah vybraných polí jednoho # nebo všech záznamů tabulky Artists pro Flash @mysql_connect () or exit (); mysql_select_db ("venue") or exit (); # Převezme parametr, otestuje a připraví dotaz if (isset($HTTP_GET_VARS["idArtist"])) { $idArtist = $HTTP_GET_VARS["idArtist"]; $dotaz = sprintf("SELECT sArtistName, sImageName, sDescription FROM Artists WHERE idArtist=%s", $idArtist); } else { $dotaz = "SELECT sArtistName, sImageName, sDescription FROM Artists"; } # vydá dotaz $vysledek = mysql_query ($dotaz) or die ("Dotaz nelze vykonat"); # načte výsledky dotazu, pak je uvolní while (list ($sArtistName, $sImageName, $sDescription) = _ mysql_fetch_row ($vysledek)) { printf ("artistName=%s&imageName=%s&description=%s&", $sArtistName, _ $sImageName, $sDescription); } mysql_free_result ($vysledek); ?>

Vaše první rozhraní ve Flashi

51

Nezapomeňte ve volání load() v kódu ActionScriptu na snímku 1 v ArtistDisplayClip změnit příponu souboru na .php. Analogicky se dá snadno upravit výpis 2.7 i příklady v dalších kapitolách.

Jak se to udělá s Javou Jako poslední v pořadí, ale určitě ne významem, uvádím výpis 2.3 obsahující stránku JSP (Java Server Pages), který lze zaměnit za výpis 2.1 , resp. 2.2. Výpis byste měli být sto otestovat tím, že do URL předáte jako parametr idArtist=1 (opět viz obrázek 2.1).

Výpis 2.3 artistVarSource.jsp – Dodání dvojic název/hodnota z JSP <%@ page import="java.sql.*,java.net.URLEncoder" contentType="text/plain" %> <% // Tohle je příkaz SQL, kterým získáme data String sql = "SELECT * FROM Artists " + "WHERE idArtist = " + request.getParameter("idArtist"); // Vykoná dotaz SQL nad ukázkovou databází Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con = DriverManager.getConnection("jdbc:odbc:VenueDB"); ResultSet rs = con.createStatement().executeQuery(sql); // Získají se indexové pozice sloupců, které chceme na výstupu int colArtistName = rs.findColumn("sArtistName"); int colImageName = rs.findColumn("sImageName"); int colDescription = rs.findColumn("sDescription"); // Odstraní se prázdné znaky, abychom zajistili, // že bude výstup na prvním řádku out.clear(); // Odešlou se dvojice název/hodnota do výstupního proudu while ( rs.next() ) { out.print("artistName="); out.print(URLEncoder.encode(rs.getString(colArtistName))); out.print("&imageName="); out.print(URLEncoder.encode(rs.getString(colImageName))); out.print("&description="); out.print(URLEncoder.encode(rs.getString(colDescription))); } %>

52

FLASH MX Professional 2004 pro vývojáře webových aplikací

Budování Flashového rozhraní Když máme hotové stránky, které dodávají data jako čistý text, můžeme přejít k vytvoření prostého rozhraní Flashe, které informace zobrazí. Tato část kapitoly vám ukáže, jak snadno se dají načíst informace z webového serveru a zobrazit je uživatelům. Naučíte se také, jak v přehrávači Flashe zobrazovat za pochodu obrázky. V průběhu prací se také něco dozvíte o ActionScriptu.

Přidávání vizuálních prvků Nejprve musíte vytvořit nový dokument Flashe: 1. Ve Flashi zvolte z hlavní nabídky File > New. Objeví se dialogové okno New Document (viz obrázek 2.2).

Obrázek 2.2. Vytvoření dokumentu Flashe.

2. V seznamu Type vyberte Flash Document a klikněte na OK. (O využití některých jiných typů dokumentů se dozvíte v knize později.)

3. Pomocí File > Save dokument uložte, jako název souboru uveďte artistWidget.fla.

Poznámka Opět předpokládám, že svou práci v této kapitole budete ukládat do složky venue/chapter02 v rámci kořenové složky dokumentů vašeho webového serveru. Za normálních okolností nebudete dokument Flashe (.fla) udržovat v nějaké složce, ke které má přístup váš webový server (protože to je váš „zdrojový kód“), pro potřeby výuky je to však rozumné.

4. Z nabídky View zvolte Preview Mode > Outlines. Bude se vám snadněji pracovat s prvky, které budete přidávat do rozhraní. Jako vývojář budete tento režim náhledu dost potře-

Vaše první rozhraní ve Flashi

53

bovat, protože budete často pracovat s takovými prvky, které v době návrhu nic zajímavého neobsahují (naproti tomu při běhu budou zaplněné informacemi ze serveru).

Teď přidáme do nového dokumentu vizuální prvky: 1. V panelu Components vyhledejte ve stromu komponent prvek Loader (viz obrázek 2.3).

Nevidíte-li panel Components, zvolte Window > Development Panels > Components, čímž ho zviditelníte.

Obrázek 2.3. Panel komponent.

2. Přetáhněte myší komponentu Loader ze stromu do levého horního rohu plochy (bílá oblast ve vaší nové animaci). V komponentě Loader se bude zobrazovat fotografie hudebníka (nebo kapely).

3. Vyberte komponentu Loader a podívejte se do panelu Properties. (Nevidíte-li panel Properties, zvolte Window > Properties – nebo stiskněte Ctrl+F2.) Jen tak pro zábavu klikněte na záložku Parameters v pravém horním rohu panelu Properties. Uvidíte několik parametrů, které se vztahují k zobrazení vizuálního obsahu (autoLoad, contentPath a scaleContent). Jenom si je prohlédněte – žádný z parametrů teď měnit nemusíte (parametr contentPath však později změníte prostřednictvím skriptu).

4. V panelu Properties napište do pole Instance Name název ldrPhoto (viz obrázek 2.4).

Obrázek 2.4. Úpravy hodnot vlastností komponenty Loader.

54

FLASH MX Professional 2004 pro vývojáře webových aplikací

Tímto názvem se budete na objekt Loader odkazovat v kódu ActionScriptu. V názvech instancí se rozlišuje velikost písmen, takže si dávejte pozor na zápis malých a velkých písmen.

5. V panelu Tools vyberte nástroj Text a klikněte jednou na ploše, těsně vpravo od objektu Loader, který jste právě vytvořili (viz obrázek 2.5). Vytvoříte tím nové textové pole.

V něm se bude zobrazovat jméno hudebníka (nebo kapely).

Obrázek 2.5. Přidání textového pole do dokumentu.

6. Při stále vybraném novém textovém poli nastavte v panelu Properties, pokud je to nutné, typ textového pole na Dynamic Text (opakem je Static Text). Jako název instance napište txtArtistName.

7. Zopakujte kroky 5 a 6, abyste vytvořili další textové pole s názvem instance txtDescription. Opět pomocí panelu Properties vyberte v seznamu Line typu položku Multiline (víceřádkové textové pole, opakem je Single Line, jednořádkové textové pole). Nakonec dvojitě klikněte na poli a táhněte čtvereček v pravém dolním rohu, abyste změnili velikost pole tak, aby se do něho vešlo několik řádků textu. Pokud jste to ještě neudělali, dvojitě klikněte na textovém poli txtArtistName a táhněte jeho šířku tak, aby se shodovala s textovým polem txtDescription.

8. Když teď máte na ploše všechny potřebné prvky, zkuste je zaranžovat pomocí myši tak, aby vypadaly úhledně. Velikost objektu Loader změníte tak, že na něm kliknete pravým tlačítkem myši, zvolíte Free Transform a táhnete jeho pravý dolní okraj. Velikost můžete upravit také tak, že napíšete nové hodnoty do polí W (šířka) a H (výška) v panelu Properties.

9. Chcete-li, zvolte v panelu Properties pro první textové pole (jméno hudebníka či kapely) větší velikost písma a pro druhé textové pole (popis) menší velikost písma. Já jsem pro to první použil velikost 12, pro druhé velikost 9. Také jsem pro jméno hudebníka vybral tučné písmo (B), abych je trochu zvýraznil. Až skončíte, mělo by vaše rozhraní vypadat přibližně tak, jako to moje (na obrázku 2.6), ale příliš se s tím nepárejte. Zatím se snažíme o to, abychom vůbec něco zprovoznili.

10. Příkazem File > Save svou práci uložte.

Vaše první rozhraní ve Flashi

55

Obrázek 2.6. Prázdné prvky pro zobrazení textů a obrázku.

Načtení a zobrazení dat pomocí ActionScriptu Doposud máme jen prosté uživatelské rozhraní se třemi prázdnými prvky: komponentu Loader, ve které se objeví fotografie, a dvě textová pole, v nichž se objeví jméno hudebníka a popis. Teď můžeme přidat kód ActionScriptu, který do těchto prázdných prvků dostane patřičné informace.

Poznámka Současná verze Flashe poskytuje řadu dalších způsobů, jak vyřešit úkol, který jsme si předsevzali.

Některé z nich vyžadují více řádků kódu, jiné zase téměř žádné. Já jsem zvolil v této kapitole jistý druh klasického řešení, protože je jednoduchý a snadno adaptovatelný v mnoha rozličných situacích.

V průběhu knihy se dozvíte i o jiných způsobech, jak načíst a zobrazit data.

Převedení prvků rozhraní na objekt animačního klipu Dalším vaším krokem bude převedení tří prvků rozhraní na animační klip. Převod prvků na animační klipy se dělá ze dvou důvodů: zaprvé je možné animační klip chápat jako vizuální „objekt“, takže ho pak lze posouvat po ploše jako jediný prvek; zadruhé, animační klip slouží jako programovací „objekt“ obsahující kód specifický vzhledem k prvkům, které obsahuje. Stručně řečeno, klip se stane kontejnerem vizuálních prvků a kódu, který se k nim vztahuje, takže budete moci na prvky a kód myslet ve stylu objektově orientovaného programování.

Animační klip vytvoříte takto: 1. Za předpokladu, že máte stále otevřený dokument z předchozího oddílu, vyberte všechny tři prázdné prvky: komponentu Loader a obě textová pole. (Dá se to udělat tak, že na prvcích klikáte při stisknuté klávese Shift, nebo zvolte Edit > Select All.) 2. Až budete mít všechny tři prvky vybrané, zvolte Modify > Convert to Symbol. Objeví se dialogové okno Convert to Symbol.

3. Do pole Name napište ArtistDisplayClip (viz obrázek 2.7).

56

FLASH MX Professional 2004 pro vývojáře webových aplikací

Obrázek 2.7. Převedení obsahu na symbol animačního klipu.

4. Zkontrolujte, je-li ve skupině přepínačů Behavior vybraný přepínač Movie Clip. Pak klikněte na OK. Na první pohled to vypadá, že se nic nezměnilo. Když ale budete trochu experimentovat, zjistíte, že jsou tři prvky nyní přístupné jako skupina: Zaprvé, kliknete-li jednou na některém ze tří prázdných prvků, ve skutečnosti vyberete na ploše celý nový animační klip. Klip lze posouvat, měnit jeho velikost, a může se vyjímat a vkládat jako jediný objekt.

Kliknete-li dvojitě na některém ze tří prázdných prvků, budete „přeneseni“ do speciálního módu, ve kterém můžete animační klip editovat. V tomto módu můžete posouvat jednotlivé prvky nebo měnit jejich velikost, nebo do klipu přidávat kód. Tomuto módu říkáme mód editace symbolu.

Když jste v módu editace symbolu, dostanete se z něho ven tak, že dvojitě kliknete na jakékoli jiné oblasti plochy (prázdná bílá oblast).

Poznámka Pro přechod mezi jednotlivými módy existují i jiné navigační možnosti. Můžete animační klip vybrat a zvolit Edit > Edit Selected, čímž se dostanete do módu editace symbolu. Do normálního módu se můžete vrátit pomocí Edit > Edit Document. Nebo můžete využít tlačítko Edit Symbols na pravé straně editovací lišty (je nad časovou osou a dá se přepínat pomocí Window > Toolbars > Edit Bar), jímž můžete přecházet mezi jednotlivými animačními klipy, které máte ve svém dokumentu; do hlavního dokumentu se dá také vrátit tlačítkem Scene 1 na téže liště.

Procvičte si trochu přecházení mezi módem editace symbolu a módem editace hlavní části dokumentu. Nebojte se věci posouvat sem a tam. Své změny můžete vždycky vrátit pomocí Edit > Undo, nebo když si načtete dokončenou verzi dokumentu ze složky ukázkových souborů kapitoly.

Poznámka Můžete také pomocí Window > Library otevřít panel Library (knihovnu) a dvojitě kliknout na ikoně svého nového animačního klipu v knihovně, čímž se také dostanete do módu editace symbolu. Práce s knihovnou se vám bude hodit, až budou vaše dokumenty Flashe komplikované, jak je postupně zaplníte spoustou různých animačních klipů a jiných prvků.

Vaše první rozhraní ve Flashi

57

Přidání kódu ActionScriptu Nuže dobrá. Vytvořili jste animační klip, je na čase přidat ActionScript, který zařídí, aby se choval tak, jak si přejete. Držte se prosím následujícího postupu: 1. Jestliže nejste v módu editace symbolu, dvojitě klikněte na animačním klipu.

2. Klikněte na prvním snímku v časové ose, jak je to vidět v horní části obrázku 2.8.

Obrázek 2.8. Přidání kódu ActionScriptu do symbolu animačního klipu.

3. Podívejte se na panel Actions (jestliže panel Actions nevidíte, zobrazte si ho pomocí Window > Development Panels > Actions). Záložka u spodní strany panelu Action by měla mít titulek Layer 1 : 1 a na stavovém řádku na spodu panelu by měl být nápis Line 1 of 1, Col 1. Jestliže to tam není, klikněte jednou na ploše. (Jestliže to tam stále není, jste někde jinde – zvolte Edit > Edit Document, abyste se vrátili do hlavního dokumentu a zkuste to znovu.)

4. Napište do panelu Actions kód uvedený ve výpisu 2.4.(je také vidět na obrázku 2.8). Kód vytváří dvě funkce, loadArtist() a onArtistVarsLoaded(). Probereme je v příštím oddílu.

5. Uložte svou práci pomocí File > Save.

58

FLASH MX Professional 2004 pro vývojáře webových aplikací

Poznámka Nechcete-li se s kódem psát, můžete si ho zkopírovat ze souboru ArtistDisplayCode1.txt, který najdete ve složce ukázkových souborů kapitoly. Textový soubor je zde jen pro tento účel. Nemusíte ho mít ve složce webu, aby příklad fungoval.

Výpis 2.4 Kód ve snímku 1 animačního klipu ArtistDisplayClip function loadArtist(idArtist) { // Vytvoří nový objekt LoadVars, do něhož se načtou data ze serveru var artistVars = new LoadVars; // Sděluje objektu, co má udělat, až dostane svá data artistVars.onLoad = onArtistVarsLoaded; // Sděluje objektu, aby hned nyní načetl data. artistVars.load("http://localhost/venue/chapter02/artistVarSource.aspx? idArtist=" + idArtist); } function onArtistVarsLoaded() { // Naplní textová pole hodnotami získanými ze serveru txtArtistName.text = this.artistName; txtDescription.text = this.description; // Načte fotografii patřičného hudebníka do objektu Loader ldrPhoto.contentPath = "../images/artists/" + this.imageName; }

Samozřejmě, používáte-li ColdFusion, resp. Java musíte změnit „.aspx“ ve výpisu na „.cfm“, resp. „.jsp“.

Poznámka Dobrá, abych uchoval vaše duševní zdraví, tedy stručně. Znáte-li syntax JavaScriptu – nebo dokonce syntax C nebo Javy – neměl by pro vás být kód ve výpisu 2.4 nic děsivého. Jestliže vám ale základní prvky kódu (pojem funkce, použití závorek, složených závorek, středníků atd.) připadá jako čistá hotentotština a vůbec tomu nerozumíte, asi byste si měli nejdříve odskočit do kapitoly 4, nebo si projít nějaký online kurz JavaScriptu.

Rychlé seznámení s objektem LoadVars Kód, který jste právě přidali do dokumentu, používá objekt LoadVars, což je speciální pomocný objekt, který vystavuje při běhu přehrávač Flashe. Jak název implikuje, poskytuje objekt LoadVars prostředky pro získání proměnných (tj. dvojic název/hodnota) z nějakého webového serveru. V zásadě to prostě znamená, že objekt ví, jak se připojit k nějaké URL prostřednictvím HTTP, provede rozklad získaného textu do dvojic název/hodnota a zpřístupní dvojice jako proměnné, které pak můžete využívat, jak je vám libo.

Vaše první rozhraní ve Flashi

59

O veškeré této látce se víc dozvíte v kapitole 6, „Připojování k serverům pomocí čistých textových souborů“. Prozatím stačí, když budete vědět, že většinou se práce s objektem LoadVars skládá ze čtyř základních kroků: 1. Vytvoříte instanci objektu LoadVars pomocí klíčového slova new.

2. Nastavíte vlastnost onLoad instance na název nějaké funkce (tu musíte napsat), která se má zavolat, až se proměnné úspěšně získají z URL. Protože nemám lepší termín, říkám jí funkce odpovědi, responder function.

3. Zavoláte metodu load() instance, která sdělí Flashi, aby skutečně kontaktoval váš webový server.

4. Pomocí získaných hodnot se ve funkci odpovědi odkazujete na proměnné jejich názvem.

V kódu, který jste právě přidali (výpis 2.4), se první tři kroky dějí ve funkci loadArtist(). Čtvrtý krok se uskuteční ve funkci odpovědi, což je v našem případě onArtistVarsLoaded().

Poznámka Na svůj animační klip můžete nyní nahlížet jako na objekt, který ví, jak načíst a zobrazit informace z nějakého serveru. Dá se chápat také tak, že vystavuje jednu veřejnou metodu: funkci loadArtist().

Funkce onArtistVarsLoaded() se naopak dá považovat za soukromou metodu. Nejsme sice zrovna na takovém místě, kde se formálně deklarují metody jako veřejné nebo soukromé; protože se ale funkce loadArtist() může hodit i pro jiný kód někde jinde, pomůže celou věc pochopit, když si uvědomíme, že se na ni můžeme dívat jako na veřejnou metodu.

Mimochodem, je důležité, abyste pochopili, že proměnné se metodou load() objektu LoadVars získávají asynchronně. To znamená, že přehrávač Flashe nečeká na to, až se z URL získají dvojice název/hodnota. Proto se v kódu nemůžete bezpečně odkazovat na získané proměnné do té doby, dokud se nezavolá funkce odpovědi. Má to samozřejmě svůj dobrý důvod, proč je to tak. Vaše animace může pracovat na jiných věcech (třeba zobrazuje nějaký animační efekt), zatímco se stahují informace. Také to animaci umožňuje, aby souběžně načetla proměnné z několika URL (pokud si to přejete).

Poznámka Jestliže to někomu z vás zní jako jistý druh náročného (a spletitého) vícevláknového (multithreaded) programování, máte pravdu, je to něco takového. Flash vždy chce, abyste mohli dělat současně tolik věcí, kolik je možné, aby se to co nejvíce blížilo skutečnému světu, kde se věci dějí v reálném čase. To zase znamená, že mnohé typy operací – obzvláště interakce se servery – jsou svou povahou zákonitě vícevláknové. Je to přirozenost živé bytosti.

60

FLASH MX Professional 2004 pro vývojáře webových aplikací

Umožníme uživateli, aby si vybral hudebníka Dobrá – vytvořili jste vizuální prvky, strčili je do animačního klipu a přidali potřebný skript, aby se informace načetly ze serveru a zobrazily. Určitě vám připadá, že se informace mají zobrazit v okamžiku, až se zavolá funkce loadArtist() (viz výpis 2.4).

Bohužel, funkce se zatím vůbec nezavolá, takže se také nic nestane. Budeme muset udělat něco trochu vyspělejšího; prozatím jen přidáme jednoduchý ovládací prvek typu číselník, v němž si bude moci uživatel vybrat, kterého hudebníka chce zobrazit. Kdykoli uživatel změní hodnotu v číselníku, zobrazí se informace o odpovídajícím hudebníkovi. Číselník přidejte následujícím postupem: 1. Jestliže se právě nenacházíte v módu editace symbolu našeho animačního klipu, dvojitě klikněte na některém z jeho prázdných vizuálních prvků.

2. Přetáhněte z panelu Components na plochu komponentu NumericStepper (ovládacímu prvku číselník se ve Flashi říká „NumericStepper“). Protože jste v módu editace symbolu, přidáváte komponentu do animačního klipu, ne do hlavní části dokumentu.

3. Příkazem View > Preview Mode > Full vypněte mód náhledu osnovy (Outline Preview), který jste zapnuli dříve. Všimněte si, že nyní vidíte v komponentě NumericStepper dvě malé šipky ukazující nahoru, resp. dolů, zase je ale o něco těžší sledovat, kde se nachází komponenta Loader. Zvolte si ten režim náhledu, který vám vyhovuje nejlépe.

4. Přesvědčete se, že je nová instance komponenty NumericStepper vybraná, pak v panelu Properties nastavte vlastnost minimum na 1, vlastnost maximum na 5 a vlastnost value na 1. Jinak řečeno, chceme uživateli dovolit, aby si mohl vybrat číslo od 1 do 5, přičemž jako počáteční hodnotu nabídneme 1.

5. Při stále vybrané komponentě NumericStepper napište do panelu Actions tento kód: on (change) { _parent.loadArtist(this.value); }

V normální jazyce je význam kódu v podstatě tento: „když uživatel změní hodnotu v ovládacím prvku číselník, zavolej funkci loadArtist() a předej do ní prostřednictvím parametru idArtist hodnotu, kterou uživatel zvolil.“ O syntaxi on (change) se více dozvíte v kapitole 4.

Prozatím stačí, když pochopíte to, co je celkem zřejmé: kód uvnitř složených závorek se vykoná vždy, když se změní hodnota v číselníku.

Uvnitř bloku on (change) voláme funkci loadArtist(), kterou jsme vytvořili ve výpisu 2.4.

Aktuální hodnota číselníku je dostupná z vlastnosti this.value, což znamená, že jestliže uživatel právě změnil hodnotu ovládacího prvku řekněme na 2, předá se do funkce loadArtist() jako požadované identifikační číslo hudebníka číslo 2.

Vaše první rozhraní ve Flashi

61

Obrázek 2.9. Přidání kódu, který se odpálí, když se změní hodnota v číselníku.

Také si v bloku on(change) všimněte klíčového slova _parent. Uvnitř bloku zpracovávajícího nějakou událost nějaké komponenty se odkazy na funkce nebo proměnné chápou jako odkazy na metody a vlastnosti samotné komponenty, nikoli na prvky v dokumentu, který vytváříte.

Chcete-li se odkázat na prvky uvnitř dokumentu, musíte použít _parent (zhruba se to dá přeložit jako „rodič animačního klipu, neboli dokument obsahující tuto komponentu“). V příští kapitole probereme tyto pojmy přesněji.

Fajn. Všechno by mělo být připraveno. Otestujme to!

Publikování a testování rozhraní Nyní už stačí jen publikovat animaci, která obsahuje naše nové rozhraní. Publikování v podstatě znamená, že se dokument Flashe (soubor .fla, na kterém pracujete) převede na mnohem menší, úsporný soubor, kterému porozumí přehrávač Flashe. Nový soubor dostane příponu .swf. Těmto souborům se všeobecně říká SWFs (a anglicky se to vyslovuje „swiffs“).

Svou animaci publikujete jednoduše tak, že zvolíte File > Publish, nebo stisknete Shift+F12.

Na malou chvilku se objeví ukazatel průběhu, pod dobu, co IDE Flashe kompiluje a smrskává obsah animace. A je to!

Teď můžete své rozhraní otestovat tak, že se na ně podíváte v nějaké webové stránce. Abyste to měli pohodlnější, vytvoří Flash při publikaci animace prostou stránku HTML pro testovací účely.

62

FLASH MX Professional 2004 pro vývojáře webových aplikací

Můžete ji navštívit hned teď pomocí adresy: http://localhost/venue/chapter02/artistWidget.html

Poznámka Samozřejmě, není-li váš webový server (ten s nainstalovaným ColdFusion, ASP.NET nebo strojem .JSP) na vaší místní pracovní stanici, budete muset nahradit localhost v uvedené URL patřičným názvem serveru. Také budete muset změnit odkaz na URL ve výpisu 2.4.

Když tuto URL navštívíte v nějakém webovém prohlížeči, bude stránka skoro prázdná; bude na ní jen ovládací prvek číselník (viz obrázek 2.10). To se ovšem změní, jakmile něco v číselníku vyberete. Změníte-li hodnotu na 2, měli byste uvidět jméno, popis a fotografii hudebníka s identifikačním číslem 2; změníte-li hodnotu na 3, měli byste uvidět hudebníka s číslem 3, atd.

Obrázek 2.10. Test získávání dat z vašeho serveru.

Je jasné, že navigace pomocí číselníku a ještě stvořená takto, není nijak perfektní. Hlavně proto, že rozsah možných hodnot jsme do animace zakódovali „natvrdo“. Jestliže se počet dostupných hudebníků změní, bude se muset animace publikovat znovu. Také se předpokládá, že jsou hudebníci očíslovaní souvislou řadou identifikačních čísel počínaje číslem jedna a že si uživatel přeje prohlížet hudebníky v pořadí podle jejich identifikačních čísel. Jestliže bude nějaký hudebník odstraněn, nebo jestliže si uživatel přeje prohlížet hudebníky v nějakém intuitivnějším pořadí (řekněme podle abecedy), přestane tato primitivní technika správně fungovat.

Přesto bych chtěl s ovládacím prvkem číselník provést ještě jeden experiment, než ho nahradíme vhodnějším navigačním mechanizmem.

Vaše první rozhraní ve Flashi

63

Přístup k animačnímu klipu z hlavní časové osy Tak, jak jsme to vyrobili, je ovládací prvek číselník, který slouží uživateli k navigaci, součástí animačního klipu ArtistDisplayClip. Jestliže však chápeme animační klip jako jistý druh objektu – ve kterém má být zapouzdřeno zobrazování informace o nějakém jediném hudebníkovi – tak se zdá, že je ovládací prvek číselník na nepravém místě; jde spíše o přecházení mezi záznamy, ne o zobrazení údajů z aktuálního záznamu. Koncepčně by bylo konsistentnější, kdyby ovládací prvek číselník sídlil vně animačního klipu.

V současné fázi našeho řešení to žádný závažný problém není, protože se ovládacího prvku číselník stejně chceme brzy zbavit. Ale čistě proto, abychom viděli, co to udělá, přemístěme ovládací prvek ven z animačního klipu a usaďme ho v hlavním dokumentu – také se říká na hlavní časové ose. Vizuálně se v animaci nic nezmění; až budeme animaci publikovat, bude rozhraní vypadat úplně stejně. Jediná drobná odlišnost bude v tom, jak budou v animaci uspořádané objekty a kód.

Naznačenou změnu realizujte tímto postupem: 1. Jestliže se právě nenacházíte v módu editace symbolu animačního klipu, dvojitě klikněte na některém z jeho vizuálních prvků.

2. Vyberte ovládací prvek číselník tím, že na něm kliknete (jednou). Přesvědčete se, že je vybraný jen on, nic jiného. Možná budete muset nejprve jednou kliknout na prázdném místě plochy, pak na ovládacím prvku číselník.

3. Vyjměte číselník do schránky příkazem Edit > Cut z hlavní nabídky Flashe, nebo klikněte na ovládacím prvku pravým tlačítkem myši a z kontextové nabídky zvolte Cut. Také můžete použít všeobecně známou klávesovou zkratku Ctrl+X. 4. Opusťte mód editace symbolu tím, že dvojitě kliknete na prázdném místě plochy.

5. Vložte číselník zpět příkazem Edit > Paste in Place.

Dobrá, číselník nám teď sedí na hlavní časové ose, není už uvnitř animačního klipu. Všechno vypadá úplně stejně, pokud byste ale animaci publikovali a otestovali právě teď, zjistili byste, že nefunguje správně.

Proč? Inu, pokud si ještě vzpomenete, tak kód, který se vykoná, když se změní hodnota v číselníku, vypadá takto: _parent.loadArtist(this.value);

Řádek bude fungovat uspokojivě tehdy, budou-li ovládací prvek číselník a funkce loadArtist() na pojmově tomtéž místě: v animačním klipu (v ukázce reprezentovaném klíčovým slo-

vem _parent).

My ale teď máme ovládací prvek číselník a funkci, kterou chceme zavolat, na různých místech, proto musíme kód mírně pozměnit, aby se správně „zacílil“ na funkci uvnitř klipu.

Změnu proveďte tímto postupem:

335 kapitola 9

Připojování k serverům pomocí webových služeb S příchodem Macromedia Flash MX 2004 Professional tu máme druhý nový prostředek pro získávání přístupu ve stylu RPC k funkcionalitě na serveru: přes webové služby. Místo toho, abychom měli jako prostředníka mezi Flashem a vaším kódem Flash Remoting Gateway, chová se jako zprostředkovatel jakákoli implementace vyhovující standardům webových služeb.

Poznámka Funkcionalita webových služeb, kterou probíráme v této kapitole, je k dispozici pouze ve vydání Professional Flashe MX 2004. Jestliže nepoužíváte profesionální vydání, ale přesto se chcete připojovat k existujícím webovým službám, můžete jako alternativu prozkoumat Flash Remoting. Flash Remoting Gateway se může na vašem serveru chovat jako proxy, připojí vás k nějaké webové službě na jiném serveru v zastoupení vaší animace Flashe. Podrobnosti viz kapitola 8,“ Připojování k serverům pomocí Flash Remoting“ a vaše dokumentace Flash Remoting. Viz také oddíl „Volby pro připojování k webovým službám“ v této kapitole.

Přehled podpory webových služeb ve Flashi Než začneme s konkrétními příklady, měl bych na úvod říci pár slov, která by vám pomohla dobře pochopit schopnosti webových služeb dostupných ve Flash MX 2004. V tomto oddílu uvádím přehled nové podpory webových služeb ve Flashi. Absolvujete také velmi rychlý kurz „letem-světem“ o tom, co jsou webové služby a co znamenají pro vás.

Co jsou to webové služby?

No, tak to je ta nejlepší otázka! Pro účely našeho výkladu se dají webové služby chápat jako speciální objekty, které sídlí, metaforicky, na nějakém webovém serveru. Podobně jako objekty v mnoha jiných programovacích jazycích, mohou mít mnoho metod a vlastností. Mazaná finta je v tom, že jsou metody a vlastnosti dostupné pomocí otevřené, standardní specifikace prostých jazyků a protokolů. Důsledkem je, že k jakékoli webové službě může přistupovat a využívat ji každý klient, který specifikaci rozumí. Nezáleží na tom, zda jsou služba a klient na téže lokální síti, zda byly vytvořeny stejným programovacím jazykem, nebo zda běží na stejném operačním systému nebo platformě.

336

FLASH MX Professional 2004 pro vývojáře webových aplikací

Poznámka No dobře, kompletní neutralita vůči platformám je stále ještě předmětem vývoje. Jak patrně víte, existují v současné běžné praxi dvě hlavní odrůdy webových služeb. Říci, že ta jedna je od Sun a druhá od Microsoftu, je patrně přílišné zevšeobecnění, leč prospěšné. Každopádně, když spolu tyto odrůdy hovoří, ne vždy se jim to dobře daří. Většina vývojářů nástrojů jiných společností – jako ti bystří hoši od Macromedia – usilují o to, aby jejich nástroje pracovaly stejně s oběma odrůdami.

Nemám dostatek času ani prostoru na to, abych se pouštěl do teoretického výkladu historie webových služeb, druhů potíží, které webové služby vyřešily nejlépe, ani kam spadají v stále překotném evolučním vývoji distribuované výpočetní techniky. Konec konců, tohle není kniha o webových službách. Chcete-li se o nich dozvědět víc, vyzývám vás, abyste si obstarali nějakou knihu věnovanou budování webových služeb s vaším oblíbeným aplikačním serverem, nebo abyste podnikli průzkumnou cestu online (vhodné místo, kde se dá začít, je třeba www.xml. com).

Jak člověk vytvoří webovou službu?

Další skvělá otázka! Odpovědí je, že to závisí na aplikačním serveru, neboli programovacím prostředí, které používáte. Každý aplikační server, kterým se v knize explicitně zabýváme – ColdFusion, ASP.NET a J2EE – poskytuje přinejmenším jeden druh prostředků pro vytváření webových služeb bez zbytečných nerváků a starostí. Obvykle píšete stejný druh kódu na straně serveru, jako normálně. Jen ho uložíte se speciální příponou souboru, umístíte do speciálního adresáře, nebo ho zaregistrujete s jistým druhem konfiguračního souboru nebo vizuálního rozhraní.

V této kapitole uvidíte několik prostých příkladů, je ale na vás, abyste se naučili, jak se vytvářejí a konfigurují webové služby na vašem serveru. Abych to vyjádřil z jiného úhlu pohledu, kapitola vás chce naučit, jak se připojuje k webovým službám, které už na vašich serverech existují; ne, jak se vytvářejí služby na zelené louce. K naposled zmíněnému tématu existuje spousta jiných knih a prostředků.

Několik stručných definic Podobně jako každá jiná moderní technologie vztahující se k internetu, i webové služby přicházejí se svou vlastní sadou akronymů a terminologií. V následujícím stručném výčtu jsou uvedeny specifické termíny, s nimiž se budete setkávat v průběhu této kapitoly. Je určen především pro čtenáře, kteří s webovými službami začínají. V žádném případě to není kompletní sada definic, měla by však být postačující k tomu, aby pro vás nebyl zbytek kapitoly úplnou záhadou.

• WSLD (Web Services Description Language). WSDL je formát založený na XML pro popis metod a vlastností, které poskytuje konkrétní webová služba. Všichni klienti webové služby – jedním z nich je Flash – používají popis WSDL služby k tomu, aby zjistili, jaké argumenty požadují jednotlivé metody, jaké datové typy mají argumenty a vlastnosti služby atd. Přehrávač Flashe využívá tyto informace při běhu pro připojení k serveru; IDE Flashe

Připojování k serverům pomocí webových služeb

337

používá tyto informace v době návrhu, aby vám zobrazilo metody a vlastnosti, které jsou k dispozici pro skriptování nebo vázání. Podle toho, z jaké branže pocházíte, můžete se na tento druh procesu odkazovat jako na „odhalení“ nebo „introspekci“ komponenty.

• URL WSDL. Popis WSDL konkrétní webové služby se tradičně činí dostupným jako URL HTTP, takže k ní mají snadný přístup klienti, kteří se o použití služby zajímají. Této URL se obvykle říká URL WSDL, což stačí, protože každý ví, o co jde. Pro vás, jakožto vývojáře nebo programátora, je URL WSDL obvykle jediná věc, kterou potřebujete znát dopředu, hodláte-li v nějakém konkrétním projektu použít nějakou webovou službu. Odtud si ho vezme vaše programovací nebo vývojové prostředí – v tomto případě IDE Flashe – a zajistí, aby vám byly metody a vlastnosti dostupné, buď v kódu, nebo v nějakém druhu vizuálního zobrazení. Ve Flashi budou metody a vlastnosti vidět v panelu Web Services a v inspektoru komponenty. Jak to funguje, uvidíte v průběhu kapitoly.

• SOAP (Simple Object Access Protocol). SOAP je specifikace, která se používá, když chce nějaký klient webové služby použít nějakou metodu nebo vlastnost konkrétní webové služby. SOAP definuje, primárně, formát XML obsahující informace o tom, k čemu chce klient přistoupit (například kterou metodu chce zavolat, nebo hodnotu které vlastnosti chce získat nebo nastavit), a také jaká data půjdou spolu s požadavkem (jako třeba hodnoty argumentů metod). Stejný základní formát použije i server, když odesílá odpověď zpět klientovi. Záměrně vynechávám různé odborné záležitosti – používají se jistá speciální záhlaví HTTP atd. – základní idea ale je, že se tyto „pakety“ informací kódovaných jako XML odesílají tam a zpět přes HTTP, a že takto spolu v podstatě klient a server komunikují.

• UDDI (Universal Description Discovery and Integration). Když někoho slyšíte, jak mluví o WSDL a SOAP, vychází ze stejných úst také často UDDI. Pomocí UDDI se vytvářejí „adresáře“, které mohou lidé nebo procesy využívat, když hledají URL WSDL webových služeb. Je to ve světě webových služeb něco jako DNS (nebo možná 411). Implementace webových služeb Flashe každopádně podporu UDDI nepotřebuje. Předpokladem, který je docela férový, je, že víte, ke které webové službě se chcete připojit. Je více než pravděpodobné, že jste ji sami vytvořili.

• Klient neboli konzument webové služby. Každý software. který ví, jak má mluvit s webovou službou a volat její metody, je klient webové služby (někdy se mu také říká konzument webové služby). Často se stává, že je klientem jiný server, který je buď na stejné lokální síti, nebo někde na internetu. Jindy je klientem samostatná aplikace instalovaná na uživatelově stroji. Samozřejmě, klienti webových služeb, které budeme probírat v této knize, jsou SWF, kteří se přímo připojují k webovým službám jako klienti (o specifikách se více dozvíte v příštím oddílu).

Dobrá, to by mělo pro potřeby zbývající části kapitoly stačit. Další informace o těchto pojmech a termínech si vyhledejte v dokumentaci toho aplikačního serveru, který používáte.

V dokumentaci byste také měli najít informace o tom, jak máte sestrojovat své vlastní webo-

338

FLASH MX Professional 2004 pro vývojáře webových aplikací

vé služby, k nimž pak bude možné přistupovat z Flashe nebo z kteréhokoli jiného klienta webové služby.

Flash jako klient webové služby Ještě jednou připomenu, že konzumentem webových služeb je pouze Flash MX 2004 ve vydání Professional. Funkcionalita je zabudovaná přímo do IDE Flashe, a při publikaci se kompiluje do vašich souborů SWF. Vskutku, je dobré mít stále na paměti, že při práci s webovými službami ve Flashi pracujete se dvěma různými klienty: • V době návrhu se IDE Flashe může chovat jako klient webových služeb, k nimž chce přistupovat vaše animace. Každá metoda služby vám pak bude dostupná v různých rozvíracích seznamech a voličích parametrů v inspektoru komponenty a v panelu Properties a také v novém panelu Web Services. Účelem této funkcionality je ulehčit vám život jakožto vývojáři. Místo toho, abyste si museli pamatovat názvy všech metod a jejich argumentů (a znovu a znovu je psát), můžete to hodit na bedra IDE Flashe, které bude sledovat vše potřebné.

• Při běhu se vaše SWF také chovají jako klienti webových služeb, takže různé prvky uživatelského rozhraní i kód skriptu mohou být v interakci s vašimi servery (nebo se servery jiných výrobců). Funkcionalita při běhu ví, jak stáhnout a interpretovat popisy WSDL služby zrovna tak, jako to ví IDE Flashe. Co je ale důležitější, ví také, jak vykonávat skutečné metody webové služby, takže lze přistupovat ke skutečným datům nebo logice na serveru.

Tedy, zatímco se IDE Flashe především zajímá o metadata webové služby (část WSDL), vaše SWF se především zabývají skutečnými voláními metod (část SOAP).

Volby pro připojování k webovým službám Při práci s webovými službami ve Flash MX 2004 máte na výběr několik voleb uvedených v následujícím výčtu. První z nich je nejsrozumitelnější a také se s ní pracuje nejsnadněji. Z těchto důvodů ji také většina lidí nejčastěji volí. Připomínám, že poslední dvě volby nevyžadují profesionální vydání Flashe.

• Komponenta WebServiceConnector. Je to volba, která nejnápadněji ční v IDE Flashe, v dokumentaci Flashe, i v seznamu nových schopností. Přetáhnete prostě komponentu WebServiceConnector na plochu, přidělíte jí URL WSDL, ke které se má připojit, pak přidáte řádek skriptu, který zavolá metodu trigger(). Komponenta podporuje vázání dat, takže s její pomocí můžete, chcete-li, aktualizovat ovládací prvky uživatelského rozhraní, aniž byste museli psát dodatečné skripty. Protože je tak flexibilní, relativně snadno se používá, a protože je příhodná i pro práci s novými schopnostmi rámce Flashe pro vázání dat (ale i pro práci bez něj), bude většina výkladu v kapitole věnována práci právě s touto komponentou. Naučíte se s ní pracovat v příštím oddílu „Práce s komponentou WebServiceConnector“.

Připojování k serverům pomocí webových služeb

339

• Instance třídy WebService. Dáváte-li přednost připojování k webové službě bez jakýchkoli komponent používaných v době návrhu, můžete přes skript vytvořit až při běhu instanci WebService. Tato volba by se vám mohla hodit tehdy, kdybyste potřebovali, aby se vaše animace připojovala k webovým službám dynamicky (tj. kde webová služba je, nebo jaké má metody a vlastnosti, není známo v době návrhu). Volbu proberu v oddílu „Připojování k webové službě pouze pomocí skriptu“ • Přes Flash Remoting. Většina implementací Flash Remoting Gateway (včetně té, která je zahrnutá do ColdFusion, a brány pro ASP.NET) poskytuje zabudovanou podporu pro připojování k webovým službám na serveru. Webová služba bude pro Flash viditelná jako vzdálená služba ve stylu Remoting, což zase znamená, že metody služby budou pro Flash dostupné jako vzdálené metody (k nimž lze přistupovat jako k jakékoli jiné vzdálené funkci služby). Podrobnosti o Flash Remoting viz kapitola 8.

• Přes jakoukoli jinou techniku probranou v této knize. Nové schopnosti webových služeb ve Flashi jsou bezva, protože IDE Flashe a přehrávač Flashe mají nyní zabudované chápání WSDL a SOAP, takže se můžete k webovým službám připojovat přímo. Není ovšem žádný zákon, který by vám zakazoval, abyste se připojovali ke svým vlastním stránkám na serveru pomocí jakýchkoli technik, a aby vaše stránky na serveru hovořily s webovými službami za scénou. Můžete se vrátit zpět do kapitol 6, 7 a 8 – do kapitol věnovaných čistému textu, resp. XML, resp. Remoting – a použít techniky, které jsou v kapitolách popsané.

V příkladech na serveru byste dotazy nahradili voláním webových služeb (v patřičné syntaxi pro server, který používáte). Jistě, Flash nebude vědět, že mluví s webovou službou. Bude si myslet, že prostě mluví s nějakou stránkou ad-hoc na serveru. To nemusí nutně být špatné řešení. Záleží na tom, jakou máte rádi všeobecnou architekturu svých webových aplikací. Doporučuji vám, abyste měli při čtení zbytku kapitoly tuto možnost stále na paměti.

Práce s komponentou WebServiceConnector V několika příštích oddílech se seznámíte s komponentou WebServiceConnector. Budete pracovat s ukázkovým dokumentem Flashe, který jsem nazval Rating Chart. Umožňuje uživatelům zobrazit informace o aktuálním hodnocení nějaké písně (uživatelé písně hodnotí v příkladu Song Rater kapitoly 8). Čerstvá hodnotící data stará nejvýše minutu poskytne webová služba.

K nim pak přistoupí Flash a zobrazí je jako jednoduchý sloupkový graf (viz obrázek 9.1).

340

FLASH MX Professional 2004 pro vývojáře webových aplikací

Obrázek 9.1. Data aktuálního hodnocení písní se zobrazí jako sloupkový graf.

Uživatelé mohou specifikovat období, za které chtějí hodnocení zobrazit. Udělají to tak, že napíšou datum do polí From a Through (od – do), nebo použijí jim poskytnutý objekt pro výběr data (viz obrázek 9.2).

Obrázek 9.2. Uživatelé si vybírají období, které se má na grafu zobrazit.

Uživatelé mohou také specifikovat, že by rádi viděli sérii informací. Vyberou v rozvíracím seznamu Animated snapshots položku daily, weekly nebo monthly (po dni, po týdnech, po měsících) (viz obrázek 9.3). Jestliže například uživatel vybere weekly, uvidí animovaný graf, který

Připojování k serverům pomocí webových služeb

341

zrcadlí týdenní změny v hodnocení písní. Nejprve se objeví informace vztahující se k prvnímu týdnu, následuje krátká pauza, pak následují informace za druhý týden atd.

Uživatel také může na jakýkoli sloupek umísit kurzor myši, čímž zobrazování pozastaví; když dá kurzor ze sloupku pryč, bude zobrazování ve stylu krok za krokem pokračovat.

Obrázek 9.3. Uživatelé získají animované grafy, zvolí-li něco jiného než volbu none.

Kód na serveru Jako obvykle se nejprve podíváme na kód na serveru, který pohání náš příklad. Každý z výpisů 9.1, 9.2 a 9.3 vytváří webovou službu, která vystavuje stejnou sadu metod Flashi (nebo jakémukoli jinému klientovi webové služby, který si k nim přeje přistupovat) pomocí ColdFusion, .NET, nebo Java. Přestože se kód i jiné implementační detaily v každém výpisu liší – pravděpodobně jsou to nejvíce odlišné výpisy v celé knize – všechny poskytují, z hlediska Flashe, ekvivalentní funkcionalitu.

V tabulce 9.1 jsou uvedeny metody, které veřejně vystavuje naše webová služba, bez ohledu na to, jaký se použil aplikační server. (Každá jednotlivá implementace může mít i jiné metody, ty se ale používají interně.)

Tabulka 9.1 Metody, které vystavují příklady webové služby tohoto oddílu Metoda

Popis

getSongs()

Vrátí informace o písních. Metoda vrátí pole objektů, pro každý záznam písně v databázi jeden. Každý objekt obsahuje dvě vlastnosti: idSong a sSongName.

getSongRatings( dStartDate, dEndDate, spanDivider)

Vrátí informace o hodnocení písní. Argumenty dStartDate a dEndDate definují časové období, za které se mají informace vrátit. Argument spanDivider sděluje metodě, zda se má období rozdělit do dílčích období: lze ho nastavit na d, ww, m nebo q, což vyjadřuje dny, týdny, měsíce a čtvrtletí; jestliže se nastaví na none nebo na nějakou jinou hodnotu, vrátí se jen jediná množina dat.

Metoda vrátí pole objektů, pro každé období jeden. Má-li spanDivider hodnotu none, bude jen jediný objekt, má-li některou z hodnot d, ww, m nebo q, bude objektů několik. Každý objekt obsahuje tři vlastnosti: dStartDate a dEndDate určují aktuální časové období; songs je pole písní z databáze.

Každá píseň je reprezentovaná dalším objektem, který má tři vlastnosti: idSong, AvgRating a NumRatings.

342

FLASH MX Professional 2004 pro vývojáře webových aplikací

Verze pro ColdFusion Výpis 9.1 ukazuje verzi ColdFusion webové služby, kterou využívá příklad Rating Chart. Vytvoří komponentu ColdFusion (CFC) s názvem SongRatingWebService. CFC obsahuje dvě funkce: veřejně přístupné metody getSongs() a getSongRatings() uvedené v tabulce 9.1, dále pak interní pracovní funkci s názvem getSeriesData(), která získává z databáze data za dané období.

Poznámka Názvy vašich vlastních CFC nemusí končit na WebService. Dělám to zde jen proto, aby byl z názvů zřejmý účel věcí.

Výpis 9.1 SongRatingWebService.cfc – Verze ColdFusion webové služby <cfcomponent> <!--- Tato funkce je vystavena přes webové služby ---> <cffunction name="getSongs" access="remote" returntype="query"> <!--- Lokální proměnné ---> <cfset var result = ""> <!--- Získá informace o písních z databáze ---> <cfquery name="result" datasource="VenueDB"> SELECT idSong, sSongName FROM Songs ORDER BY sSongName </cfquery> <!--- Vrátí result ---> <cfreturn result> </cffunction> <!--- Tato funkce je vystavena přes webové služby ---> <cffunction name="getSongRatings" access="remote" returntype="array"> <cfargument name="dStartDate" type="date" required="Yes"> <cfargument name="dEndDate" type="date" required="Yes"> <cfargument name="spanDivider" type="string" required="Yes"> <!--- Lokální proměnné ---> <cfset var result = ArrayNew(1)> <cfset var tempEndDate = ""> <cfset var seriesData = ""> <!--- Různé módy, v závislosti na argumentu spanDivider ---> <cfswitch expression="#spanDivider#"> <!--- Specifikuje-li se "none" nebo jiná, neznámá hodnota --->

Připojování k serverům pomocí webových služeb <cfdefaultcase> <!--- Získá data za toto období, připojí k poli result ---> <cfset seriesData = getSeriesData(dStartDate, dEndDate)> <cfset ArrayAppend(result, seriesData)> </cfdefaultcase> <!--- Jestliže byla specifikovaná platná hodnota pro rozdělení ---> <!--- období, vrátí několik dílčích období ---> <cfcase value="m,d,ww,q" delimiters=","> <!--- Cyklus, dokud nedojdeme na poslední období ---> <cfloop condition="dStartDate lte dEndDate"> <!--- Tohle je koncové datum tohoto období ---> <cfset tempEndDate = DateAdd(spanDivider, 1, dStartDate)> <!--- Získá data za toto období, přidá je do pole result ---> <cfset seriesData = getSeriesData(dStartDate, tempEndDate)> <cfset ArrayAppend(result, seriesData)> <!--- Tohle je počáteční datum dalšího období ---> <cfset dStartDate = tempEndDate> </cfloop> </cfcase> </cfswitch> <!--- Vrátí result ---> <cfreturn result> </cffunction> <!--- Interní funkce: vrátí data za jediné období ---> <cffunction name="getSeriesData" access="private" returntype="Struct"> <cfargument name="dStartDate" type="date" required="Yes"> <cfargument name="dEndDate" type="date" required="Yes"> <!--- Lokální proměnné ---> <cfset var result = StructNew()> <cfset var RatingsQuery = ""> <!--- Získá z databáze informace o písni a hodnocení ---> <cfquery name="RatingsQuery" datasource="VenueDB"> SELECT s.idSong, AVG(sr.nRating) AS AvgRating, COUNT(sr.idSongRating) AS NumRatings FROM Songs s LEFT OUTER JOIN SongRatings sr ON (s.idSong = sr.idSong AND dRatingDate >= <cfqueryparam value="#dStartDate#" cfsqltype="CF_SQL_TIMESTAMP"> AND dRatingDate <= <cfqueryparam value="#dEndDate#" cfsqltype="CF_SQL_TIMESTAMP">) GROUP BY s.idSong </cfquery>

343

344

FLASH MX Professional 2004 pro vývojáře webových aplikací <!--- Naplní datovou strukturu, která reprezentuje tuto sérii ---> <cfset result["startDate"] = dStartDate> <cfset result["endDate"] = dEndDate> <cfset result["songs"] = RatingsQuery>

<!--- Vrátí result---> <cfreturn result> </cffunction> </cfcomponent>

Poznámka ColdFusion bohužel nedodržuje velikost písmen v názvech sloupců. Místo toho, aby je ukládal se stejnou velikostí písmen, s jakou přišly z databáze, uloží ColdFusion interně názvy sloupců v samých velkých písmenech. To znamená, že se názvy sloupců přenesou do Flashe ve velkých písmenech, proto je musíte v kódu ActionScriptu psát také velkými písmeny.

Jak vidíte, je výpis docela prostý. Protože byla metoda getSongs() označena atributem access="remote", stane se dostupnou, jakmile se k CFC přistoupí jako k webové službě. Vnitřek funkce je extrémně jednoduchý: nad databází se vykoná dotaz s názvem result. Jeho výsledky se pak vrátí do Flashe (nebo do jakéhokoli jiného klienta, který informace požadoval) jako sada záznamů ve stylu výsledků dotazu.

Uvnitř metody getSongRatings() (která je také dostupná pro vzdálený přístup) se děje dvojí druh zpracování; závisí na argumentu spanDivider. Má-li spanDivider hodnotu none (nebo jakoukoli nefunkční hodnotu), zavolá funkce prostě interní metodu getSeriesData() a přidá výsledek do pole result. Má-li spanDivider jednu z dohodnutých hodnot (den, týden, měsíc, čtvrtletí), cykluje se přes období a volá se getSeriesData() pro každé dílčí období. Až veřejná funkce dokončí svou práci, bude pole result obsahovat objekt (který zase bude obsahovat pole objektů vztahující se k písním) pro každé dílčí období.

Poznámka Existuje mnoho, velmi mnoho způsobů, jak se dá napsat tento kód . Určitě to není nejefektivnější kód (hlavně proto, že vyžaduje separátní dotaz pro každé časové období), je ale velmi srozumitelný a dá se použít pro většinu databázových systémů. Ve skutečné praxi byste patrně napsali chytřejší příkaz SQL (nebo uloženou proceduru), který by získal všechny požadované informace najednou.

Nyní byste měli být schopni ověřit, že je webová služba dostupná. Navštivte ve svém prohlížeči tuto URL: http://localhost/venue/chapter09/SongRatingWebService.cfc (za předpokladu že je na vašem místním stroji typická instalace ColdFusion). Až dodáte své heslo (použijte stejné, které používáte pro ColdFusion Administrator), odpoví server dokumentační stránkou s názvy a argumenty všech metod (viz obrázek 9.4).

Připojování k serverům pomocí webových služeb

345

Obrázek 9.4. ColdFusion poskytuje pro CFC tuto automatickou dokumentační stránku.

Verze pro Microsoft .NET Výpis 9.2 ukazuje verzi .NET webové služby, kterou využívá příklad Rating Chart. Tato webová služba byla napsaná, aby byl kód co nejjednodušší, jako jediný ASM (Active Server Method) (soubor .asmx). Funkce označené řádkem [WebService] budou veřejně dostupné jako metody webové služby. Ve skutečné praxi byste možná zvolili pro svůj skutečný kód separátní soubor kódu (technika s „kódem v pozadí“, neboli code-behind).

Podrobnosti o sestrojování webových služeb XML s ASP.NET si najděte v dokumentaci .NET Framework SDK. Výpis 9.2 SongRatingWebService.asmx – Verze Microsoft .NET webové služby <%@ WebService Language="C#" Class="SongRatingWebService" %> using System.Web.Services; using System; using System.Data; using System.Data.Odbc; using System.Collections; using System.Xml.Serialization; [WebService(Namespace="http://nateweiss.com/fsg/webservices")] public class SongRatingWebService : WebService { [WebMethod(Description="Returns IDs and names of songs")]

346

FLASH MX Professional 2004 pro vývojáře webových aplikací

public Song[] getSongs() { // Databázový dotaz vracející data o písních string sql = "SELECT idSong, sSongName " + "FROM Songs ORDER BY sSongName"; OdbcConnection connection = new OdbcConnection("DSN=VenueDB"); OdbcCommand command = new OdbcCommand(sql, connection); connection.Open(); OdbcDataReader reader = command.ExecuteReader(); // Vyplní instancemi písní ArrayList ArrayList list = new ArrayList(); // Pro každý záznam z databáze vytvoří strukturu Song while(reader.Read()) { Song song = new Song(); song.IDSONG = reader.GetInt32(0); song.SSONGNAME = reader.GetString(1); list.Add(song); } // Převede ArrayList na normální pole C# Song[] result = new Song[list.Count]; list.CopyTo(result); // Vrátí pole return result; } [WebMethod(Description="Returns aggregated ratings for songs")] public SongRatingSeries[] getSongRatings( DateTime dStartDate, DateTime dEndDate, string spanDivider) { // K uchování sérií využije pole s měnitelnou velikostí ArrayList list = new ArrayList(); // Jestliže nejsou dílčí období if (spanDivider == "none") { // Získá sérii dat za období list.Add(getSeriesData(dStartDate, dEndDate)); // Jestliže bylo specifikované dílčí období } else { DateTime dTempEnd = new DateTime();

Připojování k serverům pomocí webových služeb // Cykluje, dokud se nedostaneme na poslední dílčí období while(dStartDate <= dEndDate) { // Spočte koncové datum tohoto období switch(spanDivider) { case "d": dTempEnd = dStartDate.AddDays(1); break; case "ww": dTempEnd = dStartDate.AddDays(7); break; case "m": dTempEnd = dStartDate.AddMonths(1); break; case "q": dTempEnd = dStartDate.AddMonths(3); break; } // Získá sérii dat pro dané období, přidá je do pole list.Add(getSeriesData(dStartDate, dTempEnd)); // Tohle je počáteční datum dalšího dílčího období dStartDate = dTempEnd; } } // Převede ArrayList na normální pole C# SongRatingSeries[] result = new SongRatingSeries[list.Count]; list.CopyTo(result); // Vrátí result return result; } // Interní funkce: vrací data jediného období private SongRatingSeries getSeriesData( DateTime startDate, DateTime endDate) { // Dotaz SQL, který získává informace o písních a jejich hodnocení string sql = "SELECT s.idSong, AVG(sr.nRating) AS AvgRating, " + "COUNT(sr.idSongRating) AS NumRatings " + "FROM Songs s LEFT OUTER JOIN SongRatings sr " + "ON (s.idSong = sr.idSong " + "AND sr.dRatingDate >= ? "+ "AND sr.dRatingDate <= ? )" + "GROUP BY s.idSong"; // Definuje databázové připojení // (V praxi byste pokaždé nevytvářeli nové připojení) OdbcConnection connection = new OdbcConnection("DSN=VenueDB"); OdbcCommand command = new OdbcCommand(sql, connection); // Naplní zástupce data nezávisle na databázi command.Parameters.Add("dRatingDate", OdbcType.DateTime); command.Parameters.Add("dRatingDate", OdbcType.DateTime); command.Parameters[0].Value = startDate;

347

348

FLASH MX Professional 2004 pro vývojáře webových aplikací command.Parameters[1].Value = endDate; // Vykoná dotaz connection.Open(); OdbcDataReader reader = command.ExecuteReader(); // Naplní datovou strukturu reprezentující tuto sérii dat SongRatingSeries result = new SongRatingSeries(); result.startDate = startDate; result.endDate = endDate; // Záznamy dat se budou udržovat v poli s měnitelnou velikostí ArrayList list = new ArrayList(); // Naplní pole daty while(reader.Read()) { SongRating rec = new SongRating(); rec.IDSONG = reader.GetInt32(0); rec.NUMRATINGS = reader.GetInt32(2); // GetDecimal() generuje chybu, když se získá null if (! reader.IsDBNull(1)) { rec.AVGRATING = reader.GetDecimal(1); } list.Add(rec); } // Převede ArrayList na normální pole C# result.songs = new SongRating[list.Count]; if (list.Count > 0) { list.CopyTo(result.songs); } // Vrátí result return result;

} // Metoda getSongs() vrátí pole této struct public struct Song { public int IDSONG; public string SSONGNAME; } // Metoda getSeriesData() vrátí pole této struct public struct SongRatingSeries { public DateTime startDate; public DateTime endDate; public SongRating[] songs; }

Připojování k serverům pomocí webových služeb

349

// Vlastnost SongRatingSeries.songs je pole této struct public struct SongRating { public int IDSONG; public decimal AVGRATING; public int NUMRATINGS; } }

.NET verze webové služby bohužel vyžaduje o něco víc kódu, než jste možná ochotni strávit. V době, kdy jsem tohle psal, neposkytovala komponenta WebServicesConnector dodávaná s počátečním vydáním Flash MX 2004 Professional přímou podporu metod, které vracejí instance DataSet. .NET. Alternativou je vrátit pole objektů, což se probírá v oddílu „Sady záznamů ve stylu výsledků dotazu a pole objektů“ této kapitoly, ke kterému se dostaneme za moment.

Normálně by člověk očekával, že bude moci pro objekty v poli použít hešovací tabulky nebo jiný obdobný typ. Webové služby .NET ovšem nemohou vracet hešovací tabulky (alespoň v době, když jsem tohle psal); musíte použít nějaký objekt se striktnější definicí. Nejpřímější řešení je definovat vlastní typ struct pro každou kombinaci databázových sloupců, které chcete z webových služeb vracet. (Mohli byste samozřejmě třídy struct definovat v separátním jmenném prostoru, aby se daly lépe opětovně využívat.)

Kromě toho, jestliže plníte pole objektů pomocí nějakého čtenáře dat (DataReader), je často nezbytné použít ArrayList, nikoli běžné pole s pevnou délkou (viz výpis 9.2), protože počet databázových záznamů, které čtenář dat načítá, není znám, dokud se nedojde na konec sady záznamů. Poté, co se ArrayList naplní, můžete ho převést na normální pole metodou ArrayList.

CopyTo(). Pak bude Flash moci zkonzumovat pole objektů, jako kdyby to byla sada záznamů výsledků dotazu.

Nyní byste měli být schopni ověřit, že je webová služba funkční. Navštivte ve svém prohlížeči tuto URL: http://localhost/venue/chapter09/SongRatingWebService.asmx (za předpokladu, že je na vašem místním stroji typická instalace .NET). IIS (Internet Information Server) by měl odpovědět jedinou webovou stránkou, na které jsou vypsané veřejné metody služby. Když kliknete na názvu metody, dostanete se na stránku, kde můžete metodu z prohlížeče otestovat (je to vidět na obrázku 9.5).

350

FLASH MX Professional 2004 pro vývojáře webových aplikací

Obrázek 9.5. IIS poskytuje pro každou webovou službu tuto automatickou dokumentační a testovací stránku.

Verze Java/J2EE Výpis 9.3 ukazuje verzi Java webové služby, kterou využívá příklad Rating Chart. Výpis je poměrně bezproblémová implementace metod vypsaných výše. Jedním z prvků, které stojí za zmínku, je soukromá pomocná funkce makeArrayList(), která vezme java.sql.ResultSet a převede ho na java.util.ArrayLIst vyplněný instancemi java.util.Hashtable, kde každá hešovací tabulka reprezentuje řádek dat z databáze. Tento krok je nezbytný, protože ResultSet není přímo serializovatelný přes webové služby.

Poznámka Alternativou by bylo vrátit nějaký objekt, který podporuje rozhraní javax.sql.WebRowSet. Očekává se, že je bude podporovat komponenta WebServiceConnector Flashe. Tato alternativa bude pravděpodobně efektivnější, nebylo ale možné dát pro knihu dohromady bezproblémový příklad, protože v aktuální distribuci Java není zařazena skutečná implementace WebRowSet (definuje jen rozhraní). V době, kdy jsem tohle psal, se očekávalo, že verze 1.5 Java JRE bude zahrnovat standardní implementace různých rozhraní RowSet, takže je pravděpodobné, že až budete knihu číst, bude k dispozici více informací.

Výpis 9.3 SongRatingWebService.jws – Verze Java webové služby /* Bude-li tento soubor uložen jako .jws, bude vystavený mnoha enginami jako "instantní" webová služba. Alternativně ho lze uložit a zkompilovat jako obyčejnou třídu Java, a pak konfigurovat, aby byla vystavena jako webová služba pomocí prvku <service> ve vašem konfiguračním souboru WEB-INF/server-config.wsdd vašeho serveru JSP/J2EE. */ import java.sql.*;

Připojování k serverům pomocí webových služeb import java.util.*; public class SongRatingWebService { private String dbDriver = "sun.jdbc.odbc.JdbcOdbcDriver"; private String dbURL = "jdbc:odbc:VenueDB"; // Tato funkce je vystavena přes webové služby public ArrayList getSongs() throws java.lang.ClassNotFoundException, java.sql.SQLException { // Tohle je dotaz SQL, kterým se načtou data String sql = "SELECT idSong AS IDSONG, sSongName AS SSONGNAME" + " FROM Songs ORDER BY sSongName"; // Vykoná dotaz SQL nad ukázkovou databází Class.forName(dbDriver); Connection con=DriverManager.getConnection(dbURL); ResultSet rs = con.createStatement().executeQuery(sql); return makeArrayList(rs); } // Tato funkce je vystavena přes webové služby public ArrayList getSongRatings( java.util.Date dStartDate, java.util.Date dEndDate, String spanDivider) throws java.lang.ClassNotFoundException, java.sql.SQLException { // Sérii dat bude udržovat v poli s měnitelnou velikostí ArrayList result = new ArrayList(); // Jestliže se nežádají dílčí období if (spanDivider.equals("none")) { result.add(getSeriesData(dStartDate, dEndDate)); // Jestliže bylo specifikované nějaké dílčí období } else { // Pro přidávání data získá instanci třídy Calendar GregorianCalendar cal = new GregorianCalendar(); // Cykluje, dokud se nedostane k poslednímu časovému období while(dStartDate.compareTo(dEndDate) <= 0) { // Spočte koncové datum tohoto období cal.setTime(dStartDate); if (spanDivider.equals("ww")) cal.add(cal.WEEK_OF_YEAR, 1); else if (spanDivider.equals("d")) cal.add(cal.DATE, 1);

351

352

FLASH MX Professional 2004 pro vývojáře webových aplikací else if (spanDivider.equals("m")) cal.add(cal.MONTH, 1); else if (spanDivider.equals("q")) cal.add(cal.MONTH, 3); // Získá sérii dat pro období, přidá je do pole result.add(getSeriesData(dStartDate, cal.getTime())); dStartDate = cal.getTime(); } } // Vrátí result return result;

} // Interní funkce: vrátí data za jediné časové období private Hashtable getSeriesData( java.util.Date dStartDate, java.util.Date dEndDate) throws java.lang.ClassNotFoundException, java.sql.SQLException { // Získá databázové připojení Class.forName(dbDriver); Connection con = DriverManager.getConnection(dbURL); // Kód SQL pro získání informací o písních a o jejich hodnocení String sql = "SELECT s.idSong AS IDSONG, " + "AVG(sr.nRating) AS AVGRATING, " + "COUNT(sr.idSongRating) AS NUMRATINGS " + "FROM Songs s LEFT OUTER JOIN SongRatings sr " + "ON (s.idSong = sr.idSong " + "AND sr.dRatingDate >= ? "+ "AND sr.dRatingDate <= ? )" + "GROUP BY s.idSong"; // Nastaví parametry dotazu a vykoná dotaz PreparedStatement statement = con.prepareStatement(sql); statement.setTimestamp(1, new Timestamp(dStartDate.getTime())); statement.setTimestamp(2, new Timestamp(dEndDate.getTime())); ResultSet rs = statement.executeQuery(); // Naplní hešovací tabulku, která reprezentuje tuto sérii Hashtable result = new Hashtable(); result.put("startDate", dStartDate); result.put("endDate", dEndDate); result.put("songs", makeArrayList(rs)); // Vrátí result return result; }

Připojování k serverům pomocí webových služeb

353

// Pomocná funkce, která ulehčuje získání java.util.ArrayList naplněného // instancemi java.util.Hashtable pro každý řádek v ResultSet private ArrayList makeArrayList(ResultSet rs) throws java.sql.SQLException { // Tohle je pole s měnitelnou velikostí, které se vrátí ArrayList result = new ArrayList(); // Získá metadata (názvy sloupců a podobně) z ResultSet ResultSetMetaData meta = rs.getMetaData(); // Pro každý řádek v ResultSet while (rs.next()) { // Nová hešovací tabulka pro tento řádek Hashtable hash = new Hashtable(); // Pro každý sloupec v ResultSet přidá do hešovací tabulky // dvojici název/hodnota for (int i = 1; i <= meta.getColumnCount(); i++) { Object val = rs.getObject(i); if (val == null) val = ""; hash.put(meta.getColumnName(i), val); } // Přidá hešovací tabulku do pole result.add(hash); } // Vrátí result return result; } }

Mnohé enginy Java Web Services podporují dva různé způsoby vytváření webové služby.

Prvním je uložit zdrojový kód Java nějaké obyčejné třídy jako soubor .jws (Java Web Service).

Server třídu za pochodu zkompiluje a vystaví její veřejné metody jako metody webové služby.

Nebo se třída uloží někam na cestu ke třídám serveru, a pak se přidá do konfiguračního souboru server-config.wsdd ve vaší složce WEB-INF prvek <service>.

Ve výpisu 9.3 se předpokládá, že používáte takový engin webové služby, který podporuje jednodušší techniku .jws. JRun 4, ColdFusion MX 6.1 a další servery J2EE vybavené enginem Apache AXIS podporují soubory .jws. Jestliže váš server Java nepodporuje soubory .jws, přesto by se vám mělo podařit příklad rozchodit, když uložíte výpis 9.3 s příponou .java, zkompilujete ho, přidáte třídu na cestu ke třídám, a pak přidáte do server-config.wsdd následující prvek <service>:

354

FLASH MX Professional 2004 pro vývojáře webových aplikací

<service name=“RongRatingWebService“ provider=“java:RPC“> <parameter name=“methodName“ value=“getSongs getSongRatings“/> <parameter name=“className“ value=“venue.chapter09.SongRatingWebService“/> </service>

Nyní byste měli být schopni ověřit, že je webová služba funkční. Navštivte ve svém prohlížeči tuto URL: http://localhost/venue/chapter09/SongRatingWebService.jws (za předpokladu, že je na vašem místním stroji typická instalace JRun nebo jiná instalace vybavená AXIS). Váš server by měl odpovědět prostou webovou stránkou, na které by měl být název služby (jak je vidět na obrázku 9.6). Podle toho, o jaký server se jedná, možná zde budou i odkazy na automatickou dokumentaci nebo na testovací stránky.

Obrázek 9.6.Většina implementací Java poskytne pro webovou službu stránku HTML.

Nepoužíváte-li soubory .jws, bude URL pro stránku, kterou vidíte na obrázku 9.6, jiná. Může být dost závislá na serveru Java, který používáte. Zkuste jako první pokus http://localhost/ services/SongRatingWebService.

Sady záznamů ve stylu výsledků dotazu a pole objektů Když jsem psal tuto část knihy, uměla funkcionalita webových služeb dodávaná s Flashem přímo konzumovat sady záznamů dat z ColdFusion. V Java a .NET vám to může dát kvůli následujícím věcem poněkud víc práce.

• Metoda webové služby založená na ColdFusion, která vrací sadu záznamů ve stylu výsledků dotazu, odešle data do Flashe pomocí datového typu QueryBean. Uvnitř ActionScriptu se s tímto datovým typem zachází jako s každým jiným polem objektů (kde každý objekt v poli má pro každý sloupec dvojici název/hodnota, a kde každý prvek pole reprezentuje řádek). Skutečně, výstup takové metody můžete změnit z jednoho návratového typu na jiný

Připojování k serverům pomocí webových služeb

355

(například na nějaký dotaz, nebo na nějaké pole struktur), aniž byste museli sahat na kód ActionScriptu .

• Metodu webové služby založenou na Javě, která vrací nějakou implementaci javax.sql.

WebRowSet, by měl Flash zkonzumovat, aniž by se muselo zařizovat mnoho speciálních záležitostí. Protože ale v době, kdy jsem tohle psal, nebyla taková implementace součástí typické distribuce Javy, příklady v této knize tuto schopnost nevyužívají. Alternativou je napsat metodu na straně serveru tak, že vrátí pole objektů (hešovací tabulky, například) a Flash je zpracuje stejným způsobem.

• Metodu webové služby .NET, která vrací sadu záznamů ve stylu ADO.NET, nemohou přímo konzumovat komponenty webových služeb, které se dodávaly s počáteční verzí Flash MX 2004. Data musíte převést na pole objektů a vrátit toto pole. Je docela možné, že se v průběhu doby, než se kniha dostane do tisku, komponenty Flashe zaktualizují, a že to, co jsem právě napsal, už platit nebude.

Protože ColdFusion vždy vrací názvy sloupců ve velkých písmenech (viz poznámka za výpisem 9.1) , uvádějí se ve všech výpisech této kapitoly názvy sloupců velkými písmeny. Kromě toho, verze .NET a Java (výpisy 9.2 a 9.3) používají ve svých databázových dotazech klauzule AS, aby si vynutily názvy sloupců ve velkých písmenech. Tyto neobvyklé praktiky jsou zde hlavně proto, aby se dal se všemi servery snadněji použít tentýž SWF. Nepracujete-li s ColdFusion, můžete přejmenovávání s AS vynechat a použít ve svém kódu ActionScriptu obvyklé názvy sloupců s velkými písmeny jen na začátku slov (sSongName, ne SSONGNAME).

Testování kódu na straně serveru Chcete-li otestovat, zda kód na serveru z výpisů 9.1, 9.2, nebo 9.3 pracuje správně, navštivte URL WSDL nové webové služby na svém serveru. Přesná URL WSDL se bude trochu měnit podle toho, který aplikační server používáte, zda je instalovaný na vašem místním stroji, a jak je nakonfigurovaný.

V tabulce 9.2 jsou uvedené URL WSDL, které nejpravděpodobněji použijete pro přístup k nové webové službě na svém serveru. Jako obvykle nahraďte localhost skutečným názvem nebo IP adresou vašeho serveru, není-li nainstalovaný na vašem místním stroji. Kromě toho nezapomeňte přidat číslo portu HTTP, jestliže váš server naslouchá jinde než na výchozím portu (80).

Tabulka 9.2 Typické URL WSDL pro ukázkové webové služby Server

URL WSDL

ColdFusion MX

http://localhost/venue/chapter09/SongRatingWebService.cfc?WSDL

Microsoft .NET

http://localhost/venue/chapter09/SongRatingWebService.asmx?WSDL

JRun 4

http://localhost/venue/chapter09/SongRatingWebService.jws?WSDL ... pokračování

356

FLASH MX Professional 2004 pro vývojáře webových aplikací

Server

URL WSDL

Jiné J2EE

Přesná URL bude záviset na engině webové služby, kterou budete používat (Tomcat/AXIS, WebSphere atd.) Nejslibnějšími kandidáty jsou tyto dvě URL: http://localhost/venue/chapter09/SongRatingWebService.jws?WSDL http://localhost/services/SongRatingWebService?WSDL

Když ve svém webovém prohlížeči navštívíte patřičnou URL z tabulky 9.2, měli byste dostat zpět obsah WSDL, který popisuje novou webovou službu. Přesný obsah WSDL je poněkud závislý na serveru, který používáte, měl by ale obsahovat jasné odkazy na metodu getSongRatings() a její argumenty (viz obrázek 9.7). Jestliže se vám zdá, že se neobjevil správný WSDL, nebo obdržíte-z vašeho aplikačního serveru nějakou chybovou zprávu, bude možná nutné, abyste se podívali do dokumentace vašeho serveru a zjistili, zda není třeba učinit nějaké dodatečné konfigurační kroky.

Obrázek 9.7.Váš server by nyní měl vrátit obsah WSDL, který popisuje novou službu.

Poznámka S obsahem se netrapte; není pro vás důležité, abyste rozuměli, co přesně dělají všechny prvky, atributy a odkazy na jmenný prostor ve WSDL. Tomu potřebuje rozumět pouze Flash – nebo ten klient webové služby, který má ke službě přistoupit. Chcete-li se dozvědět něco navíc, podnikněte online několik rychlých hledání, jimiž se dostanete k referenční příručce WSDL, kde se vysvětluje vše velmi podrobně.

Není to zrovna lehká četba na dovolenou, ale možná zjistíte, že je to docela zajímavé.

Komponenty použité v příkladu Rating Chart Otevřete teď dokument RatingChart.fla (najdete ho ve složce ukázkových souborů kapitoly).

Uvidíte, že je to relativně prostý dokument se čtyřmi vrstvami:

Připojování k serverům pomocí webových služeb

357

• Vrstva Actions obsahuje jen jediný řádek kódu: direktivu #include, která vkládá externí soubor s názvem RatingChartMainCode.as. V něm je umístěn skutečný kód ActionScriptu pro dokument.

• Vrstva UI Elements obsahuje ovládací prvky uživatelského rozhraní pro výběr počátečního a koncového data atd. (jsou vidět na obrázku 9.3). Vrstva dále obsahuje dvě instance komponenty WebServiceConnector s názvy wsGetSongs a wsGetSongRatings.

• Vrstva UI Background obsahuje jen něco stínování a textů, aby byl vzhled rozhraní v rozumné míře hezký.

• Vrstva Bar Chart obsahuje instanci komponenty SimpleBarChart. Jak její název napovídá, umí komponenta produkovat jednoduché sloupkové grafy (více o tom za moment).

Instanci na ploše jsem přidělil název instance bcChart.

Některé z komponent jsme ještě v knize neprobírali. Většinou se ale chovají a používají bezproblémově (vysvětlují dobře samy sebe), takže pro všechny tyto komponenty neuvádím kompletní samostatný úvod a referenční příručky tříd. Informace o konkrétních podporovaných vlastnostech, metodách a událostech si můžete vyhledat v dokumentaci Flashe, většinou ale půjde jen o to, přetáhnout na plochu instanci dané komponenty a nastavit několik jejích vlastností v inspektoru komponenty.

Takže uvedu jen stručný přehled komponent použitých v příkladu, abyste si udělali představu o tom, co se bude dít ve zbývající části oddílu. V následujícím výčtu jsou uvedeny komponenty, které najdete v dokumentu RatingChart.fla. Ke každé z nich připojuji několik poznámek.

• Dvě komponenty DateField s názvy dfStartDate a dfEndDate. Komponenty DateField jsou skvělé, když potřebujete, aby uživatel mohl snadno a rychle zadat datum. Uživatelé mohou datum napsat, nebo si kliknutím na ikoně zobrazí kalendář (je vidět na obrázku 9.2) a vyberou datum v něm.

• Komponenta ComboBox s názvem dbSpanDivider. Její vlastnost data byla v inspektoru komponenty nastavena na [0, 1, 7, 30], a vlastnost labels na odpovídající popisky (pro nic, dny, týdny, měsíce atd.). Jestliže například uživatel vybere z pole se seznamem hodnotu weekly (týdně), bude její hodnota 7. Aktuální hodnota, kterou uživatel právě vybral, je v ActionScriptu dostupná jako hodnota vlastnosti value.

• Komponenta Button s viditelným nápisem Show. Tlačítko má v panelu Actions ke své události click připojený jeden řádek kódu. Řádek volá metodu trigger() (viz tabulka 9.3 v příštím oddílu) komponenty WebServiceConnector na ploše. Připomínám, že komponenty Button odpalují události click, zatímco symboly tlačítek, která vyrábíte sami, odpalují událost onRelease. Jako vždy můžete buď vytvořit zpracovatele události v nějakém snímku, nebo napsat třídu ActionScriptu 2.0 a zavěsit ji na tlačítko pomocí addEventListener() (a nedávat kód do panelu Actions k samotnému objektu tlačítka). Podrobnosti o různých možnostech reakcí na události viz kapitola 4, „Slabikář ActionScriptu“.

358

FLASH MX Professional 2004 pro vývojáře webových aplikací

• Komponenta SimpleBarChart s názvem bcChart. Komponenta SimpleBarChart nepatří mezi komponenty, které se dodávají s Flashem. Vytvořil jsem ji pro potřeby příkladu a vysvětluji ji stručně v dodatku A, „Připomínky k budování komponenty SimpleBarChart“.

Vystavuje nevelkou sadu vlastností a metod, jimiž se grafu sdělí, jaká data má zobrazit a jak je má prezentovat.

Poznámka Komponenta SimpleBarChart, kterou používám v této kapitole, je relativně prostá a obsahuje jen několik schopností. Napsal jsem ji speciálně pro potřeby knihy tak, aby to byl funkční příklad propracovaný do dostatečné hloubky. Aby na něm by bylo vidět, co to znamená, když chcete vyrobit své vlastní vizuální prostředky pro data. Chcete-li nějaký vyspělejší graf, nebo potřebujete jiný typ grafu nebo sloupků (a nechcete se s tím psát), navštivte stránky Macromedia Flash Exchange na adrese www. macromedia.com. Je tam k dispozici mnoho vyspělých, na komponentách založených řešení (obvykle levných) jiných výrobců. Dalším skvělým místem pro hledání komponent je www.flashcomponents. net.

Referenční příručka komponenty WebServiceConnector Když jste se seznámili s kódem na straně serveru, který dodává data pro příklad Rating Chart, je na čase, abychom se zblízka podívali na komponentu Flashe, kterou používáme pro připojení k serveru: WebServiceConnector. Tato vyspělá komponenta umožňuje neobyčejně snadno budovat animace Flashe, které konzumují (tj. užívají) webové služby. Jak uvidíte v příštím oddílu, chcete-li zavolat jakoukoli metodu nějaké webové služby, stačí udělat jen několik drobných krůčků.

V tabulce 9.3 jsou uvedeny metody, vlastnosti a události, které podporuje komponenta WebServiceConnector.

Tabulka 9.3 Členy komponenty WebServiceConnector Člen

Popis

WSDLURL

Vlastnost. URL WSDL webové služby, ke které chcete přistoupit. Připomínám, že název této vlastnosti je v samých velkých písmenech (což je jistá anomálie). Na konkrétní URL WSDL, kterou pravděpodobně použijete při připojování k vašemu serveru v příkladu Rating Chart, se podívejte do tabulky 9.2.

operation

Vlastnost typu String. Název metody webové služby, kterou chcete volat (například getSongRatings, chcete-li zavolat metodu getSongRatings() z tabulky 9.1). Vezměte prosím na vědomí, že se specifikovaná metoda webové služby nezavolá, dokud se při běhu přes skript nevykoná metoda trigger() komponenty.

suppressInvalidCalls

Vlastnost. Určuje, zda se má volání metody webové služby potlačit, jestliže jsou hodnoty dodané pro parametry služby neplatné (například mají špatný datový typ).

Má-li hodnotu false (výchozí), metoda webové služby se přesto zavolá, což může znamenat, že webová služba vygeneruje chybovou zprávu (v závislosti na tom, jak jazyk na straně serveru zpracovává konverze datových typů atd.). Má-li hodnotu true, metoda webové služby se nezavolá; místo toho komponenta odpálí událost status s vlastností code nastavenou na InvalidParams.

Připojování k serverům pomocí webových služeb

359

Člen

Popis

multipleSimultaneousAllowed

Vlastnost. Určuje, zda bude moci komponenta vykonávat několik volání webové služby najednou. Má-li hodnotu true (výchozí), je povoleno více volání; má-li hodnotu false, odpálí druhé volání událost status s vlastností code nastavenou na CallAlreadyInProgress, není-li první volání ještě dokončené. Stojí za zmínku, že se zde nejedná ani o zásobník nebo frontu typuFIFO (první tam a první ven); takže není žádná garance, že server nebude reagovat na druhé či třetí volání, ještě než se dokončí první volání. Komponenta bude odpalovat své události result v tom pořadí, v jakém docházejí odpovědi od serveru, které mohou, ale nemusejí být ve stejném pořadí, v jakém byly iniciovány.

params

Vlastnost. Parametry (argumenty), které se mají dodat metodě webové služby, jako pole. Parametry musíte uvést ve stejném pořadí, v jakém jsou definované v implementaci metody na serveru (a tedy ve stejném pořadí, v jakém jsou popsané ve WSDL služby). Často se pro poskytování těchto parametrů využívá vázání dat, nedodáváte pole params sami.

trigger()

Metoda. Vykoná metodu webové služby. Komponenta odpálí svou událost result, když obdrží odpověď od serveru. Podle toho, jaké hodnoty mají vlastnosti suppressInvalidCalls a multipleSimultaneousAllowed, je možné, že volání bude potlačeno; pokud k tomu dojde, komponenta odpálí svou událost status s patřičnou hodnotou vlastnosti code.

status

Událost. Odpálí se, když se změní stav komponenty. Flash předá události jediný argument, což je stavový objekt. Stavový objekt obsahuje vlastnosti code, target a data. Z nich je nejzajímavější vlastnost code; bude nastavena na StatusChange (indikuje normální operaci), CallAlreadyInProgress (což může nastat, když má mu ltipleSimultaneousAllowed hodnotu false), InvalidParams nebo WebServiceFault (indikuje chybovou podmínku). Vlastnost target je odkaz na WebServiceConnector, která odpálila událost. Vlastnost data obsahuje dodatečné informace o stavu volání webové služby. Informace budou různé podle obsahu code. Konkrétní hodnoty vlastnosti data, které Flash poskytuje za různých okolností, si vyhledejte v dokumentaci Flashe.

results

Vlastnost. Data, pokud jsou nějaká, která vrací metoda webové služby. Datový typ vlastnosti závisí na metodě webové služby (results bude String, jestliže metoda vrací řetězec, instance třídy Array, jestliže metoda vrací pole atd.).

result

Událost. Odpálí se po úspěšném dokončení volání metody webové služby. Flash předá do jakéhokoli zpracovatele události, kterého poskytnete, jediný argument (říká se mu objekt události). Objekt result obsahuje vlastnosti type a target. Vlastnost type je vždy nastavená na řetězec result; target je odkaz na WebServiceConnector, která odpálila událost. Na data vrácená vzdálenou metodou se můžete odkázat pomocí target.results nebo název_konektoru.results (kde název_konektoru zastupuje název instance komponenty).

send

Událost. Odpálí se jako důsledek volání metody trigger(), těsně před tím, než se kontaktuje server, aby vykonal metodu webové služby. Do zpracovatelů události, které poskytnete pro tuto událost, se předává objekt události; objekt obsahuje vlastnosti type a target (viz událost result v předchozím řádku tabulky).

Poznámka Členy komponenty WebServiceConnector vypsané v tabulce 9.3 se také aplikují na třídu WebService, kterou vytváříte při běhu syntaxí new WebService(). Podrobnosti viz oddíl „Připojování k webové službě pouze pomocí skriptu“ později v této kapitole.

360

FLASH MX Professional 2004 pro vývojáře webových aplikací

Základní způsob používání komponenty WebServiceConnector Když už teď víte, jaké metody, vlastnosti a události poskytuje komponenta WebServiceConnector, pojďme se podívat, jak se dají některé její členy využít v praxi.

Pohlédněte na ploše v dokumentu RatingChart.fla na horní WebServiceConnector (komponenta má název instance wsGetRatings). Vyberte komponentu a otevřete panel inspektora komponenty. Na stránce Parameters si všimněte, že WSDLURL byla nastavena na jednu z URL uvedených v tabulce 9.2 a že vlastnost operation byla nastavena na getSongRatings (viz tabulka 9.1). Na stránce Schema byla vlastnost params naplněna argumenty metody getSongRatings() (dStartDate, dEndDate a spanDivider). Na stránce Bindings byly tyto tři parametry svázány s ovládacími prvky dfStartDate, dfEndDate a cbSpanDivider.

Zajímá-li vás proces, kterým se takto připraví komponenta WebServiceConnector, odstraňte teď její instanci z plochy a opětovně ji vytvořte pomocí postupu uvedeného za poznámkou.

Poznámka Následující kroky vás doprovodí postupem, jímž svážete s WebServiceConnector dva ovládací prvky pro výběr data a jeden rozvírací seznam. Podle toho, jaký styl práce máte v oblibě, možná raději zkopírujete hodnoty z ovládacích prvků do argumentů webové služby přes skript (a nedovolíte, aby kopírování hodnot provedlo za vás vázání dat). Jestliže to chcete udělat takto, přeskočte celý proces a rovnou místo vázání přidejte potřebných pár řádků kódu (ukázka viz oddíl „Připojování k webové službě pouze pomocí skriptu“ později v této kapitole.

1. Přetáhněte z panelu Components na plochu novou instanci WebServiceConnector a přidělte jí název instance wsGetSongRatings. Nezáleží na tom, kam komponentu umístíte, protože při prohlížení animace nebude vidět. Já je obvykle umisťuji do šedé pracovní oblasti obklopující bílou část plochy.

2. Na stránce Parameters panelu Properties nebo inspektora komponenty vyplňte hodnotu WSDLURL patřičnou URL pro váš server (podrobnosti viz tabulka 9.2 výše). Až stisknete Enter, pravděpodobně zjistíte, že Flash chvilku šrotuje v pozadí. IDE kontaktuje váš server, aby získalo kód WSDL popisující váš server (viz obrázek 9.7) výše.

3. Stále na stránce Parameters zadejte pro operation hodnotu getSongRatings. Hodnotu můžete napsat ručně, nebo ji vybrat z rozvíracího seznamu (viz obrázek 9.8).

Obrázek 9.8. Metody, které poskytuje webová služba, jsou dostupné v rozvíracím seznamu operation.

Připojování k serverům pomocí webových služeb

361

Poznámka Hleďme, hleďme. Jakpak vlastně Flash ten seznam naplnil? Získal dostupné operace (metody) z obsahu WSDL, který si stáhl z vašeho serveru. Jestliže vás to nevzrušilo, je s vámi patrně něco v nepořádku. Pro jistotu si přeměřte tep.

4. Stále na stránce Parameters nastavte multipleSimutaneousAllowed na false (podrobnosti viz tabulka 9.3).

5. Aktivujte v inspektoru komponenty stránku Schema a všimněte si, že prvky schématu už jsou naplněné; nemusíte to dělat sami. Pod prvkem params – který reprezentuje argumenty metody webové služby -. byste měli vidět prvky s názvy dStartDate, dEndDate a spanDivider (viz obrázek 9.9). Dále si všimněte, že byly patřičně nastaveny i datové typy argumentů (argumenty dStartDatea dEndDate obsahují datum, spanDivider je řetězec). Kromě toho byl nastaven datový typ results na Array (prvek [n] pod ním je zástupce prvků pole). Všechno se to stalo automaticky, když jste pro parametr operation vybrali getSongRating (to je vidět na obrázku 9.8 výše). Na stránce Schema nemusíte upravovat žádné prvky; jen vezměte na vědomí, že Flash ví, co každá metoda vaší webové služby potřebuje, a co vrací.

Poznámka V mnohých situacích není nutné ručně upravovat pro metody webové služby žádná nastavení jednotlivých prvků ve schématu. Několik nastavení je ale k dispozici a chcete-li, můžete je prozkoumat.

Konkrétně, nastavení formatter a encoder se mohou hodit tehdy, chcete-li zobrazit informace (jako je třeba datum) napsané do ovládacích prvků TextInput nebo Label jako naformátované řetězce. Kromě toho může být prospěšné i nastavení validation options, vážete-li ovládací prvky uživatelského rozhraní proto, abyste vytvořili nějaké rozhraní pro pořizování dat. Některé z těchto voleb probereme v kapitole 11, „Budování lepších formulářů s Flashem“. Kompletní vysvětlení jednotlivých nastavení najdete v dokumentaci Flashe.

Obrázek 9.9. Metadata webové služby pro argument a návratovou hodnotu se vám automaticky naplní na stránce Schema komponenty.

362

FLASH MX Professional 2004 pro vývojáře webových aplikací

6. Klikněte v inspektoru komponenty na záložku stránky Bindings. Klikněte na tlačítko Add Binding (na znaménko plus), pak v dialogovém okně Add Binding zvolte parametr dStartDate (viz obrázek 9.10). Klepněte na OK, čímž vazbu přidáte.

Obrázek 9.10. Každý argument, který webová služba očekává, můžete vázat na data.

7. Klikněte na volbu bound to nové vazby, pak klikněte vpravo na ikoně lupy (viz obrázek 9.11), abyste otevřeli dialogové okno Bound To.

Obrázek 9.11. Poté, co přidáte argumentu vazbu, musíte uvést ovládací prvek, se kterým má být svázán.

8. Vyberte na levé straně dialogového okna Bound To ovládací prvek dfStartDate a ověřte, že je na pravé straně vybraná vlastnost selectedDate (viz obrázek 9.12). Některé ovládací prvky uživatelského rozhraní mají na pravé straně několik prvků, z nichž můžete volit; ovládací prvky DateField však mají jen jeden prvek, selectedDate, (reprezentuje samozřejmě datum, které uživatel vybere při běhu).

Připojování k serverům pomocí webových služeb

363

Obrázek 9.12. Závěrečným krokem při vázání je vlastnost selectedDate ovládacího prvku DateField.

9. Zopakujte kroky 6 až 8 pro parametr dEndDate a komponentu dfEndDate.

10. Zopakujte kroky 6 až 8 ještě jednou, tentokrát pro parametr spanDivider a ovládací prvek cbSpanDivider. Až se dostanete do dialogového okna Bound To (viz obrázek 9.12), zvolte vlastnost value (protějšek selectedDate). U ovládacích prvků ComboBox je hodnota toho, co uživatel vybral, dostupná ve vlastnosti value; tento ovládací prvek nevystavuje vlastnost selectedDate.

Poznámka Komponenta ComboBox má ještě několik dalších vlastností, které lze vázat na data (dataProvider, selectedIndex a selectedItem). Každý typ komponenty vystavuje jiné vlastnosti, které lze vázat na data. To si už prozkoumejte samostatně, nebo se obraťte na dokumentaci Flashe, která obsahuje pro každou komponentu kompletní seznam takových vlastností.

Několik slov ke komponentě SimpleBarChart Než se ponoříme do kódu ActionScriptu příkladu Rating Chart, měli byste dobře rozumět tomu, co dělají metody, které vystavuje komponenta SimpleBarChart. V tabulce 9.4 jsou uvedené členy komponenty, které se v příkladu používají. Další výklad k této komponentě – včetně parametrů, které můžete nastavovat v panelu Properties nebo v inspektoru komponenty – najdete v dodatku A. Poznámka Připomínám, že tato komponenta není součástí dodávky Flashe. Napsal jsem ji pro potřeby knihy jako ukázku takového druhu komponent pro vizualizace dat, o kterých vy nebo váš tým zvažujete, že byste je mohli začít budovat úplně od začátku.

364

FLASH MX Professional 2004 pro vývojáře webových aplikací

Tabulka 9.4 Členy komponenty SimpleBarChart Člen

Popis

addField(name, label)

Metoda. Přidá do sloupkového grafu sloupec (bude reprezentován sloupkem grafu). name je libovolný řetězec nebo identifikační číslo jednoznačně určující sloupec; nebude v grafu vidět. label je popisek, který se objeví dole na grafu.

addSeries(data, title)

Metoda. Přidá do sloupkového grafu řadu datových bodů. Argument data je objekt (asociativní pole) obsahující vlastnosti pro každý sloupec dodaný pomocí addField(). Hodnota každé vlastnosti je číslo, které se má reprezentovat v grafu. Argument title je řetězec, který se má použít jako titulek grafu, když se zobrazuje daná řada dat.

clearAll()

Metoda. Odstraní všechny sloupce a řady dat z grafu, vlastně graf resetuje.

draw()

Metoda. Způsobí, že graf zobrazí první řadu dat v podobě sloupku grafu.

refreshInterval

Vlastnost. Počet milisekund, které mají uplynout mezi zobrazením dvou po sobě jdoucích řad dat. Hodnota 2000 znamená, že graf bude po zobrazení každé řady dat 2 vteřiny pauzovat. Jestliže je jen jediná řada dat, vlastnost nemá žádný účinek. Je-li vlastnost nastavená na 0, zobrazení se nebude automaticky posouvat z řady na řadu; můžete to ale zařídit pomocí metod next() a previous() (viz dodatek A).

Takže, máte-li na ploše nějakou komponentu SimpleBarChart s názvem instance bcChart, mohli byste zobrazit informace v grafu tímto stylem: bcChart.addField(“lp“, “Liz Phair“); bcChart.addField(“nw“, “Nate Weiss“); bcChart.addSeries({nw:34, lp:36}, “věk v roce 2003“); bcChart.addSeries({nw:35, lp:36}, “ věk v roce 2004“); bcChart.addSeries({nw:36, lp:36}, “ věk v roce 2005“); bcChart.draw();

Výsledkem by byl graf se dvěma sloupky. Graf by zobrazil tři porce dat, jednu za druhou.

Jeden sloupek by se v každém roce zvýšil o 1, druhý by zůstával stále stejně vysoký.

Poznámka Ještě jednou připomínám, že podrobnější informace k SimpleBarChart najdete v dodatku A. Potřebujete-li pro své grafy nějakou vyspělejší komponentu, prozkoumejte Flash Charting Components na stránkách Macromedia Flash Exchange na adrese www.macromedia.com.

Kód ActionScriptu Když máme na ploše všechny potřebné ovládací prvky, je na čase prohlédnout si kód ActionScriptu, který pohání příklad Rating Chart. Podobně jako příklad Song Rater z kapitoly 8, je většina kódu ActionScriptu i tohoto příkladu obsažena v jediném externím souboru ActionScriptu, jmenuje se RatingChartMainCode.as. Soubor je vložen do snímku 1 dokumentu RatingChart.fla řádkem: