プレイリストを再生する（YouTubeの音楽プレーヤーサイトを作ろう！その５）

プレイリストの再生

今回はプレイリストを順に再生することを目指します（YouTubeで作成したプレイリストではない）

プレイリストを順に再生するには、YouTube Player API のプレーヤーの状態が変更された場合に発動するイベントを使用します。ソースはこんなかんじ。変更箇所以外は前回と同じ。

var count = 0;// 現在のプレイリスト順
//プレイリスト
var playlist_id = new Array("51CH3dPaWXc","Eze6-eHmtJg","YapsFDcGe_s","h-kQw4JqCHE","94uxNQqmknk");

function onYouTubeIframeAPIReady() {
   ytPlayer = new YT.Player(
      'Player', // 埋め込む場所のidタグ
      {
         width: 640, // プレーヤーの幅
         height: 390, // プレーヤーの高さ
         videoId: '51CH3dPaWXc' ,// YouTubeの動画ID
         // イベントを追加
         events: {
            // プレーヤーの状態が変更されたときに実行
            'onStateChange': onPlayerStateChange 
         }
      }
   );
}

// プレーヤーの状態が変更された場合に発動
function onPlayerStateChange(event) {
   // 現在のプレーヤーの状態を取得
   var ytStatus = event.data;
   // 再生終了
   if (ytStatus == YT.PlayerState.ENDED) {
      // 再生終了時に次の動画を再生させる
      count++;
      if(count==playlist_id.length){
         count = 0;
      }
      ytPlayer.loadVideoById(playlist_id[count]); 
   }
   // 再生中
   if (ytStatus == YT.PlayerState.PLAYING) {
      // 処理
   }
   // 停止中
   if (ytStatus == YT.PlayerState.PAUSED) {
      // 処理
   }
   // バッファリング中
   if (ytStatus == YT.PlayerState.BUFFERING) {
      // 処理
   }
   // 頭出し済み
   if (ytStatus == YT.PlayerState.CUED) {
      // 処理
   }
}

このイベントで再生終了時に次の動画を再生させることで、プレイリストを順に再生できます。今回のプレイリストはあらかじめ配列に格納しておきます。