Skip to content

Instantly share code, notes, and snippets.

@brettkelly
Created February 1, 2011 23:59
Show Gist options
  • Save brettkelly/806991 to your computer and use it in GitHub Desktop.
Save brettkelly/806991 to your computer and use it in GitHub Desktop.
yt player thingie
var playerEmbedId = 'ytOverlayPlayer';
var playerTargetId = 'videoOverlayTarget';
var player = null;
var playerObj = null;
var QUERY_URL_BASE = 'http://www.youtube.com/v/';
jQuery.fn.apicenter = function () {
this.css("position","fixed");
this.css("top", ( $(window).scrollTop() + $(window).height() - this.height()-100 ) + "px");
this.css("left", ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + "px");
this.css("z-index","2000");
return this;
}
function clearAndResetPlayer(){
$(".overlay").jqmHide();
$(".jqmOverlay").remove();
html = '<a id="videoClose" href="#">';
html += '<img src="player/close.png" alt="X" />';
html += '</a>';
html += '<div id="videoOverlayTarget"></div>';
$("#videoOverlayContainer")
.attr('style','')
.empty()
.html(html);
$(".overlay").attr('class','').attr('style','').addClass('overlay');
}
function OverlayPlayer(videoId,embedId,targetId) {
this.height = '375';
this.width = '500';
this.ver = '8'; // minimum flash version
this.target = targetId;
this.videoId = videoId;
this.embedId = embedId;
this.params = { allowScriptAccess: 'always', wmode: 'opaque' };
this.attrs = { id: embedId };
this.playerQueryOpts = {
'enablejsapi':'1',
'autoplay':'1',
'fs':'0',
'rel':'0',
'showsearch':'0',
'showinfo':'0',
'iv_load_policy':'3'
};
this.url =
function(){
var s = QUERY_URL_BASE+videoId;
s += '?playerapiid='+embedId;
for(var key in this.playerQueryOpts){
s += '&'+key+'='+this.playerQueryOpts[key];
}
return s;
};
this.play = function(){ this.player.playVideo(); };
this.stop = function(){ this.player.stopVideo(); };
this.stateHandler =
function(newState) {
console.log('New State: '+newState);
switch(newState) {
case 5: // cued
playerObj.play();
playerObj.videoStarted = true;
break;
case 0: // video ended
clearAndResetPlayer();
break;
case -1: // not playing, unstarted
case 1: // playing
case 3: // buffering
default:
break;
}
};
this.errorHandler =
function(error) {
console.log(error);
}
this.videoStarted = false;
};
function onYouTubePlayerReady(playerId){
playerObj.player = document.getElementById(playerId);
playerObj.player.addEventListener("onStateChange","playerObj.stateHandler");
playerObj.player.addEventListener("onError","playerObj.errorHandler");
}
function showOverlay(){
console.log('show overlay');
$(".overlay").jqmShow();
}
function onOverlayClose(){
clearAndResetPlayer();
}
function initPlayer(caller){
videoId = caller.id.replace(/^video_/,'');
showOverlay();
playerObj = new OverlayPlayer(videoId,playerEmbedId,playerTargetId);
swfobject.embedSWF(
playerObj.url(),
playerObj.target,
playerObj.width,
playerObj.height,
playerObj.ver,
null, // express install URL - not used
null, // FlashVars - not used
playerObj.params,
playerObj.attrs,
function(){
$("#videoOverlayContainer").apicenter();
}
);
}
function initOverlay(){
$(".overlay").jqm(
{
/*modal:true,*/
onShow:
function(hash){
$("#videoOverlayContainer").show();
initPlayer(hash.t);
},
onHide:
function(hash){
playerObj.stop();
/*hash.w.jqmHide();*/
clearAndResetPlayer();
},
trigger: '.videoLink'
}
);
}
$(function(){
initOverlay();
$("#videoClose").live('click',
function(){
clearAndResetPlayer();
}
);
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment