3 <title>The source code</title>
\r
4 <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
\r
5 <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
\r
7 <body onload="prettyPrint();">
\r
8 <pre class="prettyprint lang-js">ListTree = function(config){
\r
9 ListTree.superclass.constructor.call(this, Ext.apply({
\r
12 //rootVisible:false,
\r
19 cmargins: '3 3 3 3',
\r
25 this.on('contextmenu', this.onContextMenu, this);
\r
27 Ext.extend(ListTree, Ext.tree.TreePanel, {
\r
29 initComponent : function(){
\r
31 tx.actions.newList,
\r
32 tx.actions.deleteList,
\r
34 tx.actions.newFolder,
\r
35 tx.actions.deleteFolder
\r
38 this.loader = new ListLoader({
\r
39 store: tx.data.lists
\r
41 ListTree.superclass.initComponent.call(this);
\r
43 var root = new Ext.tree.AsyncTreeNode({
\r
47 iconCls: 'icon-folder',
\r
52 this.setRootNode(root);
\r
54 this.editor = new Ext.tree.TreeEditor(this, {
\r
56 blankText:'A name is required',
\r
59 this.editor.shadow = false;
\r
61 this.editor.on('beforecomplete', function(ed, value, startValue){
\r
62 var node = ed.editNode;
\r
63 value = Ext.util.Format.htmlEncode(value);
\r
64 var r = this.store.getById(node.id);
\r
65 r.set('listName', value);
\r
66 //ed.editing = false;
\r
71 this.sorter = new Ext.tree.TreeSorter(this, {
\r
76 getActiveFolderId : function(){
\r
77 var sm = this.selModel;
\r
78 var n = sm.getSelectedNode();
\r
80 return n.attributes.isFolder ? n.id : n.attributes.parentId;
\r
85 onContextMenu : function(node, e){
\r
86 if(!this.menu){ // create context menu on first right click
\r
87 this.menu = new Ext.menu.Menu({
\r
91 iconCls:'icon-edit',
\r
95 this.ctxNode.select();
\r
96 tx.actions.newTask.execute();
\r
99 iconCls:'icon-list-new',
\r
102 handler:function(){
\r
103 this.ctxNode.select();
\r
104 tx.actions.newList.execute();
\r
107 iconCls:'icon-folder-new',
\r
110 handler:function(){
\r
111 this.ctxNode.select();
\r
112 tx.actions.newFolder.execute();
\r
116 iconCls:'icon-list-delete',
\r
118 handler:function(){
\r
119 this.removeList(this.ctxNode);
\r
123 this.menu.on('hide', this.onContextHide, this);
\r
126 this.ctxNode.ui.removeClass('x-node-ctx');
\r
127 this.ctxNode = null;
\r
129 this.ctxNode = node;
\r
130 this.ctxNode.ui.addClass('x-node-ctx');
\r
132 this.menu.items.get(1).setVisible(!!node.attributes.isFolder);
\r
133 this.menu.items.get(2).setVisible(!!node.attributes.isFolder);
\r
134 this.menu.items.get(0).setVisible(!node.attributes.isFolder);
\r
136 this.menu.showAt(e.getXY());
\r
139 onContextHide : function(){
\r
141 this.ctxNode.ui.removeClass('x-node-ctx');
\r
142 this.ctxNode = null;
\r
146 startEdit : function(node, select){
\r
147 if(typeof node == 'string'){
\r
148 node = this.getNodeById(node);
\r
150 if(select === true){
\r
153 var ed = this.editor;
\r
154 setTimeout(function(){
\r
155 ed.editNode = node;
\r
156 ed.startEdit(node.ui.textNode);
\r
160 removeList : function(s){
\r
161 if (s && s.attributes.editable) {
\r
162 Ext.Msg.confirm('Confirm', 'Are you sure you want to delete "' + Ext.util.Format.htmlEncode(s.text) + '"?', function(btn){
\r
163 if (btn == 'yes') {
\r
164 if (s.nextSibling) {
\r
165 s.nextSibling.select();
\r
168 if (s.previousSibling) {
\r
169 s.previousSibling.select();
\r
171 s.parentNode.removeChild(s);
\r
172 tx.data.lists.remove(this.store.getById(s.id));
\r
173 tx.data.tasks.removeList(s.id);
\r