/* Inizialize */
jQuery( function($) {

	$.banner_width =  parseInt( $(this).find('article').css('width') );
	$.banners_num = $("#slider").find('article').length;
	$.slider_width = $.banners_num*$.banner_width;
	$.invert_slider = 0;
	
	$('#slider').initSlider();
	$('#slideshow > nav').initSliderNav();
	
	$.interval;
} ) ;


( function($) { 
	
	$.fn.initSlider = function() {
		
		this.each( function() { 
			
			$self = $(this);
			
			var invert = 0;
			
			$self.css( { 'width':$.slider_width+"px" } );
			$.startSlideshow();
			
		} );
	
	}
	
	$.fn.initSliderNav = function() {
		
		this.each( function() { 
		
			var $self = $(this);
			
			$slide_nav = $("#slideshow > nav");
			
			for( var n=0; n < $.banners_num; n++ ) {
				
				$slide_nav.append( $('<a class="slide-butt"></a>') .attr('href', '#').attr('id', 'slide-butt'+n).html(n).click( function() {
									
					$("#slider").moveSlider( $(this).html() );
					$.startSlideshow();
					return false;
					
				} ) );
				
			}
			
			$('nav a:first-child').addClass('selected');
			
			
		} ); 
		
	}
	
	$.fn.moveSlider = function( banner_id ) {
		
		this.each( function() {
			
			var $self = $(this);
			
			if( banner_id != undefined ) {
				var target = -( ( parseInt( banner_id ) ) * $.banner_width );
			} else if( $.invert ) {				
				var target = parseInt( $self.css('marginLeft') ) + $.banner_width;
				banner_id = Math.abs(target/$.banner_width);
			} else { 
				var target = parseInt( $self.css('marginLeft') ) - $.banner_width;
				banner_id = Math.abs(target/$.banner_width);
			}
		
			$self.stop().animate( { marginLeft:target+'px' }, 300, 'easeInOutQuad' );

			if( target == -$.slider_width+$.banner_width ) {
				$.invert = 1;
			} else if( target == 0 ) {
				$.invert = 0;
			}
			
			setSelected(banner_id);
			
			
		} );
		
		function setSelected( banner_id ) {
			
			$('.slide-butt').removeClass('selected');
			$('#slide-butt'+banner_id).addClass('selected');
			
		}
		
	}
	
	$.startSlideshow = function() { // start / reset interval
		
		clearInterval( $.interval );
		
		$.interval = setInterval( function() {
			$("#slider").moveSlider();
		}, 7000 );
		
	}
	
} ) ( jQuery );