Předání proměnné v HTML

12.1.2008· Autor: Ondřej Brichta· Počet komentářů: 3

Ať už jsou to bannery nebo jiné flashové aplikace, občas potřebujeme předat proměnnou SWF souboru přímo v HTML kódu webové stránky. Podívejme se na možné způsoby.

Předání proměnné SWF

Externí proměnné představují pohodlný způsob jak změnit chování aplikace aniž bychom museli znovu kompilovat celý SWF soubor. Pro menší objemy (můžeme použít až 64kB dat) externích proměnných je vložení přes HTML kód mnohem jednodušší, nemusíme se totiž starat o načítání externích souborů. Nejčastěji se s tímto způsobem použití předávání proměnných setkáváme u reklamních systémů, kdy je banneru z „vnějšku" předána URL adresa, na kterou má vést vnitřní odkaz. Časem se vžil název proměnné „clickthru", všem stejně tak můžeme použít u jiné názvy proměnných, pokud dodržíme základní pravidla sestavení názvů proměnných (bez diakritiky, bez číslic na začátku, bez mezer apod.).

Vložení proměnných do HTML

V současné době existují dva základní způsoby vložení flashe do HTML stránky. SWF soubor umisťujeme pomocí tagů <OBJECT > a <EMBED>, přičemž máme možnost napsat tagy přímo (pak bude nutné při vstupu na HTML stránku v IE aktivovat flashový objekt) a nebo použít druhou metodu, která zmíněné tagy vypíše pomocí příkazů JavaScriptu.

Pokud vkládáme SWF objekt prvním způsobem a chceme flashové aplikaci předat proměnnou s názvem „web_param" a hodnotou „123", použijeme následující zápis:

 <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="800" height="600" id="web_params2" align="middle">
 <param name="allowScriptAccess" value="sameDomain" />
 <param name="allowFullScreen" value="false" />
 <param name="movie" value="animace.swf?web_param=123" /><param name="quality" value="high" /><param name="bgcolor" value="#ffffff" /> <embed src="animace.swf?web_param=123" quality="high" bgcolor="#ffffff" width="800" height="600" name="web_params2" align="middle" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
 </object>

Proměnnou tedy vložíme za název SWF souboru s pomocí znaku „?". Pokud by následovala druhá proměnná, oddělíme je pomocí znaku „&":

animace.swf?web_param=123&next_param=456

Nesmíme zapomenout, že proměnná musí být uvedená u obou cest k SWF souborů, tedy i v EMBED tagu, jinak to nebude fungovat u všech verzí prohlížečů.

Pokud používáme vypsání SWf objektu pomocí příkazů JavaScriptu (například skript přímo z Flashe), máme dvě možnosti:

<script language="javascript">
 if (AC_FL_RunContent == 0) {
 alert("This page requires AC_RunActiveContent.js.");
 } else {
 AC_FL_RunContent(
 'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0',
 'width', '800',
 'height', '600',
 'src', ' animace ',
 'quality', 'high',
 'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
 'align', 'middle',
 'play', 'true',
 'loop', 'true',
 'scale', 'showall',
 'wmode', 'window',
 'flashvars', 'web_param=123',
 'devicefont', 'false',
 'id', 'web_params2',
 'bgcolor', '#ffffff',
 'name', 'web_params2',
 'menu', 'true',
 'allowFullScreen', 'false',
 'allowScriptAccess','sameDomain',
 'movie', ' animace',
 'salign', ''
 ); //end AC code
 }
</script>

První možností je doplnění parametru s názvem „flashvars" doplněným o příslušnou proměnnou:

'flashvars', 'web_param=123',

A nebo použijeme zápis do parametrů „src" a „movie":

<script language="javascript">
 if (AC_FL_RunContent == 0) {
 alert("This page requires AC_RunActiveContent.js.");
 } else {
 AC_FL_RunContent(
 'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0',
 'width', '800',
 'height', '600',
 'src', ' animace?web_param=123',
 'quality', 'high',
 'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
 'align', 'middle',
 'play', 'true',
 'loop', 'true',
 'scale', 'showall',
 'wmode', 'window',
 'devicefont', 'false',
 'id', 'web_params2',
 'bgcolor', '#ffffff',
 'name', 'web_params2',
 'menu', 'true',
 'allowFullScreen', 'false',
 'allowScriptAccess','sameDomain',
 'movie', ' animace?web_param=123',
 'salign', ''
 ); //end AC code
 }
</script>

 

swfobject

Populární alternativou pro vkládání SWF objektu do HTML za pomoci JavaScriptu je projekt swfobject (http://code.google.com/p/swfobject/). V tomto případě je vložení proměnné velice elegantní, použije se příkaz addVariable jehož prvním parametrem je název proměnné, druhým pak hodnota proměnné:

<script type="text/javascript">
 var so = new SWFObject("animace.swf", "animace", "800", "600", "9", "#ffffff");
 so.addVariable("web_param", "123");
 so.write("flashcontent");
</script>

 

Proměnné na straně ActionScriptu

Pokud jsme v HTML kódu vložili proměnnou k flashovém objektu, musíme ji nyní ve flashové animaci nějak zpracovat. Pokud máme animaci pro ActionScript 2.0, není se o co starat, proměnná je dostupná na rootu pod stejným názvem jako v HTML kódu. Pokud máme na hlavní časové ose dynamické textové pole, můžeme do něj vložit proměnnou přes:

instance_pole.text = web_param;

ActionScript 3.0

O něco složitější je situace s ActionScriptem 3.0. Ve Flashi CS3 musíme k proměnné v HTML stránce přistoupit takto:

var my_web_param:String = LoaderInfo(this.root.loaderInfo).parameters.web_param;
instance_pole.text = my_web_param;

Pokud máme aplikaci ve FlexBuilderu, pak k proměnné v HTML stránce přistoupíme následujícím způsobem:

var my_web_param:String = Application.application.parameters.web_param;

Ondřej Brichta Vývojář multimediálních aplikací, šéfredaktor Flash.cz, školitel produktů Flash, Flex, Flash Media Server

Web: http://www.obria.cz |

Motto: <°))))><

Seriál: Tipy a triky

Tipy a triky je seriál zaměřený na zajímavá řešení a vylepšení flashových aplikací

Komentáře k článku  
swfobject Petko | 12.1.2008 16:59
doplněno OBr | 13.1.2008 20:17
SO karci | 1.12.2008 8:48

Přihlášení uživatele