HTML5でオーディオプレーヤー作成 その3

HTML5によるオーディオプレーヤーですが、とりあえずの完成をみました。
Chrome限定ですが、オプションをつけることで、試験用に作成している
ホームページからでも再生できるようになりました。

単純にplay()だけで十分かと思いましたが、そうもいかず・・・という感じですね。
play()あるいはload()関数を呼び出したあと、ロード完了で再生準備完了の状態にまでいかないと、
再生できないようです。取得できるイベントは以下の通りです。

emptied
loadstart
progress
loadedmetadata
loadeddata
canplay
canplaythrough
suspend
waiting
stalled
ended
play
playing
timeupdate
pause
seeking
seeked
ratechange
durationchange
volumechange
error
abort

再生準備完了状態になるまでに経過するイベントはWEEBブラウザによって異なりますが、
概ね以下のイベントを順番に経過するようです。

1　loadstart
2 loadedmetadata
3 loadeddata
4 canplay
5 canplaythrough

一番最後にあるcanplaythroughのイベントにならないと、
再生や音声データの時間などを取得できないようです。
play()としても、canplaythroughにならないと再生できずに停止します。

以下のようにして取得しました。ここでは、再生可能となった時点で、再生時間を取得しています。

var oAudioObjInfo = new Audio(ファイル名);
var strEvents = new Array("loadstart", "play", "pause", "waiting", 
                          "stalled", "canplaythrough", "seeking", "ended" );

for( var i = 0;i < strEvents.length; i++ )
{
  oAudioObjInfo.addEventListener( strEvents[i], function(evt)
  {
    if( evt.type == "canplaythrough" )
    {
      astrTimeList[astrTimeList.length-1] = Math.floor(oAudioObjInfo.duration);
      oAudioObjInfo.pause();
      oAudioObjInfo = null;
      return ;
    }
  }, false );
}

再生はこんな感じです。制作したオーディオプレーヤーから抜粋しています。

function registerAudioEvent()
{
   var strEvents = new Array("loadstart", "play", "pause", "waiting", 
                             "stalled", "canplaythrough", "seeking", "ended" );

for( var i = 0;i < strEvents.length; i++ )
{
  oAudioObj.addEventListener( strEvents[i], function(evt)
  {
    if( evt.type == "canplaythrough" )
    {
       play();
    }
  }, false );
}

function play()
{
   //停止の場合
   if( oAudioObj == null )
   {
      oAudioObj = new Audio( ファイル名 );
       registerAudioEvent();
   }
   // 停止か一時停止
   if( iAudioStatusFlag == 0 || iAudioStatusFlag == 1 )
   {
      oAudioObj.play();
      iAudioStatusFlag = 2;
   }
}

次は音量操作でも。