//--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==//
//------------------------------------------------------------------------------------------------//
/*

THIS IS A MODIFIED VERSION OF NATHAN'S MENU.JS WITH IMAGES REMOVED 
Prepared for the George Hickox Bird Dogs site
For version with Images see David Lord's site
By Gerard Gleeson, 10-Aug-2007


	Dynamic Menu Creation with mouseover, mouseout and selected images
	Author: Nathan Shower
	Version: 1.1
	Last Updated: December 6, 2006
	
	|-----------------------------------------------------------------------|
	| updates in 1.1														|
	|																		|
	| --the element that opens the submenu will now remain highlighted		|
	|	even when the submenu is open and another element is selected.		|
	|																		|
	|-----------------------------------------------------------------------|

	These functions create a navigation menu width mouse events using images.
	
	The menu structure in the include file should be built as if it were on the homepage of the
	website (index.html), in the root directory. The include file should also be located in the
	root directory of the website (typically "httpdocs"). For example: index.html and menu_inc.html.
	
	This function will look at the "href" of each link in the navigation, as well as each image
	source and show the "selected" image if it is appropriate.
	
	The variable in the main function (different) is a boolean (true/false) variable which
	determines if the navigation has seperate images for the page that is "selected" or if it
	should use the "over" image in place of the "selected".
	
	The function also adds onmouseover and onmouseout events to the anchor (<a ...></a>) tags of
	the navigation, resulting in the image changing from "normal" to "highlighted" (or "over") to
	"selected" (if indeed this is the correct page) and back to "normal" once the cursor is moved.
	
	Also, this menu (if in the vertical position) can contain submenus on specific items. The
	layout for such a submenu is described below in the mock-up <html>.
	
	The stipulations for using this menu are (as of now):
		* Function call is made in the onload event of the <body> tag:
			- <body onload="setupMenu();">
		* All files utilizing this menu must be in the same directory.
		* All image files must be in the following format:
			- "normal" image ---> images/<imagename>.<extension>
			- "over" image -----> images/<imagename>_o.<extension>
			- "selected" image -> images/<imagename>_s.<extension>
		* The <style> and <script> tags must be on every page, and are not dynamic (may need "../").
		* <style> should include at least:
			- #navigation { width: [same as images]px; } 		//set the width
			- #navigation img { border: 0px; } 					//remove the link border from the images
		* If the menu is vertical, <style> should include:
			- #navigation a { display: block; } 				//create a newline without <br>s
	

*///The <html> menu must be in the following format (sample menu):
/*
	<head>
		<script type="text/javascript" src="script/menu.js"></script>
		<link href="css/style.css" rel="stylesheet" type="text/css">
	</head>
	
	<body onload="setupMenu();">
	<!-- begin menu -->
		<containing element (div, td) id="navigation">
			<a href="index.html"><img src="images/b_home.jpg" width="100" height="25" alt="home"></a>
			<a href="page1.html"><img src="images/b_page1.jpg" width="100" height="25" alt="page1"></a>
	<!-- begin subMenu -->
			<div style="display: none;">
				<a href="page1_1.html"><img src="images/b_page1_1.jpg" width="100" height="25" alt="page1_1"></a>
				<a href="page1_2.html"><img src="images/b_page1_2.jpg" width="100" height="25" alt="page1_2"></a>
			</div>
	<!-- end subMenu -->
			<a href="page2.html"><img src="images/b_page2.jpg" width="100" height="25" alt="page2"></a>
		</containing element>
	<!-- end menu -->
	</body>
*/
//------------------------------------------------------------------------------------------------//
//--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==//
// This function is called in the onload event (onload="setupMenu();") to create a menu that
function setupMenu() {
	var debug = 0;
	var different = false;
	
	var navigation = document.getElementById('navigation');		//find the navigation element
	var navLink = navigation.getElementsByTagName('a');			//array of all the links

	

	var temp;				//holds an array of all the parts of the filename, split around a "."
	var extension;			//gets the extension of the images
	var last;				//the [length - 1] of the temp array for getting the file extension
	

	
//call menu() to highlight the currently selected webpage
	menu();
}
//--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==//
// Get the current file in the browser (.html)
function getCurrentHref (href) {
	var temp = href.split("/");
	var last = temp.length;
	return temp[last-1];
}

