var last_popped = null;
var popped_in_use = false;

var last_timeout = null;

function prepareLastPopped(evt) {

	last_popped.onmouseleave = removeLastPopped;

	popped_in_use = true;

}

function removeLastPopped(evt) {

	if (last_popped != null) {

		last_popped.parentNode.removeChild(last_popped);
		last_popped = null;

	}

}

function forcePoppedHiding(evt) {

	function cancelPopping() {

		last_timeout = null;

		if (!popped_in_use) {

			removeLastPopped(null);

		}

	}

	last_timeout = setTimeout(cancelPopping, 500);

}

function showMenu(target, inner) {

	function waitForEvent(evt) {

		if (last_timeout != null) {

			clearTimeout(last_timeout);
			last_timeout = null;

		}

		removeLastPopped(null);

		if (inner == null)
			return;

		var menubar = document.createElement('div');

		menubar.id = 'myMenu';
		menubar.className = 'menu_arrow_box'
		menubar.innerHTML = inner ;
		document.body.insertBefore(menubar, document.body.childNodes[0]);

		var rect = target.getBoundingClientRect();
		var menu_rect = menubar.getBoundingClientRect();

		menubar.style.left = (rect.left - (menu_rect.width - rect.width) / 2) + "px";
		menubar.style.top = (rect.bottom + 20) + "px";

		last_popped = menubar;
		popped_in_use = false;

		menubar.onmouseenter = prepareLastPopped;
		target.onmouseleave = forcePoppedHiding;

	}

	return waitForEvent;

}

function addMenuToID(id, inner) {

	var target = document.getElementById(id);

	target.onmouseenter = showMenu(target, inner);

}