/** * fw_menu 24OCT2000 Version 4.0 * John Ahlquist, October 2000 * Copyright (c) 2000 Macromedia, Inc. * * based on menu.js * by gary smith, July 1997 * Copyright (c) 1997-1999 Netscape Communications Corp. * * Netscape grants you a royalty free license to use or modify this * software provided that this copyright notice appears on all copies. * This software is provided "AS IS," without a warranty of any kind. */ // The constructor function for the Menu class. Parameters are as follows: // // label The label of the menu -- defaults to "menuLabel" + index // mw Menu width in pixels // mh Menu item height in pixels // fnt Font family used in the menu -- defaults to "arial,helvetica,verdana,sans-serif" // fs Font size used in the menu -- defaults to 12 point // fclr Font color -- defaults to black // fhclr Font highlight color -- defaults to white // bg Menu item's background color -- defaults to light gray (#cccccc) // bgh Menu's background hilight color -- defaults to blue (#000084) // function Menu(label, mw, mh, fnt, fs, fclr, fhclr, bg, bgh,opq) { // Store the version in case we need it in future releases. Currently unused this.version = "990702 [Menu; menu.js]"; this.type = "Menu"; // yes, we're a menu this.menuWidth = mw; this.menuItemHeight = mh; this.fontSize = fs||12; //this.childMenuIcon = "images/arrow_white.gif"; this.fontWeight = "plain"; // if you want your menus to have something other "plain" font weight, change it here this.fontFamily = fnt||"arial,helvetica,verdana,sans-serif"; this.fontColor = fclr||"#000000"; this.fontColorHilite = fhclr||"#ffffff"; this.bgColor = "#555555"; // This sets the menu's (and menu item's) borders this.menuBorder = 1; this.menuItemBorder = 1; this.menuItemBgColor = bg||"#cccccc"; // menu item cell color (text only) this.menuLiteBgColor = "#ffffff"; // hilite color of menu item (text only) this.menuBorderBgColor = "#777777"; // shadow color of menu item (text only) this.menuHiliteBgColor = bgh||"#000084"; // menu item cell hilite color (text only) this.menuContainerBgColor = "#cccccc";// border color of menu (text only) // You can point this attribute to another gif of the same size // to change what the submenu arrow looks like //this.childMenuIcon = ""; // Arrays for this menu's menu items, actions, and child menus this.items = new Array(); this.actions = new Array(); this.childMenus = new Array(); // By default we hide on mouse out (exception for Win IE 4.0 'cause of a bug in the browser -- see mouseoutMenu()) this.hideOnMouseOut = true; // Fill in the needed methods this.addMenuItem = addMenuItem; this.addMenuSeparator = addMenuSeparator; this.writeMenus = writeMenus; this.FW_showMenu = FW_showMenu; this.onMenuItemOver = onMenuItemOver; this.onMenuItemAction = onMenuItemAction; this.hideMenu = hideMenu; this.hideChildMenu = hideChildMenu; // If this window doesn't have an attribute to hold our menus yet, add one if (!window.menus) window.menus = new Array(); // fill in the label for the menu -- BUG ALERT! if label starts with a number // then this.label is stored as a number and means the menu won't show up at all. // The current hack is to add a space to the beginning of the label this.label = label || "menuLabel" + window.menus.length; // Add ourselves to the window's list of menus. The first line here makes it // so we can be accessed by name, and the second makes it so we can be accessed // by array index window.menus[this.label] = this; window.menus[window.menus.length] = this; // If the window doesn't have an attribute to hold the active menus yet, add one if (!window.activeMenus) window.activeMenus = new Array(); } // This function adds a menu item the current menu object. // Parameters: // // label The label of the menu item // action The javascript to execute when menu item is selected (is a string) function addMenuItem(label, action) { // Just add the label and action to the end of items and actions list this.items[this.items.length] = label; this.actions[this.actions.length] = action; } // This function adds a separator menu item to the current menu object. // Right now it uses "separator" as a special string to know when an // item is a spearator. We should probably change this to something more // obscure so we don't collide with a user menu item. // NOTE: this won't look right and is unsupported. Use this function // at your own risk. function addMenuSeparator() { // Just add it to the end of the list, and set the action to none. this.items[this.items.length] = "separator"; this.actions[this.actions.length] = ""; // If we're using menu item separators, we don't want any of the menu items // to have borders, 'cause that would look really bad. Separators don't look // all that great to begin with, but not setting the menu item border to zero // would make them look even worse. this.menuItemBorder = 0; } // For NS6. (because of NS6/Mozilla, not used just for NS6) // // This function finds an element in a page for Nescape 6/Mozilla or IE // based on the element's id that is passed in. It // returns false if it is not found. It is simply // a convience routine. // Parameters: // // item The id of the element to find within the page function FIND(item) { // If we define the "all" attribute, use it (IE only) if (document.all) return(document.all[item]); // If we didn't have the "all" attribute, try the getElementById method // Both Netscape 6/Mozilla and IE support this, but only Mozilla will make it // this far. if (document.getElementById) return(document.getElementById(item)); // We didn't have either way of searching. return(false); } // This is the main function of this file. It actually writes out the menus // to html. // // Algorithm: // First, we create a "container" for all our menus in this window. On // NS4.x its a layer, but for IE or Mozilla its a SPAN element. On NS4.x // you can pass in the container layer. After creating the container we move // all of the menus created from the window object into the container object. // Then, for each menu, we write out a menuLayer (layers on NS4.x, DIV's on IE and 'zilla) // that's nested inside the container. We then put a "light" layer inside of the menuLayer, // then a "body" layer inside of the "light" layer. The "light" layer is used to give // the effect of a light source overhead. The body layer is used to hold the menu items and provide a "shadow". // Next, for each menu item in a menu, we write out a menuItem layer (actual layers on NS4.x, // DIV's on IE and 'zilla). Each menu item also gets a DIV for the "normal" text and the hilighted // text. After all the menu items are written out, we create a "focus" menu item for each menu. // We move this special layer (or DIV) over the currently hilited menu item and use it to catch // mouse down events. // After all the menus are written out, we iterate through the layers (or DIVs) and add addition // properties to them (like pointing them to the corresponding menu objects). We also move the menu // items to their correct position and add event handlers to the appropriate layers. // // Special Notes: // We write out the menu items one at a time on Netscape 4.x. For IE and 'zilla, we build up // the entire content of all the menus (in a variable called 'content') and write it all out // at once. // // Parameters: // // container The layer that contains all menus -- null if this menu isn't begin embedded in a layer (NS4.x only) function writeMenus(container) { // If we've already tried to write out the menus, don't try it again if (window.triedToWriteMenus) return; // If they haven't passed in a container, and this document has // layers (Netscape 4.x) if (!container && document.layers) { // The container has to be a layer for Netscape 4.x, so if one wasn't passed in, // we need to create one. // add a method that'll be called later window.delayWriteMenus = this.writeMenus; // set a timer so that in 250 ms we'll write out the menus var timer = setTimeout('delayWriteMenus()', 250); // create a container (100 is the 'width' of the layer) container = new Layer(100); // Stop the timer clearTimeout(timer); } else if (document.all || document.hasChildNodes) { // If we define the "all" property or if we have child nodes... // (IE or Netscape 6/Mozilla) // Write out a span element, with an id of menuContainer document.writeln(''); // ... now go find it and set it to be the container container = FIND("menuContainer"); } // null out the hide menu timer window.fwHideMenuTimer = null; // if we don't have a container by now, just bail and try back later if (!container) return; // Ok, if we've made it this far, there's no turning back. Mark ourselves // as already tried to write out the menus. window.triedToWriteMenus = true; // Tell the container its a container, and create an array in it // to hold our menus. Then copy our menus over into it container.isContainer = true; container.menus = new Array(); for (var i=0; i