/*
SelectOption 
author: eastday
date:2010-1-12
ex-selectoption:
<select style="display:none" id="test">...</select><input onfocus="showMenu('$(test)|300')"/>  showMenu($(id)|width[allownull],height/allownull)

ex-noselectoption:showMenu('1111,cc,dd,ee[arrylist]|300[width/allownull],height/allownull')

update log
2010/1/15
object 对象出错 如果是弹出同样的类容就会出错
*/
var element=null;
var em=null;
var embg=null;
var $obj=null;
function showMenu(arg)
{
   var str=	arg.split('|');
   var instr=arg.indexOf('|');
   var inxnum=str[0].indexOf("$(");
   if(inxnum==0)
   {
     var ln=str[0].indexOf(')');
     var strID=str[0].substring(2,ln);
     var len=document.getElementById(strID).options.length;
	 var arguments=null;
	 for(i=0;i<len;i++)
	 {
	    i!=len-1?arguments=[arguments,document.getElementById(strID).options[i].innerHTML,","].join(""):arguments=[arguments,document.getElementById(strID).options[i].innerHTML].join("")
	 }
	 var arguments=[arguments,arg.substring(instr,arg.length)].join("");
	 arg=arguments;
   }
   showMenuList(arg)
}
function showMenuList(arg)
{   
	this.e=function(i){ return document.getElementById(i);}
	//--内置构造函数
	this.getPosition=function(obj){
		var l=obj.offsetLeft;
		var t=obj.offsetTop;
		var h=obj.offsetHeight;
		var w=obj.offsetWidth;
		while(obj=obj.offsetParent)
		{
			l+=	obj.offsetLeft;
			t+=obj.offsetTop;
		}
		return {left:l,top:t,height:h,width:w};
	}
	this.getEvent=function (){
		if(document.all){ 	
		 return window.event;//如果是ie
		}
		func=getEvent.caller;
		while(func!=null)
		{
			var arg0=func.arguments[0];
			if(arg0)
			{
				if((arg0.constructor==Event || arg0.constructor ==MouseEvent)||(typeof(arg0)=="object" && arg0.preventDefault && arg0.stopPropagation))
				{
				 return arg0;
				}
			}
			func=func.caller;
		}
		return null;
	}
	this.setValue= function(obj)
    {
	   element.value=obj.innerHTML;
	   this.closewin();
	 }
	 this.closewin= function()
	 {
	   em.style.display="none"; 
	 }
	 this.cancelb=function(e){e?e.stopPropagation():event.cancelBubble = true;}
	
	//---------构造函数完毕
	var whstr=null;
	var _width=null;
	var _height=null;
	var _styleHtml="";
  	var evt=this.getEvent();
	element=evt.srcElement || evt.target;                //getobj
	element.readOnly=true;                               //set readonley
	element.onclick=function(e){cancelb(e)};             //stop cancelBubble
	_width=element.clientWidth+2;
	var oh=element.clientHeight;
	var p=this.getPosition(element)   //getPotion
	if(em!=null&&$obj==element)
	{
	   em.style.display="block";
	   return;
	}
	if(em!=null&&$obj!=element)
	{
	  this.closewin();
	}
     $obj=element;
	 str=arg.split("|");
	 if(str.length>1&&str[1].split(",").length>1)
	 {//width and height
	   whstr=str[1].split(",");
	   if(parseInt(whstr[0])&&parseInt(whstr[0])>0)
	   {
		 _width=whstr[0];
	   }
	   if(parseInt(whstr[1])&&parseInt(whstr[1])>0)
	   {
		 _height=whstr[1];
		 _styleHtml="style='overflow-y:auto;overflow-x:hidden;height:"+ _height+"px;scrollbar-shadow-color: #D5D5D5; scrollbar-highlight-color: #D5D5D5; scrollbar-face-color: #ebebeb; scrollbar-3dlight-color: #ffffff; scrollbar-darkshadow-color: #ffffff; scrollbar-track-color:#FFFFFF; scrollbar-arrow-color: #838383' ";
	   }
	 }else if(str.length>1&&str[1].split(",").length==1&&str[1]!="null"&&str[1]!="")
	 {//only width
	   _width=str[1];
	  
	 }
		em =document.createElement("div");
		em.style.width=_width+"px"
		em.style.border="1px solid #C8DFF7";
		em.style.position="absolute";
		em.style.left=p.left+1+"px"; 
	    em.style.top =p.top+oh+3+"px"; 
		em.style.zIndex="999"
		document.body.appendChild(em);
	var optionHtml="<span style='display:inline-block;width:100%;background:#FFF; cursor:pointer' onmouseover=\"this.style.background='#EEF3F7' \"  onmouseout=\"this.style.background='#fff'\"   onclick=\"setValue(this)\"  >";
	var spahtml=optionHtml;
	var strhtml=str[0].split(",");
		for(i=0;i<strhtml.length;i++)
		{   
		    i==0?optionHtml=["<div ",_styleHtml," >",optionHtml].join(""):function(){};
			optionHtml=[optionHtml,strhtml[i],"</span><br>"].join("");
			i!=strhtml.length-1?optionHtml=[optionHtml,spahtml].join(""):optionHtml=[optionHtml,"</div>"].join("");
	    }
	em.innerHTML=optionHtml;
	em.focus();
	em.onclick=function(e){cancelb(e)}; 
	document.body.onclick=function(){closewin()};
}