$(document).ready(function(){
  $('.menuItem').mouseenter(function(){
    $(this).addClass('active');
    showSubmenu(this.id);
    
  }).mouseleave(function(){
    $(this).removeClass('active');
    hideSubmenu(this.id)
  });
  
  $('.submenu').mouseenter(function(){
    showSubmenu(this.id.replace("sub", ""));
  }).mouseleave(function(){
    hideSubmenu(this.id.replace("sub", ""));
  });

  $('.submit').mouseenter(function(){
    $(this).addClass('active');
  }).mouseleave(function(){
    $(this).removeClass('active');
  });
  
  
  $('.menuItem:first').addClass('first');
  $('.menuItem:last').addClass('last');
  
});

var hider = {};
function showSubmenu(itmId)
    {
    $('#sub'+itmId).show();    
    
    pos = $('#'+itmId).position();
    $('#sub'+itmId).css({'left': pos.left + 'px'});
    clearTimeout(hider['sub'+itmId]);
    }

function hideSubmenu(itmId)
    {
    hider = function(){
        $('#sub'+itmId).hide();
    };
    
    hider['sub'+itmId] = setTimeout(hider, 500);
    }

function setStars(num)
    {
    for(i = 1; i <= 5; i++)
        {
        name = 'star_'+i;
        imgName = $('#'+name).attr('src');
        if(i <= num)
            {
            imgName = imgName.replace('star.png', 'star-act.png');
            $('#'+name).attr('src', imgName);
            }
        else
            {
            imgName = imgName.replace('star-act.png', 'star.png');
            $('#'+name).attr('src', imgName);
            }
        }
    }