JQuery: Merge multiple JSON results

Question

Situation: User want to import Youtube playlist in a JQuery site using Youtube\'s JSON API.

Problem: Youtube only gives back first

Answer 1

I cannot post any comments yet because of my reputation. But shouldn't you make the increment of + 50 variable, using count(responseData.data.items), to cover for changes in the YouTube API?

I know the JSON request is called with max-results=50, but they could start limiting this to a lower number of items.

Answer 2

Since you just want the items which is an array, you can use $.merge() in a repeating function:

function fetchPlaylist(pid, start, items) {
  items = items || [];
  start = start || 0;
  var the_url = 'http://gdata.youtube.com/feeds/api/playlists/' + encodeURIComponent(pid) + '?v=2&alt=jsonc&max-results=50';
  $.ajax({
      type: "GET",
      url: the_url,
      data: { start: start },
      dataType: "jsonp",
      success: function(responseData, textStatus, XMLHttpRequest) {
        if (responseData.data != null) {
          if (responseData.data.items) {
            $.merge(items, responseData.data.items); //add to items
            if (responseData.data.totalItems > start + 50) {
                fetchPlaylist(pid, start + 50, items);
            } else {
                outputFunction(items);
            }
          } else {
            console.log('No results for playlist: "' + pid + '"');
          }
        }
      }
  });
}

You can give it a try here, you just call it with the playlist id, like this:

fetchPlaylist("84780DAC99E1A285");​

Each time the request completes we see if the totalItems that youtube returns is higher than what we requested plus 50, if that's the case, fetch again, add those results...if not then we're done and pass the combined array to the outputFunction().

Answer 3

1. You should be able to use the start-index parameter to call the next set of results from google. You could probably call your fetchPlaylist() method recursively while changing the start-index for each call until you've gotten all of them.

2. use .extend() to merge the results