$(document).ready(function(){

    /*
    
    *   variables used and expected:
    *   menu_data - java object holding all the data related to the menu
    *   current_menu_id - current menu that's being viwed
    *   current_submenu_id - current page being viewed
    *   menu - jquery object where the menu ends up
    *   current_scroll_position - integer that holds the position where the menu should start drawing its content
    *   menu_max_submenus - variable that decides the maximum number of menus shown at the same time
    *   submenu_length - number of items in the current submenu
    
    */

	menu = $("#subNavi");
	if (typeof current_scroll_position == 'undefined')
	    current_scroll_position = 0;
	menu_max_submenus = 6;
	submenu_length = 0;
});	

function bind_menu()
{
	menu.find("a.menuitem").each(function(){
		$(this).bind('click', function(){
			current_scroll_position = 0;
			draw_menu(this.id, 0);
			return false;
		});
	});
	menu.find(".subSubTop a").each(function(){
		$(this).bind("click", function(){ scroll_submenu('up'); return false; });
	});

	menu.find(".subSubBottom a").each(function(){
		$(this).bind("click", function(){ scroll_submenu('down'); return false; });
	});
	
	menu.find(".subSub").each(function(){
	    $(this).mousewheel(mousewheel);
	});
}

function mousewheel(event, delta)
{
    if (delta > 0)
        scroll_submenu("up");
    if (delta < 0)
        scroll_submenu("down");
    event.preventDefault();
}

function scroll_submenu(direction)
{
	if(direction == "up" && current_scroll_position > 0)
	{
		current_scroll_position--;
	}

	else if(direction == "down" && (current_scroll_position + menu_max_submenus) < submenu_length)
	{
		current_scroll_position++;
	}
	draw_menu(current_menu_id, current_scroll_position);
}

function draw_menu(chosen_menu_id, submenu_start)
{
    
    if (current_submenu_id == "" && menu_data.length > 0 && chosen_menu_id == "")
        chosen_menu_id = menu_data[0].id;
    
    for (i = 0; i < menu_data.length; i++)
    {
        var submenu_counter = 0;
        for (j = 0; j < menu_data[i].children.length; j++)
        {
            submenu_counter++;
            if (current_submenu_id == menu_data[i].children[j].id)
                if (chosen_menu_id == "")
                    chosen_menu_id = menu_data[i].id;
        }
    }
    
	html = "<ul>";
	$.each(menu_data, function(i,item){

		var menu_id = "";
		var menu_text = "";

		$.each(item, function(i2,item2){
		    if (i2 == "children")
		        current_submenu_length = item2.length;
			if(i2 != "children")
			{
				if(i2 == "id"){			menu_id = item2;}
				else if(i2 == "text"){	menu_text = item2;}
			}

			else if(chosen_menu_id == menu_id)
			{
				var counter = 0;
				subhtml = "";

				$.each(item2, function(i3,item3){
					var submenu_id = "";
					var submenu_text = "";
					var submenu_link = "";

					$.each(item3, function(i4,item4){
						if(i4 != "children")
						{
							if(i4 == "id"){			submenu_id = item4;}
							else if(i4 == "text"){	submenu_text = item4;}
							else if(i4 == "href"){	submenu_link = item4;}

							submenu_length = item2.length;
						}
					});

					if(submenu_text != '')
					{
						if(counter >= (menu_max_submenus + submenu_start) || counter < submenu_start)
						{
							counter++;
							return;
						}
						subhtml += '<li class="subSub"><a href="' + submenu_link  + ( document.location.href.indexOf('?csp=') != -1 ? '&csp=' + current_scroll_position : '') +  '"' + (current_submenu_id == submenu_id ? ' class="active"' : '') + '>' + submenu_text  + '</a></li>';
						counter++;
					}
				});

				if(counter <= menu_max_submenus)
					subhtml += "<li class='subEmpty'><a href='#' style='height: " + ((menu_max_submenus - counter) * 22 + 19) + "px;'>&nbsp;</a></li>";
				
			}
		});
		
		if(menu_text != '')
		{
			html += '<li' + (chosen_menu_id == menu_id ? ' class="active"' : '') + '><a href="#" ' + (current_submenu_length > 0 ? 'class="menuitem" id="' + menu_id + '"' : '') + '>' + menu_text + '</a></li>';
			if(chosen_menu_id == menu_id && subhtml != '')
			{
				current_menu_id = chosen_menu_id;
				if(submenu_length > menu_max_submenus)
					html += '<li class="subSubTop"><a href="#"></a></li>';
					
				html += subhtml;
				
				if(submenu_length > menu_max_submenus)
					html += '<li class="subSubBottom"><a href="#"></a></li>';
			}
		}
	});
	
	html += "</ul>";

	menu.html(html);
	bind_menu();
}