// imageFunctions.js
// Functions to control the Image Gallery (index, viewer, slideshow)
//
// You shouldn't need to make any changes to this file. All variables are stored in imageArray.js


// setHighlight -- set thumbnail border to yellow (selected) or white (not selected)
// Used by viewer.html
function setHighlight(thumbnail,status) {
	if ( status == "on" ) {
		document.getElementById(thumbnail).style.borderColor = highlightColorOn;
	} else {
		document.getElementById(thumbnail).style.borderColor = highlightColorOff;
	}
}

// setFileName -- gets filename based on images array
// Used by viewer.html
function setFileName(index) {
	if ( index < 0 || index >= images.length ) {
		if ( index < 0 ) {
			if ( index < -1 ) {
				imgName = navDir + "/blank.png";
			} else {
				imgName = navDir + "/start.png";
			}
		} else {
			if (index == images.length ) {
				imgName = navDir + "/end.png";
			} else {
				imgName = navDir + "/blank.png";
			}
		} 
	} else {
		imgName = thumbDir + "/" + images[index][0];
	}
	return imgName;
}


// updateThumbnails -- update thumbnails based on user selection
// Used by viewer.html
function updateThumbnails(centerImage) {
	for ( count = 1; count <= numOfThumbs; count++ ) {
		thumbIndex = centerImage + count - center;
		imgName = setFileName(thumbIndex);
		document.getElementById(count).src = imgName;
		if ( thumbIndex == currentImage ) {
			setHighlight(count,"on");
		} else {
			setHighlight(count,"off");
		}			
	}
}


// updateMainImg -- update main image
// Used by viewer.html and slideshow.html
function updateMainImg(index,opacity) {
	if ( opacity != null )	{
		style = ' style="opacity:' + opacity + '"';
	} else {
		style = '';
	}

	// Check for trailing slash in imageDir
	if ( imageDir != "" && imageDir.charAt(imageDir.length - 1) != "/" ) { imageDir = imageDir + "/" }

	// If there is a URL associated with this image, then add a link to the HTML
	if ( images[index][2] != "" ) {
		document.getElementById("mainContainer").innerHTML = '<a href="' + images[index][2] + '" target="_blank"><img src="' + imageDir + images[index][0] + '" id="main" border="0"' + style + ' alt="' + images[index][1] + '"></a>';
	// Otherwise, just add the image
	} else {
		document.getElementById("mainContainer").innerHTML = '<img src="' + imageDir + images[index][0] + '" id="main"' + style + ' alt="' + images[index][1] + '">';
	}

	if ( document.getElementById("alt_text") ) {
		// If there is alt text associated with this image, display it in the description field (id = alt_text)
		if ( images[index][1] != "" ) {
			document.getElementById("alt_text").innerHTML = images[index][1];
		} else {
			document.getElementById("alt_text").innerHTML = "&nbsp;";
		}
	}
}


// focusImg -- changes featured (main) image based on selected thumbnail
// Used by viewer.html
function focusImg(source) {
	var imageInArray = false;
	var mainImage = document.getElementById(source).src.replace(thumbRegExp, "");
	for ( count = 0; count < images.length; count++ ) {
		if ( mainImage.indexOf(images[count][0]) != -1 ) {
			currentImage = count;
			updateMainImg(currentImage);
			imageInArray = true;
			break;
		}
	}
	if ( imageInArray == true ) {
		updateThumbnails(currentImage);
	}
}


// focusImgName -- changes featured image (id = "main") to [filename]
// Used by viewer.html
function focusImgName(source) {
	var imageInArray = false;
	var mainImage = source;
	for ( count = 0; count < images.length; count++ ) {
		if ( mainImage.indexOf(images[count][0]) != -1 ) {
			currentImage = count;
			updateMainImg(currentImage);
			imageInArray = true;
			break;
		}
	}
	if ( imageInArray == true ) {
		updateThumbnails(currentImage);
	}
}


// moveImg -- advances thumbnails by [n] units
// Used by viewer.html
function moveImg(amount) {
	//The center thumbnail image should always be part of the images array
	var string = document.getElementById(center).src.replace(thumbRegExp, "");
	for ( count = 0; count < images.length; count++ ) {
		if ( string.indexOf(images[count][0]) != -1 ) {
			middleThumb = count;
			break;
		}
	}
	//What if I hit rewind (e.g. -5) and I'm on item 2?
	if ( middleThumb + amount < 0 ) {
		amount = 0 - middleThumb
	}
	if ( middleThumb + amount >= images.length ) {
		amount = (images.length - 1) - middleThumb
	}
	if ( middleThumb + amount >= 0 && middleThumb + amount < images.length ) {
		updateThumbnails(middleThumb + amount);
	}
}


