var shownmenus = [];
jQuery(function() {

	var handles = jQuery(".dvdropmenuhandle[rel]");
	for (var i = 0; i < handles.length; i++) {
		var handle = jQuery(handles[i]);
		var rel = handle.attr("rel");
		var popup = jQuery(".dvdropmenu[rel=" + rel + "]");

		if (popup.length == 0)
			return;

		var span = jQuery("<span style='position:relative;vertical-align:top;overflow:visible;'></span>");
		var div = jQuery("<div style='position:absolute;z-index:100;display:none;' class='dvmenudiv'></div>").appendTo(span);
		var table = jQuery("<table style='border-collapse:collapse;'></table>").appendTo(div);
		var tr = jQuery("<tr></tr>").appendTo(table);
		var td = jQuery("<td style='padding:0px'></td>").appendTo(tr);
		var wrapperSpan = jQuery("<span></span>");
		popup.appendTo(td);
		popup.css("display", "block");
		handle.wrap(wrapperSpan);
		wrapperSpan = handle.parent();
		//replaceStyles(handle, wrapperSpan);
		span.prependTo(wrapperSpan);

		div.css("top", handle.height() + "px");
		wrapperSpan[0].dvdropmenu = div[0];
		wrapperSpan.mouseover(function() {
			menuover(this.dvdropmenu);
		}).mouseout(function() {
			menuout(this.dvdropmenu);
		});
	}

	var menuitems = jQuery(".dvmenuitem");
	for (var n = 0; n < menuitems.length; n++) {
		var menuitem = jQuery(menuitems[n]);
		rel = menuitem.attr("rel");
		var submenus = jQuery(".dvsubmenu[rel=" + rel + "]");
		if (submenus.length > 0) {
			var submenu = jQuery(submenus[0]);
			var span = jQuery("<span style='position:relative;vertical-align:top;overflow:visible;'></span>");
			var div = jQuery("<div style='position:absolute;z-index:100;left:0px;top:0px;display:none;' class='dvmenudiv'></div>").appendTo(span);
			var table = jQuery("<table style='border-collapse:collapse;'></table>").appendTo(div);
			var tr = jQuery("<tr></tr>").appendTo(table);
			var td = jQuery("<td style='padding:0px;'></td>").appendTo(tr);
			var wrapperSpan = jQuery("<span></span>");
			submenu.appendTo(td);
			submenu.css("display", "block");
			menuitem.wrap(wrapperSpan);
			wrapperSpan = menuitem.parent();
			//replaceStyles(menuitem, wrapperSpan);
			span.appendTo(wrapperSpan);

			wrapperSpan[0].dvdrophandle = menuitem[0];
			wrapperSpan[0].dvdropmenu = div[0];
			//alert(div[0]);
			//alert(menuitems[n]);
			//alert(menuitem[0]);
			wrapperSpan.mouseover(function() {
				menuover(this.dvdropmenu, this.dvdrophandle);
			}).mouseout(function() {
				menuout(this.dvdropmenu, this.dvdrophandle);
			});
		}
	}

});

function menuover(ele, handle) {
	clearTimeout(ele.hidetimeout);
	ele.showtimeout = setTimeout(function() { showmenu(ele, handle); }, 300);
}

function menuout(ele, handle)
{
	clearTimeout(ele.showtimeout);
	ele.hidetimeout = setTimeout(function() { hidemenu(ele, handle); }, 500);
}

function showmenu(ele, handle)
{
	
	if (handle != undefined && handle != null && jQuery(handle).css("display") == "block") {
		handle = jQuery(handle);
		//alert("display == 'block' width = " + handle.outerWidth(true) + " height = " + handle.outerHeight(true));
		jQuery(ele).css("top", (-1 * handle.outerHeight(true)) + "px");
		jQuery(ele).css("left", handle.outerWidth(true) + "px");
	}
	menu = jQuery(ele);
	menu.fadeIn(200);
}

function hidemenu(ele, handle)
{
	menu = jQuery(ele);
	menu.fadeOut(200);
}

function replaceStyles(from, to)
{
	from = jQuery(from)
	to = jQuery(to);
	
	to.css("margin-top", from.css("margin-top"));
	to.css("margin-right", from.css("margin-right"));
	to.css("margin-bottom", from.css("margin-bottom"));
	to.css("margin-left", from.css("margin-left"));
	from.css("margin-top", "0px");
	from.css("margin-right", "0px");
	from.css("margin-bottom", "0px");
	from.css("margin-left", "0px");
}