How does this YouTube latest video code work? - youtube-api

Question

I used some code to find the latest video from a specific channel, I have a basic idea of how it works, but I’m not sure how it sources the video. If someone could explain that'd be great
<!--Latest video-->
<h1 class="title"> Latest video </h1>
<div id="static_video"></div>
<!--Source the latest vdeo-->
<script type="text/javascript">
function showVideo(response) {
if(response.data && response.data.items) {
var items = response.data.items;
if(items.length>0) {
var item = items[0];
var videoid = "http://www.youtube.com/embed/"+item.id;
console.log("Latest ID: '"+videoid+"'");
var video = "<iframe width='720' height='480' src='"+videoid+"' frameborder='0' allowfullscreen></iframe>";
$('#static_video').html(video);
}
}
}
</script>
<script type="text/javascript" src="https://gdata.youtube.com/feeds/api/users/UC9DiuD3z0btMOAMG_FvDRag/uploads?max-results=1&orderby=published&v=2&alt=jsonc&callback=showVideo"></script>
It can be seen here
Another help would be, how can I show all the videos, with a search box to, well search through them. Sorry if I seem greedy but it would be a MASSIVE help if some one could explain.
EDIT: Bump, I don't like bumping, but I need this answered, please help me!

Answer 1

First the API V2 is deprecated, you need to use the YouTube API v3 with the ressource search.list
You need an API Key, follow this link to get one.
Use this parameters to get the lastest upload of the channel :
part: 'snippet' or 'id'
channelId: 'UC9DiuD3z0btMOAMG_FvDRag'
maxResults: 1
order: date
https://www.googleapis.com/youtube/v3/search?part=id&channelId=UC9DiuD3z0btMOAMG_FvDRag&maxResults=1&order=date&key={YOUR_API_KEY}
The output :
"items": [
{
"kind": "youtube#searchResult",
"etag": "\"PSjn-HSKiX6orvNhGZvglLI2lvk/9r2l5FZB6-ysy9_0d37qYA5Kg8I\"",
"id": {
"kind": "youtube#video",
"videoId": "WH8U2NQ_fnA"
}
}
Then you have the last video ID of the channel.
After that, you need to use the YouTube API player.
A live example to show you how the player works : http://jsbin.com/vajobawiba/1/edit?html,js,output
You just need to copy that code with the video ID you get from the previous step !
Example :
Add this line at the end of the body in your index.html
<script src="https://apis.google.com/js/client.js?onload=googleApiClientReady"></script>
And there is the javascript example:
function googleApiClientReady() {
var apiKey = 'YOUR_API_KEY',
youtubeId,
request;
gapi.client.setApiKey(apiKey);
gapi.client.load('youtube', 'v3', function() {
request = gapi.client.youtube.search.list({
part: 'id',
channelId: 'UC9DiuD3z0btMOAMG_FvDRag',
maxResults: 1,
order: date
});
request.execute(function(response) {
if(response.pageInfo.totalResults != 0) {
youtubeId = response.result.items[0].id.videoId;
}
});
});
}