/*
**************************************
CROSS-PLATFORM/BROWSER DHTML DROPDOWNS
Created by Justin Morelli
Auragen Communications
jmorelli@auragen.com
08/13/02
Modified 11/25/02 for DHD
  (see comments in code)
***************************************

HOW TO SET UP THE DROPDOWNS IN THE HTML
***************************************
REQUIREMENTS:
	DHTMLdropdown.js (this file) must be included as a script on the page.
	Place script at bottom of body in webpage.


EXAMPLE LAYER:
	<div id="layerName" style="position:absolute; visibility:hidden;">
		<p>layer content goes here</p>
	</div>

GENERAL VARIABLE EXPLANATIONS:
	designCentered --> Set to TRUE for designs centered to page.
	leftMargin ------> Normal page margin is 8 by default.  Based on MARGINWIDTH and LEFTMARGIN settings in BODY tag.
	topMargin -------> Normal page margin is 8 by default.  Based on MARGINHEIGHT and TOPMARGIN settings in BODY tag.
	designWidth -----> The total width of the design.

EXAMPLE: HOW TO POSITION A LAYER AND CREATE A TRIGGER TO MAKE IT VISIBLE:
	makeDropdown(theTriggerRelativeLeft,theTriggerRelativeTop,theTriggerWidth,theTriggerHeight,theLayer,theRelativeLeft,theRelativeTop,theDelay,theParent);
	makeDropdown(0,0,0,0,"layerName",0,0,0,"parentLayerName");

	NOTE: The trigger area (defined by variables beginning with 'theTrigger') is the area that triggers the dropdown to show.

	VARIABLE EXPLANATIONS:
		theTriggerRelativeLeft--> Distance between the left edge of the design (NOT the browser window) and the left edge of the trigger area.
		theTriggerRelativeTop---> Distance between the top edge of the design (NOT the browser window) and the top edge of the trigger area.
		theTriggerWidth---------> The width of the trigger area.
		theTriggerHeight--------> The height of the trigger area.
		theLayer ---------------> Which layer (DIV) will be shown upon trigger.  Each layer MUST HAVE A UNIQUE ID.
		theRelativeLeft --------> Distance between the left edge of the design (NOT the browser window) and the left edge of the layer when visible.
		theRelativeTop ---------> Distance between the top edge of the design (NOT the browser window) and the top edge of the layer when visible.
		theDelay ---------------> Amount of time before checking if mouse is in trigger area.  600 is recommended for top level, 400 for sub layers.
		theParent --------------> The layer that must be visible in order to show current level.  Useful for multi-level drop-out navigation.  NOT REQUIRED.
***************************************
*/


//Initiate global variables
var ns6 = (!document.all && document.getElementById); 
var ie4 = (document.all);
var ns4 = (document.layers);

var mouseXpos = 0;
var mouseYpos = 0;

var currentButton="";

var dropDowns = new Array();

//Functions

//Determine layer width and height based on browser
//Called from createLayer()
function getLayerWidth(whichLayer) {
	if (ns4) return document[whichLayer].clip.width;
	else if(ie4) return document.all[whichLayer].clientWidth;
	else return document.getElementById(whichLayer).offsetWidth;
}

function getLayerHeight(whichLayer) {
	if (ns4) return document[whichLayer].clip.height;
	else if(ie4) return document.all[whichLayer].clientHeight;
	else return document.getElementById(whichLayer).offsetHeight;
}

//Determine layer reference based on browser
//Called from createLayer(), toggleVisibility()
function getReference(whichLayer) {
	if(ns4) return document[whichLayer];
	else if(ie4) return document.all[whichLayer].style;
	else return document.getElementById(whichLayer).style;
}

//Positions object
//Linked to dropdown object (this.setPosition)
//Called from main() (as setPosition)
function layerSetPosition(newLeftPosition,newTriggerLeftPosition) {
	this.left = newLeftPosition;
	this.right = this.left + this.width;
	this.reference.left = this.left;

	this.triggerLeft = newTriggerLeftPosition;
	this.triggerRight = this.triggerLeft + this.triggerWidth;
}

//Create dropdown object
//Called from makeDropdown()
function createLayer(myTriggerRelativeLeft,myTriggerRelativeTop,myTriggerWidth,myTriggerHeight,myLayer,myRelativeLeft,myRelativeTop,myDelay,myParent) {
	this.parent = myParent || "top";

	this.triggerRelativeLeft = myTriggerRelativeLeft;
	this.triggerWidth = myTriggerWidth;
	this.triggerLeft = this.triggerRelativeLeft + leftMargin;
	this.triggerTop = myTriggerRelativeTop + topMargin;
	this.triggerRight = this.triggerLeft + this.triggerWidth;
	this.triggerBottom = this.triggerTop + myTriggerHeight;

	this.layer = myLayer;
	this.relativeLeftPosition = myRelativeLeft;
	this.delay = myDelay;
	
	this.width = getLayerWidth(this.layer);
	this.height = getLayerHeight(this.layer);

	this.left = this.relativeLeftPosition + leftMargin;
	this.top = myRelativeTop + topMargin;
	this.right = this.left + this.width;
	this.bottom = this.top + this.height;

	this.reference = getReference(this.layer);
	this.reference.top = this.top;
	this.reference.left = this.left;

	this.setPosition = layerSetPosition;
	return true;
}

//Find window width
//Called from main()
function findWidth() { 
	if (ns4) return window.innerWidth-16;
	else if(ie4) return document.body.clientWidth;
	else return document.width;

}

