var experienceId = "myExperience";

var gridShare = function () {
	return {
		shareVideo:function (site, refId, lang) {
			var url = encodeURIComponent('http://ckone.com/home/video?ref='+ refId +'&lang='+ lang +'&cb='+ new Date().getTime());
			switch (site) {
				case 'fb':
					url = 'http://facebook.com/share.php?u='+ encodeURIComponent('http://ckone.com/home/video?ref='+ refId +'&lang='+ lang +'&cb='+ new Date().getTime());
					break;
				case 'twitter':
					url = 'http://twitter.com/share?url='+ url;
					break;
				case 'digg':
					url = 'http://digg.com/submit?url='+ url;
					break;
				case 'delicious':
					url = 'http://delicious.com/save?url='+ url;
					break;					
				default:
					return false;
			}
			window.open(url, 'grid_share_'+ site);
		}
	};
}();

var loadVideo = function (referenceId) {// ? call this function "onchange", nothing else on the page changes
		var bcExperience	= brightcove.getExperience(experienceId);
		var modVideoPlayer	= bcExperience.getModule(APIModules.VIDEO_PLAYER);
		modVideoPlayer.loadVideo(referenceId, 'referenceId');
	};

function muteVideo (expId) {
	var bcExperience	= brightcove.getExperience(expId);
	var modVideoPlayer	= bcExperience.getModule(APIModules.VIDEO_PLAYER);
	modVideoPlayer.mute(!modVideoPlayer.isMuted());
}

function rewindVideo (expId) {
	var bcExperience	= brightcove.getExperience(expId);
	var modVideoPlayer	= bcExperience.getModule(APIModules.VIDEO_PLAYER);
	modVideoPlayer.seek(0);
}

function addPlayer(divId,videoId) {
var params = {};
		var realdivId = divId.replace(/player/gi, "position"); 
		params.playerID = "749768221001";
		params.autoStart = "true";
		params.wmode = "transparent";
		params.dynamicStreaming = "true";
		params['@videoPlayer'] = videoId; //"ref:CKONE_list";
		params.width = (divId =='overlay') ? $(document).width()  : $("#"+realdivId).width();
		params.height = (divId == 'overlay') ? $(document).height() - 140 : $("#"+realdivId).height();
		params.isVid = "true";
		params.playerKey = "AQ~~,AAAArZFbd-k~,X_yEGdo02qeLwIKDzJrQP9sv19c1nZSO";
		params.isUI = "true";
		
		var player = brightcove.createElement("object");
		player.id = experienceId+divId;
		var parameter;
		for (var i in params) {
		parameter = brightcove.createElement("param");
		parameter.name = i;
		parameter.value = params[i];
		player.appendChild(parameter);
		}
		var container = document.getElementById(divId);
		//$("#"+divId).hide(); 
		brightcove.createExperience(player, container, true);		
}

function appendImg(el, fileName) {
	var img = $("<img>");
	img.attr('src', "/assets/images/"+fileName).appendTo(el);
}

function getPreviousVideo(id, dataObj) {
	var langValue = $.cookie('ck_one_lang');
	var localized = $.parseJSON(dataObj['locale_name_localized']);
	
	$.ajax({
		url: '/home/previous_video/'+id,
		type: 'GET',
		success: function(dataObj) {
			var data = $.parseJSON(dataObj); 
			var playerId = "myExperienceoverlay";
			brightcove.removeExperience(playerId); 
			addPlayer('overlay',data['brightcove_reference_id']);
			newRefId = data['video_id'];
			$("#get_previous").attr('content_id',newRefId);
			$("#overlay").find('div.clip_type_callout').html(localized[langValue]); 
		
		if(data['question_text'] != null) {
				var theimg = $("#overlay").find("img.question_img"); 
				if (theimg.length != 0) {
				$("#overlay").find('img.question_img').attr('src','/home/productimage/?text='+data['question_text']+'&style={"font-family":"pixelmix","text-transform":"uppercase","background":"000","padding":"7 7 7 7","font-size":"12","color":"000", "background-color": "fff"}').css('z-index',1000).show();
				} else {
				var questionImg = $("<img>");
				questionImg.addClass('question_img').attr('src','/home/productimage/?text='+data['question_text']+'&style={"font-family":"pixelmix","text-transform":"uppercase","background":"000","padding":"7 7 7 7","font-size":"12","color":"000", "background-color": "fff"}').css('z-index',1000);
				$("#overlay").find('div.clip_type_callout').append(questionImg);
				}
			} else {
				$("#overlay").find('img.question_img').hide(); 
			}
		
		}
	}); 
}

