/**
 * @author Ry Racherbaumer
 */

//
// create closure
//
(function($) {
	//
	// private variable to hold preloaded images
	//
	var preloadImages = [];
	//
	// plugin definition
	//
 	$.fn.rollover = function(options) {
		// build main options before element iteration
		var opts = $.extend({}, $.fn.rollover.defaults, options);
		// iterate and reformat each matched element
		return this.each(function() {
			// get the rollover element
			$this = $(this);
			// bind mouseover event to the image
			$this.bind('mouseover', function() {
				// let's see if the rolloverCSS object has any properties
				var pcount = 0;
				for (p in opts.rolloverCSS) {
					pcount++;
				}
				// if the rolloverCSS object has properties,
				// apply the styles				
				if (pcount > 0) {
					$(this).css(opts.rolloverCSS);
				}				
				// check to see if we're rolling over an <a> tag
				if (opts.isanchor) {
					// find the <img> within the <a>
					// NOTE: this assumes there is only 1 child <img>
					$img = $(this).children('img');
				// if not, just use (this) to get the image
				} else {
					// get the jQuery object of the image
					$img = $(this);
				}
				// make sure the image doesn't contain the suffix
				if($img.attr("src").indexOf(opts.suffix) == -1) {
					// create new image source string
					var newSrc = $img.attr("src").replace(opts.extension, opts.suffix+opts.extension);
					// replace the src attribute of the image
					$img.attr("src", newSrc);
				}				
			});
			// bind mouseout event to the image
			$this.bind('mouseout', function() {
				// let's see if the rolloutCSS object has any properties
				var pcount = 0;
				for (p in opts.rolloutCSS) {
					pcount++;
				}
				// if the rolloutCSS object has properties,
				// apply the styles				
				if (pcount > 0) {
					$(this).css(opts.rolloutCSS);
				}	
				// check to see if we're rolling over an <a> tag
				if (opts.isanchor) {
					// find the <img> within the <a>
					// NOTE: this assumes there is only 1 child <img>
					$img = $(this).children('img');
				// if not, just use (this) to get the image
				} else {
					// get the jQuery object of the image
					$img = $(this);
				}				
				// make sure the image's source contains the suffix
				if($img.attr("src").indexOf(opts.suffix+opts.extension) != -1) {				
					// create new image source string
					var oldSrc = $img.attr("src").replace(opts.suffix+opts.extension, opts.extension);
					// replace the src attribute of the image
					$img.attr("src", oldSrc);
				}
			});	
			// if the preload option is true, preload the image
			if (opts.preload === true) {
				// check to see if we're rolling over an <a> tag
				if (opts.isanchor) {
					// find the <img> within the <a>
					// NOTE: this assumes there is only 1 child <img>
					$img = $this.children('img');
				// if not, just use (this) to get the image
				} else {
					// get the jQuery object of the image
					$img = $this;
				}
				// get the index of the new image
				var current = preloadImages.length;
				// create a new <img> element
				preloadImages[current] = $('<img>');
				// assign 'src' to new <img>
				preloadImages[current].attr('src', $img.attr('src').replace(opts.extension, opts.suffix+opts.extension));
			}
		});
	};
	//
	// plugin defaults
	//
	$.fn.rollover.defaults = {
		// is the image rollover in an <a> tag?
		// set this to true if you apply the rollover
		// to an <a> tag as opposed to an <img>
		// this assumes that there is only 1 <img> child
		isanchor: false,
	 	// file extension to use for images
		extension: '.gif',
		// image name suffix for rollover state
		// i.e. link.gif > link_over.gif
		suffix: '_over',
		// preload rollover image?
		preload: true,
		// CSS to apply on rollover
		rolloverCSS: {},
		// CSS to apply on rollout
		rolloutCSS: {}
	};
//
// end of closure
//
})(jQuery);