-/*\r
- * Ext JS Library 2.2.1\r
- * Copyright(c) 2006-2009, Ext JS, LLC.\r
- * licensing@extjs.com\r
- * \r
- * http://extjs.com/license\r
- */\r
-\r
-/**\r
- * @class Ext.tree.TreeEditor\r
- * @extends Ext.Editor\r
- * Provides editor functionality for inline tree node editing. Any valid {@link Ext.form.Field} subclass can be used\r
- * as the editor field.\r
- * @constructor\r
- * @param {TreePanel} tree\r
- * @param {Object} fieldConfig (optional) Either a prebuilt {@link Ext.form.Field} instance or a Field config object\r
- * that will be applied to the default field instance (defaults to a {@link Ext.form.TextField}).\r
- * @param {Object} config (optional) A TreeEditor config object\r
- */\r
-Ext.tree.TreeEditor = function(tree, fc, config){\r
- fc = fc || {};\r
- var field = fc.events ? fc : new Ext.form.TextField(fc);\r
- Ext.tree.TreeEditor.superclass.constructor.call(this, field, config);\r
-\r
- this.tree = tree;\r
-\r
- if(!tree.rendered){\r
- tree.on('render', this.initEditor, this);\r
- }else{\r
- this.initEditor(tree);\r
- }\r
-};\r
-\r
-Ext.extend(Ext.tree.TreeEditor, Ext.Editor, {\r
- /**\r
- * @cfg {String} alignment\r
- * The position to align to (see {@link Ext.Element#alignTo} for more details, defaults to "l-l").\r
- */\r
- alignment: "l-l",\r
- // inherit\r
- autoSize: false,\r
- /**\r
- * @cfg {Boolean} hideEl\r
- * True to hide the bound element while the editor is displayed (defaults to false)\r
- */\r
- hideEl : false,\r
- /**\r
- * @cfg {String} cls\r
- * CSS class to apply to the editor (defaults to "x-small-editor x-tree-editor")\r
- */\r
- cls: "x-small-editor x-tree-editor",\r
- /**\r
- * @cfg {Boolean} shim\r
- * True to shim the editor if selects/iframes could be displayed beneath it (defaults to false)\r
- */\r
- shim:false,\r
- // inherit\r
- shadow:"frame",\r
- /**\r
- * @cfg {Number} maxWidth\r
- * The maximum width in pixels of the editor field (defaults to 250). Note that if the maxWidth would exceed\r
- * the containing tree element's size, it will be automatically limited for you to the container width, taking\r
- * scroll and client offsets into account prior to each edit.\r
- */\r
- maxWidth: 250,\r
- /**\r
- * @cfg {Number} editDelay The number of milliseconds between clicks to register a double-click that will trigger\r
- * editing on the current node (defaults to 350). If two clicks occur on the same node within this time span,\r
- * the editor for the node will display, otherwise it will be processed as a regular click.\r
- */\r
- editDelay : 350,\r
-\r
- initEditor : function(tree){\r
- tree.on('beforeclick', this.beforeNodeClick, this);\r
- tree.on('dblclick', this.onNodeDblClick, this);\r
- this.on('complete', this.updateNode, this);\r
- this.on('beforestartedit', this.fitToTree, this);\r
- this.on('startedit', this.bindScroll, this, {delay:10});\r
- this.on('specialkey', this.onSpecialKey, this);\r
- },\r
-\r
- // private\r
- fitToTree : function(ed, el){\r
- var td = this.tree.getTreeEl().dom, nd = el.dom;\r
- if(td.scrollLeft > nd.offsetLeft){ // ensure the node left point is visible\r
- td.scrollLeft = nd.offsetLeft;\r
- }\r
- var w = Math.min(\r
- this.maxWidth,\r
- (td.clientWidth > 20 ? td.clientWidth : td.offsetWidth) - Math.max(0, nd.offsetLeft-td.scrollLeft) - /*cushion*/5);\r
- this.setSize(w, '');\r
- },\r
-\r
- // private\r
- triggerEdit : function(node, defer){\r
- this.completeEdit();\r
- if(node.attributes.editable !== false){\r
- /**\r
- * The tree node this editor is bound to. Read-only.\r
- * @type Ext.tree.TreeNode\r
- * @property editNode\r
- */\r
- this.editNode = node;\r
- if(this.tree.autoScroll){\r
- node.ui.getEl().scrollIntoView(this.tree.body);\r
- }\r
- this.autoEditTimer = this.startEdit.defer(this.editDelay, this, [node.ui.textNode, node.text]);\r
- return false;\r
- }\r
- },\r
-\r
- // private\r
- bindScroll : function(){\r
- this.tree.getTreeEl().on('scroll', this.cancelEdit, this);\r
- },\r
-\r
- // private\r
- beforeNodeClick : function(node, e){\r
- clearTimeout(this.autoEditTimer);\r
- if(this.tree.getSelectionModel().isSelected(node)){\r
- e.stopEvent();\r
- return this.triggerEdit(node);\r
- }\r
- },\r
-\r
- onNodeDblClick : function(node, e){\r
- clearTimeout(this.autoEditTimer);\r
- },\r
-\r
- // private\r
- updateNode : function(ed, value){\r
- this.tree.getTreeEl().un('scroll', this.cancelEdit, this);\r
- this.editNode.setText(value);\r
- },\r
-\r
- // private\r
- onHide : function(){\r
- Ext.tree.TreeEditor.superclass.onHide.call(this);\r
- if(this.editNode){\r
- this.editNode.ui.focus.defer(50, this.editNode.ui);\r
- }\r
- },\r
-\r
- // private\r
- onSpecialKey : function(field, e){\r
- var k = e.getKey();\r
- if(k == e.ESC){\r
- e.stopEvent();\r
- this.cancelEdit();\r
- }else if(k == e.ENTER && !e.hasModifier()){\r
- e.stopEvent();\r
- this.completeEdit();\r
- }\r
- }\r
-});
\ No newline at end of file