var imgpath = "/js/select/"

//  TdMouse = " align='center' style='cursor:hand' onMouseOver='this.style.backgroundColor=\"#D1E7FE\"' onMouseOut='this.style.backgroundColor=\"#FFFFFF\"' ";
var TdMouse = " style='cursor:pointer; padding-right:8px; padding-left:8px;' onMouseOver='this.style.backgroundColor=\"#D1E7FE\"' onMouseOut='this.style.backgroundColor=\"#FFFFFF\"' ";
var TdMousx = " style='cursor:pointer; padding-right:8px; padding-left:8px;'                                                      onMouseOut='this.style.backgroundColor=\"#FFFFFF\"' ";

//TiTle 标题，Field引申层对象divField，按钮btnField,值隐藏字段Field, DefaultVal 默认值,BigCode 大类代码长度，空，没有二级选项
function buildPopSel(Field, Arrs, Title, DefaultVal, BigCodeLen, w, h, bimg){
  ObjList += ",div"    + Field;
  ObjList += ",subdiv" + Field;
  Arr = eval(Arrs);
  var btnShowText = Title;

  var htmlDiv;
  htmlDiv  = "<div id='div"+Field+"' width='720' style='position:absolute;left:10px;top:165px;visibility:hidden;z-index:100;overflow:visible;'>";
  htmlDiv += "<table width='720' border='0' cellspacing='0' cellpadding='0' bgcolor='#FFFFFF' style='font-size:12px; font-family:Arial; font-weight:bold;'>";
  htmlDiv += "<tr><td align='left' valign='middle' width=620 height='26' background='" + imgpath + "greenbg.gif'>&nbsp;&nbsp;";
  htmlDiv += "<img src='"+imgpath+"greenarrow.gif'>&nbsp;<span style='color:#FFFFFF'>"+Title+"</span></td>";
  htmlDiv += "<td align='right' valign='middle' background='"+imgpath+"greenbg.gif' onclick='hiddenLayer()' style='color:#FFFFFF;cursor:hand;'>【CLOSE】</td></tr>";
  htmlDiv += "<tr><td colspan='2' width='720' valign='top'>";
  htmlDiv += "<table width='100%' border='0' cellspacing='0' cellpadding='0' bgcolor='#FFFFFF' style='border-color:#0000CC #0000CC #0000CC #0000CC; border-style:dashed; border-top-width:0px; border-right-width:1px; border-bottom-width:0px; border-left-width:1px; font-size:12px; font-family:Arial; font-weight:bold;'>";
  htmlDiv += "<tr>";
	htmlDiv += "<td height='24' width='25%' " + TdMouse + " onClick=\"SelectIt('" + Field + "','No limit',''," + Arrs + "," + BigCodeLen + ",event)\">No limit</td>";
  var big = null;
  var jsq = 1;
  for(var key in Arr){
    if(key==DefaultVal){//默认值
      btnShowText = Arr[key];
    }
    if(BigCodeLen==0 || big!=key.substring(0,BigCodeLen)){//分大类
      htmlDiv += "<td height='24' width='25%' " + TdMouse + " onClick=\"SelectIt('" + Field + "','" + Arr[key] + "','" + key +"'," + Arrs + "," + BigCodeLen + ",event)\">" + Arr[key] + "</td>";
      big = key.substring(0,BigCodeLen);
      jsq++;
      if(jsq%4 == 0){
        htmlDiv += "</tr><tr>";
      }
    }
  }
  
  for(var k= (jsq-1) % 4;k<3;k++){
    htmlDiv += "<td height='24'>&nbsp;</td>";
  }

  htmlDiv += "</tr></table>";
  if(BigCodeLen>0)
  htmlDiv += "<div id='subdiv" + Field + "' style='position:absolute;left:10px;top:165px;visibility:visible;z-index:10;overflow:visible'></div>";
  htmlDiv += "</td></tr><tr><td colspan='2' height='4' bgcolor='#3186EF'></td></tr></table>";
  htmlDiv += "</div>";
	//若无图片参数，可随意定选择按钮的宽度
	if(bimg==null)
	htmlDiv += "<div style='float:left; width:"+(2+w)+"px; height:"+h+"px; background:url("+imgpath+"btn-left.gif) no-repeat;'/><input type='button' name='btn"+Field+"' id='btn"+Field+"' value='"+btnShowText+"' title='"+Title+"' style='width:"+w+"px; height:"+h+"px; margin-left:2px; text-align:left; border:0px; padding-left:2px; background:url("+imgpath+"btn-right.gif) right no-repeat; line-height:22px; cursor:pointer;' onclick='displayLayer(\"div"+Field+"\")'></div>";
	else
	htmlDiv += "<INPUT type='button' name='btn"+Field+"' id='btn"+Field+"' value='"+btnShowText+"' title='"+Title+"' style='text-align: left; border: 0px; background: url("+imgpath+bimg+") right no-repeat; WIDTH: "+w+"px; HEIGHT: "+h+"px; CURSOR: pointer;' onclick='displayLayer(\"div"+Field+"\")'>";
//htmlDiv += "<INPUT type='button' name='btn"+Field+"' id='btn"+Field+"' value='"+btnShowText+"' title='"+Title+"' style='text-align: left; BORDER-RIGHT: 0px; BORDER-TOP: 0px; BACKGROUND: url("+imgpath+bimg+"); BORDER-LEFT: 0px; WIDTH: "+w+"px; HEIGHT: "+h+"px; CURSOR: hand; BORDER-BOTTOM: 0px' onclick=\"displayLayer('div"+Field+"');\">";
//htmlDiv += "<INPUT type='hidden' name='" + Field + "' id='" + Field + "' value='" + DefaultVal + "'>";
  htmlDiv  = "<span id='div" + Field + "pop'>" + htmlDiv + "</span>";
  htmlDiv += "<span id='div" + Field + "drop' style='display:none'><select name='" + Field + "' style='width:" + w + "px' onChange=SelectIt('" + Field + "',this.options[this.options.selectedIndex].text,this.options[this.options.selectedIndex].value," + Arrs + "," + BigCodeLen + ",event)>";
	htmlDiv += "<option value=''>" + Title + "</option>";
  for(var key in Arr){
    var _code = key;
    var _name = Arr[key];
    var _selected = "";
    if (_code == DefaultVal)
      _selected = " selected ";
    if (_code != null && _code.lastIndexOf("00") >= _code.length - 2)
      htmlDiv += "<option value='" + _code + "' style='color:blue'" + _selected + ">===" + _name + "===</option>";
    else
      htmlDiv += "<option value='" + _code + "'" + _selected + ">" + _name + "</option>";
  }
  htmlDiv += "</select></span>";
  htmlDiv += "<input type='button' name='switch" + Field + "' id='switch" + Field + "' value='Pull' title='当您的浏览器或者上网助手等软件阻止选择窗口弹出时，请点击本按钮切换到传统的下拉菜单方式进行选择。' onClick=switchSelect('" + Field + "')>";
  
  document.writeln(htmlDiv);
}

