/*
 * @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
			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);