var childTable;
var hide = false;
$(document).ready(function (){
	
	$("tr.parent").click(function (){
		openNode($(this).attr("nodeId"));
	});
	
	$("td.point").hover(function (){$(this).attr("class","pointSelected")},function (){$(this).attr("class","point")});
	$.each($("table.layer"), function(){
		
		var id = $(this).attr("parentId");
		
		$(this).hover(function (){hide=false;},function (){hide=id;setTimeout('hideChild()',1);});
		
		
		$("td[nodeId='"+id+"']").hover( 
			function(){
				hideChild();
				childTable = $("table.layer[parentId='"+id+"']");
				var offset = $(this).offset();
				childTable.css("left","163px");
				childTable.css("top", (offset.top-2)+"px");
				childTable.show();
			}, 
			function(){
				hide = id;
				setTimeout('hideChild()',1);
			} 
		);
	});
});


function hideChild(){
	
	if (hide > 0) {
		childTable = $("table.layer[parentId='"+hide+"']");
		childTable.hide();
	}
}

function openNode ( parentId ){
	child = $("tr.child[parentId='"+parentId+"']:first");
	isVisible = child.css("display");
	
	if( isVisible == "none" ){
		$("tr.child[parentId='"+parentId+"']").show();
	}else{
		if ( isVisible != "undefined" ){
			$("tr.child[parentId='"+parentId+"']").hide();	
		}
	}
}



