SWFAddress: SWFObject と共にFlashの各コンテンツの遷移に対してパーマリンク提供する便利なライブラリ

SWFAddressとは、SWFObject と共に、Flash の各コンテンツの遷移に対してパーマリンク提供する便利なオープンソースのライブラリです。※SWFObjectについては、SWFObject: Flash/FlexをWeb ページに貼りつけるのに便利なJavaScriptライブラリを参考できます。

パーマリンクはFlashの問題の一つ、Flash内部のコンテンツにブックマークが出来ないということです(Flex３からHistoryManager/BrowserManagerというクラスを使えば機能を実現することができる)。SWFAddressを使用すれば、Javascriptを使ってページを更新することなくURLを変更することで SWF内にユニークなURLを設定できるというとても簡単でその問題を解決できます。

SWFAddressはActionScriptのライブラリと、HTMLページ用のJavaScriptファイルで構成されています。SWFAddressのActionScriptを利用して、シーン別にユニークなURLを指定するとブラウザのURLアンカー指定部分が変化されます。もちろん、利用するにはSWFObject.jsも必要になります。

・2.0での主な変更点は、以下の通りです。

複数のフラッシュとAjaxに対応。
ActionScriptとJavaScriptのイベントに対応。
新機能：SWFAddressEvent クラス。
新機能：SEOを少し。
Flash CS3のサポート。
Flash Player 7のサポート。
SWFObject 2.0のサポート。
新モード：デフォルトで末尾にスラッシュを追加。
新リンク方法：ウインドウとポップアップ。
新方式：ブラウザの履歴の扱い。
トラッカーファンクション。
クエリのパラメータでスクリプトの構成を設定。
swfaddress.html はオプションで、デフォルトで使用されない。
改善されたたくさんの新しいフラッシュベースのサンプル。
ActionScript ３と JavaScriptのためのAPIドキュメンテーション。

・対応ブラウザSWFAddressは以下のブラウザに対応しています。

Iinternet Explorer6+
Firefox 1+
Safari 1.3+
Opera 9.02+
Camino 1+
Mozilla 1.8+
Netscape 8+

・ライブラリの読み込みとオプション

SWFAddressはjavascriptのライブラリの読み込み時にオプションをsrc属性のurl中にクエリーとして渡します。オプションとして使用できる値は以下の４つがあります。

history (bool値) デフォルトはtrue
html (bool値) デフォルトはfalse
strict (bool値) デフォルトはtrue
tracker (文字列) デフォルトは_trackDefault

それは例の一つです。

<script href="swfaddress.js?history=1&html=1&strict=0&tracker=customTracker" type="text/javascript"></script>

使用例：

・ヘッダー部分 ライブラリの読み込みと、タグの書き出しサンプル

<script src="js/swfobject.js" type="text/javascript"></script>
<script src="js/swfaddress.js?strict=0" type="text/javascript"></script>
<script type="text/javascript">
var flashvars = {};
var params = {
menu: "true",
scale: "noScale",
allowScriptAccess: "sameDomain"
};
var attr = {
id: "altContent",
name:"altContent"
}
swfobject.embedSWF("SWFAddress.swf", "altContent", "100%", "100%", "9.0.0", "expressInstall.swf", flashvars, params, attr);
</script>

・Body部分

<ul>
<li><a href="" onclick="SWFAddress.setValue('ClickA'); this.blur(); return false;" rel="ClickA">ClcikA</a> </li>
<li><a href="" onclick="SWFAddress.setValue('ClickB'); this.blur(); return false;" rel="ClickB">ClcikB</a></li>
</ul>
<div id="altContent">
<h1>SWFAddress</h1> Alternative content <a href="http://www.adobe.com/go/getflashplayer"><img
src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a>
</div>

・as側の記述もjavascript側とほとんど同じように記述できる。

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="init(event)">
<mx:Script>
<![CDATA[
import mx.events.FlexEvent;
import com.asual.swfaddress.SWFAddress;
import com.asual.swfaddress.SWFAddressEvent;
import mx.controls.Alert;
import mx.events.ItemClickEvent; public function init(event:FlexEvent):void{ SWFAddress.addEventListener(SWFAddressEvent.CHANGE, swfAddressChangeEvent);
} public function swfAddressChangeEvent(event:SWFAddressEvent):void {
var path:String = event.path;
Alert.show(path, "path");
} public function itemClickHandler(event:ItemClickEvent):void {
var index:String = String(event.item);
SWFAddress.setValue(index);
}
]]>
</mx:Script>
<mx:ButtonBar itemClick="itemClickHandler(event);">
<mx:dataProvider>
<mx:String>Menu_1</mx:String>
<mx:String>Menu_2</mx:String>
<mx:String>Menu_3</mx:String>
</mx:dataProvider>
</mx:ButtonBar>
</mx:Application>