Upgrade to ExtJS 3.0.0 - Released 07/06/2009
[extjs.git] / examples / tasks / classes.js
1 /*!
2  * Ext JS Library 3.0.0
3  * Copyright(c) 2006-2009 Ext JS, LLC
4  * licensing@extjs.com
5  * http://www.extjs.com/license
6  */
7 Ext.BLANK_IMAGE_URL = 'images/s.gif';\r
8     \r
9 Task = Ext.data.Record.create([\r
10     {name: 'taskId', type:'string'},\r
11     {name: 'title', type:'string'},\r
12     {name: 'category', type:'string'},\r
13     {name: 'description', type:'string'},\r
14     {name: 'dueDate', type:'date', dateFormat: 'Y-m-d H:i:s'},\r
15     {name: 'completed', type:'boolean'}\r
16 ]);\r
17 \r
18 Task.nextId = function(){\r
19         // if the time isn't unique enough, the addition \r
20         // of random chars should be\r
21         var t = String(new Date().getTime()).substr(4);\r
22         var s = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';\r
23         for(var i = 0; i < 4; i++){\r
24                 t += s.charAt(Math.floor(Math.random()*26));\r
25         }\r
26         return t;\r
27 }\r
28 \r
29 // The main grid's store\r
30 TaskStore = function(conn){\r
31         TaskStore.superclass.constructor.call(this, {\r
32         sortInfo:{field: 'dueDate', direction: "ASC"},\r
33         groupField:'dueDate',\r
34         taskFilter: 'all',\r
35         reader: new Ext.data.JsonReader({\r
36             idProperty: 'taskId'\r
37         }, Task)\r
38     });\r
39 \r
40     this.proxy = new Ext.data.SqlDB.Proxy(conn, 'task', 'taskId', this);\r
41 \r
42     if(window.google){ // google needs the table created\r
43         this.proxy.on('beforeload', this.prepareTable, conn);\r
44     }\r
45 \r
46     this.addEvents({newcategory: true});\r
47 };\r
48 \r
49 Ext.extend(TaskStore, Ext.data.GroupingStore, {\r
50     applyFilter : function(filter){\r
51         if(filter !== undefined){\r
52                 this.taskFilter = filter;\r
53         }\r
54         var value = this.taskFilter;\r
55         if(value == 'all'){\r
56             return this.clearFilter();\r
57         }\r
58         return this.filterBy(function(item){\r
59             return item.data.completed === value;\r
60         });\r
61     },\r
62 \r
63     addTask : function(data){\r
64         this.suspendEvents();\r
65         this.clearFilter();\r
66         this.resumeEvents();\r
67         this.loadData([data], true);\r
68         this.suspendEvents();\r
69         this.applyFilter();\r
70         this.applyGrouping(true);\r
71         this.resumeEvents();\r
72         this.fireEvent('datachanged', this);\r
73         this.fireEvent('newcategory', data.category);\r
74     },\r
75 \r
76     prepareTable : function(){\r
77         try{\r
78         this.createTable({\r
79             name: 'task',\r
80             key: 'taskId',\r
81             fields: Task.prototype.fields\r
82         });\r
83         }catch(e){console.log(e)}\r
84     }\r
85 });\r
86 \r
87 // The store for Categories\r
88 CategoryStore = function(){\r
89     CategoryStore.superclass.constructor.call(this, {\r
90         expandData: true,\r
91         data: [],\r
92         fields:[{name: 'text', type:'string'}],\r
93         sortInfo:{field:'text', direction:'ASC'},\r
94         id: 0\r
95     });\r
96 }\r
97 \r
98 Ext.extend(CategoryStore, Ext.data.ArrayStore, {\r
99     init : function(store){\r
100         var cats = store.collect('category', false, true);\r
101         this.loadData(cats);\r
102     },\r
103 \r
104     addCategory : function(cat){\r
105         if(cat && this.indexOfId(cat) === -1){\r
106             this.clearFilter(true);\r
107             this.loadData([cat], true);\r
108             this.applySort();\r
109         }\r
110     }\r
111 });\r
112 \r
113 // Grid column plugin that does the complete/active button in the left-most column\r
114 CompleteColumn = function(){\r
115     var grid;\r
116 \r
117     function getRecord(t){\r
118         var index = grid.getView().findRowIndex(t);\r
119         return grid.store.getAt(index);\r
120     }\r
121 \r
122     function onMouseDown(e, t){\r
123         if(Ext.fly(t).hasClass('task-check')){\r
124             e.stopEvent();\r
125             var record = getRecord(t);\r
126             record.set('completed', !record.data.completed);\r
127             grid.store.applyFilter();\r
128         }\r
129     }\r
130 \r
131     function onMouseOver(e, t){\r
132         if(Ext.fly(t).hasClass('task-check')){\r
133             Ext.fly(t.parentNode).addClass('task-check-over');\r
134         }\r
135     }\r
136 \r
137     function onMouseOut(e, t){\r
138         if(Ext.fly(t).hasClass('task-check')){\r
139             Ext.fly(t.parentNode).removeClass('task-check-over');\r
140         }\r
141     }\r
142 \r
143     Ext.apply(this, {\r
144         width: 22,\r
145         header: '<div class="task-col-hd"></div>',\r
146         menuDisabled:true,\r
147         fixed: true,\r
148         id: 'task-col',\r
149         renderer: function(){\r
150             return '<div class="task-check"></div>';\r
151         },\r
152         init : function(xg){\r
153             grid = xg;\r
154             grid.on('render', function(){\r
155                 var view = grid.getView();\r
156                 view.mainBody.on('mousedown', onMouseDown);\r
157                 view.mainBody.on('mouseover', onMouseOver);\r
158                 view.mainBody.on('mouseout', onMouseOut);\r
159             });\r
160         }\r
161     });\r
162 };