JXTree object, reading external xml file data, generating tree Functions

/*************************************** ***
* JXTree object: reads external xml file data and generates a tree
* @ Author brull
* @ Email brull@163.com
* @ Date 2007-03-27
**************************************** ***/

/*
* @ Param xmlURL address of the XML file
*/
Var JXTree = function (xmlURL)
{
Var result = new Array ();

/*****************************
* First define the TreeNode abstract object
* TreeNode object attributes:
* The unique id must be defined as a node attribute in the xml file.
* Level node level, starting from-1 (root node)
* _ Click node click, which is defined as a node attribute in the xml file [Optional]
* Whether isLast is the last node in the node hierarchy
* Parent_isLast whether the parent node is the last node of the parent node level
* How to convert the current toHTML node into HTML code
*******************************/
Var TreeNode = function (node, level)
{
Var parent_elements = node. parentNode? (Node. parentNode. parentNode? Node. parentNode. parentNode. childNodes: null): null;
Var elements = node. parentNode? Node. parentNode. childNodes: null;
This. id = XMLDom. getAttribute (node, "id ")? XMLDom. getAttribute (node, "id "):"";
This. level = level; // node level
This. isLast = elements? (Elements. item (elements. length-2) === node )? True: false): false;
This. _ click = XMLDom. getAttribute (node, 'click ')? XMLDom. getAttribute (node, 'click '):"";
This. toHTML = null; // function
}

/*****************************
* ElementNode object, inherited from the abstract object TreeNode
* New attributes:
* _ NodeName node name
******************************/
Var ElementNode = function (node, level)
{
TreeNode. apply (this, arguments );
This. _ nodeName = XMLDom. getAttribute (node, "name ")? XMLDom. getAttribute (node, "name "):"";
This. toHTML = function (){
Var result = "";
If (this. isLast) result + = "<div> <div class = 'minus _ bottom '";
Else result + = "<div> <div class = 'minus '";
Result + = "id = '" + this. id + "_ join 'onclick = \" JXTree. changeState ('"+ this. id + "') \"> </div> <div id =' "+ this. id + "_ folder 'class = 'Folder _ open'> </div> <span class = 'text' onclick = \" "+ this. _ click + "\"> "+ this. _ nodeName + "</span> </div> ";
Return result;
}
}

/*****************************
* TexNode object, inherited from the abstract object TreeNode
* The attributes are the same as those of TreeNode.
* New attributes:
* _ NodeValue node Value
******************************/
Var TextNode = function (node, level)
{
TreeNode. apply (this, arguments );
This. _ nodeValue = node. firstChild. nodeValue;
This. toHTML = function (){
Var result = "";
If (this. isLast) result + = "<div> <div class = 'join _ bottom '> </div> ";
Else result + = "<div> <div class = 'join'> </div> ";
Result + = "<div class = 'page'> </div> <span class = 'text' id = '" + this. id + "_ item 'onclick = \" JXTree. setFocus (this. id); "+ this. _ click + "\"> "+ this. _ nodeValue + "</span> </div> ";
Return result;
}
}

/********** After the Node is built, start to explain the XML file ************/

Var DOMRoot=XMLDom.loadXML(xmlURL).doc umentElement; // synchronously load XML files
Var level =-1; // root node level
Var stack = new Array (1 );
Result. push ("<div> <div class = 'root'> </div> <span class = 'text'>" + XMLDom. getAttribute (DOMRoot, "name") + "</span> </div> ");
// Parse the HTML code that expands the tree state of the xml file and call it recursively
This. parseXML = function (node ){
Stack. push (level );
Level ++;
Var element = new ElementNode (node, level );
Var elements = node. childNodes;
If (level! = 0 ){
If (element. isLast)
Result. push ("<div id = '" + element. id + "_ body' class = 'body _ empty '> ");
Else
Result. push ("<div id = '" + element. id + "_ body 'class = 'body _ line'> ");
}
For (var I = 0; I <elements. length; I ++ ){
If (elements. item (I). nodeName = "item") {// The node is leaf
Var textNode = new TextNode (elements. item (I), level );
Result. push (textNode. toHTML ());
TextNode = null; // release objects in time
}
Else if (elements. item (I). nodeType = 1) {// The node is a branch.
Var elementNode = new ElementNode (elements. item (I), level );
Result. push (elementNode. toHTML ());
ElementNode = null; // release objects in time
This. parseXML (elements. item (I ));
}
}
If (level! = 0) result. push ("</div> ");
Level = stack. pop ();
}

// Get the explanation result and return it
This. getTree = function (){
This. parseXML (DOMRoot );
DOMRoot = null; // release the DOM object
Return result. join ("");
}
/************* Static attributes ***************/
JXTree. curText = null; // id of the current text

/************ Static method ***************/
JXTree. changeState = function (id) {// expand or contract the node content
Var _ body = document. getElementById (id + "_ body ");
Var _ join = document. getElementById (id + "_ join ");
Var folder = document. getElementById (id + "_ folder ");
(_ Body. style. display = "none ")? (
_ Body. style. display = "block ",
_ Join. className = _ join. className. replace ("plus", "minus "),
Folder. className = "folder_open"
):(
_ Body. style. display = "none ",
_ Join. className = _ join. className. replace ("minus", "plus "),
Folder. className = "folder_close"
)
}; // ChangeState
JXTree. setFocus = function (id ){
If (JXTree. curText)
With (document. getElementById (JXTree. curText). style ){
BackgroundColor = "";
Color = "#000 ";
}
With (document. getElementById (id). style ){
BackgroundColor = "#003366 ";
Color = "# FFF ";
}
JXTree. curText = id;
}
}