var expandCloseIcon = new Image();
expandCloseIcon.src = "../public/images/treeview/expander_close.gif";
var  expandOpenIcon = new Image();
expandOpenIcon.src = "../public/images/treeview/expander_open.gif";


function createListMenu(id, list, opened) {
  // first node
  document.write("<a href=\"javascript: openList('" + id + "');\"><img border=\"0\" id=\"join" + id + "\"");
  
  if (opened == true) {
    document.write(" src=\"../public/images/treeview/expander_open.gif\"");
    document.write(" title=\"Close " + id + " List\" /></a>");
  } else {
    document.write(" src=\"../public/images/treeview/expander_close.gif\"");
    document.write(" title=\"Open " + id + " List\" /></a>");
  }
  document.write("<span nowrap class=\"sapTreNoDsbl\" style=\"cursor:default;\">" + id + "</span><br/>");			  
	
  // list
  document.write("<div class=\"sapTreNl2\" id=\"div" + id + "\"");
  if (opened == true) {
    document.write(" style=\"display: '';\"");
  } else {
    document.write(" style=\"display: none;\"");
  }
  document.write(">");
  
  for (i=0; i<list.length; i++) {
    var values = list[i].split("@@");
    document.write("<img border=\"0\" src=\"../public/images/treeview/expander_none.gif\" alt=\"\" />");
    document.write("<img border=\"0\"" + "width=\"16\" height=\"16\"" + "src=\"../public/images/treeview/treeleaf.gif\" alt=\"\" />");
    document.write("<a href=\"" + values[1] + "\" target=\"" + values[2] + "\" class=\"" + values[3]);
    document.write("\"" + " title=\"" + values[0] + "\">" + values[0] + "</a><br/>");
    
  }
  
  document.write("</div>");			
}

function openList(id) {
  var theDiv  = document.getElementById("div" + id);
  var theJoin = document.getElementById("join" + id);

  if (theDiv.style.display == 'none') {
	theJoin.src = expandOpenIcon.src;
	theJoin.title = 'Close ' + id + ' List';
	theDiv.style.display = '';
  } else {
	theJoin.src = expandCloseIcon.src;
	theJoin.title = 'Open ' + id + ' List';
	theDiv.style.display = 'none';
  }
}