// JavaScript Document

/*
* FUNCTION: addBorders
* PURPOSE: handle submenu border's easily...
* NOTES: 4 DIV's are added with certain class properties:
			submenu
			|_____ left_border
			|___________right_border
			|_________________top_border
			
		Use them as you wish... this is all the function does.
		
		NOTE: THE DIV'S ARE ADDED AS PARENTS OF THE PASSED OBJECT.
		the object is detached from the DOM and reattached as a child of the new DIV's.
		The new DIV's are attached to the old parent of the passed object.
		
* RETURN: the new root element for the submenu is returned.
		  if you look at the NOTES section, submenu is the root element.
		  That is the element that is returned.
*/

function addSideBorders(object) {
	var left_border = document.createElement('DIV');
	var right_border = document.createElement('DIV');
	var childNodes = object.childNodes;
	
	for (var i = 0; i < childNodes.length; ++i) {
		object.removeChild(object.childNodes[i]);
	}
	left_border.className="left-border";
	right_border.className="right-border";
	
	object.parentNode.removeChild(object);
	parent.appendChild(submenu);
	
	submenu.appendChild(left_border);
	left_border.appendChild(right_border);
	right_border.appendChild(object);
	
	for (var i = 0; i < childNodes.length; ++i) {
		object.removeChild(object.childNodes[i]);
	}
	
	return object;
};

//Add menu events.
function addMenuHandlers(object) {
	var div = object.getElementsByTagName('DIV')[0];
	var span = object.getElementsByTagName('span')[0];
	if (div) {
		addEventListener( object, 'mouseover', function(e) { 
														div.style.display = "block"; 
														if (div.timer) clearTimeout(div.timer); 
														}, false );
		addEventListener( object, 'mouseout', function(e) { div.timer = setTimeout(function() { div.style.display = "none"; }, 250 ); }, false ); }
};

//Add menu, image over-state event.
function addMenuOverState(object) {
	if (object) {
		addEventListener( object, 'mouseover', function(e) {
			clearTimeout(object.timing);
			if (object.className == 'hover') return;
			object.originalClass = object.className;
			object.className = 'hover';
		}, false );
		addEventListener( object, 'mouseout', function(e) {
			object.timing = setTimeout(function() {
				object.className = object.originalClass;
			}, 250);
		}, false );
	}
};

//adds a menu event - cross browser compliant.
function addEventListener( element, event_name, observer, capturing ) {
    if ( element.addEventListener ) // the DOM2, W3C way  
        element.addEventListener( event_name, observer, capturing );
    else if ( element.attachEvent ) // the IE way  
        element.attachEvent( "on" + event_name, observer );
}