/*

Start in timed slideshow mode.
If user clicks any image, stop slideshow mode.


*/


//If Javascript is not available, images will not be hidden
document.write("<style type='text/css'>.largeimages div{display:none;}#thephotoholder{display:block;}.largeimages p{background:white;padding:4px;}</style>");

//Editable variables
var fadeDuration = 400;
var stillDuration = 5000;
var steps = 20;

//Do not edit
var currentImage = 0;
var imageSet;
var captionSet;
var firstCaption;
var fadeInterval = fadeDuration / steps;
var stepSize = 100 / steps;
var thephotoholderId = 'thephotoholder';
var slideshowOn = true;
var slideshowJob = null;
var maxHeight = 0;
var heighest = -1;

function initAlbum() {
	
	//Get list of images within largeimages
	var largeimages = document.getElementById('largeimages');
	if(!largeimages){
		return;
	}
	var imgs = largeimages.getElementsByTagName('img');
	if(imgs.length==1){
		return;
	}
	imageSet = new Array();
	for(i=0; i<imgs.length; i++){
		//Add onclick handler to image
		imgs[i].onclick= function (){slideshowOn=false;};
		//copy url of image
		imageSet[i]=imgs[i].src;
		
		//keep track of greatest image height
		if(imgs[i].height>maxHeight){
			maxHeight=imgs[i].height;
			heighest = i;
		}
	}
	
	var captions = largeimages.getElementsByTagName('p');
	if(captions.length<=1){
		return;
	}
	captionSet = new Array();
	for(i=0; i<captions.length; i++){
		captionSet[i]=captions[i].innerHTML;
	}
	firstCaption=captions[0];

	var divlargeimages = document.getElementById('largeimages');
	if(divlargeimages){
		divlargeimages.style.height = (maxHeight+80)+'px';
	}


	//onclick
	//Add onclick handler to arrow images
	var previousimage = document.getElementById("previousimage");
	previousimage.onclick= function (){
		//stop slideshow
		slideshowOn=false;
		//stop current fade
		window.clearTimeout(slideshowJob);
		//select new image
		currentImage--;
		if(currentImage < 0){
			currentImage = imageSet.length-1;
		}
		selectImage(currentImage);
	};
	
	var nextimage = document.getElementById("nextimage");
	nextimage.onclick= function (){
		//stop slideshow
		slideshowOn=false;
		//stop current fade
		window.clearTimeout(slideshowJob);
		//select new image
		currentImage++;
		if(currentImage >= imageSet.length){
			currentImage = 0;
		}
		selectImage(currentImage);
	};
	
	
	//Get element that will hold displayed image
	var holderElement = document.getElementById(thephotoholderId);
	setOpacity(holderElement, 0);
	holderElement.style.visibility = "visible";
	fade(thephotoholderId,0,'in');
	
}
function fade(objId,opacity,inout) {
	if (document.getElementById) {
		obj = document.getElementById(objId);

		if(inout=='in'){
			
			if (opacity <= 100) {
				//Fade in
				setOpacity(obj, opacity);
				opacity += stepSize;
				slideshowJob = window.setTimeout("fade('"+objId+"',"+opacity+",'in')", fadeInterval);
			}else{
				if(slideshowOn){
					//Show for a while, then fade out
					slideshowJob = window.setTimeout("fade('"+objId+"',"+opacity+",'out')", stillDuration);
				}
			}
		}else{
			if(slideshowOn){
				if (opacity >= 0) {
					//Fade out
					setOpacity(obj, opacity);
					opacity -= stepSize;
					slideshowJob = window.setTimeout("fade('"+objId+"',"+opacity+",'out')", fadeInterval);
				}else{
					//Set a new image, then fade in
					currentImage++;
					if(currentImage >= imageSet.length){
						currentImage = 0;
					}

					var holderElement = document.getElementById(thephotoholderId);
					var imgs = holderElement.getElementsByTagName('img');
					if(imgs.length!=1){
						return;
					}
					imgs[0].onload =function (){fade(objId,opacity,'in');};
					imgs[0].src = imageSet[currentImage];
					
					firstCaption.innerHTML=captionSet[currentImage];
				}
			}
		}
	}
}
function setOpacity(obj, opacity) {
	opacity = (opacity == 100)?99.999:opacity;
	// IE/Win
	obj.style.filter = "alpha(opacity:"+opacity+")";
	// Safari<1.2, Konqueror
	obj.style.KHTMLOpacity = opacity/100;
	// Older Mozilla and Firefox
	obj.style.MozOpacity = opacity/100;
	// Safari 1.2, newer Firefox and Mozilla, CSS3
	obj.style.opacity = opacity/100;
}
function selectImage(sel){//sel is an array index number

	if(sel == -1){
		return false;
	}else{
		
		//hide current image, swap src, fade in sel image
		var holderElement = document.getElementById(thephotoholderId);
		setOpacity(holderElement, 0);
		var imgs = holderElement.getElementsByTagName('img');
		if(imgs.length!=1){
			return;
		}
		imgs[0].onload =function (){fade(thephotoholderId,0,'in');};
		imgs[0].src = imageSet[sel];
		
		firstCaption.innerHTML=captionSet[currentImage];
		
		//update currentImage
		currentImage = sel;
		
		return true;
	}
}