// popUpMenu.js 
// requires: prototype.js
// adapted from ypSlideOutMenus.js (http://www.youngpup.net), updated to support prototype.js and remove a lot of stuff I didn't need


		
var PopUpMenu = Class.create();

PopUpMenu.prototype = {

	initialize: function(o) {
		this.actuator = $(o.actuator);
		this.maskElement = $(o.maskElement);
		this.menuElement = $(o.menuElement);
	
		this.aniLen = 250;
		this.hideDelay = 250;		
		
		this.id	= o.id;
		this.dir = o.dir;

		this.orientation = (o.dir == "left" || o.dir == "right" ? "h" : "v");
		this.dirType	 = (o.dir == "right" || o.dir == "down" ? "-" : "+");
		this.dim		 = (this.orientation == "h" ? o.width : o.height);
		this.hideTimer	 = false;
		this.aniTimer	 = false;
		this.open		 = false;
		this.over		 = false;
		this.startTime	 = 0;
		
		this.homePos = eval("0" + this.dirType + this.dim);
		this.outPos	= 0;
		this.accelConst	= (this.outPos - this.homePos) / this.aniLen / this.aniLen;		

		// global reference to this object
		this.gRef = "popUpMenu_"+o.id;
		eval(this.gRef+"=this");

		var maskStyle = { display:'none' , left:o.left + 'px' , top:o.top + 'px' , overflow:'hidden' , zIndex:'10000' };
		var genStyle = { position:'absolute' , width:o.width + 'px' , height:o.height + 'px' };
		Element.setStyle(this.maskElement,maskStyle);
		Element.setStyle(this.maskElement,genStyle);
		Element.setStyle(this.menuElement,genStyle);		

		// set event handlers.
		this.showObserver = this.show.bindAsEventListener(this);
		this.startHideObserver = this.startHide.bindAsEventListener(this);
		
		//Event.observe(this.actuator,'mouseover',this.show.bindAsEventListener(this),false);
		Event.observe(this.menuElement,'mouseover',this.show.bindAsEventListener(this),false);		
		Event.observe(this.menuElement,'mouseout',this.startHide.bindAsEventListener(this),false);

		//set initial state
		this.endSlide()
	},	

	show: function() {
		this.over=true;
		Element.show(this.menuElement);
		if (this.hideTimer) { this.hideTimer = window.clearTimeout(this.hideTimer) }
		
		shiftTo(this.maskElement,getRealLeft(this.actuator),getRealTop(this.actuator) + getObjectHeight(this.actuator)+(navigator.userAgent.indexOf("Firefox") != -1 ? 1 : 2));
		
		if (!this.open && !this.aniTimer) this.startSlide(true)		
	},
	
	startHide: function(e) {
		if(this.hideTimer) { window.clearTimeout(this.hideTimer); }
		this.hideTimer = window.setTimeout(this.gRef + '.hide()', this.hideDelay);
	},
	
	hide: function() {
		if (this.hideTimer) { window.clearTimeout(this.hideTimer); }
		this.over = false;
		this.hideTimer = 0;
		if (this.open && !this.aniTimer) {  this.startSlide(false); }
	},
	
	startSlide: function(open) {
		this.open = open;
		if (open) { Element.show(this.maskElement); }
		this.startTime = (new Date()).getTime()	;
		this.aniTimer = window.setInterval(this.gRef + ".slide()", 10);
	},
	
	slide: function() {
		var elapsed = (new Date()).getTime() - this.startTime;
		if (elapsed > this.aniLen) { 
			this.endSlide(); 
		} else {
			var d = Math.round(Math.pow(this.aniLen-elapsed, 2) * this.accelConst)
			if 	(this.open && this.dirType == "-") {	
				d = -d;
			} else if (this.open && this.dirType == "+") {
				d = -d;
			} else if (!this.open && this.dirType == "-") {
				d = -this.dim + d;
			} else {
				d = this.dim + d;
			}
	
			this.moveTo(d)
		}		
	},
	
	endSlide: function() {
		this.aniTimer = window.clearTimeout(this.aniTimer);
		this.moveTo(this.open ? this.outPos : this.homePos);
		if (!this.open) { Element.hide(this.maskElement); }
		if ((this.open && !this.over) || (!this.open && this.over)) {
			this.startSlide(this.over);
		}	
	},
	
	moveTo: function(p) {
		this.menuElement.style[(this.orientation == "h" ? "left" : "top")] = p + "px";
	}
}