// HTML5 placeholder plugin version 1.01
// Copyright (c) 2010-The End of Time, Mike Taylor, http://miketaylr.com
// MIT Licensed: http://www.opensource.org/licenses/mit-license.php
//
// Enables cross-browser HTML5 placeholder for inputs, by first testing
// for a native implementation before building one.
//
//
// USAGE: 
//$('input[placeholder]').placeholder();

// <input type="text" placeholder="username">
;(function($){
  //feature detection
  var hasPlaceholder = 'placeholder' in document.createElement('input');
  
  //sniffy sniff sniff -- just to give extra left padding for the older
  //graphics for type=email and type=url
  var isOldOpera = $.browser.opera && $.browser.version < 10.5;

  $.fn.placeholder = function(options) {
	
    //merge in passed in options, if any
    var options = $.extend({}, $.fn.placeholder.defaults, options),
    //cache the original 'left' value, for use by Opera later
    o_left = options.placeholderCSS.left;
  
    //first test for native placeholder support before continuing
    //feature detection inspired by ye olde jquery 1.4 hawtness, with paul irish
    return (hasPlaceholder) ? this : this.each(function() {
    
      //local vars
      var $this = $(this),
          inputVal = $.trim($this.val()),
          inputWidth = $this.width(),
          inputHeight = $this.height(),

			extra = ($(this).is('textarea'))?'textarea ':'';

          //grab the inputs id for the <label @for>, or make a new one from the Date
          inputId = (this.id) ? this.id : 'placeholder' + (+new Date()),
          placeholderText = $this.attr('placeholder'),
          placeholder = $('<label class="'+(extra)+'" for='+ inputId +'>'+ placeholderText + '</label>');
        
          //stuff in some calculated values into the placeholderCSS object
          options.placeholderCSS['width'] = inputWidth;		
 		  options.placeholderCSS['padding-top'] = $(this).css('paddingTop');
 		  options.placeholderCSS['padding-left'] = $(this).css('paddingLeft');
 		  options.placeholderCSS['padding-bottom'] = $(this).css('paddingBottom');
 		  options.placeholderCSS['padding-right'] = $(this).css('paddingRight');

          // adjust position of placeholder 
//          options.placeholderCSS.left = (isOldOpera && (this.type == 'email' || this.type == 'url'))?'11%' : o_left;
          placeholder.css(options.placeholderCSS).addClass('placeholder_label');

    
      //place the placeholder if the input is empty
      if (!inputVal){
		$this.wrap(options.inputWrapper);
		$this.attr('id', inputId).before(placeholder);
      };
    
      //hide placeholder on focus
      $this.focus(function(){
        if (!$.trim($this.val())){
         $this.prev().hide();
        };
      });
    
      //show placeholder if the input is empty
      $this.blur(function(){
        if (!$.trim($this.val())){
          $this.prev().show();
        };
      });
    });
  };
  
  //expose defaults
  $.fn.placeholder.defaults = {
    //you can pass in a custom wrapper
    inputWrapper: '', //'<span style="float:left;"></span>',
  
    //more or less just emulating what webkit does here
    //tweak to your hearts content
    placeholderCSS: {
      'color':'#bababa', 
      'position': 'absolute', 
      'overflow-x': 'hidden'
    }
  };
})(jQuery);