function SlideShow(containerName, timerSpeed, imageArray){

	var lastPic = 0;
	var currentPic = -1;

	var slideTimer;
	var currentPage = 0;
	var currentPicWindow = 0;

	var fadeTimer;
	var currentFadeCount = 0;
	var fadeSteps = 20;
	var fadeDuration = 600;

	var spinTimer;
	var spinCount = -1;

	var picWindow = new Array();
	var pages = new Array();

	var spinnerElement;

	this.gotoPic = function(picID){
		clearTimeout(fadeTimer);
		clearTimeout(slideTimer);
		showPic(parseInt(picID));
	}
	
	var showPic = function(picID){
		currentPicWindow ^= 1;
		lastLastPic = lastPic;
		lastPic = currentPic;
		currentPic = picID;

		pages[currentPic].style.color = 'grey';

		if (lastLastPic == currentPic && lastPic != -1){
			movePic();
		}else{
			startSpinner();
			picWindow[currentPicWindow].src = imageArray[picID];
		}
	}

	var nextPic = function(){
		var picID = (currentPic+1)==imageArray.length?0:currentPic+1;
		showPic(picID);
	}

	var prevPic = function(){
		var picID = (currentPic-1)==-1?imageArray.length:currentPic-1;
		showPic(picID);
	}

	var movePic = function(){
		stopSpinner();

		if (lastPic != -1){
			pages[lastPic].style.color = spinnerElement.style.color;
		}
		pages[currentPic].style.color = 'orange';

		if(lastPic != -1){
			currentFadeCount = 0;
			fadeIt();
		}else{
			picWindow[currentPicWindow].style.opacity = 1;
			picWindow[currentPicWindow].style.filter = "alpha(opacity=100)";

			picWindow[(currentPicWindow^1)].style.opacity = 0;
			picWindow[(currentPicWindow^1)].style.filter = "alpha(opacity=0)";

			slideTimer = setTimeout(nextPic,timerSpeed);
		}
	}

	var fadeIt = function(){
		currentFadeCount += 1;

		picWindow[currentPicWindow].style.opacity = currentFadeCount/fadeSteps;
		picWindow[currentPicWindow].style.filter = "alpha(opacity="+(100*currentFadeCount/fadeSteps)+")";

		picWindow[(currentPicWindow^1)].style.opacity = 1-currentFadeCount/fadeSteps;
		picWindow[(currentPicWindow^1)].style.filter = "alpha(opacity="+(100-100*currentFadeCount/fadeSteps)+")";

		if (currentFadeCount < fadeSteps){
			fadeTimer = setTimeout(fadeIt,fadeDuration/fadeSteps);
		}else{
			currentFadeCount = 0;
			clearTimeout(fadeTimer);
			slideTimer = setTimeout(nextPic,timerSpeed);
		}
	}
	
	var startSpinner = function(){
		var spinnerIcon = ["", "•", "••", "•••"];
		spinCount = spinCount+1>spinnerIcon.length-1?0:spinCount+1;
		spinnerElement.innerHTML = spinnerIcon[spinCount];
		spinTimer = setTimeout(startSpinner,500);
	}

	var stopSpinner = function(){
		spinCount = -1;
		clearTimeout(spinTimer);
		spinnerElement.innerHTML = "";
	}
	
	var jumpPic = function(e){
		var evt = window.event || e;
		var el = evt.srcElement || evt.target;

		clearTimeout(fadeTimer);
		clearTimeout(slideTimer);
		showPic(parseInt(el.innerHTML)-1);
	}

	this.init = function(){
		var container = document.getElementById(containerName);

		picWindow[0] = document.createElement("img");
		picWindow[0].src = "x";
		picWindow[0].className = "pic";
		picWindow[0].style.cssFloat = "left";
		picWindow[0].style.position = "absolute";
		container.appendChild(picWindow[0]);

		picWindow[1] = document.createElement("img");
		picWindow[1].src = "x";
		picWindow[1].className = "pic";
		picWindow[1].style.cssFloat = "left";
		picWindow[1].style.position = "absolute";
		container.appendChild(picWindow[1]);

		var slideListElement = document.createElement("div");
		container.appendChild(slideListElement);
		slideListElement.className = "selector";
		slideListElement.style.display = "none";

		for (var i=0; i<imageArray.length; i++){
			var page = document.createElement("div");
			page.onclick = jumpPic;
			page.className = "page";
			page.style.cursor = "pointer";
			page.style.display = "inline";
			page.innerHTML = (i+1)+"&nbsp;";

			pages[i] = page;

			slideListElement.appendChild(pages[i]);
		}
		spinnerElement = document.createElement("div");
		spinnerElement.style.display = "inline";
		spinnerElement.className = "page";
		slideListElement.appendChild(spinnerElement);

		picWindow[0].onload = movePic;
		picWindow[1].onload = movePic;

		container.onmouseover = function(){slideListElement.style.display = "block";};
		container.onmouseout = function(){slideListElement.style.display = "none";};
			
		nextPic();
	}

	this.pause = function(){
		clearTimeout(slideTimer);
	}

	this.unpause = function(){
		nextPic();
	}

}

