![](" + options.imagePath + "ltFld_o.gif)
",
tagDoc: "![](" + options.imagePath + "ltDoc.gif)
",
tagL_ns: "![|](" + options.imagePath + "ltL_ns.gif)
",
tagL_: "![](" + options.imagePath + "ltL_.gif)
",
tagL_ne: "![+](" + options.imagePath + "ltL_ne.gif)
",
tagL_nes: "![+](" + options.imagePath + "ltL_nes.gif)
",
tagM_ne: "![[-]](" + options.imagePath + "ltM_ne.gif)
",
tagM_nes: "![[-]](" + options.imagePath + "ltM_nes.gif)
",
tagP_ne: "![[+]](" + options.imagePath + "ltP_ne.gif)
",
tagP_nes: "![[+]](" + options.imagePath + "ltP_nes.gif)
",
tagD_ne: "![[?]](" + options.imagePath + "ltD_ne.gif)
",
tagD_nes: "![[?]](" + options.imagePath + "ltD_nes.gif)
"
};
// find container element
this.divTree = document.getElementById(id);
// create the root element
this.tnRoot = new DynaTreeNode(this, {title: this.options.title, key: this.options.idPrefix+"root"});
this.tnRoot.data.isFolder = true;
this.tnRoot.render(false, false);
this.divRoot = this.tnRoot.div;
this.divRoot.className = this.options.classnames.container;
// add root to container
this.divTree.appendChild(this.divRoot);
},
// member functions
toString: function() {
return "DynaTree '" + this.options.title + "'";
},
_changeExpandList: function(key, bAdd, bWriteCookie) {
// Add or remove key from expand-list.
if( !key )
return false;
var n = this.expandedKeys.length;
if( bAdd ) {
if( jQuery.inArray(key, this.expandedKeys) == -1 )
this.expandedKeys.push(key);
} else {
this.expandedKeys = jQuery.grep(this.expandedKeys, function(e){ return(e != key); });
}
if( bWriteCookie ) {
// logMsg("_changeExpandList: write cookie: <%s> = '%s'", this.options.cookieId, this.expandedKeys.join(","));
jQuery.cookie(this.options.cookieId, this.expandedKeys.join(","));
} else {
// logMsg("_changeExpandList: %o", this.expandedKeys);
}
return ( n != this.expandedKeys.length );
},
redraw: function() {
logMsg("dynatree.redraw()...");
this.tnRoot.render(true, true);
logMsg("dynatree.redraw() done.");
},
getRoot: function() {
return this.tnRoot;
},
getNodeByKey: function(key) {
// $("#...") has problems, if the key contains '.', so we use getElementById()
// return $("#" + this.options.idPrefix + key).attr("dtnode");
var el = document.getElementById(this.options.idPrefix + key);
return ( el && el.dtnode ) ? el.dtnode : null;
},
getSelectedNode: function() {
return this.tnSelected;
},
selectKey: function(key) {
var dtnode = this.getNodeByKey(key);
if( !dtnode ) {
this.tnSelected = null;
return null;
}
dtnode.focus();
dtnode.select();
return dtnode;
},
enableUpdate: function(bEnable) {
if ( this.bEnableUpdate==bEnable )
return bEnable;
this.bEnableUpdate = bEnable;
if ( bEnable )
this.redraw();
return !bEnable; // return previous value
},
// --- end of class
lastentry: undefined
};
/*************************************************************************
* widget $(..).dynatree
*/
(function($) {
function _getNodeFromElement(el) {
var iMax = 4;
do {
if( el.dtnode ) return el.dtnode;
el = el.parentNode;
} while( iMax-- );
return null;
}
function fnClick(event) {
var dtnode = _getNodeFromElement(event.target);
if( !dtnode )
return false;
return dtnode.onClick(event);
}
function fnDblClick(event) {
var dtnode = _getNodeFromElement(event.target);
if( !dtnode )
return false;
return dtnode.onDblClick(event);
}
function fnKeyHandler(event) {
// Handles keydown and keypressed, because IE and Safari don't fire keypress for cursor keys.
var dtnode = _getNodeFromElement(event.target);
if( !dtnode )
return false;
// ...but Firefox does, so ignore them:
if( event.type == "keypress" && event.charCode == 0 )
return;
return dtnode.onKeypress(event);
}
function fnFocusHandler(event) {
// Handles blur and focus.
// Fix event for IE:
event = arguments[0] = $.event.fix( event || window.event );
var dtnode = _getNodeFromElement(event.target);
// logMsg("fnFocusHandler(%o), dtnode=%o", event, dtnode);
if( !dtnode )
return false;
return dtnode.onFocus(event);
}
$.widget("ui.dynatree", {
init: function() {
// ui.core 1.6 renamed init() to _init(): this stub assures backward compatibility
logMsg("ui.dynatree.init() was called, you should upgrade to ui.core.js v1.6 or higher.");
return this._init();
},
_init: function() {
// The widget framework supplies this.element and this.options.
this.options.event += '.dynatree'; // namespace event
// create lazytree
var $this = this.element;
var opts = this.options;
// Migration helper (2008-11-30)
if( opts.selectExpandsFolders == false )
alert("Dynatree option 'selectExpandsFolders' is deprecated. Use 'clickFolderMode' instead.");
// Guess skin path, if not specified
if(!opts.imagePath) {
$("script").each( function () {
if( this.src.search(/.*dynatree[^/]*\.js$/i) >= 0 ) {
if( this.src.indexOf("/")>=0 ) // issue #47
opts.imagePath = this.src.slice(0, this.src.lastIndexOf("/")) + "/skin/";
else
opts.imagePath = "skin/";
logMsg("Guessing imagePath from '%s': '%s'", this.src, opts.imagePath);
return false; // first match
}
});
}
// Attach the tree object to parent element
var id = $this.attr("id");
this.tree = new DynaTree(id, opts);
var root = this.tree.getRoot()
// Init tree structure
if( opts.children ) {
// Read structure from node array
root.append(opts.children);
} else if( opts.initAjax && opts.initAjax.url ) {
// Init tree from AJAX request
root.appendAjax(opts.initAjax);
} else if( opts.initId ) {
// Init tree from another UL element
this.createFromTag(root, $("#"+opts.initId));
} else {
// Init tree from the first UL element inside the container
var $ul = $this.find(">ul").hide();
this.createFromTag(root, $ul);
$ul.remove();
}
//
// bind event handlers
$this.bind("click", fnClick);
$this.bind("dblclick", fnDblClick);
if( opts.keyboard ) {
$this.bind("keypress keydown", fnKeyHandler);
// focus/blur don't bubble, i.e. are not delegated to parent
tags,
// so we use the addEventListener capturing phase.
// See http://www.howtocreate.co.uk/tutorials/javascript/domevents
var div = this.tree.divTree;
if( div.addEventListener ) {
div.addEventListener("focus", fnFocusHandler, true);
div.addEventListener("blur", fnFocusHandler, true);
} else {
div.onfocusin = div.onfocusout = fnFocusHandler;
}
if( opts.focusRoot ) {
if( opts.rootVisible ) {
root.focus();
} else if( root.aChilds && ! (opts.initAjax && opts.initAjax.url) ) {
// Only if not lazy initing (Will be handled by setLazyNodeStatus(DTNodeStatus_Ok))
root.aChilds[0].focus();
}
}
}
// We defined the first-time cookie from node.data, now store it
if( this.tree.initCookie ) {
// logMsg("Write cookie: <%s> = '%s'", opts.cookieId, this.tree.expandedKeys.join(","));
$.cookie(opts.cookieId, this.tree.expandedKeys.join(","));
}
},
// --- getter methods (i.e. NOT returning a reference to $)
getTree: function() {
return this.tree;
},
getRoot: function() {
return this.tree.getRoot();
},
getSelectedNode: function() {
return this.tree.getSelectedNode();
},
// --- Private methods
createFromTag: function(parentTreeNode, $ulParent) {
// Convert a tag is specified, use it literally.
title = $liSpan.html();
} else {
// If only a tag is specified, use the trimmed string up to the next child
- ...
- tag.
title = $.trim($li.html().match(/.*(
- #{label} ', // var $li = $(o.tabTemplate.replace(/#\{href\}/g, url).replace(/#\{label\}/g, label)); //~ panelTemplate: '' // ------------------------------------------------------------------------ lastentry: undefined }; /** * Reserved data attributes for a tree node. */ $.ui.dynatree.nodedatadefaults = { title: null, // (required) Displayed name of the node (html is allowed here) key: null, // May be used with select(), find(), ... isFolder: false, // Use a folder icon. Also the node is expandable but not selectable. isLazy: false, // Call onLazyRead(), when the node is expanded for the first time to allow for delayed creation of children. expand: false, // Initial expand status. tooltip: null, // Show this popup text. icon: null, // Use a custom image (filename relative to tree.options.imagePath). 'null' for default icon, 'false' for no icon. // The following attributes are only valid if passed to some functions: children: null, // Array of child nodes. // NOTE: we can also add custom attributes here. // This may then also be used in the onSelect() or onLazyTree() callbacks. // ------------------------------------------------------------------------ lastentry: undefined }; // --------------------------------------------------------------------------- })(jQuery);
- element with this ID.
initAjax: null, // Ajax options used to initialize the tree strucuture.
onSelect: null, // Callback when a node is selected.
onUnselect: null, // Callback when a node is deselected.
onLazyRead: null, // Callback when a lazy node is expanded for the first time.
onFocus: null, // Callback when a node receives keyboard focus.
onBlur: null, // Callback when a node looses focus.
focusRoot: true, // Set focus to root node on init.
keyboard: true, // Support keyboard navigation.
autoCollapse: false, // Automatically collapse all siblings, when a node is expanded.
expandOnAdd: false, // Automatically expand parent, when a child is added.
// selectExpandsFolders: true, // Clicking a folder title expands the node instead of selecting it.
clickFolderMode: 3, // 1:select, 2:expand, 3:select and expand
selectionVisible: true, // Make sure, selected nodes are visible (expanded).
idPrefix: 'ui-dynatree-id-', // Used to generate node id's like .
ajaxDefaults: { // Used by initAjax option
cache: false, // Append random '_' argument to url to prevent caching.
dataType: "json" // Expect json format and pass json object to callbacks.
},
strings: {
loading: "Loading…",
loadError: "Load error!"
},
classnames: {
container: "ui-dynatree-container",
expander: "ui-dynatree-expander",
hidden: "ui-dynatree-hidden",
disabled: "ui-dynatree-disabled",
selected: "ui-dynatree-selected",
folder: "ui-dynatree-folder",
document: "ui-dynatree-document",
focused: "ui-dynatree-focused",
loading: "ui-dynatree-loading"
},
debugLevel: 0,
persist: false, // Persist expand-status to a cookie
cookieId: "ui-dynatree-cookie", // Choose a more unique name, to allow multiple trees.
/*
cookie: {
expires: 7, //
path: '/',
// domain: 'jquery.com',
// secure: true
},
*/
// minExpandLevel: 1, // Instead of rootCollapsible
// expandLevel: 1, // Expand all branches until level i (set to 0 to )
// fx: null, // Animations, e.g. { height: 'toggle', opacity: 'toggle', duration: 200 }
// ### copied from ui.tabs
// basic setup
// history: false,
// templates
//~ tabTemplate: '