//////////////////////////////////////////
//                                      //
//                TREE                  //
//                                      //
//////////////////////////////////////////

function Tree(name, imageFolder, selectedCssClass, unselectedCssClass, rollCssClass) {
  this.name = name;
  this.imageFolder = imageFolder;
  this.selectedCssClass = selectedCssClass;
  this.unselectedCssClass = unselectedCssClass;
  this.rollCssClass = rollCssClass;
  this.children = new Array();
  this.sequence = 0;
}

Tree.draw = function(elem, treeJavascriptCode)
{
  eval(treeJavascriptCode);
  root.draw(elem);
}

Tree.prototype.add = function(node)
{
  node.tree = this;
  node.parent = this;
  this.children[this.children.length] = node;  
  return node;
}

Tree.prototype.draw = function(drawElem)
{
  var str = "";

  if(this.children.length > 0)
  {
    str += "<TABLE border='0' cellspacing='0' cellpadding='0'>";
    for (var i=0; i<this.children.length-1; i++)
    {
      str += this.children[i].draw(false);
    } 
    str += this.children[this.children.length-1].draw(true);
    str += "</TABLE>";
  }
  else
  {
    str = "<center>undefined!</center>"
  }
  drawElem.innerHTML = str;
}


Tree.prototype.getSelectedCssClass = function()
{
  return this.selectedCssClass;
}

Tree.prototype.getUnselectedCssClass = function()
{
  return this.unselectedCssClass;
}

Tree.prototype.getRollCssClass = function()
{
  return this.rollCssClass;
}

Tree.createTreeJavascriptCode = function(root, id)
{
  var str = "";
  if(id == null)
  {
    id = "node";
    str += 'root = new Tree("root", "img", "treeNodeSelected", "treeNodeUnselected", "treeNodeRoll");\n';
  }

  var nodes = root.nodes;
  
  for(var i=0;i<nodes.length; i++)
  {
    var node = nodes[i];
    var nodeId = id + "_" + i;
    var clickFunction = "TreeNode.nodeClick('"+node.id+"')";

    if(id == "node")
    {
      if(node.nodes.length > 0)
      {
        str += '' + nodeId + ' = root.add(new TreeNode('+node.display+', "' + nodeId + '", "folder", "' + node.title.toUpperCase() + '", "", "'+clickFunction+'", true));\n';
      }
      else
      {
        str += '' + nodeId + ' = root.add(new TreeNode('+node.display+', "' + nodeId + '", "file", "' + node.title.toUpperCase() + '", "", "'+clickFunction+'", true));\n';
      }          
    }
    else
    {
      if(node.nodes.length > 0)
      {
        str += '' + nodeId + ' = ' + id + '.add(new TreeNode('+node.display+', "' + nodeId + '", "folder", "' + node.title.toUpperCase() + '", "", "'+clickFunction+'", true));\n';
      }
      else
      {
        str += '' + nodeId + ' = ' + id + '.add(new TreeNode('+node.display+', "' + nodeId + '", "file", "' + node.title.toUpperCase() + '", "", "'+clickFunction+'", true));\n';
      }      
    }
    
    node.treeComponentNodeVarName = nodeId;
    
    
    if(node.nodes.length > 0)
    {
      str += Tree.createTreeJavascriptCode(node, nodeId);  
    }
  }  

  return str;
}




//////////////////////////////////////////
//                                      //
//              TREE NODE               //
//                                      //
//////////////////////////////////////////


function TreeNode(display, name, icon, label, href, javascript, expanded, selectedCssClass, unselectedCssClass, rollCssClass) {
  this.display = display;
  this.name = name;
  this.icon = icon;
  this.label = label;
  this.href = href;
  this.javascript = javascript;
  this.expanded = expanded;
  this.tree = null;
  this.parent = null;
  this.children = new Array();
  this.selectedCssClass = selectedCssClass;
  this.unselectedCssClass = unselectedCssClass;
  this.rollCssClass = rollCssClass;
  this.selectedNode = null;
  this.rollNode = null;
}

TreeNode.prototype.add = function(node)
{
  node.tree = this.tree;
  node.parent = this;
  this.children[this.children.length] = node;
  return node;
}


