// Tooltips v0.2 (SmartRedFox.com)

// Create the tooltips

$(document).ready(function () {

  // Set this variable to the container id for your buttons
  var container = "#m-tabs-list";
  var trigger = "#m-tabs-list a";

  // options
  var distance = 10;    // (vertical) pixels to travel when animating
  var effectTime = 200; // fade and travel speed (milliseconds)
  var effect = "swing"; // easing effect
  var showDelay = 1200; // timeout to show (milliseconds)
  var showDelayTimer = null;
  var hideDelay = 600;  // timeout to hide (milliseconds)
  var hideDelayTimer = null;
  var topPos = -65;     // set top positioning; animated later
  var leftPos = 0;      // initialize left positioning; this is dynamically set below

  $(trigger).each(function () {

    // Add dynamically-generated popup bubble
    // aaprile: need to add top/bot caps later with SPAN or DIV for adjustable height [03/13/09]
    $(trigger).append("<em class='popup'></em>");
    // Populate bubble with the hyperlink's title attribute
    var hoverText = $(this).attr("title");
    $(this).find("em").text(hoverText);
    // Remove title attribute to hide system tooltip
    $(this).attr("title", "");

    var popup = $(this).find(".popup");
    popup.css("opacity", 0 );
    var leftPos = (($(this).width()/2)-(popup.width()/2)); // calculate el width for centering

    // set the mouseover and mouseout on both elements
    $(this).mouseover(function () { // mouseover
      // stops the hide event if we move from the trigger to the popup element
      if (hideDelayTimer) clearTimeout(hideDelayTimer);

      // don't trigger the animation again if we're being shown, or already visible
      if (popup.is(":animated, :visible")) { return; }
      else {
        if ($(container).find(".popup").is(":animated, :visible")) {
          $(container).find(".popup").css("display", "none");
          // reset position of popup box
          popup.css({ top: topPos, left: leftPos, display: "block" }) // makes popup visible
          .animate({ // now animate its opacity and position
            top: "-=" + distance + "px",
            opacity: 1
          }, effectTime, effect, function() {
          });
        }
        else {
          // store the timer so that it can be cleared in the mouseout if required
          showDelayTimer = setTimeout(function () {
            // reset position of popup box
            popup.css({ top: topPos, left: leftPos, display: "block" }) // makes popup visible
            .animate({ // now animate its opacity and position
              top: "-=" + distance + "px",
              opacity: 1
            }, effectTime, effect, function() {
            });
          }, showDelay);
        }
      }

    }).mouseout(function () { // mouseout
      // reset the timer if we get fired again - avoids double animations
      if (hideDelayTimer) clearTimeout(hideDelayTimer);
      if (showDelayTimer) clearTimeout(showDelayTimer);

      // store the timer so that it can be cleared in the mouseover if required
      hideDelayTimer = setTimeout(function () {
        hideDelayTimer = null;
        $(container).find(".popup").animate({
          top: "-=" + (distance+30) + "px",
          opacity: 0
        }, effectTime, effect, function () {
          // hide the popup entirely after the effect (opacity alone doesn't do the job)
          $(container).find(".popup").css("display", "none");
        });
      }, hideDelay);
    });
  });
});