//set up the array for testing gallery
currentIndex=0
numberOfThumbs=0
largeImageSizeWidth=290
largeImageSizeHeight=290
smallImageSizeWidth=58
smallImageSizeHeight=58
speed=2
scrCurrentpos=0
scrStoppos=0;
scrStopposset=false
//this lines up the pictures in a row of 5 based on a starting number
function initialise(startingPoint)
{

for(i=0;i<numberOfThumbs;i++)
{
document.getElementById("thumbs").innerHTML+="<div class='thumb'><img src='"+gallery[i+startingPoint]+"' id='"+(i+startingPoint)+"'></div>"
}

images=document.getElementById("thumbs").getElementsByTagName("IMG");
document.getElementById("thumbs").style.width=(numberOfThumbs*smallImageSizeWidth)+"px";
//now set the size of each one using the constrain function
	for(i=0;i<images.length;i++)
		{
		//constrainSize(images[i],smallImageSizeWidth,smallImageSizeHeight)
		//now add onclick function to each image
		images[i].onclick=function()
		{
		document.getElementById("largeImage").innerHTML="<img src='"+this.src+"' id='largePic'>"
		constrainSize(document.getElementById("largePic"),largeImageSizeWidth,largeImageSizeHeight)
		currentopacity=0
		counter=0
		fade(document.getElementById("largeImage").firstChild)
		//set the text for year and title
		document.getElementById("titleText").innerHTML=titles[this.id]
		document.getElementById("yearText").innerHTML=years[this.id]
		}
		}
		}

function scrollright()
{
if((scrCurrentpos+(numberOfThumbs*smallImageSizeWidth))>(document.getElementById("thumbholder").offsetWidth))
{
if(scrStopposset==false)
{
scrStoppos=scrCurrentpos-smallImageSizeWidth;
scrStopposset=true
}
if(scrStoppos<scrCurrentpos)
{
scrCurrentpos-=speed
document.getElementById("thumbs").style.left=scrCurrentpos+"px";
setTimeout('scrollright()',0.2)
}
else{
scrStopposset=false
}
}
else{
			scrStopposset=false
		}
}
//------ ------ --------- ------ --------
function scrollleft()
{
	if(scrCurrentpos<0){
		if(scrStopposset==false){
			scrStoppos=scrCurrentpos+smallImageSizeWidth;
			scrStopposset=true
		}
		if(scrStoppos>scrCurrentpos){
			scrCurrentpos+=speed
			document.getElementById("thumbs").style.left=scrCurrentpos+"px";
			setTimeout('scrollleft()',0.2)
		}
		else{
			scrStopposset=false
		}
	}
	else{
			scrStopposset=false
		}
}
//resize to within the given pixel size
function constrainSize(image,theWidth,theHeight)
{
image.onload=function()
{
//first get the original w/h
				thisWidth=image.scrollWidth
				thisHeight=image.scrollHeight
				//then check if the image is bigger than the allowed size
				if((thisWidth>theWidth)||(thisHeight>theHeight))
				{
				//check if it is landscape
					if(thisWidth>thisHeight)
					{
					image.style.Height=theHeight+"px"
					image.style.width=thisWidth/(thisHeight/theHeight)+"px"
					}
					else if(thisHeight>thisWidth)
					{
					image.style.width=theWidth+"px"
					image.style.height=thisHeight/(thisWidth/theWidth)+"px"
					}
					else
					{
					image.style.width=theWidth+"px"
					image.style.Height=theHeight+"px"
					}
				}
				//center the image
				image.style.top=(theHeight-image.scrollHeight)/2+"px"
				image.style.left=(theWidth-image.scrollWidth)/2+"px"
				
}
}
window.onload=function(){
startList()
initialise(currentIndex)
	//load up the big image to be the first image
	//set the text for year and title
	
	document.getElementById("largeImage").innerHTML="<img src='"+gallery[0]+"' id='largePic'>"
		constrainSize(document.getElementById("largePic"),largeImageSizeWidth,largeImageSizeHeight)
		currentopacity=0
		counter=0
		fade(document.getElementById("largeImage").firstChild)
	
	//check if we need the scroll buttons
	//compare the width of the thumbs to the width of the thumbholder
	if((numberOfThumbs*smallImageSizeWidth)>document.getElementById("thumbholder").offsetWidth)
	{
	document.getElementById("next").onclick=function()
	{
	scrollStop=false;
	scrollright();
	}
	}
	else{
	document.getElementById("previous").style.display="none";
	document.getElementById("next").style.display="none";
	}
	document.getElementById("previous").onclick=function()
	{
	scrollStop=false;
	scrollleft();
	}
	document.getElementById("titleText").innerHTML=titles[0];
	document.getElementById("yearText").innerHTML=years[0];
}
var fadeStop
var currentopacity
var counter
var currentpos
var counterpos
function fade(div)
	{
		if (counter>=100)
			{
				div.style.opacity=1;
				div.style.filter='alpha(opacity=100)';
				return
			}
		counter+=2
		currentopacity=counter
		div.style.opacity=currentopacity/100;
		div.style.filter='alpha(opacity=' + currentopacity + ')';
		div2=div
		setTimeout('fade(div2)',0.2)
}	
function move(amount)
	{
		if ((counterpos<=-smallImageSizeWidth)||(counterpos>=smallImageSizeWidth))
			{
			//setTimeout('initialise(currentIndex)',0.2)
				initialise(currentIndex)
				return
			}
		counterpos+=amount
		currentpos=counterpos
		for(tums=1;tums<numberOfThumbs+1;tums++)
			{
			document.getElementById("thumb"+tums).style.left=currentpos+"px";
			}
		amount2=amount
		setTimeout('move(amount2)',0.2)
}
startList = function() {

// function to enable dropdown on older browsers
if (document.all&&document.getElementById) {

navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
  }
  node.onmouseout=function() {
  this.className=this.className.replace(" over", "");
   }
   }
  }
 }
 
}