/**
 * @author chrismurphy
 */

jQuery(function(){
												
	var renderedNav = '';						

	jQuery.get("/scripts/navigation.php", function(data){
		jQuery(data).children('category').each(function(){
			jQuery(this).children('page').each(function(){
				navCollection.push(renderItem(jQuery(this), null, true));
			});
		});
		
		for(var i=0;i<navCollection.length;i++){
			jQuery('#menuItemList').append(navCollection[i].html);
		}
		
		for(var i=0;i<subNavCollection.length;i++){
			jQuery('#subnav').append('<div id="' + subNavCollection[i].id + '" parentid="' + subNavCollection[i].parentId + '" class="subnav" style="display:none;"><ul class="clean">');
			
			for(var j=0;j<subNavCollection[i].navItemCollection.length;j++) {
				jQuery('#' + subNavCollection[i].id + ' ul').append(subNavCollection[i].navItemCollection[j].html);
			}								
			
			jQuery('#subnav').append('</ul></div>');
		}
		
		for(var i=0;i<navCollection.length;i++){
								
			// bind events to nav item
			jQuery('#' + navCollection[i].id).bind("mouseenter click", function(){
				clearTimeout(window[this.id + 'Timer']);
				clearTimeout(window[this.id + 'subTimer']);
				jQuery('#' + this.id + 'sub').show();
			});
			
			jQuery('#' + navCollection[i].id).bind("mouseleave", function(){	
				window[this.id + 'Timer'] = setTimeout("jQuery('#" + this.id + "sub').fadeOut()", 300);
			});					
		}						
		
		
		for(var i=0;i<subNavCollection.length;i++){
			try{
				var position = jQuery('#' + subNavCollection[i].parentId).position();
				var top = position.top + 22;
				// for right of nav item alignment
				//var left = position.left + jQuery('#' + subNavCollection[i].parentId).width() - 32;
				// for left of nav item alignment
				var left = position.left + 18;
				jQuery('#' + subNavCollection[i].id).css("top", top);
				jQuery('#' + subNavCollection[i].id).css("left", left);
			} 
			catch (ex) {}
			
			jQuery('#' + subNavCollection[i].id).bind("mouseenter click", function(){
				var parentid = jQuery('#' + this.id).attr('parentid');
				if(jQuery('#' + parentid).attr('parentid') != undefined && jQuery('#' + parentid).attr('parentid').length > 0)
					parentid = jQuery('#' + parentid).attr('parentid');
					
				clearTimeout(window[jQuery('#' + this.id).attr('parentid') + 'Timer']);
				clearTimeout(window[parentid + 'Timer']);
				clearTimeout(window[this.id + 'Timer']);
				jQuery('#' + this.id).show();
			});
			
			jQuery('#' + subNavCollection[i].id).bind("mouseleave", function(){
				var parentid = jQuery('#' + this.id).attr('parentid');
				var pid = null;
				if (jQuery('#' + parentid).attr('parentid') != undefined && jQuery('#' + parentid).attr('parentid').length > 0) {
					pid = jQuery('#' + parentid).attr('parentid');
					window[pid + 'Timer'] = setTimeout("jQuery('#" + pid + "').fadeOut()", 300);
				}
				window[this.id + 'Timer'] = setTimeout("jQuery('#" + this.id + "').fadeOut()", 300);
			});
			
			// handle each item within the sub nav
			for (var j = 0; j < subNavCollection[i].navItemCollection.length; j++) {
				var item = subNavCollection[i].navItemCollection[j];									
				
				jQuery('#' + item.id).bind("mouseenter click", function(){									
					
					// position nav box
					var subnavpos = jQuery('#' + this.id).position();
					//alert(jQuery('#' + this.id).parent().parent().position().top);
					var subnavtop = subnavpos.top + jQuery('#' + this.id).parent().parent().position().top - 5;
					var subnavleft = 11 + subnavpos.left + jQuery('#' + this.id).width() + jQuery('#' + this.id).parent().parent().position().left;	
					// if top is below 400px make bottom the top
					if(subnavtop > 400)
						subnavtop = subnavtop - jQuery('#' + this.id + 'sub').height() + 23;
					jQuery('#' + this.id + 'sub').css("top", subnavtop);
					jQuery('#' + this.id + 'sub').css("left", subnavleft);									
					
					clearTimeout(window[this.id + 'Timer']);
					clearTimeout(window[this.id + 'subTimer']);
					jQuery('#' + this.id + 'sub').show();
				});
				
				jQuery('#' + item.id).bind("mouseleave", function(){
					window[this.id + 'Timer'] = setTimeout("jQuery('#" + this.id + "sub').fadeOut()", 300);
				});
			}
	}							
	},
	"xml"
	);
});

var navId = 0;
var subNavCollection = new Array();
var navCollection = new Array();

function renderItem(item, parentid, hideMoreSymbol) {
	var str = '';
	var parent = item.attr('parent');
	var link = item.children('url').text();
	var text = item.children('title').text();
	
	var pid = '';
	if(parentid != undefined && parentid.length > 0)
		pid = 'parentid="'+parentid+'"';
	
	var nav = new NavItem('nav' + navId);
	
	// create nav item
	if (link.length > 0 && parent != 'true') 
		nav.html = '<li id="nav' + navId + '" ' + pid + '><a href="/' + link + '">' + text + '</a></li>';
	else {
		if(hideMoreSymbol)
			nav.html = '<li id="nav' + navId + '" ' + pid + '><div style="cursor:pointer;">' + text + '</div></li>';
		else
			nav.html = '<li id="nav' + navId + '" ' + pid + '><div style="cursor:pointer;">+ ' + text + '</div></li>';
	}						
			
	// increment nav id counter
	navId++;
							
	// render sub navs
	if (item.children('page').length > 0) {
		var subNavGroup = new SubNavGroup('nav'+(navId-1)+'sub');
		subNavGroup.parentId = 'nav' + (navId - 1);
		var subNavItems = new Array();
		
		item.children('page').each(function(){
			subNavItems.push(renderItem(jQuery(this), subNavGroup.id));
		});
			
		subNavGroup.navItemCollection = subNavItems;								
		
		// add to collection
		subNavCollection.push(subNavGroup);					
	}						
	
	return nav;
}

var SubNavGroup = Class.create({
	initialize: function(id) {
		this.id = id;
		this.parentId = '';
		this.navItemCollection = '';
	}
});
var NavItem = Class.create({
	initialize: function(id) {
		this.id = id;
		this.html = '';
	}
});
