xtree_zh.js

An object based tree widget, emulating the one found in microsoft windows, | | with persistence usi

/*----------------------------------------------------------------------------\
|                       Cross Browser Tree Widget 1.17                        |
|-----------------------------------------------------------------------------|
|                          Created by Emil A Eklund                           |
|                  (http://webfx.eae.net/contact.html#emil)                   |
|                      For WebFX (http://webfx.eae.net/)                      |
|-----------------------------------------------------------------------------|
| An object based tree widget,  emulating the one found in microsoft windows, |
| with persistence using cookies. Works in IE 5+, Mozilla and konqueror 3.    |
|-----------------------------------------------------------------------------|
|                   Copyright (c) 1999 - 2002 Emil A Eklund                   |
|-----------------------------------------------------------------------------|
| This software is provided "as is", without warranty of any kind, express or |
| implied, including  but not limited  to the warranties of  merchantability, |
| fitness for a particular purpose and noninfringement. In no event shall the |
| authors or  copyright  holders be  liable for any claim,  damages or  other |
| liability, whether  in an  action of  contract, tort  or otherwise, arising |
| from,  out of  or in  connection with  the software or  the  use  or  other |
| dealings in the software.                                                   |
| - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - |
| This  software is  available under the  three different licenses  mentioned |
| below.  To use this software you must chose, and qualify, for one of those. |
| - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - |
| The WebFX Non-Commercial License          http://webfx.eae.net/license.html |
| Permits  anyone the right to use the  software in a  non-commercial context |
| free of charge.                                                             |
| - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - |
| The WebFX Commercial license           http://webfx.eae.net/commercial.html |
| Permits the  license holder the right to use  the software in a  commercial |
| context. Such license must be specifically obtained, however it's valid for |
| any number of  implementations of the licensed software.                    |
| - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - |
| GPL - The GNU General Public License    http://www.gnu.org/licenses/gpl.txt |
| Permits anyone the right to use and modify the software without limitations |
| as long as proper  credits are given  and the original  and modified source |
| code are included. Requires  that the final product, software derivate from |
| the original  source or any  software  utilizing a GPL  component, such  as |
| this, is also licensed under the GPL license.                               |
|-----------------------------------------------------------------------------|
| Dependencies: xtree.css (To set up the CSS of the tree classes)             |
|-----------------------------------------------------------------------------|
| 2001-01-10 | Original Version Posted.                                       |
| 2001-03-18 | Added getSelected and get/setBehavior  that can make it behave |
|            | more like windows explorer, check usage for more information.  |
| 2001-09-23 | Version 1.1 - New features included  keyboard  navigation (ie) |
|            | and the ability  to add and  remove nodes dynamically and some |
|            | other small tweaks and fixes.                                  |
| 2002-01-27 | Version 1.11 - Bug fixes and improved mozilla support.         |
| 2002-06-11 | Version 1.12 - Fixed a bug that prevented the indentation line |
|            | from  updating correctly  under some  circumstances.  This bug |
|            | happened when removing the last item in a subtree and items in |
|            | siblings to the remove subtree where not correctly updated.    |
| 2002-06-13 | Fixed a few minor bugs cased by the 1.12 bug-fix.              |
| 2002-08-20 | Added usePersistence flag to allow disable of cookies.         |
| 2002-10-23 | (1.14) Fixed a plus icon issue                                 |
| 2002-10-29 | (1.15) Last changes broke more than they fixed. This version   |
|            | is based on 1.13 and fixes the bugs 1.14 fixed withou breaking |
|            | lots of other things.                                          |
| 2003-02-15 | The  selected node can now be made visible even when  the tree |
|            | control  loses focus.  It uses a new class  declaration in the |
|            | css file '.webfx-tree-item a.selected-inactive', by default it |
|            | puts a light-gray rectangle around the selected node.          |
| 2003-03-16 | Adding target support after lots of lobbying...                |
|-----------------------------------------------------------------------------|
| Created 2000-12-11 | All changes are in the log above. | Updated 2003-03-16 |
| *$Header: /seas/seas7.0/SEAS7.0/js/xtree/xtree_zh.js,v 1.1 2006/01/20 08:40:32 fuzz Exp $
| *  2004-08-06 liu_xc WebFXTreeItem.prototype.toString 的focus响应单击事件
\----------------------------------------------------------------------------*/
////////////////////////////////////////////////////////////////////////////////////
//if you want to import this js,you have to define a var (WEB_NAME) before your import
//<script>
//var WEB_NAME = "<%= request.getContextPath()%>";
//</script>
////////////////////////////////////////////////////////////////////////////////////

