$(document).ready(function(){

    if($('#calendrier')){
	
        var caption,links;
        
        caption = $("#calendrier #calendrier-title");
        caption.css({'display':'none'});
        links =  $("#calendrier td.event");
        
        links.hover(
          function (e) {
            highLightPeriod($(this));
            showCaption($(this), e);
          }, 
          function () {
            resetLightPeriod($(this));
            hideCaption();
          }
        );
        
        function highLightPeriod(tab){
            var name = tab.attr('name');
            $('td.'+name).css({'border-color' : '#FF7498', 'background-color' : '#FF7498'});
        }
        
        function resetLightPeriod(tab){
            var name = tab.attr('name');
            $('td.'+name).css({'border-color' : '#FFFFFF', 'background-color' : '#FFFFFF'});
        }
        
        function showCaption(tab, e) {  
            caption.css({'display':'none'});
            caption.text(tab.attr('desc'));
            caption.css({
                    'display':'block',
                    'left': tab.position().left+20,
                    'top': tab.position().top-30 });
        }
        
        function hideCaption(tab){
            caption.css({'display':'none'});
        }
    }
 });