tree-core.js

zapatec suite 最新版 20070204,非常棒的ajax widgets 工具包

 * @param nodeId {String} Node ID.
 * @param state {boolean} If true - expand node, false - collapse, null - toggle
 */
Zapatec.Tree.prototype.toggleItem = function(nodeId, state){
	var node = this.getNode(nodeId);

	if(!node){
		return;
	}

	if(state == true){
		node.expand();
	} else if(state == false){
		node.collapse();
	} else if(state == null){
		node.toggle();
	}
};

/**
 * Append a child to the start or end of the given parent. 
 * 
 * @param newChild {object} reference to an HTML element created of type LI or 
 *	JSON object with data.
 * @param parent {object} ID of parent node where new child will be added. If 
 *	null - add to top level.
 * @param atStart {boolean} optional. If true if the child going to be added 
 *	at the start of the parent.
 * @return newly created node
 * @type Object
 */
Zapatec.Tree.prototype.appendChild = function(newChild, parent, atStart) { 
	if(this.config.prevCompatible){
		// backward compartibility. Before 2.1 method signature was parent, newChild, atStart
		var tmp = parent;
		parent = newChild;
		newChild = tmp;
	}

	if(parent == null){
		parent = this.rootNode;
	} else {
		parent = this.getNode(parent);
	}

	if(parent == null){
		return null;
	}

	return parent.appendChild(newChild, atStart);
};
 
/** 
 * A new child can be inserted before some node.
 * @param newChild {object} New child node to be inserted into the tree. HTML 
 *	element or JSON object.
 * @param refChild {object} ID of the child node which the new child node will 
 *	be inserted before
 * @return newly created node
 * @type Object
 */
Zapatec.Tree.prototype.insertBefore = function(newChild, refChild) { 
	refChild = this.getNode(refChild);

	if(refChild == null){
		return null;
	}

	return refChild.insertBefore(newChild);
};

/**
 * A new child can be inserted after some nodes.
 * @param newChild {object} New child node to be inserted into the tree. HTML 
 *	element or JSON object.
 * @param refChild {object} ID of the child node which the new child node will 
 *	be inserted after.
 * @return newly created node
 * @type Object
 */
Zapatec.Tree.prototype.insertAfter = function(newChild, refChild) { 
	refChild = this.getNode(refChild);

	if(refChild == null){
		return null;
	}

	return refChild.insertAfter(newChild);
};
 
/** 
 * Remove child in the tree.
 * @param {object} ID of node.
 */
Zapatec.Tree.prototype.removeChild = function(oldChild) { 
	oldChild = this.getNode(oldChild);

	if(oldChild == null){
		return null;
	}

	oldChild.destroy();
};

/**
 * Call this function to collapse all items in the tree.
 */
Zapatec.Tree.prototype.collapseAll = function() {
	for(var ii = 0; ii < this.allNodes.length; ii++){
		this.allNodes[ii].collapse();
	}
};

/**
 * Expands tree up to given level.
 * @param level {int} level to expand.
 */
Zapatec.Tree.prototype.collapseToLevel = function(level) {
	for(var ii = 0; ii < this.allNodes.length; ii++){
		if(this.allNodes[ii].config.level > level){
			this.allNodes[ii].collapse();
		}
	}
};

/**
 * Call this function to expand all items in the tree.
 */
Zapatec.Tree.prototype.expandAll = function() {
	for(var ii = 0; ii < this.allNodes.length; ii++){
		this.allNodes[ii].expand();
	}
};

/**
 * Expands tree up to given level.
 * @param level {int} level to expand.
 */
Zapatec.Tree.prototype.expandToLevel = function(level) {
	this.expandToLevelNum = level;
	for(var ii = 0; ii < this.allNodes.length; ii++){
		if(this.allNodes[ii].config.level <= level){
			this.allNodes[ii].expand();
		}
	}
};