var webFXTreeConfig = {
	rootIcon        : WEB_NAME+'/image/tree/foldericon.png',
 	openRootIcon    : WEB_NAME+'/image/tree/openfoldericon.png',
 	folderIcon      : WEB_NAME+'/image/tree/foldericon.png',
 	openFolderIcon  : WEB_NAME+'/image/tree/openfoldericon.png',
 	fileIcon        : WEB_NAME+'/image/tree/file.png',
 	iIcon           : WEB_NAME+'/image/tree/I.png',
 	lIcon           : WEB_NAME+'/image/tree/L.png',
 	lMinusIcon      : WEB_NAME+'/image/tree/Lminus.png',
 	lPlusIcon       : WEB_NAME+'/image/tree/Lplus.png',
 	tIcon           : WEB_NAME+'/image/tree/T.png',
 	tMinusIcon      : WEB_NAME+'/image/tree/Tminus.png',
 	tPlusIcon       : WEB_NAME+'/image/tree/Tplus.png',
 	blankIcon       : WEB_NAME+'/image/tree/blank.gif',
	defaultText     : 'Tree Item',
	defaultAction   : '',
	defaultBehavior : 'classic',
	usePersistence	: false
};

var webFXTreeHandler = {
	collection: [],
	colId     : 0,
	idCounter : 0,
	idPrefix  : "webfx-tree-object-",
	all       : [],
	behavior  : null,
	selected  : null,
	onSelect  : null, /* should be part of tree, not handler */
	getId     : function() { return this.idPrefix + this.idCounter++; },
	toggle    : function (oItem) { this.all[oItem.id.replace('-plus','')].toggle(); },
	select    : function (oItem) { this.all[oItem.id.replace('-icon','')].select(); },
	focus     : function (oItem) { this.all[oItem.id.replace('-anchor','')].focus(); },
	blur      : function (oItem) { this.all[oItem.id.replace('-anchor','')].blur(); },
	keydown   : function (oItem, e) { return this.all[oItem.id].keydown(e.keyCode); },
	cookies   : new WebFXCookie(),
	insertHTMLBeforeEnd	:	function (oElement, sHTML)
	{
		if (oElement.insertAdjacentHTML != null)
		{
			oElement.insertAdjacentHTML("BeforeEnd", sHTML)
			return;
		}
		var df;	// DocumentFragment
		var r = oElement.ownerDocument.createRange();
		r.selectNodeContents(oElement);
		r.collapse(false);
		df = r.createContextualFragment(sHTML);
		oElement.appendChild(df);
	}
};

/*
 * WebFXCookie class
 */

function WebFXCookie()
{
	if (document.cookie.length)
		this.cookies = ' ' + document.cookie;
}

WebFXCookie.prototype.setCookie = function (key, value)
{
	document.cookie = key + "=" + escape(value);
}

WebFXCookie.prototype.getCookie = function (key)
{
	if (this.cookies)
	{
		var start = this.cookies.indexOf(' ' + key + '=');
		if (start == -1)
			return null;
		var end = this.cookies.indexOf(";", start);
		if (end == -1)
			end = this.cookies.length;
		end -= start;
		var cookie = this.cookies.substr(start,end);
		return unescape(cookie.substr(cookie.indexOf('=') + 1, cookie.length - cookie.indexOf('=') + 1));
	}
	else
		return null;
}

