var FormElementHint = new Class({
	Implements: [Options, Events, Log],
	
	options: {
	},
	
	// Variables
	formElement: null,
	element: null,
	container: null,
	text: null,

	
	/*
	 * Initialize
	 */
	initialize: function(formElement, container, text, options)
	{
		//this.enableLog();
		this.log("FormElementHint::initialize(" + formElement + ", " + container + ", " + text + ", " + options + ")");
		
		this.log("debug hint 1");
		
		// Set options
		this.setOptions(options);
		
		this.log("debug hint 2");
		
		// Set variable
		this.formElement = formElement;
		this.container = container;
		this.text = text;
		
		this.log("debug hint 3");
		
		// Build element
		this.element = this.build();
		
		this.log("debug hint 4");
		
		if(this.formElement.getProperty('value'))
		{
			this.hide();
		}
		
		this.log("debug hint 5");
		
		// Enable
		this.enable();
		
		this.log("debug hint 6");
	},
	
	/*
	 * Reset
	 */
	reset: function()
	{
		this.log("FormElementHint::reset()");
		
		this.enable();
		this.show();
	},
	
	/*
	 * Build
	 */
	build: function()
	{
		this.log("FormElementHint::build()");
		
		this.log("debug hint::build 1");
		
		// Collect input styles
		var styles = this.formElement.getStyles('width', 'height', 'padding', 'font-size', 'text-align');
		
		var top = this.formElement.getPosition(this.container).y;
		this.log("top: " + top);
		
		var left = this.formElement.getPosition(this.container).x;
		this.log("left: " + left);
		
		var element = new Element('div', {'class': 'hint', 'text': this.text});
		
		for(var i in styles)
		{
			this.log("styles[" + i + "]: " + styles[i]);
			element.setStyle(i, styles[i]);
		}
		
		element.setStyle('top', top);
		element.setStyle('left', left);
		element.setStyle('cursor', 'text');
		
		this.container.adopt(element);
		
		return element;
	},
	
	/*
	 * Show
	 */
	show: function()
	{
		this.log("FormElementHint::show()");
		
		this.element.show();
	},
	
	/*
	 * Hide
	 */
	hide: function()
	{
		this.log("FormElementHint::hide()");
		
		this.element.hide();
	},
	
	/*
	 * Disable
	 */
	disable: function()
	{
		this.log("FormElementHint::disable()");

		this.element.addClass('disabled');
		
		this.removeEvents();
	},
	
	/*
	 * Disable
	 */
	enable: function()
	{
		this.log("FormElementHint::enable()");
		
		this.element.removeClass('disabled');
		
		this.addEvents();
	},
	
	/*
	 * Add events
	 */
	addEvents: function()
	{
		this.log("FormElementHint::addEvents()");
		
		// First remove events to prevent duplicate event calls
		this.removeEvents();
		
		this.element.addEvent('click', function(event) {
			event.preventDefault();
			this.formElement.focus();
		}.bind(this));
		
		this.formElement.addEvent('focus', function(event) {
			event.preventDefault();
			this.hide();
		}.bind(this));
		
		this.formElement.addEvent('blur', function(event) {
			event.preventDefault();

			var value = this.formElement.get('value');
			if(value == "")
			{
				this.show();
			}
			
		}.bind(this));
	},
	
	/*
	 * Remove events
	 */
	removeEvents: function()
	{
		this.log("FormElementHint::removeEvents()");
		
		this.element.removeEvents('click');
		this.formElement.removeEvents('focus');
		this.formElement.removeEvents('blur');
	},
	
	/*
	 * Show status
	 */
	showStatus: function(status)
	{
		this.log("FormElementHint::showStatus(" + status + ")");
		
		this.element.addClass(status);
	},
	
	/*
	 * Hide status
	 */
	hideStatus: function()
	{
		this.log("FormElementHint::hideStatus()");
		
		FormElement.STATUSES.each(function(status) {
			
			if(this.element.hasClass(status))
			{
				this.element.removeClass(status);
			}
			
		}, this);
	}
	
});