imagesSrc = new Array();
imagesAlt = new Array();
imagesTeaser = new Array();
var imagetitle;
var teasertitle;
var opacity;
var hiding;
var mainImage;
var imageFader;
var playing = 0;
var targetPos = 0;
if(navigator.userAgent.indexOf('MSIE') > 0)
var moveWidth = 478.2;
else if(navigator.userAgent.indexOf('Firefox') > 0)
var moveWidth = 478.2;
else
var moveWidth = 475;
var imageWidth = 92;
var originalWidth = 0;
var gallery_currentImage = 0;
var gallery_loading;

function activate(myDiv)
{
	getImages(myDiv);
	var activeDiv = document.getElementById(myDiv);
	activeDiv.innerHTML = "<p class='playLinks'><a href='javascript:playLink();' id='play_link' title='Play Slideshow'><span><small>Play Slideshow</small></span></a></p>";
	activeDiv.innerHTML += "<a id='leftButton' onclick='moveLeft()'><span title='Move Left'><small>Move Left</small></span></a><a id='rightButton' onclick='moveRight()'><span title='Move Right'><small>Move Right</small></span></a>";
	activeDiv.innerHTML += "<div id='thumbs'><div id='thumbscontainer'></div></div>";
	activeDiv.innerHTML += "<div id='photo_container'><img id='mainImage' src='"+imagesSrc[0]+"' alt='"+imagesAlt[0]+"' /><img id='imageFader' alt=''/></div>"
	activeDiv.innerHTML += "<div id='teaser_container'><h2 id='teaser_title'>"+imagesAlt[0]+"</h2><p id='teaser_text'>"+imagesTeaser[0]+"</p></div>";
	activeDiv.style.visibility = "visible";
	originalWidth = (imageWidth+4) * imagesSrc.length;
	gallery_loading = setInterval(finishActivate, 10);
}

function finishActivate()
{
	if(document.getElementById("leftButton"))
	{
		clearInterval(gallery_loading);
		changeOpac(50, 'leftButton');
		thumbsDiv = document.getElementById("thumbscontainer");
		imagetitle = document.getElementById("teaser_title");
		teasertitle = document.getElementById("teaser_text");
		thumbsDiv.style.marginRight = -originalWidth + "px";
		thumbsDiv.style.marginLeft = "0px";
		thumbHeight = thumbsDiv.offsetHeight - 15;
		var thumbImages = "";
		for(i=0;i<imagesSrc.length;i++)
		{
			thumbImages += "<a href='javascript:;' onclick='loadImage(this)' id='"+i+"'><img src='"+imagesSrc[i]+"' alt='"+imagesAlt[i]+"' height='"+thumbHeight+"' /><br />"+(i+1)+" of "+imagesSrc.length+"</a> "
		}
		thumbsDiv.innerHTML += "<p>"+thumbImages+"</p>";
	}
}

function getImages(myDiv)
{
	var galleryDiv = document.getElementById(myDiv);
	for(i=0;i<galleryDiv.childNodes.length;i++)
	{
		if(galleryDiv.childNodes[i].nodeName == "IMG")
		{
			imagesSrc.push(galleryDiv.childNodes[i].src);
			imagesAlt.push(galleryDiv.childNodes[i].alt);
		}
		if(galleryDiv.childNodes[i].nodeName == "SPAN")
		{
			imagesTeaser.push(galleryDiv.childNodes[i].innerHTML);
		}
		else if(galleryDiv.childNodes[i].nodeName == "P" || galleryDiv.childNodes[i].nodeName == "H1" || galleryDiv.childNodes[i].nodeName == "H2")
		{
			var newNode = galleryDiv.childNodes[i];
			for(j=0;j<newNode.childNodes.length;j++)
			{
				if(newNode.childNodes[j].nodeName == "IMG")
				{
					imagesSrc.push(newNode.childNodes[j].src);
					imagesAlt.push(newNode.childNodes[j].alt);
				}
				if(newNode.childNodes[j].nodeName == "SPAN")
				{
					imagesTeaser.push(newNode.childNodes[j].innerHTML);
				}
			}
		}
	}
	for(i=0;i<imagesTeaser;i++)
	{
		if(imagesTeaser[i] == "undefined")
		{
			imagesTeaser[i] = "";
		}
	}
}

function moveLeft()
{
	currentMargin = thumbsDiv.style.marginLeft;
	currentMargin = parseInt(currentMargin.substring(0,(currentMargin.length-2)));
	var nextPos = targetPos + moveWidth;
	if(nextPos < 0.5)
	{
		targetPos = nextPos;
	}
	else
	{
		targetPos = 0;
	}
}

function moveRight()
{
	currentMargin = thumbsDiv.style.marginLeft;
	currentMargin = parseInt(currentMargin.substring(0,(currentMargin.length-2)));
	var nextPos = targetPos - moveWidth;
	if(targetPos == 0)
	nextPos -= 1;
	if(nextPos > 0 - originalWidth)
	{
		targetPos = nextPos;
	}
}

