$(function() {
	// hide all the sub-menus
	$("span.toggle").next().hide();

	// add a link nudging animation effect to each link
    $("#jQ-menu a, #jQ-menu span.toggle").hover(function() {
        $(this).stop().animate( {
			//fontSize:"17px",
			//paddingLeft:"10px",
			color:"black"
        }, 0);
        //}, 300);
    }, function() {
        $(this).stop().animate( {
			//fontSize:"14px",
			//paddingLeft:"0",
			color:"#808080"
        }, 0);
        //}, 300);
    });
	
	// set the cursor of the toggling span elements
	$("span.toggle").css("cursor", "pointer");
	
	// prepend a plus sign to signify that the sub-menus aren't expanded
	$("span.toggle").prepend("+ ");

	// 20101104 expand from son up to the root
	// TODO: set '+' => '-'
    $("#jQ-menu li").children().each(function(i)
    {
		if($(this).is('#clicked_this'))
		{
			// this class sets properties for the selected 'son'
			$(this).addClass('activeSon');

			// this CSS opens all the ancestors of the selected son.
			// DO NOT use "addClass", it will be overwritten by inline CSS style
			$(this).parents('div.submenu').css('display','block');

			$(this).parents('div.submenu')
				.map(function () { 
                   // return this.tagName; 
					// alert( $(this).text().replace("+","-") );
					$(this).text().replace("+","-");
                })

			// html( "-" + $(this).html().substring( 1 ) );
            // $(this).show();
        }
        else
        {
            // $(this).hide();
        }
    });

	// add a click function that toggles the sub-menu when the corresponding
	// span element is clicked
	$("span.toggle").click(function() {
		$(this).next().toggle(0);
		//$(this).next().toggle(1000);

		// switch the plus to a minus sign or vice-versa
		var v = $(this).html().substring( 0, 1 );
		if ( v == "+" )
		{
			// alert("Explode");
			$(this).html( "-" + $(this).html().substring( 1 ) );
		}
		else if ( v == "-" )
		{
			// alert("Implode");
			$(this).html( "+" + $(this).html().substring( 1 ) );
		}
	});
});