//------------------------------------------------------------------ // Copyright 2002 - Gateway Systems Limited //------------------------------------------------------------------ // Web Menu Module // --------------- // Provides the necessary java script functions to implement // drop down menus on a web page. //------------------------------------------------------------------ //------------------------------------------------------------------ // Holds the current menu bar item. var activeBarItem = null; var iFrame = null; var tableOffsetWidth = 0; var SKIP = "SkipLeftOffset" var SKIPNOTOP = "SkipLeftOffsetAndTopOffset" var ARROWCLASSNAMEHOVER = "floatingSubMenuArrow_Hover" //------------------------------------------------------------------ // EVENT HANDLING FUNCTIONS //------------------------------------------------------------------ // Created a iFrame because I want the menu pass over // a SELECT or/and a IFRAME when the menu is used. function iFrameMenu(menu, left, top, width, height) { // Verified if the iFrame has been created. var iFrameExist = document.getElementById("IFRAME" + menu.id); if (iFrameExist == null){ //Create the iframe iFrame=document.createElement("IFRAME"); menu.iFrame = iFrame; iFrame.id = "IFRAME" + menu.id; iFrame.style.zindex="1100"; iFrame.frameBorder="no"; iFrame.scrolling="no"; iFrame.style.filter="progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; iFrame.style.visibility='visible'; iFrame.style.display=""; iFrame.style.position="absolute"; iFrame.src='javascript:new String("")'; iFrame.style.left = left + "px"; iFrame.style.top = top + "px"; iFrame.style.width = width; iFrame.style.height = height; var e = document.body.firstChild; document.body.insertBefore(iFrame, e); } else { //If has already created, just changes these properties. menu.iFrame.style.visibility = "visible"; menu.iFrame.style.display=""; } } // Hide the iFrame created by the JavaScript. function hideIFrameMenu(menuId) { if (frames['IFRAME' + menuId] != null){ frames['IFRAME' + menuId].frameElement.style.visibility = "hidden"; frames['IFRAME' + menuId].frameElement.style.display="none"; } } //------------------------------------------------------------------ // Hides all menus and sub menus if the cursor moves off the menu. // Called in the onmouseout events of all menu items. function onExitHideMenus(event) { var nextObj; if (activeBarItem != null) { nextObj = getNextObject(event); // Hide the submenu if nessesairy. hideSubMenus(getParentObj("DIV", "floatingMenu", nextObj)); if ((getParentObj("DIV", "floatingMenu", nextObj) == null) && (activeBarItem.popup != null)) { //Hide the frame created by the JavaScript. hideIFrameMenu(activeBarItem.popup.id) hideSubMenus(activeBarItem.popup); activeBarItem.popup.style.visibility = "hidden"; } } } //------------------------------------------------------------------ // Show the Popup Menu associated with a Menu Bar Item. Called // by the onmouseover of all Menu Bar Items with a popup. function showPopupMenu(event, menuId) { var x, y, item, popup; item = getMenuItem(event); item.blur(); popup = document.getElementById(menuId); if (popup != null) { item.popup = popup; x = getLeftOffset(item); y = getTopOffset(item) + item.offsetHeight; popup.style.left = x + "px"; popup.style.top = y + "px"; popup.style.visibility = "visible"; popup.style.zindex = "12000"; // iFrame to hide the HTML controls when the menu is displayed. iFrameMenu(popup, x, y, popup.offsetWidth, popup.offsetHeight) activeBarItem = item; } return; } //------------------------------------------------------------------ // Show the Popup Menu associated with a Menu Bar Item. Called // by the onmouseover of all Vertical Menu Bar Items with a popup. function showVertPopupMenu(event, menuId) { var x, y, item, popup; item = getMenuItem(event); item.blur(); popup = document.getElementById(menuId); if (popup != null) { item.popup = popup; x = getLeftOffset(item) + item.offsetWidth; y = getTopOffset(item); popup.style.left = x + "px"; popup.style.top = y + "px"; popup.style.visibility = "visible"; popup.style.zindex = "12000"; // iFrame to hide the HTML controls when the menu is displayed. iFrameMenu(popup, x, y, popup.offsetWidth, popup.offsetHeight) activeBarItem = item; } return; } //------------------------------------------------------------------ // Show the sub menu associated with a Popup Menu Item. Called // by the onmouseover event of all Popup Menu Items with a sub menu. function showSubMenu(event, menuId) { var subMenu, item, popup, x, y; item = getMenuItem(event); popup = getParentObj("DIV", "floatingMenu", item); popup.activeMenuItem = item; subMenu = document.getElementById(menuId); item.subMenu = subMenu; if (subMenu != null){ x = getLeftOffset(item) + getTableOffset(item); y = getTopOffset(item); subMenu.style.left = x + "px"; subMenu.style.top = y + "px"; subMenu.style.visibility = "visible"; subMenu.style.zindex = "12000"; // iFrame to hide the HTML controls when the menu is displayed. iFrameMenu(subMenu, x, y, subMenu.offsetWidth, subMenu.offsetHeight) } if (browserIsIE()) window.event.cancelBubble = true; else event.stopPropagation(); } //------------------------------------------------------------------ // UTILITY FUNCTIONS //------------------------------------------------------------------ // Returns a boolean indicating whether the Browser is IE or not. function browserIsIE () { return (navigator.userAgent.indexOf("MSIE") >= 0) } //------------------------------------------------------------------ // Returns the x (Left) offset of the OffsetObj object relative to // the main window. function getLeftOffset(OffsetObj) { var x; var str; var isThere; str = OffsetObj.id; skipIsThere = str.indexOf(SKIP); //Verify if the string 'SkipLeftOffset' is in the ID. If yes, I don't // have to calculated it in the getLeftOffset sum. if (skipIsThere > -1) x = 0; else x = OffsetObj.offsetLeft; if (OffsetObj.offsetParent != null) { x += getLeftOffset(OffsetObj.offsetParent); } return x; } //------------------------------------------------------------------ // Returns the HTML Table offset width of the current sub menu. function getTableOffset(OffsetObj) { if (OffsetObj.tagName == "TABLE"){ tableOffsetWidth = OffsetObj.offsetWidth; } else { getTableOffset(OffsetObj.offsetParent); } return tableOffsetWidth; } //------------------------------------------------------------------ // Returnd the current menu item that the event was raise by. function getMenuItem(event) { if (browserIsIE()) return window.event.srcElement; else return event.currentTarget; } //------------------------------------------------------------------ // Returns the object that the cursor is moving to from a // mouseout event. function getNextObject(event) { if (browserIsIE()) { return window.event.toElement; } else { return event.relatedTarget; } } //------------------------------------------------------------------ // Finds the nearest Parent object of the startObj object, with the // appropriate tagname and classname. function getParentObj(tagName, className, startObj) { var x = startObj; while (startObj != null) { if (startObj.tagName != null && startObj.tagName == tagName && startObj.className == className) return startObj; startObj = startObj.parentNode; } return startObj; } //------------------------------------------------------------------ // Returns the y (Top) offset of the OffsetObj object relative to // the main window. function getTopOffset(OffsetObj) { var y; var str; var isThere; str = OffsetObj.id skipIsThere = str.indexOf(SKIPNOTOP) // Verify if the string 'SkipLeftOffsetAndTopOffset' is in the ID. // If yes, We don't have to calculated it in the getTopOffset sum. if (skipIsThere > -1) y = 0; else y = OffsetObj.offsetTop; if (OffsetObj.offsetParent != null) y += getTopOffset(OffsetObj.offsetParent); return y; } //------------------------------------------------------------------ // Hides all the submenus below the specified menu. function hideSubMenus(menu) { if (menu == null || menu.activeMenuItem == null) return; if (menu.activeMenuItem.subMenu != null) { menu.activeMenuItem.subMenu.style.visibility = "hidden"; //Hide the frame created by the JavaScript. hideIFrameMenu(menu.activeMenuItem.subMenu.id); hideSubMenus(menu.activeMenuItem.subMenu); menu.activeMenuItem.subMenu = null; } }