/****USAGE*****
Required plugins:
1, jQuery
2, jQuery.swfObject - http://jquery.thewikies.com/swfobject/
3, jQuery.mousewheel - http://brandonaaron.net/code/mousewheel/docs

Add a class "trigger_video_popup" onto items such as 'a' tag or 'img' tag.
Add the following attribute onto the item.
1, videosrc: absolute path to the video url
2, imagesrc: absolute path to the video image url
3, videowidth: int
4, videoheight: int (include player height 30px)
5, videoautoplay: boolean

*/
(function($) {
	$.videoPopup = function(userArgs) {
		var args = {
			zIndex:100,
			jwplayer:false
		}
		$.extend(true, args, userArgs);
		
              if(args.jwplayer) var player = 'http://media.telecoms.com/jwplayer/player.swf';
              else player = 'http://media.telecoms.com/video_page/vPlayer.swf';

		$('.trigger_video_popup').each( function() {
			
			if($(this).parent().is('a')) $(this).parent().click( function() { return false; });
			if($(this).is('a')) $(this).click( function() { return false; });
			
			$(this).bind('click', function() {
				var videosrc = $(this).attr('videosrc');
				
				if(videosrc != null) {
					var imagesrc = $(this).attr('imagesrc');
					var videowidth = $(this).attr('videowidth');
					if(videowidth == null) videowidth = 400;
					var videoheight = $(this).attr('videoheight');
					if(videoheight == null) videoheight = 300;
					var videoautoplay = $(this).attr('videoautoplay');
					if(videoautoplay == null) videoautoplay = 'false';
										
					var ww = $(window).width();
					var wh = $(window).height();
					var scrollTop = $(window).scrollTop();
					
					var bodyH = Math.max(
        				Math.max(document.body.scrollHeight, document.documentElement.scrollHeight),
        				Math.max(document.body.offsetHeight, document.documentElement.offsetHeight),
        				Math.max(document.body.clientHeight, document.documentElement.clientHeight)
    				);
					if(bodyH == 0) bodyH = 10000;
					else if(bodyH < wh) bodyH = wh;
		
					var topPosi = (wh-videoheight)*0.5;
					var leftPosi = (ww-videowidth)*0.5;
					
					var blackbox = $('<div></div>').attr('id','black_box_back_pane').css({'position':'absolute','top':0,'left':0,'width':ww+'px','height':bodyH+'px','background-color':'#000','opacity':0.85,'z-index':args.zIndex});
					var contentbox = $('<table></table>').attr({'id':'black_box_content_pane','cellPadding':0,'cellSpacing':0}).css({'position':'absolute','top':scrollTop+'px','left':0,'text-align':'center','width':ww+'px','height':wh+'px','z-index':args.zIndex+1});
					var td = $('<td></td>').css({'vertical-align':'middle','width':'100%','height':'100%','text-align':'center'});
					contentbox.append($('<tr></tr>')).find('tr').append(td);
		
					var closebtn = $('<div>X</div>').css({'padding':'5px 10px','font-size':'25px','font-weight':'bold','font-family':'Arial, sans-serif','color':'#fff','cursor':'pointer'});	
					var closebox = $('<div></div>').attr('id','black_box_close_box').css({'position':'absolute','top':scrollTop+10+'px','left':'10px','border':'2px solid #fff','border-radius':'5px','-moz-border-radius':'5px','-webkit-border-radius':'5px','-o-border-radius':'5px','background-color':'#000','z-index':args.zIndex+2}).append(closebtn);
					
					if(jQuery().mousewheel) {
						blackbox.bind('mousewheel', function(evt, dlt) {
							evt.stopPropagation();
							evt.preventDefault();
							return false;
						});
						contentbox.bind('mousewheel', function(evt, dlt) {
							evt.stopPropagation();
							evt.preventDefault();
							return false;
						});
						closebox.bind('mousewheel', function(evt, dlt) {
							evt.stopPropagation();
							evt.preventDefault();
							return false;
						});
					}
					
					$('body').append(blackbox).append(contentbox).append(closebox);
					
					if ((navigator.userAgent.indexOf('iPhone') != -1) || (navigator.userAgent.indexOf('iPod') != -1) || (navigator.userAgent.indexOf('iPad') != -1)) {
						
						if(videoautoplay == 'true') videoautoplay = true;
						else videoautoplay = false;
						var content = $('<video></video>').attr({'src':videosrc,'controls':'controls','width':videowidth,'height':videoheight,'autoplay':videoautoplay});
						if(imagesrc != null) content.attr('poster',imagesrc);
						td.append(content);
						
					}else{
					
						var flashvarsObj = [{file:videosrc, autoplay:videoautoplay}];
						if(imagesrc != null) 
							flashvarsObj = flashvarsObj.concat([{image:imagesrc}]);
						var content = $.flash.create({
							swf:player+'?r='+Math.random(),
							width:videowidth,
							height:videoheight,
							allowScriptAccess:"samedomain",
							allowFullScreen:true,
							quality:"high",	
							wmode:"transparent",
							scale:"noscale",
							salign:"tl",
							expressInstaller:"http://media.telecoms.com/jqueryplugins/expressInstall.swf",
							flashvars:flashvarsObj
						});
						td.html(content);
					}
					
					closebox.bind('click', function(e) {
						if(jQuery().mousewheel) {
							blackbox.unbind('mousewheel');
							contentbox.unbind('mousewheel');
							closebox.unbind('mousewheel');
						}
						closebox.unbind('click');
						
						closebox.remove();
						contentbox.remove();
						blackbox.remove();
						
						content = null;
						td = null;
						blackbox = null;
						contentbox = null;
						closebox = null;
						
						videosrc = null;
						imagesrc = null;
						videowidth = null;
						videoheight = null;
						videoautoplay = null;
						ww = null;
						wh = null;
						scrollTop = null;
						bodyH = null;
						topPosi = null;
						leftPosi = null;
					});
				}
			});
		});
		
		//RESIZE WINDOW FUNCTION
		$(window).resize( function() {
			
				var ww = $(this).width();
				var wh = $(this).height();
				var scrollTop = $(window).scrollTop();
				var bodyH = Math.max(
        				Math.max(document.body.scrollHeight, document.documentElement.scrollHeight),
        				Math.max(document.body.offsetHeight, document.documentElement.offsetHeight),
        				Math.max(document.body.clientHeight, document.documentElement.clientHeight)
    			);
				if(bodyH == 0) bodyH = 10000;
				else if(bodyH < wh) bodyH = wh;
				
				if(document.getElementById('black_box_back_pane')) {
					$('#black_box_back_pane').css({'width':ww+'px'});
					if(wh > bodyH) {
						$('#black_box_back_pane').css({'height':wh+'px'});
					}
				}
				
				if(document.getElementById('black_box_content_pane')) {
					contentbox = $('#black_box_content_pane');
					contentbox.css({'width':ww+'px','height':wh+'px'});
				}
				
				if(document.getElementById('black_box_close_box')) {
					$('#black_box_close_box').css({'top':10+scrollTop+'px'});	
				}
				
				ww = null;
				wh = null;
				scrollTop = null;
				bodyH = null;
				return false;
		});
		
	}
	
	
})(jQuery)
