// position = 0:bottom, 1:left, 2:top, 3:right
// align = 0:bottom, 1:left, 2:top, 3:right
function Dropdown(activator, dropdown, position, align, offsetX, offsetY, autoShow, onShow, onHide, delayTime, activeEvent, inactiveEvent)
{
    if(typeof(activator) == "string") activator = document.getElementById(activator);
    if(typeof(dropdown) == "string") dropdown = document.getElementById(dropdown);
    if(!activator) return;
    if(activator.dropdown) return;
    if(!dropdown) return;
    activator.dropdown = this;
    this.onShow = onShow;
    this.onHide = onHide;
	this.activator = activator;
	this.dropdown = dropdown;
	this.dropdown.activator = activator;
	this.position = position;
	this.align = align;
	this.offsetX = offsetX;
	this.offsetY = offsetY;
	if(delayTime == null) delayTime = 250;
	this.delayTime = delayTime;
	if(activeEvent == null) activeEvent = "mouseover";
	if(inactiveEvent == null) inactiveEvent = "mouseout";
	
	registerEventHandler(this.activator, activeEvent, getInstanceDelegate(this, "show"));
	registerEventHandler(this.activator, inactiveEvent, getInstanceDelegate(this, "requestHide"));
	registerEventHandler(this.dropdown, "mouseover", getInstanceDelegate(this, "show"));
	registerEventHandler(this.dropdown, "mouseout", getInstanceDelegate(this, "requestHide"));

	this.dropdown.style.visibility = "hidden";
	this.dropdown.style.position = "absolute";
	this.reposition(null);

	registerEventHandler(window, "resize", getInstanceDelegate(this, "reposition"));
	if(autoShow) this.show();
}

Dropdown.prototype.show = function(e)
{
	clearTimeout(this.timer);
	this.dropdown.style.visibility = "visible";
	this.dropdown.style.zIndex = 1000;
	if(this.onShow) this.onShow(e);
}

Dropdown.prototype.hide = function(e)
{
	this.dropdown.style.visibility = "hidden";
	if(this.onHide) this.onHide(e);
}

Dropdown.prototype.requestHide = function(e)
{
	this.timer = setTimeout( getInstanceDelegate(this, "hide"), this.delayTime);
}

Dropdown.prototype.reposition = function(e)
{
	var offsetLeft = 0;
	var offsetTop = 0;
	var offsetElement = this.activator;
	while (offsetElement)
	{
		offsetLeft += offsetElement.offsetLeft;
		offsetTop += offsetElement.offsetTop;
		offsetElement = offsetElement.offsetParent;
	}
	switch(this.position)
	{
	    // bottom
	    case 0:
	        break;
	    // left
	    case 1:
	        offsetLeft -= this.dropdown.offsetWidth;
	        break;
	    // top
	    case 2:
	        offsetTop -= this.activator.offsetHeight + this.dropdown.offsetHeight;
	        break;
	    // right
	    case 3:
	        offsetLeft += this.activator.offsetWidth;
	        break;
	}
	switch(this.align)
	{
	    // bottom
	    case 0:
	        offsetTop -= this.dropdown.offsetHeight;
	        break;
	    // left
	    case 1:
	        break;
	    // top
	    case 2:
	        offsetTop -= this.activator.offsetHeight;
	        break;
	    // right
	    case 3:
	        offsetLeft -= this.dropdown.offsetWidth - this.activator.offsetWidth;
	        break;
	}
	offsetLeft += this.offsetX;
	offsetTop += this.offsetY;
	this.dropdown.style.left = offsetLeft + "px";
	this.dropdown.style.top = (offsetTop + this.activator.offsetHeight) + "px";
}

function registerEventHandler (element, event, handler)
{
	if (element.attachEvent)
		element.attachEvent("on" + event, handler);
	else if (element.addEventListener)
		element.addEventListener(event, handler, false);
	else
		element[event] = handler;
}

function getInstanceDelegate (obj, methodName)
{
	return function(e)
	{
		e = e || window.event;
		return obj[methodName](e);
	};
}