Commit 8746750211fe267bfbf1d218da6e5e7784a8549a
1 parent
9b2dbf25
Exists in
master
and in
111 other branches
Replace page buttons by pagingToolbar
Showing
3 changed files
with
94 additions
and
348 deletions
Show diff stats
js/app/controllers/EpnTapModule.js
... | ... | @@ -27,8 +27,7 @@ Ext.define('amdaDesktop.EpnTapModule', { |
27 | 27 | Module initialisation. Called the first time that the user open the epnTap module. |
28 | 28 | */ |
29 | 29 | init: function() { |
30 | - this.filter = Array(); | |
31 | - this.selectedServiceId = null; | |
30 | + this.selectedService = null; | |
32 | 31 | |
33 | 32 | this.launcher = { |
34 | 33 | text: this.title, |
... | ... | @@ -38,18 +37,6 @@ Ext.define('amdaDesktop.EpnTapModule', { |
38 | 37 | }; |
39 | 38 | |
40 | 39 | this.aquireElements(); |
41 | - | |
42 | - // create productTypeDict based on productTypesStore | |
43 | - this.productTypesStore.on({ | |
44 | - load: function(store) { | |
45 | - this.productTypeDict = {}; | |
46 | - for (var key in store.data.map) { | |
47 | - this.productTypeDict[key] = store.data.map[key].data.name; | |
48 | - } | |
49 | - }, | |
50 | - scope: this | |
51 | - }); | |
52 | - | |
53 | 40 | this.servicesStore.load(); |
54 | 41 | this.productTypesStore.load(); |
55 | 42 | }, |
... | ... | @@ -60,20 +47,13 @@ Ext.define('amdaDesktop.EpnTapModule', { |
60 | 47 | this.granulesGrid = Ext.getCmp('epnTapGranulesGrid'); |
61 | 48 | this.productTypeCB = Ext.getCmp('epnTapProductTypeCB'); |
62 | 49 | this.targetNameCB = Ext.getCmp('epnTapTargetNameCB'); |
50 | + this.pagingTB = Ext.getCmp('epnTapPagingTB'); | |
63 | 51 | this.timeSelector = Ext.getCmp('epnTapTimeSelector'); |
64 | - this.rowsPerPageNf = Ext.getCmp('epnTapRowsPerPageNf'); | |
65 | - this.currentPageLb = Ext.getCmp('epnTapCurrentPageLb'); | |
66 | - this.totalPagesLb = Ext.getCmp('epnTapTotalPagesLb'); | |
67 | - this.firstPageBtn = Ext.getCmp('epnTapFirstPageBtn'); | |
68 | - this.previousPageBtn = Ext.getCmp('epnTapPreviousPageBtn'); | |
69 | - this.nextPageBtn = Ext.getCmp('epnTapNextPageBtn'); | |
70 | - this.lastPageBtn = Ext.getCmp('epnTapLastPageBtn'); | |
71 | 52 | this.getBtn = Ext.getCmp('epnTapGetBtn'); |
72 | 53 | |
73 | 54 | // stores elements |
74 | 55 | this.servicesStore = Ext.data.StoreManager.lookup('servicesStore'); |
75 | 56 | this.granulesStore = Ext.data.StoreManager.lookup('granulesStore'); |
76 | - // this.metadataStore = Ext.data.StoreManager.lookup('metadataStore') | |
77 | 57 | this.productTypesStore = Ext.data.StoreManager.lookup('productTypesStore'); |
78 | 58 | this.targetNamesStore = Ext.data.StoreManager.lookup('targetNamesStore'); |
79 | 59 | }, |
... | ... | @@ -91,24 +71,8 @@ Ext.define('amdaDesktop.EpnTapModule', { |
91 | 71 | this.onServiceSelected(record); |
92 | 72 | }, this); |
93 | 73 | |
94 | - this.granulesGrid.on('cellclick', function(grid, td, cellIndex, record) { | |
95 | - this.onGranuleSelected(record.data['id']); | |
96 | - }, this); | |
97 | - | |
98 | - this.firstPageBtn.on('click', function() { | |
99 | - this.onFirstPageBtnClicked(); | |
100 | - }, this); | |
101 | - | |
102 | - this.previousPageBtn.on('click', function() { | |
103 | - this.onPreviousPageBtnClicked(); | |
104 | - }, this); | |
105 | - | |
106 | - this.nextPageBtn.on('click', function() { | |
107 | - this.onNextPageBtnClicked(); | |
108 | - }, this); | |
109 | - | |
110 | - this.lastPageBtn.on('click', function() { | |
111 | - this.onLastPageBtnClicked(); | |
74 | + this.pagingTB.on('beforechange', function(grid, td, cellIndex, record) { | |
75 | + this.onPageChanged(); | |
112 | 76 | }, this); |
113 | 77 | |
114 | 78 | this.getBtn.on('click', function() { |
... | ... | @@ -120,43 +84,6 @@ Ext.define('amdaDesktop.EpnTapModule', { |
120 | 84 | *** Utils functions *** |
121 | 85 | **********************/ |
122 | 86 | |
123 | - /** | |
124 | - Capitalize a name and replace underscores with spaces. | |
125 | - - `name`: The string to make pretty. | |
126 | - */ | |
127 | - prettify: function(name) { | |
128 | - return name.charAt(0).toUpperCase() + name.replace(/_/g, ' ').substr(1).toLowerCase(); | |
129 | - }, | |
130 | - | |
131 | - /** | |
132 | - Capitalize a name, replace underscores with spaces, and write it in a plurial form. | |
133 | - - `name`: The string to make pretty. | |
134 | - */ | |
135 | - allPrettify: function(name) { | |
136 | - return 'All ' + (name[name.length-1] == 's' ? name : name + 's').replace(/_/g, ' ').toLowerCase(); | |
137 | - }, | |
138 | - | |
139 | - isDate: function(date) { | |
140 | - if (date === null) { | |
141 | - return false; | |
142 | - } | |
143 | - var dateArr = date.split('/'); | |
144 | - if (dateArr.length != 3 || isNaN(parseInt(dateArr[0])) || isNaN(parseInt(dateArr[1])) || isNaN(parseInt(dateArr[2])) ) { | |
145 | - return false; | |
146 | - } | |
147 | - return true; | |
148 | - }, | |
149 | - | |
150 | - /** | |
151 | - Disable or enable the navigation buttons (see `EpnTapUI.createNavigationPanel()`). | |
152 | - */ | |
153 | - disableNavBtns: function(firt, previous, next, last) { | |
154 | - this.firstPageBtn.setDisabled(firt); | |
155 | - this.previousPageBtn.setDisabled(previous); | |
156 | - this.nextPageBtn.setDisabled(next); | |
157 | - this.lastPageBtn.setDisabled(last); | |
158 | - }, | |
159 | - | |
160 | 87 | updateGetBtnStatus: function() { |
161 | 88 | var shouldEnabled = this.targetNameCB.rawValue.length > 0 && this.productTypeCB.rawValue.length > 0; |
162 | 89 | if(shouldEnabled) { |
... | ... | @@ -167,10 +94,6 @@ Ext.define('amdaDesktop.EpnTapModule', { |
167 | 94 | |
168 | 95 | }, |
169 | 96 | |
170 | - /**************************** | |
171 | - *** Service filter events *** | |
172 | - ****************************/ | |
173 | - | |
174 | 97 | /** |
175 | 98 | Called each time the epntap module is loaded. |
176 | 99 | - `target`: an array of 3 values: [target_name, dataproduct_type]; or null. |
... | ... | @@ -184,82 +107,17 @@ Ext.define('amdaDesktop.EpnTapModule', { |
184 | 107 | this.granulesStore.removeAll(); |
185 | 108 | |
186 | 109 | if(target) { |
187 | - this.targetNameCB.getStore().add({'id': target[0], 'name': this.prettify(target[0])}); | |
110 | + var name = target[0].charAt(0).toUpperCase() + target[0].replace(/_/g, ' ').substr(1).toLowerCase(); | |
111 | + this.targetNameCB.getStore().add({'id': target[0], 'name': name}); | |
188 | 112 | this.targetNameCB.select(target[0]); |
189 | 113 | this.productTypeCB.select(target[1]); |
190 | 114 | this.updateNbResults(); |
191 | 115 | } |
192 | 116 | }, |
193 | 117 | |
194 | - /********************* | |
195 | - *** Buttons events *** | |
196 | - *********************/ | |
197 | - | |
198 | - /** | |
199 | - Trigerred when the `firstPageBtn` button is clicked (see `EpnTapUI.createNavigationPanel()`). Among other things, | |
200 | - send a new query and fill `granulesGrid`. | |
201 | - */ | |
202 | - onFirstPageBtnClicked: function() { | |
203 | - var newPageNumber = 1; | |
204 | - var limit = Number(this.rowsPerPageNf.value); | |
205 | - var offset = 0; | |
206 | - var selectedService = this.servicesStore.findRecord('id', this.selectedServiceId).data; | |
207 | - | |
208 | - this.disableNavBtns(true, true, false, false); | |
209 | - this.currentPageLb.setText('' + newPageNumber); | |
210 | - loadMask.show(); | |
211 | - AmdaAction.epnTapGetGranules(selectedService['table_name'], selectedService['access_url'], this.filter, limit, offset, this.fillGranules); | |
212 | - }, | |
213 | - | |
214 | - /** | |
215 | - Trigerred when the `previousPageBtn` button is clicked (see `EpnTapUI.createNavigationPanel()`). Among other things, | |
216 | - send a new query and fill `granulesGrid`. | |
217 | - */ | |
218 | - onPreviousPageBtnClicked: function() { | |
219 | - var newPageNumber = Number(this.currentPageLb.text) - 1; | |
220 | - var limit = Number(this.rowsPerPageNf.value); | |
221 | - var offset = (newPageNumber-1) * limit; | |
222 | - var selectedService = this.servicesStore.findRecord('id', this.selectedServiceId).data; | |
223 | - | |
224 | - this.currentPageLb.setText('' + newPageNumber); | |
225 | - var isFirstPage = this.currentPageLb.text === '1'; | |
226 | - this.disableNavBtns(isFirstPage, isFirstPage, false, false); | |
227 | - loadMask.show(); | |
228 | - AmdaAction.epnTapGetGranules(selectedService['table_name'], selectedService['access_url'], this.filter, limit, offset, this.fillGranules); | |
229 | - }, | |
230 | - | |
231 | - /** | |
232 | - Trigerred when the `nextPageBtn` button is clicked (see `EpnTapUI.createNavigationPanel()`). Among other things, | |
233 | - send a new query and fill `granulesGrid`. | |
234 | - */ | |
235 | - onNextPageBtnClicked: function() { | |
236 | - var newPageNumber = Number(this.currentPageLb.text) + 1; | |
237 | - var limit = Number(this.rowsPerPageNf.value); | |
238 | - var offset = (newPageNumber-1) * limit; | |
239 | - var selectedService = this.servicesStore.findRecord('id', this.selectedServiceId).data; | |
240 | - | |
241 | - this.currentPageLb.setText('' + newPageNumber); | |
242 | - var isLastPage = this.currentPageLb.text == this.totalPagesLb.text; | |
243 | - this.disableNavBtns(false, false, isLastPage, isLastPage); | |
244 | - loadMask.show(); | |
245 | - AmdaAction.epnTapGetGranules(selectedService['table_name'], selectedService['access_url'], this.filter, limit, offset, this.fillGranules); | |
246 | - }, | |
247 | - | |
248 | - /** | |
249 | - Trigerred when the `lastPageBtn` button is clicked (see `EpnTapUI.createNavigationPanel()`). Among other things, | |
250 | - send a new query and fill `granulesGrid`. | |
251 | - */ | |
252 | - onLastPageBtnClicked: function() { | |
253 | - var newPageNumber = Number(this.totalPagesLb.text); | |
254 | - var limit = Number(this.rowsPerPageNf.value); | |
255 | - var offset = (newPageNumber-1) * limit; | |
256 | - var selectedService = this.servicesStore.findRecord('id', this.selectedServiceId).data; | |
257 | - | |
258 | - this.currentPageLb.setText('' + newPageNumber); | |
259 | - this.disableNavBtns(false, false, true, true); | |
260 | - loadMask.show(); | |
261 | - AmdaAction.epnTapGetGranules(selectedService['table_name'], selectedService['access_url'], this.filter, limit, offset, this.fillGranules); | |
262 | - }, | |
118 | + /************* | |
119 | + *** Events *** | |
120 | + *************/ | |
263 | 121 | |
264 | 122 | /** |
265 | 123 | Trigerred when the 'Get results' button is clicked. |
... | ... | @@ -272,6 +130,7 @@ Ext.define('amdaDesktop.EpnTapModule', { |
272 | 130 | |
273 | 131 | loadMask.show(); |
274 | 132 | this.servicesStore.each(function(record) { |
133 | + // TODO: use store.load() method instead. | |
275 | 134 | Ext.Ajax.request({ |
276 | 135 | url: 'php/epntap.php', |
277 | 136 | method: 'GET', |
... | ... | @@ -318,114 +177,46 @@ Ext.define('amdaDesktop.EpnTapModule', { |
318 | 177 | loadMask.hide(); |
319 | 178 | }, |
320 | 179 | |
321 | - /******************* | |
322 | - *** Grids events *** | |
323 | - *******************/ | |
324 | - | |
325 | - /** | |
326 | - Trigerred when a row is clicked in `servicesGrid` table (see `EpnTapUI.createServicesGrid()`). Among other things, | |
327 | - send a new query and fill `granulesGrid`. | |
328 | - */ | |
329 | - onServiceSelected: function(record) { | |
330 | - var nbRes = record.get('nb_results'); | |
331 | - if(nbRes <= 0 || isNaN(nbRes)) { | |
332 | - return; | |
180 | + getGranuleParams: function() { | |
181 | + return { | |
182 | + 'action': 'getGranules', | |
183 | + 'url': this.selectedService.data['access_url'], | |
184 | + 'tableName': this.selectedService.data['table_name'], | |
185 | + 'targetName': this.targetNameCB.rawValue, | |
186 | + 'productTypes': this.productTypeCB.value.join(';'), | |
187 | + 'timeMin': Ext.Date.format(this.timeSelector.getStartTime(), 'd/m/Y H:i:s'), | |
188 | + 'timeMax': Ext.Date.format(this.timeSelector.getStopTime(), 'd/m/Y H:i:s'), | |
189 | + 'nbRes': this.selectedService.get('nb_results') | |
333 | 190 | } |
334 | - var targetName = this.targetNameCB.rawValue; | |
335 | - var productTypes = this.productTypeCB.value.join(';'); | |
336 | - var timeMin = Ext.Date.format(this.timeSelector.getStartTime(), 'd/m/Y H:i:s'); // start time | |
337 | - var timeMax = Ext.Date.format(this.timeSelector.getStopTime(), 'd/m/Y H:i:s'); // stop time | |
338 | - | |
339 | - loadMask.show(); | |
340 | - Ext.Ajax.request({ | |
341 | - url: 'php/epntap.php', | |
342 | - method: 'GET', | |
343 | - headers: {'Content-Type': 'application/json'}, | |
344 | - // waitTitle: 'Connecting', | |
345 | - // waitMsg: 'Sending data...', | |
346 | - params: { | |
347 | - 'action': 'getGranules', | |
348 | - 'url': record.data['access_url'], | |
349 | - 'tableName': record.data['table_name'], | |
350 | - 'targetName': targetName, | |
351 | - 'productTypes': productTypes, | |
352 | - 'timeMin': timeMin, | |
353 | - 'timeMax': timeMax, | |
354 | - 'top': this.rowsPerPageNf.value, | |
355 | - 'offset': 0 | |
356 | - }, | |
357 | - success: this.updateGranules, | |
358 | - failure: this.updateGranulesFail, | |
359 | - scope: this | |
360 | - }); | |
361 | 191 | }, |
362 | 192 | |
363 | - updateGranules: function(response) { | |
364 | - try { | |
365 | - granules = JSON.parse(response.responseText); | |
366 | - } catch (e) { | |
367 | - response.responseText = 'Can not decode the returned Json.' | |
368 | - this.updateGranulesFail(response); | |
369 | - } | |
370 | - this.granulesStore.add(granules); | |
371 | - loadMask.hide(); | |
193 | + onPageChanged: function() { | |
194 | + var myProxy = this.granulesStore.getProxy(); | |
195 | + myProxy.params = this.getGranuleParams(); | |
196 | + myProxy.extraParams = this.getGranuleParams(); | |
197 | + // //--- Set value to your parameter ----// | |
198 | + // myProxy.setExtraParam('url', this.selectedService.data['access_url']); | |
199 | + // myProxy.setExtraParam('MENU_DETAIL', '555555'); | |
372 | 200 | }, |
373 | - | |
374 | 201 | /** |
375 | - Trigerred when a row is clicked in `granulesGrid` table (see `EpnTapUI.createGranulesGrid()`). | |
376 | - */ | |
377 | - updateGranulesFail: function(granule) { | |
378 | - var reason = response.status === 200 ? response.responseText : response.statusText; | |
379 | - Ext.Msg.alert('Can not display granules: ' + reason); | |
380 | - loadMask.hide(); | |
381 | - // console.log('selected granule: ', granule); | |
382 | - }, | |
383 | - | |
384 | - /********************** | |
385 | - *** Other functions *** | |
386 | - **********************/ | |
387 | - | |
388 | - /** | |
389 | - Callback function, called from the PHP script when the query result is received, when a service is selected. | |
390 | - | |
391 | - Among other things, update the `epnTapCurrentPageLb` label (see `EpnTapUI.createNavigationPanel()`). | |
392 | - */ | |
393 | - updateNbRows: function(nb_results) { | |
394 | - var totalPages = Math.ceil(Number(nb_results) / Ext.getCmp('epnTapRowsPerPageNf').value); | |
395 | - | |
396 | - Ext.getCmp('epnTapCurrentPageLb').setText(totalPages == 0 ? '-' : '1'); | |
397 | - Ext.getCmp('epnTapTotalPagesLb').setText(totalPages == 0 ? '-' : totalPages); | |
398 | - | |
399 | - Ext.getCmp('epnTapPreviousPageBtn').setDisabled(true); | |
400 | - Ext.getCmp('epnTapFirstPageBtn').setDisabled(true); | |
401 | - Ext.getCmp('epnTapNextPageBtn').setDisabled(totalPages <= 1); | |
402 | - Ext.getCmp('epnTapLastPageBtn').setDisabled(totalPages <= 1); | |
403 | - }, | |
404 | - | |
405 | - /** | |
406 | - Callback function, called from the PHP script when the query result is received, when a service is selected or a | |
407 | - navigation button is clicked. | |
408 | - | |
409 | - Among other things, fill the `epnTapGranulesGrid` table (see `EpnTapUI.granulesStore`). | |
202 | + Trigerred when a row is clicked in `servicesGrid` table (see `EpnTapUI.createServicesGrid()`). Among other things, | |
203 | + send a new query and fill `granulesGrid`. | |
410 | 204 | */ |
411 | - fillGranules: function(granules) { | |
412 | - loadMask.hide(); | |
413 | - | |
414 | - if (granules["error"] != null) { | |
415 | - console.log('Can not get request response:', granules["error"]); | |
416 | - if(granules["error"] == "no result") { | |
417 | - Ext.Msg.alert('There is no result for this query.'); | |
418 | - } else { | |
419 | - Ext.Msg.alert('Can not display granules due to an error from the selected epn-tap service.'); | |
420 | - } | |
421 | - } else { | |
422 | - try { | |
423 | - Ext.getCmp('epnTapGranulesGrid').getStore().removeAll(); | |
424 | - Ext.getCmp('epnTapGranulesGrid').getStore().add(granules); | |
425 | - } catch( e ) { | |
426 | - console.log('Can not add granules: ' + e); | |
427 | - Ext.Msg.alert('Can not display granules due to an error from the selected epn-tap service.'); | |
428 | - } | |
205 | + onServiceSelected: function(record) { | |
206 | + this.selectedService = record; | |
207 | + var nbRes = this.selectedService.get('nb_results'); | |
208 | + if(nbRes > 0 && !isNaN(nbRes)) { | |
209 | + loadMask.show(); | |
210 | + this.granulesStore.load({ | |
211 | + params: this.getGranuleParams(), | |
212 | + start: 0, | |
213 | + limit: this.granulesStore.pageSize, | |
214 | + callback: function(records, operation, success) { | |
215 | + console.log(records, operation); | |
216 | + loadMask.hide(); | |
217 | + }, | |
218 | + scope: this | |
219 | + }); | |
429 | 220 | } |
430 | 221 | } |
431 | 222 | }); |
... | ... |
js/app/views/EpnTapUI.js
... | ... | @@ -137,7 +137,20 @@ selected. |
137 | 137 | */ |
138 | 138 | Ext.create('Ext.data.Store', { |
139 | 139 | storeId:'granulesStore', |
140 | - fields:['num', 'dataproduct_type', 'target_name', 'time_min', 'time_max', 'access_format', 'granule_uid', 'access_estsize', 'access_url', 'thumbnail_url'] | |
140 | + pageSize: 25, | |
141 | + autoload: false, | |
142 | + fields:['num', 'dataproduct_type', 'target_name', 'time_min', 'time_max', 'access_format', 'granule_uid', 'access_estsize', 'access_url', 'thumbnail_url'], | |
143 | + proxy: { | |
144 | + type: 'ajax', | |
145 | + url: 'php/epntap.php', | |
146 | + reader: { | |
147 | + type: 'json', | |
148 | + root: 'rows' | |
149 | + } | |
150 | + }, | |
151 | + sorters: [ | |
152 | + {property: 'num', direction: 'ASC'} | |
153 | + ] | |
141 | 154 | }); |
142 | 155 | |
143 | 156 | /** |
... | ... | @@ -217,8 +230,6 @@ Ext.define('amdaUI.EpnTapUI', { |
217 | 230 | }, { // Right part |
218 | 231 | xtype : 'container', |
219 | 232 | items: [ |
220 | - this.createRowPerPageNf(), | |
221 | - this.createNavigationPanel(), | |
222 | 233 | this.createSendButton() |
223 | 234 | ] |
224 | 235 | |
... | ... | @@ -332,92 +343,6 @@ Ext.define('amdaUI.EpnTapUI', { |
332 | 343 | ***********************/ |
333 | 344 | |
334 | 345 | /** |
335 | - Create `epnTapRowsPerPageNf`, a ExtJS Number field, allowing the user to select the number of rows to display in | |
336 | - `epnTapGranulesGrid`. | |
337 | - | |
338 | - When a new number is entered, it triggers `EpnTapModule.onRowsPerPageChanged()`. | |
339 | - */ | |
340 | - createRowPerPageNf: function() { | |
341 | - return { | |
342 | - xtype: 'numberfield', | |
343 | - id: 'epnTapRowsPerPageNf', | |
344 | - fieldLabel: 'Rows per page', | |
345 | - labelWidth: 85, | |
346 | - margin: '4 0 4 0', | |
347 | - width: 140, | |
348 | - height: 20, | |
349 | - value: 20, | |
350 | - minValue: 1, | |
351 | - maxValue: 2000 | |
352 | - }; | |
353 | - }, | |
354 | - | |
355 | - /** | |
356 | - Create `epnTapNavigationPanel`, an ExtJSPanel containing several elements in order to navigate through the | |
357 | - different pages of the query result. If the number of results is highter than the `epnTapRowsPerPageNf` field | |
358 | - value, the result appears to be displayed in different pages. This panel is used to select and display the page | |
359 | - number, mainly with these following elements: | |
360 | - - `epnTapFirstPageBtn`: an ExtJS Button, used to come back to the first page of result, | |
361 | - handling `EpnTapModule.onFirstPageBtnClicked()`; | |
362 | - - `epnTapPreviousPageBtn`: an ExtJS Button, used to come back to the previous page of result, | |
363 | - handling `EpnTapModule.onPreviousPageBtnClicked()`; | |
364 | - - `epnTapCurrentPageLb`: an ExtJS Label, displaying the actual current page; TODO: use a Number field instead! | |
365 | - - `epnTapTotalPagesLb`: an ExtJS Label, displaying the total page number of results (according to the | |
366 | - `epnTapRowsPerPageNf` field value); | |
367 | - - `epnTapNextPageBtn`: an ExtJS Button, used to go to the next page of result, | |
368 | - handling `EpnTapModule.onNextPageBtnClicked()`; | |
369 | - - `epnTapLastPageBtn`: an ExtJS Button, used to come back to the last page of result, | |
370 | - handling `EpnTapModule.onLastPageBtnClicked()`. | |
371 | - | |
372 | - Note: Pages are not actually a "graphical filter": when the user navigate through the pages, a new query is send | |
373 | - to the server with the corresponding range, which improves the response time on large requests. | |
374 | - */ | |
375 | - createNavigationPanel: function() { | |
376 | - return { | |
377 | - xtype: 'container', | |
378 | - width: 145, | |
379 | - defaults: {margin: '0 5 0 0', xtype: 'button', disabled: true}, | |
380 | - items: [{ | |
381 | - id: 'epnTapFirstPageBtn', | |
382 | - text: '|<', | |
383 | - width: 26, | |
384 | - tooltip: 'First page' | |
385 | - }, { | |
386 | - id: 'epnTapPreviousPageBtn', | |
387 | - text: '<', | |
388 | - width: 26, | |
389 | - tooltip: 'Previous page' | |
390 | - }, { | |
391 | - xtype: 'label', | |
392 | - id: 'epnTapCurrentPageLb', | |
393 | - tooltip: 'Current page', | |
394 | - text: '0', | |
395 | - margin: 0 | |
396 | - }, { | |
397 | - xtype: 'label', | |
398 | - text: '/', | |
399 | - margin: 0 | |
400 | - }, { | |
401 | - xtype: 'label', | |
402 | - id: 'epnTapTotalPagesLb', | |
403 | - tooltip: 'Total pages', | |
404 | - text: '0', | |
405 | - }, { | |
406 | - id: 'epnTapNextPageBtn', | |
407 | - text: '>', | |
408 | - width: 26, | |
409 | - tooltip: 'Next page' | |
410 | - }, { | |
411 | - id: 'epnTapLastPageBtn', | |
412 | - text: '>|', | |
413 | - width: 26, | |
414 | - margin: 0, | |
415 | - tooltip: 'Last page' | |
416 | - }] | |
417 | - }; | |
418 | - }, | |
419 | - | |
420 | - /** | |
421 | 346 | The button used to send the query. |
422 | 347 | */ |
423 | 348 | createSendButton: function() { |
... | ... | @@ -427,7 +352,8 @@ Ext.define('amdaUI.EpnTapUI', { |
427 | 352 | text: 'Get results', |
428 | 353 | disabled: true, |
429 | 354 | width: 140, |
430 | - margin: '5 0 0 0' | |
355 | + height: 50, | |
356 | + margin: 10 | |
431 | 357 | } |
432 | 358 | }, |
433 | 359 | |
... | ... | @@ -670,6 +596,30 @@ Ext.define('amdaUI.EpnTapUI', { |
670 | 596 | { text: 'URL', dataIndex: 'access_url', flex: 1, renderer: linkRender }, |
671 | 597 | { text: 'Thumb.', dataIndex: 'thumbnail_url', flex: 1, renderer: imgRender} |
672 | 598 | ], |
599 | + dockedItems: [{ | |
600 | + xtype: 'pagingtoolbar', | |
601 | + id: 'epnTapPagingTB', | |
602 | + store: Ext.data.StoreManager.lookup('granulesStore'), | |
603 | + dock: 'bottom', | |
604 | + displayInfo: true, | |
605 | + items: [{ | |
606 | + xtype: 'tbseparator' | |
607 | + }, { | |
608 | + xtype: 'numberfield', | |
609 | + id: 'epnTapRowsPerPageNf', | |
610 | + fieldLabel: 'Rows per page', | |
611 | + labelWidth: 78, | |
612 | + width: 150, | |
613 | + value: Ext.data.StoreManager.lookup('granulesStore').pageSize, | |
614 | + minValue: 1, | |
615 | + maxValue: 2000, | |
616 | + listeners: { | |
617 | + change: function(newValue, oldValue) { | |
618 | + Ext.data.StoreManager.lookup('granulesStore').pageSize = newValue; | |
619 | + } | |
620 | + } | |
621 | + }] | |
622 | + }], | |
673 | 623 | renderTo: Ext.getBody() |
674 | 624 | }); |
675 | 625 | |
... | ... |
php/epntap.php
... | ... | @@ -80,6 +80,8 @@ function getNbResults() { |
80 | 80 | return 'Too few returned raws.'; |
81 | 81 | } else if(count($result) > 1) { |
82 | 82 | return 'Too many returned raws.'; |
83 | + } else if(!array_key_exists(0, $result)) { | |
84 | + return 'cant find raw item 0'; | |
83 | 85 | } else if(is_null($result[0])) { |
84 | 86 | return 'The returned raw is null.'; |
85 | 87 | } else if(!array_key_exists("nb_rows", $result[0])) { |
... | ... | @@ -92,21 +94,24 @@ function getNbResults() { |
92 | 94 | } |
93 | 95 | |
94 | 96 | function getGranules() { |
97 | + error_log(json_encode($_GET)); | |
95 | 98 | $url = filter_var($_GET['url'], FILTER_SANITIZE_STRING, FILTER_FLAG_STRIP_LOW); |
96 | 99 | $tableName = filter_var($_GET['tableName'], FILTER_SANITIZE_STRING, FILTER_FLAG_STRIP_LOW); |
97 | 100 | $targetName = filter_var($_GET['targetName'], FILTER_SANITIZE_STRING, FILTER_FLAG_STRIP_LOW); |
98 | 101 | $productTypes = filter_var($_GET['productTypes'], FILTER_SANITIZE_STRING, FILTER_FLAG_STRIP_LOW); |
99 | 102 | $timeMin = filter_var($_GET['timeMin'], FILTER_SANITIZE_STRING, FILTER_FLAG_STRIP_LOW); |
100 | 103 | $timeMax = filter_var($_GET['timeMax'], FILTER_SANITIZE_STRING, FILTER_FLAG_STRIP_LOW); |
101 | - $top = filter_var($_GET['top'], FILTER_SANITIZE_STRING, FILTER_FLAG_STRIP_LOW); | |
102 | - $offset = filter_var($_GET['offset'], FILTER_SANITIZE_STRING, FILTER_FLAG_STRIP_LOW); | |
104 | + $start = filter_var($_GET['start'], FILTER_SANITIZE_STRING, FILTER_FLAG_STRIP_LOW); | |
105 | + $limit = filter_var($_GET['limit'], FILTER_SANITIZE_STRING, FILTER_FLAG_STRIP_LOW); | |
106 | + $nbRes = filter_var($_GET['nbRes'], FILTER_SANITIZE_STRING, FILTER_FLAG_STRIP_LOW); | |
103 | 107 | |
104 | 108 | // TODO find a way to handle 'non existing key errors' (and then add access_format) |
105 | 109 | $columns = "dataproduct_type, target_name, time_min, time_max, granule_uid, access_estsize, access_url, thumbnail_url"; |
106 | 110 | $filter = createFilter($targetName, $productTypes, $timeMin, $timeMax); |
107 | - $query = "SELECT TOP $top $columns FROM $tableName $filter OFFSET $offset"; | |
108 | - $result = request($url, $query); | |
109 | - return $result; | |
111 | + $query = "SELECT TOP $limit $columns FROM $tableName $filter OFFSET $start"; | |
112 | + $rows = request($url, $query); | |
113 | + return ['success' => true, 'total' => $nbRes, 'rows' => $rows]; | |
114 | + // return $rows; | |
110 | 115 | } |
111 | 116 | |
112 | 117 | // ----- utils ----- |
... | ... |