//CONTROLLING EVENTS IN jQuery
$(document).ready(function () {

   //*** WINDOW RESIZING ***
   //If the User resizes the window, adjust the position of the login div if it overlaps the tabs
   $(window).bind("resize", windowResized);

   //*** POPUPS ***

   // Event description popups
   // ----------------------------------------------
   // events for opening the popups
   $(".open_details_popup").click(function (event) {
      
      var thisElementId = $(this).attr('id');
      var thisGroupIdStart = thisElementId.lastIndexOf("_");
      var groupId = thisElementId.substr(thisGroupIdStart + 1, 4);
      
      alert(groupId );
      
      // populate and display the popup.
      loadPopup(groupId, "details_popup");
      positionAndShowPopup(groupId, "details_popup");
      
      // set the drag drop resize functionality.
      $(".draggable").draggable({handle: 'div.drag_handle'});
      
      // prevent following of the link.
      event.preventDefault();
   });
   // close by the 'clicking the x' event.
   $(".close_popup").click(function (event) {
      var thisElementId = $(this).attr('id');
      var thisGroupIdStart = thisElementId.lastIndexOf("_");
      var groupId = thisElementId.substr(thisGroupIdStart + 1, 4);
      
      // close the popup.
      closePopup(groupId, "details_popup");
      
      // prevent following of the link.
      event.preventDefault();
   });
   
   // All popups
   // ----------------------------------------------
   $("div.popup").mouseup(function (event) {
      var div_id = "#" + $(this).attr('id');
      
      // bring the popup to the top.
      bringPopupToTop(div_id);
      
      // prevent following of the link.
      event.preventDefault();
   });

});