/**
*The SlideShow object
*Arguments:
*slideel: the element that contains the slides
*faddingSpeed: anything starting from 1, the higher the slowest
*stopTime: the time in milliseconds for a slide to be displayed until it moves to the next slide
*stopOnMouseOver: if the animation should stop if the mouse is over the slides
*/
function SlideShow(slideel, faddingSpeed, stopTime, stopOnMouseOver) {	
	var mouseIsOver = false; //mouseover flag
 
	//if we want to use "stopOnMouseOver"
	if (stopOnMouseOver) {
		//add an event handler to flag mouse is over when... mouse is over
		slideel.addEvent('mouseover', function() {
			mouseIsOver = true;
		});
 
		//flag mouse is not over, and finnaly call the next slide
		slideel.addEvent('mouseout', function() {
			mouseIsOver = false;
			self.next();
		});
	}

	this.next = function() { //go to the next slide
		if (mouseIsOver) //if mouse is over do nothing
			return;
 
		this.current.fadeOut();
		this.current = this.current.nextSlide;
		this.current.fadeIn();
	}
 
	var self = this; //there's a reason for this sentence, check at the end
 
	//this function creates the slides, does not need to be a function
	//but this way the arrays will be eliminated from memory after the function call
	function createSlides() {
		var imgs = slideel.getElementsByTagName('img');
		var slides = [];

		for (var i = 0; i < imgs.length; i++) {		
			slides[i] = new SlideShowImage(imgs[i], self);
		}
 
		for (var i = 0; i < slides.length; i++) {
			if (i == slides.length - 1)
				slides[i].nextSlide = slides[0];
			else
				slides[i].nextSlide = slides[i + 1];
		}
 
		self.current = 	slides[0]; //the current slide will be the first
		slides[0].fadeIn(); //fade it in
 
		//the SlideShowImage
		function SlideShowImage(img, slideShow) {
			img.style.opacity = '0'; //hide the image in firefox
			img.style.filter = 'alpha(opacity=0)'; //hide the image in ie
 
			//fadeIn and fadeOut methods, use the animation frame scheduling method, see at the end of the code
			this.fadeIn = function() {
				var i = 0;
				while (++i <= 50) {
					window.setTimeout(function() {
						addFade(0.02);
					}, i * faddingSpeed);
				}
 
				//after completely fadding in, wait "stopTime" ann call the next slide
				window.setTimeout(function() {
					slideShow.next();
				}, 50 * faddingSpeed + stopTime);
			}
 
			this.fadeOut = function() {
				var i = 0;
				while (++i <= 50) {
					window.setTimeout(function() {
						addFade(-0.02);
					}, i * faddingSpeed);
				}
			}
 
			//this function retrieves the opacity value in IE
			function getIeOpacity() {
				var opacity = img.style.filter.match(/alpha\(opacity=\d{0,3}\)/);
				if (!opacity)
					return 100;
				else {
					var value = parseInt(opacity[0].replace(/alpha\(opacity=/,'').replace(/\)/, ''));
					return value;
				}
			}
 
			function addFade(value) {
				if (document.all) //if we're facing the evilness of IE
					img.style.filter = 'alpha(opacity=' + (getIeOpacity() + value * 100) + ')';
				else
					img.style.opacity = parseFloat(img.style.opacity) + value;
			}
		}
	}
 
	createSlides(slideel); //create the slides
}