/////////////////////////////////////////////////////////
// jquery.tbtip.js
// Taco Bell - Custom tooltip plugin
//
// author: Rayman Wong
// contact: rayman.wong@gmail.com
// created on: 8/17/2011
// last modified: 8/17/2011
//
// dependencies: 
// jQuery (1.4.2)
//
// comments: http://www.designchemical.com/blog/index.php/jquery/jquery-tooltips-create-your-own-tooltip-plugin/
/////////////////////////////////////////////////////////

(function( $ ){
 
	$.fn.tbtip = function( options ) { 
	
		var settings = {
			container: 'body',
			content: 'alt',
			boundary: window,
			showDelay: 100,			//time in ms
			hideDelay: 200,			//time in ms
			effect: '',
			speed: 'fast',
			trackMouse: true,
			posX: 0,
			posY: 0
		};
		
		//call in the default otions
		var options = $.extend(settings, options);
		
		return this.each(function(index) {
			var tipContent = '';
			tipContent += $(this).attr(settings.content);
			
			// generate markup
			var toolTipHTML = buildTipMarkup(tipContent, index);
			
			// add tooltip into DOM
			$(settings.container).append(toolTipHTML);
			
			// get necessary widths and offsets
			var $toolTip = $('#tb-tip-'+index);
			var $toolTipArrow = $toolTip.find('span.tip');
			var tipWidth = $toolTip.outerWidth();
			var tipOffset = $toolTip.offset();
			var boundWidth = $(settings.boundary).width();
			var boundOffset = $(settings.boundary).offset();
			
			// setup events
			$(this).hover( 
				// over
				function(e){
					clearTimeout($toolTip.data('timeoutHide'));
					
					var _this = this;
					
					// if this tooltip isn't visible, hide all other visible tooltips
					if (!$toolTip.is(':visible')){ $('.tbToolTip:visible').hide(); }
					
					$toolTipArrow.css({
						position: 'absolute',
						top: $toolTip.height()/2 - 20
					});
					
					var tipEdgeRight = 0;
					var tipEdgeLeft = 0;
					var boundEdge = 0;
					
					// if trackMouse, tooltip follows mouse
					if (settings.trackMouse){
						var isLeft = false;	// keep track which side of mouse tooltip is on
						
						$(this).mousemove(function(e){
							tipOffset = $toolTip.offset();
							tipEdgeRight = tipWidth + tipOffset.left;
							tipEdgeLeft = e.pageX + tipWidth + settings.posX;
							boundEdge = boundOffset.left + boundWidth;
							
							if (isLeft){
								// place tooltip to left of mouse
								$toolTip.show().css({
									position: 'absolute',
									top: e.pageY - $toolTip.height()/2,
									left: e.pageX - tipWidth - (settings.posX*2)
								});
								
								if (!$toolTipArrow.hasClass('right')){ $toolTipArrow.addClass('right'); }
								$toolTipArrow.css({
									left: tipWidth - 20
								});
								
								if (tipEdgeLeft < boundEdge) isLeft = false;
							}
							else{
								// check for boundary first so the tooltip doesn't move beyond
								if (tipEdgeRight >= boundEdge){ isLeft = true; }
								else{
									// place tooltip to right of mouse
									$toolTip.show().css({
										position: 'absolute',
										top: e.pageY - $toolTip.height()/2,
										left: e.pageX + settings.posX
									});
									
									if ($toolTipArrow.hasClass('right')){ $toolTipArrow.removeClass('right'); }
									$toolTipArrow.css({
										left: 0 - $toolTipArrow.width() - 20
									});
								}
							}
						});
					}
					else{
						// place tooltip at static location
						$toolTip.show().css({
							position: 'absolute',
							top: $(_this).offset().top,
							left: $(_this).offset().left + $(_this).width()
						});
					}
				},
				// out
				function(e){
					// hide tooltip
					var timeoutHide = setTimeout( function(){
						$toolTip.fadeOut(settings.speed);
					}, settings.hideDelay);
					
					$toolTip.data('timeoutHide', timeoutHide);
				}
			);
			
			$toolTip.hover(
				function(e){
					e.stopPropagation();
				},
				function(e){
					e.stopPropagation();
				}
			);
		});
		
		// helper fn
		function buildTipMarkup(content, id){
			var tipMarkup = '';
			if($.support.borderRadius){
				tipMarkup += '<div id="tb-tip-' + id + '" class="tbToolTip" style="display: none;">';
				tipMarkup += '<div class="tbToolTipWrap">';
				tipMarkup += content;
				tipMarkup += '<span class="tip"></span>';
				tipMarkup += '</div></div>';
			} 
			else{
				tipMarkup += '<div id="tb-tip-' + id + '" class="tbToolTip" style="display: none;">';
				tipMarkup += '<div class="tbToolTipWrap">';
				tipMarkup += content;
				tipMarkup += '<span class="tip"></span>';
				tipMarkup += '</div></div>';
			}
			
			return tipMarkup;
		}
	};
})( jQuery );