/*
Written by download using the jQuery framework

use csv file with following format for images:
// at beggining of line is a comment, ignore.
imageURI,thumbnailURI,title,photographer,alternate text
null entries can be used but there must be a comma

Automatically cycles through all photos, stops if someone clicks, restarts on auto button
being clicked.
*/

var animationSpeed=500;
var thumbnailWidth=80;
var visibleThumbnails=3;
var photoSwitchTimeout=3000;
var isAutoSwitching=false;
var thumbnailPadding=0;
var viewerWidth=60;
var viewerHeight=50;
var isCurrentlyScrolling=false;
var isCurrentlyChanging=false;

var numberOfImagesToLoad=0;
var photoList;
var thumbnails=[];
var currentImage=0;
var leftScrollEdge=0;
var leftScrollPixels=0;
var display;
var templist=[];

function init()
{
	$("#captionDisplay").css({opacity:"0.75"});
	var tmp=new Image();
	tmp.src="images/leftarrow_light.png";
	templist.push(tmp);
	tmp=new Image();
	tmp.src="images/leftarrow.png";
	templist.push(tmp);
	tmp=new Image();
	tmp.src="images/rightarrow.png";
	templist.push(tmp);
	tmp=new Image();
	tmp.src="images/rightarrow_light.png";
	templist.push(tmp);
	photoList=getPhotoList();
	display=$("#photoDisplay")[0];
	for(i=0;i<photoList.length;i++)
	{
		var t=new Image();
		t.onload=getLargestImages;
		t.src=photoList[i].uri;
		numberOfImagesToLoad++;
		templist.push(t);
		var img=addThumbnailToScroller(i);
		img.setAttribute("data",i);
		thumbnails.push(img);
		$(img).attr("class","regular");
		$(img).click(function()
		{
			isAutoSwitching=false;
			showImage(parseInt($(this).attr("data")));
		});
	}
}

function getLargestImages()
{
	var w=this.width;
	var h=this.height;
	if(w>viewerWidth) viewerWidth=w;
	if(h>viewerHeight) viewerHeight=h;
	numberOfImagesToLoad--;
	if(numberOfImagesToLoad==0) photoViewerStart();
}

function photoViewerStart()
{
	//set up timer, start through photos
	$("#reserveSpace").css({width:viewerWidth,height:viewerHeight});
	$("#scrollContainer").css({width:viewerWidth-$("#leftArrow")[0].width-$("#rightArrow")[0].width});
	thumbnailPadding=(viewerWidth-$("#leftArrow")[0].width-$("#rightArrow")[0].width)/visibleThumbnails;
	thumbnailPadding=((thumbnailPadding-thumbnailWidth)/2)-1;
	$("#thumbnailScroll").css({width:thumbnails.length*((thumbnailPadding*2)+thumbnailWidth+2)+100,height:thumbnailWidth+2});
	for(i=0;i<thumbnails.length;i++)
	{
		$(thumbnails[i]).css("margin-left",thumbnailPadding);
		$(thumbnails[i]).css("margin-right",thumbnailPadding);
	}
	showImage(currentImage);
	$("#leftArrow").click(function(){isAutoSwitching=false;scrollLeft()}).hover(function()
	{
		$(this).attr("src","images/leftarrow_light.png");
	},function()
	{
		$(this).attr("src","images/leftarrow.png");
	});
	$("#rightArrow").click(function(){isAutoSwitching=false;scrollRight()}).hover(function()
	{
		$(this).attr("src","images/rightarrow_light.png");
	},function()
	{
		$(this).attr("src","images/rightarrow.png");
	});
	startAuto();
}

function startAuto()
{
	if(isAutoSwitching) return;
	isAutoSwitching=true;
	advancePhoto();
}

function advancePhoto()
{
	if(!isAutoSwitching) return;
	var ci=currentImage+1;
	if(ci>=thumbnails.length) ci=0;
	showImage(ci);
}

