what does the following code do?

1. Positions the debug window to the right

2. Keeps a test button underneath the debug window

3. Creates a dynamic tree window on the left

4. Creates a text window underneath

5. Reads a URL for getting a list of folders and paints them in the tree window

6. Expands and collapses the tree using dynamic data

7. Tree window scrolls

To be done

1. when an item in a folder is selected, put the text in the text window

2. Simulate an outlook kind of interface

Special Note

To make the code fit, at a couple of places, I have broken long lines between quotes. If you want to try this code you have to reattach those lines.

Code sample now

<!--
************************************************
* Setup the development pad
************************************************
-->   
<canvas height="500" width="1000" debug="true">

<debug x="450" y="0" height="300"/>

<button x="550" y="320" onclick="processButton()">Show Alert</button>

<!--
************************************************
* Include tree base classes
************************************************
-->   
<include href="lz/tree.lzx"/>

<!--
************************************************
* Get hold of a dataset
************************************************
-->   
<dataset type="http" name="foldersDataSet" 
    request="true"
    src="http://localhost:8181/akc/display"
   querystring="url=ShowFiledReportsViewJSPURL
   		&ownerUserId=ccp
		&aspire_output_format=object-xml"/>


   
<dataset type="http" name="folderDetailsDS" 
    request="false"
    src="http://localhost:8181/akc/display"
   />
   
<dataset type="http" name="OnlyFoldersDS" 
    request="true"
    src="http://localhost:8181/akc/display"
   querystring="url=ShowFiledReportsViewJSPURL
   		&ownerUserId=ccp
		&aspire_output_format=user-aspire-templates
		&akc_templatereportId=745"/>
   
   

<dataset name="sampleDS">
   <e1>e1text</e1>
   <e2>e2text</e2>
   <e2>e2text</e2>
   <e2>e2text</e2>
</dataset>

<dataset name="fromDS">
   <e1>e1text</e1>
   <e2>e2text</e2>
</dataset>   
   
<dataset name="toDS">
   <e3>e1text</e3>
   <e4>e2text</e4>
</dataset>   

<dataset name="foldersDS1">
<folder name="f1">
   <file id="i1">
      <shortname>ddd</shortname>
      <description>abc</description>
   </file>
   <file id="i1">
      <shortname>ddd</shortname>
      <description>abc</description>
   </file>
</folder>
<folder name="f2">
   <file id="i2">
      <shortname>ddd</shortname>
      <description>abc</description>
   </file>
   <file id="i2">
      <shortname>ddd</shortname>
      <description>abc</description>
   </file>
   <file id="i2">
      <shortname>A root filename</shortname>
      <description>abc</description>
   </file>
   <folder name="f1">
      <file id="i1">
         <shortname>ddd</shortname>
         <description>abc</description>
      </file>
      <file id="i1">
         <shortname>ddd</shortname>
         <description>abc</description>
      </file>
   </folder>
</folder>
<file id="i2">
   <shortname>A root filename</shortname>
   <description>abc</description>
</file>
</dataset>



<!--
************************************************
* A dynamic tree
************************************************
<simplelayout axis="x" spacing="200"/>
-->   
<window width="400" height="200" x="0" resizable="true" title="Knowled Folders for DCE">
   <view name="outerview" width="${immediateParent.width}" 
   		height="${immediateParent.height}" clip="true">
   <view width="${treeroot.width}" height="${treeroot.height}" >
      <simplelayout axis="y" spacing="10"/>
      <tree name="treeroot" datapath="OnlyFoldersDS:/" icon="null" 
	  		showroot="false" autoscroll="true">
         <tree  datapath="*" text="${getText(this)}" recurse="true" 
		 		autoscroll="true">
            <method event="onopen">
               openFolder(this);
            </method>
         </tree>
         </tree>
     </view>
     <scrollbar/>
     <scrollbar axis="x" />
     </view>
</window>
<window width="400" height="200" y="220" title="See your item description here">
<text>No item selected</text>
</window>

<script>
function resizeRootView(parentWindow)
{
   Debug.write("Expanding the root view");
   parentWindow.outerview.width=parentWindow.width - 20;
   parentWindow.outerview.height=parentWindow.height;
}
</script>

<script>
function openFolder(treeNode)
{
   var dpath = treeNode.getAttribute("datapath");
   var folderName = dpath.getNodeAttribute("name");
   Debug.write("Open folder:" + folderName);
   
   var numOfChildren = dpath.getNodeCount();
   if (numOfChildren == 0)
   {
      Debug.write("There are no children to this node");
      var fds = canvas.folderDetailsDS;
      
      //var childQueryString = getQueryStringForFolderName(folderName);
      var childQueryParam = getQueryParamForFolderName(folderName);
      Debug.write("Setting query string:" + childQueryParam.serialize());
      
      fds.setQueryString(childQueryParam);
      fds.doRequest();
      
      printDataSet(fds);
      copyChildrenDP(fds,dpath);
      printDataSet(canvas.OnlyFoldersDS);
      treeNode.createChildTrees();
   }
}