function switchSelect(Field) {
  var obj = document.all("switch" + Field);
  if (obj == null)
    return;

  if (obj.value == "Pull") {
    obj.value = "POP";
    document.all("div" + Field + "pop").style.display = "none";
    document.all("div" + Field + "drop").style.display = "";    
  }
  else {
    obj.value = "Pull";
    document.all("div" + Field + "pop").style.display = "";
    document.all("div" + Field + "drop").style.display = "none";    
  }
  
  displayLayer();
}

var ObjList = "";

String.prototype.LeftStr  = function(maxlen){
  var len = 0;
  for(var i = 0; i < this.length; i++){
    len++;
    if(this.charCodeAt(i) > 128) len++;
    if(len>maxlen) break;
  }
  return this.substring(0,i);
}

function SelectIt(Field,ShowText,Value,Arr,BigCodeLen,ev){
	ev = ev || window.event;
  var btnField = document.all("btn"+Field);
  var _arr = document.getElementsByName(Field);
  if (_arr != null)
    for (var i = 0; i < _arr.length; i++)
      _arr[i].value = Value;
  //document.all(Field).value = Value;
  var btnWidth = btnField.style.width.replace("px","");
      btnWidth = btnWidth - 12;
      btnField.value = ShowText.LeftStr(btnWidth/7);

  if(BigCodeLen==0){
//    document.all("div"+Field).style.visibility="hidden";
    hiddenLayer();
  }
  else{
    var big = Value.substring(0,BigCodeLen);
    var htmlDiv  = "<table border=0 cellspacing=0 cellpadding=0 bgcolor=#FFFFFF style='border-color:#0000CC #0000CC #0000CC #0000CC; border-style:dashed; border-top-width:2px; border-right-width:2px; border-bottom-width:2px; border-left-width:2px; font-size:12px; font-family:Arial; font-weight:bold;'>";
//      htmlDiv += "<tr><td nowrap height=24 " + TdMouse + " onclick='hiddenLayer()'>　<font color=red>请选择小类或关闭选单</font> &nbsp;</td></tr>";
    var jsq = 0;
    for(var key in Arr){
      if( big==key.substring(0,BigCodeLen) ){
        jsq++;
        if(jsq % 2 == 1) htmlDiv += "<tr>";
        htmlDiv += "<td nowrap height=24 " + TdMouse + " onclick=\"SelectIt('" + Field + "','" + Arr[key] + "','" + key +"',null,0,event)\">" + ( (big+"00")==key ? "<font color=red>" + Arr[key] + "</font>" : Arr[key] ) + " &nbsp;</td>";
        if(jsq % 2 == 0) htmlDiv += "</tr>";
      }
    }
    if(jsq % 2 == 1) htmlDiv += "<td>&nbsp;</td></tr>";
    htmlDiv += "</table>";
    
    if(jsq>1){
      xx = document.body.scrollLeft;
      yy = document.body.scrollTop;
      if( xx==0 ) xx = document.documentElement.scrollLeft;
      if( yy==0 ) yy = document.documentElement.scrollTop ;
    	
      subdiv = document.getElementById("subdiv" + Field);
      subdiv.innerHTML = htmlDiv;
      divField     = eval("div" + Field);
      divFieldTop  = divField.style.top.replace("px","");
      divFieldLeft = divField.style.left.replace("px","");
      subdiv.style.top  = ev.clientY - divFieldTop + yy+"px";
      subdiv.style.left = ev.clientX - divFieldLeft+"px";
      subdiv.style.visibility = "visible";
    }
    else{
      hiddenLayer();
    }
  }
}

