/**
  *
  * Custom jQuery Preloading Funtions
  *
  */

(function($) {
		var cache = [];
		// Arguments are image paths relative to the current page.
		jQuery.preLoadImages = function() {
			var args_len = arguments.length;
			for (var i = args_len; i--;) {
				var cacheImage = document.createElement('img');
				cacheImage.src = arguments[i];
				cache.push(cacheImage);
			}
		}
	})(jQuery)
	
	var path = jQuery("meta[name=temp_url]").attr('content');
	jQuery.preLoadImages(path + "/style/img/ajax-loader.gif");
		
	// ajax page GET function
	jQuery(document).ready(function() {
		
		// grab the images
		var $images = jQuery('span.img img');
		var srcs = new Array();		
		var i = 0;
		
		$images.each(function () {
			srcs[i] = jQuery(this).attr('src');
			i++;
		});
				
		// number of images
		var len = srcs.length;
		
		
		// remove them from DOM to prevent normal load
		jQuery('.img').remove();
		
		displayImages(0, len);
		
		function displayImages(index, len) {
		
			if (index < len) {
			
				var img = new Image();	
				
			 	// wrap our new image in jQuery, then:
			 	jQuery(img).load(function () { // once the image has loaded, execute this code
		     
		     	jQuery(this).css({ display : 'none'});
		     	jQuery('#loader_' + index).append(this);
		     	jQuery('#loader_' + index).removeClass('img_loading');
		     	jQuery(this).fadeIn(1000);
		     	
		  		})
		    
		  		// *finally*, set the src attribute of the new image to our image
		  		.attr('src', srcs[index]);
				
				displayImages((index + 1), len);
				
			
			}
			
		}
	
});