function showHide(elem)
{
    if(elem.style.visibility=='')elem.style.visibility = 'hidden';
    if(elem.style.visibility == 'hidden')
       elem.style.visibility = 'visible';
    else
       elem.style.visibility = 'hidden';
    
}

function drop(ctl)
{
    if(document.getElementById(ctl+"_txtEnabled").value != "0") {
        showHide(document.getElementById(ctl+"_l1"));
        showHide(document.getElementById(ctl+"_fr1"));
    }
}

function enabled(ctl, enab) {
    if(enab) {
        document.getElementById(ctl+"_txtEnabled").value = "1";
        document.getElementById(ctl+"_display").style.color = "black";
    }
    else {
        document.getElementById(ctl+"_txtEnabled").value = "0";
        document.getElementById(ctl+"_display").style.color = "gray";
    }
}

function defaultEnabled(ctl, enab) {
    var ctlId = parseInt(0)+2;
    var rowdiv = document.getElementById(ctl+"_gvColors_ctl"+String("0" + ctlId).slice(-2)+"_row");
    if(enab) 
        rowdiv.style.display="";
    else
        rowdiv.style.display="none";
}

function closebox(ctl)
{
   document.getElementById(ctl+"_l1").style.visibility = 'hidden';
   document.getElementById(ctl+"_fr1").style.visibility = 'hidden';
}

function sel(rowdiv,ctl)
{
   var start
   try {
      start = document.getElementById(ctl+"_txtValue").value;
   } catch(err) {}

   var cdd = document.getElementById(ctl+"_cdd");  
   var selBox = document.getElementById(ctl+"_tr1"); 
   setValue(rowdiv,selBox,cdd);
   closebox(ctl);

   try {
      if (document.getElementById(ctl+"_txtValue").value != start) {
         var f = document.getElementById(ctl+"_txtValue").onchange;
         if (f)
             f();
      }
   } catch(err) {}
}

function getElementNodes(pNode)
{
   var nodes=new Array();
   var index=0;
   for(var i=0;i<pNode.childNodes.length;i++)
   {
        if(pNode.childNodes[i].nodeType!=3)
            nodes[index++] = pNode.childNodes[i];
    }
    
    return nodes;
}

function getFirstElementNode(pNode)
{
   for(var i=0;i<pNode.childNodes.length;i++)
   {
        if(pNode.childNodes[i].nodeType!=3)
        {
            return pNode.childNodes[i];
        }
   }
}

function setValue(rowdiv,selBox,cdd)
{
   var srcnodes=getElementNodes(rowdiv);
   var td = getFirstElementNode(selBox)
   var desnodes=getElementNodes(td);
 
    copyVal(srcnodes,desnodes,cdd);
}

function copyVal(srcnodes,desnodes,cdd)
{
   desnodes[0].value = srcnodes[0].value;
   desnodes[1].style.backgroundColor = srcnodes[1].style.backgroundColor;
   
   if(cdd.className=='cdd mini')
   {
        arr = srcnodes[2].innerHTML.split(' ');
        desnodes[2].innerHTML = arr[0];
   }
   else
   {
        desnodes[2].innerHTML= srcnodes[2].innerHTML;
   }
}

function trySetValue(rowdiv,ctrl,id)
{
      var srcnodes=getElementNodes(rowdiv);
      if(desnodes[0].value==id)
      {
             var td = getFirstElementNode(ctrl+'_tr1')
             var desnodes=getElementNodes(td);
             var cdd = document.getElementById(ctlName+"_cdd"); 
             copyVal(srcnodes,desnodes,cdd);               
             return true;
      }
   return false;
}

function cdd_SetValue(ctrl,ColorId)
{
    var name
    for(var i=2;i<30;i++)
    {
        name = ctrl+'_gvColors_ctl'+String("0" + i).slice(-2)+'_row';
        if(document.getElementById(name)!=null)
        {
            if(trySetValue(name,ctrl,ColorId))
               return;
        }
        else
            return;
    }      
}

function cdd_SetIndex(ctlName,index)
{
   var ctlId = parseInt(index)+2;
   var rowdiv = document.getElementById(ctlName+"_gvColors_ctl"+String("0" + ctlId).slice(-2)+"_row");
   var selBox = document.getElementById(ctlName+"_tr1"); 
   var cdd = document.getElementById(ctlName+"_cdd"); 
   setValue(rowdiv,selBox,cdd);
}

function addOnMouseLeave(
  /*DOMElement*/ctl, /*Function*/onmouseleave)
{
  // summary: add an onMouseLeave handler to an element
  // element: DOMElement
  //   element for which the onMouseLeave is desired
  if(navigator.appName.search(/microsoft/i) == 0) return;
  var element = document.getElementById(ctl+"_l1");
  if (!element.id) element.id = ["onmouseleaveId",Math.random()].join("");
  setLogicalParent(element, element);
  element.onmouseout = function(evt)
  {
    var toElem = evt.relatedTarget;
    if (evt.relatedTarget == evt.currentTarget) return;
    var logicalParentId = toElem.getAttribute("logicalParentId");
    if (!logicalParentId || logicalParentId != element.id)
    {
      // call the onmouseleave handler with element as this
      // and pass it the event object
      onmouseleave.apply(element, new Array(ctl));
    }
  }
}

function setLogicalParent(
  /*DOMElement*/root, /*DOMElement*/logicalParent)
{
  // summary: set the logicalParent of an entire DOM subtree
  // root: DOMElement
  //   topmost element in the DOM subtree
  // logicalParent: DOMElement
  //   element which will be referenced by all in the subtree
  var children=root.childNodes;
  if (!children) return;
  for (var i=0, count=children.length; i<count; i++)
  {
    var child = children[i];
    if (!child.setAttribute) continue;
    child.setAttribute("logicalParentId", logicalParent.id);
    setLogicalParent(child, logicalParent);
  }
}

function getXYpos(elem) {
   if (!elem) {
      return {"x":0,"y":0};
   }
   var xy={"x":elem.offsetLeft,"y":elem.offsetTop}
   var par=getXYpos(elem.offsetParent);
   for (var key in par) {
      xy[key]+=par[key];
   }
   return xy;
}

function setFrameLoc(ctl)
{
    var layer1 = document.getElementById(ctl+"_l1");
    var frame1 = document.getElementById(ctl+"_fr1");
    
    if(!layer1)return;
    var pos = getXYpos(layer1);
    
    frame1.left = pos["x"];
    frame1.top = pos["y"];
}


function initCtl(ctl)
{
    addOnMouseLeave(ctl, closebox);
    setFrameLoc(ctl);
}