/*
 * WebFXTreeAbstractNode class
 */

function WebFXTreeAbstractNode(sText,sAction,sObj)
{
	this.childNodes  = [];
	this.value = new Object();
	this.value = sObj;
	this.id     = webFXTreeHandler.getId();
	this.text   = sText || webFXTreeConfig.defaultText;
	this.action = sAction || webFXTreeConfig.defaultAction;
	this._last  = false;
	webFXTreeHandler.all[this.id] = this;
}

/*
 * To speed thing up if you're adding multiple nodes at once (after load)
 * use the bNoIdent parameter to prevent automatic re-indentation and call
 * the obj.ident() method manually once all nodes has been added.
 */

WebFXTreeAbstractNode.prototype.add = function (node, bNoIdent)
{
	node.parentNode = this;
	this.childNodes[this.childNodes.length] = node;
	var root = this;

	//如果子节点大约等于两个，则不是尾节点
	if (this.childNodes.length >= 2)
		this.childNodes[this.childNodes.length - 2]._last = false;

	//递归得到根节点
	while (root.parentNode)
		root = root.parentNode;
	//如果树已经显示完成
	if (root.rendered)
	{
		if (this.childNodes.length >= 2)
		{
			document.getElementById(this.childNodes[this.childNodes.length - 2].id + '-plus').src = ((this.childNodes[this.childNodes.length -2].folder)?((this.childNodes[this.childNodes.length -2].open)?webFXTreeConfig.tMinusIcon:webFXTreeConfig.tPlusIcon):webFXTreeConfig.tIcon);
			this.childNodes[this.childNodes.length - 2].plusIcon = webFXTreeConfig.tPlusIcon;
			this.childNodes[this.childNodes.length - 2].minusIcon = webFXTreeConfig.tMinusIcon;
			this.childNodes[this.childNodes.length - 2]._last = false;
		}
		this._last = true;
		var foo = this;
		while (foo.parentNode)
		{
			for (var i = 0; i < foo.parentNode.childNodes.length; i++)
			{
				if (foo.id == foo.parentNode.childNodes[i].id)
					break;
			}
			if (i == foo.parentNode.childNodes.length - 1)
				foo.parentNode._last = true;
			else
				foo.parentNode._last = false;
			foo = foo.parentNode;
		}
		webFXTreeHandler.insertHTMLBeforeEnd(document.getElementById(this.id + '-cont'), node.toString());
		if ((!this.folder) && (!this.openIcon))
		{
			this.icon = webFXTreeConfig.folderIcon;
			this.openIcon = webFXTreeConfig.openFolderIcon;
		}
		if (!this.folder)
			this.folder = true;

		//added by liu_xc 2004.3.24 增加节点时，保持原样
		if (webFXTreeHandler.behavior == 'classic')
		{
			if(this.open)
				document.getElementById(this.id + '-icon').src = this.openIcon;
			else
				document.getElementById(this.id + '-icon').src = this.icon;
		}
		if(document.getElementById(this.id + '-plus'))
		{
			if(this.open)
				document.getElementById(this.id + '-plus').src = this.minusIcon;
			else
				document.getElementById(this.id + '-plus').src = this.plusIcon;
		}
		//end added
		//原来代码
		//this.collapse(true);
		if (!bNoIdent)
			this.indent();
	}
	return node;
}

WebFXTreeAbstractNode.prototype.toggle = function()
{
	if (this.folder)
	{
		if (this.open)
			this.collapse();
		else
			this.expand();
	}
}

WebFXTreeAbstractNode.prototype.select = function()
{
	document.getElementById(this.id + '-anchor').focus();
}

WebFXTreeAbstractNode.prototype.deSelect = function()
{
	document.getElementById(this.id + '-anchor').className = '';
	webFXTreeHandler.selected = null;
}

