// Rico Tree Control
// by Matt Brown
// Oct 2006, rewritten Jan 2008
// email: dowdybrown@yahoo.com
// leafIcon logic added by Marco Catunda
// Requires prototype.js and ricoCommon.js
// Data for the tree is obtained via AJAX requests
// Each record in the AJAX response should contain 5 or 6 cells:
// cells[0]=parent node id
// cells[1]=node id
// cells[2]=description
// cells[3]=L/zero (leaf), C/non-zero (container)
// cells[4]=0->not selectable, 1->selectable (use default action), otherwise the node is selectable and cells[4] contains the action
// cells[5]=leafIcon (optional)
Rico.TreeControl = Class.create(
/** @lends Rico.TreeControl# */
{
/**
* @class Implements a pop-up tree control.
* @extends Rico.Popup
* @constructs
* @param id unique identifier
* @param url data source
* @param options object may contain any of the following:
* - nodeIdDisplay
- first, last, tooltip, or none? default=none
* - showCheckBox
- show checkbox next to each item? default=false
* - showFolders
- show folder icons? default=false
* - showPlusMinus
- show +/- icons to open/close branches? default=true
* - showLines
- show vertical lines connecting each level? default=true
* - defaultAction
- function to call when user clicks on an item, default is to call returnValue method
* - height
- control height? default=300px
* - width
- control width? default=300px
* - leafIcon
- url to img, default=doc.gif ('none'=no leaf icon)
*
*/
initialize: function(id,url,options) {
Object.extend(this, new Rico.Popup({ignoreClicks:true}));
Object.extend(this.options, {
nodeIdDisplay:'none',
showCheckBox: false,
showFolders: false,
showPlusMinus: true,
showLines: true,
defaultAction: this.nodeClick.bindAsEventListener(this),
height: '300px',
width: '300px',
leafIcon: Rico.imgDir+'doc.gif'
});
Object.extend(this.options, options || {});
this.id=id;
this.dataSource=url;
this.close=this.closePopup;
},
atLoad : function() {
var imgsrc = ["node.gif","nodelast.gif","folderopen.gif","folderclosed.gif"];
// preload images
for (var i=0;i1) {
var tdParent=parentNode.getElementsByTagName('td');
for (var i=0; i0) {
var suffix=isLast && this.options.showLines ? 'last' : '';
var prefix=this.options.showLines ? 'node' : '';
if (this.options.showPlusMinus && isContainer) {
var img = document.createElement("img");
img.name=nodeId;
img.style.cursor='pointer';
img.onclick=this.clickBranch.bindAsEventListener(this);
img.src=Rico.imgDir+prefix+"p"+suffix+".gif";
row.insertCell(-1).appendChild(img);
} else if (this.options.showLines) {
var img = document.createElement("img");
img.src=Rico.imgDir+"node"+suffix+".gif";
row.insertCell(-1).appendChild(img);
}
if (this.options.showFolders && (isContainer || (leafIcon && leafIcon!='none'))) {
var img = document.createElement("img");
if (!isContainer) {
img.src=leafIcon;
} else {
img.name=nodeId;
img.style.cursor='pointer';
img.onclick=this.clickBranch.bindAsEventListener(this);
img.src=Rico.imgDir+"folderclosed.gif";
}
row.insertCell(-1).appendChild(img);
}
}
if (isSelectable && this.options.showCheckBox) {
var chkbx=document.createElement("input");
chkbx.type="checkbox";
chkbx.value=nodeId;
row.insertCell(-1).appendChild(chkbx);
}
if (isSelectable && !this.options.showCheckBox) {
var span=document.createElement('a');
if (typeof isSelectable=='string') {
span.href=isSelectable;
} else {
span.href='javascript:void(0)';
span.onclick=this.options.defaultAction;
}
} else {
var span=document.createElement('p');
}
span.id=this.domID(nodeId,'Desc');
span.className='ricoTreeLevel'+level;
switch (this.options.nodeIdDisplay) {
case 'last': nodeDesc+=' ('+nodeId+')'; break;
case 'first': nodeDesc=nodeId+' - '+nodeDesc; break;
case 'tooltip': span.title=nodeId; break;
}
span.appendChild(document.createTextNode(nodeDesc));
row.insertCell(-1).appendChild(span);
var parent=parentChildren || this.treeDiv;
parent.appendChild(tab);
parent.appendChild(div);
},
nodeClick: function(e) {
var node=Event.element(e);
if (this.returnValue) {
var t=this.domID('','Desc');
this.returnValue(node.id.substr(t.length),node.innerHTML);
}
this.close();
},
saveSelection: function(e) {
if (this.returnValue) {
this.returnValue(this.getCheckedItems());
}
this.close();
},
getCheckedItems: function() {
var inp=this.treeDiv.getElementsByTagName('input');
var vals=[];
for (var i=0; i