$(document).ready(function(){
	$('#slideshow').slider({interval: 4000});
	
	$('#slide_one').click(function() {
		$('#slideshow').slider('slide', 0, true);
	});
		
	$('#slide_two').click(function() {
		$('#slideshow').slider('slide', 1, true);
	});

	$('#slide_three').click(function() {
		$('#slideshow').slider('slide', 2, true);
	});	
});
	
(function( $ ){
	var sliderElement = 'a';
	var sliderButtonElement = 'li';
	var buttonIdPrefix = '-navigation';

	var sliderData = {
		interval: 5000,
		intervalId: '',
		elementId: '',
		buttonElementId: '',
		target: ''
	}
	
	var methods = {
		init : function( options ) {
			return this.each(function(){
				var $this = $(this);
				var data = $this.data('slider');
				
				var customSliderData = $.extend(sliderData, { target : $this, elementId : $this.attr('id'), buttonElementId : $this.attr('id') + buttonIdPrefix }, options);
				
				if ( ! data ) {
					$(this).data('slider', customSliderData);
				}
				
				$('#' + $this.data('slider').elementId).slider('startSlide', $this.data('slider').interval);
			});
		},
		
		slideSwitch : function () {
			var $this = $(this);
			var data = $this.data('slider');
		
			var $active = $('#' + data.elementId + ' ' + sliderElement + '.active');
			var $activeButton = $('#' + data.buttonElementId + ' ' + sliderButtonElement + '.active');

			if ( $active.length == 0 ) $active = $('#' + data.elementId + ' ' + sliderElement + ':last');
			if ( $activeButton.length == 0 ) $activeButton = $('#' + data.buttonElementId + ' ' + sliderButtonElement + ':last');

			var $next =  $active.next().length ? $active.next()
				: $('#' + data.elementId + ' ' + sliderElement + ':first');
			var $nextButton =  $activeButton.next().length ? $activeButton.next()
				: $('#' + data.buttonElementId + ' ' + sliderButtonElement + ':first');

			$active.addClass('last-active');

			$nextButton.addClass('active');
			$activeButton.removeClass('active');
			
			$next.css({opacity: 0.0})
				.addClass('active')
				.animate({opacity: 1.0}, 1000, function() {
					$active.removeClass('active last-active');
			});
		},
		
		setActiveSlide : function (next, nextButton) {
			var $this = $(this);
			var data = $this.data('slider');
		
			var $active = $('#' + data.elementId + ' ' + sliderElement + '.active');
			var $activeButton = $('#' + data.buttonElementId + ' ' + sliderButtonElement + '.active');

			if ( $active.length == 0 ) $active = $('#' + data.elementId +  ' ' + sliderElement + ':last');
			if ( $activeButton.length == 0 ) $activeButton = $('#' + data.buttonElementId + ' ' + sliderButtonElement + ':last');

			$active.addClass('last-active');
			$(nextButton).addClass('active');
			$activeButton.removeClass('active');

			if( ! $(next).hasClass('active') ) {
				$(next).css({opacity: 0.0})
					.addClass('active')
					.animate({opacity: 1.0}, 1000, function() {
						$active.removeClass('active last-active');
				});
			}
		},
		
		slide : function (index, stopInterval) {
			return this.each(function(){
				var $this = $(this);
				var data = $this.data('slider');
				
				var $next = $('#' + data.elementId + ' ' + sliderElement).get(index);
				var $nextButton = $('#' + data.buttonElementId + ' ' + sliderButtonElement).get(index);
			
				if($next) {
					methods.setActiveSlide.call($this, $next, $nextButton);
				} else {
					$.error( 'No picture in #' +  elementId + ' with index ' + index + ' on jQuery.slider' );
				}
			
				if(stopInterval && stopInterval == true) {
					methods.stopSlide.call($this);
				}
			});
		},
		
		startSlide : function () {
			return this.each(function(){
				var $this = $(this);
				var data = $this.data('slider');
				
				var determinedIntervalId;

				if( data.interval ) {
					determinedIntervalId = setInterval( function() { methods.slideSwitch.call($this); }, data.interval );
				}

				var updatedData = $.extend(data, {intervalId : determinedIntervalId});
				$('#' + updatedData.elementId).data('slider', updatedData);
			});
		},
		
		stopSlide : function () {
			return this.each(function(){
				var $this = $(this);
				var data = $this.data('slider');
				clearInterval(data.intervalId);
			});
			
		}
	}

	$.fn.slider = function( method ) {
		if ( methods[method] ) {
		  return methods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));
		} else if ( typeof method === 'object' || ! method ) {
		  return methods.init.apply( this, arguments );
		} else {
		  $.error( 'Method ' +  method + ' does not exist on jQuery.slider' );
		}  
	};
  
})( jQuery );