var photoList = "";
var currentImage = 0;
var nthumbs = 6;  //number of thumbnails to show in strip
var len = 0;
var left = 0;
var path = "";
var tmbpath = "";
var strip = new Array();
var largeImage;
var nextImage = new Image();
var prevImage = new Image();
var firstImage = new Image();
var lastImage = new Image();
var pfadeAmount = 0.1;

var THUMB_BORDER_OFF = "2px solid #111111";
var THUMB_BORDER_CURRENT = "2px solid #76c29f";
var THUMB_BORDER_HOVER = "2px solid #caffa6"

function updateStrip() {		
		for(i=0;i<nthumbs;i++) {
			strip[i].attr("src",tmbpath + photoList[left + i]);
		}
		
		$(".viewer_tmb").css("border",THUMB_BORDER_OFF);
		
		if(left == 0) $("#strip_nav_left").fadeTo("fast",pfadeAmount);
		else $("#strip_nav_left").fadeTo("fast",1);
		
		if(left + nthumbs == len) $("#strip_nav_right").fadeTo("fast",pfadeAmount);
		else $("#strip_nav_right").fadeTo("fast",1);
		
		if(currentImage > 0) $("#nav_left").fadeTo("fast",1);
		else $("#nav_left").fadeTo("fast",pfadeAmount);
		
		if(currentImage < len - 1) $("#nav_right").fadeTo("fast",1);
		else $("#nav_right").fadeTo("fast",pfadeAmount);
			
		if(currentImage >= left && currentImage <= left + nthumbs) 
			strip[currentImage - left].css("border",THUMB_BORDER_CURRENT);

		$("#photo_counter").html((currentImage+1)  + " / " + len);
		preloadImages(currentImage);
}

function moveStrip(dir) {
	switch (dir) {
		case "l": 
			if(left > 0) left--;
			break;
		case "r":
			if(left + nthumbs < len) left++;
			break;
	}
	updateStrip();
}


function next() {
	if(currentImage < len-1) {
		$("#large_image").attr("src",nextImage.src);
		$("#large_image").imagescale({width: 640, height: 480, size: "max"});
		currentImage++;
		
		
		if(currentImage + nthumbs < len) left = currentImage;
		else left = len - nthumbs;
		
		updateStrip();		
	}
}

function prev() {
	if(currentImage > 0) {
		$("#large_image").attr("src",prevImage.src);
		$("#large_image").imagescale({width: 640, height: 480, size: "max"});
		currentImage--;
			
		if(currentImage + nthumbs > len) left = len - nthumbs;
		else left = currentImage;	
		
		updateStrip();
	}
}

function first() {
		$("#large_image").attr("src",firstImage.src);
		$("#large_image").imagescale({width: 640, height: 480, size: "max"});
		currentImage = 0;
			
		if(currentImage + nthumbs < len) left = currentImage;
		else left = len - nthumbs;

		updateStrip();
}

function last() {
		$("#large_image").attr("src",lastImage.src);
		$("#large_image").imagescale({width: 640, height: 480, size: "max"});
		currentImage = len-1;
			
		if(currentImage + nthumbs > len) left = len - nthumbs;
		else left = currentImage;	

		updateStrip();
}

function showImage(slot) {
	
	currentImage = left + slot;
	$("#large_image").attr("src",path + photoList[currentImage]);
	$("#large_image").imagescale({width: 640, height: 480, size: "max"});
	

	updateStrip();
	
	$("#photo_counter").html((currentImage+1) +" / " + len);
}


function preloadImages(curr) {
	if(curr > 0) prevImage.src = path + photoList[curr - 1];
	if(curr < len) nextImage.src = path + photoList[curr + 1];
	firstImage.src = path + photoList[0];
	lastImage.src = path + photoList[len-1];

}

nn=(document.layers)?true:false;
ie=(document.all)?true:false;
function keyDown(e) { 
	var evt=(e)?e:(window.event)?window.event:null; 
	if(evt){ 
		var key=(evt.charCode)?evt.charCode: ((evt.keyCode)?evt.keyCode:((evt.which)?evt.which:0));
		if(key=="37") {  // left
			prev();
		}
		if(key=="39") { // right
			next();
		}
		if(key=="38") { // up
			first();
		}
		if(key=="40") { // down
			last();
		}
	} 
} 

document.onkeydown=keyDown; 
if(nn) document.captureEvents(Event.KEYDOWN);

$(document).ready(function(){

	$(".viewer_tmb").fadeTo("fast",fadeAmount);
	
	$(".viewer_tmb").hover(
	function() {
		$(this).fadeTo("fast",1);
		$(this).css("border",THUMB_BORDER_HOVER);
	},
	function() {
		$(this).fadeTo("fast",fadeAmount);
		$(this).css("border",THUMB_BORDER_OFF);
		if((currentImage - left > 0) && (currentImage - left < nthumbs)) 
			strip[currentImage - left].css("border",THUMB_BORDER_CURRENT);
	});
	
});