Category: JavaScript / Tags:
JavaScript と flash の連携 その2
flash player 8 以上から外部API経由で連動できるから
そちらを利用したほうがいいかも
外部APIを使用したFlashとJavaScriptの接続
http://sdc.shockwave.com/jp/devnet/flash/articles/external_interface.html
とりあえず、実験は今度してみます。
Category: JavaScript / Tags:
flash player 8 以上から外部API経由で連動できるから
そちらを利用したほうがいいかも
外部APIを使用したFlashとJavaScriptの接続
http://sdc.shockwave.com/jp/devnet/flash/articles/external_interface.html
とりあえず、実験は今度してみます。
Category: JavaScript / Tags:
flashとjavascriptの連携
(Flash / JavaScript Integration Kit の使い方)
FlashとHTMLをjavaScriptを介して連動します。
「JavaScript Integration Kit」
http://weblogs.macromedia.com/flashjavascript/
■ サンプルファイル━━━━━━━━━━━━━━━━━━━
http://www.itm.ne.jp/flash_test/flash_test.zip
http://www.itm.ne.jp/flash_test/index.html
に今回制作した一式(flaファイルなど)をおいています。
■ 参考━━━━━━━━━━━━━━━━━━━━━━━━
http://yoshiweb.net/blog/?itemid=106
■ 環境━━━━━━━━━━━━━━━━━━━━━━━━
今回、flash8 Pro(試供版)でつくってます。
動作は
windows
firefox 1.5.0.8
IE 6.0
Opera 9.0.2
で確認しています。
■ 動作内容━━━━━━━━━━━━━━━━━━━━━━
今回の実装
イメージタグにマウスオーバーされたときに、
flashの関数を呼び出し、指定のフレームから再生する。
■ 下準備━━━━━━━━━━━━━━━━━━━━━━━━
●1.「FlashJavascriptGateway」の取得
「JavaScript Integration Kit」
http://weblogs.macromedia.com/flashjavascript/
から、
「FlashJavascriptGateway.zip」を取得します。
「Download the latest release of the Flash / JavaScript Integration Kit.」
からダウンロード
zipの中身は
—————————————-ここから
docs
license.txt
readme.html
installation
JavaScriptFlashGateway.js
JavaScriptFlashGateway.swf
source
flash
actionscript
com
macromedia
javascript
JavaScriptProxy.as
JavaScriptSerializer.as
gateway
JavaScriptFlashGateway.as
JavaScriptFlashGateway.fla
JavaScriptFlashGateway.swf
javascript
Exception.js
FlashProxy.js
FlashSerializer.js
FlashTag.js
—————————————-ここまで
となっている。
●2. 作業フォルダの作成
—————————————-ここから
flash_test
JavaScriptFlashGateway.js(JavaScript Integration Kit)
JavascriptFlashGateway.swf(JavaScript Integration Kit)
javascript2flash.fla(新規作成)
javascript2flash.swf(javascript2flash.flaから生成)
index.html(新規作成)
images
logo.gif(新規作成)
com
macromedia
javascript
JavaScriptProxy.as(JavaScript Integration Kit)
JavaScriptSerializer.as(JavaScript Integration Kit)
—————————————-ここまで
の構成でおこないます。
JavaScriptFlashGateway.js
JavascriptFlashGateway.swf
は、
「FlashJavascriptGateway/installation」 フォルダ
comフォルダ以下は
「source/flash/actionscript」フォルダ
以下になります。
最終的な公開には、
—————————————-ここから
flash_test
JavaScriptFlashGateway.js
JavascriptFlashGateway.swf
javascript2flash.swf
index.html
images
logo.gif
だけになります。
—————————————-ここまで
●3.文字コードの修正
JavaScriptProxy.as
JavaScriptSerializer.as
がBOM付のUTF8でないと後々エラーがでるので先に変換しておきます。
–おまけ解説
「import com.macromedia.javascript.JavaScriptProxy;」で
「 ‘com.macromedia.javascript.JavaScriptProxy’ がロードされませんでした。」
のエラーが出てしまいます。
これを回避するために、unicode(BOM付)で保存してあげるとの事。
とりあえず、お手持ちのテキストエティターでUTF8に保存してあげてためしてください。
私は、「dana」でUTF8に保存しなおしてあげたら上手くいきました。
–
■ 実作業━━━━━━━━━━━━━━━━━━━━━━━━
●1. JavaScriptProxy.as JavaScriptSerializer.as の取り込みスクリプトを記載
「javascript2flash.fla」に
– ここから
import com.macromedia.javascript.JavaScriptProxy;
var proxy:JavaScriptProxy = new JavaScriptProxy(_root.lcId, this);
– ここまで
を記載
●2. HTML から実行する functon を作ります。
「javascript2flash.fla」に
– ここから
function viewImage(image) {
switch( image ){
case 1 :
gotoAndStop(40);
break ;
case 2 :
gotoAndStop(50);
break ;
case 3 :
gotoAndStop(60);
break;
}
}
– ここまで
のjavaScrpitからの制御を入れました。
●3.swfファイルの作成
javascript2flash.fla をパブリッシュして javascript2flash.swf
を作成
●4.index.html のJavascriptを編集
サンプルを
http://www.itm.ne.jp/flash_test/index.html
においています。そちらのソースで確認ください。
■ 注意点━━━━━━━━━━━━━━━━━━━━
今回、日本語を引数として通していません。日本語を通すと文字化けするとの
情報があるので、スクリプトの変更が必要みたいです。
■ JavaScript Integration Kitの実装━━━━━━━━━━━━━
JavaScriptFlashGateway.js
HTMLとFlashのつなぎのJavascriptです。
JavaScriptFlashGateway.swf
実装として、#include “JavaScriptFlashGateway.as”だけをしているファイル
データの流れは、
1.HTML->
2.javascript(イベント等) ->
3.JavaScriptFlashGateway.js ->
4.JavaScriptFlashGateway.swf ->
5.作ったflash(swf)
の順番になります。(とおもう。。)
■ 各種マニュアル━━━━━━━━━━━━━━━━━━━━
JavaScriptFlashGateway.js とかのメソットのマニュアルは
おいおい書きます。(気が向いたら)
Category: JavaScript / Tags:
Aのselectbox(セレクトボックス)を、切り替えたら、Bのselectbox(セレクトボックス)が
動的に切り替わるサンプル。
<SCRIPT LANGUAGE="JavaScript">
<!--
var datBox = new Array(
new Array(new Array("0101","AAA"),
new Array("0102","AAB"),
),
new Array(new Array("0201","BBA"),
new Array("0202","BBB"),
new Array("0203","BBC"),
),
new Array(new Array("0301","CCA"),
new Array("0302","CCB"),
new Array("0303","CCC"),
)
);
function listChange() {
document.getElementsByName('box_name2')[0].length = 1 ;
var y = document.getElementsByName('box_name1')[0].selectedIndex ;
for (var z = 0; z < datBox[y].length; z++){
document.getElementsByName('box_name2')[0].options[z] = new Option(datBox[y][z][1], datBox[y][z][0]);
}
}
//-->
</SCRIPT>
<select name="box_name1" onClick="listChange()";>
<option>default1</option>
<option>default2</option>
<option>default3</option>
</select>
<select name="box_name2">
<option>default1</option>
</select>
■おまけ、配列の部分を作成するPHPのサンプル
public function getClassJavaScriptArray($db){
$query = "SELECT id,name FROM table_name";
$result = pg_query($db, $query);
$i = 0 ;
$k = 0 ;
$old_id= null ;
echo "var datBox = new Array(\n new Array(";
while( @list( $id, $name ) = pg_fetch_array($result, $i) ){
if( $old_id == null ){
}elseif($id == $old_id){
echo ",\n " ;
}else{
echo "\n ),\n new Array(" ;
}
$id = ereg_replace("^0","",$id);//ID が桁揃えとかの場合のみ
echo "new Array(\"{$id}\",\"{$name}\")" ;
$id = $id ;
++$i ;
}
echo "\n )\n);\n";
}