if (isIE)
	document.write("<link rel='stylesheet' href='CSS/FadeShowIE.css' type='text/css' />");

var silentPeriod = 1000; // Period from transition end to transition begin
var intervalStep = 40; // How often, in miliseconds, to increment opacity
var opacStep = 2; // Opacity increment value
var theImageWidth = 442;
var theImageHeight = 620;
var fadeImageDiv = null;
var fadeImage = null;
var controlDiv = null;
var timeOutID = null;
var intervalID = null;
var theCurrentImage = 1;
var theImages = 14;
var stopShow = false;
var allPreloaded = false;

function addListeners() {
	if (!document.getElementsByTagName) return;

	preloadImage('Images/Transitions/picture' + (theCurrentImage + 1) + '.jpg', theImageWidth, theImageHeight);

	fadeImageDiv = getEl('fadeImageDiv');
	fadeImage = getEl('fadeImage');
	controlDiv = getEl('controlDiv');
	addEvent(controlDiv, 'click', stopFadeShow, false);

	timeOutID = setTimeout(getNextImage, silentPeriod);
}

function getNextImage() {
	if (intervalID)
		clearInterval(intervalID);

	if (theCurrentImage == theImages)
		theCurrentImage = 1;
	else
		theCurrentImage += 1;

	if (theCurrentImage == theImages)
		allPreloaded = true;

	fadeImage.index = 0;

	if (fadeImage.filters)
		fadeImage.filters.alpha.opacity = 0;
	else
		fadeImage.style.opacity = 0.0;

	fadeImage.src = 'Images/Transitions/picture' + theCurrentImage + '.jpg';

	intervalID = setInterval(fadeShow, intervalStep);
}

function fadeShow() {
	if (fadeImage.index < 100) { // Continue to make current image more opaque
		fadeImage.index += opacStep;

		if (fadeImage.filters)
			fadeImage.filters.alpha.opacity = fadeImage.index;
		else
			fadeImage.style.opacity = fadeImage.index/101;

	} else { // Prepare new image
		clearInterval(intervalID);
		fadeImageDiv.style.backgroundImage = 'url(Images/Transitions/picture' + theCurrentImage + '.jpg)';
		if (!allPreloaded)
			preloadImage('Images/Transitions/picture' + (theCurrentImage + 1) + '.jpg', theImageWidth, theImageHeight);
		if (stopShow == false)
			timeOutID = setTimeout(getNextImage, silentPeriod);
	}
}

function stopFadeShow() {
	if (controlDiv.innerHTML == 'Stop Fade Show') {
		stopShow = true;
		clearInterval(timeOutID);
		controlDiv.innerHTML = 'Start Fade Show';
	} else {
		stopShow = false;
		controlDiv.innerHTML = 'Stop Fade Show';
		getNextImage();
	}
}

addEvent(window, 'load', addListeners, false);

