var Slideshow = Class.create();
Slideshow.prototype = {
	initialize: function(imageArray, linkArray, targetArray, idArray, slideshowContainer, preloaderSrc)
	{		
		// Initialise the image and datas array
		this.imageArray			= imageArray;
		this.linkArray			= linkArray;
		this.targetArray		= targetArray;
		this.idArray			= idArray;
		
		// Initialise the image counter to be 0
		this.imageCounter = 0;
		
		// Counts the seconds that it needed between each image change
		this.secondCounter = 0;
		this.interval = 5;
		
		// Set the restart point, for when the images have run through
		this.restartPoint = 0;
		this.endPoint = (this.imageArray.length - 1);
		this.prev = false;
		
		// Initialise the slideshow container
		this.slideshowContainer = $(slideshowContainer);
		
		this.slide1 	= new Element('img', { id: 'slide1', alt: '', className: 'slideImage', style: 'display:none;' });
		this.slide2 	= new Element('img', { id: 'slide2', alt: '', className: 'slideImage', style: 'display:none;' });
		this.preloader 	= new Element('img', { id: 'slideshowPreloader', alt: '', className: 'loading', src: preloaderSrc });
		
		this.slideshowContainer.appendChild(this.slide1);
		this.slideshowContainer.appendChild(this.slide2);
		this.slideshowContainer.appendChild(this.preloader);
		
		// Change the image
		this.preloadFirstImage();
	},
	
	// The first image gets its own function in order to start the cron
	preloadFirstImage: function()
	{
		var imgPreloader = new Image();
		$(imgPreloader).observe('load', this.startCron.bind(this));
		imgPreloader.src = this.imageArray[this.imageCounter];
		
	},
	
	preloadImage: function(clicked)
	{
		
		var imgPreloader = new Image();
		
		if (clicked == true) {
			$(imgPreloader).observe('load', this.setClicked.bind(this));
		} else {
			$(imgPreloader).observe('load', this.setReady.bind(this));
		}
		
		imgPreloader.src = this.imageArray[this.imageCounter];
	},
	
	setReady: function()
	{
		this.ready = true;
	},
	
	setClicked: function()
	{
		this.secondCounter = 0;
		this.showNextImage();
		this.ready = true;
			
	},
	
	showPreviousImage: function(clicked)
	{
		// Set the ready state to false
		this.ready = false;
		this.imageCounter--;
		
		// Make sure that there is actually a next image
		if (this.imageArray[this.imageCounter - 1]) {
			this.imageCounter--;
			// Preload the next image
			this.preloadImage(true);
		} else {
			
			// If we have a restart point go back to it, otherwise stop
			if (this.imageCounter <= 0) {
				this.imageCounter = 4;
				this.preloadImage(true);
			} else {
				this.executioner.stop();
			}
		}
		
		this.prev = true;
	},
	
	showNextImage: function(clicked)
	{
		// Make sure the preloader has been safely hidden away
		if (this.preloader.visible()) {
			this.preloader.fade({ duration: 0.2 });
		}
		
		// Show the image
		if (!this.slide1.visible()) {
			this.slide1.src = this.imageArray[this.imageCounter];
			new Effect.Parallel([
					new Effect.Fade(this.slide2),
					new Effect.Appear(this.slide1)
				], {
					sync: true,
					duration: 1.5
				}
			);
		} else if (!this.slide2.visible()) {
			this.slide2.src = this.imageArray[this.imageCounter];
			new Effect.Parallel([
					new Effect.Fade(this.slide1),
					new Effect.Appear(this.slide2)
				], {
					sync: true,
					duration: 1.5
				}
			);
		}
		
		if (clicked == true) {
			this.secondCounter = 0;
			this.imageCounter--;
		}
		
		
		// Links
		for (var i = 0; i < this.idArray.length; i++) {
			var elem = document.getElementById(this.idArray[i]);
			elem.setAttribute('href',		this.linkArray[this.imageCounter]);
			elem.setAttribute('target',		this.targetArray[this.imageCounter]);
		}
		
		// Set the ready state to false
		this.ready = false;
		
		// Increment the image counter
		this.imageCounter++;
		
		// Make sure that there is actually a next image
		if (this.imageArray[this.imageCounter]) {
			// Preload the next images
			this.preloadImage(clicked);
		} else {
			// If we have a restart point go back to it, otherwise stop
			if ((this.imageCounter > this.endPoint && this.prev == false)) {
				this.imageCounter = this.restartPoint;
				this.preloadImage(clicked);
			} else {
				this.executioner.stop();
			}
		}
		
		this.prev = false;
	},
	
	cron: function()
	{
		// Increment the second counter
		this.secondCounter++;
		
		// If the second counter has reached the set interval
		if (this.secondCounter >= this.interval && this.ready) {
			this.secondCounter = 0;
			this.showNextImage();
		}
	},
	
	startCron: function(delay)
	{
		// Set the periodical executer to happen every half second
		this.executioner = new PeriodicalExecuter(this.cron.bind(this), 1);
		
		if (delay != true) {
			this.showNextImage();
		}
	}
}