How can I pass a new ID to the YouTube player (to autoplay a second video?)

Question

I'm trying to create a page that

1. Selects a random video (from an array of IDs - I have the IDs and can select them)
2. Plays that video
3. Plays another random video (grabbing another ID

The part that I'm stuck on is passing a different ID to an already-existing youtube player.

So when I have something like this:

<div id="player"></div>

<script src="http://www.youtube.com/player_api"></script>

<script>

// create youtube player
var player;
function onYouTubePlayerAPIReady() {
    player = new YT.Player('player', {
      height: '390',
      width: '640',
      videoId: 'zmr2I8caF0c',
      events: {
        'onReady': onPlayerReady,
        'onStateChange': onPlayerStateChange
      }
    });
}

// autoplay video
function onPlayerReady(event) {
    event.target.playVideo();
}

// when video ends
function onPlayerStateChange(event) {        
    if(event.data === 0) {            
        event.target.playVideo();
        //how do I pass a new ID here ^
    }
}

How would I pass a new ID to event.target.playVideo()? Can I create a function that takes an ID as a parameter and pass it somehow?

Answer 1

Figured it out.

<div id="player"></div>

<script src="http://www.youtube.com/player_api"></script>

<script>

    var videos = [
      '3H3odKtfrTo',
      'BxjMGiN0jJY',
      'iGC9n0NAvDU'
    ]


    var index=Math.floor(Math.random() * videos.length);

    // create youtube player
    var player;
    function onYouTubePlayerAPIReady() {
        player = new YT.Player('player', {
          height: '390',
          width: '640',
          videoId: '9yT7KcHCrRY',
          events: {
            'onReady': onPlayerReady,
            'onStateChange': onPlayerStateChange
          }
        });
    }

    // autoplay video
    function onPlayerReady(event) {
        event.target.playVideo();
    }

    function playNewVideo(id){
      player.loadVideoById(videos[index]);
      event.target.playVideo();
      playNewVideo(randomID)
    }

    // when video ends
    function onPlayerStateChange(event) {        
        if(event.data === 0) { 
          //generate new random number
          index=Math.floor(Math.random() * videos.length);
          playNewVideo();
        }
    }

</script>