1
|
|
|
/* |
2
|
|
|
backbone.paginator |
3
|
|
|
http://github.com/backbone-paginator/backbone.paginator |
4
|
|
|
|
5
|
|
|
Copyright (c) 2016 Jimmy Yuen Ho Wong and contributors |
6
|
|
|
|
7
|
|
|
@module |
8
|
|
|
@license MIT |
9
|
|
|
*/ |
10
|
|
|
|
11
|
|
|
(function (factory) { |
12
|
|
|
|
13
|
|
|
// CommonJS |
14
|
|
|
if (typeof exports == "object" && typeof require == "function") { |
15
|
|
|
module.exports = factory(require("underscore"), require("backbone")); |
16
|
|
|
} |
17
|
|
|
// AMD |
18
|
|
|
else if (typeof define == "function" && define.amd) { |
|
|
|
|
19
|
|
|
define(["underscore", "backbone"], factory); |
20
|
|
|
} |
21
|
|
|
// Browser |
22
|
|
|
else if (typeof _ !== "undefined" && typeof Backbone !== "undefined") { |
|
|
|
|
23
|
|
|
var oldPageableCollection = Backbone.PageableCollection; |
24
|
|
|
var PageableCollection = factory(_, Backbone); |
25
|
|
|
|
26
|
|
|
/** |
27
|
|
|
__BROWSER ONLY__ |
28
|
|
|
|
29
|
|
|
If you already have an object named `PageableCollection` attached to the |
30
|
|
|
`Backbone` module, you can use this to return a local reference to this |
31
|
|
|
PageableCollection class and reset the name PageableCollection to its |
32
|
|
|
previous definition. |
33
|
|
|
|
34
|
|
|
// The left hand side gives you a reference to this |
35
|
|
|
// PageableCollection implementation, the right hand side |
36
|
|
|
// resets PageableCollection to your other PageableCollection. |
37
|
|
|
var PageableCollection = PageableCollection.noConflict(); |
38
|
|
|
|
39
|
|
|
@static |
40
|
|
|
@return {PageableCollection} |
41
|
|
|
*/ |
42
|
|
|
Backbone.PageableCollection.noConflict = function () { |
43
|
|
|
Backbone.PageableCollection = oldPageableCollection; |
|
|
|
|
44
|
|
|
return PageableCollection; |
45
|
|
|
}; |
46
|
|
|
} |
47
|
|
|
|
48
|
|
|
}(function (_, Backbone) { |
49
|
|
|
|
50
|
|
|
"use strict"; |
51
|
|
|
|
52
|
|
|
var _extend = _.extend; |
53
|
|
|
var _omit = _.omit; |
54
|
|
|
var _clone = _.clone; |
55
|
|
|
var _each = _.each; |
56
|
|
|
var _pick = _.pick; |
57
|
|
|
var _contains = _.contains; |
58
|
|
|
var _isEmpty = _.isEmpty; |
59
|
|
|
var _pairs = _.pairs; |
60
|
|
|
var _invert = _.invert; |
61
|
|
|
var _isArray = _.isArray; |
62
|
|
|
var _isFunction = _.isFunction; |
63
|
|
|
var _isObject = _.isObject; |
64
|
|
|
var _keys = _.keys; |
65
|
|
|
var _isUndefined = _.isUndefined; |
66
|
|
|
var ceil = Math.ceil; |
67
|
|
|
var floor = Math.floor; |
68
|
|
|
var max = Math.max; |
69
|
|
|
|
70
|
|
|
var BBColProto = Backbone.Collection.prototype; |
71
|
|
|
|
72
|
|
|
function finiteInt (val, name) { |
73
|
|
|
if (!_.isNumber(val) || _.isNaN(val) || !_.isFinite(val) || ~~val !== val) { |
74
|
|
|
throw new TypeError("`" + name + "` must be a finite integer"); |
75
|
|
|
} |
76
|
|
|
return val; |
77
|
|
|
} |
78
|
|
|
|
79
|
|
|
function queryStringToParams (qs) { |
80
|
|
|
var kvp, k, v, ls, params = {}, decode = decodeURIComponent; |
|
|
|
|
81
|
|
|
var kvps = qs.split('&'); |
82
|
|
|
for (var i = 0, l = kvps.length; i < l; i++) { |
83
|
|
|
var param = kvps[i]; |
84
|
|
|
kvp = param.split('='), k = kvp[0], v = kvp[1]; |
|
|
|
|
85
|
|
|
if (v == null) v = true; |
|
|
|
|
86
|
|
|
k = decode(k), v = decode(v), ls = params[k]; |
|
|
|
|
87
|
|
|
if (_isArray(ls)) ls.push(v); |
|
|
|
|
88
|
|
|
else if (ls) params[k] = [ls, v]; |
|
|
|
|
89
|
|
|
else params[k] = v; |
90
|
|
|
} |
91
|
|
|
return params; |
92
|
|
|
} |
93
|
|
|
|
94
|
|
|
// hack to make sure the whatever event handlers for this event is run |
95
|
|
|
// before func is, and the event handlers that func will trigger. |
96
|
|
|
function runOnceAtLastHandler (col, event, func) { |
97
|
|
|
var eventHandlers = col._events[event]; |
98
|
|
|
if (eventHandlers && eventHandlers.length) { |
99
|
|
|
var lastHandler = eventHandlers[eventHandlers.length - 1]; |
100
|
|
|
var oldCallback = lastHandler.callback; |
101
|
|
|
lastHandler.callback = function () { |
102
|
|
|
try { |
103
|
|
|
oldCallback.apply(this, arguments); |
104
|
|
|
func(); |
105
|
|
|
} |
106
|
|
|
catch (e) { |
107
|
|
|
throw e; |
108
|
|
|
} |
109
|
|
|
finally { |
110
|
|
|
lastHandler.callback = oldCallback; |
111
|
|
|
} |
112
|
|
|
}; |
113
|
|
|
} |
114
|
|
|
else func(); |
|
|
|
|
115
|
|
|
} |
116
|
|
|
|
117
|
|
|
var PARAM_TRIM_RE = /[\s'"]/g; |
118
|
|
|
var URL_TRIM_RE = /[<>\s'"]/g; |
119
|
|
|
|
120
|
|
|
|
121
|
|
|
/** |
122
|
|
|
* State change event. Fired when PageableCollection#state gets updated |
123
|
|
|
* |
124
|
|
|
* @event pageable:state:change |
125
|
|
|
* @type {object} The PageableCollection#state object of this |
126
|
|
|
* PageableCollection instance |
127
|
|
|
*/ |
128
|
|
|
|
129
|
|
|
|
130
|
|
|
/** |
131
|
|
|
Drop-in replacement for Backbone.Collection. Supports server-side and |
132
|
|
|
client-side pagination and sorting. Client-side mode also support fully |
133
|
|
|
multi-directional synchronization of changes between pages. |
134
|
|
|
|
135
|
|
|
@class PageableCollection |
136
|
|
|
@extends Backbone.Collection |
137
|
|
|
*/ |
138
|
|
|
var PageableCollection = Backbone.PageableCollection = Backbone.Collection.extend({ |
139
|
|
|
|
140
|
|
|
/** |
141
|
|
|
The container object to store all pagination states. |
142
|
|
|
|
143
|
|
|
You can override the default state by extending this class or specifying |
144
|
|
|
them in an `options` hash to the constructor. |
145
|
|
|
|
146
|
|
|
@property {number} firstPage = 1 - The first page index. Set to 0 if |
147
|
|
|
your server API uses 0-based indices. You should only override this value |
148
|
|
|
during extension, initialization or reset by the server after |
149
|
|
|
fetching. This value should be read only at other times. |
150
|
|
|
|
151
|
|
|
@property {number} lastPage = null - The last page index. This value |
152
|
|
|
is __read only__ and it's calculated based on whether `firstPage` is 0 or |
153
|
|
|
1, during bootstrapping, fetching and resetting. Please don't change this |
154
|
|
|
value under any circumstances. |
155
|
|
|
|
156
|
|
|
@property {number} currentPage = null - The current page index. You |
157
|
|
|
should only override this value during extension, initialization or reset |
158
|
|
|
by the server after fetching. This value should be read only at other |
159
|
|
|
times. Can be a 0-based or 1-based index, depending on whether |
160
|
|
|
`firstPage` is 0 or 1. If left as default, it will be set to `firstPage` |
161
|
|
|
on initialization. |
162
|
|
|
|
163
|
|
|
@property {number} pageSize = 25 - How many records to show per |
164
|
|
|
page. This value is __read only__ after initialization, if you want to |
165
|
|
|
change the page size after initialization, you must call |
166
|
|
|
PageableCollection#setPageSize. |
167
|
|
|
|
168
|
|
|
@property {number} totalPages = null - How many pages there are. This |
169
|
|
|
value is __read only__ and it is calculated from `totalRecords`. |
170
|
|
|
|
171
|
|
|
@property {number} totalRecords = null - How many records there |
172
|
|
|
are. This value is __required__ under server mode. This value is optional |
173
|
|
|
for client mode as the number will be the same as the number of models |
174
|
|
|
during bootstrapping and during fetching, either supplied by the server |
175
|
|
|
in the metadata, or calculated from the size of the response. |
176
|
|
|
|
177
|
|
|
@property {string} sortKey = null - The model attribute to use for |
178
|
|
|
sorting. |
179
|
|
|
|
180
|
|
|
@property {number} order = -1 - The order to use for sorting. Specify |
181
|
|
|
-1 for ascending order or 1 for descending order. If 0, no client side |
182
|
|
|
sorting will be done and the order query parameter will not be sent to |
183
|
|
|
the server during a fetch. |
184
|
|
|
*/ |
185
|
|
|
state: { |
186
|
|
|
firstPage: 1, |
187
|
|
|
lastPage: null, |
188
|
|
|
currentPage: null, |
189
|
|
|
pageSize: 25, |
190
|
|
|
totalPages: null, |
191
|
|
|
totalRecords: null, |
192
|
|
|
sortKey: null, |
193
|
|
|
order: -1 |
194
|
|
|
}, |
195
|
|
|
|
196
|
|
|
/** |
197
|
|
|
@property {string} mode = "server" The mode of operations for this |
198
|
|
|
collection. `"server"` paginates on the server-side, `"client"` paginates |
199
|
|
|
on the client-side and `"infinite"` paginates on the server-side for APIs |
200
|
|
|
that do not support `totalRecords`. |
201
|
|
|
*/ |
202
|
|
|
mode: "server", |
203
|
|
|
|
204
|
|
|
/** |
205
|
|
|
A translation map to convert PageableCollection state attributes |
206
|
|
|
to the query parameters accepted by your server API. |
207
|
|
|
|
208
|
|
|
You can override the default state by extending this class or specifying |
209
|
|
|
them in `options.queryParams` object hash to the constructor. |
210
|
|
|
|
211
|
|
|
@property {string|function():string} currentPage = "page" |
212
|
|
|
@property {string|function():string} pageSize = "per_page" |
213
|
|
|
@property {string|function():string} totalPages = "total_pages" |
214
|
|
|
@property {string|function():string} totalRecords = "total_entries" |
215
|
|
|
@property {string|function():string} sortKey = "sort_by" |
216
|
|
|
@property {string|function():string} order = "order" |
217
|
|
|
@property {Object} directions = {"-1": "asc", "1": "desc"} - A map for |
218
|
|
|
translating a PageableCollection#state.order constant to the ones your |
219
|
|
|
server API accepts. |
220
|
|
|
*/ |
221
|
|
|
queryParams: { |
222
|
|
|
currentPage: "page", |
223
|
|
|
pageSize: "per_page", |
224
|
|
|
totalPages: "total_pages", |
225
|
|
|
totalRecords: "total_entries", |
226
|
|
|
sortKey: "sort_by", |
227
|
|
|
order: "order", |
228
|
|
|
directions: { |
229
|
|
|
"-1": "asc", |
230
|
|
|
"1": "desc" |
231
|
|
|
} |
232
|
|
|
}, |
233
|
|
|
|
234
|
|
|
/** |
235
|
|
|
Given a list of models or model attributues, bootstraps the full |
236
|
|
|
collection in client mode or infinite mode, or just the page you want in |
237
|
|
|
server mode. |
238
|
|
|
|
239
|
|
|
If you want to initialize a collection to a different state than the |
240
|
|
|
default, you can specify them in `options.state`. Any state parameters |
241
|
|
|
supplied will be merged with the default. If you want to change the |
242
|
|
|
default mapping from PageableCollection#state keys to your server API's |
243
|
|
|
query parameter names, you can specifiy an object hash in |
244
|
|
|
`option.queryParams`. Likewise, any mapping provided will be merged with |
245
|
|
|
the default. Lastly, all Backbone.Collection constructor options are also |
246
|
|
|
accepted. |
247
|
|
|
|
248
|
|
|
See: |
249
|
|
|
|
250
|
|
|
- PageableCollection#state |
251
|
|
|
- PageableCollection#queryParams |
252
|
|
|
- [Backbone.Collection#initialize](http://backbonejs.org/#Collection-constructor) |
253
|
|
|
|
254
|
|
|
@constructor |
255
|
|
|
|
256
|
|
|
@property {Backbone.Collection} fullCollection - __CLIENT MODE ONLY__ |
257
|
|
|
This collection is the internal storage for the bootstrapped or fetched |
258
|
|
|
models. You can use this if you want to operate on all the pages. |
259
|
|
|
|
260
|
|
|
@param {Array.<Object>} models |
261
|
|
|
|
262
|
|
|
@param {Object} options |
263
|
|
|
|
264
|
|
|
@param {function(*, *): number} options.comparator - If specified, this |
265
|
|
|
comparator is set to the current page under server mode, or the |
266
|
|
|
PageableCollection#fullCollection otherwise. |
267
|
|
|
|
268
|
|
|
@param {boolean} options.full 0 If `false` and either a |
269
|
|
|
`options.comparator` or `sortKey` is defined, the comparator is attached |
270
|
|
|
to the current page. Default is `true` under client or infinite mode and |
271
|
|
|
the comparator will be attached to the PageableCollection#fullCollection. |
272
|
|
|
|
273
|
|
|
@param {Object} options.state - The state attributes overriding the defaults. |
274
|
|
|
|
275
|
|
|
@param {string} options.state.sortKey - The model attribute to use for |
276
|
|
|
sorting. If specified instead of `options.comparator`, a comparator will |
277
|
|
|
be automatically created using this value, and optionally a sorting order |
278
|
|
|
specified in `options.state.order`. The comparator is then attached to |
279
|
|
|
the new collection instance. |
280
|
|
|
|
281
|
|
|
@param {number} options.state.order - The order to use for sorting. Specify |
282
|
|
|
-1 for ascending order and 1 for descending order. |
283
|
|
|
|
284
|
|
|
@param {Object} options.queryParam |
285
|
|
|
*/ |
286
|
|
|
constructor: function (models, options) { |
287
|
|
|
|
288
|
|
|
BBColProto.constructor.apply(this, arguments); |
289
|
|
|
|
290
|
|
|
options = options || {}; |
291
|
|
|
|
292
|
|
|
var mode = this.mode = options.mode || this.mode || PageableProto.mode; |
293
|
|
|
|
294
|
|
|
var queryParams = _extend({}, PageableProto.queryParams, this.queryParams, |
295
|
|
|
options.queryParams || {}); |
296
|
|
|
|
297
|
|
|
queryParams.directions = _extend({}, |
298
|
|
|
PageableProto.queryParams.directions, |
299
|
|
|
this.queryParams.directions, |
300
|
|
|
queryParams.directions); |
301
|
|
|
|
302
|
|
|
this.queryParams = queryParams; |
303
|
|
|
|
304
|
|
|
var state = this.state = _extend({}, PageableProto.state, this.state, |
305
|
|
|
options.state); |
306
|
|
|
|
307
|
|
|
state.currentPage = state.currentPage == null ? |
|
|
|
|
308
|
|
|
state.firstPage : |
309
|
|
|
state.currentPage; |
310
|
|
|
|
311
|
|
|
if (!_isArray(models)) models = models ? [models] : []; |
|
|
|
|
312
|
|
|
models = models.slice(); |
313
|
|
|
|
314
|
|
|
if (mode != "server" && state.totalRecords == null && !_isEmpty(models)) { |
|
|
|
|
315
|
|
|
// Can't use models.length naively here because Backbone.Collection will |
316
|
|
|
// dedupe by `idAttribute` |
317
|
|
|
state.totalRecords = this.length; |
318
|
|
|
} |
319
|
|
|
|
320
|
|
|
this.switchMode(mode, _extend({fetch: false, |
321
|
|
|
resetState: false, |
322
|
|
|
models: models}, options)); |
323
|
|
|
|
324
|
|
|
var comparator = options.comparator; |
325
|
|
|
|
326
|
|
|
if (state.sortKey && !comparator) { |
327
|
|
|
this.setSorting(state.sortKey, state.order, options); |
328
|
|
|
} |
329
|
|
|
|
330
|
|
|
if (mode != "server") { |
331
|
|
|
var fullCollection = this.fullCollection; |
332
|
|
|
|
333
|
|
|
if (comparator && options.full) { |
334
|
|
|
this.comparator = null; |
335
|
|
|
fullCollection.comparator = comparator; |
336
|
|
|
} |
337
|
|
|
|
338
|
|
|
if (options.full) fullCollection.sort(); |
|
|
|
|
339
|
|
|
|
340
|
|
|
// make sure the models in the current page and full collection have the |
341
|
|
|
// same references |
342
|
|
|
if (!_isEmpty(models)) { |
343
|
|
|
this.reset(models, _extend({silent: true}, options)); |
344
|
|
|
this.getPage(state.currentPage); |
345
|
|
|
models.splice.apply(models, [0, models.length].concat(this.models)); |
346
|
|
|
} |
347
|
|
|
} |
348
|
|
|
|
349
|
|
|
this._initState = _clone(this.state); |
350
|
|
|
}, |
351
|
|
|
|
352
|
|
|
/** |
353
|
|
|
Makes a Backbone.Collection that contains all the pages. |
354
|
|
|
|
355
|
|
|
@private |
356
|
|
|
@param {Array.<Object|Backbone.Model>} models |
357
|
|
|
@param {Object} options Options for Backbone.Collection constructor. |
358
|
|
|
@return {Backbone.Collection} |
359
|
|
|
*/ |
360
|
|
|
_makeFullCollection: function (models, options) { |
361
|
|
|
|
362
|
|
|
var properties = ["url", "model", "sync", "comparator"]; |
363
|
|
|
var thisProto = this.constructor.prototype; |
364
|
|
|
var i, length, prop; |
365
|
|
|
|
366
|
|
|
var proto = {}; |
367
|
|
|
for (i = 0, length = properties.length; i < length; i++) { |
368
|
|
|
prop = properties[i]; |
369
|
|
|
if (!_isUndefined(thisProto[prop])) { |
370
|
|
|
proto[prop] = thisProto[prop]; |
371
|
|
|
} |
372
|
|
|
} |
373
|
|
|
|
374
|
|
|
var fullCollection = new (Backbone.Collection.extend(proto))(models, options); |
375
|
|
|
|
376
|
|
|
for (i = 0, length = properties.length; i < length; i++) { |
377
|
|
|
prop = properties[i]; |
378
|
|
|
if (this[prop] !== thisProto[prop]) { |
379
|
|
|
fullCollection[prop] = this[prop]; |
380
|
|
|
} |
381
|
|
|
} |
382
|
|
|
|
383
|
|
|
return fullCollection; |
384
|
|
|
}, |
385
|
|
|
|
386
|
|
|
/** |
387
|
|
|
Factory method that returns a Backbone event handler that responses to |
388
|
|
|
the `add`, `remove`, `reset`, and the `sort` events. The returned event |
389
|
|
|
handler will synchronize the current page collection and the full |
390
|
|
|
collection's models. |
391
|
|
|
|
392
|
|
|
@private |
393
|
|
|
|
394
|
|
|
@fires PageableCollection#pageable:state:change when handling an |
395
|
|
|
`add`, `remove`, or `reset` event |
396
|
|
|
|
397
|
|
|
@param {PageableCollection} pageCol |
398
|
|
|
@param {Backbone.Collection} fullCol |
399
|
|
|
|
400
|
|
|
@return {function(string, Backbone.Model, Backbone.Collection, Object)} |
401
|
|
|
Collection event handler |
402
|
|
|
*/ |
403
|
|
|
_makeCollectionEventHandler: function (pageCol, fullCol) { |
404
|
|
|
|
405
|
|
|
return function collectionEventHandler (event, model, collection, options) { |
406
|
|
|
|
407
|
|
|
var handlers = pageCol._handlers; |
408
|
|
|
_each(_keys(handlers), function (event) { |
409
|
|
|
var handler = handlers[event]; |
410
|
|
|
pageCol.off(event, handler); |
411
|
|
|
fullCol.off(event, handler); |
412
|
|
|
}); |
413
|
|
|
|
414
|
|
|
var state = _clone(pageCol.state); |
415
|
|
|
var firstPage = state.firstPage; |
416
|
|
|
var currentPage = firstPage === 0 ? |
417
|
|
|
state.currentPage : |
418
|
|
|
state.currentPage - 1; |
419
|
|
|
var pageSize = state.pageSize; |
420
|
|
|
var pageStart = currentPage * pageSize, pageEnd = pageStart + pageSize; |
421
|
|
|
|
422
|
|
|
if (event == "add") { |
423
|
|
|
var pageIndex, fullIndex, addAt, colToAdd, options = options || {}; |
|
|
|
|
424
|
|
|
if (collection == fullCol) { |
425
|
|
|
fullIndex = fullCol.indexOf(model); |
426
|
|
|
if (fullIndex >= pageStart && fullIndex < pageEnd) { |
427
|
|
|
colToAdd = pageCol; |
428
|
|
|
pageIndex = addAt = fullIndex - pageStart; |
429
|
|
|
} |
430
|
|
|
} |
431
|
|
|
else { |
432
|
|
|
pageIndex = pageCol.indexOf(model); |
433
|
|
|
fullIndex = pageStart + pageIndex; |
434
|
|
|
colToAdd = fullCol; |
435
|
|
|
var addAt = !_isUndefined(options.at) ? |
|
|
|
|
436
|
|
|
options.at + pageStart : |
437
|
|
|
fullIndex; |
438
|
|
|
} |
439
|
|
|
|
440
|
|
|
if (!options.onRemove) { |
441
|
|
|
++state.totalRecords; |
442
|
|
|
delete options.onRemove; |
443
|
|
|
} |
444
|
|
|
|
445
|
|
|
pageCol.state = pageCol._checkState(state); |
446
|
|
|
|
447
|
|
|
if (colToAdd) { |
448
|
|
|
colToAdd.add(model, _extend({}, options, {at: addAt})); |
|
|
|
|
449
|
|
|
var modelToRemove = pageIndex >= pageSize ? |
|
|
|
|
450
|
|
|
model : |
451
|
|
|
!_isUndefined(options.at) && addAt < pageEnd && pageCol.length > pageSize ? |
452
|
|
|
pageCol.at(pageSize) : |
453
|
|
|
null; |
454
|
|
|
if (modelToRemove) { |
455
|
|
|
runOnceAtLastHandler(collection, event, function () { |
456
|
|
|
pageCol.remove(modelToRemove, {onAdd: true}); |
457
|
|
|
}); |
458
|
|
|
} |
459
|
|
|
} |
460
|
|
|
|
461
|
|
|
if (!options.silent) pageCol.trigger("pageable:state:change", pageCol.state); |
|
|
|
|
462
|
|
|
} |
463
|
|
|
|
464
|
|
|
// remove the model from the other collection as well |
465
|
|
|
if (event == "remove") { |
466
|
|
|
if (!options.onAdd) { |
467
|
|
|
// decrement totalRecords and update totalPages and lastPage |
468
|
|
|
if (!--state.totalRecords) { |
469
|
|
|
state.totalRecords = null; |
470
|
|
|
state.totalPages = null; |
471
|
|
|
} |
472
|
|
|
else { |
473
|
|
|
var totalPages = state.totalPages = ceil(state.totalRecords / pageSize); |
474
|
|
|
state.lastPage = firstPage === 0 ? totalPages - 1 : totalPages || firstPage; |
475
|
|
|
if (state.currentPage > totalPages) state.currentPage = state.lastPage; |
|
|
|
|
476
|
|
|
} |
477
|
|
|
pageCol.state = pageCol._checkState(state); |
478
|
|
|
|
479
|
|
|
var nextModel, removedIndex = options.index; |
480
|
|
|
if (collection == pageCol) { |
481
|
|
|
if (nextModel = fullCol.at(pageEnd)) { |
|
|
|
|
482
|
|
|
runOnceAtLastHandler(pageCol, event, function () { |
483
|
|
|
pageCol.push(nextModel, {onRemove: true}); |
484
|
|
|
}); |
485
|
|
|
} |
486
|
|
|
else if (!pageCol.length && state.totalRecords) { |
487
|
|
|
pageCol.reset(fullCol.models.slice(pageStart - pageSize, pageEnd - pageSize), |
488
|
|
|
_extend({}, options, {parse: false})); |
489
|
|
|
} |
490
|
|
|
fullCol.remove(model); |
491
|
|
|
} |
492
|
|
|
else if (removedIndex >= pageStart && removedIndex < pageEnd) { |
493
|
|
|
if (nextModel = fullCol.at(pageEnd - 1)) { |
|
|
|
|
494
|
|
|
runOnceAtLastHandler(pageCol, event, function() { |
495
|
|
|
pageCol.push(nextModel, {onRemove: true}); |
496
|
|
|
}); |
497
|
|
|
} |
498
|
|
|
pageCol.remove(model); |
499
|
|
|
if (!pageCol.length && state.totalRecords) { |
500
|
|
|
pageCol.reset(fullCol.models.slice(pageStart - pageSize, pageEnd - pageSize), |
501
|
|
|
_extend({}, options, {parse: false})); |
502
|
|
|
} |
503
|
|
|
} |
504
|
|
|
} |
505
|
|
|
else delete options.onAdd; |
|
|
|
|
506
|
|
|
|
507
|
|
|
if (!options.silent) pageCol.trigger("pageable:state:change", pageCol.state); |
|
|
|
|
508
|
|
|
} |
509
|
|
|
|
510
|
|
|
if (event == "reset") { |
511
|
|
|
options = collection; |
512
|
|
|
collection = model; |
513
|
|
|
|
514
|
|
|
// Reset that's not a result of getPage |
515
|
|
|
if (collection == pageCol && options.from == null && |
|
|
|
|
516
|
|
|
options.to == null) { |
|
|
|
|
517
|
|
|
var head = fullCol.models.slice(0, pageStart); |
518
|
|
|
var tail = fullCol.models.slice(pageStart + pageCol.models.length); |
519
|
|
|
fullCol.reset(head.concat(pageCol.models).concat(tail), options); |
520
|
|
|
} |
521
|
|
|
else if (collection == fullCol) { |
522
|
|
|
if (!(state.totalRecords = fullCol.models.length)) { |
523
|
|
|
state.totalRecords = null; |
524
|
|
|
state.totalPages = null; |
525
|
|
|
} |
526
|
|
|
if (pageCol.mode == "client") { |
527
|
|
|
firstPage = state.lastPage = state.currentPage = state.firstPage; |
528
|
|
|
currentPage = firstPage === 0 ? state.currentPage : state.currentPage - 1; |
529
|
|
|
pageStart = currentPage * pageSize; |
530
|
|
|
pageEnd = pageStart + pageSize; |
531
|
|
|
} |
532
|
|
|
pageCol.state = pageCol._checkState(state); |
533
|
|
|
pageCol.reset(fullCol.models.slice(pageStart, pageEnd), |
534
|
|
|
_extend({}, options, {parse: false})); |
535
|
|
|
} |
536
|
|
|
|
537
|
|
|
if (!options.silent) pageCol.trigger("pageable:state:change", pageCol.state); |
|
|
|
|
538
|
|
|
} |
539
|
|
|
|
540
|
|
|
if (event == "sort") { |
541
|
|
|
options = collection; |
542
|
|
|
collection = model; |
543
|
|
|
if (collection === fullCol) { |
544
|
|
|
pageCol.reset(fullCol.models.slice(pageStart, pageEnd), |
545
|
|
|
_extend({}, options, {parse: false})); |
546
|
|
|
} |
547
|
|
|
} |
548
|
|
|
|
549
|
|
|
_each(_keys(handlers), function (event) { |
550
|
|
|
var handler = handlers[event]; |
551
|
|
|
_each([pageCol, fullCol], function (col) { |
552
|
|
|
col.on(event, handler); |
553
|
|
|
var callbacks = col._events[event] || []; |
554
|
|
|
callbacks.unshift(callbacks.pop()); |
555
|
|
|
}); |
556
|
|
|
}); |
557
|
|
|
}; |
558
|
|
|
}, |
559
|
|
|
|
560
|
|
|
/** |
561
|
|
|
Sanity check this collection's pagination states. Only perform checks |
562
|
|
|
when all the required pagination state values are defined and not null. |
563
|
|
|
If `totalPages` is undefined or null, it is set to `totalRecords` / |
564
|
|
|
`pageSize`. `lastPage` is set according to whether `firstPage` is 0 or 1 |
565
|
|
|
when no error occurs. |
566
|
|
|
|
567
|
|
|
@private |
568
|
|
|
|
569
|
|
|
@throws {TypeError} If `totalRecords`, `pageSize`, `currentPage` or |
570
|
|
|
`firstPage` is not a finite integer. |
571
|
|
|
|
572
|
|
|
@throws {RangeError} If `pageSize`, `currentPage` or `firstPage` is out |
573
|
|
|
of bounds. |
574
|
|
|
|
575
|
|
|
@return {Object} Returns the `state` object if no error was found. |
576
|
|
|
*/ |
577
|
|
|
_checkState: function (state) { |
578
|
|
|
var mode = this.mode; |
579
|
|
|
var links = this.links; |
580
|
|
|
var totalRecords = state.totalRecords; |
581
|
|
|
var pageSize = state.pageSize; |
582
|
|
|
var currentPage = state.currentPage; |
583
|
|
|
var firstPage = state.firstPage; |
584
|
|
|
var totalPages = state.totalPages; |
585
|
|
|
|
586
|
|
|
if (totalRecords != null && pageSize != null && currentPage != null && |
|
|
|
|
587
|
|
|
firstPage != null && (mode == "infinite" ? links : true)) { |
|
|
|
|
588
|
|
|
|
589
|
|
|
totalRecords = finiteInt(totalRecords, "totalRecords"); |
590
|
|
|
pageSize = finiteInt(pageSize, "pageSize"); |
591
|
|
|
currentPage = finiteInt(currentPage, "currentPage"); |
592
|
|
|
firstPage = finiteInt(firstPage, "firstPage"); |
593
|
|
|
|
594
|
|
|
if (pageSize < 1) { |
595
|
|
|
throw new RangeError("`pageSize` must be >= 1"); |
596
|
|
|
} |
597
|
|
|
|
598
|
|
|
totalPages = state.totalPages = ceil(totalRecords / pageSize); |
599
|
|
|
|
600
|
|
|
if (firstPage < 0 || firstPage > 1) { |
601
|
|
|
throw new RangeError("`firstPage must be 0 or 1`"); |
602
|
|
|
} |
603
|
|
|
|
604
|
|
|
state.lastPage = firstPage === 0 ? max(0, totalPages - 1) : totalPages || firstPage; |
605
|
|
|
|
606
|
|
|
if (mode == "infinite") { |
607
|
|
|
if (!links[currentPage]) { |
608
|
|
|
throw new RangeError("No link found for page " + currentPage); |
609
|
|
|
} |
610
|
|
|
} |
611
|
|
|
else if (currentPage < firstPage || |
612
|
|
|
(totalPages > 0 && |
613
|
|
|
(firstPage ? currentPage > totalPages : currentPage >= totalPages))) { |
614
|
|
|
throw new RangeError("`currentPage` must be firstPage <= currentPage " + |
615
|
|
|
(firstPage ? "<" : "<=") + |
616
|
|
|
" totalPages if " + firstPage + "-based. Got " + |
617
|
|
|
currentPage + '.'); |
618
|
|
|
} |
619
|
|
|
} |
620
|
|
|
|
621
|
|
|
return state; |
622
|
|
|
}, |
623
|
|
|
|
624
|
|
|
/** |
625
|
|
|
Change the page size of this collection. |
626
|
|
|
|
627
|
|
|
Under most if not all circumstances, you should call this method to |
628
|
|
|
change the page size of a pageable collection because it will keep the |
629
|
|
|
pagination state sane. By default, the method will recalculate the |
630
|
|
|
current page number to one that will retain the current page's models |
631
|
|
|
when increasing the page size. When decreasing the page size, this method |
632
|
|
|
will retain the last models to the current page that will fit into the |
633
|
|
|
smaller page size. |
634
|
|
|
|
635
|
|
|
If `options.first` is true, changing the page size will also reset the |
636
|
|
|
current page back to the first page instead of trying to be smart. |
637
|
|
|
|
638
|
|
|
For server mode operations, changing the page size will trigger a |
639
|
|
|
PageableCollection#fetch and subsequently a `reset` event. |
640
|
|
|
|
641
|
|
|
For client mode operations, changing the page size will `reset` the |
642
|
|
|
current page by recalculating the current page boundary on the client |
643
|
|
|
side. |
644
|
|
|
|
645
|
|
|
If `options.fetch` is true, a fetch can be forced if the collection is in |
646
|
|
|
client mode. |
647
|
|
|
|
648
|
|
|
@param {number} pageSize - The new page size to set to PageableCollection#state. |
649
|
|
|
@param {Object} options - {@link PageableCollection#fetch} options. |
650
|
|
|
@param {boolean} options.first = false 0 Reset the current page number to |
651
|
|
|
the first page if `true`. |
652
|
|
|
@param {boolean} options.fetch - If `true`, force a fetch in client mode. |
653
|
|
|
|
654
|
|
|
@throws {TypeError} If `pageSize` is not a finite integer. |
655
|
|
|
@throws {RangeError} If `pageSize` is less than 1. |
656
|
|
|
|
657
|
|
|
@chainable |
658
|
|
|
@return {XMLHttpRequest|PageableCollection} The XMLHttpRequest |
659
|
|
|
from fetch or this. |
660
|
|
|
*/ |
661
|
|
|
setPageSize: function (pageSize, options) { |
662
|
|
|
pageSize = finiteInt(pageSize, "pageSize"); |
663
|
|
|
|
664
|
|
|
options = options || {first: false}; |
665
|
|
|
|
666
|
|
|
var state = this.state; |
667
|
|
|
var totalPages = ceil(state.totalRecords / pageSize); |
668
|
|
|
var currentPage = totalPages ? |
669
|
|
|
max(state.firstPage, floor(totalPages * state.currentPage / state.totalPages)) : |
670
|
|
|
state.firstPage; |
671
|
|
|
|
672
|
|
|
state = this.state = this._checkState(_extend({}, state, { |
673
|
|
|
pageSize: pageSize, |
674
|
|
|
currentPage: options.first ? state.firstPage : currentPage, |
675
|
|
|
totalPages: totalPages |
676
|
|
|
})); |
677
|
|
|
|
678
|
|
|
return this.getPage(state.currentPage, _omit(options, ["first"])); |
679
|
|
|
}, |
680
|
|
|
|
681
|
|
|
/** |
682
|
|
|
Switching between client, server and infinite mode. |
683
|
|
|
|
684
|
|
|
If switching from client to server mode, the #fullCollection is emptied |
685
|
|
|
first and then deleted and a fetch is immediately issued for the current |
686
|
|
|
page from the server. Pass `false` to `options.fetch` to skip fetching. |
687
|
|
|
|
688
|
|
|
If switching to infinite mode, and if `options.models` is given for an |
689
|
|
|
array of models,PageableCollection#links will be populated with a URL per |
690
|
|
|
page, using the default URL for this collection. |
691
|
|
|
|
692
|
|
|
If switching from server to client mode, all of the pages are immediately |
693
|
|
|
refetched. If you have too many pages, you can pass `false` to |
694
|
|
|
`options.fetch` to skip fetching. |
695
|
|
|
|
696
|
|
|
If switching to any mode from infinite mode, thePageableCollection#links |
697
|
|
|
will be deleted. |
698
|
|
|
|
699
|
|
|
@fires PageableCollection#pageable:state:change |
700
|
|
|
|
701
|
|
|
@param {"server"|"client"|"infinite"} mode - The mode to switch to. |
702
|
|
|
|
703
|
|
|
@param {Object} options |
704
|
|
|
|
705
|
|
|
@param {boolean} options.fetch = true - If `false`, no fetching is done. |
706
|
|
|
|
707
|
|
|
@param {boolean} options.resetState = true - If 'false', the state is not |
708
|
|
|
reset, but checked for sanity instead. |
709
|
|
|
|
710
|
|
|
@chainable |
711
|
|
|
@return {XMLHttpRequest|PageableCollection} The XMLHttpRequest |
712
|
|
|
from fetch or this if `options.fetch` is `false`. |
713
|
|
|
*/ |
714
|
|
|
switchMode: function (mode, options) { |
715
|
|
|
|
716
|
|
|
if (!_contains(["server", "client", "infinite"], mode)) { |
717
|
|
|
throw new TypeError('`mode` must be one of "server", "client" or "infinite"'); |
718
|
|
|
} |
719
|
|
|
|
720
|
|
|
options = options || {fetch: true, resetState: true}; |
721
|
|
|
|
722
|
|
|
var state = this.state = options.resetState ? |
723
|
|
|
_clone(this._initState) : |
724
|
|
|
this._checkState(_extend({}, this.state)); |
725
|
|
|
|
726
|
|
|
this.mode = mode; |
727
|
|
|
|
728
|
|
|
var self = this; |
729
|
|
|
var fullCollection = this.fullCollection; |
730
|
|
|
var handlers = this._handlers = this._handlers || {}, handler; |
731
|
|
|
if (mode != "server" && !fullCollection) { |
732
|
|
|
fullCollection = this._makeFullCollection(options.models || [], options); |
733
|
|
|
fullCollection.pageableCollection = this; |
734
|
|
|
this.fullCollection = fullCollection; |
735
|
|
|
var allHandler = this._makeCollectionEventHandler(this, fullCollection); |
736
|
|
|
_each(["add", "remove", "reset", "sort"], function (event) { |
737
|
|
|
handlers[event] = handler = _.bind(allHandler, {}, event); |
738
|
|
|
self.on(event, handler); |
739
|
|
|
fullCollection.on(event, handler); |
740
|
|
|
}); |
741
|
|
|
fullCollection.comparator = this._fullComparator; |
742
|
|
|
} |
743
|
|
|
else if (mode == "server" && fullCollection) { |
744
|
|
|
_each(_keys(handlers), function (event) { |
745
|
|
|
handler = handlers[event]; |
746
|
|
|
self.off(event, handler); |
747
|
|
|
fullCollection.off(event, handler); |
748
|
|
|
}); |
749
|
|
|
delete this._handlers; |
750
|
|
|
this._fullComparator = fullCollection.comparator; |
751
|
|
|
delete this.fullCollection; |
752
|
|
|
} |
753
|
|
|
|
754
|
|
|
if (mode == "infinite") { |
755
|
|
|
var links = this.links = {}; |
756
|
|
|
var firstPage = state.firstPage; |
757
|
|
|
var totalPages = ceil(state.totalRecords / state.pageSize); |
758
|
|
|
var lastPage = firstPage === 0 ? max(0, totalPages - 1) : totalPages || firstPage; |
759
|
|
|
for (var i = state.firstPage; i <= lastPage; i++) { |
760
|
|
|
links[i] = this.url; |
761
|
|
|
} |
762
|
|
|
} |
763
|
|
|
else if (this.links) delete this.links; |
|
|
|
|
764
|
|
|
|
765
|
|
|
if (!options.silent) this.trigger("pageable:state:change", state); |
|
|
|
|
766
|
|
|
|
767
|
|
|
return options.fetch ? |
768
|
|
|
this.fetch(_omit(options, "fetch", "resetState")) : |
769
|
|
|
this; |
770
|
|
|
}, |
771
|
|
|
|
772
|
|
|
/** |
773
|
|
|
@return {boolean} `true` if this collection can page backward, `false` |
774
|
|
|
otherwise. |
775
|
|
|
*/ |
776
|
|
|
hasPreviousPage: function () { |
777
|
|
|
var state = this.state; |
778
|
|
|
var currentPage = state.currentPage; |
779
|
|
|
if (this.mode != "infinite") return currentPage > state.firstPage; |
|
|
|
|
780
|
|
|
return !!this.links[currentPage - 1]; |
781
|
|
|
}, |
782
|
|
|
|
783
|
|
|
/** |
784
|
|
|
@return {boolean} `true` if this collection can page forward, `false` |
785
|
|
|
otherwise. |
786
|
|
|
*/ |
787
|
|
|
hasNextPage: function () { |
788
|
|
|
var state = this.state; |
789
|
|
|
var currentPage = this.state.currentPage; |
790
|
|
|
if (this.mode != "infinite") return currentPage < state.lastPage; |
|
|
|
|
791
|
|
|
return !!this.links[currentPage + 1]; |
792
|
|
|
}, |
793
|
|
|
|
794
|
|
|
/** |
795
|
|
|
Fetch the first page in server mode, or reset the current page of this |
796
|
|
|
collection to the first page in client or infinite mode. |
797
|
|
|
|
798
|
|
|
@param {Object} options {@linkPageableCollection#getPage} options. |
799
|
|
|
|
800
|
|
|
@chainable |
801
|
|
|
@return {XMLHttpRequest|PageableCollection} The XMLHttpRequest |
802
|
|
|
from fetch or this. |
803
|
|
|
*/ |
804
|
|
|
getFirstPage: function (options) { |
805
|
|
|
return this.getPage("first", options); |
806
|
|
|
}, |
807
|
|
|
|
808
|
|
|
/** |
809
|
|
|
Fetch the previous page in server mode, or reset the current page of this |
810
|
|
|
collection to the previous page in client or infinite mode. |
811
|
|
|
|
812
|
|
|
@param {Object} options {@linkPageableCollection#getPage} options. |
813
|
|
|
|
814
|
|
|
@chainable |
815
|
|
|
@return {XMLHttpRequest|PageableCollection} The XMLHttpRequest |
816
|
|
|
from fetch or this. |
817
|
|
|
*/ |
818
|
|
|
getPreviousPage: function (options) { |
819
|
|
|
return this.getPage("prev", options); |
820
|
|
|
}, |
821
|
|
|
|
822
|
|
|
/** |
823
|
|
|
Fetch the next page in server mode, or reset the current page of this |
824
|
|
|
collection to the next page in client mode. |
825
|
|
|
|
826
|
|
|
@param {Object} options {@linkPageableCollection#getPage} options. |
827
|
|
|
|
828
|
|
|
@chainable |
829
|
|
|
@return {XMLHttpRequest|PageableCollection} The XMLHttpRequest |
830
|
|
|
from fetch or this. |
831
|
|
|
*/ |
832
|
|
|
getNextPage: function (options) { |
833
|
|
|
return this.getPage("next", options); |
834
|
|
|
}, |
835
|
|
|
|
836
|
|
|
/** |
837
|
|
|
Fetch the last page in server mode, or reset the current page of this |
838
|
|
|
collection to the last page in client mode. |
839
|
|
|
|
840
|
|
|
@param {Object} options {@linkPageableCollection#getPage} options. |
841
|
|
|
|
842
|
|
|
@chainable |
843
|
|
|
@return {XMLHttpRequest|PageableCollection} The XMLHttpRequest |
844
|
|
|
from fetch or this. |
845
|
|
|
*/ |
846
|
|
|
getLastPage: function (options) { |
847
|
|
|
return this.getPage("last", options); |
848
|
|
|
}, |
849
|
|
|
|
850
|
|
|
/** |
851
|
|
|
Given a page index, set PageableCollection#state.currentPage to that |
852
|
|
|
index. If this collection is in server mode, fetch the page using the |
853
|
|
|
updated state, otherwise, reset the current page of this collection to |
854
|
|
|
the page specified by `index` in client mode. If `options.fetch` is true, |
855
|
|
|
a fetch can be forced in client mode before resetting the current |
856
|
|
|
page. Under infinite mode, if the index is less than the current page, a |
857
|
|
|
reset is done as in client mode. If the index is greater than the current |
858
|
|
|
page number, a fetch is made with the results **appended** |
859
|
|
|
toPageableCollection#fullCollection. The current page will then be reset |
860
|
|
|
after fetching. |
861
|
|
|
|
862
|
|
|
@fires PageableCollection#pageable:state:change |
863
|
|
|
|
864
|
|
|
@param {number|string} index - The page index to go to, or the page name to |
865
|
|
|
look up fromPageableCollection#links in infinite mode. |
866
|
|
|
@param {Object} options - {@linkPageableCollection#fetch} options or |
867
|
|
|
[reset](http://backbonejs.org/#Collection-reset) options for client mode |
868
|
|
|
when `options.fetch` is `false`. |
869
|
|
|
@param {boolean} options.fetch = false - If true, force a |
870
|
|
|
{@linkPageableCollection#fetch} in client mode. |
871
|
|
|
|
872
|
|
|
@throws {TypeError} If `index` is not a finite integer under server or |
873
|
|
|
client mode, or does not yield a URL fromPageableCollection#links under |
874
|
|
|
infinite mode. |
875
|
|
|
|
876
|
|
|
@throws {RangeError} If `index` is out of bounds. |
877
|
|
|
|
878
|
|
|
@chainable |
879
|
|
|
@return {XMLHttpRequest|PageableCollection} The XMLHttpRequest |
880
|
|
|
from fetch or this. |
881
|
|
|
*/ |
882
|
|
|
getPage: function (index, options) { |
883
|
|
|
|
884
|
|
|
var mode = this.mode, fullCollection = this.fullCollection; |
885
|
|
|
|
886
|
|
|
options = options || {fetch: false}; |
887
|
|
|
|
888
|
|
|
var state = this.state, |
889
|
|
|
firstPage = state.firstPage, |
890
|
|
|
currentPage = state.currentPage, |
891
|
|
|
lastPage = state.lastPage, |
892
|
|
|
pageSize = state.pageSize; |
893
|
|
|
|
894
|
|
|
var pageNum = index; |
|
|
|
|
895
|
|
|
switch (index) { |
896
|
|
|
case "first": pageNum = firstPage; break; |
897
|
|
|
case "prev": pageNum = currentPage - 1; break; |
898
|
|
|
case "next": pageNum = currentPage + 1; break; |
899
|
|
|
case "last": pageNum = lastPage; break; |
900
|
|
|
default: pageNum = finiteInt(index, "index"); |
901
|
|
|
} |
902
|
|
|
|
903
|
|
|
this.state = this._checkState(_extend({}, state, {currentPage: pageNum})); |
904
|
|
|
if (!options.silent) this.trigger("pageable:state:change", this.state); |
|
|
|
|
905
|
|
|
|
906
|
|
|
options.from = currentPage, options.to = pageNum; |
|
|
|
|
907
|
|
|
|
908
|
|
|
var pageStart = (firstPage === 0 ? pageNum : pageNum - 1) * pageSize; |
909
|
|
|
var pageModels = fullCollection && fullCollection.length ? |
910
|
|
|
fullCollection.models.slice(pageStart, pageStart + pageSize) : |
911
|
|
|
[]; |
912
|
|
|
if ((mode == "client" || (mode == "infinite" && !_isEmpty(pageModels))) && |
913
|
|
|
!options.fetch) { |
914
|
|
|
this.reset(pageModels, _omit(options, "fetch")); |
915
|
|
|
return this; |
916
|
|
|
} |
917
|
|
|
|
918
|
|
|
if (mode == "infinite") options.url = this.links[pageNum]; |
|
|
|
|
919
|
|
|
|
920
|
|
|
return this.fetch(_omit(options, "fetch")); |
921
|
|
|
}, |
922
|
|
|
|
923
|
|
|
/** |
924
|
|
|
Fetch the page for the provided item offset in server mode, or reset the |
925
|
|
|
current page of this collection to the page for the provided item offset |
926
|
|
|
in client mode. |
927
|
|
|
|
928
|
|
|
@param {Object} options {@linkPageableCollection#getPage} options. |
929
|
|
|
|
930
|
|
|
@chainable |
931
|
|
|
@return {XMLHttpRequest|PageableCollection} The XMLHttpRequest |
932
|
|
|
from fetch or this. |
933
|
|
|
*/ |
934
|
|
|
getPageByOffset: function (offset, options) { |
935
|
|
|
if (offset < 0) { |
936
|
|
|
throw new RangeError("`offset must be > 0`"); |
937
|
|
|
} |
938
|
|
|
offset = finiteInt(offset); |
939
|
|
|
|
940
|
|
|
var page = floor(offset / this.state.pageSize); |
941
|
|
|
if (this.state.firstPage !== 0) page++; |
|
|
|
|
942
|
|
|
if (page > this.state.lastPage) page = this.state.lastPage; |
|
|
|
|
943
|
|
|
return this.getPage(page, options); |
944
|
|
|
}, |
945
|
|
|
|
946
|
|
|
/** |
947
|
|
|
Overidden to make `getPage` compatible with Zepto. |
948
|
|
|
|
949
|
|
|
@param {string} method |
950
|
|
|
@param {Backbone.Model|Backbone.Collection} model |
951
|
|
|
@param {Object} options |
952
|
|
|
|
953
|
|
|
@return {XMLHttpRequest} |
954
|
|
|
*/ |
955
|
|
|
sync: function (method, model, options) { |
956
|
|
|
var self = this; |
957
|
|
|
if (self.mode == "infinite") { |
958
|
|
|
var success = options.success; |
959
|
|
|
var currentPage = self.state.currentPage; |
960
|
|
|
options.success = function (resp, status, xhr) { |
961
|
|
|
var links = self.links; |
962
|
|
|
var newLinks = self.parseLinks(resp, _extend({xhr: xhr}, options)); |
963
|
|
|
if (newLinks.first) links[self.state.firstPage] = newLinks.first; |
|
|
|
|
964
|
|
|
if (newLinks.prev) links[currentPage - 1] = newLinks.prev; |
|
|
|
|
965
|
|
|
if (newLinks.next) links[currentPage + 1] = newLinks.next; |
|
|
|
|
966
|
|
|
if (success) success(resp, status, xhr); |
|
|
|
|
967
|
|
|
}; |
968
|
|
|
} |
969
|
|
|
|
970
|
|
|
return (BBColProto.sync || Backbone.sync).call(self, method, model, options); |
971
|
|
|
}, |
972
|
|
|
|
973
|
|
|
/** |
974
|
|
|
Parse pagination links from the server response. Only valid under |
975
|
|
|
infinite mode. |
976
|
|
|
|
977
|
|
|
Given a response body and a XMLHttpRequest object, extract pagination |
978
|
|
|
links from them for infinite paging. |
979
|
|
|
|
980
|
|
|
This default implementation parses the RFC 5988 `Link` header and extract |
981
|
|
|
3 links from it - `first`, `prev`, `next`. Any subclasses overriding this |
982
|
|
|
method __must__ return an object hash having only the keys |
983
|
|
|
above. However, simply returning a `next` link or an empty hash if there |
984
|
|
|
are no more links should be enough for most implementations. |
985
|
|
|
|
986
|
|
|
@param {*} resp The deserialized response body. |
987
|
|
|
@param {Object} options |
988
|
|
|
@param {XMLHttpRequest} options.xhr - The XMLHttpRequest object for this |
989
|
|
|
response. |
990
|
|
|
@return {Object} |
991
|
|
|
*/ |
992
|
|
|
parseLinks: function (resp, options) { |
993
|
|
|
var links = {}; |
994
|
|
|
var linkHeader = options.xhr.getResponseHeader("Link"); |
995
|
|
|
if (linkHeader) { |
996
|
|
|
var relations = ["first", "prev", "next"]; |
997
|
|
|
_each(linkHeader.split(","), function (linkValue) { |
998
|
|
|
var linkParts = linkValue.split(";"); |
999
|
|
|
var url = linkParts[0].replace(URL_TRIM_RE, ''); |
1000
|
|
|
var params = linkParts.slice(1); |
1001
|
|
|
_each(params, function (param) { |
1002
|
|
|
var paramParts = param.split("="); |
1003
|
|
|
var key = paramParts[0].replace(PARAM_TRIM_RE, ''); |
1004
|
|
|
var value = paramParts[1].replace(PARAM_TRIM_RE, ''); |
1005
|
|
|
if (key == "rel" && _contains(relations, value)) links[value] = url; |
|
|
|
|
1006
|
|
|
}); |
1007
|
|
|
}); |
1008
|
|
|
} |
1009
|
|
|
|
1010
|
|
|
return links; |
1011
|
|
|
}, |
1012
|
|
|
|
1013
|
|
|
/** |
1014
|
|
|
Parse server response data. |
1015
|
|
|
|
1016
|
|
|
This default implementation assumes the response data is in one of two |
1017
|
|
|
structures: |
1018
|
|
|
|
1019
|
|
|
[ |
1020
|
|
|
{}, // Your new pagination state |
1021
|
|
|
[{}, ...] // An array of JSON objects |
1022
|
|
|
] |
1023
|
|
|
|
1024
|
|
|
Or, |
1025
|
|
|
|
1026
|
|
|
[{}] // An array of JSON objects |
1027
|
|
|
|
1028
|
|
|
The first structure is the preferred form because the pagination states |
1029
|
|
|
may have been updated on the server side, sending them down again allows |
1030
|
|
|
this collection to update its states. If the response has a pagination |
1031
|
|
|
state object, it is checked for errors. |
1032
|
|
|
|
1033
|
|
|
The second structure is the |
1034
|
|
|
[Backbone.Collection#parse](http://backbonejs.org/#Collection-parse) |
1035
|
|
|
default. |
1036
|
|
|
|
1037
|
|
|
**Note:** this method has been further simplified since 1.1.7. While |
1038
|
|
|
existingPageableCollection#parse implementations will continue to work, |
1039
|
|
|
new code is encouraged to overridePageableCollection#parseState |
1040
|
|
|
andPageableCollection#parseRecords instead. |
1041
|
|
|
|
1042
|
|
|
@param {Object} resp The deserialized response data from the server. |
1043
|
|
|
@param {Object} the options for the ajax request |
|
|
|
|
1044
|
|
|
|
1045
|
|
|
@return {Array.<Object>} An array of model objects |
1046
|
|
|
*/ |
1047
|
|
|
parse: function (resp, options) { |
1048
|
|
|
var newState = this.parseState(resp, _clone(this.queryParams), _clone(this.state), options); |
1049
|
|
|
if (newState) this.state = this._checkState(_extend({}, this.state, newState)); |
|
|
|
|
1050
|
|
|
return this.parseRecords(resp, options); |
1051
|
|
|
}, |
1052
|
|
|
|
1053
|
|
|
/** |
1054
|
|
|
Parse server response for server pagination state updates. Not applicable |
1055
|
|
|
under infinite mode. |
1056
|
|
|
|
1057
|
|
|
This default implementation first checks whether the response has any |
1058
|
|
|
state object as documented inPageableCollection#parse. If it exists, a |
1059
|
|
|
state object is returned by mapping the server state keys to this |
1060
|
|
|
pageable collection instance's query parameter keys using `queryParams`. |
1061
|
|
|
|
1062
|
|
|
It is __NOT__ neccessary to return a full state object complete with all |
1063
|
|
|
the mappings defined inPageableCollection#queryParams. Any state object |
1064
|
|
|
resulted is merged with a copy of the current pageable collection state |
1065
|
|
|
and checked for sanity before actually updating. Most of the time, simply |
1066
|
|
|
providing a new `totalRecords` value is enough to trigger a full |
1067
|
|
|
pagination state recalculation. |
1068
|
|
|
|
1069
|
|
|
parseState: function (resp, queryParams, state, options) { |
1070
|
|
|
return {totalRecords: resp.total_entries}; |
1071
|
|
|
} |
1072
|
|
|
|
1073
|
|
|
If you want to use header fields use: |
1074
|
|
|
|
1075
|
|
|
parseState: function (resp, queryParams, state, options) { |
1076
|
|
|
return {totalRecords: options.xhr.getResponseHeader("X-total")}; |
1077
|
|
|
} |
1078
|
|
|
|
1079
|
|
|
This method __MUST__ return a new state object instead of directly |
1080
|
|
|
modifying the PageableCollection#state object. The behavior of directly |
1081
|
|
|
modifying PageableCollection#state is undefined. |
1082
|
|
|
|
1083
|
|
|
@param {Object} resp - The deserialized response data from the server. |
1084
|
|
|
@param {Object} queryParams - A copy of PageableCollection#queryParams. |
1085
|
|
|
@param {Object} state - A copy of PageableCollection#state. |
1086
|
|
|
@param {Object} options - The options passed through from |
1087
|
|
|
`parse`. (backbone >= 0.9.10 only) |
1088
|
|
|
|
1089
|
|
|
@return {Object} A new (partial) state object. |
1090
|
|
|
*/ |
1091
|
|
|
parseState: function (resp, queryParams, state, options) { |
|
|
|
|
1092
|
|
|
if (resp && resp.length === 2 && _isObject(resp[0]) && _isArray(resp[1])) { |
|
|
|
|
1093
|
|
|
|
1094
|
|
|
var newState = _clone(state); |
1095
|
|
|
var serverState = resp[0]; |
1096
|
|
|
|
1097
|
|
|
_each(_pairs(_omit(queryParams, "directions")), function (kvp) { |
1098
|
|
|
var k = kvp[0], v = kvp[1]; |
1099
|
|
|
var serverVal = serverState[v]; |
1100
|
|
|
if (!_isUndefined(serverVal) && !_.isNull(serverVal)) newState[k] = serverState[v]; |
|
|
|
|
1101
|
|
|
}); |
1102
|
|
|
|
1103
|
|
|
if (serverState.order) { |
1104
|
|
|
newState.order = _invert(queryParams.directions)[serverState.order] * 1; |
1105
|
|
|
} |
1106
|
|
|
|
1107
|
|
|
return newState; |
1108
|
|
|
} |
1109
|
|
|
}, |
1110
|
|
|
|
1111
|
|
|
/** |
1112
|
|
|
Parse server response for an array of model objects. |
1113
|
|
|
|
1114
|
|
|
This default implementation first checks whether the response has any |
1115
|
|
|
state object as documented inPageableCollection#parse. If it exists, the |
1116
|
|
|
array of model objects is assumed to be the second element, otherwise the |
1117
|
|
|
entire response is returned directly. |
1118
|
|
|
|
1119
|
|
|
@param {Object} resp - The deserialized response data from the server. |
1120
|
|
|
@param {Object} options - The options passed through from the |
1121
|
|
|
`parse`. (backbone >= 0.9.10 only) |
1122
|
|
|
|
1123
|
|
|
@return {Array.<Object>} An array of model objects |
1124
|
|
|
*/ |
1125
|
|
|
parseRecords: function (resp, options) { |
|
|
|
|
1126
|
|
|
if (resp && resp.length === 2 && _isObject(resp[0]) && _isArray(resp[1])) { |
1127
|
|
|
return resp[1]; |
1128
|
|
|
} |
1129
|
|
|
|
1130
|
|
|
return resp; |
1131
|
|
|
}, |
1132
|
|
|
|
1133
|
|
|
/** |
1134
|
|
|
Fetch a page from the server in server mode, or all the pages in client |
1135
|
|
|
mode. Under infinite mode, the current page is refetched by default and |
1136
|
|
|
then reset. |
1137
|
|
|
|
1138
|
|
|
The query string is constructed by translating the current pagination |
1139
|
|
|
state to your server API query parameter |
1140
|
|
|
usingPageableCollection#queryParams. The current page will reset after |
1141
|
|
|
fetch. |
1142
|
|
|
|
1143
|
|
|
@param {Object} options - Accepts all |
1144
|
|
|
[Backbone.Collection#fetch](http://backbonejs.org/#Collection-fetch) |
1145
|
|
|
options. |
1146
|
|
|
|
1147
|
|
|
@return {XMLHttpRequest} |
1148
|
|
|
*/ |
1149
|
|
|
fetch: function (options) { |
1150
|
|
|
|
1151
|
|
|
options = options || {}; |
1152
|
|
|
|
1153
|
|
|
var state = this._checkState(this.state); |
1154
|
|
|
|
1155
|
|
|
var mode = this.mode; |
1156
|
|
|
|
1157
|
|
|
if (mode == "infinite" && !options.url) { |
1158
|
|
|
options.url = this.links[state.currentPage]; |
1159
|
|
|
} |
1160
|
|
|
|
1161
|
|
|
var data = options.data || {}; |
1162
|
|
|
|
1163
|
|
|
// dedup query params |
1164
|
|
|
var url = options.url || this.url || ""; |
1165
|
|
|
if (_isFunction(url)) url = url.call(this); |
|
|
|
|
1166
|
|
|
var qsi = url.indexOf('?'); |
1167
|
|
|
if (qsi != -1) { |
1168
|
|
|
_extend(data, queryStringToParams(url.slice(qsi + 1))); |
1169
|
|
|
url = url.slice(0, qsi); |
1170
|
|
|
} |
1171
|
|
|
|
1172
|
|
|
options.url = url; |
1173
|
|
|
options.data = data; |
1174
|
|
|
|
1175
|
|
|
// pick the appropriate query param keys to map according to the mode |
1176
|
|
|
var queryParams = this.mode == "client" ? |
1177
|
|
|
_pick(this.queryParams, "sortKey") : |
1178
|
|
|
_omit(_pick(this.queryParams, _keys(PageableProto.queryParams)), |
1179
|
|
|
"order", "directions", "totalPages", "totalRecords"); |
1180
|
|
|
|
1181
|
|
|
// map the query params to the data object used by the underlying ajax lib |
1182
|
|
|
// to construct the query string |
1183
|
|
|
_each(queryParams, function (v, k) { |
1184
|
|
|
v = _isFunction(v) ? v.call(this) : v; |
1185
|
|
|
if (state[k] != null && v != null && _.isUndefined(data[v])) { |
|
|
|
|
1186
|
|
|
data[v] = state[k]; |
1187
|
|
|
} |
1188
|
|
|
}, this); |
1189
|
|
|
|
1190
|
|
|
var sortKey = _isFunction(this.queryParams.sortKey) ? |
1191
|
|
|
this.queryParams.sortKey.call(this) : |
1192
|
|
|
this.queryParams.sortKey; |
1193
|
|
|
|
1194
|
|
|
var order = _isFunction(this.queryParams.order) ? |
1195
|
|
|
this.queryParams.order.call(this) : |
1196
|
|
|
this.queryParams.order; |
1197
|
|
|
|
1198
|
|
|
if (sortKey != null && state.sortKey != null && |
|
|
|
|
1199
|
|
|
order != null && state.order != null) { |
|
|
|
|
1200
|
|
|
if (_isArray(state.order)) { |
1201
|
|
|
data[order] = []; |
1202
|
|
|
for (var i = 0; i < state.order.length; i++) { |
1203
|
|
|
data[order].push(this.queryParams.directions[state.order[i]]); |
1204
|
|
|
} |
1205
|
|
|
} |
1206
|
|
|
else { |
1207
|
|
|
data[order] = this.queryParams.directions[state.order + ""]; |
1208
|
|
|
} |
1209
|
|
|
} |
1210
|
|
|
|
1211
|
|
|
// map extra query parameters |
1212
|
|
|
var extraKvps = _pairs(_omit(this.queryParams, |
1213
|
|
|
_keys(PageableProto.queryParams))); |
1214
|
|
|
for (var i = 0; i < extraKvps.length; i++) { |
|
|
|
|
1215
|
|
|
var kvp = extraKvps[i]; |
1216
|
|
|
var v = kvp[1]; |
1217
|
|
|
v = _isFunction(v) ? v.call(this) : v; |
1218
|
|
|
if (v != null) data[kvp[0]] = v; |
|
|
|
|
1219
|
|
|
} |
1220
|
|
|
|
1221
|
|
|
if (mode != "server") { |
1222
|
|
|
var self = this, fullCol = this.fullCollection; |
1223
|
|
|
var success = options.success; |
1224
|
|
|
options.success = function (col, resp, opts) { |
1225
|
|
|
|
1226
|
|
|
// make sure the caller's intent is obeyed |
1227
|
|
|
opts = opts || {}; |
1228
|
|
|
if (_isUndefined(options.silent)) delete opts.silent; |
|
|
|
|
1229
|
|
|
else opts.silent = options.silent; |
1230
|
|
|
|
1231
|
|
|
var models = col.models; |
1232
|
|
|
if (mode == "client") fullCol.reset(models, opts); |
|
|
|
|
1233
|
|
|
else { |
1234
|
|
|
fullCol.add(models, _extend({at: fullCol.length}, |
1235
|
|
|
_extend(opts, {parse: false}))); |
1236
|
|
|
self.trigger("reset", self, opts); |
1237
|
|
|
} |
1238
|
|
|
|
1239
|
|
|
if (success) success(col, resp, opts); |
|
|
|
|
1240
|
|
|
}; |
1241
|
|
|
|
1242
|
|
|
// silent the first reset from backbone |
1243
|
|
|
return BBColProto.fetch.call(this, _extend({}, options, {silent: true})); |
1244
|
|
|
} |
1245
|
|
|
|
1246
|
|
|
return BBColProto.fetch.call(this, options); |
1247
|
|
|
}, |
1248
|
|
|
|
1249
|
|
|
/** |
1250
|
|
|
Convenient method for making a `comparator` sorted by a model attribute |
1251
|
|
|
identified by `sortKey` and ordered by `order`. |
1252
|
|
|
|
1253
|
|
|
Like a Backbone.Collection, a PageableCollection will maintain the |
1254
|
|
|
__current page__ in sorted order on the client side if a `comparator` is |
1255
|
|
|
attached to it. If the collection is in client mode, you can attach a |
1256
|
|
|
comparator toPageableCollection#fullCollection to have all the pages |
1257
|
|
|
reflect the global sorting order by specifying an option `full` to |
1258
|
|
|
`true`. You __must__ call `sort` manually |
1259
|
|
|
orPageableCollection#fullCollection.sort after calling this method to |
1260
|
|
|
force a resort. |
1261
|
|
|
|
1262
|
|
|
While you can use this method to sort the current page in server mode, |
1263
|
|
|
the sorting order may not reflect the global sorting order due to the |
1264
|
|
|
additions or removals of the records on the server since the last |
1265
|
|
|
fetch. If you want the most updated page in a global sorting order, it is |
1266
|
|
|
recommended that you set PageableCollection#state.sortKey and optionally |
1267
|
|
|
PageableCollection#state.order, and then callPageableCollection#fetch. |
1268
|
|
|
|
1269
|
|
|
@protected |
1270
|
|
|
|
1271
|
|
|
@param {string} sortKey = this.state.sortKey - See `state.sortKey`. |
1272
|
|
|
@param {number} order = this.state.order - See `state.order`. |
1273
|
|
|
@param {(function(Backbone.Model, string): Object) | string} sortValue - |
1274
|
|
|
See PageableCollection#setSorting. |
1275
|
|
|
|
1276
|
|
|
See [Backbone.Collection.comparator](http://backbonejs.org/#Collection-comparator). |
1277
|
|
|
*/ |
1278
|
|
|
_makeComparator: function (sortKey, order, sortValue) { |
1279
|
|
|
var state = this.state; |
1280
|
|
|
|
1281
|
|
|
sortKey = sortKey || state.sortKey; |
1282
|
|
|
order = order || state.order; |
1283
|
|
|
|
1284
|
|
|
if (!sortKey || !order) return; |
|
|
|
|
1285
|
|
|
|
1286
|
|
|
if (!sortValue) sortValue = function (model, attr) { |
|
|
|
|
1287
|
|
|
return model.get(attr); |
1288
|
|
|
}; |
1289
|
|
|
|
1290
|
|
|
return function (left, right) { |
1291
|
|
|
var l = sortValue(left, sortKey), r = sortValue(right, sortKey), t; |
1292
|
|
|
if (order === 1) t = l, l = r, r = t; |
|
|
|
|
1293
|
|
|
if (l === r) return 0; |
|
|
|
|
1294
|
|
|
else if (l < r) return -1; |
|
|
|
|
1295
|
|
|
return 1; |
1296
|
|
|
}; |
1297
|
|
|
}, |
1298
|
|
|
|
1299
|
|
|
/** |
1300
|
|
|
Adjusts the sorting for this pageable collection. |
1301
|
|
|
|
1302
|
|
|
Given a `sortKey` and an `order`, sets `state.sortKey` and |
1303
|
|
|
`state.order`. A comparator can be applied on the client side to sort in |
1304
|
|
|
the order defined if `options.side` is `"client"`. By default the |
1305
|
|
|
comparator is applied to thePageableCollection#fullCollection. Set |
1306
|
|
|
`options.full` to `false` to apply a comparator to the current page under |
1307
|
|
|
any mode. Setting `sortKey` to `null` removes the comparator from both |
1308
|
|
|
the current page and the full collection. |
1309
|
|
|
|
1310
|
|
|
If a `sortValue` function is given, it will be passed the `(model, |
1311
|
|
|
sortKey)` arguments and is used to extract a value from the model during |
1312
|
|
|
comparison sorts. If `sortValue` is not given, `model.get(sortKey)` is |
1313
|
|
|
used for sorting. |
1314
|
|
|
|
1315
|
|
|
@chainable |
1316
|
|
|
|
1317
|
|
|
@param {string} sortKey - See `state.sortKey`. |
1318
|
|
|
@param {number} order=this.state.order - See `state.order`. |
|
|
|
|
1319
|
|
|
@param {Object} options |
1320
|
|
|
@param {string} options.side - By default, `"client"` if `mode` is |
1321
|
|
|
`"client"`, `"server"` otherwise. |
1322
|
|
|
@param {boolean} options.full = true |
1323
|
|
|
@param {(function(Backbone.Model, string): Object) | string} options.sortValue |
1324
|
|
|
*/ |
1325
|
|
|
setSorting: function (sortKey, order, options) { |
1326
|
|
|
|
1327
|
|
|
var state = this.state; |
1328
|
|
|
|
1329
|
|
|
state.sortKey = sortKey; |
1330
|
|
|
state.order = order = order || state.order; |
1331
|
|
|
|
1332
|
|
|
var fullCollection = this.fullCollection; |
1333
|
|
|
|
1334
|
|
|
var delComp = false, delFullComp = false; |
1335
|
|
|
|
1336
|
|
|
if (!sortKey) delComp = delFullComp = true; |
|
|
|
|
1337
|
|
|
|
1338
|
|
|
var mode = this.mode; |
1339
|
|
|
options = _extend({side: mode == "client" ? mode : "server", full: true}, |
1340
|
|
|
options); |
1341
|
|
|
|
1342
|
|
|
var comparator = this._makeComparator(sortKey, order, options.sortValue); |
1343
|
|
|
|
1344
|
|
|
var full = options.full, side = options.side; |
1345
|
|
|
|
1346
|
|
|
if (side == "client") { |
1347
|
|
|
if (full) { |
1348
|
|
|
if (fullCollection) fullCollection.comparator = comparator; |
|
|
|
|
1349
|
|
|
delComp = true; |
1350
|
|
|
} |
1351
|
|
|
else { |
1352
|
|
|
this.comparator = comparator; |
1353
|
|
|
delFullComp = true; |
1354
|
|
|
} |
1355
|
|
|
} |
1356
|
|
|
else if (side == "server" && !full) { |
1357
|
|
|
this.comparator = comparator; |
1358
|
|
|
} |
1359
|
|
|
|
1360
|
|
|
if (delComp) this.comparator = null; |
|
|
|
|
1361
|
|
|
if (delFullComp && fullCollection) fullCollection.comparator = null; |
|
|
|
|
1362
|
|
|
|
1363
|
|
|
return this; |
1364
|
|
|
} |
1365
|
|
|
|
1366
|
|
|
}); |
1367
|
|
|
|
1368
|
|
|
var PageableProto = PageableCollection.prototype; |
1369
|
|
|
|
1370
|
|
|
return PageableCollection; |
1371
|
|
|
|
1372
|
|
|
})); |
This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed.
To learn more about declaring variables in Javascript, see the MDN.