Wookiees
Vulcans
Those ones from "Alien" that hug your face
Rancors
Klingons
Those ones from "Alien" that come out of your stomach
Kittens
Puppies
Dolphins
Bears
Tigers
Raccoons
In this sample, a tree with the name of 'myTree' is created with some initial properties. The function argument of createControl is called when the widget renders, and a dataset is added to it.
==== Script Example ====
Create the control...
App.createControl(
'tree_1',
'tree',
{
property:'rows',
'toggleEffect':'slideToggle'
},
function()
{
var d = [
{id:100,classname:'check',children:[
{id:101,title:'foo1',children:[
{id:102,title:'foo2'}
]},
{id:104,title:'foo4'},
{id:105,title:'foo5'}
]},
{id:106,title:'foo6',children:[
{id:107,title:'foo7',children:[
{id:108,title:'foo8'},
{id:109,title:'foo9'},
{id:110,title:'foo10'},
{id:111,title:'foo11'}
]},
{id:112,title:'foo12'},
{id:113,title:'foo13'}
]},
{id:114,title:'foo14'}
];
this.render({'rows':d});
}
);
Get the handle to an instance of the control and save it to a local variable and set an Entourage Message listener to render the iterator using an arbitrary payload.
var controlInstance = null;
App.getControl('tree_2','tree',function()
{
controlInstance = this;
});
$MQL('l:reload_data',function(msg)
{
var d = [
{id:100,classname:'check',children:[
{id:101,title:'foo1',children:[
{id:102,title:'foo2'}
]},
{id:104,title:'foo4'},
{id:105,title:'foo5'}
]},
{id:106,title:'foo6',children:[
{id:107,title:'foo7',children:[
{id:108,title:'foo8'},
{id:109,title:'foo9'},
{id:110,title:'foo10'},
{id:111,title:'foo11'}
]},
{id:112,title:'foo12'},
{id:113,title:'foo13'}
]},
{id:114,title:'foo14'}
];
controlInstance.render({'rows':d});
});
==== Options ====
The tree control is made up of a container div and may contain any number of nested divs which represent nodes in the tree. The control tag on the div indicates what kind of widget the div will become. The widget identity can accept the following initial parameters...
Initial options supported by the widget.
^ Option ^ Description ^ Default ^ Type ^
| property | Data property for extracting tree data from a message | null | String |
| toggleEffect | Effect for opening and closing tree folders" | null | String |
| clickMessage | Message to send when a tree node is clicked" | null | String |
| theme | Theme for tree | basic | String |
==== Actions/JavaScript API ====
Functions either accept a single argument such as an integer or a string, otherwise they accept a one dimensional object literal. Any function that can be called as an action accepts the same parameters but in the action parameter format.
^ Function ^ Action ^ Description|
| render(obj) | render | Renders the tree with a specified dataset. If this function is called as an action, the dataset is retrieved from the message that invoked it.|
| execute(obj) | execute | Rebuilds the tree using the initial settings, and any additional that are specified from a either a message or an object. |
| addNode(obj) | addNode[] | See notes below this table. |
The addNode function accepts an object literal with two members; “parent”, an integer which should identify the host of the new node. And “node”, an object literal whith three members; "id", an integer which will be the new node identifier. "title", a string to visually represent the node. And "children", an array of the later two objects, and possibly the third). Here's an example...
$MQ('l:add', { parent:null, node:{id:200,title:'1st new node', children:[{ id:201, title:'new node child'}]}});
If this function is called as an action, this data may be provided by an Entourage message, as demonstrated above.