var filenames = new Array();		// 2D array; stores the names of the files associated with the slideshow
var eventIndex = new Array();		// each element stores an integer state value: zero for inactive, one for hover, two for clicked
var slides = new Array();			// collection of references returned from document.createElement calls
var firstIcon = 1;					// stores the index of slideshowLinks at which the links become visible
var iconDisplay = 3;				// max. number of slideshow icons displayed at any one time
var iconOffset = 0;					// stores the active state icon vertical background position, in pixels
var slideFades = new Array();		// contains interval references
var fadeStates = new Array();		// contains interval states
var slideIds = new Array();			// autogenerated; references the id's of individual slides
var wipeIncrement = .1;				// stores the magnitude used to specify opacity

function slideWipe(target,progress)
{

	var opacityValue = (fadeStates[target] * wipeIncrement);
	var node = document.getElementById((slideIds[target - 1]));
	node.style.opacity = node.style.MozOpacity = node.style.KhtmlOpacity = opacityValue.toString();
	node.style.filter = "alpha(opacity=" + Math.round(opacityValue * 100) + ")";

// provide support for useragents that don't support any opacity properties

	if (progress > 0)
	{
		slides[(slides.length - 1)].style.zIndex = 1;
	}
	if (progress < 0)
	{
		slides[(slides.length - 1)].style.zIndex = 0;
	}
	fadeStates[target] += progress;
	if ((fadeStates[target] > 10) || (fadeStates[target] < 0))
	{
		window.clearInterval(slideFades[target]);
		fadeStates[target] -= progress;
	}
}

// executes as the event handler for all anchor members of slideshowLinks

function slideshowEffect(evt)
{
	var activeElement = 0;
	if (evt === void(0))
	{
		evt = window.event;
	}
	evt.cancelBubble = true;

// determine the link that fired the event

	var links = document.getElementById("slideshowLinks").getElementsByTagName("a");
	for (var i = 0; i < document.getElementById("slideshowLinks").getElementsByTagName("a").length; i++)
	{
		if (this == document.getElementById("slideshowLinks").getElementsByTagName("a")[i])
		{
			switch (evt.type)
			{
				case "mouseover" :
					(eventIndex[i] === 0) ? eventIndex[i] += 1 : void(0);
					break;
				case "click" :

// concerned here with the first and last members of slideshowLinks, as per what happens at the end of populateSlideshow

					if ((i === 0) || (i == (document.getElementById("slideshowLinks").getElementsByTagName("a").length - 1)))
					{
						for (var j = 1; j < (document.getElementById("slideshowLinks").getElementsByTagName("a").length - 1); j++)
						{
							if (eventIndex[j] > 1)
							{
								if ((i === 0) && (j > 1))
								{
									eventIndex[j] = 0;
									eventIndex[(j - 1)] = 2;
									document.getElementById("slideshowLinks").getElementsByTagName("a")[(j - 1)].offsetWidth === 0 ? firstIcon-- : void(0);
									break;
								}
								if ((i == (document.getElementById("slideshowLinks").getElementsByTagName("a").length - 1)) && (j < (document.getElementById("slideshowLinks").getElementsByTagName("a").length - 2)))
								{
									eventIndex[j] = 0;
									eventIndex[(j + 1)] = 2;
									document.getElementById("slideshowLinks").getElementsByTagName("a")[(j + 1)].offsetWidth === 0 ? firstIcon++ : void(0);
									break;
								}
							}
						}

// play musical-display-values as needed

						for (var j = 1; j < (document.getElementById("slideshowLinks").getElementsByTagName("a").length - 1); j++)
						{
							if ((j < firstIcon) || (j > ((firstIcon + iconDisplay) - 1)))
							{
								document.getElementById("slideshowLinks").getElementsByTagName("li")[j].style.display = "none";
							}
							else
							{
								document.getElementById("slideshowLinks").getElementsByTagName("li")[j].style.display = "block";
							}
						}
					}
					else
					{
						eventIndex[i] += 1;
						for (var j = 1; j < (document.getElementById("slideshowLinks").getElementsByTagName("a").length - 1); j++)
						{
							j !== i ? eventIndex[j] = 0 : void(0);
						}
					}
					break;
				case "mouseout" :
					(eventIndex[i] === 1) ? eventIndex[i] -= 1 : void(0);
				//
			}
			if ((i === 0) && (eventIndex[i] === 1))
			{
				document.getElementById("slideshowLinks").style.backgroundImage = "url(/images/bg_slideshow_retreat.gif)";
			}
			if ((i == (links.length - 1)) && (eventIndex[i] === 1))
			{
				document.getElementById("slideshowLinks").style.backgroundImage = "url(/images/bg_slideshow_advance.gif)";
			}
			if ((i === 0) || (i == (links.length - 1)))
			{
				if (eventIndex[i] === 0)
				{
					document.getElementById("slideshowLinks").style.backgroundImage = "url(/images/bg_slideshow_controls.gif)";
				}
			}
			for (var j = 1; j < (document.getElementById("slideshowLinks").getElementsByTagName("a").length - 1); j++)
			{
				if (eventIndex[j] > 0)
				{
					document.getElementById("slideshowLinks").getElementsByTagName("a")[j].style.backgroundPosition = "0 0";
				}
				else
				{
					document.getElementById("slideshowLinks").getElementsByTagName("a")[j].style.backgroundPosition = "0 16px";
				}				
				if (eventIndex[j] > 1)
				{
					links[0].style.visibility = (j == 1 ? "hidden" : "visible");
					links[links.length - 1].style.visibility = (j == (links.length - 2) ? "hidden" : "visible");
					window.clearInterval(slideFades[j]);
					slideFades[j] = window.setInterval("slideWipe(" +  j + ",1)",60);
				}
				else
				{
					if (fadeStates[j] > 0)
					{
						window.clearInterval(slideFades[j]);
						slideFades[j] = window.setInterval("slideWipe(" +  j + ",-1)",60);
					}
				}
			}
			break;
		}
	}
}

