(function($){

function imgsLoader( srcs, loop ) {
	srcs = srcs.concat();
	var i = 0, n = 0, l = srcs.length,
		images = [], stack = [];
	
	function loadNext() {
		var img = new Image();
		images.push( img );
		img.onload = onload;
		img.src = srcs[n];
	}
	
	function onload() {
		if ( i >= l && loop ) {
			i = 0;
		}
	
		if ( i < ++n && stack.length ) {
			stack.shift()( srcs[i++], i, l );
		}
		
		if ( n < l ) {
			loadNext();
		}
	}
	
	l && loadNext();
	
	return function( cb ) {
		if ( i >= l && loop ) {
			i = 0;
		}
		
		if ( i < n ) {
			cb( srcs[i++], i, l );
		
		} else if ( i < l ) {
			stack.push( cb );
		
		} else {
			images = null;
			return false;
		}
		
		return true;
	};
}

	function getImgSrcs( elem ) {
		return $(elem).attr('rel').split(' ');
	}

	$.fn.imgSlider = function( options ) {
	
		options = $.extend({
			slices: 25,
			animSpead: 500,
			pauseTime: 3000,
			getImgSrcs: getImgSrcs,
			loop: true
		}, options);
		
		return this.each(function() {
			var getNextImage = imgsLoader( options.getImgSrcs(this), options.loop );
				element = $(this);
			
			getNextImage(function( src ) {
				var sliderWidth = element.width(),
					nSlices = options.slices,
					sliceWidth = Math.round( sliderWidth / nSlices );
			
				var slider = $('<div class="img-slider"/>')
					.css({
						position: 'relative',
						width : sliderWidth,
						height: element.height(),
						background: 'url(' + src + ') no-repeat'
					});
					
				for ( var i = 0; i < nSlices; ++i ) {
					$('<div class="img-slice"/>').css({
						opacity: 0,
						display: 'block',
						position: 'absolute',
						zIndex: 50,
						height: '100%',
						left: sliceWidth * i,
						width: i === nSlices - 1 ? sliderWidth - sliceWidth * i : sliceWidth
					})
					.appendTo( slider );
				}
				
				var slices = slider.find('.img-slice');
				
				element.replaceWith( slider );
				
				setTimeout(function() {
					getNextImage(function next( src ) {
						var time = 0, nToGo = nSlices;
					
						slices.css({
							height: 0,
							opacity: 0
						})
						.each(function( i ) {
							$(this)
								.css( i % 2 ? 'bottom' : 'top', 0 )
								.css( 'background', 'url(' + src + ') no-repeat -' + (i * sliceWidth) + 'px 0%' )
								.delay( 100 + time )
								.animate( { height: '100%', opacity: 1 }, options.animSpead, ondone );
								
							time += 50;
						});
						
						function ondone() {
							if ( --nToGo === 0 ) {
								slider.css( 'background', 'url(' + src + ') no-repeat' );
								//slices.hide();
								setTimeout(function() {
									getNextImage( next );
								}, options.pauseTime);
							}
						}
					});
				}, options.pauseTime );
			});
		});
	
	};
	
})(jQuery);