function $(id) {
  return document.getElementById(id);
}

function menuItemMouseOver(menuItem) {
  if (menuItem.parentNode.className == 'menuCellSelected') {
    return;
  }
  menuItem.parentNode.style.backgroundColor = 'rgb(255, 102, 72)';
  menuItem.style.backgroundColor = 'rgb(255, 102, 72)';
  menuItem.style.color = 'white';
}

function menuItemMouseOut(menuItem) {
  if (menuItem.parentNode.className == 'menuCellSelected') {
    return;
  }
  menuItem.parentNode.style.backgroundColor = 'white';
  menuItem.style.backgroundColor = 'white';
  menuItem.style.color = 'rgb(174, 174, 174)';
}

function menuItemClick(menuItem) {
/*
  menuItem.parentNode.style.backgroundColor = 'rgb(255, 102, 72)';
  menuItem.style.backgroundColor = 'rgb(255, 102, 72)';
  menuItem.style.color = 'white';
*/
  var cell = menuItem.parentNode;
  cell.className = 'menuCellSelected';
  var formId = document.forms[0].id;
  
  //------------------------------------------------------------------
  // Be careful with this -- we're depending on the value of the "id"
  // attribute of the row in which the menu items are rendered, which
  // appears to be vendor (custom components) dependent.
  //------------------------------------------------------------------
  // var rowId = formId + ':idSubviewHeader:menuRow';  
  var rowId = 'idSubviewHeader:menuRow';  
  
  var menuRow = $(rowId);
  var menuCells = menuRow.childNodes;
  // alert('menuCells length is ' + menuCells.length);
  for (var j=0; j<menuCells.length; j++) {
    var td = menuCells[j];
    // alert('td.id is <' + td.id + '>. cell.id is ' + cell.id);
    if (td.id != cell.id && td.id != '') { // If we're not looking at the current selection
                                           // or the blank cell at the end of the row ...
      td.className = 'menuCell';
      // alert('td.firstChild is ' + td.firstChild + '. Its id is <' + td.firstChild.id + '>.');
      td.firstChild.className = 'menuCell';
    }
  }
}

function selectInitialMenuItem(menuId) {
  var menuItem = $(menuId);
  menuItem.parentNode.style.backgroundColor = 'rgb(255, 102, 72)';
  menuItem.parentNode.style.color = 'white';
}
