Class RapidContext.Widget.Tree

Extends: RapidContext.Widget

The tree widget class. Used to provide a dynamic tree with expandable tree nodes, using a number of <div> HTML elements.

Source code: RapidContext_Widget_Tree.js

Class Summary
 
Creates a new tree widget.
Method Summary
 
addChildNode(child)
Adds a single child tree node widget to this widget.
 
addPath(path)
Adds a path to the tree as a recursive list of child nodes.
 
collapseAll(depth)
Recursively collapses all nodes.
 
expandAll(depth)
Recursively expands all nodes.
 
findByPath(path)
Searches for a tree node from the specified path.
 
findRoot(name)
Finds a root tree node with the specified name.
 
Marks this tree node and all child nodes recursively.
 
Removes all marked tree nodes.
 
Returns the currently selected tree node.
Methods borrowed from class RapidContext.Widget:
addAll, addClass, animate, blurAll, destroy, disable, enable, getChildNodes, hasClass, hide, isDisabled, isHidden, removeAll, removeChildNode, removeClass, setAttrs, setStyle, show, toggleClass, uid
Event Summary
 
Emitted when a tree node is collapsed.
 
Emitted when a tree node is expanded.
 
Emitted when a tree node is selected.
 
Emitted when a tree node selection is removed.
Class Detail
RapidContext.Widget.Tree(attrs)
Creates a new tree widget.
JavaScript:
var tree = RapidContext.Widget.Tree({ style: { width: "200px", height: "400px" } });
var root = RapidContext.Widget.TreeNode({ folder: true, name: "Root" });
var child = RapidContext.Widget.TreeNode({ name: "Child" });
root.addAll(child);
tree.addAll(root);
User Interface XML:
<Tree style="width: 200px; height: 400px;">
  <TreeNode name="Root">
    <TreeNode name="Child" />
  </TreeNode>
</Tree>
Parameters:
{Object} attrs
the widget and node attributes
{Boolean} attrs.hidden Optional
the hidden widget flag, defaults to false
{Widget} ... Optional
the child tree node widgets
Returns:
{Widget} the widget DOM node
Method Detail
addChildNode(child)
Adds a single child tree node widget to this widget.
Parameters:
{Widget} child
the tree node widget to add

removeAllMarked()
Removes all marked tree nodes. When adding or updating tree nodes, any node modified is automatically unmarked (e.g. by calling setAttrs on the tree nodes or addPath on the tree). This makes it easy to prune a tree after an update, by initially marking all tree nodes with markAll(), inserting or touching all nodes to keep, and finally calling this method to remove the remaining nodes.
tree.markAll();
tree.addPath(["Root", "Child"]);
...
tree.removeAllMarked();

markAll()
Marks this tree node and all child nodes recursively. When adding or updating tree nodes, any node modified is automatically unmarked (e.g. by calling setAttrs on the tree nodes or addPath on the tree). This makes it easy to prune a tree after an update, by initially marking all tree nodes, inserting or touching all nodes to keep, and finally calling removeAllMarked() to remove the remaining nodes.
tree.markAll();
tree.addPath(["Root", "Child"]);
...
tree.removeAllMarked();

{Widget} findRoot(name)
Finds a root tree node with the specified name.
Parameters:
{String} name
the root tree node name
Returns:
{Widget} the root tree node found, or null if not found

{Widget} findByPath(path)
Searches for a tree node from the specified path.
Parameters:
{Array} path
the tree node path (array of names)
Returns:
{Widget} the descendant tree node found, or null if not found

{Widget} selectedChild()
Returns the currently selected tree node.
Returns:
{Widget} the currently selected tree node, or null if no node is selected

expandAll(depth)
Recursively expands all nodes. If a depth is specified, expansions will not continue below that depth.
Parameters:
{Number} depth Optional
the optional maximum depth

collapseAll(depth)
Recursively collapses all nodes. If a depth is specified, only nodes below that depth will be collapsed.
Parameters:
{Number} depth Optional
the optional minimum depth

{Widget} addPath(path)
Adds a path to the tree as a recursive list of child nodes. If nodes in the specified path already exists, they will be used instead of creating new nodes.
Parameters:
{Array} path
the tree node path (array of names)
Returns:
{Widget} the last node in the path
Event Detail
onexpand()
Emitted when a tree node is expanded. This event signal contains the tree node as payload.

oncollapse()
Emitted when a tree node is collapsed. This event signal contains the tree node as payload.

onselect()
Emitted when a tree node is selected. It will be emitted after onunselect if another node was previously selected. This event signal contains the currently selected tree node as payload.

onunselect()
Emitted when a tree node selection is removed. It will be emitted before onselect if another node was previously selected. This event signal contains the previously selected tree node as payload.