var isDesktop;
var newsData;


$(document).ready(function()
{
	isDesktop = $('#is-desktop').is(':visible');
	
	//tracking
	$(".track").live("click", function(){
		var action = $(this).attr("track");
		CallOmAction(action, ActionMap); 
	});
	
	//on resize check if is-desktop visible if change then refresh page
	
	if(isDesktop)
	{
		$(".popup").live('click', function (e) {
			window.open(this.href, "", "toolbar=0,menubar=0,width=640,height=500,status=0,resizable=1,scrollbars=1");
			e.preventDefault();
		});
	}
	
	if ($("#features").length > 0)
	{
	
		$.getJSON('/js/features.json', function(data) 
		{
			var htmlString = "";
			$.each(data.features, function(i,feature) 
			{
				
				var featureClass;
				var style = "float-left"
				
				switch(feature.width)
				{
					case 1:
						featureClass = "small-feature";
						break;
					case 2:
						featureClass = "wide-feature";
						break;
				}
				
				switch(feature.height)
				{
					case 2:
						featureClass = "tall-feature";
						break;					
				}
				
				if(((i+1) % 2) == 0 )
				{
					style = "float-right";
				}
				
				if(isDesktop)
				{
					htmlString += "<div class='" + featureClass + " " + style +"'  ><a class='track' track='" + feature.track + "' href='" + feature.link + "' target='" + feature.newWindow + "'><img src='img/features/" + feature.image + "' alt='" + feature.text + "'/></div>";
				}	
				else
				{
					htmlString += "<div class='" + featureClass + "'><a class='track' track='" + feature.track + "' href='" + feature.link + "' target='" + feature.newWindow + "'><img src='img/features/" + feature.image + "' alt='" + feature.text + "'/></div>";
				}
			});
			
			$("#features").html(htmlString);
		
		});
		
	}
	
	if(isDesktop)
	{
		$('#navigationList > li:not(".selected")').mouseover(function(){
			$(this).addClass("nav-over");
		});
		
		$('#navigationList > li:not(".selected")').mouseout(function(){
			$(this).removeClass("nav-over");
		});
		
		$('#navigationList > li > a').click(function(e){
			e.preventDefault();
		});
		
		$('#navigationList > li').click(function(){
			var link = $(this).children("a").attr("href");
			var target = $(this).children("a").attr("target");
			CallOmAction($(this).children("a").attr("track"), ActionMap); 
			if(target == "_blank")
			{
				window.open(link);
			}
			else
			{
				document.location = link;
			}
		});
	}
	
	if ($("#global-container").length > 0  && isDesktop)
	{
			
			//var shape = shapeWrapper("40","20,22,0|60,49,0|100,85,0|140,112,0|180,127,0|220,141,0|260,148,0|300,161,0|340,163,0|380,106,0|420,158,0|460,152,0|500,133,0|540,128,0|580,109, 0|620, 126, 0|660,0,0|");
			var shape = '<div style="float:left;clear:left;height:40px;width:22px"></div><div style="float:right;clear:right;height:40px;width:0px"></div>';
			shape +=  '<div style="float:left;clear:left;height:40px;width:70px"></div><div style="float:right;clear:right;height:40px;width:0px"></div>';
			shape += '<div style="float:left;clear:left;height:40px;width:93px"></div><div style="float:right;clear:right;height:40px;width:0px"></div>';
			shape += '<div style="float:left;clear:left;height:40px;width:112px"></div><div style="float:right;clear:right;height:40px;width:0px"></div>';
			shape += '<div style="float:left;clear:left;height:40px;width:127px"></div><div style="float:right;clear:right;height:40px;width:0px"></div>';
			shape += '<div style="float:left;clear:left;height:40px;width:141px"></div><div style="float:right;clear:right;height:40px;width:0px"></div>';
			shape += '<div style="float:left;clear:left;height:40px;width:148px"></div><div style="float:right;clear:right;height:40px;width:0px"></div>';
			shape += '<div style="float:left;clear:left;height:40px;width:161px"></div><div style="float:right;clear:right;height:40px;width:0px"></div>';
			shape += '<div style="float:left;clear:left;height:40px;width:163px"></div><div style="float:right;clear:right;height:40px;width:0px"></div>';
			shape += '<div style="float:left;clear:left;height:40px;width:160px"></div><div style="float:right;clear:right;height:40px;width:0px"></div>';
			shape += '<div style="float:left;clear:left;height:40px;width:158px"></div><div style="float:right;clear:right;height:40px;width:0px"></div>';
			shape += '<div style="float:left;clear:left;height:40px;width:152px"></div><div style="float:right;clear:right;height:40px;width:0px"></div>';
			shape += '<div style="float:left;clear:left;height:40px;width:133px"></div><div style="float:right;clear:right;height:40px;width:0px"></div>';
			shape += '<div style="float:left;clear:left;height:40px;width:128px"></div><div style="float:right;clear:right;height:40px;width:0px"></div>';
			shape += '<div style="float:left;clear:left;height:40px;width:109px"></div><div style="float:right;clear:right;height:40px;width: 0px"></div>';
			shape += '<div style="float:left;clear:left;height:40px;width: 126px"></div><div style="float:right;clear:right;height:40px;width: 0px"></div><div style="float:left;clear:left;height:40px;width:0px"></div>';
			shape += '<div style="float:right;clear:right;height:40px;width:0px"></div><div style="float:left;clear:left;height:40px;width:undefinedpx"></div>';
			shape += '<div style="float:right;clear:right;height:40px;width:undefinedpx"></div>';
			$("#global-container").prepend(shape);
		
	}
	
});

