/**
 * Canon USA Dynamic HTML Navigation
 * Structure of the menu is as follows:
 * CDNContainer -> CDNCategory
 *              -> CDNSubmenu -> CDNItem
 *                            -> etc.
 *              -> CDNCategory
 *              -> CDNSubmenu -> CDNItem
 *                            -> etc.
 *              -> etc.
 *              -> CDNButton
 *              -> etc.
 */

/* Fix IE Quirks Mode */
if (is_ie) {
	document.open();
	document.write('<style type="text/css">');
	if (is_mac) {
		document.write('@import url("/view/css/cdn_quirks_mac.css");');
	} else {
		document.write('@import url("/view/css/cdn_quirks.css");');
	}
	document.write('</style>');
	document.close();
}

/* Custom object for navigation functions */
function CanonDhtmlNavigation() {
	this.debug = false;
	this.initDone = false;
	this.pageUrl = "";
	this.lastShown = false;
	this.lastHighlighted = false;
}

/* Add methods to the object */
CanonDhtmlNavigation.prototype.findParentImgId = function (sourceEl) {
	var testEl = this.lastShown.previousSibling;
	while (testEl.nodeType != 1 || testEl.className != "CDNCategory") {
		testEl = testEl.previousSibling;
	}
	return this.findChildImgId(testEl);
}

CanonDhtmlNavigation.prototype.findChildImgId = function (sourceEl) {
	for (var i = 0; i < sourceEl.childNodes.length; i++) {
		if (is_ie) {
			if (sourceEl.childNodes[i].tagName.toLowerCase() == "img") {
				return sourceEl.childNodes[i].id;
			}
		} else {
			if (sourceEl.childNodes[i] instanceof Image) {
				return sourceEl.childNodes[i].id;
			}
		}
	}
	return false;
}

CanonDhtmlNavigation.prototype.show = function (sourceEl) {
	if (!this.initDone) { return; }

	if (this.debug) {
		alert("called: show( " + sourceEl.className + " - " + sourceEl.firstChild.nodeValue + " )");
	}

	if (sourceEl.className && sourceEl.className == "CDNCategory") {
		var subMenuEl = sourceEl.nextSibling;
		while ((!subMenuEl.className || subMenuEl.className != "CDNSubmenu") && subMenuEl.nextSibling) {
			subMenuEl = subMenuEl.nextSibling;
		}

		if (subMenuEl.className && subMenuEl.className == "CDNSubmenu") {
			/* Default to open. First click closes menu. 
			(Although style.display is explicitly set to none
			from the init() method). */
			if (subMenuEl.style.display != "none") {
				subMenuEl.style.display = "none";
				if (this.lastShown) {
					switchButton(this.findParentImgId(this.lastShown), 'normal', true);
				}
			} else {
				if (this.lastShown) {
					this.lastShown.style.display = "none";
					switchButton(this.findParentImgId(this.lastShown), 'normal', true);
				}

				subMenuEl.style.display = "block";
				this.lastShown = subMenuEl;
				switchButton(this.findChildImgId(sourceEl), 'active', true);
			}
		}
	}
}

CanonDhtmlNavigation.prototype.highlight = function (sourceEl) {
	if (!this.initDone) { return; }

	if (this.debug) {
		alert("called: highlight( " + sourceEl.className + " - " + sourceEl.firstChild.nodeValue + " )");
	}

	if (sourceEl.className && sourceEl.className == "CDNItem") {
		sourceEl.className = "CDNItem-Active";
	} else if (sourceEl.className && sourceEl.className == "CDNItem-Active") {
		sourceEl.className = "CDNItem";
	}
}

CanonDhtmlNavigation.prototype.hover = function (sourceEl) {
	if (!this.initDone) { return; }

	var i = 0;
	var normalSrc = "";
	var hoverSrc = "";

	/* Add image rollover to category buttons */
	var subChildEls = sourceEl.childNodes;
	for (i = 0; i < subChildEls.length; i++) {
		if (subChildEls[i].tagName.toLowerCase() == "img") {
			normalSrc = subChildEls[i].attributes.src.value;

			if (this.debug) {
				alert(normalSrc + "\n" + normalSrc.indexOf("_roll"));
			}

			if (normalSrc.indexOf("_roll") == -1) {
				hoverSrc = normalSrc.substring(0, normalSrc.indexOf("."));
				hoverSrc += "_roll";
				hoverSrc += normalSrc.substring(normalSrc.indexOf("."), normalSrc.length);
			} else {
				hoverSrc = normalSrc.replace("_roll", "");
			}

			if (this.debug) {
				alert(normalSrc + "\n" + hoverSrc);
			}

			subChildEls[i].attributes.src.value = hoverSrc;
		}
	}
}

