Skip to content

Instantly share code, notes, and snippets.

@eristoddle
Created September 19, 2012 17:22
Show Gist options
  • Save eristoddle/3750908 to your computer and use it in GitHub Desktop.
Save eristoddle/3750908 to your computer and use it in GitHub Desktop.
Very specific YouTube Jquery example
(function($){
$.fn.youtube = function(options){
return this.each(function(i, obj){
var $this = $(obj),
$playBtns = $this.find('.video .play-btn'),
player,
onPlayerReady = function(){
player.playVideo();
},
loadPlayer = function(id){
player = new YT.Player('ytplayer', {
videoId: id,
playerVars:{
'autoplay': 0,
'autohide': 1,
'enablejsapi': 1,
'modestbranding': 1,
'fs': 1,
'origin' : window.location.protocol+'://'+window.location.host,
'theme': 'light',
},
events: {
'onReady': onPlayerReady
}
});
};
$playBtns.each(function(i){
$(this).click(function(e){
e.preventDefault();
var ytId = $(this).attr('data-youtubeid'),
$playBtn = $(this);
$box = $(this).parents('.box:first'),
$container = $(this).parents('.video:first'),
$header = $box.find('.header'),
$indicators = $box.find('.indicators')
closeOthers = function(){
$this.find('#ytplayer').remove();
$this.find('.panel-copy').show();
$this.find('.indicators').show();
$this.find('.close-btn').remove();
$playBtns.show();
};
closeOthers();
$indicators.hide();
$playBtn.hide();
$header.append('<a href="#" class="close-btn">close</a>');
$closeBtn = $header.find('.close-btn');
$closeBtn.show();
$container.prepend($('<div id="ytplayer" class="'+ytId+'"></div>'));
loadPlayer(ytId);
$container.find('.panel-copy').hide();
$container.find('#ytplayer').show().css({
'width': '100%',
'height': $container.parents('.box:first').height() - 35,
'padding-bottom': '10px'
});
$this.find('.carousel').mouseout();
$closeBtn.click(function(e){
e.preventDefault();
$container.find('#ytplayer').remove();
$container.find('.panel-copy').show();
$indicators.show();
$(this).remove();
$playBtn.show();
});
})
})
});
}
})(jQuery);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment