/*
* Awesome Tip v0.1 - jQuery JavaScript Plugin
* Code: http://github.com/paulelliott/jquery-htmltip/tree/master
* Docs: http://plugins.jquery.com/project/htmltip
*
* Copyright (c) 2009 Paul Elliott with RedLine IT
* Dual licensed under the MIT and GPL licenses.

Options:

content: The content to put inside the tip. This can be just text or full markup. Just make sure that whatever the content is, it has correctly computed height and width, otherwise the positioning will be wrong.

alignment: Default is top. Valid values are top, bottom, left, or right. The plugin will always put the tooltip on the side indicated, unless that would cause it to display off the screen, in which case it will flip to the opposite side.

formFocus: Default is true. This will switch the event triggers for form elements to focus and blur instead of mouseover and mouseout.

effect: Default is regular show/hide. Any of the supported effects in jQuery can be passed in here. See the documentation for jQuery's "show" and "hide" functions for the supported list of effects.

effectOptions: Default is none. Allows you to pass options to the show and hide functions. See the documentation for jQuery's "show" and "hide" functions for the supported list of options.

effectSpeed: Default is 500. The time in milliseconds for the effect animation to last.

spacing: Default is 5. The number of pixels to offset the the tooltip from the trigger element.

oncreate: Default is an empty function. This allows you to perform actions on the trigger or the tooltip when it is initially created at page load. Parameters to the function are the jQuery wrapped DOM elements: oncreate(trigger, tooltip).

onshow: Default is an empty function. This allows you to perform actions on the trigger or the tooltip right before the show action is invoked. Parameters to the function are the jQuery wrapped DOM elements: onshow(trigger, tooltip).

onhide: Default is an empty function. This allows you to perform actions on the trigger or the tooltip right after the hide action is invoked. Parameters to the function are the jQuery wrapped DOM elements: onhide(trigger, tooltip).



*/
function htmlTip(htmll) {
	if(htmll)
	$('.htmltip .htmlholder').html(htmll)
}

(function($) {
  $.fn.extend({
    htmltip: function(options) {
      //You can override any of these when calling htmltip({ ... })
      var settings = $.extend({
				header: "",
				content: "",
				footer: "",
        alignment: "top",
				xOff: 5,
				yOff: 5,
        formFocus: true,
        effect: "",
        effectOptions: {},
        effectSpeed: 500,
        spacing: 5,
        oncreate: function() {},
        prehover: function() {},
        posthover: function() {}
      }, options);
    
      //Iterate through each of the triggers.
      this.each(function() {
        var trigger = $(this);
        trigger.addClass('htmltip-trigger');
 
        //Add the HTML to the end of the DOM.
        var index = $(".htmltip").length;
				var html = new String("");
				html += "<div id='htmltip"+index+"' class='htmltip' style='display:none;position:absolute; z-index:10000'>";
				html += settings.header;
				
				html += "<div class='htmlholder'>";
				html += settings.content;
				html += "</div>";
				
				html += settings.footer;
				html += "</div>";
				
        $("body").append(html);
				
        var tooltip = $("div#htmltip" + index);
      
        //Call the oncreate handler.
        settings.oncreate(trigger, tooltip);
 
        //Add the mouse in and out listeners.
        if (settings.formFocus && trigger.is(":input")) {
          trigger.focus(function() { show(trigger, tooltip, settings); }).blur(function() { hide(trigger, tooltip, settings); });
          //$(".htmltip").focus(function() { show(trigger, tooltip, settings); }).blur(function() { hide(trigger, tooltip, settings); });
        } else {
          trigger.hover(
            function() { show(trigger, tooltip, settings); },
            function() { hide(trigger, tooltip, settings); }
          );
					
          //$(".htmltip").hover(function() { show(trigger, tooltip, settings); },function() { hide(trigger, tooltip, settings); });
					
        }
      });
    
      return this;
    }
  });
  
  //Sets the position of the tooltip based on the position of the trigger and desired alignment.
  function setPosition(trigger, tooltip, settings) {
    var offset = getNewOffset(trigger, tooltip, settings);
    
    //If the offset puts the tip off the screen, move it to the opposite side of the trigger.
    var alignment = '';
    if (offset.top < 0) {
      alignment = 'bottom';
    } else if (offset.left < 0) {
      alignment = 'right';
    } else if (offset.top + tooltip.height() > $(window).height()) {
      alignment = 'top';
    } else if (offset.left + tooltip.width() > $(window).width()) {
      alignment = 'left';
    }
 
    if (alignment) {
      offset = getNewOffset(trigger, tooltip, $.extend({}, settings, {'alignment': alignment}));
    }
 
    tooltip.css(offset);
  };
 
  //Calculates the offset of the tooltip based on the position of the trigger and specified alignment.
  function getNewOffset(trigger, tooltip, settings) {
    var offset = trigger.offset();
 		
    //Set the alignment to the desired side of the trigger.
    if (settings.alignment == 'top') {
      offset.top = offset.top - tooltip.height() - settings.spacing-settings.yOff;
      offset.left = offset.left +settings.xOff;
    } else if (settings.alignment == 'bottom') {
			
      offset.top = offset.top + trigger.height() + settings.spacing+settings.yOff;
      offset.left = offset.left +settings.xOff;
			
    } else if (settings.alignment == 'left') {
      offset.left = offset.left - tooltip.width() - settings.spacing-settings.xOff;
      offset.top = offset.top+settings.yOff;
    } else if (settings.alignment == 'right') {
      offset.left = offset.left + trigger.width() + settings.spacing+settings.xOff;
      offset.top = offset.top+settings.yOff;
    }
    
    return offset;
  };
 
  function show(trigger, tooltip, settings) {
    setPosition(trigger, tooltip, settings);
 		
    settings.prehover(trigger, tooltip);
 
    if (!settings.effect) {
      tooltip.show();
    } else if (settings.effect == 'fade') {
      tooltip.fadeIn(settings.effectSpeed);
    } else {
      tooltip.show(settings.effect, settings.effectOptions, settings.effectSpeed);
    }
  };
  
  function hide(trigger, tooltip, settings) {
    if (!settings.effect) {
      tooltip.hide();
    } else if (settings.effect == 'fade') {
      tooltip.fadeOut(settings.effectSpeed);
    } else {
      tooltip.hide(settings.effect, settings.effectOptions, settings.effectSpeed);
    }
 
    settings.posthover(trigger, tooltip);
  };

})(jQuery);

