<PUBLIC:COMPONENT tagName="ndbButton">

<PUBLIC:ATTACH EVENT="onmouseover" ONEVENT="item_mouseover()" />
<PUBLIC:ATTACH EVENT="onmouseout"  ONEVENT="item_mouseout()" />
<PUBLIC:ATTACH EVENT="onclick"  ONEVENT="item_click()" />

<SCRIPT LANGUAGE="JScript">
var BUTTON_WIDTH = 180
var BUTTON_BORDER_COLOR	= '#000000'
var BUTTON_BACKGROUND_COLOR = '#f1f1f1'
var BUTTON_MOUSEOVER_COLOR = '#000000'
var BUTTON_MOUSEOVER_BGCOLOR = '#cccccc'
var BUTTON_MOUSEDOWN_BGCOLOR = '#999999'
var BUTTON_SHADOW_COLOR	= '#666666'

var nColor, nBackgroundColor, nBorderColor;

function item_mouseover() {
	nColor = runtimeStyle.color;
	nBackgroundColor = runtimeStyle.backgroundColor;
	nBorderColor = runtimeStyle.borderColor;
	runtimeStyle.color = BUTTON_MOUSEOVER_COLOR;
	runtimeStyle.backgroundColor = BUTTON_MOUSEOVER_BGCOLOR;
	runtimeStyle.borderColor = BUTTON_BORDER_COLOR;

	//makeRectangularDropShadow(event.srcElement, BUTTON_SHADOW_COLOR, 4)

}

function item_mouseout() {
	runtimeStyle.color = nColor;
	runtimeStyle.backgroundColor = nBackgroundColor;
	//runtimeStyle.borderColor = nBorderColor;
}

function item_click() {
	//runtimeStyle.backgroundColor = BUTTON_MOUSEDOWN_BGCOLOR;
}

function makeRectangularDropShadow(el, color, size) {
	var i;
	for (i=size; i>0; i--)
	{
		var rect = document.createElement('div');
		var rs = rect.style
		rs.position = 'absolute';
		rs.left = (el.style.posLeft + i) + 'px';
		rs.top = (el.style.posTop + i) + 'px';
		rs.width = el.offsetWidth + 'px';
		rs.height = el.offsetHeight + 'px';
		rs.zIndex = el.style.zIndex - i;
		rs.backgroundColor = color;
		var opacity = 1 - i / (i + 1);
		rs.filter = 'alpha(opacity=' + (100 * opacity) + ')';
		el.insertAdjacentElement('afterEnd', rect);
	}
}

</SCRIPT>

</PUBLIC:COMPONENT>
