/*
* usage:
*	$(SELECTOR).tooltip({options});
*
*
*/

jQuery.fn.tooltip = function(options){
	settings = jQuery.extend({
		cssClass:	'tooltip',
		speed:		500,
		attribute:	'title',
		action:		'hover',
		padding:	5,
		zIndex:		'1000000'
	}, options);
	
	// default values
	var content = '';
	var ID = '';
	
	// pass in an element, and the tooltip is created and added to the body.
	function createAndAppendTooltip(elem, content){
		
		var height = jQuery(elem).outerHeight();
		var ID = jQuery(elem).attr('id') + 'tooltip';
		var top = jQuery(elem).offset().top + height + settings.padding;
		var left = jQuery(elem).offset().left;
		
		switch(settings.attribute){
			case 'src':
				var content = "<img src='" + jQuery(elem).attr('src') + "' />";
			break;
			case 'href':
			
			break;
			default:
				var content = jQuery(elem).attr(settings.attribute);
			break;
		}
		
		if(content == '' && settings.attribute != 'href'){
			return false;
		}
		
		if(content == '' || !content || content.length == 0){
			return false;	
		}
		
		// remove the title attribute.
		if(settings.attribute == 'title'){
			jQuery(elem).removeAttr('title');
		}
		
		// depending on which attribute you select, the tooltip will behave differently
		// if you specify href, the tooltip is loaded by an ajax request (later on)
		// if you specify src, the image source is loaded in the tooltip
		// you can also specify any other HTML attribute, such as title or alt
		var div = jQuery('<div></div>').attr({
						'id':		ID,
						'class':	settings.cssClass
					}).css({
						'top':			top,
						'left':			left,
						'display':		'none',
						'position':		'absolute',
						'z-index':		settings.zIndex
		}).html(content);
		
		jQuery('body').append(div);
		
		return ID;
	}
	
	switch(settings.action){
		
		case 'focus':
			jQuery(this).focus(function(){
				ID = createAndAppendTooltip(this, content);
				
				// if we're using the href attribute, perform an AJAX request, and use the response as the content.
				if(settings.attribute == 'href'){
					jQuery('div#' + ID).load(jQuery(this).attr('href'), function(){
						jQuery(this).fadeIn(250);															 
					});
				} else {
					jQuery('div#' + ID).fadeIn(250);
				}
				
				return false;
			});
			jQuery(this).blur(function(){
				if(settings.attribute == 'title' && content != ''){
					jQuery(this).attr('title', jQuery('div#' + ID).html());
				}				   	
				jQuery('div#' + ID).fadeOut(250,function(){jQuery(this).remove()});
				return false;
			});
		break;
		
		default:
			jQuery(this).hover(function(){
				ID = createAndAppendTooltip(this, content);	
				// if we're using the href attribute, perform an AJAX request, and use the response as the content.
				if(settings.attribute == 'href'){
					jQuery('div#' + ID).load(jQuery(this).attr('href'), function(){
						jQuery(this).fadeIn(250);												 
					});
				} else {
					jQuery('div#' + ID).fadeIn(250);
				}
				return false;
			}, function(){
				if(settings.attribute == 'title' && content != ''){
					jQuery(this).attr('title', jQuery('div#' + ID).html());
				}				   	
				jQuery('div#' + ID).fadeOut(250,function(){jQuery(this).remove()});
				return false;
			});
		break;
		
	}
	
	return this;
};