(function($) {	
	/* Makes an entire box "clickable".  So whenever you 
	click anywhere in the element it goes to a new page.  
	The urlExtractor determines to which page the click goes.
	By default it uses the href tag of an anchor with the class 
	of "clickTarget" inside the click area.
	*/
	$.fn.clickArea = function(settings) {
		settings = jQuery.extend({ 
			targetClass:"clickTarget",
			urlExtractor:function(t){return extractHref(t);},
			overClass:""
		}, settings);		
		function findTarget(c) { return $("."+settings.targetClass, c); }
		function extractHref(t) { return t.attr("href")||""; }
		function go(a) {
			var url=settings.urlExtractor(findTarget(a));
			if(url){window.location = url;}
		}
		
		var area = $(this).each(function() { 
			var box = $(this);
			box.click(function() { go(box); });
		});
		if(settings.overClass) { 
			area = area.hover(function(){$(this).addClass(settings.overClass);},
				function(){$(this).removeClass(settings.overClass);});
		}
		return area;
	};
	$.fn.navRollover = function(settings) {
		settings = jQuery.extend({ 
			overClass:"over",
			extension:".png",
			suffix:"-over",
			over:function(t){toggleContainer(t);},
			out:function(t){toggleContainer(t);}
		}, settings);		
		function toggleImage(img) {			
			var src = img.attr("src")||" ";
			var ext = settings.extension;
			var suffixed = settings.suffix + settings.extension;
			if(src.indexOf(suffixed) > -1) {
				src = src.replace(suffixed, ext);// Remove the suffix
			} else {
				src = src.replace(ext, suffixed);// Append the suffix
			}
			img.attr("src", src);
		}		
		function toggleContainer(box) {
			box.toggleClass(settings.overClass);
			toggleImage($("img", box));
		}
		
		return $(this).hover(function() { settings.over($(this)); }, 
			function() {settings.out($(this));
		});
	}; // nav hover
	$.fn.selectedValues = function() {
		var results = [];
		$("option:selected", this).each(function(i) {
			results.push(this.value);
		});
		return results;
	};

	$.fn.statePicker = function(settings) {
		settings = jQuery.extend({
			uri:"dealers.aspx?state=",
			extractor:function(list){return list.selectedValues();},
			onChange:function(list){
				var state = settings.extractor(list);
				if(state && state[0]){ window.location=settings.uri+state[0]; }
			}
		}, settings);
		return $(this).change(function() { settings.onChange($(this)); });
	}; // state picker		
	$(function() {
		// makes the state picker load dynamically as not to show up in the source for spiders
		$.get("state-picker.aspx", {}, function(response) { 
			$(".findADealer").append(response);		
			$(".statePicker").each(function() {
				var override = $(".override", this).val();
				var settings = override ? {uri:override, className:"selectbox-wrapper"} : {};
				$("select", this).statePicker(settings).selectbox();
			});
		});
		
		$(".mainNavigation a").not(".current").navRollover();
		$(".selectbox-wrapper").css({height:200});// the height is for IE6, setting in stylesheet will imitate "max-height"
		$(".clickArea").clickArea();
	});
})(jQuery);