TreeNode.prototype.draw = function(isLast)
{
  var str = "";

  var nodeTDStyle = "";
  if(document.body.offsetWidth < 800)
  {
    nodeTDStyle += "width:" + (System.treePanelElemWidthSmall-25) + "px;";
  }
  else
  {
    nodeTDStyle += "width:" + (System.treePanelElemWidthLarge-25) + "px;";
  }
  nodeTDStyle += "cursor:pointer;";

  var width = "19";
  var height = "16";
  var trStyle = "position:absolute;top:-100px;width:1px;height:1px;";

  if(this.display)
  {
    trStyle = "";
  }

  if (this.children.length == 0)
  {
    // leaf
    str += "<TR style='"+trStyle+"'>";
    if (isLast)
    {
      str += "<TD width='"+width+"'><IMG src='" + this.tree.imageFolder + "/LastSplit.gif' width='"+width+"' height='"+height+"' border='0'/></TD>";
    }
    else
    {
      str += "<TD width='"+width+"' style='background-image:url(" + this.tree.imageFolder + "/treeBg.gif);'><IMG src='" + this.tree.imageFolder + "/MiddleSplit.gif' width='"+width+"' height='"+height+"' border='0'/></TD>";
    }

    str += "<TD colspan=2 width='100%'><TABLE border='0' cellspacing='0' cellpadding='0'><TR>";

    str += "<TD width='1'><IMG src='" + this.tree.imageFolder + "/" + this.icon + ".closed.gif' width='1' height='"+height+"' border='0'/></TD>";
    str += "<TD style='"+nodeTDStyle+";'>" + this.getSpan() + "</TD>";

    str += "</TR></TABLE></TD>";
    str += "</TR>";
  }
  else
  {
    // internal node

    str += "<TR>";
    if (isLast)
    {
      if(this.expanded)
      {
        str += "<TD width='"+width+"'><IMG src='" + this.tree.imageFolder + "/LastMinus.gif' width='"+width+"' height='"+height+"' border='0' name='" + this.name + "pm' onclick=\"" + this.name + ".toggle();\"/></TD>";
      }
      else
      {
        str += "<TD width='"+width+"'><IMG src='" + this.tree.imageFolder + "/LastPlus.gif' width='"+width+"' height='"+height+"' border='0' name='" + this.name + "pm' onclick=\"" + this.name + ".toggle();\"/></TD>";
      }    
    
      
    }
    else
    {
      if(this.expanded)
      {
        str += "<TD width='"+width+"'><IMG src='" + this.tree.imageFolder + "/MiddleMinus.gif' width='"+width+"' height='"+height+"' border='0' name='" + this.name + "pm' onclick=\"" + this.name + ".toggle();\"/></TD>";
      }
      else
      {
        str += "<TD width='"+width+"'><IMG src='" + this.tree.imageFolder + "/MiddlePlus.gif' width='"+width+"' height='"+height+"' border='0' name='" + this.name + "pm' onclick=\"" + this.name + ".toggle();\"/></TD>";
      }
    }

    str += "<TD colspan=2 width='100%'><TABLE border='0' cellspacing='0' cellpadding='0'><TR>";

    str += "<TD width='1'><IMG src='" + this.tree.imageFolder + "/" + this.icon + ".closed.gif' width='1' height='"+height+"' border='0' name='" + this.name + "ic' onclick=\"" + this.name + ".toggle();\"/></TD>";
    str += "<TD style='"+nodeTDStyle+"'>" + this.getSpan() + "</TD>";

    str += "</TR></TABLE></TD>";
    str += "</TR>";

    if (this.expanded)
    {
      styleStr = "";
    }
    else
    {
      styleStr = "display: none;";
    }

    if (isLast)
    {
      str += "<TR id='" + this.name + "sm' style='" + styleStr + "'><TD></TD><TD colspan='2'>";
    }
    else
    {
      str += "<TR id='" + this.name + "sm' style='" + styleStr + "'><TD background='" + this.tree.imageFolder + "/MiddleNoSplit.gif'></TD><TD colspan='2'>";
    }

    str += "<TABLE border='0' cellspacing='0' cellpadding='0'>";
    for (var i=0; i<this.children.length-1; i++)
    {
      str += this.children[i].draw(false);
    }
    str += this.children[this.children.length-1].draw(true);
    str += "</TABLE>";
    str += "</TD></TR>";
  }

  return str;
}  

