// 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() + parseInt($this.css('border-left-width')) + parseInt($this.css('border-right-width')),
			inputHeight = $this.height() + parseInt($this.css('border-top-width')) + parseInt($this.css('border-bottom-width')),
			
			//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 for='+ inputId +'>'+ placeholderText + '</label>');
			
			//stuff in some calculated values into the placeholderCSS object
			options.placeholderCSS['width'] = inputWidth;
			options.placeholderCSS['height'] = inputHeight;
			options.placeholderCSS['line-height'] = inputHeight + 'px';
			options.placeholderCSS['font-size'] = $this.css('font-size');
			options.placeholderCSS['font-weight'] = $this.css('font-weight');
			options.placeholderCSS['font-family'] = $this.css('font-family');
			options.placeholderCSS['padding-top'] = $this.css('padding-top');
			options.placeholderCSS['padding-left'] = $this.css('padding-left');
			options.placeholderCSS['padding-right'] = $this.css('padding-right');
			options.placeholderCSS['padding-bottom'] = $this.css('padding-bottom');
			options.placeholderCSS['margin-top'] = $this.css('margin-top');
			options.placeholderCSS['margin-left'] = $this.css('margin-left');
			options.placeholderCSS['margin-right'] = $this.css('margin-right');
			options.placeholderCSS['margin-bottom'] = $this.css('margin-bottom');

			// adjust position of placeholder 
			options.placeholderCSS.left = (isOldOpera && (this.type == 'email' || this.type == 'url')) ? '11%' : o_left;
			placeholder.css(options.placeholderCSS);
			
			
			// IE 9- fix for clicking the label
			placeholder.click(function() {
				$this.focus();
			});

			//place the placeholder if the input is empty
			if (!inputVal){
				$this.wrap(options.inputWrapper);
				$this.attr('id', inputId).after(placeholder);
			};

			//hide placeholder on focus
			$this.focus(function(){
				if (!$.trim($this.val())){
					$this.next().hide();
				};
			});

			//show placeholder if the input is empty
			$this.blur(function(){
				if (!$.trim($this.val())){
					$this.next().show();
				};
			});
		});
	};

	//expose defaults
	$.fn.placeholder.defaults = {
		//you can pass in a custom wrapper
		inputWrapper: '<div class="_input_placeholder" style="position:relative"></div>',

		//more or less just emulating what webkit does here
		//tweak to your hearts content
		placeholderCSS: {
			'font':'0.75em sans-serif', 
		//	'color':'#9a9a9a', 
			'position': 'absolute', 
			'left':'0',
			'top':'0', 
			'overflow-x': 'hidden'
		}
	};
})(jQuery);