--- /dev/null
+<html>\r
+<head>\r
+ <title>The source code</title>\r
+ <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
+ <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
+</head>\r
+<body onload="prettyPrint();">\r
+ <pre class="prettyprint lang-js">ListTree = function(config){\r
+ ListTree.superclass.constructor.call(this, Ext.apply({\r
+ id:'list-tree',\r
+ animate:false,\r
+ //rootVisible:false,\r
+ region:'west',\r
+ width:200,\r
+ split:true,\r
+ title:'My Lists',\r
+ autoScroll:true,\r
+ margins: '3 0 3 3',\r
+ cmargins: '3 3 3 3',\r
+ useArrows:true,\r
+ collapsible:true,\r
+ minWidth:120\r
+ }, config));\r
+ \r
+ this.on('contextmenu', this.onContextMenu, this);\r
+}\r
+Ext.extend(ListTree, Ext.tree.TreePanel, {\r
+ \r
+ initComponent : function(){\r
+ this.bbar = [\r
+ tx.actions.newList, \r
+ tx.actions.deleteList, \r
+ '-', \r
+ tx.actions.newFolder,\r
+ tx.actions.deleteFolder\r
+ ];\r
+ \r
+ this.loader = new ListLoader({\r
+ store: tx.data.lists\r
+ });\r
+ ListTree.superclass.initComponent.call(this);\r
+ \r
+ var root = new Ext.tree.AsyncTreeNode({\r
+ text: 'All Lists',\r
+ id: 'root',\r
+ leaf: false,\r
+ iconCls: 'icon-folder',\r
+ expanded: true,\r
+ isFolder: true,\r
+ editable: false\r
+ });\r
+ this.setRootNode(root);\r
+ \r
+ this.editor = new Ext.tree.TreeEditor(this, {\r
+ allowBlank:false,\r
+ blankText:'A name is required',\r
+ selectOnFocus:true\r
+ });\r
+ this.editor.shadow = false;\r
+\r
+ this.editor.on('beforecomplete', function(ed, value, startValue){\r
+ var node = ed.editNode;\r
+ value = Ext.util.Format.htmlEncode(value);\r
+ var r = this.store.getById(node.id);\r
+ r.set('listName', value);\r
+ //ed.editing = false;\r
+ //ed.hide();\r
+ //return false;\r
+ }, this);\r
+ \r
+ this.sorter = new Ext.tree.TreeSorter(this, {\r
+ folderSort: true\r
+ });\r
+ },\r
+ \r
+ getActiveFolderId : function(){\r
+ var sm = this.selModel;\r
+ var n = sm.getSelectedNode();\r
+ if(n){\r
+ return n.attributes.isFolder ? n.id : n.attributes.parentId;\r
+ }\r
+ return 'root';\r
+ },\r
+ \r
+ onContextMenu : function(node, e){\r
+ if(!this.menu){ // create context menu on first right click\r
+ this.menu = new Ext.menu.Menu({\r
+ id:'lists-ctx',\r
+ listWidth: 200,\r
+ items: [{\r
+ iconCls:'icon-edit',\r
+ text:'New Task',\r
+ scope: this,\r
+ handler:function(){\r
+ this.ctxNode.select();\r
+ tx.actions.newTask.execute();\r
+ }\r
+ },{\r
+ iconCls:'icon-list-new',\r
+ text:'New List',\r
+ scope: this,\r
+ handler:function(){\r
+ this.ctxNode.select();\r
+ tx.actions.newList.execute();\r
+ }\r
+ },{\r
+ iconCls:'icon-folder-new',\r
+ text:'New Folder',\r
+ scope: this,\r
+ handler:function(){\r
+ this.ctxNode.select();\r
+ tx.actions.newFolder.execute();\r
+ }\r
+ },'-',{\r
+ text:'Delete',\r
+ iconCls:'icon-list-delete',\r
+ scope: this,\r
+ handler:function(){\r
+ this.removeList(this.ctxNode);\r
+ }\r
+ }]\r
+ });\r
+ this.menu.on('hide', this.onContextHide, this);\r
+ }\r
+ if(this.ctxNode){\r
+ this.ctxNode.ui.removeClass('x-node-ctx');\r
+ this.ctxNode = null;\r
+ }\r
+ this.ctxNode = node;\r
+ this.ctxNode.ui.addClass('x-node-ctx');\r
+ \r
+ this.menu.items.get(1).setVisible(!!node.attributes.isFolder);\r
+ this.menu.items.get(2).setVisible(!!node.attributes.isFolder);\r
+ this.menu.items.get(0).setVisible(!node.attributes.isFolder);\r
+ \r
+ this.menu.showAt(e.getXY());\r
+ },\r
+\r
+ onContextHide : function(){\r
+ if(this.ctxNode){\r
+ this.ctxNode.ui.removeClass('x-node-ctx');\r
+ this.ctxNode = null;\r
+ }\r
+ },\r
+ \r
+ startEdit : function(node, select){\r
+ if(typeof node == 'string'){\r
+ node = this.getNodeById(node);\r
+ }\r
+ if(select === true){\r
+ node.select();\r
+ }\r
+ var ed = this.editor;\r
+ setTimeout(function(){\r
+ ed.editNode = node;\r
+ ed.startEdit(node.ui.textNode);\r
+ }, 10);\r
+ },\r
+ \r
+ removeList : function(s){\r
+ if (s && s.attributes.editable) {\r
+ Ext.Msg.confirm('Confirm', 'Are you sure you want to delete "' + Ext.util.Format.htmlEncode(s.text) + '"?', function(btn){\r
+ if (btn == 'yes') {\r
+ if (s.nextSibling) {\r
+ s.nextSibling.select();\r
+ }\r
+ else \r
+ if (s.previousSibling) {\r
+ s.previousSibling.select();\r
+ }\r
+ s.parentNode.removeChild(s);\r
+ tx.data.lists.remove(this.store.getById(s.id));\r
+ tx.data.tasks.removeList(s.id);\r
+ }\r
+ }, this);\r
+ }\r
+ }\r
+});\r
+\r
+</pre> \r
+</body>\r
+</html>
\ No newline at end of file