var HoverImages = [];

HoverImages["illustration"] = CreateImageObject("/img/illustration.jpg", "303", "83", "");
HoverImages["design"] = CreateImageObject("/img/design.jpg", "173", "93", "");
HoverImages["art"] = CreateImageObject("/img/art.jpg", "124", "85", "");
HoverImages["animation"] = CreateImageObject("/img/animation.jpg", "268", "113", "");
HoverImages["about"] = CreateImageObject("/img/about.jpg", "166", "105", "");
HoverImages["trips"] = CreateImageObject("/img/trips.jpg", "129", "77", "");


function SetImageVisibility(isVisible, sectionName)
{
	if (isVisible)
	{
		HoverImages[sectionName].setAttribute("class", "hoverImage hoverImageVisible " + sectionName + "HoverImage");
		HoverImages[sectionName].setAttribute("className", "hoverImage hoverImageVisible " + sectionName + "HoverImage");
	}
	else
	{
		HoverImages[sectionName].setAttribute("class", "hoverImage hoverImageHidden " + sectionName + "HoverImage");
		HoverImages[sectionName].setAttribute("className", "hoverImage hoverImageHidden " + sectionName + "HoverImage");
	}
}

window.onload = function()
{
	var mainOuterDivObject = document.getElementById("mainOuter");
	
	if (mainOuterDivObject != undefined)
	{
		for (var hoverImageName in HoverImages)
		{
			SetImageVisibility(false, hoverImageName);
			mainOuterDivObject.appendChild(HoverImages[hoverImageName]);
			
			var mapAreaObject = document.getElementById(hoverImageName + "Area");
	
			if (mapAreaObject != undefined)
			{
				mapAreaObject.onmouseover = new Function("SetImageVisibility(true, '" + hoverImageName + "');");
				mapAreaObject.onmouseout = new Function("SetImageVisibility(false, '" + hoverImageName + "');");

				//mapAreaObject.setAttribute(
				//	"onmouseover",
				//	"SetImageVisibility(true, '" + hoverImageName + "');"
				//);

				//mapAreaObject.setAttribute(
				//	"onmouseout",
				//	"SetImageVisibility(false, '" + hoverImageName + "');"
				//);
			}
		}
	}
}

function CreateImageObject(src, width, height, alt)
{
	var imgElement = document.createElement("img");
	
	imgElement.setAttribute("src", src);
	if (width != undefined)
		imgElement.setAttribute("width", width);
	if (height != undefined)
		imgElement.setAttribute("height", height);
	if (alt != undefined)
		imgElement.setAttribute("alt", alt);
	
	return imgElement;
}