/*
* (c) 2005-2009 Richard Cowin (http://openrico.org)
* (c) 2005-2009 Matt Brown (http://dowdybrown.com)
*
* Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
* file except in compliance with the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software distributed under the
* License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND,
* either express or implied. See the License for the specific language governing permissions
* and limitations under the License.
*/
// Rico Tree Control
// Requires prototype.js and ricoCommon.js
// Data for the tree can be 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 = function(id,url,options) {
this.initialize(id,url,options);
};
Rico.TreeControl.prototype = {
/**
* @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
- Rico event handle 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
- class name to display img, default="rico-icon rico-doc" ('none'=no leaf icon)
*
*/
initialize: function(id,url,options) {
Rico.extend(this, new Rico.Popup());
Rico.extend(this.options, {
ignoreClicks:true,
nodeIdDisplay:'none',
showCheckBox: false,
showFolders: false,
showPlusMinus: true,
showLines: true,
defaultAction: Rico.eventHandle(this,'nodeClick'),
height: '300px',
width: '300px',
leafIcon: 'rico-icon rico-doc'
});
Rico.extend(this.options, options || {});
this.id=id;
this.dataSource=url;
this.close=this.closePopup;
this.hoverSet = new Rico.HoverSet([]);
},
atLoad : function() {
this.treeDiv=document.createElement("div");
this.treeDiv.id=this.id;
this.treeDiv.className='ricoTree';
if (Rico.theme.treeContent) Rico.addClass(this.treeDiv,Rico.theme.treeContent);
this.treeDiv.style.height=this.options.height;
this.treeDiv.style.width=this.options.width;
this.createContainer();
this.content.className=Rico.theme.tree || 'ricoTreeContainer';
this.content.appendChild(this.treeDiv);
if (this.options.showCheckBox) {
this.buttonDiv=document.createElement("div");
this.buttonDiv.style.width=this.options.width;
this.buttonDiv.className='ricoTreeButtons';
if (Rico.getStyle(this.container,'position')=='absolute') {
var span=document.createElement("span");
span.innerHTML=RicoTranslate.getPhraseById('treeSave');
Rico.setStyle(span,{'float':'left',cursor:'pointer'});
this.buttonDiv.appendChild(span);
Rico.eventBind(span, 'click', Rico.eventHandle(this,'saveSelection'));
}
var span=document.createElement("span");
span.innerHTML=RicoTranslate.getPhraseById('treeClear');
Rico.setStyle(span,{'float':'right',cursor:'pointer'});
this.buttonDiv.appendChild(span);
this.content.appendChild(this.buttonDiv);
Rico.eventBind(span, 'click', Rico.eventHandle(this,'clrCheckBoxEvent'));
}
this.close();
},
setTreeDiv: function(divId) {
this.treeDiv = Rico.$(divId);
this.openPopup = function() {};
},
open: function() {
this.openPopup();
if (this.treeDiv.childNodes.length == 0 && this.dataSource) {
this.loadXMLDoc();
}
},
loadXMLDoc: function(branchPin) {
var parms = { id: this.id };
if (branchPin) parms.Parent=branchPin;
Rico.log('Tree loadXMLDoc: '+this.id);
var self=this;
new Rico.ajaxRequest(this.dataSource, {parameters:parms, method:'get', onComplete: function(request) { self.processResponse(request); } });
},
domID: function(nodeID,part) {
return 'RicoTree_'+part+'_'+this.id+'_'+nodeID;
},
processResponse: function(request) {
var response = request.responseXML.getElementsByTagName("ajax-response");
if (response == null || response.length != 1) return;
var rowsElement = response[0].getElementsByTagName('rows')[0];
var trs = rowsElement.getElementsByTagName("tr");
var rowdata=[];
for (var i=0; i < trs.length; i++) {
var cells = trs[i].getElementsByTagName("td");
if (cells.length < 5) continue;
var content=[];
content[5]=this.options.leafIcon;
for (var j=0; j1) {
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("div");
img.name=nodeId;
img.style.cursor='pointer';
Rico.eventBind(img, 'click', Rico.eventHandle(this,'clickBranch'));
img.className='rico-icon rico-tree-'+prefix+"p"+suffix;
row.insertCell(-1).appendChild(img);
} else if (this.options.showLines) {
var img = document.createElement("div");
img.className='rico-icon rico-tree-node'+suffix;
row.insertCell(-1).appendChild(img);
}
if (this.options.showFolders && (isContainer || (leafIcon && leafIcon!='none'))) {
var img = document.createElement("div");
if (!isContainer) {
img.className=leafIcon;
} else {
img.name=nodeId;
img.style.cursor='pointer';
Rico.eventBind(img, 'click', Rico.eventHandle(this,'clickBranch'));
img.className='rico-icon rico-folderclosed';
}
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)';
Rico.eventBind(span, 'click', this.options.defaultAction);
}
this.hoverSet.add(span);
} 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=Rico.eventElement(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