GY.placeholder = (function(parent, $){
	
	var self = parent.placeholder = parent.placeholder || {};
	
	// private methods
	var isSupported = function() {
		return 'placeholder' in document.createElement('input');
	};
	
	self.init = function(target, options) {
		this.target = $(target);
		this.options = $.extend({
			focusClass: 'focus', // CSS class to set on target on focus
			force: false, // force the input field to use fallback solution? Useful for testing
			placeHolderClass: 'placeholder' // CSS class for default (placeholder) styling
		}, options || {});
		
		// check if we need to fallback from placeholder attribute
		if(!isSupported() || this.options.force === true) {
			// if so call fallback method
			this.fallback();
		}
		
	};
	
	self.fallback = function() {
		// read placeholder attribute, if it exists set the value of the input
		var placeholder = this.target.attr('placeholder');
		if(placeholder) {
			this.target.val(placeholder);
			/**
			 * events
			 */
			this.target.bind('focus', function(e) {
				self.setFocus($(this), placeholder);
			});
			
			this.target.bind('blur', function(e) {
				self.setBlur($(this), placeholder);
			});
			
		}
	};
	
	// set blur on element
	self.setFocus = function(el, placeholder) {
		el.addClass(this.options.focusClass);
		if(el.val() === placeholder) {
			el.removeClass(this.options.placeholderClass);
			el.val('');
		}
	};
	
	// do stuff on blur
	self.setBlur = function(el, placeholder) {
		var val = el.val();
		el.removeClass(this.options.focusClass);
		if(val === '') {
			el.addClass(this.options.placeholderClass);
			el.val(placeholder);
		}
	};
	
	return self;
	
})(GY || {}, jQuery);