
ContextMenu = new function()
{
 
  var contextMenus = new Storage();
	
	var _div = $("<div class='contextMenu'>some text</div>");
	
	var _isVisible = false;
	

	
	
  
	return{

	  Add: function(strSelector, getMenuCallback, name)
		{
		  if(name == null)
			  name = strSelector;
				
		  var menu = new Menu(strSelector, getMenuCallback, name);
			
			contextMenus.AddComponent(menu, name);
			
			menu.Attach();
		
		},
		
		EventComponent: null,
		
		Hide: function()
		{
		  _div.css("display", "none");
			_isVisible = false;
		},
		
		Initialize: function()
		{
    	
    	$("body").append(_div);
    	
      $("body").bind("click.contextMenu", function(){ ContextMenu.Hide(); });			
		},
		
		Refresh: function()
		{
		  var menus = contextMenus.GetItemArray();
		  for(var i = 0; i<menus.length; i++)
			{
			  var menu = menus[i];
				menu.Attach();
			}
		},
		
		Remove: function(name)
		{
		  var menu = contextMenus.GetComponent(name);
			
			menu.Detach();
			
			contextMenus.Remove(name);
		
		},
		
		RemoveAll: function()
		{
		  var menus = contextMenus.GetItemArray();
		  for(var i = 0; i<menus.length; i++)
			{
			  var menu = menus[i];
				menu.Detach();
			}
			
			contextMenus.Reset();
			
		},
		
		Show: function(menuCallback, event)
		{
		
		  if(_isVisible)
			  return;
				
      var html = menuCallback();	

			if(html == null)
			  return;				

      if (event == null)
        event = window.event;
      
      var src = event.target != null ? event.target : event.srcElement;
			
			ContextMenu.EventComponent = src;
  
      var scrollTop = document.body.scrollTop ? document.body.scrollTop : document.documentElement.scrollTop;

      var scrollLeft = document.body.scrollLeft ? document.body.scrollLeft :document.documentElement.scrollLeft;
	
			_div.css("left", event.clientX + scrollLeft + 'px');

      _div.css("top", event.clientY + scrollTop + 'px');

			_div.html(html);

      _div.css("display", "block");
			
			_isVisible = true;		
			
		}

	
	}//<-- end return block

	function Menu(selector, getMenuCallback, name)
	{
		var _name = name;

	  var _selector = selector;

    var _callback = getMenuCallback;
		
		this.Name = function()
		{
		  return _name;
		}

		this.Attach = function(){
			$(_selector).each(function(){
			  this.oncontextmenu = function(){
				  ContextMenu.Show(_callback, window.event);
				  return false;
			  };
			});
		}
		
		this.Detach = function(){
 			$(_selector).each(function(){
  		  this.oncontextmenu = null;
			});
		}
	}
}


function ContextMenuItems()
{
  var ul = $("<ul/>");
		
	this.Add = function(caption, callback)
	{
  	var li = $("<li/>");
		
		li.text(caption);
		
		li.click(function(){
		  callback();
		});
		
  	ul.append(li);
		
	}	
	
	this.GetHTML = function()
	{
	  return ul;
	}				
	

  
}
