// This Javascript based on http://jqueryfordesigners.com/coda-popup-bubbles/
// Modified to take into account IE's lack of awesomeness :( :( :( :(

$(function () {
  $('.miniProfile').each(function () {
    // options
    var distance = 10;
    var time = 250;
    var hideDelay = 250;

    var hideDelayTimer = null;

    // tracker
    var beingShown = false;
    var shown = false;
    
    var trigger = $('.trigger', this);
    
    if($.support.opacity){
        var popup = $('.popup', this).css('opacity', 0);
    }else{
        var popup = $('.popup', this).css({top:-50, right:0}); // SADFACE
    }

    // set the mouseover and mouseout on both element
    $([trigger.get(0), popup.get(0)]).mouseover(function () {
      // 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 (beingShown || shown) {
        return;
      } else {
        beingShown = true;

        if($.support.opacity){
            popup.css({top: -40,right: 0,display: 'block'}).animate({top: '-=' + distance + 'px',opacity: 1.0}, time, 'swing', function() {beingShown = false;shown = true;});
        }else{
            popup.fadeIn('fast', function(){beingShown = false;shown = true;}); // SADFACE
        }
      }
    }).mouseout(function () {
      // reset the timer if we get fired again - avoids double animations
      if (hideDelayTimer) clearTimeout(hideDelayTimer);
      
      // store the timer so that it can be cleared in the mouseover if required
      hideDelayTimer = setTimeout(function () {
        hideDelayTimer = null;
        
        if($.support.opacity){
            popup.animate({top: '-=' + distance + 'px',opacity: 0}, time, 'swing', function () {shown = false;popup.css('display', 'none');});
        }else{
            popup.fadeOut('fast', function () {shown = false;}); // SADFACE     
        }
        
      }, hideDelay);
    });
  });
});