TreeNode.prototype.getSpan = function()
{
  var str = "<table border=0 cellpadding=0 cellspacing=0><tr>"

  if (this.href != "")
  {
    return "<span><a href=\"" + this.href + "\" id='" + this.name + "sp' class=" + this.getUnselectedCssClass() + " onclick=\"" + this.name + ".select();\" onmouseover=\"" + this.name + ".roll();\" onmouseout=\"" + this.name + ".out();\" title=\""+this.label+"\">&nbsp;" + this.label + "&nbsp;</a></span>";
  }
  else if (this.javascript != "")
  {    
    str += "<td id='" + this.name + "sp' class=" + this.getUnselectedCssClass() + " onclick=\"" + this.name + ".select();" + this.javascript +"\" onmouseover=\"" + this.name + ".roll();\" onmouseout=\"" + this.name + ".out();\" title=\""+this.label+"\">";
    str += this.label;  
    //return "<span><a href=\"Javascript:;\" id='" + this.name + "sp' class=" + this.getUnselectedCssClass() + " onclick=\"" + this.name + ".select();" + this.javascript +"\" onmouseover=\"" + this.name + ".roll();\" onmouseout=\"" + this.name + ".out();\" title=\""+this.label+"\">" + this.label + "</a></span>";
  }
  else
  {
    if (this.children.length == 0)
    {
      return "<span><a href=\"Javascript:;\" id='" + this.name + "sp' class=" + this.getUnselectedCssClass() + " onmouseover=\"" + this.name + ".roll();\" onmouseout=\"" + this.name + ".out();\" title=\""+this.label+"\">&nbsp;" + this.label + "&nbsp;</a></span>";
    }
    else
    {
      return "<span><a href=\"Javascript:;\" id='" + this.name + "sp' class=" + this.getUnselectedCssClass() + " onclick=\"" + this.name + ".toggle();\" onmouseover=\"" + this.name + ".roll();\" onmouseout=\"" + this.name + ".out();\" title=\""+this.label+"\">&nbsp;" + this.label + "&nbsp;</a></span>";
    }
  }
  
  
  str += "</td></tr></table>"; 
  return str;
}

TreeNode.prototype.getSelectedCssClass = function()
{
  if (this.selectedCssClass == null)
  {
    return this.parent.getSelectedCssClass();
  }
  else
  {
    this.selectedCssClass;
  }
}

TreeNode.prototype.getUnselectedCssClass = function()
{
  if (this.unselectedCssClass == null)
  {
    return this.parent.getUnselectedCssClass();
  }
  else
  {
    this.unselectedCssClass;
  }
}

TreeNode.prototype.getRollCssClass = function()
{
  if (this.rollCssClass == null)
  {
    return this.parent.getRollCssClass();
  }
  else
  {
    this.rolCssClass;
  }
}

TreeNode.prototype.toggle = function()
{
  if (document.getElementById(this.name + 'sm').style.display == "none")
  {
    document.images[this.name + 'pm'].src = this.tree.imageFolder + "/LastMinus.gif";
    document.images[this.name + 'ic'].src = this.tree.imageFolder + "/" + this.icon + ".open.gif";
    document.getElementById(this.name + 'sm').style.display = "";
  }
  else
  {
    document.images[this.name + 'pm'].src = this.tree.imageFolder + "/LastPlus.gif";
    document.images[this.name + 'ic'].src = this.tree.imageFolder + "/" + this.icon + ".closed.gif";
    document.getElementById(this.name + 'sm').style.display = "none";
  }
}

TreeNode.prototype.select = function()
{
  if (this.tree.selectedNode != null)
  {
    this.tree.selectedNode.deselect();
  }
  TreeNode.setClass(document.getElementById(this.name + 'sp'), this.getSelectedCssClass());
  this.tree.selectedNode = this;
}

TreeNode.prototype.deselect = function()
{
  TreeNode.setClass(document.getElementById(this.name + 'sp'), this.getUnselectedCssClass());
}

TreeNode.prototype.roll = function()
{
  if(this != this.tree.selectedNode)
  {
    TreeNode.setClass(document.getElementById(this.name + 'sp'), this.getRollCssClass());
    this.tree.rollNode = this;
  }
}



TreeNode.prototype.out = function()
{
  if(this != this.tree.selectedNode)
  {
    if(this.tree.rollNode != null)
    {
      TreeNode.setClass(document.getElementById(this.name + 'sp'), this.getUnselectedCssClass());
    }  
  }  
}

TreeNode.setClass = function (item, cssClass)
{
  for (var i=0; i<item.attributes.length; i++)
  {
    if (item.attributes.item(i).nodeName == 'class')
    {
      item.attributes.item(i).nodeValue = cssClass;
      item.blur();
    }
  }
}


TreeNode.nodeClick = function (treeComponentNode, nodeId)
{
  system.menu.content.nodeClick(treeComponentNode, nodeId);
}