/**
* @private Function to load tree content on tree load from JSON source.
* @param objResponse {Object} Server response
*/
Zapatec.Tree.prototype.loadDataJson = function(objResponse){
	if(objResponse == null){
		return null;
	}

	// remove in next releases
	if(this.config.jsonLoadCallback){
		objResponse = this.config.jsonLoadCallback(objResponse);
	}

	this.rootNode.data = {};
	this.rootNode.data.children = objResponse;
	this.rootNode.createChildren();	

	for(var ii = 0; ii < this.rootNode.children.length; ii++){
		this.rootNode.children[ii].afterCreate();
	}

	// try to use saveState for loaded subtree
	if(this.config.saveState && !this.isSaveStateDone){
		var txt = Zapatec.Utils.getCookie("Zapatec.Tree-" + this.config.saveId);
		var node = this.getNode(txt, true);

		if (node){
			this.isSaveStateDone = true;
			node.sync();
		}
	}

};

/**
* @private Function to load tree content on tree load
* @param objResponse {Object} Server response
* TODO add format description
*/
Zapatec.Tree.prototype.loadDataXml = function(objSource){
	if(objSource == null || objSource.documentElement == null){
		return null;
	}

	var result = [];

	for(var jj = 0; jj < objSource.documentElement.childNodes.length; jj++){
		var tmp = Zapatec.Tree.Utils.convertXml2Json(objSource.documentElement.childNodes[jj]);

		if(tmp != null){
			result.push(tmp);
		}
	}

	return this.loadDataJson(result);
};

/**
* \internal Function to load tree content on tree load from HTML element
* @param objResponse {Object} Server response
* Format description: Common HTML list - &lt;UL&gt;&lt;LI&gt;...&lt;/LI&gt;...&lt;/UL&gt;
*/
Zapatec.Tree.prototype.loadDataHtml = function(objSource){
	if(objSource == null){
		return null;
	}

	var result = [];

	for(var jj = 0; jj < objSource.childNodes.length; jj++){
		var tmp = Zapatec.Tree.Utils.convertLi2Json(objSource.childNodes[jj], this.config.prevCompatible);

		if(tmp != null){
			result.push(tmp);
		}
	}

	return this.loadDataJson(result);
};

/**
* @deprecated
 * Call this function to create a html element with the optional element type specified.
 * By default, it is a &lt;LI&gt; element.
 * @param html {String} html of the node; may include &lt;UL&gt;, &lt;LI&gt;
 *	elements; user is responsible for the content of the html. 
 * @param type {String} type of the node to be created
*/
Zapatec.Tree.prototype.makeNode = function(html, type){
	if (!type) { 
		 type = "li"; //Make it a <LI> node if the type is not specified.
	}

	var node = Zapatec.Utils.createElement(type);

	if (html) {
		Zapatec.Transport.setInnerHtml({html: html, container: node}); //Assign the inner html of the node if it is specified.
	}
	
	return node;
};

/**
 * Destroy this instance.
 * @param leaveDOM {boolean} If true - DOM tree will be preserved
 */
Zapatec.Tree.prototype.destroy = function(leaveDOM){
	this.rootNode.destroy(true);
	this.container.zpTree = null;
	
	Zapatec.Tree.all[this.id] = null;
	
	this.allNodes = null;
	this.rootNode = null;
	
	if(!leaveDOM){
		Zapatec.Utils.destroy(this.container);
	}
	
	this.container = null;
	this.id2Obj = null;
	this.discard();
};

/**
 * @deprecated
 * Third party code can override this member in order to add an event handler
 * that gets called each time a tree item is selected. It receives a single
 * string parameter containing the item ID.
 */
Zapatec.Tree.prototype.onItemSelect = function() {};

/**
 * Returns JSON with current tree state. This object can be stored and used to
 *	create tree with completely same structure.
 * @return JSON with tree data.
 * @type Object
 */
Zapatec.Tree.prototype.getState = function(){
	var result = [];
	
	for(var ii = 0; ii < this.rootNode.children.length; ii++){
		result.push(this.rootNode.children[ii].getState());
	}

	return result;
};

/** 
 * Call to get the parent to append, insert or remove a child either at start 
 * or end position or in between two nodes of the (sub-)tree. 
 * 
 * @deprecated
 * @param id {String} -- id of the parent the new child will be added to or inserted before/at. 
 * @param mode {String} -- "I" is for inserting a child node. "R" is for removing a child node.  
 */ 
