/* +-------------------------------------------------------------------------+
   | These functions are only useful for popups with several numbered layers |
   | (e.g. context.htm)                                                      |
   +-------------------------------------------------------------------------+ */

/*GLOBAL VARIABLES*/

/* This global variable is used in the toggleLayer() function below */
var currLayer = 1;

/* Images are preloaded into each popup by storing them in arrays.
   These special "on/off" arrays are used with the imageOn() and imageOff() functions below
*/
if (document.images)
{	/* creates "on" array and populates with Image objects */
	var onImgArray = new Array();

	onImgArray["num1"] = new Image(15,39);
	onImgArray["num2"] = new Image(15,39);
	onImgArray["num3"] = new Image(15,39);
	onImgArray["pic"] = new Image(524,598);
	/* sets URLs for the "on" images */
	onImgArray["num1"].src = "../Images/1_on.gif";
	onImgArray["num2"].src = "../Images/2_on.gif";
	onImgArray["num3"].src = "../Images/3_on.gif";
	onImgArray["pic"].src = "Images/chloe_map2.jpg";

	/* creates "off" array and populates with Image objects */
	var offImgArray = new Array();

	offImgArray["num1"] = new Image(15,39);
	offImgArray["num2"] = new Image(15,39);
	offImgArray["num3"] = new Image(15,39);
	offImgArray["pic"] = new Image(524,598);
	/* sets URLs for the "off" images */
	offImgArray["num1"].src = "../Images/1_off.gif";
	offImgArray["num2"].src = "../Images/2_off.gif";
	offImgArray["num3"].src = "../Images/3_off.gif";
	offImgArray["pic"].src = "Images/lewis_map2.jpg";
}

/*FUNCTIONS*/

/* These functions are only used in within this document.
   They simplify the process of swapping images. 
*/

function imageOn(imgName)
{
	if (document.images)
		document.images[imgName].src = onImgArray[imgName].src;
}

function imageOff(imgName)
{
	if (document.images)
		document.images[imgName].src = offImgArray[imgName].src;
}

function toggleLayer(numLayer)
{
	/* There are possibly four visual elements per layer that indicate the current layer:
	 	the numbered link,
		the written link,
		the [text] layer itself, and
		the written link's bullet.
	   This function "initializes" all of these elements when they exist,
	   and then sets them according to the currentLayer.
	*/

	/* "Initializes" all of the elements when they exist */
	if ( document.getElementById("pic") ) imageOff("pic");

	if ( document.getElementById("num1") )
	{
		imageOff("num1");
		if ( document.getElementById("link1") ) document.getElementById("link1").style.color = "#828282";
		if ( document.getElementById("layer1") ) document.getElementById("layer1").style.visibility = "hidden";
		if ( document.getElementById("dot1") ) imageOff("dot1");
	}

	if ( document.getElementById("num2") )
	{
		imageOff("num2");
		if ( document.getElementById("link2") ) document.getElementById("link2").style.color = "#828282";
		if ( document.getElementById("layer2") ) document.getElementById("layer2").style.visibility = "hidden";
		if ( document.getElementById("dot2") ) imageOff("dot2");
	}

	if ( document.getElementById("num3") )
	{
		imageOff("num3");
		if ( document.getElementById("link3") ) document.getElementById("link3").style.color = "#828282";
		if ( document.getElementById("layer3") ) document.getElementById("layer3").style.visibility = "hidden";
		if ( document.getElementById("dot3") ) imageOff("dot3");
	}

	if ( document.getElementById("num4") )
	{
		imageOff("num4");
		if ( document.getElementById("link4") ) document.getElementById("link4").style.color = "#828282";
		if ( document.getElementById("layer4") ) document.getElementById("layer4").style.visibility = "hidden";
		if ( document.getElementById("dot4") ) imageOff("dot4");
	}

	/* Sets them according to the currentLayer */
	currLayer = numLayer;

	switch(currLayer)
	{
		case 1:
			if ( document.getElementById("layer1") ) document.getElementById("layer1").style.visibility = "visible";
			if ( document.getElementById("link1") ) document.getElementById("link1").style.color = "black";
			if ( document.getElementById("num1") ) imageOn("num1");
			if ( document.getElementById("dot1") ) imageOn("dot1");
			if ( document.getElementById("pic") ) imageOn("pic");
			break;
		case 2:
			if ( document.getElementById("layer2") ) document.getElementById("layer2").style.visibility = "visible";
			if ( document.getElementById("link2") ) document.getElementById("link2").style.color = "black";
			if ( document.getElementById("num2") ) imageOn("num2");
			if ( document.getElementById("dot2") ) imageOn("dot2");
			if ( document.getElementById("pic") ) imageOff("pic");
			break;
		case 3:
			if ( document.getElementById("layer3") ) document.getElementById("layer3").style.visibility = "visible";
			if ( document.getElementById("link3") ) document.getElementById("link3").style.color = "black";
			if ( document.getElementById("num3") ) imageOn("num3");
			if ( document.getElementById("dot3") ) imageOn("dot3");
			break;
		case 4:
			if ( document.getElementById("layer4") ) document.getElementById("layer4").style.visibility = "visible";
			if ( document.getElementById("link4") ) document.getElementById("link4").style.color = "black";
			if ( document.getElementById("num4") ) imageOn("num4");
			if ( document.getElementById("dot4") ) imageOn("dot4");
			break;
	}
}

/* These next two functions work in tandem.  By placing them in the
   onmouseover and onmouseout event handlers of the written links (on
   the side menu), they swap bullet images.
*/

function turnOn(numImg)
{
	switch(numImg)
	{
		case 1:
			if (currLayer == 1)
				imageOff("dot1");
			else
				imageOn("dot1");
			break;
		case 2:
			if (currLayer == 2)
				imageOff("dot2");
			else
				imageOn("dot2");
			break;
		case 3:
			if (currLayer == 3)
				imageOff("dot3");
			else
				imageOn("dot3");
			break;
		case 4:
			if (currLayer == 4)
				imageOff("dot4");
			else
				imageOn("dot4");
			break;
	}	
}

function turnOff(numImg)
{
	switch(numImg)
	{
		case 1:

			if (currLayer == 1)
				imageOn("dot1");
			else
				imageOff("dot1");
			break;
		case 2:
			if (currLayer == 2)
				imageOn("dot2");
			else
				imageOff("dot2");
			break;
		case 3:
			if (currLayer == 3)
				imageOn("dot3");
			else
				imageOff("dot3");
			break;
		case 4:
			if (currLayer == 4)
				imageOn("dot4");
			else
				imageOff("dot4");
			break;
	}	
}