var Carousel = {

	slides: null,
	slideBar: null,
	previewElements: null,
	hoverElements: null,
	currentSlide: null,
	executer: null,
	sliding : null,
	
	options: {
		slidePause: 6000,
		slidePauseClick: 14000,
		fadeDurationOneStep: 250,
		previewMarkerDuration: 250
	},
	
	initialize: function() {
		var slidesContainer = jQuery('#slides');
		this.slideBar = jQuery('#slidebar');
		if (slidesContainer && this.slideBar) {
			this.slides = slidesContainer.find('.slide');
			var btnPrev = jQuery('#button_prev');
			if (btnPrev) {
				btnPrev.bind('click', function(ev) {
					Carousel.navButtonHandler(ev, -1);
				});
				btnPrev.bind('mouseover', function() {
					Carousel.arrowOver(this, true);
				});
				btnPrev.bind('mouseout', function() {
					Carousel.arrowOver(this, false);
				});
			}
			var btnNext = jQuery('#button_next');
			if (btnNext) {
				btnNext.bind('click', function(ev) {
					Carousel.navButtonHandler(ev, 1);
				});
				btnNext.bind('mouseover', function() {
					Carousel.arrowOver(this, true);
				});
				btnNext.bind('mouseout', function() {
					Carousel.arrowOver(this, false);
				});
			}
			this.previewElements = this.slideBar.find('.preview .hand');
			jQuery.each(jQuery(this.previewElements), function(i, el) {
				jQuery(el).attr('previewIndex', i);
			});

			this.hoverElements = this.slideBar.find('.preview .hover');
			jQuery.each(jQuery(this.hoverElements), function(i, el) {
				el = jQuery(el);
				el.attr('previewIndex', i);
				el.bind('mouseover', function(ev) {
					Carousel.previewClick(ev, this);
				});
				el.bind('click', function(ev) {
					Carousel.previewClick(ev, this);
				});
			});	
			this.toggleSlide(0, false);
		}
	},
	
	arrowOver : function(el, over) {	
	    if (over) {    
	    	jQuery(el).css('backgroundPosition', '0px -40px');
	    }
	    else {
	    	jQuery(el).css('backgroundPosition', '0px 0px');
	    }
	},	
	
	previewClick: function(ev, el) {
		var element = jQuery(el);
		var prevIdx = parseInt(element.attr('previewIndex'));

		if (prevIdx != this.currentSlide) {
			this.toggleSlide(prevIdx, true);
			ev.stopImmediatePropagation();
		}
	},
	
	killExecuter: function() {
		if (this.executer && this.executer != null) {
			clearInterval(this.executer);
			this.executer = null;
		}
	},
	
	initNextShow: function(manual) {
		this.killExecuter();
		this.executer = setInterval(this.autoNextSlide, !manual ? this.options.slidePause : this.options.slidePauseClick);//new PeriodicalExecuter(this.autoNextSlide.bind(this), !manual ? this.options.slidePause : this.options.slidePauseClick);
	},
	
	autoNextSlide: function() {
		Carousel.showNextSlide(false);
	},
	
	showPrevSlide: function(manual) {
		this.killExecuter();
		this.toggleSlide(this.currentSlide > 0 ? this.currentSlide - 1 : this.slides.length - 1, manual);
	},

	showNextSlide: function(manual) {
		this.killExecuter();
		this.toggleSlide(this.currentSlide < this.slides.length - 1 ? this.currentSlide + 1 : 0, manual);
	},
	
	toggleSlide: function(slideNo, manual) {
		
		if (!this.sliding) {
			
			this.sliding = true;
			
			var oldSlide = this.currentSlide;
			
			if (this.currentSlide != null) {
				
				jQuery(this.slides[this.currentSlide]).animate({opacity: 'toggle'}, this.options.fadeDurationOneStep, 'linear', function() {
					jQuery(Carousel.previewElements[oldSlide]).animate({opacity: '0'}, Carousel.options.previewMarkerDuration, 'linear');
					
					Carousel.showSlide(slideNo, manual);
				});
			} else {

				this.showSlide(slideNo, manual);
			}
			jQuery(this.previewElements[slideNo]).animate({opacity: '1'}, this.options.previewMarkerDuration, 'linear');
		}
	},
	
	showSlide: function(slideNo, manual) {
		
		this.currentSlide = slideNo;
				
		jQuery(this.slides[slideNo]).fadeIn(this.options.fadeDurationOneStep, function() {
			Carousel.initNextShow(manual);
			Carousel.sliding = false;
		});	
	},
	
	navButtonHandler: function(ev, direction) {
		if (direction > 0) {
			this.showNextSlide(true);
		} else if (direction == -1) {
			this.showPrevSlide(true);
		}
		ev.stopImmediatePropagation();
	}
};

jQuery(document).ready(function(){
	Carousel.initialize();
});