CanonDhtmlNavigation.prototype.init = function (url) {
	if (!document.getElementById) { return; }

	if (url && url != "") {
		this.pageUrl = new String(url);
	}

	var i = 0;
	var j = 0;
	var k = 0;

	/* Save a reference to the navigation object
	for calling from a DOM Element event handler.
	(Can maybe get around this by referenceing the
	object's instance name directly?) */
	var thisObj = this;

	var mainMenuContainers = new Array();
	var pageDivs = document.getElementsByTagName("div");
	var subMenuOpen = false;

	var childEls = null;
	var subChildEls = null;

	/* Find each of the top-level menu containers */
	if (pageDivs.length > 0) {
		for (i = 0; i < pageDivs.length; i++) {
			if (pageDivs[i].className && pageDivs[i].className == "CDNContainer") {
				mainMenuContainers[mainMenuContainers.length] = pageDivs[i];
			}
		}
	}

	/* For each of the top-level menu containers, look at the
	child nodes and set the javascript event handlers to our methods */
	if (mainMenuContainers.length > 0) {
		for (i = 0; i < mainMenuContainers.length; i++) {
			childEls = mainMenuContainers[i].childNodes;

			for (j = 0; j < childEls.length; j++) {
				if (childEls[j].className && childEls[j].className == "CDNCategory") {
					childEls[j].onclick = function () {
						thisObj.show(this);
					}
					/*
					childEls[j].onmouseover = function () {
						thisObj.hover(this);
					}
					childEls[j].onmouseout = function () {
						thisObj.hover(this);
					}
					*/
				} else if (childEls[j].className && childEls[j].className == "CDNSubmenu") {
					subMenuOpen = false;
					subChildEls = childEls[j].childNodes;

					for (k = 0; k < subChildEls.length; k++) {
						if (subChildEls[k].className && subChildEls[k].className == "CDNItem") {
							/* For each item, look at the href value
							of the contained anchor element and compare
							it to the url of the current page. If they 
							match, set the item's class to be permanently
							highlighted. Otherwise, set events for hovering */
							if (subChildEls[k].hasChildNodes()) {
								var anchorEl = subChildEls[k].firstChild;

								/* Skip the first whitespace element after the div tag */
								if (anchorEl.nodeType != 1 && anchorEl != subChildEls[k].lastChild) {
									anchorEl = anchorEl.nextSibling;
								}
								
								if (anchorEl.nodeType == 1 && anchorEl.tagName.toLowerCase() == "a") {
									/* This may need to be more complex than 
									an exact match, or indexOf. */
									/* If href="", Mac IE 5 incorrectly replaces it
									with the current URL of the page, so be sure to
									have no empty hrefs in the menu! */
									if (anchorEl.getAttribute("href") != ""
										&& anchorEl.getAttribute("href") == this.pageUrl) {
										/* Activate the current item being viewed and
										open its containing submenu */
										subChildEls[k].className = "CDNItem-Current";
										subMenuOpen = true;
									} else {
										subChildEls[k].onmouseover = function () {
											thisObj.highlight(this);
										}
										subChildEls[k].onmouseout = function () {
											thisObj.highlight(this);
										}
									}
								}
							}
						}
					}

					/* Start with submenus hidden unless selected */
					if (subMenuOpen) {
						childEls[j].style.display = "block";
						this.lastShown = childEls[j];
						switchButton(this.findParentImgId(this.lastShown), 'active', true);
					} else {
						/* The style.display property will not be set
						to anything until done so by scripting, so use
						this as a way to be able to set style="display:block"
						in the html code and force a menu item to default
						opened on page load. */
						if (childEls[j].style.display != "block") {
							childEls[j].style.display = "none";
						} else {
							this.lastShown = childEls[j];
							switchButton(this.findParentImgId(this.lastShown), 'active', true);
						}
					}
				}
			}
		}
	}

	this.initDone = true;
}

/* Create an instance of the object to control navigation */
/* var CDN; = new CanonDhtmlNavigation(); */

/* Call init from body onload method */
/* CDN.init(); */