L
LoserInYourFaceEngineer
Hello All:
I'm having trouble with a recursive function.
The function is supposed to identify nested folders in a hierarchical
folder structure.
The function "searchForFolders()" is supposed to traverse sibling
nodes in each iteration, and for each sibling node, it calls itself
again, to see if there are child nodes of the current sibling.
The code below contains the function in question. For simplicity's
sake, I have replaced the images with text characters. It doesn't
look as good, but you should be able to see how the nesting works.
When you click on a "Folder", you will get debug text on the RHS of
the screen.
You will see there is an XML hierarchy. That is parsed by another
function in the page to write out the hierarchy. That is working
fine. The only functions that I am having trouble with are
"searchForFolders()" and "hideShowFolder()".
Oh yeah, a lot of this is MS only script, so you'll need IE 5.5 or
above to view it correctly.
Thanks for any help you can give me.
Matt.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<LINK REL="stylesheet" TYPE="text/css" HREF="treecontrol.css">
<title>Tree Control</title>
<XML ID="hierXml">
<main>
<tNode type="folder" label="Best Buyers">
<tNode type="object" label="Gold"/>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Gold"/>
<tNode type="object" label="Bronze"/>
</tNode>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Bronze"/>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Silver"/>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Bronze"/>
<tNode type="object" label="Gold"/>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Gold"/>
<tNode type="object" label="Gold"/>
</tNode>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Gold"/>
<tNode type="object" label="Gold"/>
</tNode>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Gold"/>
</tNode>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Gold"/>
</tNode>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Gold"/>
</tNode>
</tNode>
</tNode>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Gold"/>
</tNode>
</tNode>
</tNode>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Bronze"/>
</tNode>
</tNode>
</main>
</XML>
</head>
<body bgcolor="#cccccc" onload="getXml()">
<script src="treeControlFns.js">
</script>
<script>
closeFolderArray = new Array();
function hideShowFolder(ref)
{
//use pixelTop property to move DIVs up and down
//
//ref.style.pixelTop += 10;
//use visibility to hide DIVs
//
//ref.style.visibility = "hidden";
//the children of the parent of the ref is all the folder/object
DIVs
//
//ref.parentNode.childNodes.length;
allNodes = ref.parentNode.childNodes;
moveInc = 0;
oneDivHeight = ref.offsetHeight;
moveArr = new Array();
//break up the clicked ref id into an array
clickedId = ref.id.split("_");
//lets find all the nested folders beneath that which was clicked
//anything that starts with the same array as the folder clicked
//and is a folder, will have to be closed
closeFolderArray = new Array();
closeFolderArray[closeFolderArray.length] = ref.id;
debug.innerHTML = "";
searchForFolders(clickedId);
debug.innerHTML += closeFolderArray.join("<BR>");
sffInd = 0;
}
sffInd = 0;
function searchForFolders(startId)
{
//indicate which iteration of sff we are in
sffInd++;
debug.innerHTML += "we are in iteration: "+sffInd+"\nstarted with:
"+startId+"<br><br>";
pushInd = 1;
startId[startId.length] = pushInd;
makeId = null;
makeId = startId.join("_");
if (!visArray[makeId])
{
return false;
}
while (visArray[makeId])
{
debug.innerHTML += "testing with "+makeId+"<br><br>";
//test to see if present id is that of a folder
if (document.all(makeId).getAttribute("objtype") == "folder")
{
closeFolderArray[closeFolderArray.length] = makeId;
debug.innerHTML += "add "+makeId+" in iteration
"+sffInd+"<br><br>";
}
//call next iteration of sff to look for child folders of present
object
if (visArray[makeId+"_1"])
{
tempArr = makeId.split("_");
debug.innerHTML += "startId is now "+startId+" and tempArr is
"+tempArr+"<br><br>";
//searchForFolders(tempArr);
}
//continue incrementing
startId[startId.length-1] = ++pushInd;
makeId = startId.join("_");
}
//return;
}
//active object
activeObj = "";
//graphic elements for folder points and object points
folderPrefix = " --[F] ";
objectPrefix = " ----(o) ";
lastFolderPrefix = " --[F] ";
lastObjectPrefix = " ----(o) ";
objectDivStart = "<div objtype=object style=\"visibility:visible\"
onclick=\"objectClick(this);\" class=\"objectDiv\" ";
folderDivStart = "<div objtype=folder objstate=open
style=\"visibility:visible\" class=\"folderDiv\"
onclick=\"hideShowFolder(this)\" ";
divMid = " />";
textSpanStart="<span class=\"textSpan\" id=\"";
textSpanMid="\" />";
textSpanEnd = "</span>";
holderText = "";
id = "a_";
blankGif = "--";
iGif = "";
visArray = new Array();
//xml parsing and screen rendering
function getXml()
{
//if xml is available, call recurser function on the main node
if (hierXml.readyState == "complete")
{
mainNode = hierXml.childNodes(0);
mainChildInc = 0;
curMainNode = mainNode.childNodes(0);
recurser(curMainNode,"","",1);
}
printer.innerHTML = holderText;
}
function recurser(node,gfxPrefix,prefixStr,siblingCount)
{
//loop through sibling nodes
while (node)
{
//set the prefix string, which becomes the id and the map
//back to the XML object
localPrefixStr = prefixStr+siblingCount;
//set graphical vars based on what type of node this is
//and whether it is the last sibling
if (node.getAttribute("type") == "folder")
{
itemPrefix = (node == node.parentNode.lastChild) ?
lastFolderPrefix : folderPrefix;
itemDivStart = folderDivStart;
}
else
{
itemPrefix = (node == node.parentNode.lastChild) ?
lastObjectPrefix : objectPrefix;
itemDivStart = objectDivStart;
}
itemGfxPrefix = (node == node.parentNode.lastChild) ?
gfxPrefix+blankGif : gfxPrefix+iGif;
visArray["a"+localPrefixStr] = "visible";
if (node.getAttribute("type") == "object")
{
}
//add HTML to display this node
holderText += itemDivStart+"id=\"a"+localPrefixStr+"\""+divMid+gfxPrefix+itemPrefix+textSpanStart+"span_a"+localPrefixStr+textSpanMid+node.getAttribute("label")+"
("+localPrefixStr+")"+textSpanEnd+"</div>";
//call this function to process any child nodes of the current
node
recurser(node.firstChild,itemGfxPrefix,localPrefixStr+"_",1);
//increment node and sibling count for while loop
node = node.nextSibling;
siblingCount++;
}
}
</script>
<table>
<tr>
<td>
<div class="instructions">
<ul>
<li>string in parantheses is the ID that indicates a node's
hierarchical placement
<li>selected object ID: <span style="font-weight:bold" id="counter">
</span>
<ul>
</div>
<div class="printer" id="printer">
</div>
</td>
<td>
<div id="debug">
</div>
</td>
</tr>
<table>
<br>
<br>
<br>
</body>
</html>
I'm having trouble with a recursive function.
The function is supposed to identify nested folders in a hierarchical
folder structure.
The function "searchForFolders()" is supposed to traverse sibling
nodes in each iteration, and for each sibling node, it calls itself
again, to see if there are child nodes of the current sibling.
The code below contains the function in question. For simplicity's
sake, I have replaced the images with text characters. It doesn't
look as good, but you should be able to see how the nesting works.
When you click on a "Folder", you will get debug text on the RHS of
the screen.
You will see there is an XML hierarchy. That is parsed by another
function in the page to write out the hierarchy. That is working
fine. The only functions that I am having trouble with are
"searchForFolders()" and "hideShowFolder()".
Oh yeah, a lot of this is MS only script, so you'll need IE 5.5 or
above to view it correctly.
Thanks for any help you can give me.
Matt.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<LINK REL="stylesheet" TYPE="text/css" HREF="treecontrol.css">
<title>Tree Control</title>
<XML ID="hierXml">
<main>
<tNode type="folder" label="Best Buyers">
<tNode type="object" label="Gold"/>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Gold"/>
<tNode type="object" label="Bronze"/>
</tNode>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Bronze"/>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Silver"/>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Bronze"/>
<tNode type="object" label="Gold"/>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Gold"/>
<tNode type="object" label="Gold"/>
</tNode>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Gold"/>
<tNode type="object" label="Gold"/>
</tNode>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Gold"/>
</tNode>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Gold"/>
</tNode>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Gold"/>
</tNode>
</tNode>
</tNode>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Gold"/>
</tNode>
</tNode>
</tNode>
<tNode type="folder" label="Best Buyers - Sweepstakes">
<tNode type="object" label="Bronze"/>
</tNode>
</tNode>
</main>
</XML>
</head>
<body bgcolor="#cccccc" onload="getXml()">
<script src="treeControlFns.js">
</script>
<script>
closeFolderArray = new Array();
function hideShowFolder(ref)
{
//use pixelTop property to move DIVs up and down
//
//ref.style.pixelTop += 10;
//use visibility to hide DIVs
//
//ref.style.visibility = "hidden";
//the children of the parent of the ref is all the folder/object
DIVs
//
//ref.parentNode.childNodes.length;
allNodes = ref.parentNode.childNodes;
moveInc = 0;
oneDivHeight = ref.offsetHeight;
moveArr = new Array();
//break up the clicked ref id into an array
clickedId = ref.id.split("_");
//lets find all the nested folders beneath that which was clicked
//anything that starts with the same array as the folder clicked
//and is a folder, will have to be closed
closeFolderArray = new Array();
closeFolderArray[closeFolderArray.length] = ref.id;
debug.innerHTML = "";
searchForFolders(clickedId);
debug.innerHTML += closeFolderArray.join("<BR>");
sffInd = 0;
}
sffInd = 0;
function searchForFolders(startId)
{
//indicate which iteration of sff we are in
sffInd++;
debug.innerHTML += "we are in iteration: "+sffInd+"\nstarted with:
"+startId+"<br><br>";
pushInd = 1;
startId[startId.length] = pushInd;
makeId = null;
makeId = startId.join("_");
if (!visArray[makeId])
{
return false;
}
while (visArray[makeId])
{
debug.innerHTML += "testing with "+makeId+"<br><br>";
//test to see if present id is that of a folder
if (document.all(makeId).getAttribute("objtype") == "folder")
{
closeFolderArray[closeFolderArray.length] = makeId;
debug.innerHTML += "add "+makeId+" in iteration
"+sffInd+"<br><br>";
}
//call next iteration of sff to look for child folders of present
object
if (visArray[makeId+"_1"])
{
tempArr = makeId.split("_");
debug.innerHTML += "startId is now "+startId+" and tempArr is
"+tempArr+"<br><br>";
//searchForFolders(tempArr);
}
//continue incrementing
startId[startId.length-1] = ++pushInd;
makeId = startId.join("_");
}
//return;
}
//active object
activeObj = "";
//graphic elements for folder points and object points
folderPrefix = " --[F] ";
objectPrefix = " ----(o) ";
lastFolderPrefix = " --[F] ";
lastObjectPrefix = " ----(o) ";
objectDivStart = "<div objtype=object style=\"visibility:visible\"
onclick=\"objectClick(this);\" class=\"objectDiv\" ";
folderDivStart = "<div objtype=folder objstate=open
style=\"visibility:visible\" class=\"folderDiv\"
onclick=\"hideShowFolder(this)\" ";
divMid = " />";
textSpanStart="<span class=\"textSpan\" id=\"";
textSpanMid="\" />";
textSpanEnd = "</span>";
holderText = "";
id = "a_";
blankGif = "--";
iGif = "";
visArray = new Array();
//xml parsing and screen rendering
function getXml()
{
//if xml is available, call recurser function on the main node
if (hierXml.readyState == "complete")
{
mainNode = hierXml.childNodes(0);
mainChildInc = 0;
curMainNode = mainNode.childNodes(0);
recurser(curMainNode,"","",1);
}
printer.innerHTML = holderText;
}
function recurser(node,gfxPrefix,prefixStr,siblingCount)
{
//loop through sibling nodes
while (node)
{
//set the prefix string, which becomes the id and the map
//back to the XML object
localPrefixStr = prefixStr+siblingCount;
//set graphical vars based on what type of node this is
//and whether it is the last sibling
if (node.getAttribute("type") == "folder")
{
itemPrefix = (node == node.parentNode.lastChild) ?
lastFolderPrefix : folderPrefix;
itemDivStart = folderDivStart;
}
else
{
itemPrefix = (node == node.parentNode.lastChild) ?
lastObjectPrefix : objectPrefix;
itemDivStart = objectDivStart;
}
itemGfxPrefix = (node == node.parentNode.lastChild) ?
gfxPrefix+blankGif : gfxPrefix+iGif;
visArray["a"+localPrefixStr] = "visible";
if (node.getAttribute("type") == "object")
{
}
//add HTML to display this node
holderText += itemDivStart+"id=\"a"+localPrefixStr+"\""+divMid+gfxPrefix+itemPrefix+textSpanStart+"span_a"+localPrefixStr+textSpanMid+node.getAttribute("label")+"
("+localPrefixStr+")"+textSpanEnd+"</div>";
//call this function to process any child nodes of the current
node
recurser(node.firstChild,itemGfxPrefix,localPrefixStr+"_",1);
//increment node and sibling count for while loop
node = node.nextSibling;
siblingCount++;
}
}
</script>
<table>
<tr>
<td>
<div class="instructions">
<ul>
<li>string in parantheses is the ID that indicates a node's
hierarchical placement
<li>selected object ID: <span style="font-weight:bold" id="counter">
</span>
<ul>
</div>
<div class="printer" id="printer">
</div>
</td>
<td>
<div id="debug">
</div>
</td>
</tr>
<table>
<br>
<br>
<br>
</body>
</html>