/*
		Main menu
*/
function openMenu(id, offset)
{
	if (!id)
	{
		id = "divPop";
		offset = 0;
	}
	var divPop = document.getElementById(id);
	divPop.style.display = "block";
	divPop.style.marginTop = "-" + ($("#" + id).height() - offset) + "px";
}

function closeMenu(id)
{
	if (!id)
	{
		id = "divPop";
	}
	var divPop = document.getElementById(id);
	divPop.style.display = "none";
}


/* Home page gallery */
var imageIndex = 0, placeholderIndex = 0;
var imgPlaceholder = new Array();
var animationStarted = false; //"/media/dunbar_homeImage.image/";
var imagePrefix = "/cms/controller/services/Thumbnail.ashx?width=691&height=428&fileName=/media/dunbar_homeImage.image/";
function imageLoaded ()
{
	loadedImageIndex++;
	var doneLoading = loadedImageIndex == images.length;
	setLoadingText(doneLoading);
	if (doneLoading && !animationStarted)
	{
		fadeNext();
	}
}
var loadedImageIndex = 0;
function setLoadingText(hide)
{
	var lblLoading = document.getElementById("lblLoading");
	if (hide)
	{
		lblLoading.style.display = "none";
	}
	else
	{
		var loadingText = "Loading image [I] of [N]...";
		lblLoading.innerHTML = loadingText.replace("[I]", loadedImageIndex).replace("[N]", images.length);
	} 
}
function preLoadImages()
{
	setLoadingText();
	imgPlaceholder[0] = document.getElementById("imgHomeMiddle");
	imgPlaceholder[1] = document.getElementById("imgHomeMiddle");
	imgPlaceholder[2] = document.getElementById("imgHomeLeft");
	imgPlaceholder[3] = document.getElementById("imgHomeRight");
	for (var i = 0; i < imgPlaceholder.length; i++)
	{
		$(imgPlaceholder[i]).fadeOut(0);
	}
	for (var i = 0; i < images.length; i++)
	{
		var img = new Image();
		img.onload = null;
		img.onload = imageLoaded;
		img.src = imagePrefix + images[i];
	}
	setTimeout("forceStart()", 3000);
}
function forceStart()
{
	if (!animationStarted)
	{
		fadeNext();
		setLoadingText(true);
	}
}
function fadeNext()
{
	animationStarted = true;
	//document.getElementById("err").innerHTML = "placeholderIndex: " + placeholderIndex + ", imageindex: " + imageIndex; //DEBUG
	var img = new Image();
	img.src = imagePrefix + images[imageIndex];
	imgPlaceholder[placeholderIndex].src = img.src;
	$(imgPlaceholder[placeholderIndex]).fadeIn(2000);

	var nextFadeIn, nextFadeOut;
	if (placeholderIndex == 0) //wide
	{
		nextFadeIn = 5500;
		nextFadeOut = 3000;
	}
	else if (placeholderIndex == 1)
	{
		nextFadeIn = 6000;
		nextFadeOut = 3000;
	}
	else if (placeholderIndex == 2) //narrow
	{
		nextFadeIn = 1500;
		nextFadeOut = 2500;
	}
	else if (placeholderIndex == 3) //narrow
	{
		nextFadeIn = 4500;
		nextFadeOut = 2000;
	}

	setTimeout("fadeNext()", nextFadeIn);
	setTimeout("$(imgPlaceholder[" + placeholderIndex + "]).fadeOut(2000);", nextFadeOut);

	
	if (++placeholderIndex >= imgPlaceholder.length)
	{
		placeholderIndex = 0;
	}
	if (++imageIndex >= images.length)
	{
		imageIndex = 0;
	}
}

/* Collections menu */
function openCollection()
{
	openMenu("divCollPop", 50);
}
function closeCollection()
{
	closeMenu("divCollPop");
}

/* Portfolio */
var MAX_PER_PAGE = 3;
var imageList, pageCount;
var currentPage = 0;
function go2Pg(pageIndex)
{
	if (pageIndex < 0)
	{
		pageIndex = 0;
	}
	else if (pageIndex >= pageCount)
	{
		pageIndex = pageCount - 1;
	}
	currentPage = pageIndex;
	for (var i = 0; i < imageList.length; i++)
	{
		var displayStr = "none";
		if ((i >= (pageIndex * MAX_PER_PAGE)) && (i < ((pageIndex + 1) * MAX_PER_PAGE)))
		{
			displayStr = "block";
		}
		imageList[i].style.display = displayStr;
	}

	var firstPicIndex = pageIndex * MAX_PER_PAGE + 1; //+1 for headerTemplate. itemTemplate starts at 1, not 0
	if (firstPicIndex < 10)
	{
		firstPicIndex = "0" + firstPicIndex.toString();
	}
	var firstPic = document.getElementById("ctl00_MainPlaceHolder_lstdunbar_portfolio_ctl" + firstPicIndex + "_ctlpicture")
	switchPhoto(firstPic);
}

function switchPhoto(sender)
{
	$("#ctlphotoLarge").fadeTo("slow", 0.33, function () {
		document.getElementById("ctlphotoLarge").src = sender.src.replace("width=150", "width=450");
		$("#ctlphotoLarge").fadeTo("slow", 1);
	});
	document.getElementById("divDescription").innerHTML = document.getElementById(sender.id.replace("ctlpicture", "ctldescription")).innerHTML;
}

