/**
 * @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);
				}
				// if a rollover class is specified, apply it on rollover
				if (opts.rolloverClass !== '') {
					$(this).addClass(opts.rolloverClass);
				}
				// if we're using an image, change it on rollover
				if (opts.useimage) {
					// check to see if we're rolling over an <a> tag
					if (opts.isparent) {
						// find the <img> within the <a>
						// NOTE: this assumes there is only 1 child <img>
						$img = $(this).find('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);
				}
				// if a rollover class is specified, remove it on rollout
				if (opts.rolloverClass !== '') {
					$(this).removeClass(opts.rolloverClass);
				}
				// if we're using an image, change it on rollout
				if (opts.useimage) {
					// check to see if we're rolling over an <a> tag
					if (opts.isparent) {
						// find the <img> within the <a>
						// NOTE: this assumes there is only 1 child <img>
						$img = $(this).find('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 images
			if (opts.useimage && opts.preload) {
				// check to see if we're rolling over a parent tag
				if (opts.isparent) {
					// find the <img> within the parent tag
					// NOTE: this assumes there is only 1 child <img>
					$img = $this.find('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 = {
		// whether or not the rollover uses an image
		useimage: false,
		// is the image rollover in an parent tag?
		// set this to true if you apply the rollover
		// to a parent tag as opposed to just an <img>
		// this assumes that there is only 1 <img> child
		isparent: 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: {},
		// CSS class to apply on rollover
		rolloverClass: ''
	};
//
// end of closure
//
})(jQuery);