// Menu G4 Editor
// Last Modified: 06-Jul-2003
// Web Site: yxScripts.com
// Email: m_yangxin@hotmail.com

// Copyright 2003  Xin Yang   All Rights Reserved.

var contentList=null, styleList=null, formHolder=null, colorHolder=null;
var currentItem=null, currentStyle=null, currentIns=null;
var padFolder=null, padList=null, itemFolder=null, itemList=null, fontFolder=null, fontList=null, tagFolder=null, tagList=null, sepFolder=null, sepList=null;
var menuFolder=null, menuList=null, groupFolder=null, groupList=null;
var padCount=0, itemCount=0, fontCount=0, tagCount=0, sepCount=0, menuCount=0, groupCount=0;
var formWidth=307, insNo=1;
var tableOpen='<form><table width="'+formWidth+'" cellspacing="0" cellpadding="3" border="0" bgcolor="#c0c0c0" class="box"><tr><td align="center"><table cellpadding="1" cellspacing="0" border="0">';
var tableEnd='</table></td></tr></table></form>';
var ptr=(yx_isIE || yx_isOpera)?"hand":"pointer";
var subPool=[];
var nullRE=/^\s*$/, numRE=/^\d+$/, numRE2=/^(\+|\-)*\d+$/, colorRE=/(#[a-f\d\-]{6})/i, colorRE2=/(#[a-f\d]{6})/i, sidesRE=/(1|0)\s+(1|0)\s+(1|0)\s+(1|0)/, padRE=/^\d+(\s+\d+\s*)?$/;
var helpList=[
"border-sides", "set of numbers of 0 (to use background-color) or 1 (to use border-color) separated by spaces, specify how to pick a border color for sides of top, right, bottom and left.<br><br><b>1 1 1 1</b> ... Default",
"padding", "one number (for both padding height and width) or two numbers separated by space (for padding height and padding width respectively) that specify the padding space.<br><br><b>0</b> ... Default",
"menu-form", "string that specifies one of the following values:<br><br><b>bar</b> ... Top-menu shown as a horizontal menu bar.<br><b>pad</b> ... Default. Top-menu shown as a drop-down menu pad.",
"direction", "string that specifies one of the following values:<br><br><b>right-down</b> ... Default. If the parent menu is a menu pad, show the sub-menu on right side and align the sub-menu and its parent item on top. If the parent menu is a menu bar, show the sub-menu below and align the sub-menu and its parent item on left side.<br><b>right-up</b> ... For menu pad, show the sub-menu on right side and align the sub-menu and its parent item on bottom. For menu bar, show the sub-menu above and align the sub-menu and its parent item on left side.",
"direction", "<b>left-down</b> ... For menu pad, show the sub-menu on left side and align the sub-menu and its parent item on top. For menu bar, show the sub-menu below and align the sub-menu and its parent item on right side.<br><b>left-up</b> ... For menu pad, show the sub-menu on left side and align the sub-menu and its parent item on bottom. For menu bar, show the sub-menu above and align the sub-menu and its parent item on right side.",
"direction", "<b>center-down</b> ... For menu bar only. Show the sub-menu below and align the sub-menu and parent menu on center.<br><b>center-up</b> ... For menu bar only. Show the sub-menu above and align the sub-menu and parent menu on center.<br><b>abs-right-down</b> ... For menu bar only. Show the sub-menu below and align the sub-menu and parent menu on right side.<br><b>abs-right-up</b> ... For menu bar only. Show the sub-menu above and align the sub-menu and parent menu on right side.<br><b>abs-left-down</b> ... For menu bar only. Show the sub-menu below and align the sub-menu and parent menu on left side.<br><b>abs-left-up</b> ... For menu bar only. Show the sub-menu above and align the sub-menu and parent menu on left side.",
"direction", "<b>right-top</b> ... For menu pad only. Show the sub-menu on right side and align the sub-menu and parent menu on top.<br><b>left-top</b> ... For menu pad only. Show the sub-menu on left side and align the sub-menu and parent menu on top.<br><b>right-middle</b> ... For menu pad only. Show the sub-menu on right side and align the sub-menu and parent menu in middle.<br><b>left-middle</b> ... For menu pad only. Show the sub-menu on left side and align the sub-menu and parent menu in middle.<br><b>right-bottom</b> ... For menu pad only. Show the sub-menu on right side and align the sub-menu and parent menu on bottom.<br><b>left-bottom</b> ... For menu pad only. Show the sub-menu on left side and align the sub-menu and parent menu on bottom.",
"scroll", "string that specifies one of the following values:<br><br><b>yes</b> ... If a menu pad is longer than the height of the browser window or a menu bar is wider than the width of the browser window, begin to scroll the out-of-border part of the menu into the browser window when the mouse cursor stops on the item close to browser edge for a while. Stop the scrolling if a mouse-move, mouse-down or mouse-click is detected, or the menu end gets into the browser window.<br><b>no</b> ... Default. Do not scroll the menu at all.",
"offset-top & offset-left", "number that specifies the offset in pixel (after the direction placement):<br><br><b>0</b> ... Default",
"opacity", "number (0 to 100) that specifies the opacity of the base pad (for IE/N6+ only):<br><br><b>100</b> ... Default</td>",

"border-style mouse-down", "string that specifies the border color effect for item at mouse-down status:<br><br><b>outset</b> ... 3-D outset color effect<br><b>inset</b> ... 3D inset color effect<br><b>solid</b> ... Border is a solid line.<br><br>If not specified, the menu item won't have mouse-down effect.",
"border-sides", "set, or sets separated by comma, of numbers of 0 (to use background-color) or 1 (to use border-color) separated by spaces, specify how to pick a border color for sides of top, right, bottom and left for item at status of normal, highlighted and mouse-down.<br><br><b>1 1 1 1, 1 1 1 1</b> ... Default.<br><br>A set will take effect only if both associated border-style and border-color are specified.",
"padding", "number (for both padding height and width) or two numbers separated by space (for padding height and padding width respectively) that specify the padding space:<br><br><b>0</b> ... Default",
"sub-menu", "string that specifies one of the following values:<br><br><b>mouse-over</b> ... Default. Hover to open a sub-menu. You can specify a link for a sub-menu item so that clicking on it will load the link.<br><b>mouse-click</b> ... Click to open a sub-menu. The link, if any, for the sub-menu item will be ignored.",
"opacity", "number (0 to 100) that specifies the opacity of the item (for IE/N6+ only):<br><br><b>100</b> ... Default",

"font-family", "string or strings separated by comma that specify the font name:<br><br><b>Arial</b> ... Default.",
"vertical-align", "string that specifies one of the following values:<br><br><b>top</b> ... Default.<br><b>middle</b> ... Does not work in Netscape 4, should be considered only when all the items can display text in one line and you also specify the item height in the item style. This is to help align the item text in the middle without setting the item padding height.",

"path", "string that specifies the web path for tag images.<br><br>If the path doesn't start with \".\" (like \"./\" or \"../\"), \"/\" or \"http://\", the \"imagePath\" will be added to it.",
"valign", "string that specifies one of the following values:<br><br><b>top</b> ... Default.<br><b>middle</b> ... Only works in IE/N6+/Konq3, should be considered only when all the items can display text in one line."
];

function showLayer(l) { l.style.visibility="visible"; }
function hideLayer(l) { l.style.visibility="hidden"; }

function menuAlert() {
  alert("Please select a menu or a menu item first.");
}

function colorAlert(n) {
  alert("Please use #rrggbb format for "+n+".");
}

function nameAlert() {
  alert("Please input the style name.");
}

function numAlert(n) {
  alert("Please input a numeric value for "+n+".");
}

function sidesAlert(n) {
  alert("Please use N N N N format for "+n+". N could be 0 or 1.");
}

function prepNode(node) {
  var pn=node.previousSibling;

  if (pn!=null && pn.role=="list") {
    return prepNode(pn);
  }

  return pn;
}

function nextNode(node) {
  var nn=node.nextSibling;

  if (nn!=null && nn.role=="list") {
    return nextNode(nn);
  }

  return nn;
}

function moveButtons(item) {
  var bl="", pn=prepNode(item), nn=nextNode(item);
  if (pn!=null || nn!=null) {
    bl+='<tr><td align="center" colspan="2">';
    if (pn!=null) {
      bl+='<input class="long" type="button" value="  Move Up  " onclick="itemUp()">';
      if (nn!=null) {
        bl+='&nbsp;&nbsp;';
      }
    }

    if (nn!=null) {
      bl+='<input class="long" type="button" value="  Move Down  " onclick="itemDown()">';
    }
    bl+='</td></tr>';
  }
  return bl;
}

function formTab(title,tab) { return '<tr><td align="center" colspan="2"><div class="'+tab+'">'+title+'</div></td></tr>'; }
function formTitle(title) { return formTab(title,"tab"); }
function formTitleM(title) { return formTab(title,"tabm"); }
function formTitleS(title) { return formTab(title,"tabs"); }

function formContent(id1,id2,id) { return formTab2(helpList[id*2+1],"tab")+formEnd(id1,id2,id); }
function formTab2(content,tab) { return '<tr><td align="left" colspan="2"><p class="'+tab+'" style="padding:6px">'+content+'</p></td></tr>'; }
function formEnd(id1,id2,id) { return '<tr><td align="center" colspan="2">'+(id1<id?('<input class="submit" type="button" value="Prev" onclick="showHelp('+id1+','+id2+','+(id-1)+')">'):'')+(id<id2?('<input class="submit" type="button" value="Next" onclick="showHelp('+id1+','+id2+','+(id+1)+')">'):'')+'<input class="submit" type="button" value="Close" onclick="hideHelp()"></td></tr>'; }

function menuForm() {
  return tableOpen+formTitle("New Menu")+'<tr><td align="right"><nobr>&nbsp;Menu Name:&nbsp;</nobr></td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Top-Menu Name:&nbsp;</nobr></td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Add  " onclick="newMenu2(this.form.elements[0].value,this.form.elements[1].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function menuForm2() {
  return tableOpen+formTitleM("Menu")+'<tr><td align="right"><nobr>&nbsp;Menu Name:&nbsp;</nobr></td><td><input class="text" type="text" value="'+currentItem.menu+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Top-Menu Name:&nbsp;</nobr></td><td><input class="text" type="text" value="'+currentItem.iden+'">&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Change  " onclick="updateMenu(this.form.elements[0].value,this.form.elements[1].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Delete  " onclick="delMenu()">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function subMenuForm(lead) {
  return tableOpen+formTitle('['+lead+'] : Sub-Menu Item')+'<tr><td align="right"><nobr>&nbsp;Sub-Menu Name:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Display:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Message:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Link:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Group ID:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Add  " onclick="newSub2(this.form.elements[1].value,this.form.elements[2].value,this.form.elements[3].value,this.form.elements[0].value,this.form.elements[4].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function subMenuForm2() {
  return tableOpen+formTitleM('['+currentItem.lead.iden+'] : Sub-Menu Item')+'<tr><td align="right"><nobr>&nbsp;Sub-Menu Name:&nbsp;</td><td><input class="text" type="text" value="'+currentItem.iden+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Display:&nbsp;</td><td><input class="text" type="text" value="'+currentItem.dis+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Message:&nbsp;</td><td><input class="text" type="text" value="'+currentItem.msg+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Link:&nbsp;</td><td><input class="text" type="text" value="'+currentItem.link+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Group ID:&nbsp;</td><td><input class="text" type="text" value="'+currentItem.group+'">&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Change  " onclick="updateSub(this.form.elements[1].value,this.form.elements[2].value,this.form.elements[3].value,this.form.elements[0].value,this.form.elements[4].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Delete  " onclick="delSub()">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+moveButtons(currentItem)+tableEnd;
}

function subMenuForm3(lead) {
  return tableOpen+formTitle('['+lead+'] : Sub-Menu Item')+'<tr><td align="right"><nobr>&nbsp;Sub-Menu Name:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Display:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Message:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Link:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Group ID:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Insert  " onclick="newSub3(0,this.form.elements[1].value,this.form.elements[2].value,this.form.elements[3].value,this.form.elements[0].value,this.form.elements[4].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Append  " onclick="newSub3(1,this.form.elements[1].value,this.form.elements[2].value,this.form.elements[3].value,this.form.elements[0].value,this.form.elements[4].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function linkForm(lead) {
  return tableOpen+formTitle('['+lead+'] : Link Item')+'<tr><td align="right"><nobr>&nbsp;Display:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Message:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Link:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Group ID:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Add  " onclick="newLink2(this.form.elements[0].value,this.form.elements[1].value,this.form.elements[2].value,this.form.elements[3].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function linkForm2() {
  return tableOpen+formTitleM('['+currentItem.lead.iden+'] : Link Item')+'<tr><td align="right"><nobr>&nbsp;Display:&nbsp;</td><td><input class="text" type="text" value="'+currentItem.dis+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Message:&nbsp;</td><td><input class="text" type="text" value="'+currentItem.msg+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Link:&nbsp;</td><td><input class="text" type="text" value="'+currentItem.link+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Group ID:&nbsp;</td><td><input class="text" type="text" value="'+currentItem.group+'">&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Change  " onclick="updateLink(this.form.elements[0].value,this.form.elements[1].value,this.form.elements[2].value,this.form.elements[3].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Delete  " onclick="delLink()">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+moveButtons(currentItem)+tableEnd;
}

function linkForm3(lead) {
  return tableOpen+formTitle('['+lead+'] : Link Item')+'<tr><td align="right"><nobr>&nbsp;Display:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Message:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Link:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Group ID:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Insert  " onclick="newLink3(0,this.form.elements[0].value,this.form.elements[1].value,this.form.elements[2].value,this.form.elements[3].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Append  " onclick="newLink3(1,this.form.elements[0].value,this.form.elements[1].value,this.form.elements[2].value,this.form.elements[3].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function commandForm(lead) {
  return tableOpen+formTitle('['+lead+'] : Command Item')+'<tr><td align="right"><nobr>&nbsp;Display:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Message:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Command:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Group ID:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Add  " onclick="newCommand2(this.form.elements[0].value,this.form.elements[1].value,this.form.elements[2].value,this.form.elements[3].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function commandForm2() {
  return tableOpen+formTitleM('['+currentItem.lead.iden+'] : Command Item')+'<tr><td align="right"><nobr>&nbsp;Display:&nbsp;</td><td><input class="text" type="text" value="'+currentItem.dis+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Message:&nbsp;</td><td><input class="text" type="text" value="'+currentItem.msg+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Command:&nbsp;</td><td><input class="text" type="text" value="'+currentItem.code+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Group ID:&nbsp;</td><td><input class="text" type="text" value="'+currentItem.group+'">&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Change  " onclick="updateCommand(this.form.elements[0].value,this.form.elements[1].value,this.form.elements[2].value,this.form.elements[3].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Delete  " onclick="delCommand()">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+moveButtons(currentItem)+tableEnd;
}

function commandForm3(lead) {
  return tableOpen+formTitle('['+lead+'] : Command Item')+'<tr><td align="right"><nobr>&nbsp;Display:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Message:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Command:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Group ID:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Insert  " onclick="newCommand3(0,this.form.elements[0].value,this.form.elements[1].value,this.form.elements[2].value,this.form.elements[3].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Append" onclick="newCommand3(1,this.form.elements[0].value,this.form.elements[1].value,this.form.elements[2].value,this.form.elements[3].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function infoForm(lead) {
  return tableOpen+formTitle('['+lead+'] : Info Item')+'<tr><td align="right"><nobr>&nbsp;Info:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Group ID:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Add  " onclick="newInfo2(this.form.elements[0].value,this.form.elements[1].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function infoForm2() {
  return tableOpen+formTitleM('['+currentItem.lead.iden+'] : Info Item')+'<tr><td align="right"><nobr>&nbsp;Info:&nbsp;</td><td><input class="text" type="text" value="'+currentItem.dis+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Group ID:&nbsp;</td><td><input class="text" type="text" value="'+currentItem.group+'">&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Change  " onclick="updateInfo(this.form.elements[0].value,this.form.elements[1].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Delete  " onclick="delInfo()">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+moveButtons(currentItem)+tableEnd;
}

function infoForm3(lead) {
  return tableOpen+formTitle('['+lead+'] : Info Item')+'<tr><td align="right"><nobr>&nbsp;Info:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;Group ID:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Insert  " onclick="newInfo3(0,this.form.elements[0].value,this.form.elements[1].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Append  " onclick="newInfo3(1,this.form.elements[0].value,this.form.elements[1].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function sepForm(lead) {
  return tableOpen+formTitle('['+lead+'] : Separator Item')+'<tr><td align="center" colspan="2"><input class="submit" type="button" value="  Add  " onclick="newSep2()">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function sepForm2() {
  return tableOpen+formTitleM('['+currentItem.lead.iden+'] : Separator Item')+'<tr><td align="center" colspan="2"><input class="submit" type="button" value="  Delete  " onclick="delSep()">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+moveButtons(currentItem)+tableEnd;
}

function sepForm3(lead) {
  return tableOpen+formTitle('['+lead+'] : Separator Item')+'<tr><td align="center" colspan="2"><input class="submit" type="button" value="  Insert  " onclick="newSep3(0)">&nbsp;&nbsp;<input class="submit" type="button" value="  Append  " onclick="newSep3(1)">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function initForm() {
  contentList=yx_findLayer("contentList");
  styleList=yx_findLayer("styleList");

  formHolder=yx_findLayer("formCell");
  colorHolder=yx_findLayer("colorCell");

  groupFolder=yx_createEle("LI");
  groupFolder.innerHTML='<span class="text">&nbsp;Style Group&nbsp;</span>';
  groupFolder.style.listStyleImage="url(open.gif)";
  groupFolder.style.display="none";
  groupList=yx_createEle("UL"); groupList.style.display="none";

  groupFolder.onclick=switchFolder; groupFolder.style.cursor=ptr;
  groupFolder.status=1; groupFolder.type="circle";
  groupFolder.list=groupList; groupList.lead=groupFolder;

  styleList.appendChild(groupFolder); styleList.appendChild(groupList);

  menuFolder=yx_createEle("LI");
  menuFolder.innerHTML='<span class="text">&nbsp;Style Menu&nbsp;</span>';
  menuFolder.style.listStyleImage="url(open.gif)";
  menuFolder.style.display="none";
  menuList=yx_createEle("UL"); menuList.style.display="none";

  menuFolder.onclick=switchFolder; menuFolder.style.cursor=ptr;
  menuFolder.status=1; menuFolder.type="circle";
  menuFolder.list=menuList; menuList.lead=menuFolder;

  styleList.appendChild(menuFolder); styleList.appendChild(menuList);

  padFolder=yx_createEle("LI");
  padFolder.innerHTML='<span class="text">&nbsp;Pad Style&nbsp;</span>';
  padFolder.style.listStyleImage="url(open.gif)";
  padFolder.style.display="none";
  padList=yx_createEle("UL"); padList.style.display="none";

  padFolder.onclick=switchFolder; padFolder.style.cursor=ptr;
  padFolder.status=1; padFolder.type="circle";
  padFolder.list=padList; padList.lead=padFolder;

  styleList.appendChild(padFolder); styleList.appendChild(padList);

  itemFolder=yx_createEle("LI");
  itemFolder.innerHTML='<span class="text">&nbsp;Item Style&nbsp;</span>';
  itemFolder.style.listStyleImage="url(open.gif)";
  itemFolder.style.display="none";
  itemList=yx_createEle("UL"); itemList.style.display="none";

  itemFolder.onclick=switchFolder; itemFolder.style.cursor=ptr;
  itemFolder.status=1; itemFolder.type="circle";
  itemFolder.list=itemList; itemList.lead=itemFolder;

  styleList.appendChild(itemFolder); styleList.appendChild(itemList);

  fontFolder=yx_createEle("LI");
  fontFolder.innerHTML='<span class="text">&nbsp;Font Style&nbsp;</span>';
  fontFolder.style.listStyleImage="url(open.gif)";
  fontFolder.style.display="none";
  fontList=yx_createEle("UL"); fontList.style.display="none";

  fontFolder.onclick=switchFolder; fontFolder.style.cursor=ptr;
  fontFolder.status=1; fontFolder.type="circle";
  fontFolder.list=fontList; fontList.lead=fontFolder;

  styleList.appendChild(fontFolder); styleList.appendChild(fontList);

  tagFolder=yx_createEle("LI");
  tagFolder.innerHTML='<span class="text">&nbsp;Tag Style&nbsp;</span>';
  tagFolder.style.listStyleImage="url(open.gif)";
  tagFolder.style.display="none";
  tagList=yx_createEle("UL"); tagList.style.display="none";

  tagFolder.onclick=switchFolder; tagFolder.style.cursor=ptr;
  tagFolder.status=1; tagFolder.type="circle";
  tagFolder.list=tagList; tagList.lead=tagFolder;

  styleList.appendChild(tagFolder); styleList.appendChild(tagList);

  sepFolder=yx_createEle("LI");
  sepFolder.innerHTML='<span class="text">&nbsp;Separator Style&nbsp;</span>';
  sepFolder.style.listStyleImage="url(open.gif)";
  sepFolder.style.display="none";
  sepList=yx_createEle("UL"); sepList.style.display="none";

  sepFolder.onclick=switchFolder; sepFolder.style.cursor=ptr;
  sepFolder.status=1; sepFolder.type="circle";
  sepFolder.list=sepList; sepList.lead=sepFolder;

  styleList.appendChild(sepFolder); styleList.appendChild(sepList);
}

function hideForm() {
  hideLayer(formHolder);
  hideHelp();
}

function newMenu() {
  formHolder.innerHTML=menuForm();
  showLayer(formHolder);
}

function newSub() {
  if (currentItem!=null) {
    if (currentItem.role=="top" || currentItem.role=="sub" && currentItem.status==1) {
      formHolder.innerHTML=subMenuForm(currentItem.iden);
      showLayer(formHolder);
    }
    else {
      formHolder.innerHTML=subMenuForm3(currentItem.lead.iden);
      showLayer(formHolder);
    }
  }
  else {
    menuAlert();
  }
}

function newLink() {
  if (currentItem!=null) {
    if (currentItem.role=="top" || currentItem.role=="sub" && currentItem.status==1) {
      formHolder.innerHTML=linkForm(currentItem.iden);
      showLayer(formHolder);
    }
    else {
      formHolder.innerHTML=linkForm3(currentItem.lead.iden);
      showLayer(formHolder);
    }
  }
  else {
    menuAlert();
  }
}

function newCommand() {
  if (currentItem!=null) {
    if (currentItem.role=="top" || currentItem.role=="sub" && currentItem.status==1) {
      formHolder.innerHTML=commandForm(currentItem.iden);
      showLayer(formHolder);
    }
    else {
      formHolder.innerHTML=commandForm3(currentItem.lead.iden);
      showLayer(formHolder);
    }
  }
  else {
    menuAlert();
  }
}

function newSep() {
  if (currentItem!=null) {
    if (currentItem.role=="top" || currentItem.role=="sub" && currentItem.status==1) {
      formHolder.innerHTML=sepForm(currentItem.iden);
      showLayer(formHolder);
    }
    else {
      formHolder.innerHTML=sepForm3(currentItem.lead.iden);
      showLayer(formHolder);
    }
  }
  else {
    menuAlert();
  }
}

function newInfo() {
  if (currentItem!=null) {
    if (currentItem.role=="top" || currentItem.role=="sub" && currentItem.status==1) {
      formHolder.innerHTML=infoForm(currentItem.iden);
      showLayer(formHolder);
    }
    else {
      formHolder.innerHTML=infoForm3(currentItem.lead.iden);
      showLayer(formHolder);
    }
  }
  else {
    menuAlert();
  }
}

function showItem() {
  if (currentItem!=null) {
    if (currentItem.role=="top") {
      formHolder.innerHTML=menuForm2();
      showLayer(formHolder);
    }
    else if (currentItem.role=="sub") {
      formHolder.innerHTML=subMenuForm2();
      showLayer(formHolder);
    }
    else if (currentItem.role=="link") {
      formHolder.innerHTML=linkForm2();
      showLayer(formHolder);
    }
    else if (currentItem.role=="command") {
      formHolder.innerHTML=commandForm2();
      showLayer(formHolder);
    }
    else if (currentItem.role=="info") {
      formHolder.innerHTML=infoForm2();
      showLayer(formHolder);
    }
    else if (currentItem.role=="separator") {
      formHolder.innerHTML=sepForm2();
      showLayer(formHolder);
    }
  }
}

function switchFolder() {
  if (this.status==0) {
    this.style.listStyleImage="url(open.gif)";
    this.status=1;
    this.list.style.display="";
  }
  else {
    this.style.listStyleImage="url(fold.gif)";
    this.status=0;
    this.list.style.display="none";
  }
}

function blurItem() {
  currentItem.childNodes[0].style.borderColor="#ffffff";
}

function highlightItem() {
  currentItem.childNodes[0].style.borderColor="#000000";
}

function clickItem() {
  if (currentItem!=this) {
    if (currentItem!=null) {
      blurItem();
    }

    currentItem=this;
    highlightItem();
  }

  showItem();
}

function clickFolder() {
  if (currentItem!=this) {
    if (currentItem!=null) {
      blurItem();
    }

    currentItem=this;
    highlightItem();
  }
  else {
    this.switchFolder();
  }

  showItem();
}

function _newMenu(name,sub) {
  var tagLI=yx_createEle("LI");
  tagLI.style.listStyleImage="url(fold.gif)";
  tagLI.innerHTML='<span class="item">&nbsp;'+name+'&nbsp;</span>';

  tagLI.menu=name;
  tagLI.iden=sub;
  tagLI.dis="";
  tagLI.role="top";
  tagLI.status=0;

  tagLI.type="disc";

  tagLI.style.cursor=ptr;
  tagLI.onclick=clickFolder;
  tagLI.switchFolder=switchFolder;

  contentList.appendChild(tagLI);

  var tagUL=yx_createEle("UL");
  contentList.appendChild(tagUL);

  tagLI.list=tagUL;
  tagUL.lead=tagLI;
  tagUL.role="list";

  if (currentItem!=null) {
    blurItem();
  }
  currentItem=tagLI;
  highlightItem();
}

function newMenu2(name,sub) { _newMenu(name,sub); hideForm(); }

function _newSub(dis,msg,link,sub,group) {
  var subLI=yx_createEle("LI");
  subLI.style.listStyleImage="url(fold.gif)";
  subLI.innerHTML='<span class="item">&nbsp;'+dis+'&nbsp;</span>';

  subLI.iden=sub;
  subLI.dis=dis;
  subLI.msg=msg;
  subLI.link=link;
  subLI.group=group;
  subLI.role="sub";
  subLI.status=0;

  subLI.type="disc";

  subLI.style.cursor=ptr;
  subLI.onclick=clickFolder;
  subLI.switchFolder=switchFolder;

  return subLI;
}

function newSub2(dis,msg,link,sub,group) {
  if (currentItem.status==0) { currentItem.switchFolder(); }

  var subLI=_newSub(dis,msg,link,sub,group);
  currentItem.list.appendChild(subLI);

  var subUL=yx_createEle("UL");
  currentItem.list.appendChild(subUL);

  subLI.lead=currentItem;
  subLI.list=subUL;
  subUL.lead=subLI;
  subUL.role="list";

  hideForm();
}

function newSub3(mode,dis,msg,link,sub,group) {
  var subLI=_newSub(dis,msg,link,sub,group);
  var list=currentItem.lead.list;
  if (mode==0) {
    list.insertBefore(subLI,currentItem);
  }
  else {
    if (currentItem.role=="sub") {
      list.insertBefore(subLI,currentItem.nextSibling.nextSibling);
    }
    else {
      list.insertBefore(subLI,currentItem.nextSibling);
    }
  }

  var subUL=yx_createEle("UL");
  list.insertBefore(subUL,subLI.nextSibling);

  subLI.lead=currentItem.lead;
  subLI.list=subUL;
  subUL.lead=subLI;
  subUL.role="list";

  hideForm();
}

function _newLink(dis,msg,link,group) {
  var subLI=yx_createEle("LI");
  subLI.innerHTML='<span class="item">&nbsp;'+dis+'&nbsp;</span>';

  subLI.dis=dis;
  subLI.msg=msg;
  subLI.link=link;
  subLI.group=group;
  subLI.role="link";

  subLI.type="square";

  subLI.style.cursor=ptr;
  subLI.onclick=clickItem;

  return subLI;
}

function newLink2(dis,msg,link,group) {
  if (currentItem.status==0) { currentItem.switchFolder(); }

  var subLI=_newLink(dis,msg,link,group);

  currentItem.list.appendChild(subLI);
  subLI.lead=currentItem;

  hideForm();
}

function newLink3(mode,dis,msg,link,group) {
  var subLI=_newLink(dis,msg,link,group);

  if (mode==0) {
    currentItem.lead.list.insertBefore(subLI,currentItem);
  }
  else {
    if (currentItem.role=="sub") {
      currentItem.lead.list.insertBefore(subLI,currentItem.nextSibling.nextSibling);
    }
    else {
      currentItem.lead.list.insertBefore(subLI,currentItem.nextSibling);
    }
  }
  subLI.lead=currentItem.lead;

  hideForm();
}

function _newCommand(dis,msg,code,group) {
  var subLI=yx_createEle("LI");
  subLI.innerHTML='<span class="item">&nbsp;'+dis+'&nbsp;</span>';

  subLI.dis=dis;
  subLI.msg=msg;
  subLI.code=code.replace(/"/g, "'");
  subLI.group=group;
  subLI.role="command";

  subLI.type="square";

  subLI.style.cursor=ptr;
  subLI.onclick=clickItem;

  return subLI;
}

function newCommand2(dis,msg,code,group) {
  if (currentItem.status==0) { currentItem.switchFolder(); }

  var subLI=_newCommand(dis,msg,code,group);

  currentItem.list.appendChild(subLI);
  subLI.lead=currentItem;

  hideForm();
}

function newCommand3(m,dis,msg,code,group) {
  var subLI=_newCommand(dis,msg,code,group);

  if (m==0) {
    currentItem.lead.list.insertBefore(subLI,currentItem);
  }
  else {
    if (currentItem.role=="sub") {
      currentItem.lead.list.insertBefore(subLI,currentItem.nextSibling.nextSibling);
    }
    else {
      currentItem.lead.list.insertBefore(subLI,currentItem.nextSibling);
    }
  }
  subLI.lead=currentItem.lead;

  hideForm();
}

function _newInfo(dis,group) {
  var subLI=yx_createEle("LI");
  subLI.innerHTML='<span class="item">&nbsp;'+dis+'&nbsp;</span>';

  subLI.dis=dis.replace(/"/g, "'");
  subLI.group=group;
  subLI.role="info";

  subLI.type="square";

  subLI.style.cursor=ptr;
  subLI.onclick=clickItem;

  return subLI;
}

function newInfo2(dis,group) {
  if (currentItem.status==0) { currentItem.switchFolder(); }

  var subLI=_newInfo(dis,group);

  currentItem.list.appendChild(subLI);
  subLI.lead=currentItem;

  hideForm();
}

function newInfo3(mode,dis,group) {
  var subLI=_newInfo(dis,group);

  if (mode==0) {
    currentItem.lead.list.insertBefore(subLI,currentItem);
  }
  else {
    if (currentItem.role=="sub") {
      currentItem.lead.list.insertBefore(subLI,currentItem.nextSibling.nextSibling);
    }
    else {
      currentItem.lead.list.insertBefore(subLI,currentItem.nextSibling);
    }
  }
  subLI.lead=currentItem.lead;

  hideForm();
}

function _newSep() {
  var subLI=yx_createEle("LI");
  subLI.innerHTML='<span class="item">&nbsp;------------&nbsp;</span>';

  subLI.role="separator";

  subLI.type="square";

  subLI.style.cursor=ptr;
  subLI.onclick=clickItem;

  return subLI;
}

function newSep2() {
  if (currentItem.status==0) { currentItem.switchFolder(); }

  var subLI=_newSep();

  currentItem.list.appendChild(subLI);
  subLI.lead=currentItem;

  hideForm();
}

function newSep3(mode) {
  var subLI=_newSep();

  if (mode==0) {
    currentItem.lead.list.insertBefore(subLI,currentItem);
  }
  else {
    if (currentItem.role=="sub") {
      currentItem.lead.list.insertBefore(subLI,currentItem.nextSibling.nextSibling);
    }
    else {
      currentItem.lead.list.insertBefore(subLI,currentItem.nextSibling);
    }
  }
  subLI.lead=currentItem.lead;

  hideForm();
}

function delMenu() {
  contentList.removeChild(currentItem.list);
  contentList.removeChild(currentItem);
  currentItem=null;

  hideForm();
}

function delSub() {
  currentItem.lead.list.removeChild(currentItem.list);
  currentItem.lead.list.removeChild(currentItem);
  currentItem=null;

  hideForm();
}

function delItem() {
  currentItem.lead.list.removeChild(currentItem);
  currentItem=null;

  hideForm();
}; delLink=delItem; delCommand=delItem; delInfo=delItem; delSep=delItem;

function updateMenu(name, sub) {
  currentItem.innerHTML='<span class="item">&nbsp;'+name+'&nbsp;</span>';
  highlightItem();

  currentItem.menu=name;
  currentItem.iden=sub;

  hideForm();
}

function updateSub(dis,msg,link,sub,group) {
  currentItem.innerHTML='<span class="item">&nbsp;'+dis+'&nbsp;</span>';
  highlightItem();

  currentItem.iden=sub;
  currentItem.dis=dis;
  currentItem.msg=msg;
  currentItem.link=link;
  currentItem.group=group;

  hideForm();
}

function updateLink(dis,msg,link,group) {
  currentItem.innerHTML='<span class="item">&nbsp;'+dis+'&nbsp;</span>';
  highlightItem();

  currentItem.dis=dis;
  currentItem.msg=msg;
  currentItem.link=link;
  currentItem.group=group;

  hideForm();
}

function updateCommand(dis,msg,code,group) {
  currentItem.innerHTML='<span class="item">&nbsp;'+dis+'&nbsp;</span>';
  highlightItem();

  currentItem.dis=dis;
  currentItem.msg=msg;
  currentItem.code=code.replace(/"/g, "'");
  currentItem.group=group;

  hideForm();
}

function updateInfo(dis,group) {
  currentItem.innerHTML='<span class="item">&nbsp;'+dis+'&nbsp;</span>';
  highlightItem();

  currentItem.dis=dis.replace(/"/g, "'");
  currentItem.group=group;

  hideForm();
}

function parseMenu(item,id) {
  var content="";

  if (item.role=="top") {
    content+="addMenu(\""+id+item.menu+"\", \""+id+item.iden+"\");\n\n";
    if (item.list.hasChildNodes()) {
      content+=getContent(item.list,id);
    }
    content+="endMenu();\n";
  }
  else if (item.role=="sub") {
    content+="addSubMenu(\""+id+item.lead.iden+"\", \""+item.dis+"\", \""+item.msg+"\", \""+item.link+"\", \""+id+item.iden+"\", \""+id+item.group+"\");\n\n";
    if (item.list.hasChildNodes()) {
      content+=getContent(item.list,id);
    }
  }
  else if (item.role=="link") {
    content+="addLink(\""+id+item.lead.iden+"\", \""+item.dis+"\", \""+item.msg+"\", \""+item.link+"\", \""+id+item.group+"\");\n";
  }
  else if (item.role=="command") {
    content+="addCommand(\""+id+item.lead.iden+"\", \""+item.dis+"\", \""+item.msg+"\", \""+item.code+"\", \""+id+item.group+"\");\n";
  }
  else if (item.role=="info") {
    content+="addInfo(\""+id+item.lead.iden+"\", \""+item.dis+"\", \""+id+item.group+"\");\n";
  }
  else if (item.role=="separator") {
    content+="addSeparator(\""+id+item.lead.iden+"\");\n";
  }

  return content;
}

function getContent(sub,id) {
  var subContent="", item=sub.firstChild;

  while (item!=null) {
    //if (item.role!="list" && item.role!="separator") {
    //  item.dis.replace(/&/g, "&#38;");
    //  item.dis.replace(/</g, "&#38lt;");
    //  item.dis.replace(/>/g, "&#38gt;");
    //}

    if (item.role=="sub") {
      subContent+="addSubMenu(\""+id+sub.lead.iden+"\", \""+item.dis+"\", \""+item.msg+"\", \""+item.link+"\", \""+id+item.iden+"\", \""+id+item.group+"\");\n";
    }
    else if (item.role=="link") {
      subContent+="addLink(\""+id+sub.lead.iden+"\", \""+item.dis+"\", \""+item.msg+"\", \""+item.link+"\", \""+id+item.group+"\");\n";
    }
    else if (item.role=="command") {
      subContent+="addCommand(\""+id+sub.lead.iden+"\", \""+item.dis+"\", \""+item.msg+"\", \""+item.code+"\", \""+id+item.group+"\");\n";
    }
    else if (item.role=="info") {
      subContent+="addInfo(\""+id+sub.lead.iden+"\", \""+item.dis+"\", \""+id+item.group+"\");\n";
    }
    else if (item.role=="separator") {
      subContent+="addSeparator(\""+id+sub.lead.iden+"\");\n";
    }

    item=item.nextSibling;
  }

  subContent+="\n";

  item=sub.firstChild;
  while (item!=null) {
    if (item.role=="sub") {
      subContent+=getContent(item.list,id);
    }

    item=item.nextSibling;
  }

  return subContent;
}

function showContent() {
  var boxOpen="<form><textarea name=\"content\" class=\"list\" cols=\"100\" rows=\"25\" wrap=\"off\">";
  var boxEnd="</textarea><br>\n<input type=\"button\" class=\"submit\" value=\"  Close  \" onclick=\"hideForm()\">&nbsp;<input type=\"button\" class=\"submit\" value=\"  Select  \" onclick=\"this.form.content.select()\"></form>\n";

  if (currentItem==null) {
    menuAlert();
    return;
  }

  var content=parseMenu(currentItem,"");
  if (content!="") {
    formHolder.innerHTML=boxOpen+content+boxEnd;
    showLayer(formHolder);
  }
}

function findSub(sub) {
  for (var i=0; i<subPool.length; i++) {
    if (subPool[i][0]==sub) {
      return subPool[i][1];
    }
  }

  return null;
}

function _addMenu(c_name,m_name) {
  _newMenu(c_name,m_name);
  subPool[subPool.length]=new Array(m_name, currentItem);
}

function _addSubMenu(m_name,i_dis,i_msg,i_link,sm_name,i_group) {
  if (currentItem.iden!=m_name) {
    currentItem=findSub(m_name);
    if (currentItem==null) {
      return false;
    }
  }

  if (currentItem.status==0) { currentItem.switchFolder(); }

  var subLI=_newSub(i_dis,i_msg,i_link,sm_name,i_group);
  currentItem.list.appendChild(subLI);

  var subUL=yx_createEle("UL");
  currentItem.list.appendChild(subUL);

  subLI.lead=currentItem;
  subLI.list=subUL;
  subUL.lead=subLI;
  subUL.role="list";

  subPool[subPool.length]=new Array(sm_name, subLI);

  return true;
}; _addSubMenuX=_addSubMenu;

function _addLink(m_name,i_dis,i_msg,i_link,i_group) {
  if (currentItem.iden!=m_name) {
    currentItem=findSub(m_name);
    if (currentItem==null) {
      return false;
    }
  }

  if (currentItem.status==0) { currentItem.switchFolder(); }

  var subLI=_newLink(i_dis,i_msg,i_link,i_group);

  currentItem.list.appendChild(subLI);
  subLI.lead=currentItem;

  return true;
}; _addLinkX=_addLink;

function _addCommand(m_name,i_dis,i_msg,i_code,i_group) {
  if (currentItem.iden!=m_name) {
    currentItem=findSub(m_name);
    if (currentItem==null) {
      return false;
    }
  }

  if (currentItem.status==0) { currentItem.switchFolder(); }

  var subLI=_newCommand(i_dis,i_msg,i_code,i_group);

  currentItem.list.appendChild(subLI);
  subLI.lead=currentItem;

  return true;
}; _addCommandX=_addCommand;

function _addInfo(m_name,i_dis,i_group) {
  if (currentItem.iden!=m_name) {
    currentItem=findSub(m_name);
    if (currentItem==null) {
      return false;
    }
  }

  if (currentItem.status==0) { currentItem.switchFolder(); }

  var subLI=_newInfo(i_dis,i_group);

  currentItem.list.appendChild(subLI);
  subLI.lead=currentItem;

  return true;
}

function _addSeparator(m_name) {
  if (currentItem.iden!=m_name) {
    currentItem=findSub(m_name);
    if (currentItem==null) {
      return false;
    }
  }

  if (currentItem.status==0) { currentItem.switchFolder(); }

  var subLI=_newSep();

  currentItem.list.appendChild(subLI);
  subLI.lead=currentItem;

  return true;
}

function loadMenu(content) {
  var lines=content.split(/[\n\r]+/);
  var goodContent=true;

  subPool=[];

  for (var i=0; i<lines.length; i++) {
    if (lines[i].search(/addMenu/)!=-1) {
      eval("_"+lines[i]);
    }
    else if (lines[i].search(/^\s*(addSubMenu|addSubMenuX|addLink|addLinkX|addCommand|addCommandX|addInfo|addSeparator)/)!=-1) {
      goodContent=eval("_"+lines[i]);
      if (!goodContent) {
        alert("Top-Menu or Sub-Menu not defined:\n\n"+lines[i]);
        break;
      }
    }
  }

  if (currentItem!=null) {
    blurItem();
  }
  currentItem=null;
  hideForm();
}

function loadContent() {
  formHolder.innerHTML="<form><textarea name=\"content\" class=\"list\" cols=\"100\" rows=\"25\" wrap=\"off\">// Paste your menu content here\n</textarea><br>\n<input type=\"button\" class=\"submit\" value=\"  Load  \" onclick=\"loadMenu(this.form.content.value)\">&nbsp;<input type=\"button\" class=\"submit\" value=\"  Cancel  \" onclick=\"hideForm()\"></form>\n";
  showLayer(formHolder);
}

function itemUp() {
  var pn=prepNode(currentItem), list=currentItem.lead.list;
  list.insertBefore(list.removeChild(currentItem),pn);
  if (currentItem.role=="sub") {
    list.insertBefore(list.removeChild(currentItem.list),pn);
  }

  showItem();
}

function itemDown() {
  var nn=nextNode(nextNode(currentItem)), list=currentItem.lead.list;
  list.insertBefore(list.removeChild(currentItem),nn);
  if (currentItem.role=="sub") {
    list.insertBefore(list.removeChild(currentItem.list),nn);
  }

  showItem();
}

function trimStr(str) {
  str.replace(/^\s+/, '');
  str.replace(/\s+$/, '');

  return str;
}

function loadPlain(content) {
  var lines=content.split(/[\n\r]+/);
  var goodContent=true;
}

function newPlain() {
  formHolder.innerHTML="<form><textarea name=\"content\" class=\"list\" cols=\"100\" rows=\"25\" wrap=\"off\"># Input your plain content here with the following syntax\n\n# leading # indicates a comment line\n# leading space, ending space and space not inside a [] will be ignored\n# use [] to specify an empty value\n# [menu-name], [top-menu-name], [sub-menu-name] and [display-text] are required\n\n# m:[menu-name], [top-menu-name] ... addMenu()\n#   l:[display-text], [message], [url], [id] ... addLink()\n#   c:[display-text], [message], [code], [id] ... addCommand()\n#   - ... addSeparator()\n#   s:[sub-menu-name], [display-text], [message], [url], [id] ... addSubMenu()\n#     l:[display-text], [message], [url], [id]\n#     l:[display-text], [message], [url], [id]\n#   end\n# end\n</textarea><br>\n<input type=\"button\" class=\"submit\" value=\"  Load  \" onclick=\"loadPlain(this.form.content.value)\">&nbsp;<input type=\"button\" class=\"submit\" value=\"  Cancel  \" onclick=\"hideForm()\"></form>\n";
  showLayer(formHolder);
}

// styles
function getOption(list) {
  return (list.options.length>0 && list.selectedIndex!=-1)?list.options[list.selectedIndex].text:"";
}

function delStyle() {
  currentStyle.lead.list.removeChild(currentStyle);
  currentStyle=null;

  hideForm();
}

function delSPad() {
  delStyle();
  if (--padCount==0) {
    padFolder.style.display="none";
    padList.style.display="none";
  }
}

function delSItem() {
  delStyle();
  if (--itemCount==0) {
    itemFolder.style.display="none";
    itemList.style.display="none";
  }
}

function delSFont() {
  delStyle();
  if (--fontCount==0) {
    fontFolder.style.display="none";
    fontList.style.display="none";
  }
}

function delSTag() {
  delStyle();
  if (--tagCount==0) {
    tagFolder.style.display="none";
    tagList.style.display="none";
  }
}

function delSeparator() {
  delStyle();
  if (--sepCount==0) {
    sepFolder.style.display="none";
    sepList.style.display="none";
  }
}

function delStyleMenu() {
  delStyle();
  if (--menuCount==0) {
    menuFolder.style.display="none";
    menuList.style.display="none";
  }
}

function delStyleGroup() {
  delStyle();
  if (--groupCount==0) {
    groupFolder.style.display="none";
    groupList.style.display="none";
  }
}

function showStyle() {
  if (currentStyle!=null) {
    if (currentStyle.role=="group") {
      newGroup3();
    }
    if (currentStyle.role=="menu") {
      formHolder.innerHTML=styleForm2();
      showLayer(formHolder);
    }
    else if (currentStyle.role=="pad") {
      formHolder.innerHTML=padForm2();
      showLayer(formHolder);
    }
    else if (currentStyle.role=="item") {
      formHolder.innerHTML=itemForm2();
      showLayer(formHolder);
    }
    else if (currentStyle.role=="font") {
      formHolder.innerHTML=fontForm2();
      showLayer(formHolder);
    }
    else if (currentStyle.role=="tag") {
      formHolder.innerHTML=tagForm2();
      showLayer(formHolder);
    }
    else if (currentStyle.role=="separator") {
      formHolder.innerHTML=separatorForm2();
      showLayer(formHolder);
    }
  }
}

function blurStyle() {
  currentStyle.childNodes[0].style.borderColor="#ffffff";
}

function highlightStyle() {
  currentStyle.childNodes[0].style.borderColor="#000000";
}

function clickStyle() {
  if (currentStyle!=this) {
    if (currentStyle!=null) {
      blurStyle();
    }

    currentStyle=this;
    highlightStyle();
  }

  showStyle();
}

function optionList(list,option) {
  var found=0, opts="", sels=[];

  for (var i=0; i<list.length; i++) {
    sels[i]="";
    if (list[i]==option) {
      found=i;
    }
  }
  sels[found]=" selected";

  for (var i=0; i<list.length; i++) {
    opts+="<option"+sels[i]+">"+list[i]+"</option>";
  }

  return opts;
}

function dirList(dir) {
  return optionList(["right-down", "right-up", "left-down", "left-up", "center-down", "center-up", "abs-right-down", "abs-right-up", "abs-left-down", "abs-left-up", "right-top", "left-top", "right-middle", "left-middle", "right-bottom", "left-bottom"],dir);
}

function bsList(bs) {
  return optionList(["outset", "inset", "solid"],bs);
}

function bsList2(bs) {
  return optionList(["n/a", "outset", "inset", "solid"],bs);
}

function visList(vl) {
  return optionList(["visible", "hidden"],vl);
}

function pbList(pb) {
  return optionList(["pad", "bar"],pb);
}

function ynList(yn) {
  return optionList(["yes", "no"],yn);
}

function padForm() {
  return tableOpen+formTitle('Pad Style')+'<tr><td align="right"><nobr>&nbsp;name:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;visibility:&nbsp;</td><td><select class="text">'+visList('')+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;border-size:&nbsp;</td><td><input class="text" type="text" value="0">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;border-style:&nbsp;</td><td><select class="text">'+bsList('')+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;border-color:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[4],'+"'border-color'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;border-sides:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;<input class="click" type="button" value="?" onclick="showHelp(0,0,0)"></td></tr><tr><td align="right"><nobr>&nbsp;padding:&nbsp;</td><td><input class="text" type="text" value="0">&nbsp;<input class="click" type="button" value="?" onclick="showHelp(1,1,1)"></td></tr><tr><td align="right"><nobr>&nbsp;background-color:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[10],'+"'background-color'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;menu-form:&nbsp;</td><td><select class="text">'+pbList('')+'</select>&nbsp;<input class="click" type="button" value="?" onclick="showHelp(2,2,2)"></td></tr><tr><td align="right"><nobr>&nbsp;direction:&nbsp;</td><td><select class="text">'+dirList('')+'</select>&nbsp;<input class="click" type="button" value="?" onclick="showHelp(3,6,3)"></td></tr><tr><td align="right"><nobr>&nbsp;scroll:&nbsp;</td><td><select class="text">'+ynList('no')+'</select>&nbsp;<input class="click" type="button" value="?" onclick="showHelp(7,7,7)"></td></tr><tr><td align="right"><nobr>&nbsp;offset-top:&nbsp;</td><td><input class="text" type="text" value="0">&nbsp;<input class="click" type="button" value="?" onclick="showHelp(8,8,8)"></td></tr><tr><td align="right"><nobr>&nbsp;offset-left:&nbsp;</td><td><input class="text" type="text" value="0">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;item-offset:&nbsp;</td><td><input class="text" type="text" value="0">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;opacity:&nbsp;</td><td><input class="text" type="text" value="100">&nbsp;<input class="click" type="button" value="?" onclick="showHelp(9,9,9)"></td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Add  " onclick="newPad2(this.form.elements[0].value,getOption(this.form.elements[1]),this.form.elements[2].value,getOption(this.form.elements[3]),this.form.elements[4].value,this.form.elements[6].value,this.form.elements[8].value,this.form.elements[10].value,getOption(this.form.elements[12]),getOption(this.form.elements[14]),getOption(this.form.elements[16]),this.form.elements[18].value,this.form.elements[20].value,this.form.elements[21].value,this.form.elements[22].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function padForm2() {
  return tableOpen+formTitleS('Pad Style')+'<tr><td align="right"><nobr>&nbsp;name:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sname+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;visibility:&nbsp;</td><td><select class="text">'+visList(currentStyle.svis)+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;border-size:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sbsize+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;border-style:&nbsp;</td><td><select class="text">'+bsList(currentStyle.sbstyle)+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;border-color:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sbcolor+'">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[4],'+"'border-color'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;border-sides:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sbsides+'">&nbsp;<input class="click" type="button" value="?" onclick="showHelp(0,0,0)"></td></tr><tr><td align="right"><nobr>&nbsp;padding:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.spadding+'">&nbsp;<input class="click" type="button" value="?" onclick="showHelp(1,1,1)"></td></tr><tr><td align="right"><nobr>&nbsp;background-color:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sbgcolor+'">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[10],'+"'background-color'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;menu-form:&nbsp;</td><td><select class="text">'+pbList(currentStyle.smenuform)+'</select>&nbsp;<input class="click" type="button" value="?" onclick="showHelp(2,2,2)"></td></tr><tr><td align="right"><nobr>&nbsp;direction:&nbsp;</td><td><select class="text">'+dirList(currentStyle.sdir)+'</select>&nbsp;<input class="click" type="button" value="?" onclick="showHelp(3,6,3)"></td></tr><tr><td align="right"><nobr>&nbsp;scroll:&nbsp;</td><td><select class="text">'+ynList(currentStyle.sscroll)+'</select>&nbsp;<input class="click" type="button" value="?" onclick="showHelp(7,7,7)"></td></tr><tr><td align="right"><nobr>&nbsp;offset-top:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sdy+'">&nbsp;<input class="click" type="button" value="?" onclick="showHelp(8,8,8)"></td></tr><tr><td align="right"><nobr>&nbsp;offset-left:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sdx+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;item-offset:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sdis+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;opacity:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sopacity+'">&nbsp;<input class="click" type="button" value="?" onclick="showHelp(9,9,9)"></td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Change  " onclick="updatePad(this.form.elements[0].value,getOption(this.form.elements[1]),this.form.elements[2].value,getOption(this.form.elements[3]),this.form.elements[4].value,this.form.elements[6].value,this.form.elements[8].value,this.form.elements[10].value,getOption(this.form.elements[12]),getOption(this.form.elements[14]),getOption(this.form.elements[16]),this.form.elements[18].value,this.form.elements[20].value,this.form.elements[21].value,this.form.elements[22].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Delete  " onclick="delSPad()">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function newPad() {
  formHolder.innerHTML=padForm();
  showLayer(formHolder);
}

function newPad2(name, vis, bsize, bstyle, bcolor, bsides, padding, bgcolor, menuform, dir, scroll, dy, dx, dis, opacity) {
  var bc="", bs="", bg="";

  if (nullRE.test(name)) {
    nameAlert();
    return;
  }
  if (!numRE.test(bsize)) {
    numAlert("border size");
    return;
  }
  if (!padRE.test(padding)) {
    numAlert("padding");
    return;
  }
  if (!numRE.test(opacity)) {
    numAlert("opacity");
    return;
  }
  if (!numRE2.test(dx)) {
    numAlert("offset left");
    return;
  }
  if (!numRE2.test(dy)) {
    numAlert("offset top");
    return;
  }
  if (bcolor!="" && !colorRE2.test(bcolor)) {
    colorAlert("border color");
    return;
  }
  else {
    bc=bcolor==""?"":RegExp.$1;
  }
  if (bsides!="" && !sidesRE.test(bsides)) {
    sidesAlert("border sides");
    return;
  }
  else {
    bs=bsides==""?"":(RegExp.$1+" "+RegExp.$2+" "+RegExp.$3+" "+RegExp.$4);
  }
  if (bgcolor!="" && !colorRE.test(bgcolor)) {
    colorAlert("background color");
    return;
  }
  else {
    bg=bgcolor==""?"":RegExp.$1;
  }

  var tagLI=yx_createEle("LI");
  tagLI.innerHTML='<span class="item">&nbsp;'+name+'&nbsp;</span>';

  tagLI.role="pad";
  tagLI.sname=name;
  tagLI.svis=vis;
  tagLI.sbsize=bsize;
  tagLI.sbstyle=bstyle;
  tagLI.sbcolor=bc;
  tagLI.sbsides=bs;
  tagLI.spadding=padding;
  tagLI.sbgcolor=bg;
  tagLI.smenuform=menuform;
  tagLI.sdir=dir;
  tagLI.sscroll=scroll;
  tagLI.sdx=dx;
  tagLI.sdy=dy;
  tagLI.sdis=dis;
  tagLI.sopacity=opacity;
  
  tagLI.type="square";

  tagLI.style.cursor=ptr;
  tagLI.onclick=clickStyle;
  tagLI.lead=padFolder;

  padList.appendChild(tagLI);
  padCount++;

  if (padFolder.style.display=="none") {
    padFolder.style.display="";
    padList.style.display="";
  }

  hideForm();
}

function updatePad(name, vis, bsize, bstyle, bcolor, bsides, padding, bgcolor, menuform, dir, scroll, dy, dx, dis, opacity) {
  var bc="", bs="", bg="";

  if (nullRE.test(name)) {
    nameAlert();
    return;
  }
  if (!numRE.test(bsize)) {
    numAlert("border size");
    return;
  }
  if (!padRE.test(padding)) {
    numAlert("padding");
    return;
  }
  if (!numRE.test(opacity)) {
    numAlert("opacity");
    return;
  }
  if (!numRE2.test(dx)) {
    numAlert("offset left");
    return;
  }
  if (!numRE2.test(dy)) {
    numAlert("offset top");
    return;
  }
  if (bcolor!="" && !colorRE2.test(bcolor)) {
    colorAlert("border color");
    return;
  }
  else {
    bc=bcolor==""?"":RegExp.$1;
  }
  if (bsides!="" && !sidesRE.test(bsides)) {
    sidesAlert("border sides");
    return;
  }
  else {
    bs=bsides==""?"":(RegExp.$1+" "+RegExp.$2+" "+RegExp.$3+" "+RegExp.$4);
  }
  if (bgcolor!="" && !colorRE.test(bgcolor)) {
    colorAlert("background color");
    return;
  }
  else {
    bg=bgcolor==""?"":RegExp.$1;
  }

  currentStyle.innerHTML='<span class="item">&nbsp;'+name+'&nbsp;</span>';
  highlightStyle();

  currentStyle.sname=name;
  currentStyle.svis=vis;
  currentStyle.sbsize=bsize;
  currentStyle.sbstyle=bstyle;
  currentStyle.sbcolor=bc;
  currentStyle.sbsides=bs;
  currentStyle.spadding=padding;
  currentStyle.sbgcolor=bg;
  currentStyle.smenuform=menuform;
  currentStyle.sdir=dir;
  currentStyle.sscroll=scroll;
  currentStyle.sdx=dx;
  currentStyle.sdy=dy;
  currentStyle.sdis=dis;
  currentStyle.sopacity=opacity;
  
  hideForm();
}

function ocList(oc) {
  return optionList(["mouse-over", "mouse-click"],oc);
}

function itemForm() {
  return tableOpen+formTitle('Item Style')+'<tr><td align="right"><nobr>&nbsp;name:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;width:&nbsp;</td><td><input class="text" type="text" value="0">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;height:&nbsp;</td><td><input class="text" type="text" value="0">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;border-size:&nbsp;</td><td><input class="text" type="text" value="0">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;border-style:&nbsp;</td><td><select class="text">'+bsList('')+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;(highlight):&nbsp;</td><td><select class="text">'+bsList('')+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;(mouse-down):&nbsp;</td><td><select class="text">'+bsList2('')+'</select>&nbsp;<input class="click" type="button" value="?" onclick="showHelp(10,10,10)"></td></tr><tr><td align="right"><nobr>&nbsp;border-color:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[8],'+"'border-color normal'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;(highlight):&nbsp;</td><td><input class="text" type="text" value="">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[10],'+"'border-color highlighted'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;(mouse-down):&nbsp;</td><td><input class="text" type="text" value="">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[12],'+"'border-color mouse-down'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;border-sides:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;<input class="click" type="button" value="?" onclick="showHelp(11,11,11)"></td></tr><tr><td align="right"><nobr>&nbsp;(highlight):&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;(mouse-down):&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;padding:&nbsp;</td><td><input class="text" type="text" value="0">&nbsp;<input class="click" type="button" value="?" onclick="showHelp(12,12,12)"></td></tr><tr><td align="right"><nobr>&nbsp;background-color:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[20],'+"'background-color normal'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;(highlight):&nbsp;</td><td><input class="text" type="text" value="">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[22],'+"'background-color highlighted'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;(mouse-down):&nbsp;</td><td><input class="text" type="text" value="">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[24],'+"'background-color mouse-down'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;sub-menu:&nbsp;</td><td><select class="text">'+ocList('')+'</select>&nbsp;<input class="click" type="button" value="?" onclick="showHelp(13,13,13)"></td></tr><tr><td align="right"><nobr>&nbsp;opacity:&nbsp;</td><td><input class="text" type="text" value="100">&nbsp;<input class="click" type="button" value="?" onclick="showHelp(14,14,14)"></td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Add  " onclick="newItem2(this.form.elements[0].value,this.form.elements[1].value,this.form.elements[2].value,this.form.elements[3].value,getOption(this.form.elements[4]),getOption(this.form.elements[5]),getOption(this.form.elements[6]),this.form.elements[8].value,this.form.elements[10].value,this.form.elements[12].value,this.form.elements[14].value,this.form.elements[16].value,this.form.elements[17].value,this.form.elements[18].value,this.form.elements[20].value,this.form.elements[22].value,this.form.elements[24].value,getOption(this.form.elements[26]),this.form.elements[28].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function itemForm2() {
  return tableOpen+formTitleS('Item Style')+'<tr><td align="right"><nobr>&nbsp;name:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sname+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;width:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.swidth+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;height:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sheight+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;border-size:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sbsize+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;border-style:&nbsp;</td><td><select class="text">'+bsList(currentStyle.sbstylen)+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;(highlight):&nbsp;</td><td><select class="text">'+bsList(currentStyle.sbstyleh)+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;(mouse-down):&nbsp;</td><td><select class="text">'+bsList2(currentStyle.sbstylec)+'</select>&nbsp;<input class="click" type="button" value="?" onclick="showHelp(10,10,10)"></td></tr><tr><td align="right"><nobr>&nbsp;border-color:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sbcolorn+'">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[8],'+"'border-color normal'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;(highlight):&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sbcolorh+'">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[10],'+"'border-color highlighted'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;(mouse-down):&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sbcolorc+'">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[12],'+"'border-color mouse-down'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;border-sides:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sbsidesn+'">&nbsp;<input class="click" type="button" value="?" onclick="showHelp(11,11,11)"></td></tr><tr><td align="right"><nobr>&nbsp;(highlight):&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sbsidesh+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;(mouse-down):&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sbsidesc+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;padding:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.spadding+'">&nbsp;<input class="click" type="button" value="?" onclick="showHelp(12,12,12)"></td></tr><tr><td align="right"><nobr>&nbsp;background-color:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sbgcolorn+'">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[20],'+"'background-color normal'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;(highlight):&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sbgcolorh+'">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[22],'+"'background-color highlighted'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;(mouse-down):&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sbgcolorc+'">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[24],'+"'background-color mouse-down'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;sub-menu:&nbsp;</td><td><select class="text">'+ocList(currentStyle.ssubmenu)+'</select>&nbsp;<input class="click" type="button" value="?" onclick="showHelp(13,13,13)"></td></tr><tr><td align="right"><nobr>&nbsp;opacity:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sopacity+'">&nbsp;<input class="click" type="button" value="?" onclick="showHelp(14,14,14)"></td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Change  " onclick="updateItem(this.form.elements[0].value,this.form.elements[1].value,this.form.elements[2].value,this.form.elements[3].value,getOption(this.form.elements[4]),getOption(this.form.elements[5]),getOption(this.form.elements[6]),this.form.elements[8].value,this.form.elements[10].value,this.form.elements[12].value,this.form.elements[14].value,this.form.elements[16].value,this.form.elements[17].value,this.form.elements[18].value,this.form.elements[20].value,this.form.elements[22].value,this.form.elements[24].value,getOption(this.form.elements[26]),this.form.elements[28].value)">&nbsp;&nbsp;<input class="submit" type="button" value="  Delete  " onclick="delSItem()">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function newItem() {
  formHolder.innerHTML=itemForm();
  showLayer(formHolder);
}

function newItem2(name, width, height, bsize, bstylen, bstyleh, bstylec, bcolorn, bcolorh, bcolorc, bsidesn, bsidesh, bsidesc, padding, bgcolorn, bgcolorh, bgcolorc, submenu, opacity) {
  var bcn="", bch="", bcc="", bgn="", bgh="", bgc="", bsn="", bsh="", bsc="";

  if (nullRE.test(name)) {
    nameAlert();
    return;
  }
  if (!numRE.test(width)) {
    numAlert("item width");
    return;
  }
  if (!numRE.test(height)) {
    numAlert("item height");
    return;
  }
  if (!numRE.test(bsize)) {
    numAlert("border size");
    return;
  }
  if (!padRE.test(padding)) {
    numAlert("padding");
    return;
  }
  if (!numRE.test(opacity)) {
    numAlert("opacity");
    return;
  }
  if (bcolorn!="" && !colorRE2.test(bcolorn)) {
    colorAlert("border color normal");
    return;
  }
  else {
    bcn=bcolorn==""?"":RegExp.$1;
  }
  if (bcolorh!="" && !colorRE2.test(bcolorh)) {
    colorAlert("border color highlight");
    return;
  }
  else {
    bch=bcolorh==""?"":RegExp.$1;
  }
  if (bcolorc!="" && !colorRE2.test(bcolorc)) {
    colorAlert("border color mouse-down");
    return;
  }
  else {
    bcc=bcolorc==""?"":RegExp.$1;
  }
  if (bgcolorn!="" && !colorRE.test(bgcolorn)) {
    colorAlert("background color normal");
    return;
  }
  else {
    bgn=bgcolorn==""?"":RegExp.$1;
  }
  if (bgcolorh!="" && !colorRE.test(bgcolorh)) {
    colorAlert("background color highlight");
    return;
  }
  else {
    bgh=bgcolorh==""?"":RegExp.$1;
  }
  if (bgcolorc!="" && !colorRE.test(bgcolorc)) {
    colorAlert("background color mouse-down");
    return;
  }
  else {
    bgc=bgcolorc==""?"":RegExp.$1;
  }
  if (bsidesn!="" && !sidesRE.test(bsidesn)) {
    sidesAlert("border sides normal");
    return;
  }
  else {
    bsn=bsidesn==""?"":(RegExp.$1+" "+RegExp.$2+" "+RegExp.$3+" "+RegExp.$4);
  }
  if (bsidesh!="" && !sidesRE.test(bsidesh)) {
    sidesAlert("border sides highlight");
    return;
  }
  else {
    bsh=bsidesh==""?"":(RegExp.$1+" "+RegExp.$2+" "+RegExp.$3+" "+RegExp.$4);
  }
  if (bsidesc!="" && !sidesRE.test(bsidesc)) {
    sidesAlert("border sides mouse-down");
    return;
  }
  else {
    bsc=bsidesc==""?"":(RegExp.$1+" "+RegExp.$2+" "+RegExp.$3+" "+RegExp.$4);
  }

  var tagLI=yx_createEle("LI");
  tagLI.innerHTML='<span class="item">&nbsp;'+name+'&nbsp;</span>';

  tagLI.role="item";
  tagLI.sname=name;
  tagLI.swidth=width;
  tagLI.sheight=height;
  tagLI.sbsize=bsize;
  tagLI.sbstylen=bstylen;
  tagLI.sbstyleh=bstyleh;
  tagLI.sbstylec=bstylec;
  tagLI.sbcolorn=bcn;
  tagLI.sbcolorh=bch;
  tagLI.sbcolorc=bcc;
  tagLI.sbsidesn=bsn;
  tagLI.sbsidesh=bsh;
  tagLI.sbsidesc=bsc;
  tagLI.spadding=padding;
  tagLI.sbgcolorn=bgn;
  tagLI.sbgcolorh=bgh;
  tagLI.sbgcolorc=bgc;
  tagLI.ssubmenu=submenu;
  tagLI.sopacity=opacity;
  
  tagLI.type="square";

  tagLI.style.cursor=ptr;
  tagLI.onclick=clickStyle;
  tagLI.lead=itemFolder;

  itemList.appendChild(tagLI);
  itemCount++;

  if (itemFolder.style.display=="none") {
    itemFolder.style.display="";
    itemList.style.display="";
  }

  hideForm();
}

function updateItem(name, width, height, bsize, bstylen, bstyleh, bstylec, bcolorn, bcolorh, bcolorc, bsidesn, bsidesh, bsidesc, padding, bgcolorn, bgcolorh, bgcolorc, submenu, opacity) {
  var bcn="", bch="", bcc="", bgn="", bgh="", bgc="", bsn="", bsh="", bsc="";

  if (nullRE.test(name)) {
    nameAlert();
    return;
  }
  if (!numRE.test(width)) {
    numAlert("item width");
    return;
  }
  if (!numRE.test(height)) {
    numAlert("item height");
    return;
  }
  if (!numRE.test(bsize)) {
    numAlert("border size");
    return;
  }
  if (!padRE.test(padding)) {
    numAlert("padding");
    return;
  }
  if (!numRE.test(opacity)) {
    numAlert("opacity");
    return;
  }
  if (bcolorn!="" && !colorRE2.test(bcolorn)) {
    colorAlert("border color normal");
    return;
  }
  else {
    bcn=bcolorn==""?"":RegExp.$1;
  }
  if (bcolorh!="" && !colorRE2.test(bcolorh)) {
    colorAlert("border color highlight");
    return;
  }
  else {
    bch=bcolorh==""?"":RegExp.$1;
  }
  if (bcolorc!="" && !colorRE2.test(bcolorc)) {
    colorAlert("border color mouse-down");
    return;
  }
  else {
    bcc=bcolorc==""?"":RegExp.$1;
  }
  if (bgcolorn!="" && !colorRE.test(bgcolorn)) {
    colorAlert("background color normal");
    return;
  }
  else {
    bgn=bgcolorn==""?"":RegExp.$1;
  }
  if (bgcolorh!="" && !colorRE.test(bgcolorh)) {
    colorAlert("background color highlight");
    return;
  }
  else {
    bgh=bgcolorh==""?"":RegExp.$1;
  }
  if (bgcolorc!="" && !colorRE.test(bgcolorc)) {
    colorAlert("background color mouse-down");
    return;
  }
  else {
    bgc=bgcolorc==""?"":RegExp.$1;
  }
  if (bsidesn!="" && !sidesRE.test(bsidesn)) {
    sidesAlert("border sides normal");
    return;
  }
  else {
    bsn=bsidesn==""?"":(RegExp.$1+" "+RegExp.$2+" "+RegExp.$3+" "+RegExp.$4);
  }
  if (bsidesh!="" && !sidesRE.test(bsidesh)) {
    sidesAlert("border sides highlight");
    return;
  }
  else {
    bsh=bsidesh==""?"":(RegExp.$1+" "+RegExp.$2+" "+RegExp.$3+" "+RegExp.$4);
  }
  if (bsidesc!="" && !sidesRE.test(bsidesc)) {
    sidesAlert("border sides mouse-down");
    return;
  }
  else {
    bsc=bsidesc==""?"":(RegExp.$1+" "+RegExp.$2+" "+RegExp.$3+" "+RegExp.$4);
  }

  currentStyle.innerHTML='<span class="item">&nbsp;'+name+'&nbsp;</span>';
  highlightStyle();

  currentStyle.sname=name;
  currentStyle.swidth=width;
  currentStyle.sheight=height;
  currentStyle.sbsize=bsize;
  currentStyle.sbstylen=bstylen;
  currentStyle.sbstyleh=bstyleh;
  currentStyle.sbstylec=bstylec;
  currentStyle.sbcolorn=bcn;
  currentStyle.sbcolorh=bch;
  currentStyle.sbcolorc=bcc;
  currentStyle.sbsidesn=bsn;
  currentStyle.sbsidesh=bsh;
  currentStyle.sbsidesc=bsc;
  currentStyle.spadding=padding;
  currentStyle.sbgcolorn=bgn;
  currentStyle.sbgcolorh=bgh;
  currentStyle.sbgcolorc=bgc;
  currentStyle.ssubmenu=submenu;
  currentStyle.sopacity=opacity;
  
  hideForm();
}

function taList(ta) {
  return optionList(["left", "center", "right"],ta);
}

function vaList(va) {
  return optionList(["top", "middle"],va);
}

function nbList(nb) {
  return optionList(["normal normal", "normal bold", "bold bold", "bold normal"],nb);
}

function niList(ni) {
  return optionList(["normal normal", "normal italic", "italic italic", "italic normal"],ni);
}

function tdList(td) {
  return optionList(["none none", "none underline", "underline underline", "underline none"],td);
}

function fontForm() {
  return tableOpen+formTitle('Font Style')+'<tr><td align="right"><nobr>&nbsp;name:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;font-family:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;<input class="click" type="button" value="?" onclick="showHelp(15,15,15)"></td></tr><tr><td align="right"><nobr>&nbsp;font-size:&nbsp;</td><td><input class="text" type="text" value="0">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;font-weight:&nbsp;</td><td><select class="text">'+nbList('')+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;font-style:&nbsp;</td><td><select class="text">'+niList('')+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;color:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[6],'+"'font-color normal'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;(highlight):&nbsp;</td><td><input class="text" type="text" value="">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[8],'+"'font-color highlighted'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;(mouse-down):&nbsp;</td><td><input class="text" type="text" value="">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[10],'+"'font-color mouse-down'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;text-align:&nbsp;</td><td><select class="text">'+taList('')+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;vertical-align:&nbsp;</td><td><select class="text">'+vaList('')+'</select>&nbsp;<input class="click" type="button" value="?" onclick="showHelp(16,16,16)"></td></tr><tr><td align="right"><nobr>&nbsp;text-decoration:&nbsp;</td><td><select class="text">'+tdList('')+'</select>&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Add  " onclick="newFont2(this.form.elements[0].value,this.form.elements[1].value,this.form.elements[3].value,getOption(this.form.elements[4]),getOption(this.form.elements[5]),this.form.elements[6].value,this.form.elements[8].value,this.form.elements[10].value,getOption(this.form.elements[12]),getOption(this.form.elements[13]),getOption(this.form.elements[15]))">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function fontForm2() {
  return tableOpen+formTitleS('Font Style')+'<tr><td align="right"><nobr>&nbsp;name:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sname+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;font-family:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sfont+'">&nbsp;<input class="click" type="button" value="?" onclick="showHelp(15,15,15)"></td></tr><tr><td align="right"><nobr>&nbsp;font-size:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.ssize+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;font-weight:&nbsp;</td><td><select class="text">'+nbList(currentStyle.sweight)+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;font-style:&nbsp;</td><td><select class="text">'+niList(currentStyle.sstyle)+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;color:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.scolorn+'">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[6],'+"'font-color normal'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;(highlight):&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.scolorh+'">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[8],'+"'font-color highlighted'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;(mouse-down):&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.scolorc+'">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[10],'+"'font-color mouse-down'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;text-align:&nbsp;</td><td><select class="text">'+taList(currentStyle.salign)+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;vertical-align:&nbsp;</td><td><select class="text">'+vaList(currentStyle.svalign)+'</select>&nbsp;<input class="click" type="button" value="?" onclick="showHelp(16,16,16)"></td></tr><tr><td align="right"><nobr>&nbsp;text-decoration:&nbsp;</td><td><select class="text">'+tdList(currentStyle.deco)+'</select>&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Change  " onclick="updateFont(this.form.elements[0].value,this.form.elements[1].value,this.form.elements[3].value,getOption(this.form.elements[4]),getOption(this.form.elements[5]),this.form.elements[6].value,this.form.elements[8].value,this.form.elements[10].value,getOption(this.form.elements[12]),getOption(this.form.elements[13]),getOption(this.form.elements[15]))">&nbsp;&nbsp;<input class="submit" type="button" value="  Delete  " onclick="delSFont()">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function newFont() {
  formHolder.innerHTML=fontForm();
  showLayer(formHolder);
}

function newFont2(name, font, size, weight, style, colorn, colorh, colorc, align, valign, deco) {
  var cn="", ch="", cc="";

  if (nullRE.test(name)) {
    nameAlert();
    return;
  }
  if (size!="" && !numRE.test(size)) {
    numAlert("font size");
    return;
  }
  if (colorn!="" && !colorRE.test(colorn)) {
    colorAlert("font color normal");
    return;
  }
  else {
    cn=colorn==""?"":RegExp.$1;
  }
  if (colorh!="" && !colorRE.test(colorh)) {
    colorAlert("font color highlight");
    return;
  }
  else {
    ch=colorh==""?"":RegExp.$1;
  }
  if (colorc!="" && !colorRE.test(colorc)) {
    colorAlert("font color mouse-down");
    return;
  }
  else {
    cc=colorc==""?"":RegExp.$1;
  }

  var tagLI=yx_createEle("LI");
  tagLI.innerHTML='<span class="item">&nbsp;'+name+'&nbsp;</span>';

  tagLI.role="font";
  tagLI.sname=name;
  tagLI.sfont=font;
  tagLI.ssize=size;
  tagLI.sweight=weight;
  tagLI.sstyle=style;
  tagLI.scolorn=cn;
  tagLI.scolorh=ch;
  tagLI.scolorc=cc;
  tagLI.salign=align;
  tagLI.svalign=valign;
  tagLI.deco=deco;

  tagLI.type="square";

  tagLI.style.cursor=ptr;
  tagLI.onclick=clickStyle;
  tagLI.lead=fontFolder;

  fontList.appendChild(tagLI);
  fontCount++;

  if (fontFolder.style.display=="none") {
    fontFolder.style.display="";
    fontList.style.display="";
  }

  hideForm();
}

function updateFont(name, font, size, weight, style, colorn, colorh, colorc, align, valign, deco) {
  var cn="", ch="", cc="";

  if (nullRE.test(name)) {
    nameAlert();
    return;
  }
  if (size!="" && !numRE.test(size)) {
    numAlert("font size");
    return;
  }
  if (colorn!="" && !colorRE.test(colorn)) {
    colorAlert("font color normal");
    return;
  }
  else {
    cn=colorn==""?"":RegExp.$1;
  }
  if (colorh!="" && !colorRE.test(colorh)) {
    colorAlert("font color highlight");
    return;
  }
  else {
    ch=colorh==""?"":RegExp.$1;
  }
  if (colorc!="" && !colorRE.test(colorc)) {
    colorAlert("font color mouse-down");
    return;
  }
  else {
    cc=colorc==""?"":RegExp.$1;
  }

  currentStyle.innerHTML='<span class="item">&nbsp;'+name+'&nbsp;</span>';
  highlightStyle();

  currentStyle.sname=name;
  currentStyle.sfont=font;
  currentStyle.ssize=size;
  currentStyle.sweight=weight;
  currentStyle.sstyle=style;
  currentStyle.scolorn=cn;
  currentStyle.scolorh=ch;
  currentStyle.scolorc=cc;
  currentStyle.salign=align;
  currentStyle.svalign=valign;

  hideForm();
}

function lrList(lr) {
  return optionList(["left", "right"],lr);
}

function tagForm() {
  return tableOpen+formTitle('Tag Style')+'<tr><td align="right"><nobr>&nbsp;name:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;visibility:&nbsp;</td><td><select class="text">'+visList('')+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;path:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;<input class="click" type="button" value="?" onclick="showHelp(17,17,17)"></td></tr><tr><td align="right"><nobr>&nbsp;tag-normal:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;tag-highlight:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;width:&nbsp;</td><td><input class="text" type="text" value="0">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;height:&nbsp;</td><td><input class="text" type="text" value="0">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;align:&nbsp;</td><td><select class="text">'+lrList('right')+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;valign:&nbsp;</td><td><select class="text">'+vaList('')+'</select>&nbsp;<input class="click" type="button" value="?" onclick="showHelp(18,18,18)"></td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Add  " onclick="newTag2(this.form.elements[0].value,getOption(this.form.elements[1]),this.form.elements[2].value,this.form.elements[4].value,this.form.elements[5].value,this.form.elements[6].value,this.form.elements[7].value,getOption(this.form.elements[8]),getOption(this.form.elements[9]))">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function tagForm2() {
  return tableOpen+formTitleS('Tag Style')+'<tr><td align="right"><nobr>&nbsp;name:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sname+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;visibility:&nbsp;</td><td><select class="text">'+visList(currentStyle.svis)+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;path:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.spath+'">&nbsp;<input class="click" type="button" value="?" onclick="showHelp(17,17,17)"></td></tr><tr><td align="right"><nobr>&nbsp;tag-normal:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.stagn+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;tag-highlight:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.stagh+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;width:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.swidth+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;height:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sheight+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;align:&nbsp;</td><td><select class="text">'+lrList(currentStyle.salign)+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;valign:&nbsp;</td><td><select class="text">'+vaList(currentStyle.svalign)+'</select>&nbsp;<input class="click" type="button" value="?" onclick="showHelp(18,18,18)"></td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Change  " onclick="updateTag(this.form.elements[0].value,getOption(this.form.elements[1]),this.form.elements[2].value,this.form.elements[4].value,this.form.elements[5].value,this.form.elements[6].value,this.form.elements[7].value,getOption(this.form.elements[8]),getOption(this.form.elements[9]))">&nbsp;&nbsp;<input class="submit" type="button" value="  Delete  " onclick="delSTag()">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function newTag() {
  formHolder.innerHTML=tagForm();
  showLayer(formHolder);
}

function newTag2(name, vis, path, tagn, tagh, width, height, align, valign) {
  if (nullRE.test(name)) {
    nameAlert();
    return;
  }
  if (vis!="hidden") {
    if (!numRE.test(width) || width==0) {
      numAlert("width");
      return;
    }
    if (!numRE.test(height) || height==0) {
      numAlert("height");
      return;
    }
    if (nullRE.test(tagn)) {
      alert("Please specify the normal tag image.")
      return;
    }
    if (nullRE.test(tagh)) {
      alert("Please specify the highlighted tag image.")
      return;
    }
  }
  
  var tagLI=yx_createEle("LI");
  tagLI.innerHTML='<span class="item">&nbsp;'+name+'&nbsp;</span>';

  tagLI.role="tag";
  tagLI.sname=name;
  tagLI.svis=vis;
  tagLI.spath=path;
  tagLI.stagn=tagn;
  tagLI.stagh=tagh;
  tagLI.swidth=width;
  tagLI.sheight=height;
  tagLI.salign=align;
  tagLI.svalign=valign;

  tagLI.type="square";

  tagLI.style.cursor=ptr;
  tagLI.onclick=clickStyle;
  tagLI.lead=tagFolder;

  tagList.appendChild(tagLI);
  tagCount++;

  if (tagFolder.style.display=="none") {
    tagFolder.style.display="";
    tagList.style.display="";
  }

  hideForm();
}

function updateTag(name, vis, path, tagn, tagh, width, height, align, valign) {
  if (nullRE.test(name)) {
    nameAlert();
    return;
  }
  if (vis!="hidden") {
    if (!numRE.test(width) || width==0) {
      numAlert("width");
      return;
    }
    if (!numRE.test(height) || height==0) {
      numAlert("height");
      return;
    }
    if (nullRE.test(tagn)) {
      alert("Please specify the normal tag image.")
      return;
    }
    if (nullRE.test(tagh)) {
      alert("Please specify the highlighted tag image.")
      return;
    }
  }

  currentStyle.innerHTML='<span class="item">&nbsp;'+name+'&nbsp;</span>';
  highlightStyle();

  currentStyle.sname=name;
  currentStyle.svis=vis;
  currentStyle.spath=path;
  currentStyle.stagn=tagn;
  currentStyle.stagh=tagh;
  currentStyle.swidth=width;
  currentStyle.sheight=height;
  currentStyle.salign=align;
  currentStyle.svalign=valign;

  hideForm();
}

function ssList(ss) {
  return optionList(["1", "2"],ss);
}

function separatorForm() {
  return tableOpen+formTitle('Separator Style')+'<tr><td align="right"><nobr>&nbsp;name:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;style:&nbsp;</td><td><select class="text">'+bsList('')+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;color:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[2],'+"'separator color'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;size:&nbsp;</td><td><select class="text">'+ssList('2')+'</select>&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Add  " onclick="newSeparator2(this.form.elements[0].value,getOption(this.form.elements[1]),this.form.elements[2].value,getOption(this.form.elements[4]))">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function separatorForm2() {
  return tableOpen+formTitleS('Separator Style')+'<tr><td align="right"><nobr>&nbsp;name:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sname+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;style:&nbsp;</td><td><select class="text">'+bsList(currentStyle.sstyle)+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;color:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.scolor+'">&nbsp;<input class="click" type="button" value="&#187;" onclick="pickColor(this.form.elements[2],'+"'separator color'"+')"></td></tr><tr><td align="right"><nobr>&nbsp;size:&nbsp;</td><td><select class="text">'+ssList(currentStyle.ssize)+'</select>&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Change  " onclick="updateSep(this.form.elements[0].value,getOption(this.form.elements[1]),this.form.elements[2].value,getOption(this.form.elements[4]))">&nbsp;&nbsp;<input class="submit" type="button" value="  Delete  " onclick="delSeparator()">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function newSeparator() {
  formHolder.innerHTML=separatorForm();
  showLayer(formHolder);
}

function newSeparator2(name,style,color,size) {
  var fc="";
  if (nullRE.test(name)) {
    nameAlert();
    return;
  }
  if (color!="" && !colorRE2.test(color)) {
    colorAlert("separator color");
    return;
  }
  else {
    fc=color==""?"":RegExp.$1;
  }
  
  var tagLI=yx_createEle("LI");
  tagLI.innerHTML='<span class="item">&nbsp;'+name+'&nbsp;</span>';

  tagLI.role="separator";
  tagLI.sname=name;
  tagLI.sstyle=style;
  tagLI.scolor=fc;
  tagLI.ssize=size;

  tagLI.type="square";

  tagLI.style.cursor=ptr;
  tagLI.onclick=clickStyle;
  tagLI.lead=sepFolder;

  sepList.appendChild(tagLI);
  sepCount++;

  if (sepFolder.style.display=="none") {
    sepFolder.style.display="";
    sepList.style.display="";
  }

  hideForm();
}

function updateSep(name,style,color,size) {
  var fc="";
  if (nullRE.test(name)) {
    nameAlert();
    return;
  }
  if (color!="" && !colorRE2.test(color)) {
    colorAlert("separator color");
    return;
  }
  else {
    fc=color==""?"":RegExp.$1;
  }

  currentStyle.innerHTML='<span class="item">&nbsp;'+name+'&nbsp;</span>';
  highlightStyle();

  currentStyle.sname=name;
  currentStyle.sstyle=style;
  currentStyle.scolor=fc;
  currentStyle.ssize=size;

  hideForm();
}

function sOptionList(slist,option) {
  var list=[];

  if (slist.hasChildNodes()) {
    var item=slist.firstChild;

    while (item!=null) {
      list[list.length]=item.sname;
      item=item.nextSibling;
    }
  }

  list[list.length]="n/s";
  return optionList(list,option);
}

function sPadList(option) {
  return sOptionList(padList,option);
}

function sItemList(option) {
  return sOptionList(itemList,option);
}

function sFontList(option) {
  return sOptionList(fontList,option);
}

function sTagList(option) {
  return sOptionList(tagList,option);
}

function sSepList(option) {
  return sOptionList(sepList,option);
}

function styleForm() {
  return tableOpen+formTitle('Style Menu')+'<tr><td align="right"><nobr>&nbsp;name:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;pad style:&nbsp;</td><td><select class="text">'+sPadList('')+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;item style:&nbsp;</td><td><select class="text">'+sItemList('')+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;font style:&nbsp;</td><td><select class="text">'+sFontList('')+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;tag style:&nbsp;</td><td><select class="text">'+sTagList('')+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;separator style:&nbsp;</td><td><select class="text">'+sSepList('')+'</select>&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Add  " onclick="newStyle2(this.form.elements[0].value,getOption(this.form.elements[1]),getOption(this.form.elements[2]),getOption(this.form.elements[3]),getOption(this.form.elements[4]),getOption(this.form.elements[5]))">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function styleForm2() {
  return tableOpen+formTitleS('Style Menu')+'<tr><td align="right"><nobr>&nbsp;name:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sname+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;pad style:&nbsp;</td><td><select class="text">'+sPadList(currentStyle.spad)+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;item style:&nbsp;</td><td><select class="text">'+sItemList(currentStyle.sitem)+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;font style:&nbsp;</td><td><select class="text">'+sFontList(currentStyle.sfont)+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;tag style:&nbsp;</td><td><select class="text">'+sTagList(currentStyle.stag)+'</select>&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;separator style:&nbsp;</td><td><select class="text">'+sSepList(currentStyle.ssep)+'</select>&nbsp;</td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Change  " onclick="updateStyle(this.form.elements[0].value,getOption(this.form.elements[1]),getOption(this.form.elements[2]),getOption(this.form.elements[3]),getOption(this.form.elements[4]),getOption(this.form.elements[5]))">&nbsp;&nbsp;<input class="submit" type="button" value="  Delete  " onclick="delStyleMenu()">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function newStyle() {
  formHolder.innerHTML=styleForm();
  showLayer(formHolder);
}

function newStyle2(name, pad, item, font, tag, sep) {
  if (nullRE.test(name)) {
    nameAlert();
    return;
  }
  
  var tagLI=yx_createEle("LI");
  tagLI.innerHTML='<span class="item">&nbsp;'+name+'&nbsp;</span>';

  tagLI.role="menu";
  tagLI.sname=name;
  tagLI.spad=pad;
  tagLI.sitem=item;
  tagLI.sfont=font;
  tagLI.stag=tag;
  tagLI.ssep=sep;

  tagLI.type="square";

  tagLI.style.cursor=ptr;
  tagLI.onclick=clickStyle;
  tagLI.lead=menuFolder;

  menuList.appendChild(tagLI);
  menuCount++;

  if (menuFolder.style.display=="none") {
    menuFolder.style.display="";
    menuList.style.display="";
  }

  hideForm();
}

function updateStyle(name, pad, item, font, tag, sep) {
  if (nullRE.test(name)) {
    nameAlert();
    return;
  }

  currentStyle.innerHTML='<span class="item">&nbsp;'+name+'&nbsp;</span>';
  highlightStyle();

  currentStyle.sname=name;
  currentStyle.spad=pad;
  currentStyle.sitem=item;
  currentStyle.sfont=font;
  currentStyle.stag=tag;
  currentStyle.ssep=sep;

  hideForm();
}

function getNameID(item) {
  var list=[];

  if (item.role=="top") {
    list[list.length]=[item.iden,"top-menu"];
  }
  else if (item.role=="sub") {
    list[list.length]=[item.iden,item.dis];
  }

  if (item.list.hasChildNodes()) {
    var node=item.list.firstChild;
    while (node!=null) {
      if (node.role=="top" || node.role=="sub") {
        list=list.concat(getNameID(node));
      }
      node=node.nextSibling;
    }
  }

  return list;
}

function getStyleList() {
  var slist=[];

  if (menuList.hasChildNodes()) {
    var node=menuList.firstChild;
    while (node!=null) {
      slist[slist.length]=node.sname;
      node=node.nextSibling;
    }
  }

  return slist;
}

function optionList2(list,olist) {
  var opts="", status="";

  for (var i=0; i<list.length; i++) {
    status="";
    for (var j=0; j<olist.length; j++) {
      if (list[i][0]==olist[j]) {
        status=" selected";
        break;
      }
    }

    opts+="<option value=\""+list[i][0]+"\""+status+">"+list[i][0]+" ["+list[i][1]+"]</option>";
  }

  return opts;
}

function getOption2(list) {
  var olist=[];

  for (var i=0; i<list.length; i++) {
    if (list.options[i].selected) {
      olist[olist.length]=list.options[i].value;
    }
  }

  return olist;
}

function groupForm(slist,mlist) {
  return tableOpen+formTitle('Style Group')+'<tr><td align="right"><nobr>&nbsp;name:&nbsp;</td><td><input class="text" type="text" value="">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;style menu:&nbsp;</td><td><select class="text">'+optionList(slist,null)+'</select>&nbsp;</td></tr><tr valign="top"><td align="center" colspan="2"><nobr>&nbsp;top-menu & sub-menus:&nbsp;</td></tr><tr><td align="center" colspan="2"><select multiple size="10" class="long">'+optionList2(mlist,[])+'</select></td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Add  " onclick="newGroup2(this.form.elements[0].value,getOption(this.form.elements[1]),getOption2(this.form.elements[2]))">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function groupForm2(slist,mlist) {
  return tableOpen+formTitleS('Style Group')+'<tr><td align="right"><nobr>&nbsp;name:&nbsp;</td><td><input class="text" type="text" value="'+currentStyle.sname+'">&nbsp;</td></tr><tr><td align="right"><nobr>&nbsp;style menu:&nbsp;</td><td><select class="text">'+optionList(slist,currentStyle.sstyle)+'</select>&nbsp;</td></tr><tr valign="top"><td align="center" colspan="2"><nobr>&nbsp;top-menu & sub-menus:&nbsp;</td></tr><tr align="center"><td colspan="2"><select multiple size="10" class="long">'+optionList2(mlist,currentStyle.mlist)+'</select></td></tr><tr><td align="center" colspan="2"><input class="submit" type="button" value="  Change  " onclick="updateGroup(this.form.elements[0].value,getOption(this.form.elements[1]),getOption2(this.form.elements[2]))">&nbsp;&nbsp;<input class="submit" type="button" value="  Delete  " onclick="delStyleGroup()">&nbsp;&nbsp;<input class="submit" type="button" value="  Cancel  " onclick="hideForm()"></td></tr>'+tableEnd;
}

function newGroup() {
  if (currentItem==null || currentItem.role!="top" && currentItem.role!="sub") {
    alert("Please select a menu or sub-menu before defining a style group.");
    return;
  }
  var mlist=getNameID(currentItem);

  var slist=getStyleList();
  if (slist.length==0) {
    alert("Please define a style menu first.");
    return;
  }

  formHolder.innerHTML=groupForm(slist,mlist);
  showLayer(formHolder);
}

function newGroup2(name,style,mlist) {
  if (nullRE.test(name)) {
    nameAlert();
    return;
  }

  var tagLI=yx_createEle("LI");
  tagLI.innerHTML='<span class="item">&nbsp;'+name+' ['+style+': '+mlist.join()+']&nbsp;</span>';

  tagLI.role="group";
  tagLI.sname=name;
  tagLI.sstyle=style;
  tagLI.mlist=mlist;

  tagLI.type="square";

  tagLI.style.cursor=ptr;
  tagLI.onclick=clickStyle;
  tagLI.lead=groupFolder;

  groupList.appendChild(tagLI);
  groupCount++;

  if (groupFolder.style.display=="none") {
    groupFolder.style.display="";
    groupList.style.display="";
  }

  hideForm();
}

function newGroup3() {
  if (currentItem==null || currentItem.role!="top" && currentItem.role!="sub") {
    alert("Please select a menu or sub-menu before defining a style group.");
    return;
  }
  var mlist=getNameID(currentItem);

  var slist=getStyleList();
  if (slist.length==0) {
    alert("Please define a style menu first.");
    return;
  }

  formHolder.innerHTML=groupForm2(slist,mlist);
  showLayer(formHolder);
}

function updateGroup(name,style,mlist) {
  if (nullRE.test(name)) {
    nameAlert();
    return;
  }

  currentStyle.innerHTML='<span class="item">&nbsp;'+name+' ['+style+': '+mlist.join()+']&nbsp;</span>';
  highlightStyle();

  currentStyle.sname=name;
  currentStyle.sstyle=style;
  currentStyle.mlist=mlist;

  hideForm();
}

function parseStyle(id) {
  var content="", node=null;

  if (padList.hasChildNodes()) {
    node=padList.firstChild;

    while (node!=null) {
      content+="addStylePad(\""+id+node.sname+"\", \"";
      if (node.svis=="hidden") {
        content+="visibility:hidden;";
      }
      else {
        if (node.sbsize!="" && node.sbsize!="0") {
          content+="border-size:"+node.sbsize+"; ";
          if (node.sbstyle!="") {
            content+="border-style:"+node.sbstyle+"; ";
          }
          if (node.sbcolor!="") {
            content+="border-color:"+node.sbcolor+"; ";
          }
          if (node.sbsides!="") {
            content+="border-sides:"+node.sbsides+"; ";
          }
        }
        if (node.spadding!="") {
          content+="padding:"+node.spadding+"; ";
        }
        if (node.sbgcolor!="") {
          content+="background-color:"+node.sbgcolor+"; ";
        }
        if (node.smenuform=="bar") {
          content+="menu-form:bar; ";
        }
        if (node.sdir!="" && node.sdir!="right-down") {
          content+="direction:"+node.sdir+"; ";
        }
        if (node.sscroll=="no") {
          content+="scroll:no; ";
        }
        if (node.sdy!="" && node.sdy!="0") {
          content+="offset-top:"+node.sdy+"; ";
        }
        if (node.sdx!="" && node.sdx!="0") {
          content+="offset-left:"+node.sdx+"; ";
        }
        if (node.sdis!="" && node.sdis!="0") {
          content+="item-offset:"+node.sdis+"; ";
        }
        if (node.sopacity!="" && node.sopacity!="100") {
          content+="opacity:"+node.sopacity+"; ";
        }
      }
      content+="\");\n";

      node=node.nextSibling;
    }
  }

  if (itemList.hasChildNodes()) {
    node=itemList.firstChild;
    if (content!="") {
      content+="\n";
    }

    while (node!=null) {
      content+="addStyleItem(\""+id+node.sname+"\", \"";
      if (node.swidth!="" && node.swidth!="0") {
        content+="width:"+node.swidth+"; ";
      }
      if (node.sheight!="" && node.sheight!="0") {
        content+="height:"+node.sheight+"; ";
      }
      if (node.sbsize!="" && node.sbsize!="0") {
        content+="border-size:"+node.sbsize+"; ";
        if (node.sbstylen!="") {
          content+="border-style:"+node.sbstylen;
          if (node.sbstyleh!="") {
            content+=" "+node.sbstyleh;
            if (node.sbstylec!="" && node.sbstylec!="n/a") {
              content+=" "+node.sbstylec;
            }
          }
          content+="; ";
        }
        if (node.sbcolorn!="") {
          content+="border-color:"+node.sbcolorn;
          if (node.sbcolorh!="") {
            content+=" "+node.sbcolorh;
            if (node.sbstylec!="" && node.sbstylec!="n/a" && node.scolorc!="") {
              content+=" "+node.scolorc;
            }
          }
          content+="; ";
        }
        if (node.sbsidesn!="") {
          content+="border-sides:"+node.sbsidesn;
          if (node.sbsidesh!="") {
            content+=", "+node.sbsidesh;
            if (node.sbstylec!="" && node.sbstylec!="n/a" && node.sbsidesc!="") {
              content+=", "+node.sbsidesc;
            }
          }
          content+="; ";
        }
      }
      if (node.spadding!="") {
        content+="padding:"+node.spadding+"; ";
      }
      if (node.sbgcolorn!="") {
        content+="background-color:"+node.sbgcolorn;
        if (node.sbgcolorh!="") {
          content+=" "+node.sbgcolorh;
          if (node.sbgcolorc!="") {
            content+=" "+node.sbgcolorc;
          }
        }
        content+="; ";
      }
      if (node.ssubmenu=="mouse-click") {
        content+="sub-menu:mouse-click; ";
      }
      if (node.sopacity!="" && node.sopacity!="100") {
        content+="opacity:"+node.sopacity+"; ";
      }

      content+="\");\n";

      node=node.nextSibling;
    }
  }

  if (fontList.hasChildNodes()) {
    node=fontList.firstChild;
    if (content!="") {
      content+="\n";
    }

    while (node!=null) {
      content+="addStyleFont(\""+id+node.sname+"\", \"";
      if (node.sfont!="") {
        content+="font-family:"+node.sfont+"; ";
      }
      if (node.ssize!="" && node.ssize!="0") {
        content+="font-size:"+node.ssize+"; ";
      }
      if (node.sweight!="" && node.sweight!="normal normal") {
        content+="font-weight:"+node.sweight+"; ";
      }
      if (node.sstyle!="" && node.sstyle!="normal normal") {
        content+="font-style:"+node.sstyle+"; ";
      }
      if (node.deco!="" && node.deco!="none none") {
        content+="font-style:"+node.sstyle+"; ";
      }
      if (node.scolorn!="") {
        content+="color:"+node.scolorn;
        if (node.scolorh!="") {
          content+=" "+node.scolorh;
          if (node.scolorc!="") {
            content+=" "+node.scolorc;
          }
        }
        content+="; ";
      }
      if (node.salign!="" && node.salign!="left") {
        content+="text-align:"+node.salign+"; ";
      }
      if (node.svalign!="" && node.svalign!="top") {
        content+="vertical-align:"+node.svalign+"; ";
      }
      content+="\");\n";

      node=node.nextSibling;
    }
  }

  if (tagList.hasChildNodes()) {
    node=tagList.firstChild;
    if (content!="") {
      content+="\n";
    }

    while (node!=null) {
      content+="addStyleTag(\""+id+node.sname+"\", \"";
      if (node.svis=="hidden") {
        content+="visibility:hidden;";
      }
      else {
        if (node.spath!="") {
          content+="path:"+node.spath+"; ";
        }
        content+="tag-normal:"+node.stagn+"; tag-highlight:"+node.stagh+"; ";
        content+="width:"+node.swidth+"; height:"+node.sheight+"; ";
        if (node.salign!="" && node.salign!="right") {
          content+="align:"+node.salign+"; ";
        }
        if (node.svalign!="" && node.svalign!="top") {
          content+="valign:"+node.svalign+"; ";
        }
      }
      content+="\");\n";

      node=node.nextSibling;
    }
  }

  if (sepList.hasChildNodes()) {
    node=sepList.firstChild;
    if (content!="") {
      content+="\n";
    }

    while (node!=null) {
      content+="addStyleSeparator(\""+id+node.sname+"\", \"";
      if (node.sstyle!="") {
        content+="style:"+node.sstyle+"; ";
      }
      if (node.scolor!="") {
        content+="color:"+node.scolor+"; ";
      }
      if (node.ssize!="") {
        content+="size:"+node.ssize+"; ";
      }
      content+="\");\n";

      node=node.nextSibling;
    }
  }

  if (menuList.hasChildNodes()) {
    node=menuList.firstChild;
    if (content!="") {
      content+="\n";
    }

    while (node!=null) {
      content+="addStyleMenu(\""+id+node.sname+"\", \""+(node.spad=="n/s"?"":(id+node.spad))+"\", \""+(node.sitem=="n/s"?"":(id+node.sitem))+"\", \""+(node.sfont=="n/s"?"":(id+node.sfont))+"\", \""+(node.stag=="n/s"?"":(id+node.stag))+"\", \""+(node.ssep=="n/s"?"":(id+node.ssep))+"\");\n";
      node=node.nextSibling;
    }
  }

  if (groupList.hasChildNodes()) {
    node=groupList.firstChild;
    if (content!="") {
      content+="\n";
    }

    while (node!=null && node.mlist.length>0) {
      content+="addStyleGroup(\""+id+node.sname+"\", \""+id+node.sstyle+"\"";
      for (var i=0; i<node.mlist.length; i++) {
        content+=", \""+id+node.mlist[i]+"\"";
      }
      content+=");\n";

      node=node.nextSibling;
    }
  }

  return content;
}

function outputStyle() {
  var boxOpen="<form><textarea name=\"content\" class=\"list\" cols=\"100\" rows=\"25\" wrap=\"off\">";
  var boxEnd="</textarea><br>\n<input type=\"button\" class=\"submit\" value=\"  Close  \" onclick=\"hideForm()\">&nbsp;<input type=\"button\" class=\"submit\" value=\"  Select  \" onclick=\"this.form.content.select()\"></form>\n";

  var content=parseStyle("");
  if (content!="") {
    formHolder.innerHTML=boxOpen+content+boxEnd;
    showLayer(formHolder);
  }
}

function loadStyle() {
  formHolder.innerHTML="<form><textarea name=\"content\" class=\"list\" cols=\"100\" rows=\"25\" wrap=\"off\">// Paste your style content here\n</textarea><br>\n<input type=\"button\" class=\"submit\" value=\"  Load  \" onclick=\"inputStyle(this.form.content.value)\">&nbsp;<input type=\"button\" class=\"submit\" value=\"  Cancel  \" onclick=\"hideForm()\"></form>\n";
  showLayer(formHolder);
}

function inputStyle(content) {
  var lines=content.split(/[\n\r]+/);

  for (var i=0; i<lines.length; i++) {
    if (lines[i].search(/^\s*(addStylePad|addStyleItem|addStyleFont|addStyleTag|addStyleSeparator|addStyleMenu|addStyleGroup)/)!=-1) {
      eval("_"+lines[i]);
    }
  }

  if (currentStyle!=null) {
    blurStyle();
  }
  currentStyle=null;
  hideForm();
}

function _addStylePad(sp_name,para) {
  var name=sp_name;
  var vis=para.search(/visibility\s*:\s*hidden/)==-1?"visible":"hidden";
  var bsize=para.search(/border-size\s*:\s*(\d+)/)!=-1?RegExp.$1:"0";
  var bstyle=para.search(/border-style\s*:\s*(outset|inset|solid)/)!=-1?RegExp.$1:"";
  var bcolor=para.search(/border-color\s*:\s*(#[a-f\d]{6})/i)!=-1?RegExp.$1:"";
  var bsides=para.search(/border-sides\s*:\s*(1|0)\s+(1|0)\s+(1|0)\s+(1|0)/)!=-1?(RegExp.$1+" "+RegExp.$2+" "+RegExp.$3+" "+RegExp.$4):"";

  var ra=para.match(/padding\s*:\s*(\d+)(\s+(\d+))?/);
  var padding=(ra && ra[1])?ra[1]:"0";
  padding+=(ra && ra[3])?(" "+ra[3]):"";

  var bgcolor=para.search(/background-color\s*:\s*(#[\-a-f\d]{6})/i)!=-1?RegExp.$1:"";
  var menuform=para.search(/menu-form\s*:\s*bar/)!=-1?"bar":"pad";
  var dir=para.search(/direction\s*:\s*(right-down|right-up|left-down|left-up|center-down|center-up|abs-right-down|abs-right-up|abs-left-down|abs-left-up|right-top|left-top|right-middle|left-middle|right-bottom|left-bottom)/)!=-1?RegExp.$1:"";
  var scroll=para.search(/scroll\s*:\s*yes/)!=-1?"yes":"no";
  var dx=para.search(/offset-left\s*:\s*(\-?\d+)/)!=-1?RegExp.$1:"0";
  var dy=para.search(/offset-top\s*:\s*(\-?\d+)/)!=-1?RegExp.$1:"0";
  var dis=para.search(/item-offset\s*:\s*(\-?\d+)/)!=-1?RegExp.$1:"0";
  var opacity=para.search(/opacity:(\d+)/)!=-1?RegExp.$1:"100";

  newPad2(name, vis, bsize, bstyle, bcolor, bsides, padding, bgcolor, menuform, dir, scroll, dy, dx, dis, opacity);
}

function _addStyleItem(si_name,para) {
  var name=si_name;
  var width=para.search(/width\s*:\s*(\d+)/)!=-1?RegExp.$1:"0";
  var height=para.search(/height\s*:\s*(\d+)/)!=-1?RegExp.$1:"0";

  var bsize=para.search(/border-size\s*:\s*(\d+)/)!=-1?RegExp.$1:"0";

  var ra=para.match(/border-style\s*:\s*(outset|inset|solid)(\s+(outset|inset|solid))?(\s+(outset|inset|solid))?/);
  var bstylen=(ra && ra[1])?ra[1]:"";
  var bstyleh=(ra && ra[3])?ra[3]:"";
  var bstylec=(ra && ra[5])?ra[5]:"";

  ra=para.match(/border-color\s*:\s*(#[a-f\d]{6})(\s+(#[a-f\d]{6}))?(\s+(#[a-f\d]{6}))?/i);
  var bcolorn=(ra && ra[1])?ra[1]:"";
  var bcolorh=(ra && ra[3])?ra[3]:"";
  var bcolorc=(ra && ra[5])?ra[5]:"";

  var bsidesn="", bsidesh="", bsidesc="";
  if (para.search(/border-sides\s*:\s*([^;]+)(;|$)/)!=-1) {
    var ba=RegExp.$1.split(",");
    if (ba[0].search(/(1|0)\s+(1|0)\s+(1|0)\s+(1|0)/)!=-1) {
      bsidesn=RegExp.$1+" "+RegExp.$2+" "+RegExp.$3+" "+RegExp.$4;
    }
    if (ba[1] && ba[1].search(/(1|0)\s+(1|0)\s+(1|0)\s+(1|0)/)!=-1) {
      bsidesh=RegExp.$1+" "+RegExp.$2+" "+RegExp.$3+" "+RegExp.$4;
    }
    if (ba[2] && ba[2].search(/(1|0)\s+(1|0)\s+(1|0)\s+(1|0)/)!=-1) {
      bsidesc=RegExp.$1+" "+RegExp.$2+" "+RegExp.$3+" "+RegExp.$4;
    }
  }

  ra=para.match(/padding\s*:\s*(\d+)(\s+(\d+))?/);
  var padding=(ra && ra[1])?ra[1]:"0";
  padding+=(ra && ra[3])?(" "+ra[3]):"";

  ra=para.match(/background-color\s*:\s*(#[\-a-f\d]{6})(\s+(#[\-a-f\d]{6}))?(\s+(#[\-a-f\d]{6}))?/i);
  var bgcolorn=(ra && ra[1])?ra[1]:"";
  var bgcolorh=(ra && ra[3])?ra[3]:"";
  var bgcolorc=(ra && ra[5])?ra[5]:"";

  var submenu=para.search(/sub-menu\s*:\s*mouse-click/)!=-1?"mouse-click":"";
  var opacity=para.search(/opacity:(\d+)/)!=-1?RegExp.$1:"100";

  newItem2(name, width, height, bsize, bstylen, bstyleh, bstylec, bcolorn, bcolorh, bcolorc, bsidesn, bsidesh, bsidesc, padding, bgcolorn, bgcolorh, bgcolorc, submenu, opacity);
}

function _addStyleFont(sf_name,para) {
  var name=sf_name;
  var font=para.search(/font-family\s*:\s*([\w\s,\-]+)(;|$)/)!=-1?RegExp.$1:"";
  var size=para.search(/font-size\s*:\s*(\d+)/)!=-1?RegExp.$1:"0";

  var ra=para.match(/font-weight\s*:\s*(normal|bold)(\s+(normal|bold))?/);
  var weight=((ra && ra[1])?ra[1]:"")+((ra && ra[3])?(" "+ra[3]):"");

  ra=para.match(/font-style\s*:\s*(normal|italic)(\s+(normal|italic))?/);
  var style=((ra && ra[1])?ra[1]:"")+((ra && ra[3])?(" "+ra[3]):"");

  ra=para.match(/color\s*:\s*(#[a-f\d]{6})(\s+(#[a-f\d]{6}))?(\s+(#[a-f\d]{6}))?/i);
  var colorn=(ra && ra[1])?ra[1]:"";
  var colorh=(ra && ra[3])?ra[3]:"";
  var colorc=(ra && ra[5])?ra[5]:"";

  var align=para.search(/text-align\s*:\s*(left|center|right)/)!=-1?RegExp.$1:"";
  var valign=para.search(/(valign|vertical-align)\s*:\s*(top|middle)/)!=-1?RegExp.$2:"";

  ra=para.match(/text-decoration\s*:\s*(none|underline)(\s+(none|underline))?/);
  var deco=((ra && ra[1])?ra[1]:"")+((ra && ra[3])?(" "+ra[3]):"");

  newFont2(name, font, size, weight, style, colorn, colorh, colorc, align, valign, deco);
}

function _addStyleTag(st_name,para) {
  var name=st_name;
  var vis=para.search(/visibility\s*:\s*hidden/)==-1?"visible":"hidden";
  var path=para.search(/path\s*:\s*([^;]+)(;|$)/)!=-1?RegExp.$1:"";
  var tagn=para.search(/tag-normal\s*:\s*([^;]+)(;|$)/)!=-1?RegExp.$1:"";
  var tagh=para.search(/tag-highlight\s*:\s*([^;]+)(;|$)/)!=-1?RegExp.$1:"";
  var width=para.search(/width\s*:\s*(\d+)/)!=-1?RegExp.$1:"0";
  var height=para.search(/height\s*:\s*(\d+)/)!=-1?RegExp.$1:"0";
  var align=para.search(/align\s*:\s*(left|right)/)!=-1?RegExp.$1:"";
  var valign=para.search(/valign\s*:\s*(top|middle)/)!=-1?RegExp.$1:"";

  newTag2(name, vis, path, tagn, tagh, width, height, align, valign);
}

function _addStyleSeparator(ss_name,para) {
  var name=ss_name;
  var style=para.search(/style\s*:\s*(outset|inset|solid)/)!=-1?RegExp.$1:"";
  var color=para.search(/color\s*:\s*(#[a-f\d]{6})/i)!=-1?RegExp.$1:"";
  var size=para.search(/size\s*:\s*(1|2)/)!=-1?RegExp.$1:"2";

  newSeparator2(name,style,color,size);
}

function _addStyleMenu(name,pad,item,font,tag,sep) {
  newStyle2(name,pad,item,font,tag,sep);
}

function _addStyleGroup(name,style) {
  var list=[];
  for (var i=2; i<_addStyleGroup.arguments.length; i++) {
    list[list.length]=_addStyleGroup.arguments[i];
  }

  newGroup2(name,style,list);
}

// preview
function cleanMenu(menu) {
  var items=menu.items;

  for (var i=0; i<items.length; i++) {
    items[i].item=null; items[i].cover=null;
    items[i].img=null; items[i].tag=null; items[i].icon=null;

    if (items[i].content.type==yx_M && items[i].menu.ready) {
      yx_cleanMenu(items[i].menu);
    }
  }
  menu.pad=null; menu.holder=null;
  menu.ready=false; menu.flying=false; menu.go=false; menu.shown=false; menu.open=false;
}

function cleanIns(ins) {
  if (ins.menu.ready) { hideMenuX(ins.name); cleanMenu(ins.menu); }
}

function closePreview() {
  if (currentIns!=null) {
    cleanIns(currentIns);
  }

  currentIns=null;
}

function preview(form) {
  var id="preview-"+(++insNo);
  var group="";

  if (currentItem==null || currentItem.role!="top") {
    alert("Please select a menu.");
    return;
  }
  if (currentStyle==null || currentStyle.role!="group") {
    if (!confirm("You didn't select a style group.\nDo you want to preview the menu with default styles?")) {
      return;
    }
  }
  else {
    group="style:"+id+currentStyle.sname+"; ";
  }

  closePreview();

  var menu=parseMenu(currentItem,id);
  var style=parseStyle(id);
  var ins="addInstance(\""+id+"\", \""+id+currentItem.menu+"\", \"position:absolute; offset-left:16; offset-top:32; "+group+"menu-form:"+form+"; target:dummy\")";

  eval(menu+style+ins);
  showMenu(id);

  currentIns=yx_findIns(id,false);
}

function previewPad() {
  preview("pad");
}

function previewBar() {
  preview("bar");
}

// help
function hideHelp() {
  hideLayer(colorHolder);
}

function showHelp(id1,id2,id) {
  colorHolder.innerHTML="<form>"+tableOpen+formTitle(helpList[id*2])+formContent(id1,id2,id)+tableEnd+"</form>";
  showLayer(colorHolder);
}

// color
var colors=["", "", ""], colorField=null;
function setColor(hl,idx) {
  colors[idx]=hl;
  return "#"+colors[0]+colors[1]+colors[2];
}

function colorForm(color) {
  if (color.search(/#[a-f\d]{6}/i)==-1) {
    color="#000000";
  }
  color=color.toLowerCase();
  var rh=color.charAt(1), rl=color.charAt(2), gh=color.charAt(3), gl=color.charAt(4), bh=color.charAt(5), bl=color.charAt(6);
  var bits=["0", "3", "6", "9", "c", "f"];
  var cells="", lc=0;

  colors[0]=rh+rl;
  colors[1]=gh+gl;
  colors[2]=bh+bl;

  cells+='<tr><td><input type="button" class="fcell" value="&nbsp;" style="background-color:'+color+'"></td><td><table cellpadding="0" cellspacing="0" border="0" width="100%"><tr align="right"><td><input type="button" class="vcell" value="'+color+'"></td><td><input type="button" class="submit" value="OK" onclick="colorField.value=this.form.elements[1].value; hideHelp()">&nbsp;<input type="button" class="submit" value="Cancel" onclick="hideHelp()"></td></tr></table></td></tr>';

  cells+='<tr><td><input type="button" name="redtab" class="tcell" value="&nbsp;" style="background-color:#'+rh+rl+'0000"></td><td align="right">';
  for (var i=0; i<bits.length; i++) {
    for (var j=0; j<bits.length; j++) {
      cells+='<input type="button" class="cell" value="&nbsp;" style="background-color:#'+bits[i]+bits[j]+'0000" onclick="this.form.redtab.style.backgroundColor='+"'#"+bits[i]+bits[j]+"0000'"+'; this.form.elements[0].style.backgroundColor=setColor('+"'"+bits[i]+bits[j]+"'"+',0); this.form.elements[1].value=setColor('+"'"+bits[i]+bits[j]+"'"+',0)">';
    }
    if (lc==0) {
      lc=1;
    }
    else {
      cells+="<br>";
      lc=0;
    }
  }
  cells+="</td></tr>";

  cells+='<tr><td><input type="button" name="greentab" class="tcell" value="&nbsp;" style="background-color:#00'+gh+gl+'00"></td><td align="right">';
  for (var i=0; i<bits.length; i++) {
    for (var j=0; j<bits.length; j++) {
      cells+='<input type="button" class="cell" value="&nbsp;" style="background-color:#00'+bits[i]+bits[j]+'00" onclick="this.form.greentab.style.backgroundColor='+"'#00"+bits[i]+bits[j]+"00'"+'; this.form.elements[0].style.backgroundColor=setColor('+"'"+bits[i]+bits[j]+"'"+',1); this.form.elements[1].value=setColor('+"'"+bits[i]+bits[j]+"'"+',1)">';
    }
    if (lc==0) {
      lc=1;
    }
    else {
      cells+="<br>";
      lc=0;
    }
  }
  cells+="</td></tr>";

  cells+='<tr><td><input type="button" name="bluetab" class="tcell" value="&nbsp;" style="background-color:#0000'+bh+bl+'"></td><td align="right">';
  for (var i=0; i<bits.length; i++) {
    for (var j=0; j<bits.length; j++) {
      cells+='<input type="button" class="cell" value="&nbsp;" style="background-color:#0000'+bits[i]+bits[j]+'" onclick="this.form.bluetab.style.backgroundColor='+"'#0000"+bits[i]+bits[j]+"'"+'; this.form.elements[0].style.backgroundColor=setColor('+"'"+bits[i]+bits[j]+"'"+',2); this.form.elements[1].value=setColor('+"'"+bits[i]+bits[j]+"'"+',2)">';
    }
    if (lc==0) {
      lc=1;
    }
    else {
      cells+="<br>";
      lc=0;
    }
  }
  cells+="</td></tr>";

  return cells;
}

function pickColor(field,name) {
  colorField=field;
  colorHolder.innerHTML="<form>"+tableOpen+formTitle(name)+colorForm(field.value)+tableEnd+"</form>";
  showLayer(colorHolder);
}