function getNextVideo(id, dataObj) {
	var langValue = $.cookie('ck_one_lang');
	var localized = $.parseJSON(dataObj['locale_name_localized']);
	
	$.ajax({
		url: '/home/next_video/'+id,
		type: 'GET',
		success: function(dataObj) {
			var data = $.parseJSON(dataObj); 
			var playerId = "myExperienceoverlay";
			brightcove.removeExperience(playerId); 
			addPlayer('overlay',data['brightcove_reference_id']);
			newRefId = data['video_id'];
			$("#get_next").attr('content_id',newRefId);
			$("#overlay").find('div.clip_type_callout').html(localized[langValue]); 
			if(data['question_text'] != null) {
				var theimg = $("#overlay").find("img.question_img"); 
				if (theimg.length != 0) {
				$("#overlay").find('img.question_img').attr('src','/home/productimage/?text='+data['question_text']+'&style={"font-family":"pixelmix","text-transform":"uppercase","background":"000","padding":"7 7 7 7","font-size":"12","color":"000", "background-color": "fff"}').css('z-index',1000).show();
				} else {
				var questionImg = $("<img>");
				questionImg.addClass('question_img').attr('src','/home/productimage/?text='+data['question_text']+'&style={"font-family":"pixelmix","text-transform":"uppercase","background":"000","padding":"7 7 7 7","font-size":"12","color":"000", "background-color": "fff"}').css('z-index',1000);
				$("#overlay").find('div.clip_type_callout').append(questionImg);
				}
			} else {
				$("#overlay").find('img.question_img').hide(); 
			}
			
		}
	}); 
}

function onMediaComplete(evt) {
	var expId = 'myExperienceoverlay';
	var bcExperience	= brightcove.getExperience(expId);
	var modVideoPlayer	= bcExperience.getModule(APIModules.VIDEO_PLAYER);
	
	var the_id = $('#get_previous').attr('content_id'); 
	getNextVideo(the_id); 
}

function onTemplateLoaded(experienceID) {
	var bcExp;
	var modVP;
	
	bcExp = brightcove.getExperience(experienceID);
	modVP = bcExp.getModule(APIModules.VIDEO_PLAYER);
	if(experienceID == 'myExperienceoverlay') {
		modVP.addEventListener(BCMediaEvent.COMPLETE, onMediaComplete); 
	}	
}

