/* #############################################################

Functions used in bulding and running menu navigation

############################################################### */
var dn = new Object();
dn.on = function() { return; }
dn.tdHandler =  function() { return; }

// Menu items for the various navigation items
// Either name and link location or name and array which will build a sub menu
// About DTCP
var staffarray = new Array("SELFLINK", "staff.html", "Mark A. Lyons", "mlyons.html", "Amy Krinner", "akrinner.html", "Brian Story", "bstory.html");
var aboutdtcparray = new Array("Mission Statement", "mission.html", "Staff", staffarray, "Yahoo! Group", "http://groups.yahoo.com/group/DrawingtheCircle/", "Contact Us", "contact.html", "Directions", "directions.html", "Daytime Hours/Readings", "readings.html", "Home Page", "index.html");

// Events
var teachersarray = new Array("SELFLINK", "teachers.html", "Mark A. Lyons", "mlyons.html", "Amy Krinner", "akrinner.html", "Rev. Nancy J. Gonzalez", "ngonzalez.html", "Rev. George", "Rev.George.html", "Alice Agostini", "aagostini.html",  "Michelle the Astrologer", "MichelleAstro.html", "Kassandra Enid Baecker", "KC.html",
;
var eventsarray = new Array("Event Calendar", "calendar.html", "Event Descriptions", "descriptions.html", "Teachers", teachersarray, "Community Events", "community.html", "Gift Certificates", "giftcerts.html", "Hands on Healing", "handsonhealing.html", "Tarot Workshop & Certification", "tarot.html", "Angelic Techniques", "angelic.html", "BFC Witches Ball", witchesballarray);

// Articles
var articlesarray = new Array("Re: Marks", "remarks.html", "Sit For a Spell", "sitspell.html", "Other Articles", "other.html");

// Voices
var poetryarray = new Array("SELFLINK", "poetry.html", "Angels", "angels.html", "Drumming", "drumming.html", "The Gods", "gods.html", "Healing", "healing.html", "Magick", "magick.html", "Messages from Spirit", "spirit.html", "Water - Emotions", "water.html", "The Wheel of the Year", "wheel.html");
var voicesarray = new Array("Poetry", poetryarray, "Reviews", "reviews.html", "Meditations", "meditations.html", "Guestbook", "guestbook.html", "Testimonials", "testimonials.html", "Q&A", "qna.html");

// Witchcraft
var witchcraftarray = new Array("Witchclass Cycle One", "witchclass.html", "13 Principles of Belief", "13principles.html", "The Witches' Rede", "rede.html", "Magickal Moons", "moons.html", "Wheel of the Year", "wheelyear.html", "Suggested Reading List", "reading.html");

// Web Weaving
var webweavingarray = new Array("Suggested Websites", "websites.html", "New Venues", "venues.html", "Where to Shop", "shopping.html");

// Array containing each main nav array, its object name and the td that calls it
var mainarray = new Array(aboutdtcparray, "aboutdtcp", "navtdaboutdtcp", eventsarray, "events", "navtdevents", articlesarray, "articles", "navtdarticles", voicesarray, "voices", "navtdvoices", witchcraftarray, "witchcraft", "navtdwitchcraft", webweavingarray, "webweaving", "navtdwebweaving");


// Global Variables
var isIE55, isIE50, isW3C;
// Checks to see which browser version we are using, runs automatically. Returns true if the browser is DHTML capable.
function versionCheck()
{
	isIE55 = isIE50 = isW3C = false;
	var answer = false;
	if ((document.getElementById) && (!document.all))
	{
		isW3C = true;
		answer = true
	} 
	else if ((document.getElementById) && (document.all)) 
	{
		var msieIndex = navigator.appVersion.indexOf("MSIE") + 5;
		var IEtst = parseFloat(navigator.appVersion.substr(msieIndex,3))
		if(IEtst >= 5.5)
		{
			isIE55 = true
			
		}
		else
		{
			isIE50 = true;
		}
		answer = true
	}
	return answer; 
}
versionCheck();

// Navigation construction
function buildNavigation()
{
	
	var test = versionCheck();
	if (test == true)
	{
		dn = new DynamicNavigation();
	}
}

// Main Navigation Constructor
function DynamicNavigation()
{
	// First find the table and div that contains the main navigation
	this.table = document.getElementById("navigation");
	this.div = this.table.parentNode;
	// maximum hight a form element should be
	this.top = this.div.offsetTop + this.div.offsetHeight - 4;
	this.left = this.div.offsetLeft

	// Main navigation menus
	for(mn = 0; mn<mainarray.length; mn += 3)
	{
		var thistd = document.getElementById(mainarray[mn + 2]);
		thistd.objname = mainarray[mn + 1]
		this[mainarray[mn + 1]] = new DynamicMenu(mainarray[mn], 1, thistd.offsetLeft + this.left, this.top);
		this[mainarray[mn + 1]].parent = this;
		// Event handler
		this[mainarray[mn + 1]].onmouseout = MainMenuOff;
	}
	
	
	// Add margin built to catch off events
	margin = new HiddenMargin;
	margin.id="nav_margin";
	this.margin = margin;
	this.margin.parent = this;
	this.margin.style.top = this.top + "px";
	
	// Add sub-margin built to catch off events
	smargin = new HiddenMargin;
	smargin.id="sub_nav_margin";
	this.smargin = smargin;
	this.smargin.parent = this;
	this.smargin.style.top = this.top + "px";
	this.smargin.style.zIndex = 15;
	
	
	// Currently active navigation
	this.active = null;

	// Turns menu on
	this.on = MainMenuOn;
	this.tdHandler = TDHandler;
	this.kill = KillNavigation;
	
	
	
	return this;
}

// Builds a margin div
function HiddenMargin()
{
	var margin = document.createElement("div");
	margin.appendChild(document.createTextNode("   "));
	margin.className="nmargin"
	document.body.appendChild(margin);
	return margin
}

// Dynamic menu constructor
function DynamicMenu(array, idnumber, left, top)
{
	// Build div
	var div = document.createElement("div");
	div.idnum = idnumber;
	div.className = "dymenu";
	div.style.top = top + "px";
	div.style.zIndex = "10";
	div.isnavitem = "true";
	
	// Active sub menu if any
	div.activesub = null;
	
	// Place content
	for(a=0; a<array.length; a+=2)
	{
		// Create a div with appropriate contents
		var sdiv = new DynamicMenuItem(a, array[a], array[a+1]);
		sdiv.className = "navitem itemmain";
		sdiv.classKind = "itemmain";
		sdiv.parent = div;
		div.appendChild(sdiv);
	}
	
	// Place div on page
	document.body.appendChild(div);
	if(left + div.offsetWidth <= 762)
	{
		div.style.left = left + "px";
	}
	else
	{
		div.style.left = (762 - div.offsetWidth) + "px";
	}
	// Attach to main object
	return div;
}

// Dynamic sub menu constructor
function DynamicSubMenu(array, idnum)
{
	var div = document.createElement("div")
	div.className = "subdymenu";
	div.style.zIndex = "20";
	div.idnum = 1;
	div.isnavitem = "true";
	
	
	// Place content
	for(as=2; as<array.length; as+=2)
	{
		// Create a div with appropriate contents
		var sdiv = new DynamicMenuItem(as, array[as], array[as+1]);
		sdiv.className = "navitem itemsub";
		sdiv.classKind = "itemsub";
		div.appendChild(sdiv)
	}
	
	// Event handlers
	div.onmouseout = SubMenuOff;
	// Place div on page
	document.body.appendChild(div);
	// Attach to main object
	return div;
}

// Creates a menu item for either menu or submenu
function DynamicMenuItem(number, name, content)
{
	var span = document.createElement("div");
	span.idnum = number;
	var txt = document.createTextNode(name);
	span.appendChild(txt);
	span.style.width="150px";
	span.isnavitem = "true";
	
	if(typeof content == "string")
	{
		span.onmouseover = function() { highlightOn(this) }
		span.onmouseout = function() { highlightOff(this)}
		span.onclick = function()
		{
			this.onmouseout = null;
			navLink(content)
		}
	}
	else
	{
		// Create new sub navigation
		var dsub = new DynamicSubMenu(content, span.idnum);
		dsub.parent = span;
		span.subnav = dsub;
		
		// Place the arrow that shows that this item has a sub
		var arrow = document.createElement("img");
		arrow.src = "images/arrow.gif";
		arrow.height = "13";
		arrow.width = "6";
		arrow.border="0";
		arrow.isnavitem = "true";
		if(isIE50 == false)
		{

			var arrowholder = document.createElement("div");
			arrowholder.className = "floatright";
			arrowholder.isnavitem = "true"
			arrowholder.appendChild(arrow);
			span.insertBefore(arrowholder, txt);
		}
		else
		{
			var arrowholder = document.createElement("div");
			arrowholder.style.display = "inline";
			arrowholder.style.textAlign = "right";
			arrowholder.isnavitem = "true"
			arrowholder.appendChild(arrow);
			span.appendChild(arrowholder);
		}
		// Change events for item to show sub
		span.onmouseover = subNavOver
		span.onmouseout = subNavOut
		span.onclick=function(){
			//alert(content[1])
			navLink(content[1])
		}
		
	}
	
	return span;
}

// Opens a main menu item, from Dynamic Menu
function MainMenuOn(menu, td)
{
	this.td = td;
	this.active = this[menu];
	// Put margin in place to catch off events
	this.margin.style.left = this.active.style.left.replace(/px/,"") - 20 + "px";
	this.margin.style.width = this.active.offsetWidth + 40 + "px";
	this.margin.style.height = this.active.offsetHeight + 160 + "px";
	this.margin.style.visibility = "visible";
	this.active.style.visibility = "visible";
}

// Kills navigation at the main
function KillNavigation()
{
	if(this.active != null)
	{
		if(this.active.activesub != null)
		{
			highlightOff(this.active.activesub.parent);
			this.active.activesub.style.visibility = "hidden";
		}
		this.active.style.visibility = "hidden";
		this.margin.style.visibility = "hidden";
		this.smargin.style.visibility = "hidden";
		this.active = null;
	}
}

// Main navigation shuts off
function MainMenuOff(event)
{
	var to = getToTarget(event);
	if((to == this.margin) || (to == this.smargin) || (to.isnavitem == null))
	{
		this.parent.kill();
	}
}

// Sub navigation shuts off
function SubMenuOff(event)
{
	var to = getToTarget(event);
	var ancestor = this.parent.parent.parent;
	if((to == ancestor.margin) || (to == ancestor.smargin) || (to.isnavitem == null))
	{
		ancestor.kill();
	}
}

// Handles TD off events
function TDHandler(event, name)
{
// Unless user is moving to td named close the navigation
	var to = getToTarget(event);
	if((to == null) || ((to.className != "dymenu") && (to.className != "navitem itemmain")))
	{
		this.kill();
	}

}



// Link simulation
function navLink(location)
{
	dn.kill();
	document.location = location;
}

// Change class of item to on state
function highlightOn(span) { span.className = "navitem " + span.classKind + "on" }

// Change class of item to off state
function highlightOff(span) { span.className = "navitem " + span.classKind }

// Show sub navigation
function subNavOver()
{
	// If there is a sub nav already active turn off highlighting and close sub nav
	if(this.parent.activesub != null)
	{	
		highlightOff(this.parent.activesub.parent);
		this.parent.activesub.style.visibility = "hidden";
		this.parent.activesub = null;
	}
	// Highlight span
	highlightOn(this);
	// Position sub navigation
	this.subnav.style.top = this.parent.parent.top + this.offsetTop + 5 + "px";
	this.subnav.style.left = parseInt(this.parent.style.left) + this.offsetWidth - 5 + "px";
	// Get smargin
	smargin = this.parent.parent.smargin;
	smargin.style.top = this.parent.parent.top + this.offsetTop - 20 + "px";
	smargin.style.left = parseInt(this.parent.style.left) + this.offsetWidth + 5 + "px";
	smargin.height = this.subnav.offsetHeight + 40 + "px";
	smargin.width = this.subnav.offsetWidth + 20 + "px";
	smargin.style.visibility="visible";
	this.subnav.style.visibility = "visible";
	this.parent.activesub = this.subnav;
}

// Hide sub navigation
function subNavOut(e)
{
	// If out is to the sub navigation then leave this on
	var to = getToTarget(e);
	// Shut down sub nav if to is a sibling
	if((to == this.previousSibling) || (to == this.nextSibling))
	{
		highlightOff(this);
		// Hide sub navigation
		this.parent.parent.smargin.style.visibility = this.subnav.style.visibility = "hidden";
	}
}


// Get the to target
function getToTarget(event)
{
	if ((isIE55) || (isIE50))
	{
		to = window.event.toElement;
		fr = window.event.fromElement;
	}
	else if (event.relatedTarget != null)
	{
		to = (event.relatedTarget.tagName ? event.relatedTarget : event.relatedTarget.parentNode);
		fr = (event.currentTarget.tagName ? event.currentTarget : event.currentTarget.parentNode);
	}
	return to;
}