/** * CodaBubble extension for jQuery library * * Creates tooltips "coda bubble" style * * @author Carlo Tasca * @version 1.0 * * OPTIONS: * * @param {array} distances Distances of bubbles from their triggers  * @param {array} leftShifts Left positions of bubbles * @param {array} bubbleTimes Life times for bubbles * @param {array} hideDelays Hide delay times for bubbles * @param {array} bubbleWidths Hide delay times for bubbles * @param {string} bubbleImagesPath Path to skin for bubbles * @param {boolean} msieFix Fix for IE png rendering. Replaces pngs with gifs if true (default) * @param {boolean} msiePop If false removes bubble in IE */



jQuery.fn.codaBubble = function(opts)
{		
	var bubble = this;		

	opts = jQuery.extend({			
					distances : [20],
					leftShifts : [30],
			  		bubbleTimes : [400],
			  		hideDelays : [0],
			  		bubbleWidths : [200],
			  		bubbleImagesPath : "",
			  		msieFix : true,
			  		msiePop : true,
					position:  ['left'],
					hideClass: ['blah']},opts||{});

	function bubbleHtmlWrapper(bubbleHtml) 
	{
		return '<table class="popup" style="opacity: 0; top: -120px; left: -33px; display: none;"><tr><td class="corner topleft"/><td class="top"/><td class="corner topright"/></tr><tr><td class="left"/><td class="bubble_content">' +  bubbleHtml  + '</td><td class="right"/></tr><tr><td class="corner bottomleft"/><td class="bottom"><img style="display:block;" width="30" height="29" alt="" /></td><td class="corner bottomright"/></tr></table>';	    
	}  		

	return jQuery(bubble).each(function (i) {	    

		var bubbleHtml = jQuery('.bubble_html', this).html(); 	    
		jQuery('.bubble_html', this).hide().after(bubbleHtmlWrapper(bubbleHtml));

		if (opts.msieFix)	    
		{		     
			if ($.browser.msie)		     
			{
				jQuery('.popup td.top').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-2.gif)');		      
				jQuery('.popup td.left').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-4.gif)'); 
				jQuery('.popup td.right').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-5.gif)');		      
				jQuery('.popup td.bottomleft').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-6.gif)');		      
				jQuery('.popup td.bottom').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-7.gif)');		      
				jQuery('.popup td.bottomright').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-8.gif)');		      		     
			}	    
		}	   	    

		var distance = opts.distances[i];	    
		var time = opts.bubbleTimes[i];	    
		var hideDelay = opts.hideDelays[i];	    
		var hideDelayTimer = null;	    
		var beingShown = false;	    
		var shown = false;	    
		var trigger = jQuery('.trigger', this);	    
		var popup = jQuery('.popup', this).css('opacity', 0);	    	    
		var hideClass = opts.hideClass[i];

		jQuery([trigger.get(0), popup.get(0)]).mouseover(function () 
		{
			var position = opts.position[i];
			if(position == 'left')
			{
				jQuery('.popup td.bottom img').attr('src', '');	
				if(opts.msieFix && $.browser.msie)
				{
					jQuery('.popup td.bottom img').attr('src', opts.bubbleImagesPath  + '/bubble-7.gif');	
					jQuery('.popup td.topleft').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-1-arrow.gif)');
					jQuery('.popup td.topright').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-3.gif)');		      
				}
				else
				{
					jQuery('.popup td.topleft').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-1-arrow.png)');
					jQuery('.popup td.topright').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-3.png)');		      
				}
			}
			else if (position == 'right')
			{
				jQuery('.popup td.bottom img').attr('src', '');	
				if(opts.msieFix && $.browser.msie)
				{
					jQuery('.popup td.bottom img').attr('src', opts.bubbleImagesPath  + '/bubble-7.gif');	
					jQuery('.popup td.topleft').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-1.gif)');		      
					jQuery('.popup td.topright').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-3-arrow.gif)');
				}
				else
				{
					jQuery('.popup td.topleft').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-1.png)');		      
					jQuery('.popup td.topright').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-3-arrow.png)');
				}
			}
			else if (position == 'bottom')
			{
				if(opts.msieFix && $.browser.msie)
				{
					jQuery('.popup td.bottom img').attr('src', opts.bubbleImagesPath  + '/bubble-tail2.gif');	
					jQuery('.popup td.topleft').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-1.gif)');		      
					jQuery('.popup td.topright').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-3.gif)');		      
				}
				else
				{
					jQuery('.popup td.bottom img').attr('src', opts.bubbleImagesPath  + '/bubble-tail2.png');	
					jQuery('.popup td.topleft').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-1.png)');		      
					jQuery('.popup td.topright').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-3.png)');		      
				}
			}
			else if (position == 'none')
			{
				if(opts.msieFix && $.browser.msie)
				{
					jQuery('.popup td.bottom').html('');
					jQuery('.popup td.topleft').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-1.gif)');		      
					jQuery('.popup td.topright').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-3.gif)');		      
				}
				else
				{
					jQuery('.popup td.bottom').html('');
					jQuery('.popup td.topleft').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-1.png)');		      
					jQuery('.popup td.topright').css('background-image', 'url(' + opts.bubbleImagesPath  + '/bubble-3.png)');		      
				}
			}

			jQuery(popup).css("width", opts.bubbleWidths[i] + "px");
		
			var triggerWidth = jQuery(trigger.get(0)).css('width');	      	      

			if (hideDelayTimer) clearTimeout(hideDelayTimer);	      

			if (beingShown || shown) 
			{	        
				return;	      
			} 
			else 
			{	        
				beingShown = true;		        
				popup.css(
						{
				          top: -100,	          
						  left: opts.leftShifts[i],	          
						  display: 'block'}).animate(
							{
								top: '-=' + distance + 'px',	          
								opacity: 1	 
					        }, 
						  time, 'swing', function() 
												{
										          beingShown = false;	          
												  shown = true;	        });	      

				if (opts.msieFix)	    
				{		     
					if ($.browser.msie)		     
						jQuery(hideClass).css('opacity', '0');
				}
			}


		}).mouseout(function () 
		{	      
			if (hideDelayTimer) clearTimeout(hideDelayTimer);	      	      

			hideDelayTimer = setTimeout(function () 
			{	        
				hideDelayTimer = null;	        
				popup.animate({
								top: '-=' + distance + 'px',	          
								opacity: 0}, 
								time, 
								'swing', 
								function () 
								{	          
									shown = false;	          
									popup.css('display', 'none');	        
								});	      
			}, hideDelay);	  

			if (opts.msieFix)	    
			{		     
				if ($.browser.msie)		     
					jQuery(hideClass).css('opacity', '100');
			}
		});	    

		if (!opts.msiePop && $.browser.msie)	  	
		{	     
			jQuery(popup).remove();	  	
		}	  
	});
}