$(document).ready(function() {
  $('#events a').tipsy();

  $('#events a').each(function(){
    $(this).click(function(){
      var $clicked = $(this);
      $clicked.removeClass("focus");
      var eventName = $clicked.attr("class");
      var position = $clicked.position();

      showEvent(eventName, position.left, position.top);

      return false;
    })
  });
  

  function showEvent(eventName, x, y) {
    var desiredEvent = $("#" + eventName);


    var oldClass = $("#popup").attr("class")

    $("#popup").remove();



    if (desiredEvent.attr("id") != oldClass)
    {
      $("#events a").removeClass("focus");
      $("#events a." + eventName).addClass("focus");
      var content = $("#" + eventName).html();

      if (x > 400)
        x = x - 280;

      y = y + 6;

      var cssObj = {
        'background-color' : '#fff',
        'position' : 'absolute',
        'width' : '300px',
        'padding' : '20px',
        'z-index' : '3',
        '-moz-border-radius' : '10px',
        '-webkit-border-radius' : '10px',
        'border-radius' : '10px',
        'border' : '10px solid #0A2D4F',
        'display' : 'none',
        'top' : y,
        'left' : x
      }

      $('<div id="popup"><span class="close">X</span>' + content + '</div>').appendTo("#wrapper").css(cssObj).addClass(eventName).slideDown("fast");
      
      
      $('#popup .close').click(function(){
        $(this).parent().remove();
        $('#events a').removeClass("focus");
      });
      
    }


  }
});