function useData(dataObj, selector) {
		var pos = dataObj['position'];
		var targetObj = $("div#position"+pos); 
		var cType = dataObj['content_type'];
		var cData = null;
		var newWidth = (pos == '1') ? '615px' : '406px';
		var langValue = $.cookie('ck_one_lang');
		var localized = $.parseJSON(dataObj['locale_name_localized']);
				
		switch(cType) {
			case '1':	// video
				cData = dataObj['video_thumbnail'];
				var imgId = dataObj['brightcove_reference_id'];
				//var newImg = $("<img>").attr('src',cData).addClass('frame').css('width',newWidth).attr('id',imgId).height($(selector).height());
				var newImg = $("<img>").attr('src',cData).addClass('frame').css('width', '100%').attr('id',imgId).height($(selector).height());
				if(selector == "#position1") { $("#player1 img.frame").height(343); }
				
				//Fix width issues IE for position1
				$("#position1 img.frame").css("width", $("#position1").width());
				
				var theplayer = $(selector).find('div.player');
				theplayer.prepend(newImg).height(newImg.height());
				
				var realSelector = (selector == "#position1") ? selector + " .video" : selector; 
				$(realSelector).mouseenter(
					function(evt) {
						$(this).children('div.thumb').show();	
						//alert(imgId); alert(selector); 
						// $(this).children('div.thumb').children('img.callout').attr('src',"/home/productimage/?text="+dataObj['video_clip_type']+'     >&style={"font-family":"pixelmix","text-transform":"uppercase","background":"000","padding":"7 7 7 7","font-size":"7","color":"fff"}'); 
						// $(this).children('div.thumb').children('img.callout').attr('src',"/home/productimage/?text="+dataObj['video_clip_type']+'     >&style={"font-family":"pixelmix","text-transform":"uppercase","background":"000","padding":"7 7 7 7","font-size":"7","color":"fff"}');
						$(this).children('div.thumb').children('p.callout').html(localized[langValue]+'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;>');

						var newTop = (selector == "#v1") ? $(this).height() * -0.5 : $(this).height() * -0.8;
						// if(selector == "#position1") { $(this).children('div.thumb').children('.button').css('top','80px'); }
						//$(this).children('div.thumb').children('img.callout').css('top',newTop); 
						$(this).children('div.thumb').children('p.callout').css('top',newTop); 
						$(this).children('div.thumb').children('.callout').show();
						$(this).children('div.thumb').children('.button').css('display','block'); 
					}).mouseleave(function(evt) {
						if(selector == "#position1") {
						$(this).children('div.thumb').children('.callout').hide(); 						
						} else {
						$(this).children('div.thumb').children('.button , .callout').hide();
						
						}
					}
					
				);
				
				// fix
				$('#position4').mouseenter(function(evt) { 
					//$(this).children('div.thumb').children('img.callout')
					//.attr('src',"/home/productimage/?text="+dataObj['video_clip_type']+'     >&style={"font-family":"pixelmix","text-transform":"uppercase","background":"000","padding":"7 7 7 7","font-size":"7","color":"fff"}')
					$(this).children('div.thumb').children('p.callout').html(localized[langValue]+'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;>')
					.show();
					var newTop = $(this).parent().height() * -0.8;
					$(this).parent().children('div.thumb').children('img.callout').css('top',newTop).show();
					$(this).parent().children('div.thumb').children('.button').css('display','block');
					 
				}).mouseleave(function(evt) {
					$(this).parent().children('div.thumb').children('.button,.callout').hide(); 
				}); 			
	

				var expId = "exp"+pos;
				$(selector +" a.button").click(function() {
						if(dataObj['clip_type'] == '5') {
							newImg.hide();
							var playerDivId = $(selector + " div.player").attr("id");
							addPlayer(playerDivId,dataObj['brightcove_reference_id']);
							$(selector).children('div.thumb').children('.button, .callout').detach();
							$("html.ie8 #mid .player span").attr("style","display:block layout"); 
							$("html.ie8 #main .player span").attr("style","display:block layout");	
							if(selector == "#position1") { $(selector).children('.video').children('.thumb').children('.button, .callout').detach(); }
						} else {
							newImg.hide();
							var playerDivId = $(selector + " div.player").attr("id");
							// addPlayer(playerDivId, "ref:"+dataObj['related_video_name']);
							addPlayer(playerDivId,dataObj['brightcove_reference_id']);
							$(selector).children('div.thumb').children('.button, .callout').detach();
							$("html.ie8 #mid .player span").attr("style","display:inline-block layout"); 
							$("html.ie8 #main .player span").attr("style","display:inline-block layout");							
							if(selector == "#position1") { $(selector).children('.video').children('.thumb').children('.button, .callout').remove(); }							
						}
						$(this).hide();	
				}).mouseenter(function() {
						$(this).css('background-position','0px -41px'); 
						 
				}).mouseleave(function() {
						$(this).css('background-position', '0 0'); 
				});
				

				$(selector + " .callout").mouseenter(function() {
					$(this).css('cursor','pointer'); 
					$(this).attr('src',"/home/productimage/?text="+dataObj['video_clip_type']+'     >&style={"font-family":"pixelmix","text-transform":"uppercase","background":"000","padding":"7 7 7 7","font-size":"7","color":"0F0"}');
					
				}).mouseleave(function() {
				 	$(this).attr('src',"/home/productimage/?text="+dataObj['video_clip_type']+'     >&style={"font-family":"pixelmix","text-transform":"uppercase","background":"000","padding":"7 7 7 7","font-size":"7","color":"fff"}')
				}).click(function() {
					window.location.href = '/videos?clipTypes='+dataObj['clip_type'];
				}); 	
				$(selector + " div.player img.frame").click(function() {
					window.location.href = "/home/video?ref="+dataObj['content_id']+"&"+whichSite;
				});	
				
				/* $(selector + " div.player img.frame").click(function() { 
					var ov = $("<div>");
					ov.attr('id',"overlay");
					$('#mainCopy').prepend(ov);
					var realheight = $(document).height() - 140;
					var realwidth = $(document).width();
					divId = 'overlay';
					addPlayer(divId,dataObj['brightcove_reference_id']); 
					// everything below here can be refactored out - don't forget to do so
				
					var newcallout = $("<div>");
					newcallout.addClass('clip_type_callout').css('position','absolute');
					var calloutImg = $("<img>");
					calloutImg.addClass('callout_img'); 
					calloutImg.attr('src','/home/productimage/?text='+dataObj['video_clip_type']+'&style={"font-family":"pixelmix","text-transform":"uppercase","background":"000","padding":"7 7 7 7","font-size":"12","color":"fff"}').css('z-index',1000);
					newcallout.prepend(calloutImg);
					
					if(dataObj['question_text'] != null) {
						var questionImg = $("<img>");
						questionImg.addClass('question_img'); 
						questionImg.attr('src','/home/productimage/?text='+dataObj['question_text']+'&style={"font-family":"pixelmix","text-transform":"uppercase","background":"000","padding":"7 7 7 7","font-size":"12","color":"000", "background-color": "fff"}').css('z-index',1000);
						newcallout.append(questionImg); 
					}
					
					$('#'+divId).prepend(newcallout); 
					
					var videoControls = $("<div>");
					videoControls.attr('id',"video_controls").css('top',ov.height() / 2).width(ov.width()).css('left',0);
					$("#"+divId).prepend(videoControls);
					
					var backLink = $("<a>");
					appendImg(backLink,'previous.png'); 
					backLink.attr('id','get_previous').attr('content_id',dataObj['content_id']).addClass('prev-link');
					backLink.appendTo(videoControls);
					
					backLink.click(function() { 						
						getPreviousVideo($(this).attr('content_id')); 						
					}); 
					
					var shareHover = $("<div>");
					appendImg(shareHover,'share.png'); 
					shareHover.attr('id','fake-share'); 
					shareHover.hover(function() {
						$("ul.video-share").show(); 
					},function() {
						$("ul.video-share").hide(); 
					}); 
					shareHover.appendTo(videoControls); 
					
					var videoShareUL = $("<ul>");
					videoShareUL.addClass('video-share').css('display','none');
					var shareArray = new Array('fb', 'twitter','digg','delicious'); 
					var i;
					for(i=0;i<shareArray.length;i++) {
						var shareListItem = $("<li>");
						var shareLink = $("<a>");
						 var onclickStr = "gridShare.shareVideo('"+shareArray[i]+"', '"+dataObj['brightcove_reference_id']+"', 'en');";
						shareLink.attr('href','javascript:'+onclickStr).text(shareArray[i]);
						shareListItem.addClass('sharelink').css('z-index',1000);
						shareListItem.append(shareLink);
						videoShareUL.append(shareListItem);
					}
					videoShareUL.appendTo(shareHover);
					
					var muteLink = $("<a>");
					muteLink.attr('id','mute').addClass('mute');
					appendImg(muteLink,'volume.png');
					muteLink.appendTo(videoControls);
					muteLink.click(function() {
						muteVideo('myExperienceoverlay'); 
					});
					
					var rewindLink = $("<a>");
					appendImg(rewindLink,'replay.png'); 
					rewindLink.attr('id','rewind').addClass('rewind');
					rewindLink.appendTo(videoControls); 
					rewindLink.click(function() {
						rewindVideo('myExperienceoverlay');
					});
					
					var nextLink = $("<a>");
					appendImg(nextLink, 'next.png'); 
					nextLink.attr('id','get_next').addClass('next-link').css('float','right');
					nextLink.appendTo(videoControls);
					
					nextLink.click(function() { 
						getNextVideo($(this).attr('content_id')); 
					}); 
					
					
					
					// close link
					/*var closeLink = $("<a>");
					appendImg(closeLink,'close.jpg');
					closeLink.attr('id','close_overlay').click(function() {
						$("#"+divId).detach(); 
					});

					closeLink.prependTo($('#'+divId)); 
					closeLink.css('left',$(document).width() - 95); 
					
					// end refactorable code
					$("#"+divId).show().css('top',140); 

				}); */
				break;
			case '2':
				cData = dataObj['image_file'];
				var newImg = $("<img>").attr('src',cData).addClass('frame').css('width',newWidth);
				targetObj.find('div.player').append(newImg);
				break;
			case '3':
				cData = dataObj['content_data'];
				targetObj.find('div.player').html(cData);
				break;
		}
	return true;
}


