--- /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">TaskGrid = function(){\r
+ \r
+ // custom columns\r
+ var completeColumn = new CompleteColumn();\r
+ var reminderColumn = new ReminderColumn();\r
+ \r
+ TaskGrid.superclass.constructor.call(this, {\r
+ id:'tasks-grid',\r
+ store: tx.data.tasks,\r
+ sm: new Ext.grid.RowSelectionModel({moveEditorOnEnter: false}),\r
+ clicksToEdit: 'auto',\r
+ enableColumnHide:false,\r
+ enableColumnMove:false,\r
+ autoEncode: true,\r
+ title:'All Tasks',\r
+ iconCls:'icon-folder',\r
+ region:'center',\r
+ plugins: [completeColumn, reminderColumn],\r
+ margins:'3 3 3 0',\r
+ columns: [\r
+ completeColumn,\r
+ {\r
+ header: "Task",\r
+ width:400,\r
+ sortable: true,\r
+ dataIndex: 'title',\r
+ id:'task-title',\r
+ editor: new Ext.form.TextField({\r
+ allowBlank: false\r
+ })\r
+ },\r
+ {\r
+ header: "List",\r
+ width:150,\r
+ sortable: true,\r
+ dataIndex: 'listId',\r
+ editor: new ListSelector({\r
+ store:tx.data.lists\r
+ }),\r
+ renderer : function(v){\r
+ return tx.data.lists.getName(v);\r
+ }\r
+ },\r
+ {\r
+ id:'dueDate',\r
+ header: "Due Date",\r
+ width: 150,\r
+ sortable: true,\r
+ renderer: Ext.util.Format.dateRenderer('D m/d/Y'),\r
+ dataIndex: 'dueDate',\r
+ groupRenderer: Ext.util.Format.createTextDateRenderer(),\r
+ groupName: 'Due',\r
+ editor: new Ext.form.DateField({\r
+ format : "m/d/Y"\r
+ })\r
+ },\r
+ reminderColumn\r
+ ],\r
+\r
+ view: new TaskView()\r
+ });\r
+ \r
+ // Keep the visible date groups in the grid accurate\r
+ Ext.TaskMgr.start({\r
+ run: function(){\r
+ var col = this.getColumnModel().getColumnById('dueDate');\r
+ if(col.groupRenderer.date.getTime() != new Date().clearTime().getTime()){\r
+ col.groupRenderer = Ext.util.Format.createTextDateRenderer();\r
+ tx.data.tasks.applyGrouping();\r
+ }\r
+ },\r
+ interval: 60000,\r
+ scope: this\r
+ });\r
+ \r
+ this.on('rowcontextmenu', this.onRowContext, this);\r
+};\r
+\r
+Ext.extend(TaskGrid, Ext.grid.EditorGridPanel, {\r
+ onCellDblClick: function(g, row){\r
+ clearTimeout(this.autoEditTimer); // allow dbl click without starting edit\r
+ var id = this.store.getAt(row).id;\r
+ \r
+ Ext.air.NativeWindowManager.getTaskWindow(id);\r
+ },\r
+\r
+ // private\r
+ onAutoEditClick : function(e, t){\r
+ clearTimeout(this.autoEditTimer);\r
+ if(e.button !== 0){\r
+ return;\r
+ }\r
+ var row = this.view.findRowIndex(t);\r
+ var col = this.view.findCellIndex(t);\r
+ if(row !== false && col !== false){\r
+ if(this.selModel.isSelected(row) && this.selModel.getCount() === 1){\r
+ this.autoEditTimer = this.startEditing.defer(300, this, [row, col]);\r
+ }\r
+ }\r
+ },\r
+ \r
+ onRowContext : function(grid, row, e){\r
+ if(!this.menu){ // create context menu on first right click\r
+ this.menu = new Ext.menu.Menu({\r
+ id:'tasks-ctx',\r
+ listWidth: 200,\r
+ items: [{\r
+ text:'Open',\r
+ scope: this,\r
+ handler:function(){\r
+ Ext.each(this.selModel.getSelections(), function(r){\r
+ Ext.air.NativeWindowManager.getTaskWindow(r.id);\r
+ });\r
+ }\r
+ },'-',\r
+ tx.actions.complete,\r
+ tx.actions.deleteTask\r
+ ]\r
+ });\r
+ }\r
+ if(!this.selModel.isSelected(row)){\r
+ this.selModel.selectRow(row);\r
+ }\r
+ \r
+ this.menu.showAt(e.getXY());\r
+ }\r
+})\r
+\r
+\r
+TaskView = Ext.extend(Ext.grid.GroupingView, {\r
+ forceFit:true,\r
+ ignoreAdd: true,\r
+ emptyText: 'There are no tasks to show in this list.',\r
+\r
+ templates: {\r
+ header: Templates.gridHeader\r
+ },\r
+ getRowClass : function(r){\r
+ var d = r.data;\r
+ if(d.completed){\r
+ return 'task-completed';\r
+ }\r
+ if(d.dueDate && d.dueDate.getTime() < new Date().clearTime().getTime()){\r
+ return 'task-overdue';\r
+ }\r
+ return '';\r
+ }\r
+});\r
+\r
+\r
+TaskHeader = function(grid){\r
+ grid.on('resize', syncFields);\r
+ grid.on('columnresize', syncFields);\r
+ \r
+ // The fields in the grid's header\r
+ var ntTitle = this.ntTitle = new Ext.form.TextField({\r
+ renderTo: 'new-task-title',\r
+ emptyText: 'Add a task...'\r
+ });\r
+\r
+ var ntCat = new ListSelector({\r
+ renderTo: 'new-task-cat',\r
+ disabled:true,\r
+ store:tx.data.lists,\r
+ listenForLoad: true\r
+ });\r
+\r
+ var ntDue = new Ext.form.DateField({\r
+ renderTo: 'new-task-due',\r
+ value: new Date(),\r
+ disabled:true,\r
+ format : "m/d/Y"\r
+ });\r
+\r
+ // syncs the header fields' widths with the grid column widths\r
+ function syncFields(){\r
+ var cm = grid.getColumnModel();\r
+ ntTitle.setSize(cm.getColumnWidth(1)-2);\r
+ ntCat.setSize(cm.getColumnWidth(2)-4);\r
+ ntDue.setSize(cm.getColumnWidth(3)-4);\r
+ }\r
+ syncFields();\r
+\r
+ var editing = false, focused = false, userTriggered = false;\r
+ var handlers = {\r
+ focus: function(){\r
+ setFocus.defer(20, window, [true]);\r
+ },\r
+ blur: function(){\r
+ focused = false;\r
+ doBlur.defer(250);\r
+ },\r
+ specialkey: function(f, e){\r
+ if(e.getKey()==e.ENTER && (!f.isExpanded || !f.isExpanded())){\r
+ userTriggered = true;\r
+ e.stopEvent();\r
+ f.el.blur();\r
+ if(f.triggerBlur){\r
+ f.triggerBlur();\r
+ }\r
+ }\r
+ }\r
+ }\r
+ ntTitle.on(handlers);\r
+ ntCat.on(handlers);\r
+ ntDue.on(handlers);\r
+\r
+ ntTitle.on('focus', function(){\r
+ focused = true;\r
+ if(!editing){\r
+ ntCat.enable();\r
+ ntDue.enable();\r
+ syncFields();\r
+ editing = true;\r
+ \r
+ ntCat.setValue(tx.data.getActiveListId());\r
+ }\r
+ });\r
+\r
+ function setFocus(v){\r
+ focused = v;\r
+ }\r
+ // when a field in the add bar is blurred, this determines\r
+ // whether a new task should be created\r
+ function doBlur(){\r
+ if(editing && !focused){\r
+ var title = ntTitle.getValue();\r
+ if(!Ext.isEmpty(title)){\r
+ tx.data.tasks.createTask(title, ntCat.getRawValue(), ntDue.getValue());\r
+ ntTitle.setValue('');\r
+ if(userTriggered){ // if they entered to add the task, then go to a new add automatically\r
+ userTriggered = false;\r
+ ntTitle.focus.defer(100, ntTitle);\r
+ }\r
+ }\r
+ ntCat.disable();\r
+ ntDue.disable();\r
+ editing = false;\r
+ }\r
+ }\r
+};\r
+</pre> \r
+</body>\r
+</html>
\ No newline at end of file
git.ithinksw.org / extjs.git / blobdiff