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