Get all the video ID's from a YouTube playlist into a PHP array using YouTube API

Question

I'm adding a custom player to my website and I have two issues.

1. My playlist on YouTube has 391 songs and the API player only loads 200.
2. I have problems shuffling the list using the API commands.

Here's the code that I'm using to call to the player:

<div class="videoplayer" id="ytplayer"></div>
<script>
    var getRandom = function(min, max) {
      return Math.random() * (max - min) + min;
    };

  // Load the IFrame Player API code asynchronously.
  var tag = document.createElement('script');
  tag.src = "https://www.youtube.com/player_api";
  var firstScriptTag = document.getElementsByTagName('script')[0];
  firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

  // Replace the 'ytplayer' element with an <iframe> and
  // YouTube player after the API code downloads.
  var player;
  function onYouTubePlayerAPIReady() {
    player = new YT.Player('ytplayer', {
      height: '50',
      width: '400',
      events: {
         'onReady': onPlayerReady
       },
      playerVars:{        
        list:'PLH30k6CwlcgK8C-LET6_ZrAWwYGLqT8R-',
        index:parseInt(0),
        suggestedQuality:'small',
        controls:0,
        autoplay:1
        }
    });
  }

  function onPlayerReady(event) {
     event.target.setShuffle();
     event.target.setLoop();     
   }
</script>

I tried to workaround the shuffle thing using:

function onPlayerReady(event) {
         var num = parseInt(getRandom(1,391));
         event.target.playVideoAt(num);   
       }

But it doesn't work like I want, so I want retrieve the ID's of all the videos in the playlist into an array, mix them and pass all the array to load each video. I was trying to use some examples from previous questions but those examples are not working anymore, if some of you guys has examples with the v3 of the YouTube API or actually working examples I will appreciate it.

Regards.

Answer 1

First, you have to use iframe API because, javascript API is outdated and deprecated

Look for youtube API documentation (list of deprecated api's on left side menu) https://developers.google.com/youtube/iframe_api_reference?hl=fr

replacing

tag.src = "https://www.youtube.com/player_api";
// by 
tag.src = "https://www.youtube.com/iframe_api";

and

function onYouTubePlayerAPIReady()
// by 
function onYouTubeIframeAPIReady()

0 To fix shuffling, try to randomize at each end state

by using onPlayerStateChange event listener, and YT.PlayerState.ENDED state.

1 You need to CUE the playlist to get whole video's ids

before the randomization. and get them with proper method : getPlaylist()

var player;
var videoList, videoCount;
function onYouTubeIframeAPIReady()
{
    player = new YT.Player('ytplayer',
    {
        height: '50',
        width: '400',
        events:
        {
            'onReady': onPlayerReady,
            'onStateChange': onPlayerStateChange
        },

        playerVars:
        {
            controls:0,
            autoplay:0
        }
    });
}

function onPlayerReady(event)
{
    // cue the playlist, to get the video's ids 
    event.target.cuePlaylist
    ({
        listType: 'playlist',
        list: 'PLH30k6CwlcgK8C-LET6_ZrAWwYGLqT8R-',
        suggestedQuality:'small',
        autoplay: 1,
        index:0,
    });

    event.target.setLoop();
}

function onPlayerStateChange(event)
{
    if(event.data == YT.PlayerState.CUED)
    {
        videoList = event.target.getPlaylist();

        // to prevent adding new video and for the randomize
        videoCount = videoList.length; 

        // get the ids before randomize playlist, send it
        sendIds(videoList);

        // starting the player (like autoplay)
        event.target.playVideo();
    }

    // randomize at each video ending
    if(event.data == YT.PlayerState.ENDED)
    {
        var num = getRandom(1,videoCount);
        event.target.playVideoAt(num);
    }
}

function sendIds(ids)
{
    console.log(ids);
    // make what you want to do with them... ajax call to your php
}