function getPhotoList()
{
	try
	{
		try{var x=new XMLHttpRequest();}
		catch(e){var x=new ActiveXObject("Microsoft.XMLHTTP");}
	}
	catch(e){alert("It would appear that AJAX is not enabled on your browser.\nIf you are using Internet Explorer try turning on Active X Controls.");}
	x.open("GET","photolist.txt",false);
	x.send(null);
	var r=x.responseText.split("\n");
	var re=[];
	for(i=0;i<r.length;i++)
	{
		if(r[i].indexOf("//")==0) continue;
		var tmp=r[i].split(",");
		for(k=0;k<tmp.length;k++)
		{
			tmp[k]=decodeURIComponent(tmp[k]);
		}
		re.push({"uri":tmp[0],"thumbnail":tmp[1],"title":tmp[2],"photographer":tmp[3],"alt":tmp[4]});
	}
	return re;
}

function addThumbnailToScroller(idx)
{
	var img=new Image();
	img.src=photoList[idx].thumbnail;
	$("#thumbnailScroll")[0].appendChild(img);
	return img;
}

function scrollToThumbnail(idx,callback)
{
	if(thumbnailIsVisible(idx)) return callback();
	if(idx>leftScrollEdge) scrollRight(idx-leftScrollEdge-(visibleThumbnails-1),callback);
	else scrollLeft(leftScrollEdge-idx,callback);
}
function scrollLeft(n,callback)
{
	if(!isAllowedToScroll()||leftScrollEdge==0||isCurrentlyScrolling) return;
	if(!n) n=1;
	isCurrentlyScrolling=true;
	leftScrollEdge-=n;
	leftScrollPixels+=((thumbnailWidth+(thumbnailPadding*2)+2)*n);
	$("#thumbnailScroll").animate({left:leftScrollPixels},animationSpeed,"swing",function()
	{
		isCurrentlyScrolling=false;
		if(callback) callback();
	});
}
function scrollRight(n,callback)
{
	if(!isAllowedToScroll()||leftScrollEdge+visibleThumbnails>=thumbnails.length||isCurrentlyScrolling) return;
	if(!n) n=1;
	isCurrentlyScrolling=true;
	leftScrollEdge+=n;
	try{var cp=parseInt(getComputedStyle(document.getElementById("thumbnailScroll"),null).left);}
	catch(e)
	{
		var t=$("#thumbnailScroll")[0].currentStyle.left;
		if(!t||t=="auto") t="0px";
		var cp=parseInt(t);
	}
	leftScrollPixels-=((thumbnailWidth+(thumbnailPadding*2)+2)*n);
	$("#thumbnailScroll").animate({left:leftScrollPixels},animationSpeed,"swing",function()
	{
		isCurrentlyScrolling=false;
		if(callback) callback();
	});
}
function isAllowedToScroll()
{
	if(thumbnails.length>visibleThumbnails) return true;
	return false;
}

function thumbnailIsVisible(idx)
{
	if(idx>=leftScrollEdge&&idx<leftScrollEdge+visibleThumbnails) return true;
	return false;
}

function showImage(idx)
{
	if(isCurrentlyChanging) return;
	isCurrentlyChanging=true;
	$(thumbnails[currentImage]).css({borderColor:"black"});
	currentImage=idx;
	$(display).animate({opacity:0},animationSpeed,function()
	{
		scrollToThumbnail(idx,function()
		{
			$(display).attr("src",photoList[idx].uri);
			$(display).attr("alt",photoList[idx].title+" by "+photoList[idx].photographer+" - "+photoList[idx].alt);
			$("#captionDisplay").html(photoList[idx].title+" by "+photoList[idx].photographer);
			$(thumbnails[currentImage]).css({borderColor:"white"});
			$(display).animate({opacity:1},animationSpeed,function()
			{
				isCurrentlyChanging=false;
				if(isAutoSwitching) setTimeout(advancePhoto,photoSwitchTimeout);
			});
		});
	});
}

$().ready(init);