WebFXTreeAbstractNode.prototype.focus = function()
{
	if ((webFXTreeHandler.selected) && (webFXTreeHandler.selected != this))
		webFXTreeHandler.selected.deSelect();

	webFXTreeHandler.selected = this;

	if ((this.openIcon) && (webFXTreeHandler.behavior != 'classic'))
		document.getElementById(this.id + '-icon').src = this.openIcon;

	document.getElementById(this.id + '-anchor').className = 'selected';
	document.getElementById(this.id + '-anchor').focus();

	if (webFXTreeHandler.onSelect)
		webFXTreeHandler.onSelect(this);
}

WebFXTreeAbstractNode.prototype.blur = function()
{
	if ((this.openIcon) && (webFXTreeHandler.behavior != 'classic'))
		document.getElementById(this.id + '-icon').src = this.icon;

	document.getElementById(this.id + '-anchor').className = 'selected-inactive';
}

WebFXTreeAbstractNode.prototype.doExpand = function()
{
	if (webFXTreeHandler.behavior == 'classic')
		document.getElementById(this.id + '-icon').src = this.openIcon;

	if (this.childNodes.length)
		document.getElementById(this.id + '-cont').style.display = 'block';

	this.open = true;

	if (webFXTreeConfig.usePersistence)
		webFXTreeHandler.cookies.setCookie(this.id.substr(18,this.id.length - 18), '1');
}

WebFXTreeAbstractNode.prototype.doCollapse = function()
{
	if (webFXTreeHandler.behavior == 'classic')
		document.getElementById(this.id + '-icon').src = this.icon;

	if (this.childNodes.length)
		document.getElementById(this.id + '-cont').style.display = 'none';

	this.open = false;

	if (webFXTreeConfig.usePersistence)
		webFXTreeHandler.cookies.setCookie(this.id.substr(18,this.id.length - 18), '0');
}

WebFXTreeAbstractNode.prototype.expandAll = function()
{
	this.expandChildren();
	if ((this.folder) && (!this.open))
		this.expand();
}

WebFXTreeAbstractNode.prototype.expandChildren = function()
{
	for (var i = 0; i < this.childNodes.length; i++)
		this.childNodes[i].expandAll();
}

WebFXTreeAbstractNode.prototype.collapseAll = function()
{
	this.collapseChildren();
	if ((this.folder) && (this.open))
		this.collapse(true);
}

WebFXTreeAbstractNode.prototype.collapseChildren = function()
{
	for (var i = 0; i < this.childNodes.length; i++)
		this.childNodes[i].collapseAll();
}

WebFXTreeAbstractNode.prototype.indent = function(lvl, del, last, level, nodesLeft)
{
	/*
	 * Since we only want to modify items one level below ourself,
	 * and since the rightmost indentation position is occupied by
	 * the plus icon we set this to -2
	 */
	if (lvl == null)
		lvl = -2;
	var state = 0;
	for (var i = this.childNodes.length - 1; i >= 0 ; i--)
	{
		state = this.childNodes[i].indent(lvl + 1, del, last, level);
		if (state)
			return;
	}
	if (del)
	{
		if ((level >= this._level) && (document.getElementById(this.id + '-plus')))
		{
			if (this.folder)
			{
				document.getElementById(this.id + '-plus').src = (this.open)?webFXTreeConfig.lMinusIcon:webFXTreeConfig.lPlusIcon;
				this.plusIcon = webFXTreeConfig.lPlusIcon;
				this.minusIcon = webFXTreeConfig.lMinusIcon;
			}
			else if (nodesLeft)
				document.getElementById(this.id + '-plus').src = webFXTreeConfig.lIcon;
			return 1;
		}
	}
	var foo = document.getElementById(this.id + '-indent-' + lvl);
	if (foo)
	{
		if ((foo._last) || ((del) && (last)))
			foo.src =  webFXTreeConfig.blankIcon;
		else