// ===========================================================================
// ||||||| GLOBAL VARIABLES ||||||||||||||||||||||||||||||||||||||||||||||||||
// ===========================================================================
var _MENU_DATABASE = new Object(); // allows us to get a reference to an instance of the class from it's id
// ===========================================================================
// ||||||| MENU CLASS ||||||||||||||||||||||||||||||||||||||||||||||||||||||||
// ===========================================================================
// Dependencies: 
// ===========================================================================
function Menu(){
	this.id						= Menu.prototype.next_id++;
	this.dom_obj_id 			= null;
	this.dom_obj 				= null;
	this.x						= 0;
	this.y 						= 0;
	this.width					= 0;
	this.height					= 0;
	this.is_feature_complete 	= (document.getElementById) ? true : false;
	this.is_mouseover			= false;
	this.menu_dom_obj_id		= null;
	this.menu_dom_obj			= null;
	this.menu_x					= 0;
	this.menu_y					= 0

	// track the instance in the database
	_MENU_DATABASE[this.id] = this;
}
// ---------------------------------------------------------------------------
Menu.prototype.next_id 			= 0;
Menu.prototype.type 			= 'Menu';
// ---------------------------------------------------------------------------
// This function lets the developer tell the Menu instance which html dom object is the main canvas.
Menu.prototype.set_dom_obj = function(_dom_obj_id){
	var return_val = false;
	var dom_obj = null;
	var id = this.id;
	if(this.is_feature_complete && typeof _dom_obj_id == 'string' && _dom_obj_id != ''){
		dom_obj = document.getElementById(_dom_obj_id);
		if(dom_obj){
			// record the canvas id and dom object
			this.dom_obj_id = _dom_obj_id;
			this.dom_obj = dom_obj;

			// attach event handlers to the dom object
			this.dom_obj.onmouseover = function(e){ var evt = e ? e : window.event; return Menu_onmouseover(evt,id); }
			this.dom_obj.onmouseout  = function(e){ var evt = e ? e : window.event; return Menu_onmouseout(evt,id); }

			// get the inital geometry of the rendered menu
			this.get_geometry();
		}	
	}
	return return_val;
}
// ---------------------------------------------------------------------------
Menu.prototype.get_geometry = function(){
	var return_val = false;
	var geom = get_abs_geometry(this.dom_obj);
	if(geom != -1){
		this.x = geom.x;
		this.y = geom.y;
		this.width = geom.w;
		this.height = geom.h;
		return_val = true;
	}
	return return_val;
}
// ---------------------------------------------------------------------------
Menu.prototype.set_menu_dom_obj = function(_dom_obj_id){
	var return_val = false;
	var dom_obj = null;
	var id = this.id;
	if(this.is_feature_complete && typeof _dom_obj_id == 'string' && _dom_obj_id != ''){
		dom_obj = document.getElementById(_dom_obj_id);
		if(dom_obj){
			// record the canvas id and dom object
			this.menu_dom_obj_id = _dom_obj_id;
			this.menu_dom_obj = dom_obj;

			// attach event handlers to the dom object
			this.menu_dom_obj.onmouseover = function(e){ var evt = e ? e : window.event; return Menu_onmouseover(evt,id); }
			this.menu_dom_obj.onmouseout  = function(e){ var evt = e ? e : window.event; return Menu_onmouseout(evt,id); }
		}	
	}
	return return_val;
}
// ---------------------------------------------------------------------------
Menu.prototype.set_menu_position = function(_x,_y){
	var return_val = false;
	var x = parseInt(_x);
	var y = parseInt(_y);
	if(!isNaN(x)){ _x = x; }
	if(!isNaN(y)){ _y = y; }
	if(this.menu_dom_obj && this.menu_dom_obj.style){
		this.menu_dom_obj.style.top = _y+'px';
		this.menu_dom_obj.style.left = _x+'px';
		return_val = true;
	}
	return return_val;
}
// ---------------------------------------------------------------------------
Menu.prototype.menu_hide = function(){
	var return_val = false;
	if(this.menu_dom_obj && this.menu_dom_obj.style){
		this.menu_dom_obj.style.display = 'none';
		return_val = true;
	}
	return return_val;
}
// ---------------------------------------------------------------------------
Menu.prototype.menu_show = function(){
	var return_val = false;
	if(this.menu_dom_obj && this.menu_dom_obj.style){
		this.menu_dom_obj.style.display = '';
		return_val = true;
	}
	return return_val;
}
// ---------------------------------------------------------------------------

// ===========================================================================
// ||||||| MENU EVENT HANDLERS |||||||||||||||||||||||||||||||||||||||||||||||
// ===========================================================================
function Menu_onmouseover(_evt,_id){
	var _this = _MENU_DATABASE[_id];
	_this.is_mouseover = true;
	_this.get_geometry();
	_this.set_menu_position(_this.x,(_this.y+_this.height));
	_this.menu_show();
	return false;
}
// ---------------------------------------------------------------------------
function Menu_onmouseout(_evt,_id){
	var _this = _MENU_DATABASE[_id];
	_this.is_mouseover = false;

	setTimeout('if(!_MENU_DATABASE['+_this.id+'].is_mouseover){ Menu_onmouseout_action('+_this.id+'); }', 20);

	return false;
}
// ---------------------------------------------------------------------------
function Menu_onmouseout_action(_id){
	var _this = _MENU_DATABASE[_id];
	_this.menu_hide();
	return false;
}
// ---------------------------------------------------------------------------