function getText(treeNode)
{
   var dpath = treeNode.getAttribute("datapath");
   var nameAttribute = dpath.getAttribute("name");
   var text = dpath.getNodeText()
   var name = dpath.getNodeName();
   Debug.write("Processing node:" + name);
   
   var elementName="none";
   
   if (name == "folder")
   {
      elementName = dpath.getNodeAttribute("name");
   }
   else if (name == "file")
   {
      elementId = dpath.getNodeAttribute("id");
      treeNode.setAttribute("isleaf",true);
       var filename = dpath.xpathQuery("shortname/text()");
      Debug.write(filename);
      return filename;
   }
   return elementName;
}
</script>

<!--
************************************************
* Alert support
************************************************
-->   
<alert name="myalert" width="100" y="330">
   hi
</alert>

<script>

function getQueryStringForFolderName(folderName)
{
   qs = "url=NotesMPURL&ownerUserId=dce&folderName=";
   qs += folderName;
   qs += "&aspire_output_format=object-xml";
   return qs;
}

function getQueryParamForFolderName(folderName)
{
   var qs = new LzParam();
   qs.addValue("url","NotesMPURL",true);
   qs.addValue("ownerUserId","ccp",true);
   qs.addValue("folderName",folderName,true);
   qs.addValue("aspire_output_format","user-aspire-templates",true);
   qs.addValue("akc_templatereportid","746",true);
   return qs;
}
function treeNodeOpen1(OpenedNode)
{
}

function treeNodeOpen(OpenedNode)
{
   Debug.write("A tree node is open");
   Debug.write("Opened node is:" + OpenedNode.getAttribute("text"));
   
   //If the tree node has any children don't open it any more
   var leafNode = OpenedNode.getAttribute("isleaf");
   Debug.write("isleafnode is:" + leafNode);
   
   
   //Get a new datapath and attach it to this node
   //OpenedNode.setAttribute("datapath",
   var curXPath = OpenedNode.getAttribute("datapath").getAttribute("xpath");
   Debug.write("The data path:" + curXPath);
   if (curXPath == "*")
   {
      OpenedNode.setAttribute("datapath","sampleDS:/*");
      OpenedNode.setAttribute("recurse","true");
      OpenedNode.setAttribute("text","Hello");
   }
   else
   {
   }
}

function printDataSet(dataset)
{
   Debug.write(dataset.serialize());
}

function processButton()
{
   //printDataSet(canvas.sampleDS);
   //duplicateChildren(canvas.foldersDS1, canvas.sampleDS);
   //printDataSet(canvas.sampleDS);
   //Debug.write(getQueryString());
   testCopyChildrenUsingXPath();
}

function getQueryString()
{
    s1 = "url=NotesMPURL";
   s2 = "&folderName=Bugs-Reported";
   s3 = "&aspire_output_format=user-aspire-templates";
   s4 = "&akc_templatereportid=746";
   s5 = "&ownerUserId=ccp";
   return s1 + s2 + s3 + s4 + s5;
}
/*
*********************************************************
* Deep copy all the children "srcDataNode" 
* as children of the "targetDataNode"
*********************************************************
*/
function copyChildren(srcDataNode, targetDataNode)
{
   var nextChild = srcDataNode.getFirstChild();
   var firstTargetChild = targetDataNode.getFirstChild();
   while(nextChild != null)
   {
      targetDataNode.insertBefore(nextChild.cloneNode(true),firstTargetChild);
      nextChild = nextChild.getNextSibling();
   }
}

function copyChildrenDP(srcDataNode, targetDataPath)
{
   //srcDataNode is a data set
   Debug.write("Get the source data pointer");
   var rootDP = srcDataNode.getPointer();

   var numberOfChildren = rootDP.getNodeCount();
   Debug.write("There are " + numberOfChildren + " children in this data set");
   
   var hasChild = rootDP.selectChild();
   while (hasChild != false)
   {
      Debug.write("Adding a node");
      targetDataPath.addNodeFromPointer(rootDP);
      hasChild = rootDP.selectNext();
   }
}

function copyChildrenUsingXPath(parentXPath, targetDataPointer)
{
   Debug.write("Creating a new data pointer");
   var srcDataPointer = new LzDatapointer();

   Debug.write("setting its xpath");
   srcDataPointer.setAttribute("xpath",parentXPath);

   Debug.write("Number of children are:" + srcDataPointer.getNodeCount());

   var hasChild = srcDataPointer.selectChild();

   while (hasChild != false)
   {
      Debug.write("Adding a node");
      targetDataPointer.addNodeFromPointer(srcDataPointer);
      hasChild = srcDataPointer.selectNext();
   }
   
}

function testCopyChildrenUsingXPath()
{
   var targetDataPointer = canvas.toDS.getPointer();
   copyChildrenUsingXPath("fromDS:/",targetDataPointer);
   printDataSet(canvas.toDS);
}

function copyChildrenDP1(srcDataNode, targetDataPath)
{
   //srcDataNode is a data set
   Debug.write("Get the source data pointer");
   var rootDP = srcDataNode.getPointer();

   var numberOfChildren = rootDP.getNodeCount();
   rootDP.setXPath("/*");
   targetDataPath.addNodeFromPointer(rootDP);
}
</script>



<method name="hi">
   canvas.myalert.open();
</method>

<!--
************************************************
* comments begin
************************************************
-->   
<!-- begin comments

end comments -->
<!--
************************************************
* comments end
************************************************
-->   
</canvas>