/**
 * This file contains the functionality for the image fader on the home page.
 * 
 * Author: Pexeto http://pexeto.com/
 */

var perception_fader = {
	divNumber : 0,
	imgArray : [],
	navArray : [],
	linkArray :[],
	currentImage : 0,
	selectedImage : 0,
	waitInterval : 5000, // this is the interval between each fade
	fadeSpeed : 2000, // this is the speed of the fade action
	selectFadeSpeed : 1000,
	timer : -1,

	init : function() {
		this.getAllDivs();
		if (this.divNumber > 0) {
			this.setFader();
			this.setClickHandlers();
			this.setLinks();
			this.timer = window.setInterval(function() {
				perception_fader.fade();
			}, this.waitInterval);
		}
	},

	/**
	 * Gets all the divs that have to be shown in the slider and fills them in
	 * an array.
	 */
	getAllDivs : function() {

		jQuery('#fader').append('<div id="fader_navigation"><ul></ul></div>');

		var html = '';
		// fill the divs in an array
	jQuery(".fade_holder img").each(function(i) {
		perception_fader.imgArray[i] = jQuery(this);
		perception_fader.linkArray[i] = jQuery(this).parent().attr('href');
		perception_fader.divNumber+=1;
		if (i !== 0) {
			html += '<li><a href="#"></a></li>';
		} else {
			html += '<li class="selected"><a href="#"></a></li>';
		}
	});

	jQuery("#fader_navigation ul").append(html);
	this.navArray = jQuery("div#fader_navigation ul li");
},

/**
 * Makes all the images invisible.
 */
setFader : function() {
	for ( var i = 1; i < this.divNumber; i+=1) {
		this.imgArray[i].css( {
			display : "none"
		});
	}
},

setClickHandlers : function() {
	jQuery("#fader_navigation ul li a").each(function(i) {
		jQuery(this).click(function(event) {
			event.preventDefault();
			if(perception_fader.selectedImage!=i){
				window.clearInterval(perception_fader.timer);
				perception_fader.selectedImage = i;
				perception_fader.fadeSelected();
				perception_fader.timer = window.setInterval(function() {
					perception_fader.fade();
				}, perception_fader.waitInterval);
			}
		});
	});
},

fadeSelected : function() {
	var img = this.imgArray[this.currentImage],
		navLi = jQuery(this.navArray[this.currentImage]);
	
	img.fadeOut(this.selectFadeSpeed);
	navLi.removeClass("selected");

	img = this.imgArray[this.selectedImage];
	img.fadeIn(this.selectFadeSpeed);

	navLi = jQuery(this.navArray[this.selectedImage]);
	navLi.addClass("selected");

	this.currentImage = this.selectedImage;
},

setLinks : function() {
	jQuery('.fade_holder').click(function() {
		var link = perception_fader.linkArray[perception_fader.currentImage];
		if (link !== null) {
			location.href = link;
		}
	});

	jQuery('.fade_holder').mouseover(function() {
		jQuery(this).css( {
			cursor : "pointer"
		});
	});

},

/**
 * The whole fading is performed here.
 */
fade : function() {
	var img = this.imgArray[this.currentImage],
		navLi = jQuery(this.navArray[this.currentImage]);
	
	img.fadeOut(this.fadeSpeed);
	navLi.removeClass("selected");

	if (this.currentImage < this.divNumber - 1) {
		img = this.imgArray[this.currentImage + 1];
		navLi = jQuery(this.navArray[this.currentImage + 1]);
		this.currentImage+=1;
	} else {
		img = this.imgArray[0];
		navLi = jQuery(this.navArray[0]);
		this.currentImage = 0;
	}

	img.fadeIn(this.fadeSpeed);
	navLi.addClass("selected");
}

};