// JavaScript Document
//version:1.0
//create at 2007-6-26
//author: roly 
//mail: roly0711@126.com
function getAbsolutePos(el) {
	var SL = 0, ST = 0;
	var is_div = /^div$/i.test(el.tagName);
	if (is_div && el.scrollLeft)
		SL = el.scrollLeft;
	if (is_div && el.scrollTop)
		ST = el.scrollTop;
	var r = { x: el.offsetLeft - SL, y: el.offsetTop - ST };
	if (el.offsetParent) {
		var tmp = this.getAbsolutePos(el.offsetParent);
		r.x += tmp.x;
		r.y += tmp.y;
	}
	return r;
}
//修改了=========================
function Roly_Combox(input,button) {
	this._input = $(input);
	this._button = $(button);
	this._items = new Array();
	this._layer = null;
	this._debug = false;
	this._focus = false;	
}

Roly.Combox.prototype.addItem = function( value ) {
	this._items[this._items.length] = value;
	this.refreshLayer();
}

Roly.Combox.prototype.removeAllItem = function() {
	this._items = new Array();
	this._input.value = "";
	this.refreshLayer();
}

Roly.Combox.prototype.init = function() {
	//add event handler
	this._button.style.cursor = "pointer";
	this._button.obj = this;
	this._button.onclick = this.onClickProxy;
	this._button.onmouseover = this.bind(this.onmouseover,this);
	this._button.onmouseout = this.bind(this.onmouseout,this);
	this._input.obj = this;
	this._input.onclick = this.showLayer;
	this._input.onblur = this.hideLayer;
}

Roly.Combox.prototype.onClickProxy = function() {
	var S = event.srcElement;
	var obj = S.obj;
	obj.onClick();
}

Roly.Combox.prototype.onClick = function() {
	var layer = this._layer;
	if(layer == null) {
		layer = this.createLayer();
		layer.style.display = "";
		this.autoFrameHeight();
	}else{
		//change position
		var width = this._input.offsetWidth + 19;
		var p = this.getAbsolutePos(this._input);
		var left = p.x;
		var top = p.y+20;
		layer.style.width = width;
		layer.style.top = top;
		layer.style.left = left;
		//show layer
		if(layer.style.display == "none")
			layer.style.display = "";
		else
			layer.style.display = "none";
	}
}

Roly.Combox.prototype.showLayer = function() {
	var S = event.srcElement;
	var obj = S.obj;
	var layer = obj._layer;
	if(layer == null) {
		layer = obj.createLayer();
		layer.style.display = "";
		obj.autoFrameHeight();
	}else{
		//change position
		var width = obj._input.offsetWidth + 19;
		var p = obj.getAbsolutePos(obj._input);
		var left = p.x;
		var top = p.y+20;
		layer.style.width = width;
		layer.style.top = top;
		layer.style.left = left;
		//show layer
		layer.style.display = "";
	}
}

Roly.Combox.prototype.hideLayer = function() {
	var S = event.srcElement;
	var obj = S.obj;
	var layer = obj._layer;
	if(layer != null && !obj._focus)
		layer.style.display = "none";
}

Roly.Combox.prototype.createLayer = function() {
	var div = document.createElement("div");
	div.className = "combox-layer";
	div.id = "combox"+Math.floor(Math.random()*100+1);
	div.onmouseover = this.bind(this.onmouseover,this);
	div.onmouseout = this.bind(this.onmouseout,this);
	var h = 0;

	var ul = document.createElement("ul");
	for(var i=0;i<this._items.length;i++) {
		var li = document.createElement("li");
		li.appendChild(document.createTextNode(this._items[i]));
		li.obj = this;
		li.onclick = this.chooseItem;
		li.onmouseover = this.alterBgColor;
		li.onmouseout = this.alterBgColor;
		ul.appendChild(li);
		h += 19;
	}
	div.appendChild(ul);
	
	//change position 
	if(this._debug)
		alert("width^top^left:"+this._input.offsetWidth+"^"+this._input.offsetTop+"^"+this._input.offsetLeft);
	var width = this._input.offsetWidth + 19;
	var p = this.getAbsolutePos(this._input);
	var left = p.x;
	var top = p.y+20;
	//var top = this._input.offsetTop + 20;
	//var left = this._input.offsetLeft;
	div.style.width = width;
	div.style.top = top;
	div.style.left = left;
	if(this._debug)
		alert("width^top^left:"+div.style.width+"^"+div.style.top+"^"+div.style.left);
	
	//create filter
	var filter = this.createFilter(width,h);
	div.appendChild(filter);

	this._layer = div;
	document.body.appendChild(div);
	return div;
}