function moveImages()
{
	if(document.getElementById("thumbscontainer") && document.getElementById("rightButton") && document.getElementById("leftButton"))
	{
		var thumbsDiv = document.getElementById("thumbscontainer");
		currentMargin = thumbsDiv.style.marginLeft;
		currentMargin = parseInt(currentMargin.substring(0,(currentMargin.length-2)));
		if(isNaN(currentMargin))
			currentMargin = 0;
		if(currentMargin != targetPos)
		{
			if(currentMargin - (currentMargin - targetPos)/2 < -2)
			{
				thumbsDiv.style.marginLeft = (currentMargin - (currentMargin - targetPos)/2) + "px";
			}
			else
			{
				thumbsDiv.style.marginLeft = targetPos + "px";
			}
		}
		if(currentMargin - moveWidth < 0 - originalWidth)
		{
			changeOpac(50, 'rightButton');
		}
		else
		{
			changeOpac(100, 'rightButton');
		}
		if(currentMargin + moveWidth/2 >= 0)
		{
			changeOpac(50, 'leftButton');
		}
		else
		{
			changeOpac(100, 'leftButton');
		}
	}
}

function loadImage(thumbClicked)
{
	clearInterval(playing);
	playing = -1;
	document.getElementById("play_link").className = '';
	document.getElementById("play_link").innerHTML = '<span><small>Play Slide Show</small></span>';
	var mainImage = document.getElementById("mainImage");
	var imageFader = document.getElementById("imageFader");
	imageFader.src = mainImage.src;
	imageFader.alt = mainImage.alt;

	teasertitle.innerHTML = imagesTeaser[thumbClicked.id];
	gallery_currentImage = thumbClicked.id;
	opacity = 100;
	changeOpac(opacity,"imageFader");
	imageFader.style.display = "block";
	mainImage.src = thumbClicked.childNodes[0].src;
	mainImage.alt = thumbClicked.childNodes[0].alt;
	imagetitle.innerHTML = thumbClicked.childNodes[0].alt;
	var thumbsDiv = document.getElementById("thumbscontainer");
	for(i=0;i < thumbsDiv.childNodes[0].childNodes.length;i++)
	{
		if(thumbsDiv.childNodes[0].childNodes[i].className == "active")
		{
			thumbsDiv.childNodes[0].childNodes[i].className = "visited";
		}
	}
	thumbClicked.className = "active";
	hiding = setInterval(slowHide, 50);
}

function loadNextImages()
{
	if(document.getElementById(gallery_currentImage+1))
	{
		mainImage = document.getElementById("mainImage");
		imageFader = document.getElementById("imageFader");
		imageFader.src = mainImage.src;
		imageFader.alt = mainImage.alt;
		opacity = 100;
		changeOpac(opacity,"imageFader");
		imageFader.style.display = "block";

		var thumbsDiv = document.getElementById("thumbscontainer");
		for(i=0;i < thumbsDiv.childNodes[0].childNodes.length;i++)
		{
			if(thumbsDiv.childNodes[0].childNodes[i].className == "active")
			{
				thumbsDiv.childNodes[0].childNodes[i].className = "visited";
			}
		}
		setTimeout(switchAnimImage, 10)
	}
	else
	{
		clearInterval(playing);
		document.getElementById("play_link").className = '';
		document.getElementById("play_link").innerHTML = '<span><small>Play Slide Show</small></span>';
	}
}

function switchAnimImage()
{
	gallery_currentImage += 1;
	document.getElementById(gallery_currentImage).className = "active";
	teasertitle.innerHTML = imagesTeaser[gallery_currentImage];
	imagetitle.innerHTML = document.getElementById(gallery_currentImage).childNodes[0].alt;
	mainImage.src = document.getElementById(gallery_currentImage).childNodes[0].src;
	mainImage.alt = document.getElementById(gallery_currentImage).childNodes[0].alt;

	hiding = setInterval(slowHide, 50);
}


function slowHide()
{
	opacity -= 10;
	changeOpac(opacity,"imageFader");
	if(opacity <= 0)
	{
		document.getElementById("imageFader").style.display = "none";
		clearInterval(hiding);
	}
}

function changeOpac(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 + ")";
}

function closeLink()
{
	document.getElementById("teaser_container").style.display = "none";
}

function playLink()
{
	if(playing > 0)
	{
		clearInterval(playing);
		playing = -1;
		document.getElementById("play_link").className = '';
		document.getElementById("play_link").innerHTML = '<span><small>Play Slide Show</small></span>';
	}
	else
	{
		gallery_currentImage = -1;
		loadNextImages();
		playing = setInterval(loadNextImages, 7000);
		document.getElementById("play_link").className = 'stop_link';
		document.getElementById("play_link").innerHTML = '<span><small>Stop Slide Show</small></span>';
	}
}

var movingImage = setInterval(moveImages, 30);
document.write('<style type="text/css">#photos { visibility:hidden; } </style>');