/*
	Author: The Bridge
	Copyright (c): 2011 The Bridge
	Created: 14-11-2011
	Last Modified: 18-01-2012
	Name: Bubblepop
	Description: Green popup tooltip
*/

$.fn.bubblepop = function(options){  
        /* Setup the options for the tooltip that can be 
           accessed from outside the plugin              */  
        var defaults = {  
            speed: 200,  
            delay: 300,
            padTop: 20,
			padLeft: 80
        };  
  
        var options = $.extend(defaults, options);  
  
        /* Create a function that builds the tooltip 
           markup. Then, prepend the tooltip to the body */  
        getTip = function() {  
            var tTip =   '<div class="popup"><div id="top_left"></div><div id="top_slice"></div><div id="top_right"></div><div id="left_slice"></div><div id="tipcontent"></div><div id="right_slice"></div><div id="btm_left"></div><div id="btm_slice"></div><div id="btm_right"></div></div>';  
            return tTip;  
        }  
        $("body").prepend(getTip());  
  
        /* Give each item with the class associated with 
           the plugin the ability to call the tooltip    */  
        $(this).each(function(){ 
            var $this = $(this);  
            var tip = $('.popup');  
            var tipInner = $('.popup .tipMid');  
  
            var tTitle = (this.title);  
            this.title = "";  
  
            var offset = $(this).offset();  
            var tLeft = offset.left - defaults.padLeft;  
            var tTop = offset.top;  
            var tWidth = $this.width();  
            var tHeight = $this.height();  
  
            /* Mouse over and out functions*/  
            $this.hover(function() {  
                $('#tipcontent', tip).html(tTitle); 
				
				$("body").prepend('<div id="tip_bound" style="width: 200px; overflow: hidden;">'+tTitle+'</div>');
				var h = $("#tip_bound").height();
				$("#tip_bound").remove();
				
				$("#tipcontent").css("height", h+"px");
				$("#left_slice").css("height", h+"px");
				$("#right_slice").css("height", h+"px");
				
                setTip(tTop, tLeft);  
                setTimer();  
            },  
            function() {  
                stopTimer();  
                tip.hide();  
            }  
        );           
  
        /* Delay the fade-in animation  */  
        setTimer = function() {  
            $this.showTipTimer = setInterval("showTip()", defaults.delay);  
        }  
  
        stopTimer = function() {  
            clearInterval($this.showTipTimer);  
        }  
  
        /* Position the tooltip relative to the class 
           associated with the tooltip                */  
        setTip = function(top, left){  
            var topOffset = tip.height();  
            var xTip = (left-45)+"px";  
            var yTip = (top-topOffset)+"px";  
            tip.css({'top' : yTip, 'left' : xTip});
        }  
  
        /* This function stops the timer and creates the 
           fade-in animation                          */  
        showTip = function(){  
            stopTimer();  
            tip.animate({"top": "-=20px", "opacity": "toggle"}, defaults.speed, 'swing');  
        }  
    });  
};  

