// script to swap images for main navigation menu

// here 'mouseover' refers to the event of the mouse hovering over the link and 'mouseout' refers to the event of the mouse leaving the link



//----------------------------------------------------------

arrImages = new Array(); //create array to store all document images

function createImagesArray()
{

	for (i=0; i<document.images.length; i++)
	{
		if ((document.images[i].onmouseover != null) && (document.images[i].onmouseout != null)) //if mouseover and mouseout events are defined
		{
			arrSrc = document.images[i].src.split("/"); // the image path is split into components based on "/" and put into array 
			filename = arrSrc[(arrSrc.length-1)]; // last component (eg xxx.gif)  is put into filename
			arrImages[document.images[i].name] = new Array(); //new array with image name as key
			arrImages[document.images[i].name][0] = filename; //key [0] of that array is set to filename
		}
			
	}
}

//function to swap 'mouseout' image for 'mouseover' image of same name
// change directory structure below as needed when changing location of mouseover folder

function swapImage(obj)
{
	
	obj.src = "image/mouseover/" + arrImages[obj.name][0];	 //swaps the currently mouseout image for the mouseover (hightlighted) version

	/* --- For swapping image to left of moused over image to its mouseover state --- */
	var getName = obj.name; //gets name of currently moused over image

	var intGetName = parseInt(obj.name); //changes this name to an integer so it can be operated on

	var itemToLeft = intGetName - 1; //subtracts 1 from the "image name" number - this will represent the name of the image to the left of the current moused over image

	var strItemToLeft = itemToLeft + ""; //converts number back to a string

	var leftFilename = "image/mouseover/" + getName + "Left.gif"; //makes new image source string for the left image

	var images = document.getElementsByTagName('img'); // retrieves all image objects in page (an array)
	
	for (var i=0; i<images.length; i++) // loops through the image array
	{
		if (images[i].name == strItemToLeft) // if one of the image name matches the image to the left
		{
			images[i].src = leftFilename;	//then it will replace the src to the string in 'leftFilename' variable above - in this case changing the original mouseout image to mouseover2 image (the '2' is appended on the filenames)
		}
	}
}


//function to swap 'mouseover' image for 'mouseout' image of same name
// change directory structure below as needed when changing location of mouseout folder


function restoreImage(obj)
{
	obj.src = "image/mouseout/" + arrImages[obj.name][0]; //swaps the currently hightlighted image for the mouseout version

	/* --- For restoring image to left of moused over image to its mouseout state --- */
	var getName = obj.name;  //gets name of currently moused over image

	var intGetName = parseInt(obj.name); //changes this name to an integer so it can be operated on

	var itemToLeft = intGetName - 1; //subtracts 1 from the "image name" number - this will represent the name of the image to the left of the current moused over image

	var strItemToLeft = itemToLeft + "";  //converts number back to a string

	var leftFilename = "image/mouseout/" + strItemToLeft + ".gif"; //makes new image source string for the left image

	var images = document.getElementsByTagName('img'); // retrieves all image objects in page (an array)
	
	for (var i=0; i<images.length; i++) // loops through the image array
	{
		if (images[i].name == strItemToLeft) // if one of the image name matches the image to the left 
		{
			images[i].src = leftFilename; //then it will replace the src to the string in 'leftFilename' variable above - in this case restoring the original mouseout image
		}
	}
}