//------------------------------------
//		
//------------------------------------

// load our stylesheet
//addStyleSheet('menu.horizontal', 'menu.horizontal/style.css');

// register onload init
addListener(window, 'load', addBehaviorHorizontal);

// tests
function test1() {
	var report = document.getElementById('report');
	if (report) {
		report.value ="";
	}
}

//------------------------------------
//		
//------------------------------------
function addBehaviorHorizontal() {
	addBehaviorTo('menu');
}

function addBehaviorTo(className) {
	// get menu roots
	var node;
	var i = 0;
	var k = 1;
	while((node = document.getElementsByTagName('UL').item(i++))) {
		reportln(node.tagName+' '+node.className);
		if (node.className == className) {
			for (var j = 0; j < node.childNodes.length;j++) {
				if (node.childNodes[j].tagName == 'LI') {
					initMenuItem(node.childNodes[j], k++, className);
				}
			}
		}
	}
}

function initMenuItem(li, num, className) {
	// to emulate :first-child
	if (num == 1 && li.parentNode.className != className) {
//		li.style.borderTopWidth = '1px';
	}
	//li.style.backgroundColor = 'red';
	for (var i = 0; i < li.childNodes.length;i++) {
		addListener(li, 'mouseover', showSubmenu);
		addListener(li, 'mouseout',  hideSubmenu);
		if (li.childNodes[i].tagName == 'UL') {
			var nodeUL = li.childNodes[i];
			li.cachedUL = nodeUL;
			// 1 + n-level submenu
			if (li.parentNode.className != className) {
				// ul position - 
				// TODO - i am unable to find its width
				// anyway it is a bad idea, cos it changes with zoom
				// nodeUL.style.left = li.style.pixelWidth;
				// background arrow
//				li.style.backgroundRepeat = 'no-repeat';
//				li.style.backgroundImage = 'url("menu.horizontal/sub.gif")';
//				li.style.backgroundColor = 'white';
//				li.style.backgroundPosition = '99%';
			}
			if (li.parentNode.className == 'vmenu') {
//				li.style.backgroundRepeat = 'no-repeat';
//				li.style.backgroundImage = 'url("menu.vertical/leve_menu_policko_sub.gif")';
//				li.style.backgroundColor = 'white';
			}
			// done for all, not just with submenu
			//addListener(li, 'mouseover', showSubmenu);
			//addListener(li, 'mouseout',  hideSubmenu);
			var k = 1;
			for (var j = 0; j < nodeUL.childNodes.length;j++) {
				if (nodeUL.childNodes[j].tagName == 'LI')
					initMenuItem(nodeUL.childNodes[j], k++);
			}
		}
	}
}

function showSubmenu(e) {
	if (!e) var e = window.event;
	var target = getTarget(e);
	if (target.tagName == 'A')
		target = target.parentNode;
	if (target.cachedUL)
		target.cachedUL.style.display = 'block';
	// hover
//	target.style.backgroundColor = '#cc0001';
}

function hideSubmenu(e) {
	if (!e) var e = window.event;
	var target = getTarget(e);
	var related = getRelatedTarget(e);
	if (!related || related.tagName == 'HTML') 
		related = document.getElementsByTagName('body')[0];
	report('out '+target.tagName+'->'+related.tagName);
	report("\n");
	// maybe mouse left only into successor, handle 
	if (target.tagName == 'A')
		target = target.parentNode;
	if (1) {
//		target.style.backgroundColor = 'white';
	}
	
	if (isAncestor(target, related))
		return;
	
	// it left into ancestor
	
	
	// find ul upon related node or body
	var commonUL = related;
	while (commonUL.tagName != 'UL' && commonUL.tagName != 'BODY')
		commonUL = commonUL.parentNode;
	// iterate up the tree from target till commonUL and close submenu
	report('coUL:'+commonUL.tagName+'::');
	while (target != commonUL && target.tagName != 'BODY') {
		report(target.tagName+'~');
		if (target.cachedUL) {
			target.cachedUL.style.display = 'none';
		}
		target = target.parentNode;
	}
	report("\n");
}

//------------------------------------
//	retrieve target for event
//------------------------------------

function getTarget(e) {
	var target;
	if (e.target) target = e.target;
	else if (e.srcElement) target = e.srcElement;
	if (target.nodeType == 3) // defeat Safari bug
		target = target.parentNode;
	
	return target;
}

//------------------------------------
//	retrieve related target for event
//------------------------------------

function getRelatedTarget(e) {
	return (e.relatedTarget) ? e.relatedTarget : e.toElement;
}

function addListener(obj, event, handler) {
	if (obj.addEventListener) {
		obj.addEventListener(event, handler, false);
	} else if (obj.attachEvent) {
		obj.attachEvent('on' + event, handler);	
	} else {
		window.status = 'Please upgrade to more recent browser like ie6.0 or firefox.';
	}
}

function addStyleSheet(title, href) {
	var head = document.getElementsByTagName('head')[0];
	var link = document.createElement('link')
	link.rel = 'stylesheet';
	link.type = 'text/css';
	//link.title = title;
	link.href = href;
	
	head.appendChild(link);
}

var debug = 0;

function report(txt) {
	var report = document.getElementById('report');
	if (report && debug) {
		report.value += txt;
	}
}
function reportln(txt) {
	var report = document.getElementById('report');
	if (report && debug) {
		report.value += txt + "\n";
	}
}

function isAncestor(ancestor, child) {
	while (child != ancestor && child.nodeName != 'BODY')
		child = child.parentNode;
	return child == ancestor ? 1 : 0;
}