/*****************************************************************
 * 
 * jQuery.hoverSwap.js
 * 
 * (c) WebResource Internet Technology, 2010
 * 
 * By: Ken Andrews
 * 
 * Written: 2010-03-18
 * 
 * Revision: 1
 * 
 *****************************************************************/

(function($)
{
	var opts = {};
	var preloaderImages = [];
	var preloaderCache = [];
  
	//
	// Main Plugin Entry Point
	//
	$.fn.hoverSwap = function( options )
	{
		opts = $.extend( {}, $.fn.hoverSwap.defaults, options );
		
		// Loop through all the objects in the selector
		this.each( function() {
			var $this = $(this);
			
			switch( opts.mode )
			{
				
				case 'image':
					addImageSwap($this);
				break;				
				
				case 'class':
					addClassSwap($this);
				break;
				
				case 'background':
					addBackgroundSwap($this);
				break;	
			};
			
		});
		
		// preload the images HERE
		preloadImages( preloaderImages );
		return this;

	};
	
	//
	// Function: addBackgroundSwap
	//
	function addBackgroundSwap(elem)
	{
		
		// first, grap the src, calcualte the hover img and add it to the preloader
		var imgSrc = elem.css('background-image');
		
		// remove url(...) from the path
		imgSrc = imgSrc.replace( /url\(\s*['|"]*(.+?)['|"]*\s*\)/i, "$1" );
		
		// cut up the src to get the extension, and the filename respectively
		hoverImgSrc = getHoverSrc(imgSrc);
		
		elem.data("overSrc", "url( " + hoverImgSrc + ")")
		elem.data("origSrc", elem.css('background-image')) // NB: store the -original- path here (it needs the url(...))
		
		// add to the preloader
		preloaderImages.push(hoverImgSrc);
		
		elem.hover(
			// Over
			function(obj)
			{
				$(this).css( 'background-image', $(this).data( 'overSrc' ) );
			},
			// Out
			function(obj)
			{
				$(this).css( 'background-image', $(this).data( 'origSrc' ) );
			}
		
		);
	};
	
	//
	// Function: addClassSwap
	//
	function addClassSwap(elem)
	{
		elem.hover(
			// Over
			function ()
			{
				$(this).addClass(opts.overSuffix);				
			},
			// Out
			function ()
			{
				$(this).removeClass(opts.overSuffix);
			}
		);
	};
	
	//
	// Function: addImageSwap
	// Notes: Preloads the image, and applies the metadata to the class so the swap can be made
	// 	Also creates the hover() event 
	//
	function addImageSwap(img)
	{
		
		// first, grap the src, calcualte the hover img and add it to the preloader
		var imgSrc = img.attr('src');
		
		// cut up the src to get the extension, and the filename respectively
		hoverImgSrc = getHoverSrc(imgSrc);
		
		img.data("overSrc", hoverImgSrc)
		img.data("origSrc", imgSrc)
		
		// add to the preloader
		preloaderImages.push(hoverImgSrc);
		
		if ( img.hasClass(opts.parentEventClass) )
		{
			img.parent().hover( 
				// over
				function(obj) {
					$(img).attr( 'src', $(img).data( 'overSrc' ) );
				},
				function(obj) {
					$(img).attr( 'src', $(img).data( 'origSrc' ) );
				}
			);
		}
		else
		{
			img.hover(
				// Over
				function(obj)
				{
					$(this).attr( 'src', $(this).data( 'overSrc' ) );
				},
				// Out
				function(obj)
				{
					$(this).attr( 'src', $(this).data( 'origSrc' ) );
				}
			
			);
		}	
	};
	
	function getHoverSrc(imgSrc)
	{
		var imgSrcExt = imgSrc.substring( imgSrc.lastIndexOf('.'), imgSrc.length );
		var imgSrcName = imgSrc.substring( 0, imgSrc.length - imgSrcExt.length );
		
		// reconstruct the hover image, and store it & the original in data()
		return imgSrcName + "_" + opts.overSuffix + imgSrcExt;
	};
	
	// Arguments are image paths relative to the current page.
	function preloadImages( images ) 
	{
		var args_len = images.length;
		for (var i = args_len; i--;) {
			var cacheImage = document.createElement('img');
			cacheImage.src = images[i];
			preloaderCache.push(cacheImage);
		}
	};
	
	//
	// Default Options
	//
	$.fn.hoverSwap.defaults = {
		mode: 'image',
		overSuffix: 'hvr',
		parentEventClass: 'hover_on_a'
	};
	
})(jQuery);