var hideTimerId = 0;
var currentActiveParentId = 0;
var node;
var activeParentOriginalClass="";
var linkBottomOriginalClass="";


function showMegaDropdown( parentId ) {	
	cancelTerminateMegaDropdown();
	if( currentActiveParentId != parentId ) {
		terminateMegaDropdown();
	}

	var parentEl = document.getElementById(parentId); 
	var divTags = parentEl.getElementsByTagName('div');
	
	if( currentActiveParentId == parentId ) {
		if (node && node.hasChildren) {
			addActiveHoverCSSClass( parentId );
			
			j('div#megaDropdown').css('display','');
			//j('li#' + parentId + ' div.linkConnector').css('display','');
			divTags[1].style.display = '';
		} 
	}
	else {
		node = com.ibm.portal.services.NAVIGATION_MODEL.getNode(parentId);
		// No menu to create if the node has no children!
		if (node && node.hasChildren) {
			addActiveHoverCSSClass( parentId );
			
			// empty the dropdown and display
			j('div#megaDropdown').empty().css('display','');
			//j('li#' + parentId + ' div.linkConnector').css('display','');
			//j('div#megaDropdown').empty().slideDown('normal').show();
			divTags[1].style.display = '';
			
			var levelOneNodes = node.getChildren();


			// Loop through the level one nodes (direct child of parent)
			var i;
			for ( i = 0; i < levelOneNodes.length; i++) {
				var topicWrapperEl = document.createElement("div");
				//topicWrapperEl.setAttribute("class","topicWrapper");
				topicWrapperEl.className='topicWrapper';

				// Add a title (topic) div node to the wrapper
				var topicTitleEl = document.createElement("div");
				topicTitleEl.className='topicTitle';

				topicTitleDivChildEl = document.createElement("div");

				topicTitleLinkChildEl = document.createElement("a");
				topicTitleLinkChildEl.href = "javascript:com.ibm.portal.navigation.controller.NAVIGATION_CONTROLLER.setSelection('" + levelOneNodes[i].URI + "', null, null, '');";
				topicTitleLinkChildEl.onclick = function() {terminateMegaDropdown();}; 
				topicTitleLinkChildEl.innerHTML = levelOneNodes[i].title;
				topicTitleDivChildEl.appendChild( topicTitleLinkChildEl ); 
				topicTitleEl.appendChild( topicTitleDivChildEl );
				
				topicWrapperEl.appendChild( topicTitleEl );

        /*
				// add unordered list regardless whether it has children
				var unorderedListEl = document.createElement("ul");
				// add unordered list to div topic wrapper
				topicWrapperEl.appendChild( unorderedListEl );
				
				
				if( levelOneNodes[i].hasChildren ) {	
					var levelTwoNodes = levelOneNodes[i].getChildren();

					for( var j=0; j < levelTwoNodes.length; j++ ) {								
						var subTopicEl = document.createElement("li");
						unorderedListEl.appendChild( subTopicEl );

						var subTopicLinkEl = document.createElement("a");
						subTopicEl.appendChild( subTopicLinkEl );

						if( j == 3 ) {
							subTopicLinkEl.innerHTML = 'More...';
							subTopicLinkEl.href = "javascript:com.ibm.portal.navigation.controller.NAVIGATION_CONTROLLER.setSelection('" + levelOneNodes[i].URI + "', null, null, '');";
							subTopicLinkEl.onclick = function() {terminateMegaDropdown();}; 
							break;
						}
						else {
							subTopicLinkEl.innerHTML = levelTwoNodes[j].title;
							subTopicLinkEl.href = "javascript:com.ibm.portal.navigation.controller.NAVIGATION_CONTROLLER.setSelection('" + levelTwoNodes[j].URI + "', null, null, '');";
									subTopicLinkEl.onclick = function() {terminateMegaDropdown();}; 
						}
					}
				}
				*/
 
				j('div#megaDropdown').append(topicWrapperEl);
			}
 
      
					// pad the remaining so each line has 6 or 12
			for( ; i % 6 != 0; i++ ) {
				var topicWrapperEl = document.createElement("div");
				topicWrapperEl.className='topicWrapper';
				// Add a title (topic) div node to the wrapper
				var topicTitleEl = document.createElement("div");
				topicTitleEl.className='topicTitle';
				topicTitleDivChildEl = document.createElement("div");
				topicTitleEl.appendChild( topicTitleDivChildEl );
				topicWrapperEl.appendChild( topicTitleEl );
				//topicWrapperEl.appendChild( document.createElement("ul") );
				j('div#megaDropdown').append(topicWrapperEl);
			}
			
			

			var clearFixEl = document.createElement("div");
			clearFixEl.className='clearfix';

			var megaDropdownBottomEl = document.createElement("div");
			megaDropdownBottomEl.className='megaDropdownBottom';

			j('div#megaDropdown').append(clearFixEl).append(megaDropdownBottomEl);
		}

		// Assign the parentId to currentActiveParentId for 'caching'
		currentActiveParentId = parentId;
	}
}

function hideMegaDropdown() {
	//this function calls another function for megadropdown to be hidden after an interval
	hideTimerId = setTimeout( "terminateMegaDropdown()", 200 );
}

function cancelTerminateMegaDropdown() {
	if( hideTimerId != 0 ) {
		clearTimeout( hideTimerId );
	}
} 

function terminateMegaDropdown() {
	j('div#megaDropdown').css('display','none');
	if( currentActiveParentId != 0 ) {
		var parentEl = document.getElementById(currentActiveParentId);
		if(parentEl!=null) {
			var divTags = parentEl.getElementsByTagName('div');
			divTags[1].style.display = 'none';
		}
	}

	revertActiveHoverCSSClass( currentActiveParentId );
	//j('div#megaDropdown').slideUp('normal');
}


String.prototype.endsWith = function(str) {
	return (this.match(str+"$")==str);
};

function addActiveHoverCSSClass( parentId ) {
	var parentEl = document.getElementById(parentId);
	if( !(parentEl.className).endsWith("activeHover") ) {
		activeParentOriginalClass = parentEl.className; 
		parentEl.className=parentEl.className + " activeHover";
	}

	var linkBottomElement = parentEl.getElementsByTagName('div')[0];
	if( !(linkBottomElement.className).endsWith("linkBottomActiveHover") ) {
		linkBottomOriginalClass = linkBottomElement.className; 
		linkBottomElement.className=linkBottomElement.className + " linkBottomActiveHover";
	}
}

function revertActiveHoverCSSClass( parentId ) {
	if( parentId != 0 ) {
		if( activeParentOriginalClass != "" ) {
			var parentEl = document.getElementById(parentId);
			if (parentEl!=null) {
				parentEl.className=activeParentOriginalClass;
			}
		}

		if(( linkBottomOriginalClass != "" )&&(parentEl!=null)) {
			var linkBottomElement = parentEl.getElementsByTagName('div')[0];
			linkBottomElement.className=linkBottomOriginalClass;
		}
	}
}