Roly.Combox.prototype.refreshLayer = function() {
	var layer = this._layer;
	if(layer != null) {
		document.body.removeChild(layer);
		this._layer = null;
	}
}

Roly.Combox.prototype.chooseItem = function() {
	var S = event.srcElement;
	var value = S.innerText;
	var obj = S.obj;
	obj._input.value = value;
	obj._layer.style.display = "none";
}

Roly.Combox.prototype.alterBgColor = function () {
	var S = event.srcElement;
	var color = S.currentStyle.backgroundColor;
	var overColor = "#f0f8ff";
	var outColor = "transparent";
	if(color != overColor) {
		S.style.backgroundColor = overColor;
		//S.style.color = "#fff";
	} else {
		S.style.backgroundColor = outColor;
		//S.style.color = "#000";
	}
}

Roly.Combox.prototype.createFilter = function(w,h) {
	var filter = document.createElement("iframe");
	filter.style.width = w-2;
	filter.style.height = h+1;
	filter.style.top = 0;
	filter.style.left = 0;
	filter.style.zIndex = -1;
	filter.style.position = "absolute";
	filter.style.filter = "progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)";
	filter.frameBorder = 0;
	return filter;
}

Roly.Combox.prototype.getAbsolutePos = function (el) {
	var SL = 0, ST = 0;
	var is_div = /^div$/i.test(el.tagName);
	if (is_div && el.scrollLeft)
		SL = el.scrollLeft;
	if (is_div && el.scrollTop)
		ST = el.scrollTop;
	var r = { x: el.offsetLeft - SL, y: el.offsetTop - ST };
	if (el.offsetParent) {
		var tmp = this.getAbsolutePos(el.offsetParent);
		r.x += tmp.x;
		r.y += tmp.y;
	}
	return r;
}

Roly.Combox.prototype.onmouseover = function() {
	this._focus = true;
}

Roly.Combox.prototype.onmouseout = function() {
	this._focus = false;
}

Roly.Combox.prototype.bind = function(fuc,obj) {
  var args = [];
  if(arguments) {
  	for (var i = 0, length = arguments.length; i < length; i++)
      args.push(arguments[i]);
  }
  var method = args.shift();
  var object = args.shift();
  return function() {
    return method.apply(object, args);
  }
}

Roly.Combox.prototype.autoFrameHeight = function() {
	var height = document.body.scrollHeight+20;
	if(window.parent!=undefined) {
		var iframe = window.parent.document.getElementById(window.name);
		if(iframe!=undefined && parseInt(iframe.style.height) < height)
			iframe.style.height = height;
	}
}
/*
usage:
<style type="text/css">
<!--
.combox-layer {
	position:absolute;
	z-index:1;
	border: 1px solid #CCCCCC;
	border-top:none;
	background-color:#FFFFFF;
}
.combox-layer ul {
	margin:		0;
	padding:	0;
}
.combox-layer ul li {
	list-style-type:none;
	line-height:19px;
	width:100%;
	cursor:hand;
}
.combox-input
{
	font-family:		Arial, Verdana, Helvetica, sans-serif;
	font-size:			12px;
	width:				100%;
	height:				19px;
	border:				1px solid #CCCCCC;
	border-right:none;
}
-->
</style>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
	<tr>
		<td><input type="text" name="depart" id="depart" value="" class="combox-input"></td>
		<td width="19" height="20"><img src="combox_b.jpg" id="departButton" width="19" height="20" border="0"/></td>
	</tr>
</table>
<script>
var combox = new Roly.Combox("depart","departButton");
combox.addItem("鑻規(guī)灉");
combox.addItem("姊ㄥ瓙");
combox.addItem("棣欒晧");
combox.addItem("钁¤悇");
combox.init();
</script>

*/