この Wiki は、まだ、書き掛けのページです。
MP3FLVPlayer は、MP3 Player および FLV Player、さらにそれらを操作するためのいくつかのJavaScriptから構成されるライブラリです。
Flash を操作するためには、SWFObject 1.5 という有名な Flash 用の JavaScript ライブラリがあります。
ただし、非常に高機能であり、単純なことを行う場合でも、それなりの記述をしなければなりません。JavaScript を理解してるのであれば、この SWFObject を利用した方が良いのでしょうが、 そうでなければ、敷居が若干高くなることも否めません。
そこで、SWFObject の代替となるスクリプトと専用のMP3プレイヤーおよびFLVプレイヤーに特化したライブラリを作成しました。
なお、本ライブラリで使用するプレイヤーは、Adobe Flex3 で作成したものです。
MP3FLVPlayer の中核は、Flash用swfファイルと JavaScript のライブラリです。つまり、JavaScript が動作し、Flashプレイヤーがインストールされているブラウザであれば、何でも良いのですが、実際には、制限を加えています。
すなわち、ブラウザチェックの部分で以下のブラウザを推奨し、それ以外は非推奨としています。
また、Adobe Flash Player のバージョンは、9 以上でないと動作しません。
* browser.js (JavaScript ライブラリ) * player.js (JavaScript ライブラリ) * FLVPlayer.swf (FLV プレイヤー : swf形式) * MP3Player_L.swf (MP3 プレイヤー : swf形式) * sample.html (サンプル HTMLファイル) * sample2.html (サンプル HTMLファイル) * sample.flv (サンプル FLV ファイル) * MySong.mp3 (サンプル MP3 ファイル)
以上で、インストールは終了です。実際に必要となるファイルは、2つの JavaScript ライブラリと 2つのswf形式プレイヤーだけです。それ以外はサンプルなどになります。
もっとも単純な使用方法の例は、以下の simple.html です。
- <?xml version="1.0" encoding="UTF-8"?>
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
- "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
- <meta http-equiv="Content-Script-Type" content="text/javascript" />
- <title>Flex 3</title>
- <script type="text/javascript" src="browser.js"></script>
- <script type="text/javascript" src="player.js"></script>
- </head>
- <body>
- <p>
- <script type="text/javascript"><!--
- Flash.FLVPlayer("./", "sample.flv");
- Flash.MP3Player("./", "MySong.mp3");
- //-->
- </script>
- </p>
- </body>
- </html>
この例では、simple.html、browser.js、player.js、FLVPlayer.swf、MP3Player_L.swf、sample.flv、MySong.mp3 をすべて同じディレクトリに配置しています。
まず、JavaScript ライブラリ browser.js と player.js を組み込みます。このとき組込み順序がありますので、つぎの記述通りに組み込みを行います。
実際のプレイヤーを呼び出している部分は、つぎの記述になります。
FLV プレイヤーは、Flash.FLVPlayer メソッドを、MP3 プレイヤーは、Flash.MP3Player メソッドをそれぞれ呼び出します。各メソッドの書式は、つぎのようになります。
また、もっとも単純な使用方法で表示されるプレイヤーは、それぞれ以下の大きさ（ピクセル）で固定されています。
プレイヤーの大きさを指定する場合には、プレイヤー呼び出し部分をつぎのように記述します。
つまり、各プレイヤー（FLVPlayer、MP3Player）呼び出しの一般的書式は、つぎのとおりです。
通常、高さには、60 または 80 を指定するようにして下さい。 65 とか 70 などを指定してもあまり意味がありません。
ここでは、推奨・非推奨ブラウザのチェックを組込む方法について説明します。
ブラウザのチェックを行い、非推奨ブラウザの場合、メッセージ表示を行うことができます。なお、メッセージ表示の方法には、つぎの2種類の方法があります。
非推奨ブラウザのメッセージを警告ダイアログで表示する場合は、Browser.checkBrowser メソッドの引数に数値"2"を指定して呼び出します。
実際には、JavaScript 組込み部分移行の head 要素内に記述するようにします。
非推奨ブラウザの場合には、警告ダイアログ内に以下のようなメッセージを表示します。なお、このメッセージは、browser.js を修正すれば、簡単に変更することができます。
お使いのブラウザ環境は検証されていません。正常に表示できない可能性があります。
非推奨ブラウザのメッセージを段落（p要素）で表示する場合は、Browser.checkBrowser メソッドの引数に数値"1"を指定して呼び出します。
実際には、body 要素内の適当な場所に以下のように記述します。
非推奨ブラウザの場合には、以下のようなp要素を生成してメッセージを表示します。なお、このメッセージは、browser.js を修正すれば、簡単に変更することができます。
また、この p要素に特定の id属性を指定したい場合には、Browser.checkBrowser メソッドの第2引数に id属性の値を指定します。
id属性を指定した場合には、以下のような p要素を生成します。このメッセージに特定のスタイルを適用したい場合には、この id属性の指定を利用します。
ここでは、Flash プラグインのチェックを組込む方法について説明します。
バージョン 9 以上のFlash プラグインが組込まれているかどおうかのチェックを行い、組込まれていない場合は、メッセージ表示を行うことができます。なお、メッセージ表示には、つぎの2種類の方法があります。
バージョン 9 以上のFlash プラグインが組込まれていない場合、メッセージを警告ダイアログで表示する場合は、Browser.isFlashPlugin メソッドの引数に数値"2"を指定して呼び出します。
実際には、JavaScript 組込み部分移行の head 要素内に記述するようにします。
バージョン 9 以上のFlash プラグインが組込まれていない場合には、警告ダイアログ内に以下のようなメッセージを表示します。なお、このメッセージは、browser.js を修正すれば、簡単に変更することができます。
Flash ver.9 or later プラグインがインストールされていません。
バージョン 9 以上のFlash プラグインが組込まれていないメッセージを段落（p要素）で表示する場合は、Browser.isFlashPlugin メソッドの引数に数値"1"を指定して呼び出します。
実際には、body 要素内の適当な場所に以下のように記述します。
バージョン 9 以上のFlash プラグインが組込まれていない場合には、以下のようなp要素を生成してメッセージを表示します。なお、このメッセージは、browser.js を修正すれば、簡単に変更することができます。
また、この p要素に特定の id属性を指定したい場合には、Browser.isFlashPlugin メソッドの第2引数に id属性の値を指定します。
id属性を指定した場合には、以下のような p要素を生成します。このメッセージに特定のスタイルを適用したい場合には、この id属性の指定を利用します。
FLVPlayer、MP3Player ともに以下の項目を制御することができます。
オートスタートを制御するためには、Flash.setAutoStart メソッドを使用します。引数に true を指定した場合、プレイヤーを読み込むと自動的に再生が始まります。また、false を指定した場合は、自動再生を行いません。初期状態は、false です。
プレイヤー起動時の音量を制御するためには、Flash.setVolume メソッドを使用します。引数に 0 から 100 までの音量（比率）を指定します。初期状態は、80 に設定されています。
再生が終了した後、また最初から再生を繰り返すループ再生を制御するためには、Flash.setLoop メソッドを使用します。引数に true を指定した場合はループ再生されます。また、false を指定した場合には、ループ再生は行われず、再生が終了すると先頭に巻き戻されます。初期状態は、false です。
たとえば、「自動再生する、音量の初期設定 50、ループ再生する」の場合、つぎのように記述します。なお、それぞれのメソッドは、プレイヤーの呼び出し以前に記述してあれば、順不同です。
このようにすべての制御項目を指定する場合には、一括指定できる Flash.setOperation メソッドを利用することもできます。
Flash.setOperation メソッドの引数は、つぎの書式になります。
プレイヤー全体やボタンの色などの外観を設定することができます。
プレイヤーの色（これをプレイヤーの背景色といいます）を設定する場合は、Flash.setBgColor メソッドを使用します。引数には、色コードを "0xRRGGBB" 形式で設定します（引数値を引用符で囲むことに注意して下さい）。
また、プレイヤー上のタイムコード文字列や再生ボタン、停止ボタンの記号の色（これをプレイヤーの前景色といいます）を設定する場合には、Flash.setColor メソッドを使用します。引数には、色コードを "0xRRGGBB" 形式で設定します（引数値を引用符で囲むことに注意して下さい）。以下の例では、背景色を薄い緑（0xccffcc）、前景色を青（0x0000ff）に設定しています。
また、背景色と前景色を一括で指定することもできます。その場合には、Flash.setPlayerColor メソッドを使用します。このメソッドの書式は、つぎのとおりです。
先の例を、Flash.setPlayerColor メソッドで書き換えるとつぎのようになります。
操作系の色設定として、再生、停止ボタンにポインタをロールオーバーしたときの色、再生ファイルローディング状況を表示するロードバー、再生状況を表示するプレイバーの各色を設定することができます。
操作系の色設定として、ロールオーバーしたときの色設定には、Flash.setRollOverColor メソッド、ロードバーの色設定には、Flash.setLoadBarColor メソッド、プレイバーの色設定には、Flash.setPlayBarColor メソッドをそれぞれ使用します。各メソッドの引数には、色コードを "0xRRGGBB" 形式で設定します（引数値を引用符で囲むことに注意して下さい）。
以下の例では、ロールオーバー色に濃い赤（"0xcc0000"）、ロードバー色に赤（"0xff0000"）、プレイバーに緑（"0x00ff00"）を設定しています。なお、実際の色は透過表示されるので、指定した色よりは薄く表示されます。
edit