var UserMenu = {

	containerID: 'userNickMenu',
	showTimeout: 750,
	hideTimeout: 300,
	showStatus: false,
	
	show: function(e,data)
	{
		try {
			if ( !e ) var e = window.event;
			
			var eventParams = {};
			eventParams.currentTarget	= getSourceElement(e); // Get element which generate event
			eventParams.mousePos		= getMousePosition(e); // Get mouse position relative to the document
			eventParams.clientX			= e.clientX; // Get mouse horizontal position relative to the view document frame
			eventParams.clientY			= e.clientY; // Get mouse vertical position relative to the view document frame

			UserMenu.showTimer = setTimeout( function() { UserMenu.showPopupMenu(eventParams,data) }, this.showTimeout);
		} catch (ex) {}
	},
	
	hide: function()
	{
		try {
			if (UserMenu.showTimer)
			{
				clearTimeout( UserMenu.showTimer );
				UserMenu.showTimer = null;
			}
			if ( this.showStatus )
			{
				clearTimeout( UserMenu.hideTimer );
				UserMenu.hideTimer = setTimeout( 'UserMenu.hidePopupMenu()', this.hideTimeout);
			}
		} catch (ex) {}
	},
	
	showPopupMenu: function (eventParams,data)
	{
		try {
			if ( eventParams.currentTarget == this.previousTarget ) return;
			
			// Create empty node for replacement menu HTML code
			var container = this.createWrapper();
			// Place menu HTML code in container
			container.innerHTML = tmpl("user_menu", this.prepareData(data));
			
			// Get menu element
			for ( var i = 0; i < container.childNodes.length; i++) {
				if ( 1 === container.childNodes[i].nodeType ) {
					var menu = container.childNodes[i];
					break;
				}
			}

			// Calc menu position
			var menuPos = UserMenu.calcPosition(eventParams,menu);
			
			// Set menu position
			menu.style.left	= menuPos.x + 'px';
			menu.style.top	= menuPos.y + 'px';
			
			// Set menu shadow dimensions
			var shadow = document.getElementById('userNickMenuShadow');
			if (shadow)
			{
				shadow.style.width	= menu.offsetWidth - 1;
				shadow.style.height	= menu.offsetHeight - 1;
			}
			
			// Add menu events
			menu.onmouseover = function () {
				clearTimeout(UserMenu.hideTimer);
			};
			menu.onmouseout = function () {
				UserMenu.hide();
			};
			
			// Change previous target value
			container.style.display = 'block';
			UserMenu.previousTarget = eventParams.currentTarget;
			clearTimeout( UserMenu.hideTimer );
			this.showStatus = true;
		} catch (ex) {}
	},
	
	hidePopupMenu: function ()
	{
		try {
			var container = document.getElementById(this.containerID);
			if ( !container ) return;

			UserMenu.previousTarget = null;
			container.style.display = 'none';
			container.innerHTML = '';
			this.showStatus = false;
		} catch (ex) {}
	},
	
	// Create empty node for replacement menu HTML code
	createWrapper: function ()
	{
		var wrapper = document.getElementById(this.containerID);
		if ( wrapper ) {
			wrapper.style.display = 'block';
			return wrapper;
		}

		replacementBox = document.createElement('div');
		replacementBox.setAttribute('id',this.containerID);
		document.body.appendChild(replacementBox);

		return replacementBox;
	},

	prepareData: function (data) {
		
		// If isn't JSON object then exit
		if ( !data ) return false;

		// Create menu items object
		var items = {};
		for ( var k = 0; k < data.length; k++ ) {
			switch ( data[k].type ) {
				case 'nick':
					items[data[k].type] = data[k].caption;
					break;
				case 'profit':
					items[data[k].type] = data[k].caption;
					break;
				case 'account':
					items[data[k].type] = data[k].caption;
					break;
				case 'status':
					items[data[k].type] = data[k].caption;
					break;
				case 'user_action':
					if ( !items.links ) items.links = [];
					items.links.push( data[k] );
					break;
				case 'link':
					if ( !items.links ) items.links = [];
					items.links.push( data[k] );
					break;
				case 'hr':
					if ( !items.links ) items.links = [];
					items.links.push( data[k] );
					break;
			}
		}
		return items;
	},
	
	calcPosition: function(eventParams,menu)
	{
		var menuPosX	= menuPosY = 0; // Initialize menu position
		var targetPos	= getElementPosition(eventParams.currentTarget); // Get target element position relative to the document
		
		// Calc menu position
		if ((eventParams.clientX + menu.offsetWidth + 20) < getClientWidth())
			menuPosX = eventParams.mousePos.x;
		else
			menuPosX = getClientWidth() - menu.offsetWidth - 20;
		//
		if ((eventParams.clientY + menu.offsetHeight + 20) < getClientHeight())
		{
			menuPosY = targetPos.y + eventParams.currentTarget.offsetHeight + 18;
			document.getElementById('user_menu_arrow').className = 'arrow-reference arrow-reference-top';
		}
		else
		{
			menuPosY = targetPos.y - menu.offsetHeight - 15;
			document.getElementById('user_menu_arrow').className = 'arrow-reference arrow-reference-bottom';
		}
		return {x:menuPosX,y:menuPosY};
	}
}


//

function getClientWidth() {
	return document.compatMode == 'CSS1Compat' && !window.opera ? document.documentElement.clientWidth : document.body.clientWidth;
}

function getClientHeight() {
	return document.compatMode == 'CSS1Compat' && !window.opera ? document.documentElement.clientHeight : document.body.clientHeight;
}

function getMousePosition(e) {
	if (!e) var e = window.event;
	var posx = posy = 0;
	if ( e.pageX || e.pageY ) {
		posx = e.pageX;
		posy = e.pageY;
	}
	else if ( e.clientX || e.clientY ) {
		posx = e.clientX + document.body.scrollLeft
			+ document.documentElement.scrollLeft;
		posy = e.clientY + document.body.scrollTop
			+ document.documentElement.scrollTop;
	}
	// x and y contain the mouse position relative to the document
	return {x:posx,y:posy};
}

function getElementPosition(obj) {
	if (!obj) return;
	var posx = posy = 0;
	if (obj.offsetParent) {
		do {
			posx += obj.offsetLeft;
			posy += obj.offsetTop;
		} while (obj = obj.offsetParent);
	}
	// x and y contain the element position relative to the document
	return {x:posx,y:posy};
}

function getSourceElement(e) {
	if (!e) var e = window.event;
	var targ;
	if (e.target) targ = e.target;
	else if (e.srcElement) targ = e.srcElement;
	if (targ.nodeType == 3) // defeat Safari bug
		targ = targ.parentNode;
	return targ;
}