Zapatec.Tree.prototype.getParent = function(id, mode) { 
	return id;	
};

/**
 * @private
 * Create and attach events for keyboard navigation
 */
Zapatec.Tree.prototype.attachNavigation = function(){
	var self = this;
	
	// process clicks at tree container
	Zapatec.Utils.addEvent(this.container, "click", 
		function(){
			self.isActive = true; 
			self.isClicked = true;
		}
	);

	// process all document key hits
	// For IE we must use "keydown" instead of "keypress"
	Zapatec.Utils.addEvent(document, (Zapatec.is_ie ? "keydown" : "keypress"), 
		function(evt){return self.keyEvent(evt);}
	);
	
	// process al document clicks
	Zapatec.Utils.addEvent(document, 'click', function(){
		if(!self.isClicked){
			self.leave();
		}
		
		self.isClicked = false;
	});

};

/**
 * @private
 * Process key events in the document.
 * @param event {Object} Event object.
 */
Zapatec.Tree.prototype.keyEvent = function(evt){
	if(!this.prevSelected || !this.isActive){
		// if no node is selected or this tree is not active at a moment - do nothing.
		return true;
	}

	if(!evt){
		evt = window.event;
	}

	if(!this.config.keyboardNavigation && !this.config.editable){
		return;
	}

	var res = Zapatec.Utils.getCharFromEvent(evt);

	this.fireEvent("keypressed", res.charCode, res.chr);

	if(res.charCode == 27){
		// ESC key
		this.leave();
	}
	
	if(res.chr == " "){
		res.charCode = 32;
	}

	if(
		this.config.keyboardNavigation && 
		(
			!this.config.editable ||
			this.config.editable &&
			!this.editInline && !this.editInline.selectedNode
		)
	){
		switch(res.charCode){
			case 32: // space bar
				if(this.config.putCheckboxes){
					this.prevSelected.checkboxChanged();
				}
				// fall through
			case 13: // enter key
				this.prevSelected.toggle();
				Zapatec.Utils.stopEvent(evt);
				break;
			case 63234: //left arrow in Safari
			case 37: // left arrow
				if(this.prevSelected.data.isExpanded){
					this.prevSelected.collapse();
				} else {
					if(!this.prevSelected.config.parentNode.isRootNode){
						this.prevSelected.config.parentNode.select();
					}
				}
	    
				break;
			case 63235: //right arrow in Safari
			case 39: // right arrow
				if(!this.prevSelected.data.isExpanded){
					this.prevSelected.expand();
				} else {
					if(this.prevSelected.children != null && this.prevSelected.children.length > 0){
						this.prevSelected.children[0].select();
					}
				}
				break;
			case 63232: //up arrow in Safari
			case 38: // up arrow
				var prevNode = Zapatec.Tree.Utils.getPrevNode(this.prevSelected);
	    
				if(prevNode){
					prevNode.select();
					Zapatec.Utils.stopEvent(evt);
				}
	    
				break;
			case 63233: //down arrow in Safari
			case 40: // down arrow
				var nextNode = Zapatec.Tree.Utils.getNextNode(this.prevSelected);
	    
				if(nextNode){
					nextNode.select();
					Zapatec.Utils.stopEvent(evt);
				}
	    
				break;
		}
	}

	if(this.config.editable && this.editInline.selectedNode){
		if(res.charCode == 9){ // tab key
			var otherNode = null;
    
			// if tree is editable and currently some node is editing
			if(evt.shiftKey){
				otherNode = Zapatec.Tree.Utils.getPrevNode(this.editInline.selectedNode);
			} else {
				otherNode = Zapatec.Tree.Utils.getNextNode(this.editInline.selectedNode);
			}
			
			if(otherNode){
				this.editInline.saveAndHide();
				otherNode.select();
				this.editInline.show(otherNode.getLinkToLabelElement());
        
				Zapatec.Utils.stopEvent(evt);
			}
		}
	}
};

/**
 * @private
 * Leave tree.
 */
Zapatec.Tree.prototype.leave = function(){
	if(this.prevSelected && this.config.deselectOnLeave){
		this.prevSelected.deselect();
	}
	
	this.isActive = false;

	this.fireEvent("leave");
};