/*
   LocusMainMenu
   --------------------------
   Class that helps toggle the background image in the main menu.
   Variables activeItem and i are menu indices
*/
LocusMainMenu = Class.create({
   activeItem: null,
   initialize: function(i) {
      this.activeItem = i;
      // how many categories in menu?
      var numberOfElements = $$('#locus-main-menu li').length;
      // calculate width of each label element
      var elementWidth = Math.floor((956 - (numberOfElements - 1) - (numberOfElements*2*8)) / numberOfElements);
      // calculate the spare pixels that need to be evenly distributed
      var rest = 956 - (numberOfElements - 1) - (numberOfElements*2*8) - (numberOfElements*elementWidth);
      // set widths on each label element
      $$('#locus-main-menu li').each(function(element){
              var extra = 0;
	      if (rest > 0) {
		  // distribute spare pixels
		  extra = 1;
                  rest--;
              }
	      element.down(1).style.width = (elementWidth + extra) + "px";
	      // TODO set this in css
	      element.down(1).style.textAlign = "center";
      });
   },
   toggle: function(i) {
      if (i != this.activeItem) {
         $('locus-main-menu').down('li', i).toggleClassName("active");
      }
	},
	debug: function(woot) {
	    $('debug').insert(woot + "<br />");
	}
});
var locusMainMenu;