//--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==//
// Fixes the links if the current file (.html) is not in the root directory
function fixLinkRoot (navLink, currentFolder) {
	var debug = 0; //number for on, 0 for off

	var temp = "";
	var ref = "";
	var tempRef = "";
	var newRef = "";
//loop through all the links
	for (var i = 0; i < navLink.length ; i++) {
//get the parts of the old href
		tempRef = navLink[i].href;
    	temp = tempRef.split("/");
    	last = temp.length;
    	ref = temp[last-3];
    	newRef = "";
//put it back together until it gets to the folder that shouldn't be there
		for (var ii = 0; ii < (last-3); ii++) {
			newRef += temp[ii];
			newRef += "/";
		}
//skip the folder, and add the rest
		if (ref == currentFolder) {
			newRef += temp[last-2];
			newRef += "/";
			newRef += temp[last-1];
		} else {
			newRef += temp[last-3];
			newRef += "/";
			newRef += temp[last-1];
		}
		navLink[i].href = newRef;
	}
}

//--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==//
function menu() {
    var debug = 0; //number for on, 0 for off

    var currentPage = getCurrentHref(document.location.href);	//the current page
    
    var menuItem = "";				//the current <a>...</a>
    var navRef = "";				//the full href=""
    var currentHref = "";			//the current page (.html)
    var currentFolder = "";			//the current folder
    var testFolder = "";			//a folder to test against
    var notRoot = 0;				//if the folder is not the same as the root folder, set this to 1
    var parent = "";				//the <div> submenu container (for links in the <div>)
    var nextParent = "";			//the <div> submenu container (for the link immediately before the <div>)

    var navigation = document.getElementById('navigation');		//the navigation container <div> or <td>
    var navLink = navigation.getElementsByTagName('a');			//the links in the navigation
    var outerNav = -1;											//the outer link with a submenu
   
    for (var i = 0; i < navLink.length; i++) {
        navRef = navLink[i].href;
        temp = navRef.split("/");
        last = temp.length;
        currentHref = temp[last-1];
		currentFolder = temp[last-2];
		testFolder = temp[last-3];
	
//strip the $_GET variables off the href strings for better comparison
		temp = currentHref.split("?");
		currentHref = temp[0];
		if (temp[1] != null) {
			hrefComp = temp[1][0];
		}
		
		temp = currentPage.split("?");
		currentPage = temp[0];
		if (temp[1] != null) {
			currentComp = temp[1][0];
		}

//test to see if this image should be selected (.html == .html ?)
        if (currentHref == currentPage) {
        	
//test to see if the file is in the root folder
        	if (currentFolder == testFolder) {
        		notRoot = 1;
        	}
        	
//if the link is in a submenu, display the submenu
            parent = navLink[i].parentNode;
			if (parent.style.display == 'none') {
                parent.style.display = '';
            }
			
//if the link is the one that is supposed to open the submenu (from a different page), display the submenu
			if (navLink[i+1]) {
				nextParent = navLink[i+1].parentNode;
				if (nextParent.style.display == 'none') {
					nextParent.style.display = '';
				}
			}
// highlight the current page in the navigation 
// the style is a kludge for GHBD to match the mouseover style
			navLink[i].style.color = 'orange';		
        }
    }
    if (notRoot) {
//repair the links
    	fixLinkRoot(navLink, currentFolder);
    }
   	for (var i = 0; i < navLink.length; i++) {
   		navRef = navLink[i].href;
        temp = navRef.split("/");
        last = temp.length;
        currentHref = temp[last-1];
		currentFolder = temp[last-2];
		testFolder = temp[last-3];
	   	menuItem = "menuItem_" + i;
   	}
}
//--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==//
function getDirectory() {
    var location = window.location.href ;
    var temp = location.split("/");
    delete temp[(temp.length-1)];
    var currentDirectory = temp.join("/");
}
//--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==--==//