/* ------------------------------------------------------------
 * PROJECT        : 
 * FILENAME       : jq.toggleActive.js
 * ------------------------------------------------------------
 * LAST UPDATED   : 11 Aug 2009
 * ------------------------------------------------------------
 * AUTHOR(S)      : Kevin Scholl (ksscholl@magellanhealth.com/)
 * ------------------------------------------------------------ */

/*

SUMMARY

This plugin is applied to one or more form elements to provide visual feedback, and toggle the default value when the specified field receives and loses keyboard focus.

OPTIONAL SETTINGS

focusBG
A string specifying the form element's background color when focused. Default value is "#EEE".

focusFG
A string specifying the form element's foreground (text) color when focused. Default value is "#000".

blurBG
A string specifying the form element's background color when not focused. Default value is "#FFF".

blurFG
A string specifying the form element's foreground (text) color when not focused. Default value is "#666".

toggleVal
Boolean indicating whether to toggle the default value of the form field as the field is cleared and loses focus. This is most useful for fields that have a full or partial default value assigned to them, such as a URL field containing "http://" by default. Default value is false.

USAGE

$("el").toggleActive();
$("el").toggleActive({ options });

where el is the form element or elements to be activated (by tag name, id, or class).

EXAMPLE

$(document).ready(function() {
		$("input:text, #el, .fields").toggleActive({;
		focusBG : "#EEE",
		focusFG : "#000",
		blurBG  : "#FFF",
		blurFG  : "#666",
		toggleVal : true
		});
	});

MINIMUM BROWSER SUPPORT

Apple Safari 3, Google Chrome 1, Microsoft Internet Explorer 6, Mozilla Firefox 3, Opera 9

*/

jQuery.fn.toggleActive = function(settings) {
	settings = jQuery.extend({
		focusBG   : "#F5F5F5",
		focusFG   : "#000",
		blurBG    : "#FFF",
		blurFG    : "#666",
		toggleVal :  false
		}, settings);
	this.each(function() {
		$(this)
			// define border color
		  .css("border","1px solid #999")
			.focus(function() {
				$(this).css({ backgroundColor: settings.focusBG, color: settings.focusFG });
				if (settings.toggleVal == true && this.value == this.defaultValue && this.value != "http://") {
					this.value = "";
					}
				})
			.blur(function() {
				$(this).css({ backgroundColor: settings.blurBG, color: settings.blurFG });
				if (settings.toggleVal == true && this.value == "") {
					this.value = this.defaultValue;
					}
				});
			// provide a little padding to select elements
      if ($(this).is("select"))
			$(this).css("padding","1px 1px 1px 0")
		});
	};