(function($) {
	
	$.fn.preloader = function(variables) {
		
		var defaultValues = {
			fadeInTime: 1000,
			delay: 0
			};
		
		var options = $.extend( defaultValues, variables );
		
		return this.each( function() {	
		
			var imageContainer = $(this),
				images = imageContainer.find('img').css({opacity:0, visibility:'hidden'}),
				imagesCount = images.length,
				coordinates = new Array();				
								
			imageContainer.operations = {	

				preload: function()	{	
											
					images.each( function(i, event) {
						
						var image = $(this),
							imagesPosition = image.position();
							
						coordinates.push(imagesPosition);
												
						if( event.complete == true ) {	
						
							imageContainer.operations.showImage(image);
							
						} else {
							
							image.bind('load error',{currentImage: image}, imageContainer.operations.showImage);
							
						}
						
					});
					
					return this;
					
				},
									
				showImage: function(image) {
					
					imagesCount --;
					
					if( image.data.currentImage != undefined ) image = image.data.currentImage;
					
					if ( options.delay <= 0 ) image.css('visibility','visible').animate({opacity:1}, options.fadeInTime);
										 
					if( imagesCount == 0 ) {
					
						if( options.delay > 0 ) {
						
							images.each( function(i, event) {	
								
								var image = $(this);
								
								image.css({opacity:0, visibility:'hidden',display:'block', position:'absolute', left: '-200px', top: '-200px'});
								
								setTimeout( function() {
									
									image.css({visibility : 'visible'}).animate({opacity:1, top: coordinates[i].top + 'px', left: coordinates[i].left+'px'}, options.fadeInTime, function() {
										
										$(this).css({top: '8px', left: '8px', padding: 0}).parent().css({position:'relative', backgroundImage:'none'}).hover( 
											function(){
												$(this).css( { backgroundImage: 'url(images/zoom.png)' });
												$('img', this).stop().animate( { opacity:'.5' });
											}, 
											function(){
												$('img', this).stop().animate( { opacity:'1' });
												$(this).css( { backgroundImage: 'none' });
											}
										);
										
									});
								},
								
								options.delay * (i+1));
								
							});

						}
						
					}
					
				}

			};
				
			imageContainer.operations.preload();
			
		});
		
	};
	
})(jQuery);
