Youtube播放列表随机嵌入

时间:2013-05-03 11:11:14

标签: javascript youtube-api

对于一个小型视频比赛(大多数喜欢在facebook上)我试图在我的主页内嵌入一个youtube播放列表。每个视频下面都有一个类似的按钮。

现在我想要实现的是,每次重新加载页面时,视频的顺序都应该改变,以便机会相等。

到目前为止,这是我的代码(由于ckeditor没有允许php)

    

<script type="text/javascript">
google.setOnLoadCallback(function () {
// setup the click handler
function loadVideo(video) {

$('#videos h3').text(video.title);

$('#youtubeVideo').html([
  '<iframe style="max-width:100%;" width="839" height="472" title="', video.title, '" src="', video.href, '" frameborder="0" allowfullscreen="true"></iframe>'
].join(""));
return false;
}

// get the feed info
// setting max-results delivers you the maximum of 50, you can remove to default to 25. Use feed.setNumEntries to strip down to a range between 50 and 25.
var feedUrl = "http://gdata.youtube.com/feeds/api/playlists/5602ED8DD2643FC2?max-results=50";
new google.feeds.lookupFeed(feedUrl, function (result) {
if (result.error || !result.url) {
$('#videocomm').hide();
return;
}
// get the feed items
var feed = new google.feeds.Feed(result.url);
feed.setNumEntries(50);
feed.load(function (result) {
// write out the feed data
var container = $(".youtubeFeed");
//var totalcount = result.feed.entries.length;
//alert (totalcount);

for (var i = 0; i < result.feed.entries.length; i++) {
var entry = result.feed.entries[i];
var vidhash = /=(.*)&(.*)$/.exec (entry.link)[1];
// uncomment this and comment out the item below if you find rendering of the player a bit slow
// container.append('<li><div><a href="http://www.youtube.com/v/'+vidhash+'&feature=youtube_gdata&rel=1" class="yt-vid-link" title="'+entry.title+'"><img src="http://img.youtube.com/vi/'+vidhash+'/2.jpg" /><br />'+entry.title+'</a></div></li>\n');

// comment the item below and uncomment the item above if you find the player swap too slow
  container.append('<li class="vid-list-item"><span class="yt-title">'+entry.title+'</span><a href="http://www.youtube.com/embed/'+vidhash+'" class="yt-vid-link" title="'+entry.title+'"><img src="http://img.youtube.com/vi/'+vidhash+'/2.jpg" /></a><iframe src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.youtube.com/watch?v='+vidhash+'=&amp;send=false&amp;layout=button_count&amp;width=200&amp;show_faces=false&amp;font&amp;colorscheme=light&amp;action=like&amp;height=21&amp;appId=469231673121827" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:200px; height:21px;" allowTransparency="true"></iframe></li>\n');
}
// load the first video
$(".yt-vid-link:first").each(function () {
loadVideo(this);
return false;
});
// setup the click handler for all the videso
$(".yt-vid-link").click(function () {
loadVideo(this);
return false;
});
});
});
});
google.load("feeds", "1");
</script>

<div id="videos">
<div id="videocomm">
<h3>Warte kurz, wir laden die Videos....</h3>

<div id="youtubeVideo">&nbsp;</div>

<div class="slider">
<div id="fragment-1">
<ul class="youtubeFeed">
</ul>
</div>
</div>
</div>
</div>

更新:这就是我提出的

function zufall() {
 return (Math.random() - Math.random());
}
result.feed.entries.sort(zufall); 

1 个答案:

答案 0 :(得分:0)

据我所知,您可以随机result.feed.entries来获得所需的结果。

你可以使用这样的函数:

function fisherYates ( myArray ) {
  var i = myArray.length, j, tempi, tempj;
  if ( i === 0 ) return false;
  while ( --i ) {
     j = Math.floor( Math.random() * ( i + 1 ) );
     tempi = myArray[i];
     tempj = myArray[j];
     myArray[i] = tempj;
     myArray[j] = tempi;
   }
}

See this StackOverflow answer