+++ /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