//	yMenu.js 1.0
// 	Yvan Rodrigues <software@yvanrodrigues.com>
//	Created Jan 27, 2004
//	Last updated Jan 27, 2004
//
//	This defines an ECMAscript object to provide the functionality of
//	a drop-down menu. The object uses CSS and is XHTML 1.0 Strict
//	valid.

//	define the constructor for the yMenu object
//	menuid:     the id attribute (name) of the menu
//	items:      an Array() containing all labels for menu items
//	links:      an Array() containing all links corresponding to items array
//	x:          leftmost corner of the menu in px
//	y:		    uppermost corner of the menu in px
//	w:          width of menu in px
//  h:          minimum height of each item in px
//	hoverClass: name of class when hovering

function yMenu(menuid, items, links, x, y, w, h, hoverClass) {
	this.menuid = menuid;
	this.items = items;
	this.links = links;
	this.x = x;
	this.y = y;
	this.w = w;
	this.h = h;
	this.hoverClass = hoverClass;
	var timeToHide = 400;
	var lastTimeoutId = -1;
	
	// call this when ready to insert function in HTML
	this.insertMenu = function() {
		// first item is visible
		document.write('<div id="'+menuid+'" onmouseover="'+menuid+'.rollDown(); '+menuid+'.over(this);"  onmouseout="'+menuid+'.out(this);" onclick="location = \''+links[0]+'\';">'+items[0]+'</div>');
		var parentcell = document.getElementById(menuid); // get the element we just created
		parentcell.className = 'yMenu'; // set attributes
		parentcell.style.left = x+'px';
		parentcell.style.top = y+'px';
		parentcell.style.width = w+'px';
		parentcell.style.height = h+'px';

		var cy = y+h+1;
		// create remaining items
		for(var i=1; i<items.length; i++) {
			document.write('<div id="'+menuid+i+'" onmouseover="'+menuid+'.over(this);"  onmouseout="'+menuid+'.out(this);" onclick="location = \''+links[i]+'\';">'+items[i]+'</div>');
			var childcell = document.getElementById(menuid + i);
			childcell.style.left = x+'px';
			childcell.style.top = cy+'px';
			childcell.style.width = w+'px';
			//childcell.style.height = h+'px';
			childcell.className = 'yMenu-hidden';
			var lastCellHeight = parseInt(childcell.offsetHeight);
			if(lastCellHeight < h+2) 
				childcell.style.height = h+'px'; // enlarge to minimum height
			else 
				childcell.style.height = lastCellHeight+'px';
			cy += parseInt(childcell.style.height)+1;
		}
	}

	this.out = function (element) {
		element.className = 'yMenu'; // change back to plain
		lastTimeoutId = window.setTimeout(menuid+".rollUp();", 200); // wait 200ms before rolling up
	}

	this.over = function(element) {
		element.className = hoverClass; // change to hover state
		window.clearTimeout(lastTimeoutId); // cancel any outstanding timers
	}

	// pop up a menu when title is moused over
	this.rollDown = function() {
		// user moused over root element so show menu
		for(var i=1; i<items.length; i++) {
			document.getElementById(menuid + i).className = 'yMenu'; // show all items
		}
	}

	this.rollUp = function () {
		for(var i=1; i<items.length; i++) {
			document.getElementById(menuid + i).className = 'yMenu-hidden';  // hide all items
		}
	}
}
