/**
 *
 *  menu javascript routines and setup
 *
 *
 */
// Timeout for the dropdown control
var HIDE_TIMEOUT = 100;

var hideCtrl;
var hideTimeout;
// Preload the rollover images

    var imagesOn = new Array (
                            "images/navbar2/on_home.gif",
                            "images/navbar2/on_programs.gif",                            
                            "images/navbar2/on_purchase.gif",
                            "images/navbar2/on_journal.gif", 
                            "images/navbar2/on_news.gif", 
                            "images/navbar2/on_resources.gif", 
                            "images/navbar2/on_aboutus.gif",
                            "images/navbar2/on_contact.gif"
                            );

    var imageOn = new Array();
    for (var i = 0; i < imagesOn.length; i++) {
        imageOn[i] = new Image();
        imageOn[i].src = imagesOn[i];
    }
    var browser = navigator.userAgent;
    browser = browser.substring(browser.indexOf(';')+2);
    browser = browser.substring(0, browser.indexOf(';'));
    var version = browser.substring(browser.indexOf(' '));
    browser = browser.substring(0, browser.indexOf(' '));
    version = version.substring(0, version.indexOf('.'));
// Mouse over tab
function mouseover(ctrl) {
    // set the rollover menu
    imageID = "image" + ctrl.id.substr(1,1);
    imageName = imageOn[(ctrl.id.substr(1,1) - 1)].src;
    document.getElementById(imageID).src = imageName;
    $('.dropmenudiv').hide();
    // show the dropdown menu if it exists
    if (document.getElementById("dropmenu" + ctrl.id.substr(1,1))) {
        var menu = document.getElementById("dropmenu" + ctrl.id.substr(1,1));
        if (menu == hideCtrl) {
          clearTimeout(hideTimeout);
        }
        var left = findPosLeft (ctrl) - 1;
        var top = findPosTop (ctrl) + 18;
        var menu = document.getElementById("dropmenu" + ctrl.id.substr(1,1));
        menu.style.left = left + "px";
        menu.style.top = top + "px";
        menu.style.display = "block";
    }
}

// reset the tab to inactive
function mouseout(ctrl) {
    // set the tab to inactive
    imageID = "image" + ctrl.id.substr(1,1);
    imageName = imageOn[(ctrl.id.substr(1,1) - 1)].src.replace("on", "off");
    document.getElementById(imageID).src = imageName;
    // clear the dropdown menu, if the mouseover event for the dropdown is activated, the clearing will be cancelled
    if (document.getElementById("dropmenu" + ctrl.id.substr(1,1))) {
        var menu = document.getElementById("dropmenu" + ctrl.id.substr(1,1));
        hideCtrl = menu;
        hideTimeout = setTimeout("hidemenu()", HIDE_TIMEOUT);
    }
}

// find the left of the tab to position the dropdown
function findPosLeft(ctrl) {
var curleft = 0;
    if (ctrl.offsetParent) {
        do {
            curleft += ctrl.offsetLeft;
        } while (ctrl = ctrl.offsetParent);
    }
	if (browser == 'MSIE') {

	}
    return curleft;
}

// find the top of the tab to position the dropdown
function findPosTop(ctrl) {
	var browser = navigator.userAgent;
    browser = browser.substring(browser.indexOf(';')+2);
    browser = browser.substring(0, browser.indexOf(';'));
    var version = browser.substring(browser.indexOf(' '));
    browser = browser.substring(0, browser.indexOf(' '));
    version = version.substring(0, version.indexOf('.'));
  	var curtop = 0;
  	
  	if (browser == 'MSIE') {
	    if (version == 8) {
	        curtop = curtop-14;
	    } else {
    	    if (version == 7) {
    	        curtop = curtop+13;
    	    }
	    }
	}
  	
	if (ctrl.offsetParent) {
	do {
			curtop += ctrl.offsetTop;
		} while (ctrl = ctrl.offsetParent);
	}
	
	return curtop;
}


// Mouseover event for the dropdown menus, stops the tab from being reset from rollover
function mouseovermenu(ctrl) {
    // stop the clearing of the menu caused by the mouseout event on the tab
    clearTimeout(hideTimeout);
    // reset the tab image to rollover
    imageID = "image" + ctrl.id.substr(8,1);
    imageName = imageOn[(ctrl.id.substr(8,1) - 1)].src;
    document.getElementById(imageID).src = imageName;
}

// Mouse out event for the dropdown, starts the clearing of the dropdown
function mouseoutmenu(ctrl) {
    // hide the dropdown
    hideCtrl = ctrl;
    hideTimeout = setTimeout("hidemenu()", HIDE_TIMEOUT); 
    // reset the tab image to inactive
    imageID = "image" + ctrl.id.substr(8,1);
    imageName = imageOn[(ctrl.id.substr(8,1) - 1)].src.replace("on", "off");
    document.getElementById(imageID).src = imageName;
}

// this is where the menu is hidden, usually after a short timeout
function hidemenu () {
    hideCtrl.style.display = "none";
}

// insure that dropdowns are cleared if the mouse is clicked
document.onclick = hidemenu;