(function($){

	$.fn.slideshow = function( option ) {
	
		option = $.extend( {}, $.fn.slideshow.option, option );
		
		return this.each(function(){

			$(this).children().wrapAll('<div class="' + option.container + '"></div>');
			
			var e = $(this),
				c = e.children(),
				ar = c.children(),
				total = ar.length,
				rotate, $exactive, $exactive, nav = [], action = false, loaded = total, interval_auto, curitem;

			if (total < 2) {
				return false;
			};

			ar.each(function() {
				var el = $(this);
				if(el.find('img').length) {
					var img = new Image();
					$(img).load(function() {
						loaded -= 1;
						if(!loaded) init();
					});
					img.src = el.find('img').attr('src');
				} else {
					loaded -= 1;
					if(!loaded) init();
				};

			});
			
			
			function init() {
				e.append('<div class="slider-nav"><a href="#" class="' + option.prev + '">Prev</a><a href="#" class="' + option.next + '">Next</a><div class="slider-nav-dot"></div></div>');
				
				c.css({'position' : 'relative', 'overflow' : 'hidden'});
				ar.css({'position' : 'absolute', 'top' : '0', 'display' : 'none'}).first().css({'position' : 'relative', 'display' : 'block'}).addClass('active');

				if(option.pagination) {
					ar.each(function(i, v) {
						$(this).attr('rel', i);
						nav.push($('<span'+((!i)?' class="active"':'')+' rel="'+i+'">'+(i+1)+'</span>'));
					
					});
					$('.slider-nav-dot', e).append(nav);

				};
				rotate = function(direct, n){
					if(!action) {

						$exactive = ar.filter('.active');
						if(typeof n == 'undefined') $active = (direct<0) ? $exactive.next() : $exactive.prev();
						else $active = $(ar[n]);
						if($active.length == 0) {
							$active = (direct<0) ? ar.first() : ar.last();
						};
						var i_widht = $exactive.outerWidth();

						$exactive.removeClass('active').css({'left' : '0%'}).stop(true).animate({
							left: (100*direct)+'%'
						}, option.sliderSpeed, 'swing', function(){
							$exactive.css({'position' : 'absolute', 'display' : 'none'});
							action = false;
						});
						$active.addClass('active').css({'left' : (-100*direct)+'%', 'display' : 'block', 'width' : i_widht}).stop(true).animate({
							left: '0%'
						}, option.sliderSpeed, 'swing', function(){
							$active.css({'position' : 'relative', 'width' : ''});
							if(option.pagination) $(nav[$active.attr('rel')]).addClass('active').siblings().removeClass('active');
							action = false;

						});

						action = true;
							$('.current').html('<span class="cur-item">1</span>' +'/'+ total);
							var para = $(".slider-nav-dot span.active").clone();
							$('.cur-item').html(para);
					};		

				};
				$('.' + option.prev, e).click(function() {
					clearInterval(interval_auto);
					rotate(1);
					return false;
				});
				$('.' + option.next, e).click(function() {
					clearInterval(interval_auto);
					rotate(-1);
					return false;

				});



				if(option.pagination) {
					$.each(nav, function() {
						$(this).click(function() {
							clearInterval(interval_auto);
							var cur = ar.filter('.active').attr('rel');
							var n = parseInt($(this).text())
							if(n != cur) rotate((n > cur)?-1:1, n);
							return false;

						});

					});
				};
				if(option.autoplay) {
					$(document).ready(function() {
						interval_auto = setInterval( auto, option.autoplaySpeed );
						function auto() {
							rotate(-1);
						};
					});
				};

			};

		});


	};

	$.fn.slideshow.option = {
		container: 'slider-container',
		next: 'slider-nav-next',
		prev: 'slider-nav-prev',
		pagination: true,
		autoplay: false,
		autoplaySpeed: 5000,
		sliderSpeed: 300
	};
})(jQuery);