index.html
<!doctype html>
<html>
<head>
<meta charset=”utf-8″>
<title>Latest Youtube Videos</title>
<script src=”http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.js”></script>
<script src=”get-latest-videos.js”></script>
</head>
<body>
<div id=”videogroup”> <!– here will be loaded your videos –> </div>
</body>
</html>
get-latest-videos.js
// JavaScript Document
function show_my_videos(data){
html = ['<ul id="youtube-videos">'];
$(data.feed.entry).each(function(entry){
entriesTitle=this.title.$t;
url = this.link[0].href;
url_thumbnail = this.media$group.media$thumbnail[3].url;
description = this.media$group.media$description.$t;
html.push(‘<h4>’+entriesTitle+’</h4>’);
html.push(‘<li><a href=”‘+url+’” target=”_blank”>’);
html.push(‘<img src=”‘+url_thumbnail+’” alt=”‘+description+’”><br />’);
html.push(‘</a></li>’);
html.push(”+description+”);
html.push(‘<br /><br />’);
});
html.push(‘</ul>’);
$(“#videogroup”).html(html.join(”));
}
$.ajax({
type: “GET”,
url: “http://gdata.youtube.com/feeds/users/s4sanjoy/uploads?alt=json-in-script&max-results=4&format=5″,
cache: false,
dataType:’jsonp’,
success: function(data){
show_my_videos(data);
//If you want to see in console…
// console.log(data);
// console.log(data.feed.entry);
// $(data.feed.entry).each(function(){
// console.log(this.link[0].href);
// console.log(this.media$group.media$thumbnail[3].url);
// console.log(this.media$group.media$description.$t);
// });
}
});
<!doctype html>
<html>
<head>
<meta charset=”utf-8″>
<title>Latest Youtube Videos</title>
<script src=”http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.js”></script>
<script src=”get-latest-videos.js”></script>
</head>
<body>
<div id=”videogroup”> <!– here will be loaded your videos –> </div>
</body>
</html>
get-latest-videos.js
// JavaScript Document
function show_my_videos(data){
html = ['<ul id="youtube-videos">'];
$(data.feed.entry).each(function(entry){
entriesTitle=this.title.$t;
url = this.link[0].href;
url_thumbnail = this.media$group.media$thumbnail[3].url;
description = this.media$group.media$description.$t;
html.push(‘<h4>’+entriesTitle+’</h4>’);
html.push(‘<li><a href=”‘+url+’” target=”_blank”>’);
html.push(‘<img src=”‘+url_thumbnail+’” alt=”‘+description+’”><br />’);
html.push(‘</a></li>’);
html.push(”+description+”);
html.push(‘<br /><br />’);
});
html.push(‘</ul>’);
$(“#videogroup”).html(html.join(”));
}
$.ajax({
type: “GET”,
url: “http://gdata.youtube.com/feeds/users/s4sanjoy/uploads?alt=json-in-script&max-results=4&format=5″,
cache: false,
dataType:’jsonp’,
success: function(data){
show_my_videos(data);
//If you want to see in console…
// console.log(data);
// console.log(data.feed.entry);
// $(data.feed.entry).each(function(){
// console.log(this.link[0].href);
// console.log(this.media$group.media$thumbnail[3].url);
// console.log(this.media$group.media$description.$t);
// });
}
});
No comments:
Post a Comment