/*

Creates a new field hint next to a input item.



Example of how to attach the field hint to the input on load
---------------------------------------------------------------
var fh = null;
addEvent(window, 'load', function()
{
	//create the field hint
	fh = new FieldHint(document.body, 'f1');

	//attach the field hint to the input named fieldInput3
	fh.attachToInputField(document.getElementById('fieldInput3'), 'Some text here 3');
});



Example of how to show and hide the input manually
---------------------------------------------------------------
var fh = null;
addEvent(window, 'load', function()
{
	//create the field hint after the page has loaded
	fh = new FieldHint(document.body, 'f1');
});
function showFieldHint(obj, text)
{
	if(!obj) return;
	if(!fh) return;
	
	//change the field hint text
	fh.changeText(text);

	//move the field hint
	var coors = getOffsetCoordinates(obj);
	fh.move(coors.top, coors.left + obj.offsetWidth);

	//show the field hint
	fh.show();	
}
function hideFieldHint(obj)
{
	if(!fh) return;
	fh.hide();
}


*/
function FieldHint()
{
	//don't create if the page isn't loaded
	if(!document.body)
		return;

	//override the container
	this.container = (arguments.length > 0) ? arguments[0] : document.body;

	//override the ID
	this.id = (arguments.length > 1) ? arguments[1] : 'fieldhint';

	//initialize the field hint
	this.initialize();
}
//creates the field hint's HTML elements
FieldHint.prototype.create = function(id)
{	
	//create the field hint container
	var fhContainer = document.createElement('div');
	fhContainer.id = id;
	fhContainer.style.position = 'absolute';
	fhContainer.style.top = '0px';
	fhContainer.style.left = '0px';
	fhContainer.style.display = 'none';

	//create the element to hold the pointer	
	var fhPointer = document.createElement('div');
	fhPointer.className = 'fieldhint_extra';
	
	//create the element to hold the text
	var fhText = document.createElement('div');
	fhText.className = 'fieldhint_text';
	fhText.innerHTML = '';

	//append all the elements in the structure
	fhContainer.appendChild(fhPointer);
	fhContainer.appendChild(fhText);

	return fhContainer;
}
//initializes the field hint
FieldHint.prototype.initialize = function()
{
	//create the elements
	var element = this.create('fieldhint');
	
	//add the elements to the container
	this.container.appendChild(element)

	//save a reference
	this.element = element;
}
//shows the field hint next to the object when the field is focused
FieldHint.prototype.attachToInputField = function(obj, text)
{
	obj.fieldHintText = text;
	obj.fieldHint = this;

	//show the field hint on focus
	addEvent(obj, 'focus', function(e){
		var input = (window.event)? window.event.srcElement : e.target;

		//change the field hint's text
		input.fieldHint.changeText(input.fieldHintText);

		//move the container
		var coors = getOffsetCoordinates(input);
		input.fieldHint.move(coors.top, coors.left + obj.offsetWidth);

		//show the container
		input.fieldHint.show();
	});

	//hide the field hint on blur
	addEvent(obj, 'blur', function(e){
		var input = (window.event)? window.event.srcElement : e.target;
		input.fieldHint.hide();
	});
}
FieldHint.prototype.changeText = function(text)
{
	this.element.childNodes[1].innerHTML = text;
}
FieldHint.prototype.move = function(x, y)
{
	this.element.style.position = 'absolute';
	this.element.style.top = x + 'px';
	this.element.style.left = y + 'px';
}
FieldHint.prototype.show = function()
{
	this.element.style.display = '';
}
FieldHint.prototype.hide = function()
{
	this.element.style.display = 'none';
}