Diffstat (limited to 'frontend/beta/js/YUI-extensions/grid/PagedGridView.js') (more/less context) (show whitespace changes)
-rw-r--r-- | frontend/beta/js/YUI-extensions/grid/PagedGridView.js | 194 |
1 files changed, 194 insertions, 0 deletions
diff --git a/frontend/beta/js/YUI-extensions/grid/PagedGridView.js b/frontend/beta/js/YUI-extensions/grid/PagedGridView.js new file mode 100644 index 0000000..ecaece2 --- a/dev/null +++ b/frontend/beta/js/YUI-extensions/grid/PagedGridView.js | |||
@@ -0,0 +1,194 @@ | |||
1 | /** | ||
2 | * @class YAHOO.ext.grid.PagedGridView | ||
3 | * @extends YAHOO.ext.grid.GridView | ||
4 | * Extends the default GridView to add a paging interface. | ||
5 | * @constructor | ||
6 | * This class is created for you automatically if your data model is set to use paging. | ||
7 | */ | ||
8 | YAHOO.ext.grid.PagedGridView = function(){ | ||
9 | YAHOO.ext.grid.PagedGridView.superclass.constructor.call(this); | ||
10 | this.cursor = 1; | ||
11 | }; | ||
12 | |||
13 | YAHOO.extendX(YAHOO.ext.grid.PagedGridView, YAHOO.ext.grid.GridView, { | ||
14 | appendFooter : function(parentEl){ | ||
15 | var fwrap = document.createElement('div'); | ||
16 | fwrap.className = 'ygrid-wrap-footer'; | ||
17 | var fbody = document.createElement('span'); | ||
18 | fbody.className = 'ygrid-footer'; | ||
19 | fwrap.appendChild(fbody); | ||
20 | parentEl.appendChild(fwrap); | ||
21 | this.createPagingToolbar(fbody); | ||
22 | return fwrap; | ||
23 | }, | ||
24 | |||
25 | createPagingToolbar : function(container){ | ||
26 | var tb = new YAHOO.ext.Toolbar(container); | ||
27 | this.pageToolbar = tb; | ||
28 | this.first = tb.addButton({ | ||
29 | tooltip: this.firstText, | ||
30 | className: 'ygrid-page-first', | ||
31 | disabled: true, | ||
32 | click: this.onClick.createDelegate(this, ['first']) | ||
33 | }); | ||
34 | this.prev = tb.addButton({ | ||
35 | tooltip: this.prevText, | ||
36 | className: 'ygrid-page-prev', | ||
37 | disabled: true, | ||
38 | click: this.onClick.createDelegate(this, ['prev']) | ||
39 | }); | ||
40 | tb.addSeparator(); | ||
41 | tb.add(this.beforePageText); | ||
42 | var pageBox = document.createElement('input'); | ||
43 | pageBox.type = 'text'; | ||
44 | pageBox.size = 3; | ||
45 | pageBox.value = '1'; | ||
46 | pageBox.className = 'ygrid-page-number'; | ||
47 | tb.add(pageBox); | ||
48 | this.field = getEl(pageBox, true); | ||
49 | this.field.mon('keydown', this.onEnter, this, true); | ||
50 | this.field.on('focus', function(){pageBox.select();}); | ||
51 | this.afterTextEl = tb.addText(this.afterPageText.replace('%0', '1')); | ||
52 | this.field.setHeight(18); | ||
53 | tb.addSeparator(); | ||
54 | this.next = tb.addButton({ | ||
55 | tooltip: this.nextText, | ||
56 | className: 'ygrid-page-next', | ||
57 | disabled: true, | ||
58 | click: this.onClick.createDelegate(this, ['next']) | ||
59 | }); | ||
60 | this.last = tb.addButton({ | ||
61 | tooltip: this.lastText, | ||
62 | className: 'ygrid-page-last', | ||
63 | disabled: true, | ||
64 | click: this.onClick.createDelegate(this, ['last']) | ||
65 | }); | ||
66 | tb.addSeparator(); | ||
67 | this.loading = tb.addButton({ | ||
68 | tooltip: this.refreshText, | ||
69 | className: 'ygrid-loading', | ||
70 | disabled: true, | ||
71 | click: this.onClick.createDelegate(this, ['refresh']) | ||
72 | }); | ||
73 | this.onPageLoaded(1, this.grid.dataModel.getTotalPages()); | ||
74 | }, | ||
75 | |||
76 | /** | ||
77 | * Returns the toolbar used for paging so you can add new buttons. | ||
78 | * @return {YAHOO.ext.Toolbar} | ||
79 | */ | ||
80 | getPageToolbar : function(){ | ||
81 | return this.pageToolbar; | ||
82 | }, | ||
83 | |||
84 | onPageLoaded : function(pageNum, totalPages){ | ||
85 | this.cursor = pageNum; | ||
86 | this.lastPage = totalPages; | ||
87 | this.afterTextEl.innerHTML = this.afterPageText.replace('%0', totalPages); | ||
88 | this.field.dom.value = pageNum; | ||
89 | this.first.setDisabled(pageNum == 1); | ||
90 | this.prev.setDisabled(pageNum == 1); | ||
91 | this.next.setDisabled(pageNum == totalPages); | ||
92 | this.last.setDisabled(pageNum == totalPages); | ||
93 | this.loading.enable(); | ||
94 | }, | ||
95 | |||
96 | onLoadError : function(){ | ||
97 | this.loading.enable(); | ||
98 | }, | ||
99 | |||
100 | onEnter : function(e){ | ||
101 | if(e.browserEvent.keyCode == e.RETURN){ | ||
102 | var v = this.field.dom.value; | ||
103 | if(!v){ | ||
104 | this.field.dom.value = this.cursor; | ||
105 | return; | ||
106 | } | ||
107 | var pageNum = parseInt(v, 10); | ||
108 | if(isNaN(pageNum)){ | ||
109 | this.field.dom.value = this.cursor; | ||
110 | return; | ||
111 | } | ||
112 | pageNum = Math.min(Math.max(1, pageNum), this.lastPage); | ||
113 | this.grid.dataModel.loadPage(pageNum); | ||
114 | e.stopEvent(); | ||
115 | } | ||
116 | }, | ||
117 | |||
118 | beforeLoad : function(){ | ||
119 | this.grid.stopEditing(); | ||
120 | if(this.loading){ | ||
121 | this.loading.disable(); | ||
122 | } | ||
123 | }, | ||
124 | |||
125 | onClick : function(which){ | ||
126 | switch(which){ | ||
127 | case 'first': | ||
128 | this.grid.dataModel.loadPage(1); | ||
129 | break; | ||
130 | case 'prev': | ||
131 | this.grid.dataModel.loadPage(this.cursor -1); | ||
132 | break; | ||
133 | case 'next': | ||
134 | this.grid.dataModel.loadPage(this.cursor + 1); | ||
135 | break; | ||
136 | case 'last': | ||
137 | this.grid.dataModel.loadPage(this.lastPage); | ||
138 | break; | ||
139 | case 'refresh': | ||
140 | this.grid.dataModel.loadPage(this.cursor); | ||
141 | break; | ||
142 | } | ||
143 | }, | ||
144 | |||
145 | unplugDataModel : function(dm){ | ||
146 | dm.removeListener('beforeload', this.beforeLoad, this); | ||
147 | dm.removeListener('load', this.onPageLoaded, this); | ||
148 | dm.removeListener('loadexception', this.onLoadError, this); | ||
149 | YAHOO.ext.grid.PagedGridView.superclass.unplugDataModel.call(this, dm); | ||
150 | }, | ||
151 | |||
152 | plugDataModel : function(dm){ | ||
153 | dm.on('beforeload', this.beforeLoad, this, true); | ||
154 | dm.on('load', this.onPageLoaded, this, true); | ||
155 | dm.on('loadexception', this.onLoadError, this); | ||
156 | YAHOO.ext.grid.PagedGridView.superclass.plugDataModel.call(this, dm); | ||
157 | }, | ||
158 | |||
159 | /** | ||
160 | * Customizable piece of the default paging text (defaults to "Page") | ||
161 | * @type String | ||
162 | */ | ||
163 | beforePageText : "Page", | ||
164 | /** | ||
165 | * Customizable piece of the default paging text (defaults to "of %0") | ||
166 | * @type String | ||
167 | */ | ||
168 | afterPageText : "of %0", | ||
169 | /** | ||
170 | * Customizable piece of the default paging text (defaults to "First Page") | ||
171 | * @type String | ||
172 | */ | ||
173 | firstText : "First Page", | ||
174 | /** | ||
175 | * Customizable piece of the default paging text (defaults to "Previous Page") | ||
176 | * @type String | ||
177 | */ | ||
178 | prevText : "Previous Page", | ||
179 | /** | ||
180 | * Customizable piece of the default paging text (defaults to "Next Page") | ||
181 | * @type String | ||
182 | */ | ||
183 | nextText : "Next Page", | ||
184 | /** | ||
185 | * Customizable piece of the default paging text (defaults to "Last Page") | ||
186 | * @type String | ||
187 | */ | ||
188 | lastText : "Last Page", | ||
189 | /** | ||
190 | * Customizable piece of the default paging text (defaults to "Refresh") | ||
191 | * @type String | ||
192 | */ | ||
193 | refreshText : "Refresh" | ||
194 | }); | ||