function setNewsContent(item, type)
{
	var htmlString = "";
	
	switch(type)
	{
		case "video":
			htmlString = '<video id="example_video_1" class="video-js" width="630" height="355" controls="controls" preload="auto" poster="' + item.video.posterImage + '">';
			$.each(item.video.videos, function(i,videos)
			{
				htmlString += '<source src="' + videos.filename + '" type=\'' + videos.type  +'\' />';
			});
			
			htmlString += '<object id="flash_fallback_1" class="vjs-flash-fallback" width="630" height="355" type="application/x-shockwave-flash" data="http://www.mgd.com/video-js/flowplayer-3.2.7.swf">';
			htmlString += '<param name="movie" value="http://www.mgd.com/video-js/flowplayer-3.2.7.swf" />';
			htmlString += '<param name="allowfullscreen" value="true" />';
			htmlString += '<param name="wmode" value="transparent">';
			htmlString += '<param name="flashvars" value=\'config={"playlist":["' + item.video.posterImage + '", {"url": "' + item.video.flash + '","autoPlay":false,"autoBuffering":true}]}\' />';
			htmlString += '<img src="' + item.video.posterImage + '" width="630" height="355" alt="Poster Image" title="No video playback capabilities." /></object></video>';
		break;
		
		case "html":
			htmlString = item.html;
		break;
		
		case "image":
			htmlString = "<img class='content-image' src='" + item.image.image + "' alt='" + item.image.alt +"'/>"
			
			if(!Object.isEmpty(item.image.caption))
			{
				htmlString += "<p class='image-caption'>" + item.image.caption + "</p>"
			}
		break;
	}
	
	$("#news-content").html("<div class='news-content-item'>" + htmlString + "</div>");
}

function addNewsNavigation()
{
	isDesktop = $('#is-desktop').is(':visible');
	if(isDesktop)
	{
		$.getJSON('/js/news.json', function(data) 
		{
			var htmlString = "";
			newsData = data;
			$.each(data.news, function(i,news) 
			{
				htmlString += "<li><a href='news/" + news.title + "'><img src='" + news.thumbnail + "' width='199' height='111' /></a></li>"
			});

			$("#news-items").html("<ul id='news-list'>" + htmlString + "</ul>");

			$("#news-items").jCarouselLite({
			        btnNext: "#news-down",
			        btnPrev: "#news-up",
					vertical: true,
					circular: false
			});


			var news = newsData.news[0];


			if(!Object.isEmpty(news.video))
			{
				setNewsContent(news, "video");					
			}
			else if(!Object.isEmpty(news.html))
			{
				setNewsContent(news, "html");
			}
			else if(!Object.isEmpty(news.image))
			{
				setNewsContent(news, "image");
			}

		});


		$("#news-list > li > a").live("click",function(e){
			e.preventDefault();
			var href = $(this).attr("href");
			var item = href.split("/");
			var title = item[item.length - 1];
			
			$.each(newsData.news, function(i,news) 
			{
				if(news.title == title)
				{
					if(!Object.isEmpty(news.video))
					{
						setNewsContent(news, "video");					
					}
					else if(!Object.isEmpty(news.html))
					{
						setNewsContent(news, "html");
					}
					else if(!Object.isEmpty(news.image))
					{
						setNewsContent(news, "image");
					}
				}
			});


		});

		$("#news-list > li > a > img").live("mouseover", function(){
			$(this).addClass("news-hover");
		});

		$("#news-list > li > a > img").live("mouseout", function(){
			$(this).removeClass("news-hover");
		});
	}
		
	
}