// initViewer -- displays navigation thumbnails
// Used by viewer.html
function initViewer() {
	updateMainImg(currentImage);
	updateThumbnails(currentImage);
	document.getElementById("galleryTitle").innerHTML = galleryTitle;
}


// Build Index -- creates thumbnail index
// Used by index.html
function buildIndex() {
	if ( document.getElementById("main") ) {
		updateMainImg(currentImage);
	}
	document.getElementById("galleryTitle").innerHTML = galleryTitle;
	document.getElementById("galleryDescription").innerHTML = galleryDescription;
	var string = "";
	for ( count = 0; count < images.length; count++ ) {
		string = string + '<a href="viewer.html?image=' + images[count][0] + '" onClick="javascript:openViewer(\'' + images[count][0] + '\');return false;"><img src="' + thumbDir + '/' + images[count][0] +'" border="0" vspace="2" hspace="2"></a>\n';
	}
	if ( document.getElementById("imageIndex") ) {
		document.getElementById("imageIndex").innerHTML = string;
	}
}


// openViewer -- opens the image viewer
// Used by index.html
function openViewer(filename) {
	if ( filename != null ) {
		filename = "?image=" + filename;
	} else {
		filename = "";
	}
	if ( openViewerInNewWindow ) {
		viewerWindow = window.open('viewer.html' + filename,viewerWindowName,viewerWindowProperties);
		viewerWindow.focus();
	} else {
		self.location = "viewer.html" + filename;
	}
}


// openSlideshow -- opens the slideshow
// Used by index.html
function openSlideshow() {
	if ( openSlideshowInNewWindow ) {
		slideshowWindow = window.open('slideshow.html',slideshowWindowName,slideshowWindowProperties);
		slideshowWindow.focus();
	} else {
		self.location = "slideshow.html";
	}
}


// opacity -- controls fade-in/fade-out effects
// Used by slideshow.html
function opacity(id, opacStart, opacEnd, millisec) {
    //speed for each frame
    var speed = Math.round(millisec / 100);
    var timer = 0;

    //determine the direction for the blending, if start and end are the same nothing happens
    if(opacStart > opacEnd) {
        for(i = opacStart; i >= opacEnd; i--) {
            setTimeout("changeOpacity(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    } else if(opacStart < opacEnd) {
        for(i = opacStart; i <= opacEnd; i++)
            {
            setTimeout("changeOpacity(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    }
}


// changeOpacity -- change element's opacity
// Used by slideshow.html
function changeOpacity(opacity, id) {
    var object = document.getElementById(id).style;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
} 


// slideshow -- cycles through image array
// Used by slideshow.html
function slideshow() {
	if ( currentImage + 1 < images.length ) {
		//opacity("main",100,0,fadeTime);
		changeOpacity(0,"main");
		currentImage++;
		updateMainImg(currentImage,0);
		opacity("main",0,100,fadeTime);
		nextImage = setTimeout('slideshow();',delay);
	} else {
		clearTimeout(nextImage);
		document.getElementById("alt_text").innerHTML = 'End of slide show.';
	}
}


// togglePlay -- pauses/plays slideshow
// Used by slideshow.html
function togglePlay() {
	if ( paused == true ) {
		paused = false;
//		nextImage = setTimeout('slideshow();',delay);
		nextImage = setTimeout('slideshow();',500);
		document.getElementById("toggle").src = navDir + "/pause.png";
	} else {
		paused = true;
		clearTimeout(nextImage);
		document.getElementById("toggle").src = navDir + "/play.png";
	}
}


// shiftImg -- advances to next or previous image
// Used by slideshow.html
function shiftImg(amount) {
	paused = true;
	clearTimeout(nextImage);
	document.getElementById("toggle").src = navDir + "/play.png";
	if ( currentImage + amount < images.length && currentImage + amount >= 0 ) {
		currentImage = currentImage + amount;
		updateMainImg(currentImage);
	}
}


// jumpTo -- advances to first or last image
// Used by slideshow.html
function jumpTo(location) {
	paused = true;
	clearTimeout(nextImage);
	document.getElementById("toggle").src = navDir + "/play.png";
	if ( location == 'start' ) {
		currentImage = 0;
	} else {
		currentImage = images.length - 1;
	}
	updateMainImg(currentImage);
}


// initSlideshow -- displays first image/description in image array
// Used by slideshow.html
function initSlideshow() {
	updateMainImg(currentImage);
	document.getElementById("galleryTitle").innerHTML = galleryTitle;
	nextImage = setTimeout('slideshow();',delay);
}