/*
 * @author     Andrei Eftimie
 * @email      andrei@eftimie.com
 * 
 * Required Markup
 * ---------------
 * <div class="div">                                //or any other wrapper
 *   <label for="inputID">Field Name</label>        //will be used as the input value
 *   <input type="text" id="inputID">               //text input
 * </div>
 * 
 * You can have as many pairs as you like.
 * If you need it globally, you can just call $('body').emptyOnFocus();
 * 
 * Calling
 * -------
 * $('.div').emptyOnFocus();          //It doesn't have any options at this time
 * 
 */

(function($){
	$.fn.emptyOnFocus = function(options) {
	
		var defaults = {
			//no options at this time
		};
		
		var options = $.extend(defaults, options);
		
	    return this.each(function() {
			
			//Setting the scope
			var wrapper = $(this); 
			
			//Getting a list of labels 
			var label = $('label',wrapper);
			
			//Iteratin through each label, getting the input, the text, and making the magic
			label.each(function(i){
				
				//Getting the related input
				var id = $(this).attr('for');
				
				if (document.getElementById(id)) {
				
					var input = $('#'+id);
				
					//Getting the text from the label
					var text = $(this).text();
				
					input
					//We populate the input with the label value
					.val(text)
					//Setting the focus and blur events
					.focus(
						function(){
							if ($(this).val() == text) {
								$(this).val('');
							}
						}
					)
					.blur(
						function(){
							if ($(this).val() == '') {
								$(this).val(text);
							}
						}
					);
				
					//We hide the label
					$(this).hide();
				}
				
			});
		})
	};
})(jQuery);