//Reposition layers on centered design on window resize
//Called on window resize, from webpage
function main() {
	if (designCentered) {
		var findWt = findWidth();
		for(var j = 0; j < dropDowns.length; j++){
			var newTargetX = parseInt((findWt/2) - (designWidth/2)) + dropDowns[j].relativeLeftPosition;
			if(ns6) newTargetX += leftMargin;
			if (dropDowns[j].left != newTargetX) {
				var newTriggerTargetX = parseInt((findWt/2) - (designWidth/2)) + dropDowns[j].triggerRelativeLeft;
				if(ns6) newTriggerTargetX += leftMargin;
				if (newTargetX < dropDowns[j].relativeLeftPosition + leftMargin) { //Check to see if page is resized below design width
					newTargetX = dropDowns[j].relativeLeftPosition + leftMargin;
					newTriggerTargetX = dropDowns[j].triggerRelativeLeft + leftMargin;
				}
				dropDowns[j].setPosition(newTargetX,newTriggerTargetX);
			} else break;
		}
	}
} 

//Switch layer visibility
//Called from hideDropdown(), showDropdown()
function toggleVisibility(div, vis) {
	var my2 = getReference(div);
	my2.visibility = vis;
}

//Detect if mouse has moved off of dropdown or trigger area and hide dropdown
//Sets currentButton to parent layer if not at top level
//Called from hideDropdown(), showDropdown()
function hideDropdown() {
	if ((mouseXpos < parseInt(currentButton.left) || mouseXpos > parseInt(currentButton.right) || mouseYpos < parseInt(currentButton.top) || mouseYpos > parseInt(currentButton.bottom)) && (mouseXpos < parseInt(currentButton.triggerLeft) || mouseXpos > parseInt(currentButton.triggerRight) || mouseYpos < parseInt(currentButton.triggerTop) || mouseYpos > parseInt(currentButton.triggerBottom)))  {
		toggleVisibility(currentButton.layer, 'hidden');
		clearTimeout(rolledOut);
		if (currentButton.parent != "top") {
			for(var i = 0; i < dropDowns.length; i++){
				subRollover(currentButton.layer + "Button",currentButton.parent,dropdownBGcolor);  // modified for DHD 11/26/2002
				if (dropDowns[i].layer == currentButton.parent) {
					currentButton = dropDowns[i];
					break;
				}
			}
			rolledOut = window.setTimeout('hideDropdown()', currentButton.delay);
		} else {
			mainRollover(currentButton.layer + "Button",""); // modified for DHD 11/26/2002
			currentButton="";
		}
	} else {
		clearTimeout(rolledOut);
		rolledOut = window.setTimeout('hideDropdown()', currentButton.delay);
	}
}

//Make dropdown visibile 
//Called from displayLocation()
function showDropdown(k) {
	toggleVisibility(dropDowns[k].layer, 'visible');
	if (dropDowns[k].parent == "top") {
		mainRollover(dropDowns[k].layer + "Button","_over");  // modified for DHD 11/26/2002
		for(var i = 0; i < dropDowns.length; i++){
			if (dropDowns[k] != dropDowns[i]) {
				toggleVisibility(dropDowns[i].layer, 'hidden');
				if(currentButton && dropDowns[i].parent == "top") mainRollover(dropDowns[i].layer + "Button","");  // modified for DHD 11/26/2002
				else if(currentButton) subRollover(dropDowns[i].layer + "Button",dropDowns[i].parent,dropdownBGcolor);  // modified for DHD 11/26/2002
			}
		}
	} else {
		subRollover(dropDowns[k].layer + "Button",dropDowns[k].parent,dropdownBGcolorOver);  // modified for DHD 11/26/2002
	}
	currentButton=dropDowns[k];
	rolledOut = window.setTimeout('hideDropdown()', currentButton.delay);
}

//Track mouse position and display dropdown on mouseover
//Called on mouse movement
function displayLocation(e) {
	if (ns6 || ns4) {
		mouseXpos = e.pageX;
		mouseYpos = e.pageY;
	} else { // IE
		mouseXpos = (event.clientX + document.body.scrollLeft);
		mouseYpos = (event.clientY + document.body.scrollTop);
	}
	for(var i = 0; i < dropDowns.length; i++){
		if ((dropDowns[i].layer != currentButton.layer) && (dropDowns[i].parent == currentButton.layer || dropDowns[i].parent == "top")) {
			if (mouseXpos > parseInt(dropDowns[i].triggerLeft) && mouseXpos < parseInt(dropDowns[i].triggerRight) && mouseYpos > parseInt(dropDowns[i].triggerTop) && mouseYpos < parseInt(dropDowns[i].triggerBottom)) showDropdown(i);
		}
	}
}

//Create dropdown array and initialize dropdown objects
//Called from webpage
function makeDropdown(theTriggerRelativeLeft,theTriggerRelativeTop,theTriggerWidth,theTriggerHeight,theLayer,theRelativeLeft,theRelativeTop,theDelay,theParent){
	dropDowns[dropDowns.length] = new createLayer(theTriggerRelativeLeft,theTriggerRelativeTop,theTriggerWidth,theTriggerHeight,theLayer,theRelativeLeft,theRelativeTop,theDelay,theParent);
}

//Capture mouse movement and window resizing
//Runs continuously
if (window.Event ? true : false) document.captureEvents(Event.MOUSEMOVE | Event.RESIZE);
document.onmousemove = displayLocation;
window.onresize=main;

//Detect for Netscape 4.x window resize and refresh
function init() {
	//for(var i = 0; i < dropDowns.length; i++){  // added for elementK 10/08/2002
	//	if (dropDowns[i].parent == "top") document[dropDowns[i].layer + "ButtonParent"].visibility="show";  // added for elementK 10/08/2002
	//}  // added for elementK 10/08/2002
	setTimeout("window.onresize = redo", 1000);
}

function redo() {
	window.location.reload();
}

if (ns4) window.onload = init;