var nextImageIndex = 1;
var previousImageIndex = 0;
var id = 1;
var specialPath;
var interval;
$("#b0").addClass("active");
var paddingTop = 0.5 * (432 - $("#MiniNav").height());
$("#MiniNav").css("margin-bottom", paddingTop);
$("#MiniNav").css("margin-top", paddingTop);
$("#MiniNav").css("margin-left", 948);
fixVisible(0);
startInterval();




function fixVisible(id)
{
	var vid = "";
	var url = window.location.href;
	arrUrl = url.split("?");
	if(arrUrl.length > 1)
	{
		vid = arrUrl[1].split("=")[1];
	}
	if(vid == "")
	{
		if(articles[id].indexOf('.mp4') != -1)
		{
			generateVideoForIosOrImage(articles[id]);
		}
		else
		{
			var link = interpretLink(id);
			$(".Visible").html(link + "<img style=\"height:432px;\" src=\"" +  articles[id] + "\"></a>");
		}
	}
	else
	{
		generateVideoForIosOrImage("images/videos/" + vid + ".mp4");
	}
}
function generateVideoForIosOrImage(str)
{
	if (navigator.userAgent.match(/like Mac OS X/i))
	{
		generateVideoForIos(str);
	}
	else
	{
		var newHTML = "<a onclick=\"swapVideo('" + str + "')\"><img id=\"PLAYBUTTON\" src=\"images/play-button.png\"><img class=\"VIDEOIMAGE\"style=\"height:432px;\" src=\"" +  str.replace(".mp4", ".png") + "\"></a>";
		$(".Visible").html(newHTML);
	}
}
function generateVideoForIos(str)
{
	var newHTML = '';
	newHTML += '<video id="VisibleVideo" controls height="432" width="768" poster="/' + str.replace(".mp4", ".png") + '">';
	newHTML += '<source src="/' + str + '" type="video/mp4"></source>';
	newHTML += '</video>';
	$(".Visible").html(newHTML);
	addVideoListener();
}
function flashVideoStarted()
{
	clearInterval(interval);
}
function addVideoListener()
{
	vid = document.getElementById("VisibleVideo");
	vid.addEventListener('play', flashVideoStarted, false);
}
function swapVideo(str)
{
	clearInterval(interval);
	var newHTML = '';
	newHTML += '<object id="FlashVisible" width="768" height="432" allowFullscreen="true" type="application/x-shockwave-flash" data="/images/VideoPlayer.swf">';
	newHTML += '<param name="allowFullScreen" value="true" />';
	newHTML += '<param name="movie" value="/images/VideoPlayer.swf" />';
	newHTML += '<param name="wmode" value="opaque" />';
	newHTML += '<param name="flashvars" value="fStr=/' + str + '" />';
	newHTML += '</object>';
	document.getElementById("Visible").innerHTML = newHTML;	
}
function mfspShowVideo(str)
{
	clearInterval(interval);
	if (navigator.userAgent.match(/like Mac OS X/i))
	{
		generateVideoForIos(str);
	}
	else
	{
		swapVideo(str);
	}
}



function startInterval()
{
	if(articles.length > 1)
	{
		interval = setInterval(onInterval, TransitionTime);
	}
}
function onInterval()
{
	switchHidden(nextImageIndex);
	//clearInterval(interval);
}
function myonclick(id)
{
	clearInterval(interval);
	if(id != previousImageIndex)
	{
		nextImageIndex = id;
		changeButtonClasses();
		switchHidden(nextImageIndex);
	}

}
function switchHidden(id)
{
	var str = articles[id];
	if(str.indexOf('.mp4') != -1)
	{
		$("#Hidden").html("<a><img onload=\"startAnimation()\" style=\"height:432px;\" src=\"" +  str.replace(".mp4", ".png") + "\"></a>");
	}
	else
	{
		var link = interpretLink(id);		
		$("#Hidden").html(link + "<img onload=\"startAnimation()\" style=\"height:432px;\" src=\"" +  articles[id] + "\"></a>");
	}
}
function interpretLink(id)
{
	if(links[id].indexOf("http") == -1)
	{
		return "<a target=\"_self\" href=\"" + links[id] +"\" >";
	}
	else
	{
		return  "<a target=\"_blank\" href=\"" + links[id] +"\" >";
	}
}
function switchVisible(id)
{
	var str = articles[id];
	if(str.indexOf('.mp4') != -1)
	{
		$("#Hidden").html("<a><img style=\"height:432px;\" src=\"" +  str.replace(".mp4", ".png") + "\"></a>");
	}
	else
	{
		var link = interpretLink(id);
		$("#Hidden").html(link + "<img style=\"height:432px;\" src=\"" +  articles[id] + "\"></a>");
	}
}
function startAnimation()
{
	$("#Hidden").height(0);
	$("#Visible").css("top", 0);
	$("#Hidden").stop(true, true);
	$("#Visible").stop(true, true);
	$("#Hidden").animate({height:432}, DurationTime);
	$("#Visible").animate({top:0}, DurationTime, onAnimationDone);
	changeButtonClasses();
}
function onAnimationDone()
{
	switchVisible(nextImageIndex); 
	fixVisible(nextImageIndex);
	previousImageIndex = nextImageIndex;
	nextImageIndex++;
	if(nextImageIndex == articles.length)
	{
		nextImageIndex = 0;
	}
	$("#Hidden").height(432);
	$("#Visible").css("top", "-432px");
}
function changeButtonClasses()
{
	$("#b" + (previousImageIndex)).removeClass("active");
	$("#b" + nextImageIndex).removeClass("hover");
	$("#b" + nextImageIndex).addClass("active");
}




$(".MFBUTTON").hover
(
	function()
	{
		id = this.id[1];
		if(id != previousImageIndex || specialPath != "")
		{
			$(this).addClass("hover");
		}
	}
	,
	function()
	{
		id = this.id[1];
		if(id != previousImageIndex  || specialPath != "")
		{
			$(this).removeClass("hover");
		}
	}
);
function log(str)
{
	if(ip == "76.9.195.18")
	{
		console.log(str);
	}
}