$(document).ready(function() {
	$('#site').height($('.mainCopy').height()); 
	
	// IE7, Opera, etc FIXES
	$(".frame").css('display','none'); 
	$(".callout").css('display','none');
	$('#position1 .player').height($('#position1').height()); 
	$("#position1 img.frame").height($("#position1").height()); 
	
	 
	var contentWidth = $(window).width();
	var contentHeight = contentWidth * .5404;
	var minWidth = 1230;
	var minHeight = 665;
	var playBtnPosLG = function() {
		$('#position1 a.button').css('top', $("#position1 img.frame").height() * 0.78);
		$('#position1 a.button').css('left', $("#position1 img.frame").width() * 0.72);
		$('.ru #position1 a.button').css('left', $(".ru #position1 img.frame").width() * 0.56);
		$('.pt #position1 a.button').css('left', $("#position1 img.frame").width() * 0.607);
		$('.es #position1 a.button').css('left', $("#position1 img.frame").width() * 0.607);
		$('#mid a.button').css('top', $('#mid img.frame').height() *.72);
		$('#mid a.button').css('left', $('#mid img.frame').width() *.58);
		$('.ru #mid a.button').css('left', $(',ru #mid img.frame').width() *.34);
		$('.pt #mid a.button').css('left', $('.pt #mid .player').width() * 0.414);
		$('.es #mid a.button').css('left', $('.es #mid .player').width() * 0.414);		
	}
	var playBtnPosSML = function() {
		$('#position1 a.button').css('top', 270);
		$('#position1 a.button').css('left', 440);
		$('.ru #position1 a.button').css('left', 400);
		$('.pt #position1 a.button').css('left', 373);
		$('.es #position1 a.button').css('left', 373);
		$('#mid a.button').css('top', 155);
		$('#mid a.button').css('left', 230);
		$('.ru #mid a.button').css('left', 139);
		$('.pt #mid a.button').css('left', 168);
		$('.es #mid a.button').css('left', 168);	
	}

	//sets content to fit screen size
	if (contentWidth > minWidth) {
		
		//sets maincontent to the size of the window
		$('#mainContent').css("width", contentWidth); 
		$('#mainContent').css("height", contentHeight);
		$("#branding").css("width", "100%");
		playBtnPosLG();
	}else {
		$("#mainContent").css("width", minWidth);
		$("#branding").css("width", minWidth);
		playBtnPosSML();
	};
	
	$.ajax({
		url: '/home/fetch_content/1/'+whichSite,
		type: 'GET',
		success: function(data) {
			// $("#twitter-feed").html(data);
			dataObj = $.parseJSON(data);
			for (var xx=0;xx<dataObj.length;xx++) {
				//alert(dataObj.length);
				var whichpos = xx + 1;
				var selector = "#position"+ whichpos;
				$(selector + " img.frame").detach();
				useData(dataObj[xx], selector); 
			}
		}
	});
	

	
	// probably won't be needing this function 
	// it suddenly became VERY necessary once we started having to resize things.
	$(document).ajaxStop(function() {
		var realheight = $('#mid').height();
		var newvideoheight = Math.floor(realheight / 3)-4;
		$('#mid .player').parent().height(); 
		$('.dashboard-left').height(realheight); 
		// $('#rail, #rail img').height(realheight-11);
		
		//place play buttons within the thumb div
		$("#position1 .video .thumb").children('.button').css('top', $("#player1").height() * 0.78);
		$("#position1 .video .thumb").children('.button').css('left', $("#player1").width() * 0.72);
		$(".ru #position1 .video .thumb").children('.button').css('left', $(".ru #player1").width() * 0.56);
		$('.pt #position1 a.button').css('left', $("#position1 img.frame").width() * 0.607);
		$('.es #position1 a.button').css('left', $("#position1 img.frame").width() * 0.607);
		$("#position1 .video .thumb").children('.button').css('display','block');
		$('#mid a.button').css('top', $('#mid .player').height() * 0.65);
		$('#mid a.button').css('left', $('#mid .player').width() * 0.58);
		$('.ru #mid a.button').css('left', $('.ru #mid .player').width() * 0.34);
		$('.pt #mid a.button').css('left', $('.pt #mid .player').width() * 0.414);
		$('.es #mid a.button').css('left', $('.es #mid .player').width() * 0.414);
		

		
		
	}); 
	// end maybe unnecessary code :)
	// glad it was here.
//
//	$(".ie7 #position2").height($(".ie7 #position2").height() - 3); 
//	$(".ie7 #rail img").height($(".ie7 #rail img").height() - 5);  
	
});



	
//CHANGES SIZE ON RESIZE	
$(window).resize(function(){
	var contentWidth = $(window).width();
	var contentHeight = contentWidth * .5404;
	var minWidth = 1230;
	var minHeight = 665;
	var playBtnPosLG = function() {
		$('#position1 a.button').css('top', $("#position1 img.frame").height() * 0.78);
		$('#position1 a.button').css('left', $("#position1 img.frame").width() * 0.72);
		$('.ru #position1 a.button').css('left', $("#position1 img.frame").width() * 0.56);
		$('.pt #position1 a.button').css('left', $("#position1 img.frame").width() * 0.607);
		$('.es #position1 a.button').css('left', $("#position1 img.frame").width() * 0.607);
		$('#mid a.button').css('top', $('#mid img.frame').height() *.72);
		$('#mid a.button').css('left', $('#mid img.frame').width() *.58);	
		$('.ru #mid a.button').css('left', $('.ru #mid .player').width() * 0.34);
		$('.pt #mid a.button').css('left', $('.pt #mid .player').width() * 0.414);
		$('.es #mid a.button').css('left', $('.es #mid .player').width() * 0.414);	
	}
	var playBtnPosSML = function() {
		$('#position1 a.button').css('top', 270);
		$('#position1 a.button').css('left', 440);
		$('.ru #position1 a.button').css('left', 440);
		$('.pt #position1 a.button').css('left', 373);
		$('.es #position1 a.button').css('left', 373);
		$('#mid a.button').css('top', 155);
		$('#mid a.button').css('left', 230);
		$('.ru #mid a.button').css('left', 139);
		$('.pt #mid a.button').css('left', 168);
		$('.es #mid a.button').css('left', 168);	
	}	
		
	if (contentWidth > minWidth) {
			
		//sets maincontent to the size of the window
		$('#mainContent').css("width", contentWidth); 
		$('#mainContent').css("height", contentHeight);
		$("#branding").css("width", "100%");
		$("img.frame").height("100%");
		$("img.frame").width("100%");
		$(".player").height("100%");
		playBtnPosLG();
	}else {
		$("#mainContent").css("width", minWidth);
		$("#mainContent").css("height", minHeight);
		$("#branding").css("width", minWidth);
		playBtnPosSML();
	};
	

});