(function($) {
  $(document).ready(function() {
    var NUM_IN_COL = 4;
    var container = $('#menu .wrapper');
    var container_offset = container.offset();

    container.css({position: 'relative'});

    $('#qm0 ul').css({position: 'absolute', top: 24, left: 0, background: '#FFF', height: 122});

    $('#qm0 ul').each(function() {
      var elem = $(this);
      var parent = elem.parent();
      var parent_offset = parent.offset();
      
      var nc = NUM_IN_COL;
      //THIS IS STUPID, they want first menu item to be a special case.
      if(parent.find('a').html().toLowerCase() == 'precast solutions') {
        nc = 3;
      }
      
      var left = parent_offset.left - container_offset.left ; //17 is the padding on each top level menu item
      var top = 24; //give the appearance of skipping a line
      
      elem.css({left: left});
      
      var items = elem.find('li');
      var num_cols = Math.floor(items.length / nc);
      if(items.length % nc) {
        ++num_cols;
      }
      elem.css({left: left, width: num_cols * 160 + 40});
      items.each(function(index) {
        var x = Math.floor(index / nc);
        var y = index % nc;
        
        if(nc == 3 && index >= 2) {
          x = Math.floor((index - 2) / nc)+1;
          y = (index - 2) % nc;
        }
        
        $(this).css({position: 'absolute', top: y * 18 + top, left: x * 160 + 20 });
      });
      
      
    });
    
    var menu_timeout = null;
    $('#qm0>li').hover(
      function() {
        var self = $(this);
        if(this.timer) {
          //Remove timer since we want to show the expanded menu (not side it up)
          clearTimeout(this.timer);
          this.timer = null;
        } else {
          //display the menu
          menu_timeout = setTimeout(function() {
            self.find('ul').stop(true, true).show(400);
            menu_timeout = null;
          }, 500);
        }
        
      },
      //Mouse out of menu
      function() {
        var self = this;
        if(menu_timeout) {
	  //Don't allow the menue to slide down
          clearTimeout(menu_timeout);
          menu_timeout = null;
        }
	//Set the timer to remove the expanded menu
        this.timer = setTimeout(function() { $(self).find('ul').hide(400); self.timer = null; }, 200);
      }
    );
    
    /* OLD CODE
    //Hook up the hover event.
    function isVisible() {
      var visible = false;
      $('#qm0>li ul').each(function() {
        if($(this).css('display') != 'none') {
          visible = true;
        }
      });
      return visible;
    }
    
    //var isVisible = 0;
    $('#qm0>li').hover(
      function() {
        try {
          clearTimeout(this.timer);
        } catch(e) { 
         // ignore
        }
        if( isVisible() ) {
          $(this).find('ul').css({display: 'block'});
        } else {
          $(this).find('ul').stop(true, true).slideDown(); 
        }
        
      },
      function() { 
        var self = this;
        self.timer = setTimeout(function() { $(self).find('ul').slideUp(); }, 800);
      }
    );
    */
  
  });

})(jQuery)

