Menu
<script type= "text/javascript">
var url = "http://gdata.youtube.com/feeds/api/videos/VA770wpLX-Q?v=2&alt=json-in-script&callback=";
var title;
var description;
var viewcount;
var views;
var author;
$.getJSON(url,
function(data){
title = data.entry.title.$t;
description = data.entry.media$group.media$description.$t;
viewcount = data.entry.yt$statistics.viewCount;
views = numberFormat (viewcount);
author = data.entry.author[0].name.$t;
listInfo (title,description,author,views);
});
</script>
So thats my code to get information from a single video, after the info is received it calls this function to display it:
<script type="text/javascript">
function listInfo (title,description,author,views) {
var html = ['<dl>'];
html.push('<dt>','<span class="titleStyle">', title,'</span><span class="descriptionStyle">',description, '</span><span class="authorStyle">',author,'</span><span class="viewsStyle">',' Views:',views,'</span></dt>');
html.push('</dl>');
document.getElementById("agenda").innerHTML = html.join("");
}
function numberFormat(nStr,prefix){
var prefix = prefix || '';
nStr += '';
x = nStr.split('.');
x1 = x[0];
x2 = x.length > 1 ? '.' + x[1] : '';
var rgx = /(\d+)(\d{3})/;
while (rgx.test(x1))
x1 = x1.replace(rgx, '$1' + ',' + '$2');
return prefix + x1 + x2;
}
</script>
After that it puts the definition List into a div, which I have inside a table
<table width="485"><tr><td><div id="agenda"></div></td></tr></table>
all of this information is found in the body, I can't seem to get it to work, I've been trying for a week now, and I can't find any way to make it work
999
Since the youtube API does not allow more than 50 comments to be returned on a single request, you'll need to add a URL parameter called "start-index", which tells youtube that you want to get comments from there onwards. Below is an example. I've made it so that as long as the response JSON returns 50 comments, it calls the function again for the next 50 comments.
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.1.min.js"></script>
<script type= "text/javascript">
function getYouTubeInfo() {
$.ajax({
url: "http://gdata.youtube.com/feeds/api/videos/<?php echo $_GET['v']; ?>?v=2&alt=json",
dataType: "jsonp",
success: function (data) { parseresults(data); }
});
}
function parseresults(data) {
var title = data.entry.title.$t;
var description = data.entry.media$group.media$description.$t;
var viewcount = data.entry.yt$statistics.viewCount;
var author = data.entry.author[0].name.$t;
$('#title').html(title);
$('#description').html('<b>Description</b>: ' + description);
$('#extrainfo').html('<b>Author</b>: ' + author + '<br/><b>Views</b>: ' + viewcount);
getComments(data.entry.gd$comments.gd$feedLink.href + '&max-results=50&alt=json', 1);
}
function getComments(commentsURL, startIndex) {
$.ajax({
url: commentsURL + '&start-index=' + startIndex,
dataType: "jsonp",
success: function (data) {
$.each(data.feed.entry, function(key, val) {
$('#comments').append('<br/>Author: ' + val.author[0].name.$t + ', Comment: ' + val.content.$t);
});
if ($(data.feed.entry).size() == 50) { getComments(commentsURL, startIndex + 50); }
}
});
}
$(document).ready(function () {
getYouTubeInfo();
});
</script>
<title>YouTube</title>
</head>
<body bgcolor="grey">
<div align="center">
<br/><br/>
<div id="title" style="color: #dddddd">Could not find a title</div><br/>
<iframe title="Youtube Video Player" width="640" height="390" src="http://www.youtube.com/embed/<?php echo $_GET['v']; ?>?fs=1&autoplay=1&loop=0" frameborder="0" allowfullscreen style="border: 1px solid black"></iframe>
<br/><br/>
<div id="description" style="width:400px; background-color: #dddddd; font-size:10px; text-align:left;">Could not find a description</div>
<div id="extrainfo" style="width:400px; background-color: #dddddd; font-size:10px; text-align:left;">Could not find extra information</div>
<div id="comments" style="width:400px; background-color: #dddddd; font-size:10px; text-align:left;">Could not find comments</div>
</div>
</body>
</html>
If you have any more questions or you get stuck with this code, don't hesitate to ask again :-)
Good luck, Tom
164
You should try the jTube jquery youtube library. It makes it pretty easy to do basic calls like this. Download / view code at: https://github.com/monkeecreate/jTube/blob/master/jTube/jquery.jTube.js
Use like:
$.jTube({
request: 'user',
requestValue: 'defvayne23',
requestOption: 'uploads',
success: function(videos){
...code here
}
});
View more samples: https://github.com/defvayne23/jTube
32
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
