/*
// Use Freely as long as following disclaimer is intact and changes must
// be sent to me. ::
//---------------------------------------------------------------
// Menu with Multi Columns v1.5 2006-11-15
// This script was written by Jose Carlos Medeiros <jose at psabs dot com dot br>
// and is a rewriten of:
// Cross Browser Multi-Orientation Menu v1.0 23rd October 2003
// written by Rik Comery. www.ricom.co.uk
//
// For support, sent me a email.
// All rights reserved.
*/

function MultiColMenu(orientation) {
  // Functions
  this.show = _show;
  this.addItem = _addItem;
  this.addSubItem = _addSubItem;
  this.addSubItem = _addSubItem;
  this.hoverMenu = _hoverMenu;
  this.clearMenu = _clearMenu;
  this.popDown = _popDown;
  this.highlightMenu = _highlightMenu;
  this.tdMouseClick = _tdMouseClick;
  this.getOffset = _getOffset;

  // Protected variables
  this.timmer = '';
  this.obj = 'document.getElementById';
  this.menuItens = new Array();
  this.menuSubItens = new Array();
  this.instance_id = '';

  // Options that can be changed

  // Orientation,  can  be "horizontal" or "vertical"
  // default is "vertical"
  this.orientation = (typeof(orientation) == 'undefined')?'vertical':orientation;
  // Instance name. When you create a instance of menu, you mus change this property to
  // instance name. ex.
  // test_menu = new MultiColMenu();
  // test_menu.instance_name = 'test_menu';
  // ps.  I did it , because I realy dont know how to solve this problem
  this.instance_name = '';
  // you can set a delay to submenu
  this.subMenuDelay = 2;
  // You can set a vertical offset to better menu positioning
  this.verticalOffset = 0;
  // You can set a horizontal offset to better menu positioning
  this.horizontalOffset = 0;

  // default submenu columns number
  this.menu_number_columns = 8;

  // Here you can put additional option to tag TD that is cell of menu
  // Ex. this.menu_add_option = 'nowrap';
  this.menu_add_option = '';
  // width menu, this will be used in style tag in table
  this.menu_width = '0px';
  // background color of menu
  this.menu_bgcolor = '';
  // style used to create .css tags to be used in cells of menu
  this.menu_style_static = 'font-family:Verdana; font-size:8pt; color:#5B5B5B; font-weight:normal; text-decoration:none;';
  // like last option , but this is used to create a hover efect
  this.menu_style_hover = 'font-family:Verdana; font-size:8pt; color:#FFFFFF; font-weight:normal; background-color:#4A4A4A; text-decoration:none;';
  // cell spacing, this can be used to create a efect of a line between cells
  this.menu_cellspacing = '1';
  // default style used in links (tag <a>)
  this.menu_item_style = 'font-family:Verdana; font-size: 10px; font-weight: bold;';
  // string put before link in each cell´s menu. You can put <span> to format it
  // ex.   this.menu_beflabel = '<span color="#ffffff">&bull; </span>';
  this.menu_beflabel = '&bull; ';

  // borda sub menu 
  this.submenu_add_option = '';
  this.submenu_bgcolor = '#838484';
  this.submenu_style_static = 'font-family:Verdana; font-size:10pt; color:#4A4A4A;font-weight:normal; text-decoration:none; background-color:#C0C0C0;';
  this.submenu_style_hover = 'font-family:Verdana; font-size:10pt; color:#FFFFFF; font-weight:normal; text-decoration:none; background-color:#4A4A4A;';
  this.submenu_item_style = 'font-family:Verdana; color:#000000; font-size: 10px; font-weight: bold;';
  this.submenu_beflabel = '&bull; ';

  this.orientation = orientation;
  if (this.orientation != 'horizontal' && this.orientation != 'vertical') {
    this.orientation = 'vertical';
  }

  // when you create a menu link, you must use the same ID to create its submenu links
  // style is a css used in tag style
  // ncol is a number columns used to create submenu links
  // ex. 'Empresa', 'http://www.example.com/empresa.htm",'_top', 'color: #000000;', 0
  function _addItem(id, label, action, target, style, ncol) {
    id = (typeof(id) != 'number')?1:id;
    id = (id > 0)?id:1;
    label = (typeof(label) == 'undefined')?'Menu Item':label;
    target = (typeof(target) == 'undefined')?'_self':target;
    action = (typeof(action) == 'undefined')?'#':action;
    ncol = (typeof(ncol) != 'number')?this.menu_number_columns:ncol;
    style = (typeof(style) == 'undefined')?'':style;
    style = (style == ''?this.menu_item_style:style);
    this.menuItens[id] = new Array(label, action, target, style, ncol);
    this.menuSubItens[id] = new Array();
  }

  function _addSubItem(id, label, action, target, style) {
    if (typeof(id) == 'number') {
      i = this.menuSubItens[id].length;
      i = (i > 0)?i:1;
      label = (typeof(label) == 'undefined')?'':label;
      target = (typeof(target) == 'undefined')?'':target;
      action = (typeof(action) == 'undefined')?'':action;
      style = (typeof(style) == 'undefined')?'':style;
      style = (style == ''?this.submenu_item_style:style);
      this.menuSubItens[id][i] = new Array(label, action, target, style);
    }
  }

  function _show () {
    time = new Date();
    this.instance_id = time.getMilliseconds().toString().substring(0, 2);
    this.instance_id += time.getMilliseconds().toString().substring(1);

    if (this.instance_name == '') {
      alert('You must define, this.instance_name with instance name of menu !!');
      return false;
    }
    if (this.verticalOffset == 0 || this.verticalOffset == '')
      this.verticalOffset = (this.orientation == 'horizontal')?34:-1;
    if (this.horizontalOffset == 0 || this.horizontalOffset == '')
      this.horizontalOffset = (orientation == 'horizontal')?-2:140;

    if (this.menuItens.length <= 0) {
      this.addItem();
    }
    // Menu Styles
    document.writeln ('<style>');
    document.writeln ('.MCMMenuStatic'+this.instance_id+' {'+this.menu_style_static+'}');
    document.writeln ('.MCMMenuHover'+this.instance_id+'  {'+this.menu_style_hover+'}');
    document.writeln ('.MCMSubMenuStatic'+this.instance_id+' {'+this.submenu_style_static+'}');
    document.writeln ('.MCMSubMenuHover'+this.instance_id+'  {'+this.submenu_style_hover+'}');
    document.writeln ('</style>');

    // Main Menu
    document.writeln ('<table border="0" cellpadding="0" cellspacing="'+this.menu_cellspacing+'" style="background-color: '+this.menu_bgcolor+'; width: '+this.menu_width+';">');
    if (this.orientation == 'horizontal') document.writeln ('<tr>');

    // Itens Main Menu
    for (i = 1; i < this.menuItens.length; i++) {
      if (this.orientation == 'vertical') document.writeln('<tr>');
      label = this.menuItens[i][0];
      action = this.menuItens[i][1];
      target = this.menuItens[i][2];
      target = (target?target:'#');
      onclick = (target=='#'?'onClick=\"javascript:return false;\"':'');
      style = this.menuItens[i][3];
      beflabel = (label?this.menu_beflabel:'');
      if (style) style = ' style="'+style+'" ';
     /*onClick="'+this.instance_name+'.tdMouseClick(\'mainLink'+i+'\');"*/
      document.writeln ('<td '+onclick);
       document.writeln ('onMouseOver="'+this.instance_name+'.hoverMenu(); '+this.instance_name+'.popDown('+i+', \'button'+this.instance_id+i+'\');"');
       document.writeln ('onMouseOut="'+this.instance_name+'.clearMenu('+i+');"');
       document.writeln ('<div id="button'+this.instance_id+i+'"><table border="0" cellpadding="3" cellspacing="0" width="100%">');
       document.writeln ('<tr><td class="MCMMenuStatic'+this.instance_id+'" id="cell'+this.instance_id+i+'"'+this.menu_add_option+style+'>'+beflabel);
       document.writeln ('<a id="mainLink'+this.instance_id+i+'" href="'+action+'" target="'+target+'"'+style+' class="MCMMenuStatic'+this.instance_id+'">'+label+'</a></td>');
       document.writeln ('</tr></table></div></td>');
       if (this.orientation == 'vertical') document.writeln ('</tr>');
    }
    if (this.orientation == 'vertical') document.writeln ('</table>');
    else document.writeln ('</tr></table>');

    // Sub Menu Itens
    for (i = 1; i < this.menuItens.length; i++) {
      if (this.menuSubItens[i].length > 0) {
        // Styles
        document.writeln ('<div id="MENU'+this.instance_id+i+'" style="visibility:hidden; position:absolute; z-index:2">');
        document.writeln ('<table border="0" cellpadding="3" cellspacing="1" style="background-color: '+this.submenu_bgcolor+';">');

        nlines = (this.menuSubItens[i].length - 1) / this.menuItens[i][4];
        if (nlines > parseInt(nlines)) nlines = parseInt(nlines) + 1;

        ncol = 1;
        for (j = 1; j <= (nlines * this.menuItens[i][4]); j++) {
          if (typeof(this.menuSubItens[i][j]) == 'undefined') {
            label = action = target = style = beflabel = '';
          } else {
            label = this.menuSubItens[i][j][0];
            action = this.menuSubItens[i][j][1];
            target = this.menuSubItens[i][j][2];
            style = this.menuSubItens[i][j][3];
            beflabel = (label)?this.submenu_beflabel:'';
          }
          if (style) style = ' style="'+style+'" ';
          if (ncol == 1) document.writeln('<tr>');

          document.writeln ('<td id="subMenu'+this.instance_id+i+j+'" class="MCMSubMenuStatic'+this.instance_id+'"');
           document.writeln ('onclick="'+this.instance_name+'.tdMouseClick(\'subLink'+this.instance_id+i+j+'\');"'+this.submenu_add_option);
           document.writeln ('onMouseOver="'+this.instance_name+'.hoverMenu(); '+this.instance_name+'.highlightMenu(\'sub\','+i+','+j+');"');
           document.writeln ('onMouseOut="'+this.instance_name+'.clearMenu('+i+');"'+style);
           document.writeln ('>'+beflabel+'<a id="subLink'+this.instance_id+i+j+'" href="'+action+'" target="'+target+'"'+style+' class="MCMSubMenuStatic'+this.instance_id+'">'+label+'</a></td>');
          ncol++;
          if (ncol > this.menuItens[i][4]) {
            document.writeln('</tr>');
            ncol = 1;
          }
        }
        document.writeln ('</table></div>');
      }
    }
  }

  function _highlightMenu(element, mainMenu, dropMenu, state) {
    state = ((state == 'hover')?'MCMMenuHover':'MCMMenuStatic')+this.instance_id+'';
    if (element == 'sub') {
      // coloquei desta forma para que as celulas vazias dos submenus nao fiquem sempre acesas
      // ja que se eu seguir o  this.menuSubIten soh alcançarei os itens cadastrados e nao
      // todos os visiveis
      nlines = (this.menuSubItens[mainMenu].length - 1) / this.menuItens[mainMenu][4];
      if (nlines > parseInt(nlines)) nlines = parseInt(nlines) + 1;
      for (i = 1; i <= (nlines * this.menuItens[mainMenu][4]); i++) {
        eval(this.obj+'("subMenu'+this.instance_id+mainMenu+i+'").className = "MCMSubMenuStatic'+this.instance_id+'"');
        eval(this.obj+'("subLink'+this.instance_id+mainMenu+i+'").className = "MCMSubMenuStatic'+this.instance_id+'"');
      }
      eval(this.obj+'("subMenu'+this.instance_id+mainMenu+dropMenu+'").className="MCMSubMenuHover'+this.instance_id+'"');
      eval(this.obj+'("subLink'+this.instance_id+mainMenu+dropMenu+'").className="MCMSubMenuHover'+this.instance_id+'"');
    } else {
      eval(this.obj+'("cell'+this.instance_id+mainMenu+'").className = "'+state+'"');
      eval(this.obj+'("mainLink'+this.instance_id+mainMenu+'").className = "'+state+'"');
    }
  }

  // Find positioning for sub menus
  function _getOffset (obj, op) {
    var obj = (typeof obj == 'String') ? document.getElementById(obj) : obj;
	var ret = 0;
	ret = parseInt( (op == 'top') ? obj.offsetTop : obj.offsetLeft );
    if (obj.offsetParent == null)
      ret += parseInt( (op == 'top')? obj.y : obj.x );

    while ( obj.offsetParent != null) {
      if (op == 'top') {
        oParent = obj.offsetParent;
        ret += oParent.offsetTop;
        obj = oParent;
      } else if (op == 'left') {
        ret += obj.offsetLeft;
        obj = obj.offsetParent;
      }
    }

    return ret;
  }

  // Show sub menus
  function _popDown(param, id) {
    var menu;
    var button;

    if (id) {
      oLeft = this.getOffset(eval(this.obj+'("'+id+'")'),'left');
      oTop = this.getOffset(eval(this.obj+'("'+id+'")'),'top');
    }

    n = 1;
    while (n < this.menuItens.length) {
      menu = 'MENU' + this.instance_id + n;
      if (param == n) {
        if (eval(this.obj+'("'+menu+'")')) {
          eval(this.obj+'("'+menu+'").style.visibility = "visible"');
          eval(this.obj+'("'+menu+'").style.left = '+(oLeft + this.horizontalOffset)+';');
          eval(this.obj+'("'+menu+'").style.top = '+(oTop + this.verticalOffset)+';');
        }

        this.highlightMenu('main', n, '', 'hover');
        if (this.menuSubItens[param].length > 0) {
          for (i = 1; i < this.menuSubItens[param].length; i++) {
            eval (this.obj+'("subMenu'+this.instance_id+param+i+'").className = "MCMSubMenuStatic'+this.instance_id+'"');
            eval (this.obj+'("subLink'+this.instance_id+param+i+'").className = "MCMSubMenuStatic'+this.instance_id+'"');
          }
        }
      } else {
        if (eval(this.obj+'("'+menu+'")')) eval(this.obj+'("'+menu+'").style.visibility = "hidden"');
        this.highlightMenu ('main', n, '', 'static');
      }
      n++;
    }
  }

  // Re-set timer for sub menus
  function _hoverMenu () {
    if (this.timer) clearTimeout(this.timer);
  }

  // Set timer for sub menus
  function _clearMenu (menu) {
    setDelay = this.subMenuDelay * 100;
    delay = (this.menuSubItens[menu].length > 0)?setDelay:1;
    this.timer = setTimeout(this.instance_name+'.popDown('+(this.menuItens.length + 1)+');', delay);
  }

  // when you click the box, perform the same function as if the user had clicked the hyperlink
  function _tdMouseClick(theElement) {
    eval(this.obj+'( "'+theElement+'" ).click();');
  }
}

/*
// This code was copied from
// http://www.metalusions.com/backstage/articles/8/
//
*/
if (document.all && !document.getElementById) {
  document.getElementById = function(id) {
    return document.all[id];
  }
}

