Utils.Hint = function() {
  return {
    CreateHintWindow: function() {
    	var hintWindow = document.createElement('DIV');
    	hintWindow.setAttribute('style', 'position: absolute; background: #FEFEFE; padding: 1px; display: none');
    	hintWindow.setAttribute('id', 'hintWindow');
    	
    	hintWindow.innerHTML = '<div id="hintText" style="background: #FEFEFE; padding: 5px;' 
    		+ 'border: 1px solid #CCCCCC; font: 12px Arial"></div>';
    	document.body.appendChild(hintWindow);
    },
    
    ShowHint: function(elem) {
    	if (typeof elem == 'string') elem = $(elem);
    	if (!elem) return;
    	
    	var hint_text = elem.getAttribute('hint');
    	if (!hint_text) return;
    	
    	if (!$('hintWindow')) Utils.Hint.CreateHintWindow();
    	
    	var pos = Utils.Common.absolute_position(elem);
    	var maxLeft = Utils.Measure.windowWidth() - 255;
    	if (pos.left > maxLeft) pos.left = pos.left - 250;
    	
    	$('hintWindow').style.left = pos.left + 'px';
    	$('hintWindow').style.top = pos.top + elem.offsetHeight + 'px';
    	$('hintWindow').style.width = '250px';
    	
    	$('hintText').innerHTML = hint_text;
    	$('hintWindow').style.display = 'block';
    },
    
    HideHint: function() {
    	if (!$('hintWindow')) return;
    	$('hintWindow').style.display = 'none';
    },
    
    add_listeners: function() {
    	var list = document.getElementsByTagName('hint');
    	for (var i=0; i<list.length; i++) {
    		Utils.Event.add(list[i].getAttribute('element'), "mouseover", Utils.Hint.ShowHint.bind(this, list[i].getAttribute('element')), false);
    	}
    }
    
  }
}();

Utils.Init.observe(Utils.Hint.add_listeners);