function populateSlideshow()
{
	for (var i = 0; i < (document.getElementById("slideshowLinks").getElementsByTagName("li").length + 2); i++)
	{
		slideFades[slideFades.length] = void(0);
		fadeStates[fadeStates.length] = 0;
	}

	document.getElementById("slideshowLinks").style.backgroundImage = "url(/images/bg_slideshow_controls.gif)";
	var filenameFragments = new Array("icon_","icon_active_","inset_");
	slideIds[0] = "slide0";

	if (document.getElementById("slideshowLinks").getElementsByTagName("li").length < 2)
	{
		document.getElementById("slideshowLinks").style.display = "none";
		return false;
	}

	for (var j = 0; j < filenameFragments.length; j++)
	{

// the outer dimension of the array references images by type, as opposed to their association with members of slideshowLinks

		filenames[j] = new Array();
		{

// at this point we're still working with the original markup, so...

			for (var k = 0; k < document.getElementById("slideshowLinks").getElementsByTagName("li").length; k++)
			{
				eventIndex[eventIndex.length] = 0;

// start with the folder name

				filenames[j][k] = new String("/images/");

// append the relevant type identifier

				filenames[j][k] += filenameFragments[j];

// append the page ID

				filenames[j][k] += document.getElementsByTagName("body")[0].id;

// zero-fill (if necessary) and append the item cardinal

				((k + 1) < 10) ? filenames[j][k] += ("_0" + (k + 1)) : filenames[j][k] += ("_" + (k + 1));

// add the relevant filename extension

				filenames[j][k] += ".gif";

// since we only need to add these once...

				if (filenameFragments[j] == "inset_")
				{

// create the other primary slideshow images

					if (k > 0)
					{
						slides[slides.length] = document.createElement("img");
						slides[(slides.length - 1)].src = filenames[j][k];
						slides[(slides.length - 1)].id = ("slide" + k);
						slides[(slides.length - 1)].style.top = (((0 - document.getElementById("slide0").offsetHeight) * k) + "px");
						slides[(slides.length - 1)].style.opacity = slides[(slides.length - 1)].style.MozOpacity = slides[(slides.length - 1)].style.KhtmlOpacity = "0";
						slides[(slides.length - 1)].style.filter = "alpha(opacity=0)";
						slideIds[slideIds.length] = ("slide" + k);
						document.getElementById("slideshow").appendChild(slides[(slides.length - 1)]);
					}
				}
			}
		}
	}

// create the links that advance and reverse the range of displayed icons

	slides[slides.length] = document.createElement("a");
	slides[(slides.length - 1)].href = "javascript:void(0)";
	slides[slides.length] = document.createElement("li");
	slides[(slides.length - 1)].className = "controlLink";
	slides[(slides.length - 1)].appendChild(slides[(slides.length - 2)]);
	slides[slides.length] = slides[(slides.length - 1)].cloneNode(true);

// empty out slideshowLinks while taking care to clone the items from the original markup, so that the controls can be properly integrated into the rest of the links

	var slideshowLinkItems = new Array();
	while (document.getElementById("slideshowLinks").getElementsByTagName("li").length > 0)
	{
		slideshowLinkItems[slideshowLinkItems.length] = document.getElementById("slideshowLinks").getElementsByTagName("li")[0].cloneNode(true);
		document.getElementById("slideshowLinks").removeChild(document.getElementById("slideshowLinks").getElementsByTagName("li")[0]);
	}
// add the first of the control links (retreat)

	document.getElementById("slideshowLinks").appendChild(slides[(slides.length - 2)]);

// populate with the items from the source markup

	for (var j = 0; j < slideshowLinkItems.length; j++)
	{
		document.getElementById("slideshowLinks").appendChild(slideshowLinkItems[j]);
	}

// add the second of the control links (advance), first ensuring that it appears in the right spot

	if ((document.getElementById("slideshowLinks").getElementsByTagName("li").length - 1) < iconDisplay)
	{
		var x = (document.getElementById("slideshowLinks").getElementsByTagName("li")[2].offsetLeft - document.getElementById("slideshowLinks").getElementsByTagName("li")[1].offsetLeft);
		slides[(slides.length - 1)].style.position = "relative";
		slides[(slides.length - 1)].style.left = (((iconDisplay - (document.getElementById("slideshowLinks").getElementsByTagName("li").length - 1)) * x) + "px");
	}
	document.getElementById("slideshowLinks").appendChild(slides[(slides.length - 1)]);
	iconOffset = (0 - document.getElementById("slideshowLinks").getElementsByTagName("a")[1].offsetHeight);

// assign event handlers to slideshowLinks and set the first slide link to an active state in the context of the code

	for (var j = 0; j < document.getElementById("slideshowLinks").getElementsByTagName("a").length; j++)
	{					
		document.getElementById("slideshowLinks").getElementsByTagName("a")[j].href = "javascript:void(0)";
		document.getElementById("slideshowLinks").getElementsByTagName("a")[j].onmouseover = slideshowEffect;
		document.getElementById("slideshowLinks").getElementsByTagName("a")[j].onmouseout = slideshowEffect;
		document.getElementById("slideshowLinks").getElementsByTagName("a")[j].onclick = slideshowEffect;
		if ((j > 1) && (j < (document.getElementById("slideshowLinks").getElementsByTagName("a").length - 1)))
		{

// assign the inactive state icon images

			document.getElementById("slideshowLinks").getElementsByTagName("li")[j].style.backgroundImage = ("url(" + filenames[0][(j - 1)] + ")");

// assign and hide the active state icon images

			document.getElementById("slideshowLinks").getElementsByTagName("a")[j].style.backgroundImage = ("url(" + filenames[1][(j - 1)] + ")");
			document.getElementById("slideshowLinks").getElementsByTagName("a")[j].style.backgroundPosition = ("0 " + (iconOffset + "px"));

// hide the overflow items

			j > iconDisplay ? document.getElementById("slideshowLinks").getElementsByTagName("li")[j].style.display = "none" : void(0);
		}
	}
	document.getElementById("slideshowLinks").getElementsByTagName("li")[1].style.backgroundImage = ("url(" + filenames[0][0] + ")");
	document.getElementById("slideshowLinks").getElementsByTagName("a")[1].style.backgroundImage = ("url(" + filenames[1][0] + ")");
	eventIndex[1] = 2;
	slideFades[1] = window.setInterval("slideWipe(1,1)",60);
	fadeStates[1] = 10;
}