function displayLayer(layerID){
	var layerID = document.getElementById(layerID);
  hiddenLayer();
  GetCenterXY_ForLayer(layerID);
  DivSetVisible(layerID);
}

function hiddenLayer(){
  showElementAll();
  var argArr = ObjList.split(",");
  for(var i=0;i<argArr.length;i++){
    if( argArr[i] != "" ){
      if (document.getElementById(argArr[i]) )
      document.getElementById(argArr[i]).style.visibility = "hidden";
    }
  }
}

//将悬浮层的位置定位在屏幕中央
function GetCenterXY_ForLayer(objdiv){
  x = document.body.scrollLeft;
  y = document.body.scrollTop;

  if( x==0 ) x = document.documentElement.scrollLeft;
  if( y==0 ) y = document.documentElement.scrollTop ;

  //获取屏幕宽度
  availWidth  = parseInt(window.screen.availWidth );
  availHeight = parseInt(window.screen.availHeight);

  var dWidth  = parseInt(objdiv.clientWidth);
  var dHeight = parseInt(objdiv.clientHeight);

  y = y + (availHeight- dHeight)/5;
  x = x + (availWidth - dWidth )/2;

  objdiv.style.top  = y + "px";
  objdiv.style.left = x + "px";
}

function DivSetVisible(objDiv){
  hideElementAll();
  objDiv.style.visibility = "visible";
}

function HideElement(strElementTagName){
  try{
    var tags = document.getElementsByTagName(strElementTagName);
    for(var i=0;i<tags.length; i++){
      var objTemp = tags[i];
      objTemp.style.visibility = "hidden";
    }
  }
  catch(e){
    alert(e.message);
  }
}


function ShowElement(strElementTagName){
  try{
    var tags = document.getElementsByTagName(strElementTagName);
    for(var i=0;i<tags.length; i++){
      var objTemp = tags[i];
      objTemp.style.visibility = "visible";
    }
  }
  catch(e){
    alert(e.message);
  }
}

function hideElementAll(){
  HideElement("SELECT");
  HideElement("OBJECT");
  HideElement("IFRAME");
}

function showElementAll(){
  ShowElement("SELECT");
  ShowElement("OBJECT");
  ShowElement("IFRAME");
}
