$(function(){
	
	$("a").focus(function(){ $(this).blur(); });
	
	var $imgTab = $(".img-tab"),
		$btnExtendedShort = $(".btn-extended-short"),
		
		$windowMailtoafriend = $(".window-mailtoafriend"),
		$mailtoafriend = $(".mailtoafriend"),
		mailtoafriendSrc = $mailtoafriend.attr("src"),
		$windowEmbed = $(".window-embed"),
		$embed = $(".embed"),
		embedCode = $embed.val(),
		
		$btnMailtoafriend = $(".btn-mailtoafriend"),
		$windowMailtoafriendClose = $(".window-mailtoafriend-close"),
		$btnDownload = $(".btn-download"),
		$btnEmbed = $(".btn-embed"),
		$windowEmbedClose = $(".window-embed-close"),
		$btnsPanel = $(".btns-panel"),
		$btnTwitter = $(".btn-twitter"),
		$btnFacebook = $(".btn-facebook"),
		$txtTitle = $(".txt-title"),
		
		$viewarea = $(".viewarea"),
		$viewareaContent = $(".viewarea-content"),
		$viewareaSwf = $(".viewarea-swf"),
		$viewareaSendtofriend = $(".viewarea-sendtofriend"),
		
		$btnPrev = $(".btn-prev"),
		$btnNext = $(".btn-next"),
		$txtTitle2 = $(".txt-title-2"),
		
		anims = {
			tabLoad: function(after){
					$imgTab
						.show("slide", { 
							direction: "up", 
							distance: 50,
							easing: "easeOutExpo"
						}, 500, after );
					return this;
				},
			btnExtendedShortLoad: function(after){
					$btnExtendedShort.fadeIn(250);
					return this;
				},
			txtTitleIn: function(after){
					$txtTitle.fadeIn(250);
					return this;
				},
			txtTitleIn: function(after){
					$txtTitle.fadeIn(250, after);
					/*var left = $txtTitle.css("marginLeft");
					$txtTitle
						.css({
							opacity: .25,
							marginLeft: 800
						})
						.show()
						.animate({
							opacity: 1,
							marginLeft: left
						}, 250, after);*/
					return this;
				},
			txtTitleOut: function(after){
					$txtTitle.fadeOut(250, after);
					return this;
				},
			viewareaIn: function(after){
					var left = $viewarea.css("marginLeft"),
						cssOptions = $.support.opacity ? { opacity: 0,	marginLeft: 500 } : { marginLeft: 500 }
						animOptions = $.support.opacity ? { opacity: 1,	marginLeft: left } : { marginLeft: left };
					$viewarea
						.css(cssOptions)
						.show()
						.animate(animOptions, 250, "easeOutQuad", function(){
							$viewareaSwf.css({
								marginTop: ($viewareaContent.height() - $viewareaSwf.height())/2,
								marginLeft: ($viewareaContent.width() - $viewareaSwf.width())/2
							})
							if(after) after();
						});
						
					return this;
				},
			viewareaOut: function(after){
					var left = $viewarea.css("marginLeft"),
						animOptions = $.support.opacity ? { opacity: 0, marginLeft: 0 } : { marginLeft: -600 } ;
					$viewarea
						.animate(animOptions, 250, "easeInQuad", function(){
								$viewarea.removeAttr("style");
								if(after) after();
							});
					return this;
				},
			viewareaPrevIn: function(after){
					var left = $viewarea.css("marginLeft")
						cssOptions = $.support.opacity ? { opacity: 0, marginLeft: -150 } : { marginLeft: -600 },
						animOptions = $.support.opacity ? { opacity: 1, marginLeft: left } : {marginLeft: left };
					$viewarea
						.css(cssOptions)
						.show()
						.animate(animOptions, 250, function(){
							$viewareaSwf.css({
								marginTop: ($viewareaContent.height() - $viewareaSwf.height())/2,
								marginLeft: ($viewareaContent.width() - $viewareaSwf.width())/2
							})
							if(after) after();
						});
					return this;
				},
			viewareaPrevOut: function(after){
					var left = $viewarea.css("marginLeft"),
						animOptions = $.support.opacity ? { opacity: 0, marginLeft: 500 } : { marginLeft: 1500 };
					$viewarea
						.animate(animOptions, 250, function(){
								$viewarea.removeAttr("style");
								if(after) after();
							});
					return this;
				},
			txtTitle2In: function(){
					var height = $txtTitle2.height(),
						top = parseInt($txtTitle2.css("marginTop"));
					$txtTitle2
						.css({ 
							height: 0,
							marginTop: top + height
						})
						.animate({ 
							height: height,
							marginTop: top
						}, 250);
					return this;
				},
			txtTitle2Out: function(){
					var height = $txtTitle2.height(),
						top = parseInt($txtTitle2.css("marginTop"));
					$txtTitle2
						.animate({ 
							height: 0,
							marginTop: top + height
						}, 250,
							function(){
								$(this).removeAttr("style");
						});
					return this;
				},
			btnsPanelLoad: function(after){
					var left = $btnsPanel.css("marginLeft");
					$btnsPanel
						.css({
							marginLeft: -500
						})
						.show()
						.animate({
							marginLeft: left
						}, 500, "easeOutElastic", after);
					return this;
				},
			btnTwitterLoad: function(after){
					var top = $btnTwitter.css("marginTop");
					$btnTwitter
						.css({
							marginTop: -50
						})
						.show()
						.animate({
							marginTop: top
						}, 150, "easeInExpo", after);
					return this;
				},
			btnFacebookLoad: function(after){
					var top = $btnFacebook.css("marginTop");
					$btnFacebook
						.css({
							marginTop: -50
						})
						.show()
						.animate({
							marginTop: top
						}, 150, "easeInExpo", after);
					return this;
				},
			btnNextIn: function(after){
					if(!$btnNext.is(":visible")) $btnNext.fadeIn(50);
					return this;
				},
			btnNextOut: function(after){
					if($btnNext.is(":visible")) $btnNext.fadeOut(50);
					return this;
				},
			btnPrevIn: function(after){
					if(!$btnPrev.is(":visible")) $btnPrev.fadeIn(50);
					return this;
				},
			btnPrevOut: function(after){
					if($btnPrev.is(":visible")) $btnPrev.fadeOut(50);
					return this;
				},
			windowMailtoafriendIn: function(after){
					$windowMailtoafriend.slideDown(250);
					return this;
				},
			windowMailtoafriendOut: function(after){
					$windowMailtoafriend.slideUp(250);
					return this;
				},
			windowEmbedIn: function(after){
					$windowEmbed.slideDown(250);
					return this;
				},
			windowEmbedOut: function(after){
					$windowEmbed.slideUp(250);
					return this;
				}
			
		},
		videoIndex = 0,
		loadVideo = function(index){
			if(!videos || !videos[index]) return;
			
			var video = videos[index],
				width = video.width,
				height = video.height,
				src = "/vd2/" + video.flv,
				src_extended = "/vd2/" + video.flv_extended,
				still = video.still_path + "/" + video.still,
				txtTitle = video.title_1_path + "/" + video.title_1,
				txtTitle2 = video.title_2_path + "/" + video.title_2,
				$object = $viewareaSwf.find("object"),
				$embedEl = $viewareaSwf.find("embed");
			
			if(src_extended) src = src_extended;
				
			$viewareaSwf.removeAttr("style");
			$viewareaContent
				.css("backgroundImage", "url("+still+")")
				.unbind("click")
				.click(function(){
					$viewareaContent.css("backgroundImage", "none");
					$viewareaSwf.show();
				});
				
				
			//replace swf object - ie hack;
			var replaceObj = function(src){
				$viewareaSwf.html('<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" height="'+height+'" width="'+width+'"><param name="movie" value="'+src+'"><param name="quality" value="best"><param name="play" value="true"><embed height="'+height+'" pluginspage="http://www.macromedia.com/go/getflashplayer" src="'+src+'" type="application/x-shockwave-flash" width="'+width+'" quality="best" play="true"></object>');
			};
			replaceObj(src);
			
			$txtTitle.css("backgroundImage", "url("+txtTitle+")");
			$txtTitle2.css("backgroundImage", "url("+txtTitle2+")");
			
			//Facebook
			/**
			$("[name=description]").attr("content", video.description);
			$("[rel=image_src]").attr("href", base_url + still);
			$("[rel=video_src]").attr("href", base_url + src);
			$("[name=video_height]").attr("content", height);
			$("[name=video_width]").attr("content", width);
			$btnFacebook.unbind("click").click(function(){
				window.open('http://www.facebook.com/sharer.php?u=' + encodeURIComponent(location.href) +
					'&t=' + encodeURIComponent(document.title), 'facebook', 'width=600,height=425,toolbar=no,status=no');
			});
			/**/
				
			//Next and Prev buttons
			if(index < videos.length-1) anims.btnNextIn();
			else anims.btnNextOut();
			if(index > 0) anims.btnPrevIn();
			else anims.btnPrevOut();
			
			//Mail to a friend
			$mailtoafriend.attr("src", mailtoafriendSrc.replace("{video:item_name}", video.item_name));
			$btnDownload.unbind("click").click(function(){
					window.open(video.mp4_path + "/" + video.mp4, "_self");
				});
			//Embed code
			$embed.val(
					embedCode
						.replace("{embed:flv}", video.flv)
						.replace("{embed:width}", video.width)
						.replace("{embed:height}", video.height)
				);
			$btnExtendedShort.removeClass("btn-short");
				
			//extend/short version toggle
			$btnExtendedShort.unbind("click").toggle(function(){
					replaceObj(src_extended);
					$embed.val(
							embedCode
								.replace("{embed:flv}", video.flv_extended)
								.replace("{embed:width}", video.width)
								.replace("{embed:height}", video.height)
						);
					$(this).addClass("btn-short");
				},function(){
					replaceObj(src_extended);
					$embed.val(
							embedCode
								.replace("{embed:flv}", video.flv)
								.replace("{embed:width}", video.width)
								.replace("{embed:height}", video.height)
						);
					$(this).removeClass("btn-short");
				});
			
		};
	
	$windowMailtoafriendClose.click(function(){
		anims.windowMailtoafriendOut();
	});
	$windowEmbedClose.click(function(){
		anims.windowEmbedOut();
	});
	
	$btnNext.click(function(){
			anims
			.txtTitle2Out()
			.txtTitleOut()
			.viewareaOut(function(){
				videoIndex++;
				if(videoIndex >= videos.length) videoIndex = videos.length - 1;
				loadVideo(videoIndex);
				anims.viewareaIn(function(){
						anims
							.txtTitleIn()
							.txtTitle2In();
					});
			});
		});
	$btnPrev.click(function(){
			anims
			.txtTitle2Out()
			.txtTitleOut()
			.viewareaPrevOut(function(){
				videoIndex--;
				if(videoIndex < 0) videoIndex = 0;
				loadVideo(videoIndex);
				anims.viewareaPrevIn(function(){
						anims
							.txtTitleIn()
							.txtTitle2In();
					});
			});
		});
	$btnMailtoafriend.toggle(function(){
			anims
				.windowMailtoafriendIn()
				.windowEmbedOut();
		},function(){
			anims.windowMailtoafriendOut();
		});
	
	$btnEmbed.toggle(function(){
			anims	
				.windowEmbedIn()
				.windowMailtoafriendOut();
		},function(){
			anims.windowEmbedOut();
		});
	$embed.click(function(){ this.select(); });
	
	
	
	;(function(){
		anims.btnTwitterLoad();
		$btnFacebook.timeout(function(){ 
			anims
				.btnFacebookLoad(anims.btnsPanelLoad)
				.btnExtendedShortLoad()
				.tabLoad(function(){
					loadVideo(0);
					anims.viewareaIn(function(){
							anims
								.txtTitleIn()
								.txtTitle2In();
						});
				});
		}, 200);
	})();
	
	
});