jQuery.noConflict();

var help_popup_timer;

jQuery(document).ready(function(){

      
    jQuery.fn.HelpPopup = function (content) {
      jQuery('#HelpPopup').remove();
      var ref = this.attr('rel');
      
      if(typeof help_popup_timer!='undefined'){clearTimeout(help_popup_timer);}
      
      jQuery('#SiteContent').before('<div id="HelpPopup" style="display:none;"><div class="info"></div><div id="HelpPopupTail"></div></div>');
      
      var popup = jQuery('#HelpPopup');
      
      var box = new Object();
      
      box.top = this.offset().top;
      box.left = this.offset().left;
      box.width = this.width();
      box.height = this.height();
      
      // add mouse events to this bubble and timeouts to hide
      
      jQuery('#HelpPopup').mouseout(function(e){
        help_popup_timer = setTimeout('jQuery("#HelpPopup").fadeOut();',750);
      });
      
      // clear timer if mouse moving over element
      jQuery('#HelpPopup').mouseover(function(e){
        clearTimeout(help_popup_timer);
      });
      
      if(content!='')
      {
        popup.find('.info').load('/support/popupinfo/' + ref + '/',function(){jQuery('#HelpPopup').PopupShow(box);duration = (jQuery('#HelpPopup .info').text().length)*68;help_popup_timer = setTimeout('jQuery("#HelpPopup").fadeOut();',duration);});
      }
      else
      {
        popup.find('.info').html(content);
        jQuery('#HelpPopup').PopupShow(box);
      }
      
      jQuery('#HelpPopup').click(function(e){
        clearTimeout(help_popup_timer);
        jQuery(this).fadeOut();
      });

      
    };
    
    jQuery.fn.PopupShow = function (box)
    {
      // box variable contains top,left,width,height of element to align to
      
      // make this a sensible shape (try for 3:1 ratio rectangle)
      
      var newheight = Math.sqrt(this.width() * this.height() / 3)
      
      this.width(parseInt(newheight*3));
      
      var top = box.top - this.height();
      
      if(top < jQuery(window).scrollTop())
      {
        top = box.top + box.height - this.height();
        this.toggleClass("inverted",true);
      }
      
      this.css("top", top + "px"); // popup should rest above element or below if not enough room
      
      //left = box.left + (box.width/2) - this.width();
      left = box.left - ((this.width() - box.width) / 2);
      
      tailpos = this.width()/2;
      
      if(left < 0)
      {
        left = 0;
        tailpos = box.left + (box.width / 2);
        this.find('#HelpPopupTail').toggleClass('left',true).toggleClass('right',false).css('margin-left', tailpos + 'px');
      }
      else if(left > jQuery(window).width())
      {
        left = jQuery(window).width() - this.width();
        tailpos = box.left + (box.width / 2);
        this.find('#HelpPopupTail').toggleClass('left',false).toggleClass('right',true).css('margin-left', tailpos + 'px');
      }
      else
      {
        this.find('#HelpPopupTail').toggleClass('left',false).toggleClass('right',true).css('margin-left', tailpos + 'px');
      }
      
      this.css("left", left + "px"); // align right edges of popup to element if possible.
      
      this.fadeIn();
      
    }
    
    
    jQuery('.HelpIcon').click(function(e){
    
      e.preventDefault()
      
      jQuery(this).HelpPopup();
    
    });
  
});