home *** CD-ROM | disk | FTP | other *** search
/ Internet Magazine 2002 August / INTERNET94.ISO / pc / software / windows / mail / ft_gate_office / jscript / navbar.js < prev    next >
Encoding:
JavaScript  |  2001-02-16  |  27.7 KB  |  696 lines
  1. /* navbar.js  Copyright 2000 by Mike Hall. Web address: http://www.brainjar.com 
  2. Last update: August 12, 2000. Creates interactive DHTML navigation bars with drop-down menus.
  3. Note: requires dhtmllib.js */
  4. // Need this to fix a bug with IE 5.5.
  5. var isMinIE5_5 = (isMinIE5 && navigator.appVersion.indexOf("5.5") >= 0) ? 1 : 0;
  6. var navBars = new Array();    // Used to track all navigation bars.
  7. //*****************************************************************************
  8. // NavBarMenuItem constructor.
  9. //*****************************************************************************
  10. function NavBarMenuItem(text, link) {
  11.   this.text = text;    // Item text.
  12.   this.link = link;    // Link URL or JavaScript code.
  13. }
  14. //*****************************************************************************
  15. // NavBarMenu constructor.
  16. //*****************************************************************************
  17. function NavBarMenu(hdrWidth, menuWidth) {
  18.   this.hdrWidth  = hdrWidth;
  19.   this.width     = menuWidth;
  20.   this.height    = 0;
  21.   this.items = new Array();
  22.   // Define methods.
  23.   this.addItem = navBarMenuAddItem;
  24. }
  25. //*****************************************************************************
  26. // NavBarMenu methods.
  27. //*****************************************************************************
  28. function navBarMenuAddItem(item) {
  29.   this.items[this.items.length] = item;
  30. }
  31. //*****************************************************************************
  32. // NavBar constructor.
  33. //*****************************************************************************
  34. function NavBar(width) {
  35.   this.x = 0;
  36.   this.y = 0;
  37.   this.width  = width;
  38.   this.height = 0;
  39.   this.align    = "left";
  40.   this.minWidth = 0;
  41.   this.inverted = false;
  42.   this.menus = new Array();
  43.   this.created = false;
  44.   // Set default sizes.
  45.   this.border    = 2;
  46.   this.padding   = 4;
  47.   this.separator = 1;
  48.   // Set default colors.
  49.   this.borderColor  = "#000000";
  50.   this.hdrFgColor   = "#000000";
  51.   this.hdrBgColor   = "#999999";
  52.   this.hdrHiFgColor = "#ffffff";
  53.   this.hdrHiBgColor = "#666666";
  54.   this.itmFgColor   = "#000000";
  55.   this.itmBgColor   = "#cccccc";
  56.   this.itmHiFgColor = "#ffffff";
  57.   this.itmHiBgColor = "#000080";
  58.   // Set default fonts.
  59.   this.hdrFontFamily = "Arial,Helvetica,sans-serif";
  60.   this.hdrFontStyle  = "plain";
  61.   this.hdrFontWeight = "bold";
  62.   this.hdrFontSize   = "10pt";
  63.   this.itmFontFamily = "Verdana,MS Sans Serif,Arial,Helvetica,sans-serif";
  64.   this.itmFontStyle  = "plain";
  65.   this.itmFontWeight = "";
  66.   this.itmFontSize   = "8pt";
  67.   // Define methods.
  68.   this.setSizes    = navBarSetSizes;
  69.   this.setColors   = navBarSetColors;
  70.   this.setFonts    = navBarSetFonts;
  71.   this.addMenu     = navBarAddMenu;
  72.   this.create      = navBarCreate;
  73.   this.hide        = navBarHide;
  74.   this.show        = navBarShow;
  75.   this.moveTo      = navBarMoveTo;
  76.   this.moveBy      = navBarMoveBy;
  77.   this.getzIndex   = navBarGetzIndex;
  78.   this.setzIndex   = navBarSetzIndex;
  79.   this.getWidth    = navBarGetWidth;
  80.   this.getMinWidth = navBarGetMinWidth;
  81.   this.getAlign    = navBarGetAlign;
  82.   this.setAlign    = navBarSetAlign;
  83.   this.resize      = navBarResize;
  84.   this.invert      = navBarInvert;
  85.   this.isInverted  = navBarIsInverted;
  86.   // Add to the list.
  87.   this.index = navBars.length;
  88.   navBars[this.index] = this;
  89. }
  90. //*****************************************************************************
  91. // NavBar methods.
  92. //*****************************************************************************
  93. function navBarSetSizes(border, padding, separator) {
  94.   if (!this.created) {
  95.     this.border = border;
  96.     this.padding = padding;
  97.     this.separator = separator;
  98.   }
  99. }
  100. function navBarSetColors(bdColor,
  101.                          hdrFgColor, hdrBgColor, hdrHiFgColor, hdrHiBgColor,
  102.                          itmFgColor, itmBgColor, itmHiFgColor, itmHiBgColor) {
  103.   if (!this.created) {
  104.     this.borderColor  = bdColor;
  105.     this.hdrFgColor   = hdrFgColor;
  106.     this.hdrBgColor   = hdrBgColor;
  107.     this.hdrHiFgColor = hdrHiFgColor;
  108.     this.hdrHiBgColor = hdrHiBgColor;
  109.     this.itmFgColor   = itmFgColor;
  110.     this.itmBgColor   = itmBgColor;
  111.     this.itmHiFgColor = itmHiFgColor;
  112.     this.itmHiBgColor = itmHiBgColor;
  113.   }
  114. }
  115. function navBarSetFonts(hdrFamily, hdrStyle, hdrWeight, hdrSize,
  116.                         itmFamily, itmStyle, itmWeight, itmSize) {
  117.   if (!this.created) {
  118.     this.hdrFontFamily = hdrFamily;
  119.     this.hdrFontStyle  = hdrStyle;
  120.     this.hdrFontWeight = hdrWeight;
  121.     this.hdrFontSize   = hdrSize;
  122.     this.itmFontFamily = itmFamily;
  123.     this.itmFontStyle  = itmStyle;
  124.     this.itmFontWeight = itmWeight;
  125.     this.itmFontSize   = itmSize;
  126.   }
  127. }
  128. function navBarAddMenu(menu) {
  129.   if (!this.created)
  130.     this.menus[this.menus.length] = menu;
  131. }
  132. function navBarCreate() {
  133.   var str;
  134.   var i, j;
  135.   var norm, high, end;
  136.   var width, height;
  137.   var x, y;
  138.   var scrX, scrY;
  139.   if (this.created || (!isMinNS4 && !isMinIE4))
  140.     return;
  141.   // Build HTML for filler and header layers.
  142.   str = "";
  143.   // For IE4, need to scroll to end of page before inserting HTML.
  144.   if (isMinIE4 && !isMinIE5) {
  145.     scrX = getPageScrollX();
  146.     scrY = getPageScrollY();
  147.     window.scrollTo(getPageWidth(), getPageHeight());
  148.   }
  149.   if (isMinNS4)
  150.     str += '<layer name="navBar' + this.index + '_filler"></layer>\n'
  151.         +  '<layer name="navBar' + this.index + '_hdrsBase">\n';
  152.   if (isMinIE4)
  153.     str += '<div id="navBar' + this.index + '_filler"'
  154.         +  ' style="position:absolute;">'
  155.         +  '</div>\n'
  156.         +  '<div id="navBar' + this.index + '_hdrsBase"'
  157.         +  ' style="position:absolute;">\n';
  158.   // Build HTML for the headers.
  159.   for (i = 0; i < this.menus.length; i++) {
  160.     norm = '<table border=0 cellpadding=' + this.padding
  161.          + ' cellspacing=0'
  162.          + (this.menus[i].hdrWidth > 0 ? ' width=' + this.menus[i].hdrWidth : '')
  163.          + ((isMinIE4 && !isMinIE5) ? ' id="navBar' + this.index + '_tbl' + i + '"': '')
  164.          + '><tr><td'
  165.          + (this.menus[i].hdrWidth == 0 ? ' nowrap=1' + this.menus[i].hdrWidth : '')
  166.          + '>'
  167.          + '<span style="color:' + this.hdrFgColor + ';'
  168.          + 'font-family:' + this.hdrFontFamily + ';'
  169.          + 'font-size:' + this.hdrFontSize + ';'
  170.          + 'font-style:' + this.hdrFontStyle + ';'
  171.          + 'font-weight:' + this.hdrFontWeight + ';">';
  172.     high = '<table border=0 cellpadding=' + this.padding
  173.          + ' cellspacing=0'
  174.          + (this.menus[i].hdrWidth > 0 ? ' width=' + this.menus[i].hdrWidth : '')
  175.          + '><tr><td'
  176.          + (this.menus[i].hdrWidth == 0 ? ' nowrap=1' + this.menus[i].hdrWidth : '')
  177.          + '>'
  178.          + '<span style="color:' + this.hdrHiFgColor + ';'
  179.          + 'font-family:' + this.hdrFontFamily + ';'
  180.          + 'font-size:' + this.hdrFontSize + ';'
  181.          + 'font-style:' + this.hdrFontStyle + ';'
  182.          + 'font-weight:' + this.hdrFontWeight + ';">';
  183.     end  = '</span></td></tr></table>';
  184.     if (isMinNS4)
  185.       str += '<layer name="navBar' + this.index + '_head' + i + '">'
  186.           +  norm + this.menus[i].items[0].text + end
  187.           +  '</layer>\n'
  188.           +  '<layer name="navBar' + this.index + '_headHigh' + i + '">'
  189.           +  high + this.menus[i].items[0].text + end
  190.           +  '</layer>\n'
  191.           +  '<layer name="navBar' + this.index + '_headDummy' + i + '">'
  192.           +  '</layer>\n';
  193.     if (isMinIE4) {
  194.       str += '<div id="navBar' + this.index + '_head' + i + '"'
  195.           +  ' style="position:absolute;">'
  196.           +  norm + this.menus[i].items[0].text + end
  197.           +  '</div>\n'
  198.           +  '<div id="navBar' + this.index + '_headHigh' + i + '"'
  199.           +  ' style="position:absolute;">'
  200.           +  high + this.menus[i].items[0].text + end
  201.           +  '</div>\n'
  202.           +  '<div id="navBar' + this.index + '_headDummy' + i + '"'
  203.           +  ' style="position:absolute;">';
  204.       if (isMinIE5_5)
  205.         str += '<table cellspacing=0 width="100%" height="100%"><tr><td></td></tr></table>';
  206.       str += '</div>\n';
  207.     }
  208.   }
  209.   if (isMinNS4) {
  210.     str += '</layer>\n';
  211.     this.baseLayer = new Layer(this.width);
  212.     this.baseLayer.document.open();
  213.     this.baseLayer.document.write(str);
  214.     this.baseLayer.document.close();
  215.   }
  216.   if (isMinIE4) {
  217.     str += '</div>\n';
  218.     str = '<div id="navBar' + this.index + '"'
  219.         + ' style="position:absolute;left:0px;top:0px;">\n'
  220.         + str
  221.         + '</div>\n';
  222.     document.body.insertAdjacentHTML("beforeEnd", str);
  223.     this.baseLayer = getLayer("navBar" + this.index);
  224.   }
  225.   // Position and initialize each header.
  226.   width = 0;
  227.   height = 0;
  228.   for (i = 0; i < this.menus.length; i++) {
  229.     this.menus[i].hdrNormLayer = getLayer('navBar' + this.index + '_head' + i);
  230.     this.menus[i].hdrHighLayer = getLayer('navBar' + this.index + '_headHigh' + i);
  231.     this.menus[i].hdrDmmyLayer = getLayer('navBar' + this.index + '_headDummy' + i);
  232.     height = Math.max(height, getHeight(this.menus[i].hdrNormLayer));
  233.     this.height = height + 2 * this.border;
  234.     // Fix for IE4 to resize headers to fit text width.
  235.     if (isMinIE4 && !isMinIE5) {
  236.       width = this.menus[i].hdrWidth;
  237.       if (width == 0)
  238.         width = eval('document.all.navBar' + this.index + '_tbl' + i + '.clientWidth');
  239.       navBarIEResizeLayer(this.menus[i].hdrNormLayer, width, height);
  240.       navBarIEResizeLayer(this.menus[i].hdrHighLayer, width, height);
  241.       navBarIEResizeLayer(this.menus[i].hdrDmmyLayer, width, height);
  242.     }
  243.   }
  244.   x = this.border;
  245.   y = this.border;
  246.   for (i = 0; i < this.menus.length; i++) {
  247.     width = Math.max(this.menus[i].hdrWidth, getWidth(this.menus[i].hdrNormLayer));
  248.     if (this.menus[i].width == 0)
  249.       this.menus[i].width = width + 2 * this.border;
  250.     moveLayerTo(this.menus[i].hdrNormLayer, x, y);
  251.     setBgColor(this.menus[i].hdrNormLayer, this.hdrBgColor);
  252.     clipLayer(this.menus[i].hdrNormLayer, 0, 0, width, height);
  253.     inheritLayer(this.menus[i].hdrNormLayer);
  254.     moveLayerTo(this.menus[i].hdrHighLayer, x, y);
  255.     setBgColor(this.menus[i].hdrHighLayer, this.hdrHiBgColor);
  256.     clipLayer(this.menus[i].hdrHighLayer, 0, 0, width, height);
  257.     hideLayer(this.menus[i].hdrHighLayer);
  258.     moveLayerTo(this.menus[i].hdrDmmyLayer, x, y);
  259.     if (isMinIE4)
  260.       navBarIEResizeLayer(this.menus[i].hdrDmmyLayer, width, height);
  261.     clipLayer(this.menus[i].hdrDmmyLayer, 0, 0, width, height);
  262.     inheritLayer(this.menus[i].hdrDmmyLayer);
  263.     this.menus[i].hdrDmmyLayer.highLayer = this.menus[i].hdrHighLayer;
  264.     this.menus[i].hdrLeft = x;
  265.     x += width + this.border;
  266.     this.menus[i].hdrRight = x;
  267.   }
  268.   // Save resulting width of headers and total width.
  269.   this.minWidth = x;
  270.   this.width = Math.max(this.minWidth, this.width);
  271.   // Position and initialize base, filler and headers base layers.
  272.   moveLayerTo(this.baseLayer, this.x, this.y);
  273.   setBgColor(this.baseLayer, this.borderColor);
  274.   if (isMinIE4)
  275.     navBarIEResizeLayer(this.baseLayer, this.width, this.height);
  276.   clipLayer(this.baseLayer, 0, 0, this.width, this.height);
  277.   this.fillerLayer = getLayer('navBar' + this.index + '_filler');
  278.   moveLayerTo(this.fillerLayer, this.border, this.border);
  279.   setBgColor(this.fillerLayer, this.hdrBgColor);
  280.   width = this.width - 2 * this.border;
  281.   height = this.height - 2 * this.border;
  282.   if (isMinIE4)
  283.     navBarIEResizeLayer(this.fillerLayer, width, height);
  284.   clipLayer(this.fillerLayer, 0, 0, width, height);
  285.   inheritLayer(this.fillerLayer);
  286.   this.hdrsBaseLayer = getLayer('navBar' + this.index + '_hdrsBase');
  287.   if (this.align == "left")
  288.     this.hdrsOffsetX = 0;
  289.   else if (this.align == "center")
  290.     this.hdrsOffsetX = Math.round((this.width - this.minWidth) / 2);
  291.   else if (this.align == "right")
  292.     this.hdrsOffsetX = this.width - this.minWidth;
  293.   else
  294.     this.hdrsOffsetX = Math.min(parseInt(this.align, 10), this.width - this.minWidth);
  295.   moveLayerTo(this.hdrsBaseLayer, this.hdrsOffsetX, 0);
  296.   setBgColor(this.hdrsBaseLayer, this.borderColor);
  297.   if (isMinIE4)
  298.     navBarIEResizeLayer(this.hdrsBaseLayer, this.minWidth, this.height);
  299.   clipLayer(this.hdrsBaseLayer, 0, 0, this.minWidth, this.height);
  300.   inheritLayer(this.hdrsBaseLayer);
  301.   // Set up event handling and positioning for headers.
  302.   for (i = 0; i < this.menus.length; i++) {
  303.     this.menus[i].hdrDmmyLayer.index = this.index;
  304.     this.menus[i].hdrDmmyLayer.offsetX = this.menus[i].hdrLeft - this.border;
  305.     if (this.menus[i].hdrDmmyLayer.offsetX + this.menus[i].width > this.width)
  306.       this.menus[i].hdrDmmyLayer.offsetX = this.menus[i].hdrRight - this.menus[i].width;
  307.     this.menus[i].hdrDmmyLayer.offsetY = this.height - this.border;
  308.     this.menus[i].hdrDmmyLayer.onmouseover = navBarHeaderOn;
  309.     this.menus[i].hdrDmmyLayer.onmouseout = navBarHeaderOff;
  310.     if (isMinNS4) {
  311.       this.menus[i].hdrDmmyLayer.document.highLayer = this.menus[i].hdrHighLayer;
  312.       this.menus[i].hdrDmmyLayer.document.link = this.menus[i].items[0].link;
  313.       this.menus[i].hdrDmmyLayer.document.captureEvents(Event.MOUSEUP);
  314.       this.menus[i].hdrDmmyLayer.document.onmouseup = navBarItemClick;
  315.     }
  316.     if (isMinIE4) {
  317.       this.menus[i].hdrDmmyLayer.highLayer = this.menus[i].hdrHighLayer;
  318.       this.menus[i].hdrDmmyLayer.link = this.menus[i].items[0].link;
  319.       this.menus[i].hdrDmmyLayer.onclick = navBarItemClick;
  320.     }
  321.   }
  322.   // Build the drop down menus.
  323.   norm = '<table border=0 cellpadding=' + this.padding
  324.        + ' cellspacing=0 width="100%"><tr><td>'
  325.        + '<span style="color:' + this.itmFgColor + ';'
  326.        + 'font-family:' + this.itmFontFamily + ';'
  327.        + 'font-size:' + this.itmFontSize + ';'
  328.        + 'font-style:' + this.itmFontStyle + ';'
  329.        + 'font-weight:' + this.itmFontWeight + ';">';
  330.   high = '<table border=0 cellpadding=' + this.padding
  331.        + ' cellspacing=0 width="100%"><tr><td>'
  332.        + '<span style="color:' + this.itmHiFgColor + ';'
  333.        + 'font-family:' + this.itmFontFamily + ';'
  334.        + 'font-size:' + this.itmFontSize + ';'
  335.        + 'font-style:' + this.itmFontStyle + ';'
  336.        + 'font-weight:' + this.itmFontWeight + ';">';
  337.   end  = '</span></td></tr></table>';
  338.   for (i = 0; i < this.menus.length; i++) {
  339.     width = this.menus[i].width - 2 * this.border;
  340.     str = "";
  341.     for (j = 1; j < this.menus[i].items.length; j++) {
  342.       if (isMinNS4)
  343.         str += '<layer name="navBar' + this.index + '_menu' + i + '_norm' + j + '"'
  344.             +  ' width=' + width + '>'
  345.             +  norm + this.menus[i].items[j].text + end
  346.             +  '</layer>\n'
  347.             +  '<layer name="navBar' + this.index + '_menu' + i + '_high' + j + '"'
  348.             +  ' width=' + width + '>'
  349.             +  high + this.menus[i].items[j].text + end
  350.             +  '</layer>\n'
  351.             +  '<layer name="navBar' + this.index + '_menu' + i + '_dmmy' + j + '"'
  352.             +  ' width=' + width + '>'
  353.             +  '</layer>\n';
  354.       if (isMinIE4) {
  355.         str += '<div id="navBar' + this.index + '_menu' + i + '_norm' + j + '"'
  356.             +  ' style="position:absolute;width:' + width + 'px;">'
  357.             +  norm + this.menus[i].items[j].text + end
  358.             +  '</div>\n'
  359.             +  '<div id="navBar' + this.index + '_menu' + i + '_high' + j + '"'
  360.             +  ' style="position:absolute;width:' + width + 'px;">'
  361.             +  high + this.menus[i].items[j].text + end
  362.             +  '</div>\n'
  363.             +  '<div id="navBar' + this.index + '_menu' + i + '_dmmy' + j + '"'
  364.             +  ' style="position:absolute;width:' + width + 'px;">';
  365.         if (isMinIE5_5)
  366.           str += '<table cellspacing=0 width="100%" height="100%"><tr><td></td></tr></table>';
  367.         str += '</div>\n';
  368.       }
  369.     }
  370.     if (isMinNS4) {
  371.       this.menus[i].baseLayer = new Layer(this.menus[i].width);
  372.       this.menus[i].baseLayer.document.open();
  373.       this.menus[i].baseLayer.document.write(str);
  374.       this.menus[i].baseLayer.document.close();
  375.     }
  376.     if (isMinIE4) {
  377.       str = '<div id="navBar' + this.index + '_menu' + i + '"'
  378.           + ' style="position:absolute;left:0px; top:0px;'
  379.           + 'width:' + this.menus[i].width + 'px;visibility:hidden;">\n'
  380.           + str
  381.           + '</div>\n';
  382.       document.body.insertAdjacentHTML("beforeEnd", str);
  383.       this.menus[i].baseLayer = getLayer("navBar" + this.index + "_menu" + i);
  384.     }
  385.   }
  386.   // Restore original scroll position in IE4.
  387.   if (isMinIE4 && !isMinIE5)
  388.     window.scrollTo(x, y);
  389.   // Position and initialize each menu.
  390.   for (i = 0; i < this.menus.length; i++) {
  391.     moveLayerTo(this.menus[i].baseLayer, this.menus[i].hdrDmmyLayer.offsetX, this.menus[i].hdrDmmyLayer.offsetY);
  392.     setBgColor(this.menus[i].baseLayer, this.borderColor);
  393.     if (this.menus[i].items.length > 1) {
  394.       this.menus[i].hdrDmmyLayer.menuLayer = this.menus[i].baseLayer;
  395.       if (isMinNS4)
  396.         this.menus[i].hdrDmmyLayer.document.menuLayer = this.menus[i].baseLayer;
  397.     }
  398.     else {
  399.       this.menus[i].hdrDmmyLayer.menuLayer = null;
  400.       if (isMinNS4)
  401.         this.menus[i].hdrDmmyLayer.document.menuLayer = this.menus[i].baseLayer;
  402.     }
  403.     // Position and initialize each item in the menu.
  404.     x = this.border;
  405.     y = this.border;
  406.     width = this.menus[i].width - 2 * this.border;
  407.     for (j = 1; j < this.menus[i].items.length; j++) {
  408.       this.menus[i].items[j].normLayer = getLayer('navBar' + this.index + '_menu' + i + '_norm' + j);
  409.       this.menus[i].items[j].highLayer = getLayer('navBar' + this.index + '_menu' + i + '_high' + j);
  410.       this.menus[i].items[j].dmmyLayer = getLayer('navBar' + this.index + '_menu' + i + '_dmmy' + j);
  411.       height = getHeight(this.menus[i].items[j].normLayer);
  412.       moveLayerTo(this.menus[i].items[j].normLayer, x, y);
  413.       setBgColor(this.menus[i].items[j].normLayer, this.itmBgColor);
  414.       clipLayer(this.menus[i].items[j].normLayer, 0, 0, width, height);
  415.       inheritLayer(this.menus[i].items[j].normLayer);
  416.       moveLayerTo(this.menus[i].items[j].highLayer, x, y);
  417.       setBgColor(this.menus[i].items[j].highLayer, this.itmHiBgColor);
  418.       clipLayer(this.menus[i].items[j].highLayer, 0, 0, width, height);
  419.       hideLayer(this.menus[i].items[j].highLayer);
  420.       // Set up event handling for each item.
  421.       moveLayerTo(this.menus[i].items[j].dmmyLayer, x, y);
  422.       if (isMinIE4)
  423.         navBarIEResizeLayer(this.menus[i].items[j].dmmyLayer, width, height);
  424.       clipLayer(this.menus[i].items[j].dmmyLayer, 0, 0, width, height);
  425.       inheritLayer(this.menus[i].items[j].dmmyLayer);
  426.       this.menus[i].items[j].dmmyLayer.highLayer = this.menus[i].items[j].highLayer;
  427.       this.menus[i].items[j].dmmyLayer.onmouseover = navBarItemOn;
  428.       this.menus[i].items[j].dmmyLayer.onmouseout = navBarItemOff;
  429.       if (isMinNS4) {
  430.         this.menus[i].items[j].dmmyLayer.document.highLayer = this.menus[i].items[j].highLayer;
  431.         this.menus[i].items[j].dmmyLayer.document.parentHighLayer = this.menus[i].hdrHighLayer;
  432.         this.menus[i].items[j].dmmyLayer.document.menuLayer = this.menus[i].baseLayer;
  433.         this.menus[i].items[j].dmmyLayer.document.link = this.menus[i].items[j].link;
  434.         this.menus[i].items[j].dmmyLayer.document.captureEvents(Event.MOUSEUP);
  435.         this.menus[i].items[j].dmmyLayer.document.onmouseup = navBarItemClick;
  436.       }
  437.       if (isMinIE4) {
  438.         this.menus[i].items[j].dmmyLayer.highLayer = this.menus[i].items[j].highLayer;
  439.         this.menus[i].items[j].dmmyLayer.parentHighLayer = this.menus[i].hdrHighLayer;
  440.         this.menus[i].items[j].dmmyLayer.menuLayer = this.menus[i].baseLayer;
  441.         this.menus[i].items[j].dmmyLayer.link = this.menus[i].items[j].link;
  442.         this.menus[i].items[j].dmmyLayer.onclick = navBarItemClick;
  443.       }
  444.       y += height + this.separator;
  445.     }
  446.     width = this.menus[i].width;
  447.     height = y - this.separator + this.border;
  448.     this.menus[i].baseLayer.width = this.menus[i].width;
  449.     this.menus[i].baseLayer.height = height;
  450.     if (isMinIE4)
  451.       navBarIEResizeLayer(this.menus[i].baseLayer, width, height);
  452.     clipLayer(this.menus[i].baseLayer, 0, 0, width, height);
  453.     // Set up event handling for the menu.
  454.     this.menus[i].baseLayer.parentHighLayer = this.menus[i].hdrHighLayer;
  455.     this.menus[i].baseLayer.onmouseout = navBarMenuOff;
  456.   }
  457.   this.created = true;
  458.   this.resize(this.width);
  459.   showLayer(this.baseLayer);
  460. }
  461. function navBarHide() {
  462.   if (this.created)
  463.     hideLayer(this.baseLayer);
  464. }
  465. function navBarShow() {
  466.   if (this.created)
  467.     showLayer(this.baseLayer);
  468. }
  469. function navBarMoveTo(x, y) {
  470.   this.x = x;
  471.   this.y = y;
  472.   if (this.created)
  473.     moveLayerTo(this.baseLayer, this.x, this.y);
  474. }
  475. function navBarMoveBy(dx, dy) {
  476.   this.x += dx;
  477.   this.y += dy;
  478.   if (this.created)
  479.     moveLayerTo(this.baseLayer, this.x, this.y);
  480. }
  481. function navBarGetzIndex() {
  482.   if (this.created)
  483.     return getzIndex(this.baseLayer);
  484.   return 0;
  485. }
  486. function navBarSetzIndex(z) {
  487.   var i;
  488.   if (this.created) {
  489.     setzIndex(this.baseLayer, z);
  490.     for (i = 0; i < this.menus.length; i++)
  491.       setzIndex(this.menus[i].baseLayer, z);
  492.   }
  493. }
  494. function navBarGetWidth() {
  495.   return this.width;
  496. }
  497. function navBarGetMinWidth() {
  498.   return this.minWidth;
  499. }
  500. function navBarGetAlign() {
  501.   return this.align;
  502. }
  503. function navBarSetAlign(align) {
  504.   this.align = align;
  505.   if (this.created)
  506.     this.resize(this.width);
  507. }
  508. function navBarResize(width) {
  509.   if (this.created) {
  510.     this.width = Math.max(width, this.minWidth);
  511.     if (isMinIE4) {
  512.       navBarIEResizeLayer(this.fillerLayer, this.width - 2 * this.border, this.height - 2 * this.border);
  513.       navBarIEResizeLayer(this.baseLayer, this.width, this.height);
  514.     }
  515.     clipLayer(this.fillerLayer, 0, 0, this.width - 2 * this.border, this.height - 2 * this.border);
  516.     clipLayer(this.baseLayer, 0, 0, this.width, this.height);
  517.     if (this.align == "left")
  518.       this.hdrsOffsetX = 0;
  519.     else if (this.align == "center")
  520.       this.hdrsOffsetX = Math.round((this.width - this.minWidth) / 2);
  521.     else if (this.align == "right")
  522.       this.hdrsOffsetX = this.width - this.minWidth;
  523.     else
  524.       this.hdrsOffsetX = Math.min(parseInt(this.align, 10), this.width - this.minWidth);
  525.     moveLayerTo(this.hdrsBaseLayer, this.hdrsOffsetX, 0);
  526.     for (i = 0; i < this.menus.length; i++) {
  527.       this.menus[i].hdrDmmyLayer.offsetX = this.menus[i].hdrLeft - this.border;
  528.       if (this.hdrsOffsetX + this.menus[i].hdrDmmyLayer.offsetX + this.menus[i].width > this.width)
  529.         this.menus[i].hdrDmmyLayer.offsetX = this.menus[i].hdrRight - this.menus[i].width;
  530.     }
  531.   }
  532.   else
  533.     this.width = width;
  534. }
  535. function navBarInvert() {
  536.   this.inverted = !this.inverted;
  537. }
  538. function navBarIsInverted() {
  539.   return this.inverted;
  540. }
  541. //*****************************************************************************
  542. // Layer resize function for IE.
  543. //*****************************************************************************
  544. function navBarIEResizeLayer(layer, width, height) {
  545.   layer.style.pixelWidth = width;
  546.   layer.style.pixelHeight = height;
  547. }
  548. //*****************************************************************************
  549. // Event handlers for the navigation bar.
  550. //*****************************************************************************
  551. function navBarHeaderOn(e) {
  552.   var bar;
  553.   var x, y;
  554.   bar = navBars[this.index];
  555.   // Position drop down menu.
  556.   if (this.menuLayer != null) {
  557.     x = bar.x + bar.hdrsOffsetX + this.offsetX;
  558.     y = bar.y + this.offsetY;
  559.     if (bar.inverted)
  560.       y = bar.y - this.menuLayer.height + bar.border;
  561.     moveLayerTo(this.menuLayer, x, y);
  562.     // Save drop down menu position and show it. Need to fudge values for IE
  563.     // for reasons unknown.
  564.     this.menuLayer.left = x;
  565.     this.menuLayer.top = y;
  566.     this.menuLayer.right = this.menuLayer.left + this.menuLayer.width;
  567.     this.menuLayer.bottom = this.menuLayer.top + this.menuLayer.height;
  568.     if (isMinIE4) {
  569.       this.menuLayer.left += 2;
  570.       this.menuLayer.right -= 2;
  571.       if (bar.inverted) {
  572.         this.menuLayer.top += 2;
  573.         this.menuLayer.bottom += 2;
  574.       }
  575.       else {
  576.         this.menuLayer.top -= 2;
  577.         this.menuLayer.bottom -= 2;
  578.       }
  579.     }
  580.   }
  581.   // Hide any currently active header and drop down.
  582.   if (isMinIE4) {
  583.     if (bar.activeHeader != null && bar.activeHeader != this) {
  584.       hideLayer(bar.activeHeader.highLayer);
  585.       if (bar.activeHeader.menuLayer != null)
  586.         hideLayer(bar.activeHeader.menuLayer);
  587.     }
  588.     bar.activeHeader = this;
  589.   }
  590.   // Display the header highlight layer and drop down menu.
  591.   showLayer(this.highLayer);
  592.   if (this.menuLayer != null)
  593.     showLayer(this.menuLayer);
  594. }
  595. function navBarHeaderOff(e) {
  596.   // If over drop down menu, exit. Otherwise hide menu and highlight layers.
  597.   if (this.menuLayer != null) {
  598.     if (isMinIE4) {
  599.       mouseX = window.event.clientX + document.body.scrollLeft;
  600.       mouseY = window.event.clientY + document.body.scrollTop;
  601.     }
  602.     if (mouseX >= this.menuLayer.left  &&
  603.         mouseX <= this.menuLayer.right &&
  604.         mouseY >= this.menuLayer.top   &&
  605.         mouseY <= this.menuLayer.bottom)
  606.       return;
  607.     hideLayer(this.menuLayer);
  608.   }
  609.   hideLayer(this.highLayer);
  610. }
  611. function navBarMenuOff(e) {
  612.   // If over drop down menu, exit. Otherwise hide menu and header highlight
  613.   // layers.
  614.   if (isMinIE4) {
  615.     mouseX = window.event.clientX + document.body.scrollLeft;
  616.     mouseY = window.event.clientY + document.body.scrollTop;
  617.     if (mouseX >= this.left  &&
  618.         mouseX <= this.right &&
  619.         mouseY >= this.top   &&
  620.         mouseY <= this.bottom)
  621.       return;
  622.   }
  623.   // Otherwise, hide menu and header highlight layers.
  624.   hideLayer(this);
  625.   hideLayer(this.parentHighLayer);
  626. }
  627. function navBarItemOn() {
  628.   showLayer(this.highLayer);
  629. }
  630. function navBarItemOff() {
  631.   hideLayer(this.highLayer);
  632. }
  633. function navBarItemClick(e) {
  634.   // If there is no link, exit.
  635.   if (this.link == "")
  636.     return true;
  637.   // Hide the drop down menu and highlight layer.
  638.   if (this.menuLayer != null) {
  639.     hideLayer(this.menuLayer);
  640.   }
  641.   if (this.parentHighLayer != null) {
  642.     hideLayer(this.parentHighLayer);
  643.   }
  644.   hideLayer(this.highLayer);
  645.   // If the link starts with "javascript:" execute the code. Otherwise just
  646.   // link to the URL.
  647.   if (this.link.indexOf("javascript:") == 0)
  648.     eval(this.link);
  649.   else
  650.     window.location.href = this.link;
  651.   return true;
  652. }
  653. //*****************************************************************************
  654. // Code for tracking the mouse position.
  655. //*****************************************************************************
  656. // These variables will hold the current mouse pointer position.
  657. var mouseX = 0;
  658. var mouseY = 0;
  659. // Set up event capturing.
  660. if (isMinNS4)
  661.   document.captureEvents(Event.MOUSEMOVE);
  662. document.onmousemove = navBarGetMousePosition;
  663. function navBarGetMousePosition(e) {
  664.   // Save mouse pointer position.
  665.   if (isMinNS4) {
  666.     mouseX = e.pageX;
  667.     mouseY = e.pageY;
  668.   }
  669.   if (isMinIE4) {
  670.     mouseX = window.event.clientX + document.body.scrollLeft;
  671.     mouseY = window.event.clientY + document.body.scrollTop;
  672.   }
  673. }
  674. //*****************************************************************************
  675. // Code to handle a window resize.
  676. //*****************************************************************************
  677. // These variables are used to determine if a resize event is a true one in
  678. // older releases of NS4.
  679. var origWidth;
  680. var origHeight;
  681. // Reload page in case of a browser resize.
  682. if (isMinNS4) {
  683.   origWidth  = window.innerWidth;
  684.   origHeight = window.innerHeight;
  685. }
  686. window.onresize = navBarReload;
  687. function navBarReload() {
  688.   if (isMinNS4 && origWidth == window.innerWidth && origHeight == window.innerHeight)
  689.     return;
  690.   // For IE, reload on a timer in case the Windows 'Show window contents while
  691.   // dragging' display option is on.
  692.   if (isMinIE4)
  693.     setTimeout('window.location.href = window.location.href', 2000);
  694.   else
  695.     window.location.href = window.location.href;
  696. }