Flash コンテンツ～ sample03 (MP3プレイヤー) 追加

先週に続いて、 S.S.Planning さんの次の無償サンプルを Apache に置いてみました。

今回のサンプルはこれ↓です。
Flashのフリーサンプル素材　外部MP3ファイルを読み込むMP3プレイヤーのサンプル

MP3 を演奏中のスクリーンショットがこちら↓です。

このサンプルで手ごわかった問題は、ファイル名の大文字・小文字でした
サンプルのアーカイブ(sample03.zip)を展開したら、下記のように拡張子の ".MP3" を ".mp3" に変更する必要がありました。

$ mv mp3/sound_01.MP3 mp3/sound_01.mp3
$ mv mp3/sound_02.MP3 mp3/sound_02.mp3

これができれば、あとは先週のサンプル(sample02.zip)と同じ仕組みでフラッシュを再生できます。

先週、設定した flash0/ の下にサンプルを追加しました。

    /var/www/html/flash0
    ├── index.html
    ├── js
    │   └── swfobject.js
    ├── mp3
    │   ├── list.txt
    │   ├── sound_01.mp3
    │   └── sound_02.mp3
    ├── mp3player.swf
    ├── s2.swf
    ├── s2img
    │   ├── 01.jpg
    │   ├── 02.jpg
    │   ├── s2.txt
    │   └── s2.xml
    ├── sample02.html
    └── sample03.html

先週の index.html を sample02.html にリネームしてます。
今回、追加のサンプルは sample03.html にしました。
index.html は、この２つの html へのリンクを並べたページにしてます。

mp3player.swf がフラッシュで、mp3ディレクトリにある音楽ファイルを再生します。

以下は index.html と sample03.html です。

index.html

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>ssplanning SWFObject Flash free sample</title>
</head>
<body bgcolor="#77ffcc"><div align="center">
<div id="free_samples_list"><br>
<a target="_blank" href="sample02.html">Flash Photo Gallery</a><br><br>
<a target="_blank" href="sample03.html">Flash MP3 Player</a><br><br>
<br>
</div>
</body>
</html>

sample03.html

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>mp3player-SWFObject</title>
<script type="text/javascript" src="js/swfobject.js"></script>
<script type="text/javascript">
swfobject.embedSWF("mp3player.swf", "mp3", "185", "355", "9.0.0", "#F8F5F7");
</script>
</head>
<body bgcolor="#333333"><div align="center">
<div id="mp3"> </div>
</body>
</html>

先週の index.html (現在 sample02.html) では <body> にフラッシュ再生に失敗した場合の代替表示を入れていましたが、今回で削除しました。swf ファイルを消すなどの障害を入れてみても、代替表示が動かないことに気がついて、なんとかできないものかと試行錯誤したものの諦めました。残念

です。とりあえず必要ないので、動かないなら残していても気持ち悪いので削除しました

話を戻して、ファイル名の大文字・小文字を区別しないのは Windows 環境でしょうね

やまものブログ

メモ書きブログです (^_^;A

Flash コンテンツ～ sample03 (MP3プレイヤー) 追加