function PositionExtendedPanel(extendedPanelClientID, buttonPanelClientID) {
	var panel = $(extendedPanelClientID);
	var button = $(buttonPanelClientID);


	if (button.position() != null) {

		
		panel.attr("isOpen", "false");
		panel.attr("isMouseOver", "false");
		button.attr("isMouseOver", "false");


//		button.hover(
//			function () {
//				button.attr("isMouseOver", "true");
//			ShowExtendedPanel(panel, button);
//			},
//		function () {
//			button.attr("isMouseOver", "false");
//				HideExtendedPanel(panel, button);
//				});

		//open and close just in case user doesn't goes over the panel
		button.click(
		  function () {
		  	ShowExtendedPanel(panel, button);
		  	HideExtendedPanel(panel, button);
		  }
		);


		panel.hover(
				function () {
					panel.attr("isMouseOver", "true");
					ShowExtendedPanel(panel, button);
				},
				function () {
					panel.attr("isMouseOver", "false");
					HideExtendedPanel(panel, button);
				}
			);
	}
}



function ShowExtendedPanel(panel, button) {
	if ($(panel).attr("isOpen") != "true") {

		if ($(panel).attr("typeof") == "widget")
			ShowWidgetExtendedPanel(panel, button);
		else
			ShowNormalExtendedPanel(panel, button);

		$(panel).attr("isOpen", "true");
		$(panel).slideDown(700);
	}
}


function ShowNormalExtendedPanel(panel, button)
{
	var top = button.offset().top + button.height();
	//var left = button.offset().left;

	panel.css({
			"top": button.height() + "px",
			"left": "0px"
		});
}


function ShowWidgetExtendedPanel(panel, button)
{

	var top = button.offset().top + button.height();
	//var left = button.offset().left;

	panel.css({
		"top": button.height() + "px",
		"right": "0px"
	});
}

function HideExtendedPanel(panel, button) {

	window.setTimeout(function () {
		if ($(panel).attr("isOpen") == "true"
			&& $(panel).attr("isMouseOver") != "true"
			&& $(button).attr("isMouseOver") != "true"
			)
		{
			$(panel).slideUp(300);
			$(panel).attr("isOpen", "false");
		}
	}
         , 2000);

}