///////////////////////////////////////////////////////////////////////
////
///		load and unload thumbnail and description
//
// show thumbnail and info on mouseover
function loadPreview(i)
{
	setHTML("thumbPreview", "<img id='thumbImage' src='imagery/" + imageArray[i].img._thumbFilename + "' width='50' height='50' />");
	setHTML("thumbDescription", loadDescription(i));
};
// reset thumbnail and info on mouseout
function unLoadPreview()
{
	// if no image is showing...
	if (getHTML("galleryImage") == "")
	{
		// ...then thumb=logo, info=null
		setHTML("thumbPreview", myThumbPreview_show_logo);
		setHTML("thumbDescription", "");
	}
	else
	{
		// ...then thumb=null, info=reset to current image
		setHTML("thumbPreview", "");
		setHTML("thumbDescription", loadDescription(myGalleryPic));
	};
};

// show info
function loadDescription(i)
{
	var myDescription;
	var iad = imageArray[i].desc;

	// standard image title and info
	myDescription =	"<strong>Title: </strong>" + iad._title +
					(iad._info == null ? "" : "<br /><br />" + iad._info);
	
	// if the image is specific to a part of a book...
	if (imageArray[i].series._bookNum)
	{
		// ...add book number/title and chapter number/title
		var ias = imageArray[i].series;
		myDescription +="<br /><br /><strong>Reference: </strong>" +
						"<br />Book " + ias._bookNum + ": " + bookSeries[ias._bookNum]._name +
						"<br />Chapter " + ias._chapterNum + ": " + ias._chapterTitle;
	}
	
	return myDescription;
};


///////////////////////////////////////////////////////////////////////
////
///		load and unload image
//
function loadImage(i)
{
	if (myGalleryPic != i)
	{
		myGalleryPic = i;

		var myGalleryImage;
		var ia = imageArray[i];
		myGalleryImage ="<img id='galleryPic' src='imagery/" + ia.img._filename + "' onclick='unLoadImage(); return false;'" +
						" width='" + ia.img._w + "' height='" + ia.img._h + "' />" +
						"<br /><span id='galleryImageNote'>Click the dot again or image to close</span>";

		// set the image's div's style property
		var dg = document.getElementById("galleryImage");
		// move the top-left corner of the image to the center of the page...
		dg.style["top"] = "50%";
		dg.style["left"] = "50%";
		// ...minus half the width and height of the image
		dg.style["marginLeft"] = "-" + (ia.img._w/2) + "px";
		dg.style["marginTop"] = "-" + (ia.img._h/2) + "px";

		setHTML("galleryImage", myGalleryImage);
		setHTML("thumbPreview", "");
	}
	else
	{
		myGalleryPic = null;
		unLoadImage();
	};
};

function unLoadImage()
{
	myGalleryPic = null;
	setHTML("galleryImage", "");
	setHTML("thumbPreview", myThumbPreview_show_logo);
};


///////////////////////////////////////////////////////////////////////
////
///		one-time use
//

// load thumbs (only) into the invisible div to reduce wait-time when mousing-over the dots
function preloadThumbs()
{
	var myPreloadThumbs = "";
	for (i=0; i<imageArray.length; i++)
	{
		myPreloadThumbs += "<img src='imagery/" + imageArray[i].img._thumbFilename + "'>\n";
	};
	setHTML("preloadThumbs", myPreloadThumbs);
};

// load the clickable logo when page loads
function loadLogo(){
	setHTML("thumbPreview", myThumbPreview_click_logo);
};
// show text telling visitor to view page source on mouseover
function loadInstructions(){
	setHTML("thumbList", "Click to begin.");
};
// hide text telling visitor to view page source on mouseout
function unLoadInstructions(){
	setHTML("thumbList", "");
};

// populate the dots according to year
function listThumbs(yearNum)
{
	var imageDot;
	var myThumbList = "<a href='javascript:void(0)'" +
					" onclick='setHTML(\"thumbDescription\", moreInfo); unLoadImage(); myGalleryPic = null; this.blur(); return false;'>" +
					" INFO</a>\n" +
					"<br /><br /> ";

	myThumbList += yearNum + "&nbsp;&nbsp; ";

	var i = imageArray.length;
	while(i--)
	{
		imageDot = "_t_old2.gif";

		if (imageArray[i].year == yearNum)
		{
			if(i > imageArray.length - latestImages - 1) 
			{ 
				imageDot = "_t_new2.gif";
			};
			myThumbList +=	"<a href='javascript:void(0)'" +
							" onmouseover='loadPreview(\"" + i + "\")'; return false;" +
							" onmouseout='unLoadPreview()'; return false;" +
							" onclick='loadImage(" + i + "); this.blur(); return false;'>" +
							"<img class='imageDot' src='imagery/" + imageDot + "' width='7' height='7' align='bottom' /></a>\n";
		};
	};

	setHTML("thumbList", myThumbList);
	setHTML("thumbPreview", myThumbPreview_show_logo);
};

// set the contents of a div (or any HTML element with a id="???"); universal to IE6 & NS6
function setHTML(id, content)
{
	document.getElementById(id).innerHTML = content;
};

// return the contents of a div
function getHTML(id)
{
	return (document.getElementById(id).innerHTML);
};