tabulator-tables 5.5.4 → 5.6.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bower.json +1 -1
- package/dist/css/tabulator.css +72 -2
- package/dist/css/tabulator.css.map +1 -1
- package/dist/css/tabulator.min.css +1 -1
- package/dist/css/tabulator.min.css.map +1 -1
- package/dist/css/tabulator_bootstrap3.css +72 -2
- package/dist/css/tabulator_bootstrap3.css.map +1 -1
- package/dist/css/tabulator_bootstrap3.min.css +1 -1
- package/dist/css/tabulator_bootstrap3.min.css.map +1 -1
- package/dist/css/tabulator_bootstrap4.css +72 -2
- package/dist/css/tabulator_bootstrap4.css.map +1 -1
- package/dist/css/tabulator_bootstrap4.min.css +1 -1
- package/dist/css/tabulator_bootstrap4.min.css.map +1 -1
- package/dist/css/tabulator_bootstrap5.css +72 -2
- package/dist/css/tabulator_bootstrap5.css.map +1 -1
- package/dist/css/tabulator_bootstrap5.min.css +1 -1
- package/dist/css/tabulator_bootstrap5.min.css.map +1 -1
- package/dist/css/tabulator_bulma.css +72 -2
- package/dist/css/tabulator_bulma.css.map +1 -1
- package/dist/css/tabulator_bulma.min.css +1 -1
- package/dist/css/tabulator_bulma.min.css.map +1 -1
- package/dist/css/tabulator_materialize.css +72 -2
- package/dist/css/tabulator_materialize.css.map +1 -1
- package/dist/css/tabulator_materialize.min.css +1 -1
- package/dist/css/tabulator_materialize.min.css.map +1 -1
- package/dist/css/tabulator_midnight.css +72 -2
- package/dist/css/tabulator_midnight.css.map +1 -1
- package/dist/css/tabulator_midnight.min.css +1 -1
- package/dist/css/tabulator_midnight.min.css.map +1 -1
- package/dist/css/tabulator_modern.css +72 -2
- package/dist/css/tabulator_modern.css.map +1 -1
- package/dist/css/tabulator_modern.min.css +1 -1
- package/dist/css/tabulator_modern.min.css.map +1 -1
- package/dist/css/tabulator_semanticui.css +72 -2
- package/dist/css/tabulator_semanticui.css.map +1 -1
- package/dist/css/tabulator_semanticui.min.css +1 -1
- package/dist/css/tabulator_semanticui.min.css.map +1 -1
- package/dist/css/tabulator_simple.css +72 -2
- package/dist/css/tabulator_simple.css.map +1 -1
- package/dist/css/tabulator_simple.min.css +1 -1
- package/dist/css/tabulator_simple.min.css.map +1 -1
- package/dist/css/tabulator_site.css +74 -4
- package/dist/css/tabulator_site.css.map +1 -1
- package/dist/css/tabulator_site.min.css +1 -1
- package/dist/css/tabulator_site.min.css.map +1 -1
- package/dist/js/tabulator.js +1868 -245
- package/dist/js/tabulator.js.map +1 -1
- package/dist/js/tabulator.min.js +2 -2
- package/dist/js/tabulator.min.js.map +1 -1
- package/dist/js/tabulator_esm.js +1948 -323
- package/dist/js/tabulator_esm.js.map +1 -1
- package/dist/js/tabulator_esm.min.js +2 -2
- package/dist/js/tabulator_esm.min.js.map +1 -1
- package/package.json +2 -2
- package/src/js/core/ColumnManager.js +4 -0
- package/src/js/core/CoreFeature.js +2 -2
- package/src/js/core/RowManager.js +12 -6
- package/src/js/core/Tabulator.js +2 -1
- package/src/js/core/TabulatorFull.js +1 -1
- package/src/js/core/column/Column.js +10 -0
- package/src/js/core/modules/optional.js +2 -1
- package/src/js/core/rendering/renderers/BasicVertical.js +4 -2
- package/src/js/core/rendering/renderers/VirtualDomHorizontal.js +1 -1
- package/src/js/core/row/PseudoRow.js +2 -0
- package/src/js/core/tools/Alert.js +4 -0
- package/src/js/core/tools/DeprecationAdvisor.js +5 -1
- package/src/js/core/tools/Helpers.js +1 -1
- package/src/js/core/tools/InteractionMonitor.js +3 -3
- package/src/js/modules/Clipboard/Clipboard.js +5 -3
- package/src/js/modules/Clipboard/defaults/pasteActions.js +49 -6
- package/src/js/modules/Clipboard/defaults/pasteParsers.js +69 -14
- package/src/js/modules/ColumnCalcs/ColumnCalcs.js +7 -1
- package/src/js/modules/Edit/Edit.js +71 -25
- package/src/js/modules/Edit/defaults/editors/datetime.js +1 -1
- package/src/js/modules/Edit/defaults/editors/time.js +3 -1
- package/src/js/modules/Export/Export.js +38 -18
- package/src/js/modules/Format/defaults/formatters/rowSelection.js +2 -2
- package/src/js/modules/Format/defaults/formatters/rownum.js +5 -1
- package/src/js/modules/FrozenColumns/FrozenColumns.js +11 -11
- package/src/js/modules/FrozenRows/FrozenRows.js +6 -1
- package/src/js/modules/History/History.js +2 -2
- package/src/js/modules/History/defaults/redoers.js +4 -0
- package/src/js/modules/History/defaults/undoers.js +4 -0
- package/src/js/modules/Keybindings/defaults/actions.js +38 -1
- package/src/js/modules/Keybindings/defaults/bindings.js +16 -1
- package/src/js/modules/Menu/Menu.js +3 -1
- package/src/js/modules/MoveColumns/MoveColumns.js +5 -0
- package/src/js/modules/Popup/Popup.js +1 -1
- package/src/js/modules/ResizeTable/ResizeTable.js +3 -3
- package/src/js/modules/SelectRange/Range.js +354 -0
- package/src/js/modules/SelectRange/RangeComponent.js +93 -0
- package/src/js/modules/SelectRange/SelectRange.js +870 -0
- package/src/js/modules/SelectRow/SelectRow.js +46 -26
- package/src/js/modules/Sort/Sort.js +111 -105
- package/src/js/modules/Validate/defaults/validators.js +11 -0
- package/src/scss/tabulator.scss +95 -13
- package/src/scss/themes/bulma/tabulator_bulma.scss +7 -0
- package/src/scss/themes/materialize/tabulator_materialize.scss +7 -1
- package/src/scss/themes/tabulator_midnight.scss +13 -0
- package/src/scss/themes/tabulator_modern.scss +9 -0
- package/src/scss/themes/tabulator_site.scss +13 -2
package/dist/js/tabulator.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* Tabulator v5.
|
|
1
|
+
/* Tabulator v5.6.1 (c) Oliver Folkerd 2024 */
|
|
2
2
|
(function (global, factory) {
|
|
3
3
|
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
|
|
4
4
|
typeof define === 'function' && define.amd ? define(factory) :
|
|
@@ -191,8 +191,8 @@
|
|
|
191
191
|
/////////// Deprecation Checks ///////////
|
|
192
192
|
//////////////////////////////////////////
|
|
193
193
|
|
|
194
|
-
deprecationCheck(oldOption, newOption){
|
|
195
|
-
return this.table.deprecationAdvisor.check(oldOption, newOption);
|
|
194
|
+
deprecationCheck(oldOption, newOption, convert){
|
|
195
|
+
return this.table.deprecationAdvisor.check(oldOption, newOption, convert);
|
|
196
196
|
}
|
|
197
197
|
|
|
198
198
|
deprecationCheckMsg(oldOption, msg){
|
|
@@ -1008,6 +1008,10 @@
|
|
|
1008
1008
|
titleElement.focus();
|
|
1009
1009
|
});
|
|
1010
1010
|
|
|
1011
|
+
titleElement.addEventListener("mousedown", (e) => {
|
|
1012
|
+
e.stopPropagation();
|
|
1013
|
+
});
|
|
1014
|
+
|
|
1011
1015
|
titleElement.addEventListener("change", () => {
|
|
1012
1016
|
def.title = titleElement.value;
|
|
1013
1017
|
this.dispatchExternal("columnTitleChanged", this.getComponent());
|
|
@@ -1553,6 +1557,8 @@
|
|
|
1553
1557
|
|
|
1554
1558
|
this.table.columnManager.rerenderColumns(true);
|
|
1555
1559
|
|
|
1560
|
+
this.dispatch("column-deleted", this);
|
|
1561
|
+
|
|
1556
1562
|
resolve();
|
|
1557
1563
|
});
|
|
1558
1564
|
}
|
|
@@ -1693,6 +1699,10 @@
|
|
|
1693
1699
|
|
|
1694
1700
|
return this.component;
|
|
1695
1701
|
}
|
|
1702
|
+
|
|
1703
|
+
getPosition(){
|
|
1704
|
+
return this.table.columnManager.getVisibleColumnsByIndex().indexOf(this) + 1;
|
|
1705
|
+
}
|
|
1696
1706
|
}
|
|
1697
1707
|
|
|
1698
1708
|
Column.defaultOptionList = defaultColumnOptions;
|
|
@@ -3018,6 +3028,10 @@
|
|
|
3018
3028
|
|
|
3019
3029
|
return index > -1 ? this.columnsByIndex[index] : false;
|
|
3020
3030
|
}
|
|
3031
|
+
|
|
3032
|
+
getVisibleColumnsByIndex() {
|
|
3033
|
+
return this.columnsByIndex.filter((col) => col.visible);
|
|
3034
|
+
}
|
|
3021
3035
|
|
|
3022
3036
|
getColumns(){
|
|
3023
3037
|
return this.columns;
|
|
@@ -3972,8 +3986,6 @@
|
|
|
3972
3986
|
}
|
|
3973
3987
|
});
|
|
3974
3988
|
|
|
3975
|
-
|
|
3976
|
-
|
|
3977
3989
|
if(onlyGroupHeaders){
|
|
3978
3990
|
element.style.minWidth = this.table.columnManager.getWidth() + "px";
|
|
3979
3991
|
}else {
|
|
@@ -3990,6 +4002,10 @@
|
|
|
3990
4002
|
}
|
|
3991
4003
|
|
|
3992
4004
|
this.renderRows();
|
|
4005
|
+
|
|
4006
|
+
if(!this.rows().length){
|
|
4007
|
+
this.table.rowManager.tableEmpty();
|
|
4008
|
+
}
|
|
3993
4009
|
}
|
|
3994
4010
|
|
|
3995
4011
|
scrollToRowNearestTop(row){
|
|
@@ -4983,7 +4999,7 @@
|
|
|
4983
4999
|
|
|
4984
5000
|
this.regenerateRowPositions();
|
|
4985
5001
|
|
|
4986
|
-
if(
|
|
5002
|
+
if(this.displayRowsCount){
|
|
4987
5003
|
this._clearPlaceholder();
|
|
4988
5004
|
}
|
|
4989
5005
|
|
|
@@ -5612,6 +5628,14 @@
|
|
|
5612
5628
|
this.renderEmptyScroll();
|
|
5613
5629
|
this._showPlaceholder();
|
|
5614
5630
|
}
|
|
5631
|
+
|
|
5632
|
+
checkPlaceholder(){
|
|
5633
|
+
if(this.displayRowsCount){
|
|
5634
|
+
this._clearPlaceholder();
|
|
5635
|
+
}else {
|
|
5636
|
+
this.tableEmpty();
|
|
5637
|
+
}
|
|
5638
|
+
}
|
|
5615
5639
|
|
|
5616
5640
|
_showPlaceholder(){
|
|
5617
5641
|
if(this.placeholder){
|
|
@@ -5740,13 +5764,11 @@
|
|
|
5740
5764
|
|
|
5741
5765
|
//redraw table
|
|
5742
5766
|
redraw (force){
|
|
5743
|
-
|
|
5767
|
+
this.adjustTableSize();
|
|
5744
5768
|
this.table.tableWidth = this.table.element.clientWidth;
|
|
5745
5769
|
|
|
5746
|
-
if(!force){
|
|
5747
|
-
|
|
5748
|
-
this.reRenderInPosition();
|
|
5749
|
-
}
|
|
5770
|
+
if(!force){
|
|
5771
|
+
this.reRenderInPosition();
|
|
5750
5772
|
this.scrollHorizontal(this.scrollLeft);
|
|
5751
5773
|
}else {
|
|
5752
5774
|
this.renderTable();
|
|
@@ -6093,11 +6115,11 @@
|
|
|
6093
6115
|
}
|
|
6094
6116
|
}
|
|
6095
6117
|
}
|
|
6096
|
-
|
|
6118
|
+
|
|
6097
6119
|
if(targets.group && targets.group === targets.row){
|
|
6098
6120
|
delete targets.row;
|
|
6099
6121
|
}
|
|
6100
|
-
|
|
6122
|
+
|
|
6101
6123
|
return targets;
|
|
6102
6124
|
}
|
|
6103
6125
|
|
|
@@ -6629,7 +6651,7 @@
|
|
|
6629
6651
|
}
|
|
6630
6652
|
}
|
|
6631
6653
|
|
|
6632
|
-
check(oldOption, newOption){
|
|
6654
|
+
check(oldOption, newOption, convert){
|
|
6633
6655
|
var msg = "";
|
|
6634
6656
|
|
|
6635
6657
|
if(typeof this.options(oldOption) !== "undefined"){
|
|
@@ -6638,6 +6660,10 @@
|
|
|
6638
6660
|
if(newOption){
|
|
6639
6661
|
msg = msg + ", Please use the %c" + newOption + "%c option instead";
|
|
6640
6662
|
this._warnUser(msg, 'font-weight: bold;', 'font-weight: normal;', 'font-weight: bold;', 'font-weight: normal;');
|
|
6663
|
+
|
|
6664
|
+
if(convert){
|
|
6665
|
+
this.table.options[newOption] = this.table.options[oldOption];
|
|
6666
|
+
}
|
|
6641
6667
|
}else {
|
|
6642
6668
|
this._warnUser(msg, 'font-weight: bold;', 'font-weight: normal;');
|
|
6643
6669
|
}
|
|
@@ -7867,6 +7893,8 @@
|
|
|
7867
7893
|
alert(content, type = "msg"){
|
|
7868
7894
|
if(content){
|
|
7869
7895
|
this.clear();
|
|
7896
|
+
|
|
7897
|
+
this.dispatch("alert-show", type);
|
|
7870
7898
|
|
|
7871
7899
|
this.type = type;
|
|
7872
7900
|
|
|
@@ -7889,6 +7917,8 @@
|
|
|
7889
7917
|
}
|
|
7890
7918
|
|
|
7891
7919
|
clear(){
|
|
7920
|
+
this.dispatch("alert-hide", this.type);
|
|
7921
|
+
|
|
7892
7922
|
if(this.element.parentNode){
|
|
7893
7923
|
this.element.parentNode.removeChild(this.element);
|
|
7894
7924
|
}
|
|
@@ -8152,6 +8182,7 @@
|
|
|
8152
8182
|
|
|
8153
8183
|
_loadInitialData(){
|
|
8154
8184
|
this.dataLoader.load(this.options.data);
|
|
8185
|
+
this.columnManager.verticalAlignHeaders();
|
|
8155
8186
|
}
|
|
8156
8187
|
|
|
8157
8188
|
//deconstructor
|
|
@@ -8704,7 +8735,7 @@
|
|
|
8704
8735
|
this.options.height = isNaN(height) ? height : height + "px";
|
|
8705
8736
|
this.element.style.height = this.options.height;
|
|
8706
8737
|
this.rowManager.initializeRenderer();
|
|
8707
|
-
this.rowManager.redraw();
|
|
8738
|
+
this.rowManager.redraw(true);
|
|
8708
8739
|
}
|
|
8709
8740
|
|
|
8710
8741
|
//////////////////// Event Bus ///////////////////
|
|
@@ -9199,15 +9230,58 @@
|
|
|
9199
9230
|
Ajax.contentTypeFormatters = defaultContentTypeFormatters;
|
|
9200
9231
|
|
|
9201
9232
|
var defaultPasteActions = {
|
|
9202
|
-
replace:function(
|
|
9203
|
-
return this.table.setData(
|
|
9233
|
+
replace:function(data){
|
|
9234
|
+
return this.table.setData(data);
|
|
9204
9235
|
},
|
|
9205
|
-
update:function(
|
|
9206
|
-
return this.table.updateOrAddData(
|
|
9236
|
+
update:function(data){
|
|
9237
|
+
return this.table.updateOrAddData(data);
|
|
9207
9238
|
},
|
|
9208
|
-
insert:function(
|
|
9209
|
-
return this.table.addData(
|
|
9239
|
+
insert:function(data){
|
|
9240
|
+
return this.table.addData(data);
|
|
9210
9241
|
},
|
|
9242
|
+
range:function(data){
|
|
9243
|
+
var rows = [],
|
|
9244
|
+
range = this.table.modules.selectRange.activeRange,
|
|
9245
|
+
singleCell = false,
|
|
9246
|
+
bounds, startCell, startRow, rowWidth, dataLength;
|
|
9247
|
+
|
|
9248
|
+
dataLength = data.length;
|
|
9249
|
+
|
|
9250
|
+
if(range){
|
|
9251
|
+
bounds = range.getBounds();
|
|
9252
|
+
startCell = bounds.start;
|
|
9253
|
+
|
|
9254
|
+
if(bounds.start === bounds.end){
|
|
9255
|
+
singleCell = true;
|
|
9256
|
+
}
|
|
9257
|
+
|
|
9258
|
+
if(startCell){
|
|
9259
|
+
rows = this.table.rowManager.activeRows.slice();
|
|
9260
|
+
startRow = rows.indexOf(startCell.row);
|
|
9261
|
+
|
|
9262
|
+
if(singleCell){
|
|
9263
|
+
rowWidth = data.length;
|
|
9264
|
+
}else {
|
|
9265
|
+
rowWidth = (rows.indexOf(bounds.end.row) - startRow) + 1;
|
|
9266
|
+
}
|
|
9267
|
+
|
|
9268
|
+
|
|
9269
|
+
if(startRow >-1){
|
|
9270
|
+
this.table.blockRedraw();
|
|
9271
|
+
|
|
9272
|
+
rows = rows.slice(startRow, startRow + rowWidth);
|
|
9273
|
+
|
|
9274
|
+
rows.forEach((row, i) => {
|
|
9275
|
+
row.updateData(data[i % dataLength]);
|
|
9276
|
+
});
|
|
9277
|
+
|
|
9278
|
+
this.table.restoreRedraw();
|
|
9279
|
+
}
|
|
9280
|
+
}
|
|
9281
|
+
}
|
|
9282
|
+
|
|
9283
|
+
return rows;
|
|
9284
|
+
}
|
|
9211
9285
|
};
|
|
9212
9286
|
|
|
9213
9287
|
var defaultPasteParsers = {
|
|
@@ -9217,72 +9291,127 @@
|
|
|
9217
9291
|
columns = this.table.columnManager.columns,
|
|
9218
9292
|
columnMap = [],
|
|
9219
9293
|
rows = [];
|
|
9220
|
-
|
|
9294
|
+
|
|
9221
9295
|
//get data from clipboard into array of columns and rows.
|
|
9222
9296
|
clipboard = clipboard.split("\n");
|
|
9223
|
-
|
|
9297
|
+
|
|
9224
9298
|
clipboard.forEach(function(row){
|
|
9225
9299
|
data.push(row.split("\t"));
|
|
9226
9300
|
});
|
|
9227
|
-
|
|
9301
|
+
|
|
9228
9302
|
if(data.length && !(data.length === 1 && data[0].length < 2)){
|
|
9229
|
-
|
|
9303
|
+
|
|
9230
9304
|
//check if headers are present by title
|
|
9231
9305
|
data[0].forEach(function(value){
|
|
9232
9306
|
var column = columns.find(function(column){
|
|
9233
9307
|
return value && column.definition.title && value.trim() && column.definition.title.trim() === value.trim();
|
|
9234
9308
|
});
|
|
9235
|
-
|
|
9309
|
+
|
|
9236
9310
|
if(column){
|
|
9237
9311
|
columnMap.push(column);
|
|
9238
9312
|
}else {
|
|
9239
9313
|
headerFindSuccess = false;
|
|
9240
9314
|
}
|
|
9241
9315
|
});
|
|
9242
|
-
|
|
9316
|
+
|
|
9243
9317
|
//check if column headers are present by field
|
|
9244
9318
|
if(!headerFindSuccess){
|
|
9245
9319
|
headerFindSuccess = true;
|
|
9246
9320
|
columnMap = [];
|
|
9247
|
-
|
|
9321
|
+
|
|
9248
9322
|
data[0].forEach(function(value){
|
|
9249
9323
|
var column = columns.find(function(column){
|
|
9250
9324
|
return value && column.field && value.trim() && column.field.trim() === value.trim();
|
|
9251
9325
|
});
|
|
9252
|
-
|
|
9326
|
+
|
|
9253
9327
|
if(column){
|
|
9254
9328
|
columnMap.push(column);
|
|
9255
9329
|
}else {
|
|
9256
9330
|
headerFindSuccess = false;
|
|
9257
9331
|
}
|
|
9258
9332
|
});
|
|
9259
|
-
|
|
9333
|
+
|
|
9260
9334
|
if(!headerFindSuccess){
|
|
9261
9335
|
columnMap = this.table.columnManager.columnsByIndex;
|
|
9262
9336
|
}
|
|
9263
9337
|
}
|
|
9264
|
-
|
|
9338
|
+
|
|
9265
9339
|
//remove header row if found
|
|
9266
9340
|
if(headerFindSuccess){
|
|
9267
9341
|
data.shift();
|
|
9268
9342
|
}
|
|
9269
|
-
|
|
9343
|
+
|
|
9270
9344
|
data.forEach(function(item){
|
|
9271
9345
|
var row = {};
|
|
9272
|
-
|
|
9346
|
+
|
|
9273
9347
|
item.forEach(function(value, i){
|
|
9274
9348
|
if(columnMap[i]){
|
|
9275
9349
|
row[columnMap[i].field] = value;
|
|
9276
9350
|
}
|
|
9277
9351
|
});
|
|
9278
|
-
|
|
9352
|
+
|
|
9279
9353
|
rows.push(row);
|
|
9280
9354
|
});
|
|
9281
|
-
|
|
9355
|
+
|
|
9282
9356
|
return rows;
|
|
9283
9357
|
}else {
|
|
9284
9358
|
return false;
|
|
9285
9359
|
}
|
|
9360
|
+
},
|
|
9361
|
+
range:function(clipboard){
|
|
9362
|
+
var data = [],
|
|
9363
|
+
rows = [],
|
|
9364
|
+
range = this.table.modules.selectRange.activeRange,
|
|
9365
|
+
singleCell = false,
|
|
9366
|
+
bounds, startCell, colWidth, columnMap, startCol;
|
|
9367
|
+
|
|
9368
|
+
if(range){
|
|
9369
|
+
bounds = range.getBounds();
|
|
9370
|
+
startCell = bounds.start;
|
|
9371
|
+
|
|
9372
|
+
if(bounds.start === bounds.end){
|
|
9373
|
+
singleCell = true;
|
|
9374
|
+
}
|
|
9375
|
+
|
|
9376
|
+
if(startCell){
|
|
9377
|
+
//get data from clipboard into array of columns and rows.
|
|
9378
|
+
clipboard = clipboard.split("\n");
|
|
9379
|
+
|
|
9380
|
+
clipboard.forEach(function(row){
|
|
9381
|
+
data.push(row.split("\t"));
|
|
9382
|
+
});
|
|
9383
|
+
|
|
9384
|
+
if(data.length){
|
|
9385
|
+
columnMap = this.table.columnManager.getVisibleColumnsByIndex();
|
|
9386
|
+
startCol = columnMap.indexOf(startCell.column);
|
|
9387
|
+
|
|
9388
|
+
if(startCol > -1){
|
|
9389
|
+
if(singleCell){
|
|
9390
|
+
colWidth = data[0].length;
|
|
9391
|
+
}else {
|
|
9392
|
+
colWidth = (columnMap.indexOf(bounds.end.column) - startCol) + 1;
|
|
9393
|
+
}
|
|
9394
|
+
|
|
9395
|
+
columnMap = columnMap.slice(startCol, startCol + colWidth);
|
|
9396
|
+
|
|
9397
|
+
data.forEach((item) => {
|
|
9398
|
+
var row = {};
|
|
9399
|
+
var itemLength = item.length;
|
|
9400
|
+
|
|
9401
|
+
columnMap.forEach(function(col, i){
|
|
9402
|
+
row[col.field] = item[i % itemLength];
|
|
9403
|
+
});
|
|
9404
|
+
|
|
9405
|
+
rows.push(row);
|
|
9406
|
+
});
|
|
9407
|
+
|
|
9408
|
+
return rows;
|
|
9409
|
+
}
|
|
9410
|
+
}
|
|
9411
|
+
}
|
|
9412
|
+
}
|
|
9413
|
+
|
|
9414
|
+
return false;
|
|
9286
9415
|
}
|
|
9287
9416
|
};
|
|
9288
9417
|
|
|
@@ -9425,6 +9554,7 @@
|
|
|
9425
9554
|
var sel, textRange;
|
|
9426
9555
|
this.blocked = false;
|
|
9427
9556
|
this.customSelection = false;
|
|
9557
|
+
|
|
9428
9558
|
|
|
9429
9559
|
if (this.mode === true || this.mode === "copy") {
|
|
9430
9560
|
|
|
@@ -9492,7 +9622,7 @@
|
|
|
9492
9622
|
paste(e){
|
|
9493
9623
|
var data, rowData, rows;
|
|
9494
9624
|
|
|
9495
|
-
if(this.
|
|
9625
|
+
if(this.checkPasteOrigin(e)){
|
|
9496
9626
|
|
|
9497
9627
|
data = this.getPasteData(e);
|
|
9498
9628
|
|
|
@@ -9529,10 +9659,11 @@
|
|
|
9529
9659
|
}
|
|
9530
9660
|
|
|
9531
9661
|
|
|
9532
|
-
|
|
9662
|
+
checkPasteOrigin(e){
|
|
9533
9663
|
var valid = true;
|
|
9664
|
+
var blocked = this.confirm("clipboard-paste", [e]);
|
|
9534
9665
|
|
|
9535
|
-
if(
|
|
9666
|
+
if(blocked || !["DIV", "SPAN"].includes(e.target.tagName)){
|
|
9536
9667
|
valid = false;
|
|
9537
9668
|
}
|
|
9538
9669
|
|
|
@@ -9967,8 +10098,14 @@
|
|
|
9967
10098
|
}
|
|
9968
10099
|
|
|
9969
10100
|
initializeTopRow(){
|
|
10101
|
+
var fragment = document.createDocumentFragment();
|
|
10102
|
+
|
|
9970
10103
|
if(!this.topInitialized){
|
|
9971
|
-
|
|
10104
|
+
|
|
10105
|
+
fragment.appendChild(document.createElement("br"));
|
|
10106
|
+
fragment.appendChild(this.topElement);
|
|
10107
|
+
|
|
10108
|
+
this.table.columnManager.getContentsElement().insertBefore(fragment, this.table.columnManager.headersElement.nextSibling);
|
|
9972
10109
|
this.topInitialized = true;
|
|
9973
10110
|
}
|
|
9974
10111
|
}
|
|
@@ -12016,12 +12153,14 @@
|
|
|
12016
12153
|
newDatetime = DT.fromFormat(String(cellValue), inputFormat);
|
|
12017
12154
|
}
|
|
12018
12155
|
|
|
12019
|
-
cellValue = newDatetime.toFormat("
|
|
12156
|
+
cellValue = newDatetime.toFormat("HH:mm");
|
|
12020
12157
|
|
|
12021
12158
|
}else {
|
|
12022
12159
|
console.error("Editor Error - 'date' editor 'format' param is dependant on luxon.js");
|
|
12023
12160
|
}
|
|
12024
12161
|
}
|
|
12162
|
+
|
|
12163
|
+
console.log("val", cellValue);
|
|
12025
12164
|
|
|
12026
12165
|
input.value = cellValue;
|
|
12027
12166
|
|
|
@@ -12143,7 +12282,7 @@
|
|
|
12143
12282
|
newDatetime = DT.fromFormat(String(cellValue), inputFormat);
|
|
12144
12283
|
}
|
|
12145
12284
|
|
|
12146
|
-
cellValue = newDatetime.toFormat("yyyy-MM-dd") + "T" + newDatetime.toFormat("
|
|
12285
|
+
cellValue = newDatetime.toFormat("yyyy-MM-dd") + "T" + newDatetime.toFormat("HH:mm");
|
|
12147
12286
|
}else {
|
|
12148
12287
|
console.error("Editor Error - 'date' editor 'format' param is dependant on luxon.js");
|
|
12149
12288
|
}
|
|
@@ -13710,6 +13849,8 @@
|
|
|
13710
13849
|
this.registerColumnOption("cellEdited");
|
|
13711
13850
|
this.registerColumnOption("cellEditCancelled");
|
|
13712
13851
|
|
|
13852
|
+
this.registerTableOption("editTriggerEvent", "focus");
|
|
13853
|
+
|
|
13713
13854
|
this.registerTableFunction("getEditedCells", this.getEditedCells.bind(this));
|
|
13714
13855
|
this.registerTableFunction("clearCellEdited", this.clearCellEdited.bind(this));
|
|
13715
13856
|
this.registerTableFunction("navigatePrev", this.navigatePrev.bind(this));
|
|
@@ -13741,16 +13882,30 @@
|
|
|
13741
13882
|
this.subscribe("row-deleting", this.rowDeleteCheck.bind(this));
|
|
13742
13883
|
this.subscribe("row-layout", this.rowEditableCheck.bind(this));
|
|
13743
13884
|
this.subscribe("data-refreshing", this.cancelEdit.bind(this));
|
|
13885
|
+
this.subscribe("clipboard-paste", this.pasteBlocker.bind(this));
|
|
13744
13886
|
|
|
13745
13887
|
this.subscribe("keybinding-nav-prev", this.navigatePrev.bind(this, undefined));
|
|
13746
13888
|
this.subscribe("keybinding-nav-next", this.keybindingNavigateNext.bind(this));
|
|
13747
|
-
|
|
13748
|
-
|
|
13889
|
+
|
|
13890
|
+
|
|
13891
|
+
// this.subscribe("keybinding-nav-left", this.navigateLeft.bind(this, undefined));
|
|
13892
|
+
// this.subscribe("keybinding-nav-right", this.navigateRight.bind(this, undefined));
|
|
13749
13893
|
this.subscribe("keybinding-nav-up", this.navigateUp.bind(this, undefined));
|
|
13750
13894
|
this.subscribe("keybinding-nav-down", this.navigateDown.bind(this, undefined));
|
|
13751
13895
|
}
|
|
13752
13896
|
|
|
13753
13897
|
|
|
13898
|
+
///////////////////////////////////
|
|
13899
|
+
///////// Paste Negation //////////
|
|
13900
|
+
///////////////////////////////////
|
|
13901
|
+
|
|
13902
|
+
pasteBlocker(e){
|
|
13903
|
+
if(this.currentCell){
|
|
13904
|
+
return true;
|
|
13905
|
+
}
|
|
13906
|
+
}
|
|
13907
|
+
|
|
13908
|
+
|
|
13754
13909
|
///////////////////////////////////
|
|
13755
13910
|
////// Keybinding Functions ///////
|
|
13756
13911
|
///////////////////////////////////
|
|
@@ -13758,7 +13913,7 @@
|
|
|
13758
13913
|
keybindingNavigateNext(e){
|
|
13759
13914
|
var cell = this.currentCell,
|
|
13760
13915
|
newRow = this.options("tabEndNewRow");
|
|
13761
|
-
|
|
13916
|
+
|
|
13762
13917
|
if(cell){
|
|
13763
13918
|
if(!this.navigateNext(cell, e)){
|
|
13764
13919
|
if(newRow){
|
|
@@ -14147,12 +14302,6 @@
|
|
|
14147
14302
|
this.updateCellClass(cell);
|
|
14148
14303
|
element.setAttribute("tabindex", 0);
|
|
14149
14304
|
|
|
14150
|
-
element.addEventListener("click", function(e){
|
|
14151
|
-
if(!element.classList.contains("tabulator-editing")){
|
|
14152
|
-
element.focus({preventScroll: true});
|
|
14153
|
-
}
|
|
14154
|
-
});
|
|
14155
|
-
|
|
14156
14305
|
element.addEventListener("mousedown", function(e){
|
|
14157
14306
|
if (e.button === 2) {
|
|
14158
14307
|
e.preventDefault();
|
|
@@ -14160,12 +14309,33 @@
|
|
|
14160
14309
|
self.mouseClick = true;
|
|
14161
14310
|
}
|
|
14162
14311
|
});
|
|
14312
|
+
|
|
14313
|
+
if(this.options("editTriggerEvent") === "dblclick"){
|
|
14314
|
+
element.addEventListener("dblclick", function(e){
|
|
14315
|
+
if(!element.classList.contains("tabulator-editing")){
|
|
14316
|
+
element.focus({preventScroll: true});
|
|
14317
|
+
self.edit(cell, e, false);
|
|
14318
|
+
}
|
|
14319
|
+
});
|
|
14320
|
+
}
|
|
14163
14321
|
|
|
14164
|
-
|
|
14165
|
-
|
|
14166
|
-
|
|
14167
|
-
|
|
14168
|
-
|
|
14322
|
+
|
|
14323
|
+
if(this.options("editTriggerEvent") === "focus" || this.options("editTriggerEvent") === "click"){
|
|
14324
|
+
element.addEventListener("click", function(e){
|
|
14325
|
+
if(!element.classList.contains("tabulator-editing")){
|
|
14326
|
+
element.focus({preventScroll: true});
|
|
14327
|
+
self.edit(cell, e, false);
|
|
14328
|
+
}
|
|
14329
|
+
});
|
|
14330
|
+
}
|
|
14331
|
+
|
|
14332
|
+
if(this.options("editTriggerEvent") === "focus"){
|
|
14333
|
+
element.addEventListener("focus", function(e){
|
|
14334
|
+
if(!self.recursionBlock){
|
|
14335
|
+
self.edit(cell, e, false);
|
|
14336
|
+
}
|
|
14337
|
+
});
|
|
14338
|
+
}
|
|
14169
14339
|
}
|
|
14170
14340
|
}
|
|
14171
14341
|
|
|
@@ -14251,8 +14421,9 @@
|
|
|
14251
14421
|
allowEdit = true,
|
|
14252
14422
|
rendered = function(){},
|
|
14253
14423
|
element = cell.getElement(),
|
|
14424
|
+
editFinished = false,
|
|
14254
14425
|
cellEditor, component, params;
|
|
14255
|
-
|
|
14426
|
+
|
|
14256
14427
|
//prevent editing if another cell is refusing to leave focus (eg. validation fail)
|
|
14257
14428
|
|
|
14258
14429
|
if(this.currentCell){
|
|
@@ -14264,13 +14435,15 @@
|
|
|
14264
14435
|
|
|
14265
14436
|
//handle successful value change
|
|
14266
14437
|
function success(value){
|
|
14267
|
-
if(self.currentCell === cell){
|
|
14438
|
+
if(self.currentCell === cell && !editFinished){
|
|
14268
14439
|
var valid = self.chain("edit-success", [cell, value], true, true);
|
|
14269
|
-
|
|
14440
|
+
|
|
14270
14441
|
if(valid === true || self.table.options.validationMode === "highlight"){
|
|
14442
|
+
|
|
14443
|
+
editFinished = true;
|
|
14444
|
+
|
|
14271
14445
|
self.clearEditor();
|
|
14272
14446
|
|
|
14273
|
-
|
|
14274
14447
|
if(!cell.modules.edit){
|
|
14275
14448
|
cell.modules.edit = {};
|
|
14276
14449
|
}
|
|
@@ -14282,12 +14455,17 @@
|
|
|
14282
14455
|
}
|
|
14283
14456
|
|
|
14284
14457
|
cell.setValue(value, true);
|
|
14285
|
-
|
|
14458
|
+
|
|
14286
14459
|
return valid === true;
|
|
14287
14460
|
}else {
|
|
14461
|
+
editFinished = true;
|
|
14288
14462
|
self.invalidEdit = true;
|
|
14289
14463
|
self.focusCellNoEvent(cell, true);
|
|
14290
14464
|
rendered();
|
|
14465
|
+
|
|
14466
|
+
setTimeout(() => {
|
|
14467
|
+
editFinished = false;
|
|
14468
|
+
}, 10);
|
|
14291
14469
|
return false;
|
|
14292
14470
|
}
|
|
14293
14471
|
}
|
|
@@ -14295,7 +14473,9 @@
|
|
|
14295
14473
|
|
|
14296
14474
|
//handle aborted edit
|
|
14297
14475
|
function cancel(){
|
|
14298
|
-
|
|
14476
|
+
// editFinished = true;
|
|
14477
|
+
|
|
14478
|
+
if(self.currentCell === cell && !editFinished){
|
|
14299
14479
|
self.cancelEdit();
|
|
14300
14480
|
}
|
|
14301
14481
|
}
|
|
@@ -14312,7 +14492,6 @@
|
|
|
14312
14492
|
allowEdit = this.allowEdit(cell);
|
|
14313
14493
|
|
|
14314
14494
|
if(allowEdit || forceEdit){
|
|
14315
|
-
|
|
14316
14495
|
self.cancelEdit();
|
|
14317
14496
|
|
|
14318
14497
|
self.currentCell = cell;
|
|
@@ -14362,27 +14541,33 @@
|
|
|
14362
14541
|
}
|
|
14363
14542
|
}else {
|
|
14364
14543
|
console.warn("Edit Error - Editor should return an instance of Node, the editor returned:", cellEditor);
|
|
14365
|
-
|
|
14544
|
+
this.blur(element);
|
|
14366
14545
|
return false;
|
|
14367
14546
|
}
|
|
14368
14547
|
}else {
|
|
14369
|
-
|
|
14548
|
+
this.blur(element);
|
|
14370
14549
|
return false;
|
|
14371
14550
|
}
|
|
14372
14551
|
|
|
14373
14552
|
return true;
|
|
14374
14553
|
}else {
|
|
14375
14554
|
this.mouseClick = false;
|
|
14376
|
-
|
|
14555
|
+
this.blur(element);
|
|
14377
14556
|
return false;
|
|
14378
14557
|
}
|
|
14379
14558
|
}else {
|
|
14380
14559
|
this.mouseClick = false;
|
|
14381
|
-
|
|
14560
|
+
this.blur(element);
|
|
14382
14561
|
return false;
|
|
14383
14562
|
}
|
|
14384
14563
|
}
|
|
14385
14564
|
|
|
14565
|
+
blur(element){
|
|
14566
|
+
if(!this.confirm("edit-blur", [element]) ){
|
|
14567
|
+
element.blur();
|
|
14568
|
+
}
|
|
14569
|
+
}
|
|
14570
|
+
|
|
14386
14571
|
getEditedCells(){
|
|
14387
14572
|
var output = [];
|
|
14388
14573
|
|
|
@@ -14466,10 +14651,20 @@
|
|
|
14466
14651
|
this.cloneTableStyle = style;
|
|
14467
14652
|
this.config = config || {};
|
|
14468
14653
|
this.colVisProp = colVisProp;
|
|
14654
|
+
|
|
14655
|
+
var headers, body;
|
|
14469
14656
|
|
|
14470
|
-
|
|
14471
|
-
|
|
14472
|
-
|
|
14657
|
+
if (range === 'range') {
|
|
14658
|
+
var columns = this.table.modules.selectRange.selectedColumns();
|
|
14659
|
+
headers = this.config.columnHeaders !== false
|
|
14660
|
+
? this.headersToExportRows(this.generateColumnGroupHeaders(columns))
|
|
14661
|
+
: [];
|
|
14662
|
+
body = this.bodyToExportRows(this.rowLookup(range), this.table.modules.selectRange.selectedColumns(true));
|
|
14663
|
+
} else {
|
|
14664
|
+
headers = this.config.columnHeaders !== false ? this.headersToExportRows(this.generateColumnGroupHeaders()) : [];
|
|
14665
|
+
body = this.bodyToExportRows(this.rowLookup(range));
|
|
14666
|
+
}
|
|
14667
|
+
|
|
14473
14668
|
return headers.concat(body);
|
|
14474
14669
|
}
|
|
14475
14670
|
|
|
@@ -14504,7 +14699,11 @@
|
|
|
14504
14699
|
case "selected":
|
|
14505
14700
|
rows = this.table.modules.selectRow.selectedRows;
|
|
14506
14701
|
break;
|
|
14507
|
-
|
|
14702
|
+
|
|
14703
|
+
case "range":
|
|
14704
|
+
rows = this.table.modules.selectRange.selectedRows();
|
|
14705
|
+
break;
|
|
14706
|
+
|
|
14508
14707
|
case "active":
|
|
14509
14708
|
default:
|
|
14510
14709
|
if(this.table.options.pagination){
|
|
@@ -14518,10 +14717,12 @@
|
|
|
14518
14717
|
return Object.assign([], rows);
|
|
14519
14718
|
}
|
|
14520
14719
|
|
|
14521
|
-
generateColumnGroupHeaders(){
|
|
14720
|
+
generateColumnGroupHeaders(columns){
|
|
14522
14721
|
var output = [];
|
|
14523
14722
|
|
|
14524
|
-
|
|
14723
|
+
if (!columns) {
|
|
14724
|
+
columns = this.config.columnGroups !== false ? this.table.columnManager.columns : this.table.columnManager.columnsByIndex;
|
|
14725
|
+
}
|
|
14525
14726
|
|
|
14526
14727
|
columns.forEach((column) => {
|
|
14527
14728
|
var colData = this.processColumnGroup(column);
|
|
@@ -14530,7 +14731,7 @@
|
|
|
14530
14731
|
output.push(colData);
|
|
14531
14732
|
}
|
|
14532
14733
|
});
|
|
14533
|
-
|
|
14734
|
+
|
|
14534
14735
|
return output;
|
|
14535
14736
|
}
|
|
14536
14737
|
|
|
@@ -14658,16 +14859,16 @@
|
|
|
14658
14859
|
return exportRows;
|
|
14659
14860
|
}
|
|
14660
14861
|
|
|
14661
|
-
bodyToExportRows(rows){
|
|
14662
|
-
|
|
14663
|
-
var columns = [];
|
|
14862
|
+
bodyToExportRows(rows, columns = []){
|
|
14664
14863
|
var exportRows = [];
|
|
14665
14864
|
|
|
14666
|
-
|
|
14667
|
-
|
|
14668
|
-
|
|
14669
|
-
|
|
14670
|
-
|
|
14865
|
+
if (columns.length === 0) {
|
|
14866
|
+
this.table.columnManager.columnsByIndex.forEach((column) => {
|
|
14867
|
+
if (this.columnVisCheck(column)) {
|
|
14868
|
+
columns.push(column.getComponent());
|
|
14869
|
+
}
|
|
14870
|
+
});
|
|
14871
|
+
}
|
|
14671
14872
|
|
|
14672
14873
|
if(this.config.columnCalcs !== false && this.table.modExists("columnCalcs")){
|
|
14673
14874
|
if(this.table.modules.columnCalcs.topInitialized){
|
|
@@ -14678,7 +14879,7 @@
|
|
|
14678
14879
|
rows.push(this.table.modules.columnCalcs.botRow);
|
|
14679
14880
|
}
|
|
14680
14881
|
}
|
|
14681
|
-
|
|
14882
|
+
|
|
14682
14883
|
rows = rows.filter((row) => {
|
|
14683
14884
|
switch(row.type){
|
|
14684
14885
|
case "group":
|
|
@@ -14905,7 +15106,8 @@
|
|
|
14905
15106
|
if(col){
|
|
14906
15107
|
var cellEl = document.createElement("td"),
|
|
14907
15108
|
column = col.component._column,
|
|
14908
|
-
|
|
15109
|
+
table = this.table,
|
|
15110
|
+
index = table.columnManager.findColumnIndex(column),
|
|
14909
15111
|
value = col.value,
|
|
14910
15112
|
cellStyle;
|
|
14911
15113
|
|
|
@@ -14932,6 +15134,9 @@
|
|
|
14932
15134
|
getRow:function(){
|
|
14933
15135
|
return row.component;
|
|
14934
15136
|
},
|
|
15137
|
+
getTable:function(){
|
|
15138
|
+
return table;
|
|
15139
|
+
},
|
|
14935
15140
|
getComponent:function(){
|
|
14936
15141
|
return cellWrapper;
|
|
14937
15142
|
},
|
|
@@ -16590,8 +16795,12 @@
|
|
|
16590
16795
|
function rownum(cell, formatterParams, onRendered){
|
|
16591
16796
|
var content = document.createElement("span");
|
|
16592
16797
|
var row = cell.getRow();
|
|
16798
|
+
var table = cell.getTable();
|
|
16593
16799
|
|
|
16594
16800
|
row.watchPosition((position) => {
|
|
16801
|
+
if (formatterParams.relativeToPage) {
|
|
16802
|
+
position += table.modules.page.getPageSize() * (table.modules.page.getPage() - 1);
|
|
16803
|
+
}
|
|
16595
16804
|
content.innerText = position;
|
|
16596
16805
|
});
|
|
16597
16806
|
|
|
@@ -16668,7 +16877,7 @@
|
|
|
16668
16877
|
if(row instanceof RowComponent){
|
|
16669
16878
|
|
|
16670
16879
|
checkbox.addEventListener("change", (e) => {
|
|
16671
|
-
if(this.table.options.
|
|
16880
|
+
if(this.table.options.selectableRowsRangeMode === "click"){
|
|
16672
16881
|
if(!blocked){
|
|
16673
16882
|
row.toggleSelect();
|
|
16674
16883
|
}else {
|
|
@@ -16679,7 +16888,7 @@
|
|
|
16679
16888
|
}
|
|
16680
16889
|
});
|
|
16681
16890
|
|
|
16682
|
-
if(this.table.options.
|
|
16891
|
+
if(this.table.options.selectableRowsRangeMode === "click"){
|
|
16683
16892
|
checkbox.addEventListener("click", (e) => {
|
|
16684
16893
|
blocked = true;
|
|
16685
16894
|
this.table.modules.selectRow.handleComplexRowClick(row._row, e);
|
|
@@ -16972,7 +17181,10 @@
|
|
|
16972
17181
|
this.subscribe("columns-loading", this.reset.bind(this));
|
|
16973
17182
|
|
|
16974
17183
|
this.subscribe("column-add", this.reinitializeColumns.bind(this));
|
|
16975
|
-
this.subscribe("column-
|
|
17184
|
+
this.subscribe("column-deleted", this.reinitializeColumns.bind(this));
|
|
17185
|
+
this.subscribe("column-hide", this.reinitializeColumns.bind(this));
|
|
17186
|
+
this.subscribe("column-show", this.reinitializeColumns.bind(this));
|
|
17187
|
+
this.subscribe("columns-loaded", this.reinitializeColumns.bind(this));
|
|
16976
17188
|
|
|
16977
17189
|
this.subscribe("table-redraw", this.layout.bind(this));
|
|
16978
17190
|
this.subscribe("layout-refreshing", this.blockLayout.bind(this));
|
|
@@ -16998,16 +17210,16 @@
|
|
|
16998
17210
|
this.table.columnManager.columnsByIndex.forEach((column) => {
|
|
16999
17211
|
this.initializeColumn(column);
|
|
17000
17212
|
});
|
|
17213
|
+
|
|
17214
|
+
this.layout();
|
|
17001
17215
|
}
|
|
17002
17216
|
|
|
17003
17217
|
//initialize specific column
|
|
17004
17218
|
initializeColumn(column){
|
|
17005
17219
|
var config = {margin:0, edge:false};
|
|
17006
17220
|
|
|
17007
|
-
if(!column.isGroup){
|
|
17008
|
-
|
|
17221
|
+
if(!column.isGroup){
|
|
17009
17222
|
if(this.frozenCheck(column)){
|
|
17010
|
-
|
|
17011
17223
|
config.position = this.initializationMode;
|
|
17012
17224
|
|
|
17013
17225
|
if(this.initializationMode == "left"){
|
|
@@ -17098,9 +17310,8 @@
|
|
|
17098
17310
|
leftParents.push(parentEl);
|
|
17099
17311
|
}
|
|
17100
17312
|
|
|
17101
|
-
|
|
17102
|
-
|
|
17103
|
-
}
|
|
17313
|
+
parentEl.classList.toggle("tabulator-frozen-left", column.modules.frozen.edge && column.modules.frozen.position === "left");
|
|
17314
|
+
parentEl.classList.toggle("tabulator-frozen-right", column.modules.frozen.edge && column.modules.frozen.position === "right");
|
|
17104
17315
|
}else {
|
|
17105
17316
|
this.layoutElement(column.getElement(), column);
|
|
17106
17317
|
}
|
|
@@ -17148,7 +17359,6 @@
|
|
|
17148
17359
|
//layout columns appropriately
|
|
17149
17360
|
layout(){
|
|
17150
17361
|
if(this.active && !this.blocked){
|
|
17151
|
-
|
|
17152
17362
|
//calculate left columns
|
|
17153
17363
|
this.layoutColumnPosition();
|
|
17154
17364
|
|
|
@@ -17211,9 +17421,8 @@
|
|
|
17211
17421
|
|
|
17212
17422
|
element.classList.add("tabulator-frozen");
|
|
17213
17423
|
|
|
17214
|
-
|
|
17215
|
-
|
|
17216
|
-
}
|
|
17424
|
+
element.classList.toggle("tabulator-frozen-left", column.modules.frozen.edge && column.modules.frozen.position === "left");
|
|
17425
|
+
element.classList.toggle("tabulator-frozen-right", column.modules.frozen.edge && column.modules.frozen.position === "right");
|
|
17217
17426
|
}
|
|
17218
17427
|
}
|
|
17219
17428
|
|
|
@@ -17257,12 +17466,17 @@
|
|
|
17257
17466
|
}
|
|
17258
17467
|
|
|
17259
17468
|
initialize(){
|
|
17469
|
+
var fragment = document.createDocumentFragment();
|
|
17470
|
+
|
|
17260
17471
|
this.rows = [];
|
|
17261
17472
|
|
|
17262
17473
|
this.topElement.classList.add("tabulator-frozen-rows-holder");
|
|
17474
|
+
|
|
17475
|
+
fragment.appendChild(document.createElement("br"));
|
|
17476
|
+
fragment.appendChild(this.topElement);
|
|
17263
17477
|
|
|
17264
17478
|
// this.table.columnManager.element.append(this.topElement);
|
|
17265
|
-
this.table.columnManager.getContentsElement().insertBefore(
|
|
17479
|
+
this.table.columnManager.getContentsElement().insertBefore(fragment, this.table.columnManager.headersElement.nextSibling);
|
|
17266
17480
|
|
|
17267
17481
|
this.subscribe("row-deleting", this.detachRow.bind(this));
|
|
17268
17482
|
this.subscribe("rows-visible", this.visibleRows.bind(this));
|
|
@@ -18728,6 +18942,8 @@
|
|
|
18728
18942
|
|
|
18729
18943
|
rowAdd: function(action){
|
|
18730
18944
|
action.component.deleteActual();
|
|
18945
|
+
|
|
18946
|
+
this.table.rowManager.checkPlaceholder();
|
|
18731
18947
|
},
|
|
18732
18948
|
|
|
18733
18949
|
rowDelete: function(action){
|
|
@@ -18738,6 +18954,8 @@
|
|
|
18738
18954
|
}
|
|
18739
18955
|
|
|
18740
18956
|
this._rebindRow(action.component, newRow);
|
|
18957
|
+
|
|
18958
|
+
this.table.rowManager.checkPlaceholder();
|
|
18741
18959
|
},
|
|
18742
18960
|
|
|
18743
18961
|
rowMove: function(action){
|
|
@@ -18764,10 +18982,14 @@
|
|
|
18764
18982
|
}
|
|
18765
18983
|
|
|
18766
18984
|
this._rebindRow(action.component, newRow);
|
|
18985
|
+
|
|
18986
|
+
this.table.rowManager.checkPlaceholder();
|
|
18767
18987
|
},
|
|
18768
18988
|
|
|
18769
18989
|
rowDelete:function(action){
|
|
18770
18990
|
action.component.deleteActual();
|
|
18991
|
+
|
|
18992
|
+
this.table.rowManager.checkPlaceholder();
|
|
18771
18993
|
},
|
|
18772
18994
|
|
|
18773
18995
|
rowMove: function(action){
|
|
@@ -18892,7 +19114,7 @@
|
|
|
18892
19114
|
|
|
18893
19115
|
return true;
|
|
18894
19116
|
}else {
|
|
18895
|
-
console.warn("History Undo Error - No more history to undo");
|
|
19117
|
+
console.warn(this.options("history") ? "History Undo Error - No more history to undo" : "History module not enabled");
|
|
18896
19118
|
return false;
|
|
18897
19119
|
}
|
|
18898
19120
|
}
|
|
@@ -18910,7 +19132,7 @@
|
|
|
18910
19132
|
|
|
18911
19133
|
return true;
|
|
18912
19134
|
}else {
|
|
18913
|
-
console.warn("History Redo Error - No more history to redo");
|
|
19135
|
+
console.warn(this.options("history") ? "History Redo Error - No more history to redo" : "History module not enabled");
|
|
18914
19136
|
return false;
|
|
18915
19137
|
}
|
|
18916
19138
|
}
|
|
@@ -19727,6 +19949,8 @@
|
|
|
19727
19949
|
navNext:9,
|
|
19728
19950
|
navUp:38,
|
|
19729
19951
|
navDown:40,
|
|
19952
|
+
navLeft:37,
|
|
19953
|
+
navRight:39,
|
|
19730
19954
|
scrollPageUp:33,
|
|
19731
19955
|
scrollPageDown:34,
|
|
19732
19956
|
scrollToStart:36,
|
|
@@ -19734,6 +19958,19 @@
|
|
|
19734
19958
|
undo:["ctrl + 90", "meta + 90"],
|
|
19735
19959
|
redo:["ctrl + 89", "meta + 89"],
|
|
19736
19960
|
copyToClipboard:["ctrl + 67", "meta + 67"],
|
|
19961
|
+
|
|
19962
|
+
rangeJumpUp:["ctrl + 38", "meta + 38"],
|
|
19963
|
+
rangeJumpDown:["ctrl + 40", "meta + 40"],
|
|
19964
|
+
rangeJumpLeft:["ctrl + 37", "meta + 37"],
|
|
19965
|
+
rangeJumpRight:["ctrl + 39", "meta + 39"],
|
|
19966
|
+
rangeExpandUp:"shift + 38",
|
|
19967
|
+
rangeExpandDown:"shift + 40",
|
|
19968
|
+
rangeExpandLeft:"shift + 37",
|
|
19969
|
+
rangeExpandRight:"shift + 39",
|
|
19970
|
+
rangeExpandJumpUp:["ctrl + shift + 38", "meta + shift + 38"],
|
|
19971
|
+
rangeExpandJumpDown:["ctrl + shift + 40", "meta + shift + 40"],
|
|
19972
|
+
rangeExpandJumpLeft:["ctrl + shift + 37", "meta + shift + 37"],
|
|
19973
|
+
rangeExpandJumpRight:["ctrl + shift + 39", "meta + shift + 39"],
|
|
19737
19974
|
};
|
|
19738
19975
|
|
|
19739
19976
|
var defaultActions = {
|
|
@@ -19821,6 +20058,43 @@
|
|
|
19821
20058
|
this.dispatch("keybinding-nav-down", e);
|
|
19822
20059
|
},
|
|
19823
20060
|
|
|
20061
|
+
rangeJumpLeft: function(e){
|
|
20062
|
+
this.dispatch("keybinding-nav-range", e, "left", true, false);
|
|
20063
|
+
},
|
|
20064
|
+
rangeJumpRight: function(e){
|
|
20065
|
+
this.dispatch("keybinding-nav-range", e, "right", true, false);
|
|
20066
|
+
},
|
|
20067
|
+
rangeJumpUp: function(e){
|
|
20068
|
+
this.dispatch("keybinding-nav-range", e, "up", true, false);
|
|
20069
|
+
},
|
|
20070
|
+
rangeJumpDown: function(e){
|
|
20071
|
+
this.dispatch("keybinding-nav-range", e, "down", true, false);
|
|
20072
|
+
},
|
|
20073
|
+
rangeExpandLeft: function(e){
|
|
20074
|
+
this.dispatch("keybinding-nav-range", e, "left", false, true);
|
|
20075
|
+
},
|
|
20076
|
+
rangeExpandRight: function(e){
|
|
20077
|
+
this.dispatch("keybinding-nav-range", e, "right", false, true);
|
|
20078
|
+
},
|
|
20079
|
+
rangeExpandUp: function(e){
|
|
20080
|
+
this.dispatch("keybinding-nav-range", e, "up", false, true);
|
|
20081
|
+
},
|
|
20082
|
+
rangeExpandDown: function(e){
|
|
20083
|
+
this.dispatch("keybinding-nav-range", e, "down", false, true);
|
|
20084
|
+
},
|
|
20085
|
+
rangeExpandJumpLeft: function(e){
|
|
20086
|
+
this.dispatch("keybinding-nav-range", e, "left", true, true);
|
|
20087
|
+
},
|
|
20088
|
+
rangeExpandJumpRight: function(e){
|
|
20089
|
+
this.dispatch("keybinding-nav-range", e, "right", true, true);
|
|
20090
|
+
},
|
|
20091
|
+
rangeExpandJumpUp: function(e){
|
|
20092
|
+
this.dispatch("keybinding-nav-range", e, "up", true, true);
|
|
20093
|
+
},
|
|
20094
|
+
rangeExpandJumpDown: function(e){
|
|
20095
|
+
this.dispatch("keybinding-nav-range", e, "down", true, true);
|
|
20096
|
+
},
|
|
20097
|
+
|
|
19824
20098
|
undo:function(e){
|
|
19825
20099
|
var cell = false;
|
|
19826
20100
|
if(this.table.options.history && this.table.modExists("history") && this.table.modExists("edit")){
|
|
@@ -20099,7 +20373,7 @@
|
|
|
20099
20373
|
this.subscribe("group-dblclick", this.loadMenuEvent.bind(this, this.table.options.groupDblClickMenu));
|
|
20100
20374
|
}
|
|
20101
20375
|
}
|
|
20102
|
-
|
|
20376
|
+
|
|
20103
20377
|
initializeColumn(column){
|
|
20104
20378
|
var def = column.definition;
|
|
20105
20379
|
|
|
@@ -20308,6 +20582,7 @@
|
|
|
20308
20582
|
this.rootPopup = null;
|
|
20309
20583
|
|
|
20310
20584
|
if(this.currentComponent){
|
|
20585
|
+
this.dispatch("menu-closed", menu, popup);
|
|
20311
20586
|
this.dispatchExternal("menuClosed", this.currentComponent.getComponent());
|
|
20312
20587
|
this.currentComponent = null;
|
|
20313
20588
|
}
|
|
@@ -20315,6 +20590,7 @@
|
|
|
20315
20590
|
|
|
20316
20591
|
this.currentComponent = component;
|
|
20317
20592
|
|
|
20593
|
+
this.dispatch("menu-opened", menu, popup);
|
|
20318
20594
|
this.dispatchExternal("menuOpened", component.getComponent());
|
|
20319
20595
|
}
|
|
20320
20596
|
}
|
|
@@ -20358,8 +20634,13 @@
|
|
|
20358
20634
|
initialize(){
|
|
20359
20635
|
if(this.table.options.movableColumns){
|
|
20360
20636
|
this.subscribe("column-init", this.initializeColumn.bind(this));
|
|
20637
|
+
this.subscribe("alert-show", this.abortMove.bind(this));
|
|
20361
20638
|
}
|
|
20362
20639
|
}
|
|
20640
|
+
|
|
20641
|
+
abortMove(){
|
|
20642
|
+
clearTimeout(this.checkTimeout);
|
|
20643
|
+
}
|
|
20363
20644
|
|
|
20364
20645
|
initializeColumn(column){
|
|
20365
20646
|
var self = this,
|
|
@@ -22945,7 +23226,7 @@
|
|
|
22945
23226
|
this.subscribe("group-dblclick", this.loadPopupEvent.bind(this, this.table.options.groupDblClickPopup));
|
|
22946
23227
|
}
|
|
22947
23228
|
}
|
|
22948
|
-
|
|
23229
|
+
|
|
22949
23230
|
initializeColumn(column){
|
|
22950
23231
|
var def = column.definition;
|
|
22951
23232
|
|
|
@@ -24102,7 +24383,7 @@
|
|
|
24102
24383
|
this.autoResize = true;
|
|
24103
24384
|
|
|
24104
24385
|
this.resizeObserver = new ResizeObserver((entry) => {
|
|
24105
|
-
if(!table.browserMobile || (table.browserMobile
|
|
24386
|
+
if(!table.browserMobile || (table.browserMobile && (!table.modules.edit || (table.modules.edit && !table.modules.edit.currentCell)))){
|
|
24106
24387
|
|
|
24107
24388
|
var nodeHeight = Math.floor(entry[0].contentRect.height);
|
|
24108
24389
|
var nodeWidth = Math.floor(entry[0].contentRect.width);
|
|
@@ -24128,7 +24409,7 @@
|
|
|
24128
24409
|
if(this.table.element.parentNode && !this.table.rowManager.fixedHeight && (tableStyle.getPropertyValue("max-height") || tableStyle.getPropertyValue("min-height"))){
|
|
24129
24410
|
|
|
24130
24411
|
this.containerObserver = new ResizeObserver((entry) => {
|
|
24131
|
-
if(!table.browserMobile || (table.browserMobile
|
|
24412
|
+
if(!table.browserMobile || (table.browserMobile && (!table.modules.edit || (table.modules.edit && !table.modules.edit.currentCell)))){
|
|
24132
24413
|
|
|
24133
24414
|
var nodeHeight = Math.floor(entry[0].contentRect.height);
|
|
24134
24415
|
var nodeWidth = Math.floor(entry[0].contentRect.width);
|
|
@@ -24151,7 +24432,7 @@
|
|
|
24151
24432
|
|
|
24152
24433
|
}else {
|
|
24153
24434
|
this.binding = function(){
|
|
24154
|
-
if(!table.browserMobile || (table.browserMobile && !table.modules.edit.currentCell)){
|
|
24435
|
+
if(!table.browserMobile || (table.browserMobile && (!table.modules.edit || (table.modules.edit && !table.modules.edit.currentCell)))){
|
|
24155
24436
|
table.columnManager.rerenderColumns(true);
|
|
24156
24437
|
table.redraw();
|
|
24157
24438
|
}
|
|
@@ -24570,11 +24851,11 @@
|
|
|
24570
24851
|
this.selectedRows = []; //hold selected rows
|
|
24571
24852
|
this.headerCheckboxElement = null; // hold header select element
|
|
24572
24853
|
|
|
24573
|
-
this.registerTableOption("
|
|
24574
|
-
this.registerTableOption("
|
|
24575
|
-
this.registerTableOption("
|
|
24576
|
-
this.registerTableOption("
|
|
24577
|
-
this.registerTableOption("
|
|
24854
|
+
this.registerTableOption("selectableRows", "highlight"); //highlight rows on hover
|
|
24855
|
+
this.registerTableOption("selectableRowsRangeMode", "drag"); //highlight rows on hover
|
|
24856
|
+
this.registerTableOption("selectableRowsRollingSelection", true); //roll selection once maximum number of selectable rows is reached
|
|
24857
|
+
this.registerTableOption("selectableRowsPersistence", true); // maintain selection when table view is updated
|
|
24858
|
+
this.registerTableOption("selectableRowsCheck", function(data, row){return true;}); //check whether row is selectable
|
|
24578
24859
|
|
|
24579
24860
|
this.registerTableFunction("selectRow", this.selectRows.bind(this));
|
|
24580
24861
|
this.registerTableFunction("deselectRow", this.deselectRows.bind(this));
|
|
@@ -24590,17 +24871,32 @@
|
|
|
24590
24871
|
}
|
|
24591
24872
|
|
|
24592
24873
|
initialize(){
|
|
24593
|
-
|
|
24874
|
+
|
|
24875
|
+
this.deprecatedOptionsCheck();
|
|
24876
|
+
|
|
24877
|
+
if(this.table.options.selectableRows === "highlight" && this.table.options.selectableRange){
|
|
24878
|
+
this.table.options.selectableRows = false;
|
|
24879
|
+
}
|
|
24880
|
+
|
|
24881
|
+
if(this.table.options.selectableRows !== false){
|
|
24594
24882
|
this.subscribe("row-init", this.initializeRow.bind(this));
|
|
24595
24883
|
this.subscribe("row-deleting", this.rowDeleted.bind(this));
|
|
24596
24884
|
this.subscribe("rows-wipe", this.clearSelectionData.bind(this));
|
|
24597
24885
|
this.subscribe("rows-retrieve", this.rowRetrieve.bind(this));
|
|
24598
24886
|
|
|
24599
|
-
if(this.table.options.
|
|
24887
|
+
if(this.table.options.selectableRows && !this.table.options.selectableRowsPersistence){
|
|
24600
24888
|
this.subscribe("data-refreshing", this.deselectRows.bind(this));
|
|
24601
24889
|
}
|
|
24602
24890
|
}
|
|
24603
24891
|
}
|
|
24892
|
+
|
|
24893
|
+
deprecatedOptionsCheck(){
|
|
24894
|
+
this.deprecationCheck("selectable", "selectableRows", true);
|
|
24895
|
+
this.deprecationCheck("selectableRollingSelection", "selectableRowsRollingSelection", true);
|
|
24896
|
+
this.deprecationCheck("selectableRangeMode", "selectableRowsRangeMode", true);
|
|
24897
|
+
this.deprecationCheck("selectablePersistence", "selectableRowsPersistence", true);
|
|
24898
|
+
this.deprecationCheck("selectableCheck", "selectableRowsCheck", true);
|
|
24899
|
+
}
|
|
24604
24900
|
|
|
24605
24901
|
rowRetrieve(type, prevValue){
|
|
24606
24902
|
return type === "selected" ? this.selectedRows : prevValue;
|
|
@@ -24625,6 +24921,7 @@
|
|
|
24625
24921
|
|
|
24626
24922
|
initializeRow(row){
|
|
24627
24923
|
var self = this,
|
|
24924
|
+
selectable = self.checkRowSelectability(row),
|
|
24628
24925
|
element = row.getElement();
|
|
24629
24926
|
|
|
24630
24927
|
// trigger end of row selection
|
|
@@ -24638,14 +24935,14 @@
|
|
|
24638
24935
|
};
|
|
24639
24936
|
|
|
24640
24937
|
row.modules.select = {selected:false};
|
|
24938
|
+
|
|
24939
|
+
element.classList.toggle("tabulator-selectable", selectable);
|
|
24940
|
+
element.classList.toggle("tabulator-unselectable", !selectable);
|
|
24641
24941
|
|
|
24642
24942
|
//set row selection class
|
|
24643
|
-
if(self.checkRowSelectability(row)){
|
|
24644
|
-
|
|
24645
|
-
|
|
24646
|
-
|
|
24647
|
-
if(self.table.options.selectable && self.table.options.selectable != "highlight"){
|
|
24648
|
-
if(self.table.options.selectableRangeMode === "click"){
|
|
24943
|
+
if(self.checkRowSelectability(row)){
|
|
24944
|
+
if(self.table.options.selectableRows && self.table.options.selectableRows != "highlight"){
|
|
24945
|
+
if(self.table.options.selectableRowsRangeMode === "click"){
|
|
24649
24946
|
element.addEventListener("click", this.handleComplexRowClick.bind(this, row));
|
|
24650
24947
|
}else {
|
|
24651
24948
|
element.addEventListener("click", function(e){
|
|
@@ -24694,10 +24991,6 @@
|
|
|
24694
24991
|
});
|
|
24695
24992
|
}
|
|
24696
24993
|
}
|
|
24697
|
-
|
|
24698
|
-
}else {
|
|
24699
|
-
element.classList.add("tabulator-unselectable");
|
|
24700
|
-
element.classList.remove("tabulator-selectable");
|
|
24701
24994
|
}
|
|
24702
24995
|
}
|
|
24703
24996
|
|
|
@@ -24719,8 +25012,8 @@
|
|
|
24719
25012
|
toggledRows.forEach((toggledRow)=>{
|
|
24720
25013
|
if(toggledRow !== this.lastClickedRow){
|
|
24721
25014
|
|
|
24722
|
-
if(this.table.options.
|
|
24723
|
-
if(this.selectedRows.length < this.table.options.
|
|
25015
|
+
if(this.table.options.selectableRows !== true && !this.isRowSelected(row)){
|
|
25016
|
+
if(this.selectedRows.length < this.table.options.selectableRows){
|
|
24724
25017
|
this.toggleRow(toggledRow);
|
|
24725
25018
|
}
|
|
24726
25019
|
}else {
|
|
@@ -24732,9 +25025,9 @@
|
|
|
24732
25025
|
}else {
|
|
24733
25026
|
this.deselectRows(undefined, true);
|
|
24734
25027
|
|
|
24735
|
-
if(this.table.options.
|
|
24736
|
-
if(toggledRows.length > this.table.options.
|
|
24737
|
-
toggledRows = toggledRows.slice(0, this.table.options.
|
|
25028
|
+
if(this.table.options.selectableRows !== true){
|
|
25029
|
+
if(toggledRows.length > this.table.options.selectableRows){
|
|
25030
|
+
toggledRows = toggledRows.slice(0, this.table.options.selectableRows);
|
|
24738
25031
|
}
|
|
24739
25032
|
}
|
|
24740
25033
|
|
|
@@ -24754,7 +25047,7 @@
|
|
|
24754
25047
|
|
|
24755
25048
|
checkRowSelectability(row){
|
|
24756
25049
|
if(row && row.type === "row"){
|
|
24757
|
-
return this.table.options.
|
|
25050
|
+
return this.table.options.selectableRowsCheck.call(this.table, row.getComponent());
|
|
24758
25051
|
}
|
|
24759
25052
|
|
|
24760
25053
|
return false;
|
|
@@ -24781,6 +25074,10 @@
|
|
|
24781
25074
|
rowMatch = this.table.rowManager.rows;
|
|
24782
25075
|
break;
|
|
24783
25076
|
|
|
25077
|
+
case "number":
|
|
25078
|
+
rowMatch = this.table.rowManager.findRow(rows);
|
|
25079
|
+
break;
|
|
25080
|
+
|
|
24784
25081
|
case "string":
|
|
24785
25082
|
rowMatch = this.table.rowManager.findRow(rows);
|
|
24786
25083
|
|
|
@@ -24816,9 +25113,9 @@
|
|
|
24816
25113
|
//select an individual row
|
|
24817
25114
|
_selectRow(rowInfo, silent, force){
|
|
24818
25115
|
//handle max row count
|
|
24819
|
-
if(!isNaN(this.table.options.
|
|
24820
|
-
if(this.selectedRows.length >= this.table.options.
|
|
24821
|
-
if(this.table.options.
|
|
25116
|
+
if(!isNaN(this.table.options.selectableRows) && this.table.options.selectableRows !== true && !force){
|
|
25117
|
+
if(this.selectedRows.length >= this.table.options.selectableRows){
|
|
25118
|
+
if(this.table.options.selectableRowsRollingSelection){
|
|
24822
25119
|
this._deselectRow(this.selectedRows[0]);
|
|
24823
25120
|
}else {
|
|
24824
25121
|
return false;
|
|
@@ -24872,6 +25169,10 @@
|
|
|
24872
25169
|
case "undefined":
|
|
24873
25170
|
rowMatch = Object.assign([], this.selectedRows);
|
|
24874
25171
|
break;
|
|
25172
|
+
|
|
25173
|
+
case "number":
|
|
25174
|
+
rowMatch = this.table.rowManager.findRow(rows);
|
|
25175
|
+
break;
|
|
24875
25176
|
|
|
24876
25177
|
case "string":
|
|
24877
25178
|
rowMatch = this.table.rowManager.findRow(rows);
|
|
@@ -25299,90 +25600,90 @@
|
|
|
25299
25600
|
};
|
|
25300
25601
|
|
|
25301
25602
|
class Sort extends Module{
|
|
25302
|
-
|
|
25603
|
+
|
|
25303
25604
|
constructor(table){
|
|
25304
25605
|
super(table);
|
|
25305
|
-
|
|
25606
|
+
|
|
25306
25607
|
this.sortList = []; //holder current sort
|
|
25307
25608
|
this.changed = false; //has the sort changed since last render
|
|
25308
|
-
|
|
25609
|
+
|
|
25309
25610
|
this.registerTableOption("sortMode", "local"); //local or remote sorting
|
|
25310
|
-
|
|
25611
|
+
|
|
25311
25612
|
this.registerTableOption("initialSort", false); //initial sorting criteria
|
|
25312
25613
|
this.registerTableOption("columnHeaderSortMulti", true); //multiple or single column sorting
|
|
25313
25614
|
this.registerTableOption("sortOrderReverse", false); //reverse internal sort ordering
|
|
25314
25615
|
this.registerTableOption("headerSortElement", "<div class='tabulator-arrow'></div>"); //header sort element
|
|
25315
25616
|
this.registerTableOption("headerSortClickElement", "header"); //element which triggers sort when clicked
|
|
25316
|
-
|
|
25617
|
+
|
|
25317
25618
|
this.registerColumnOption("sorter");
|
|
25318
25619
|
this.registerColumnOption("sorterParams");
|
|
25319
|
-
|
|
25620
|
+
|
|
25320
25621
|
this.registerColumnOption("headerSort", true);
|
|
25321
25622
|
this.registerColumnOption("headerSortStartingDir");
|
|
25322
25623
|
this.registerColumnOption("headerSortTristate");
|
|
25323
|
-
|
|
25624
|
+
|
|
25324
25625
|
}
|
|
25325
|
-
|
|
25626
|
+
|
|
25326
25627
|
initialize(){
|
|
25327
25628
|
this.subscribe("column-layout", this.initializeColumn.bind(this));
|
|
25328
25629
|
this.subscribe("table-built", this.tableBuilt.bind(this));
|
|
25329
25630
|
this.registerDataHandler(this.sort.bind(this), 20);
|
|
25330
|
-
|
|
25631
|
+
|
|
25331
25632
|
this.registerTableFunction("setSort", this.userSetSort.bind(this));
|
|
25332
25633
|
this.registerTableFunction("getSorters", this.getSort.bind(this));
|
|
25333
25634
|
this.registerTableFunction("clearSort", this.clearSort.bind(this));
|
|
25334
|
-
|
|
25635
|
+
|
|
25335
25636
|
if(this.table.options.sortMode === "remote"){
|
|
25336
25637
|
this.subscribe("data-params", this.remoteSortParams.bind(this));
|
|
25337
25638
|
}
|
|
25338
25639
|
}
|
|
25339
|
-
|
|
25640
|
+
|
|
25340
25641
|
tableBuilt(){
|
|
25341
25642
|
if(this.table.options.initialSort){
|
|
25342
25643
|
this.setSort(this.table.options.initialSort);
|
|
25343
25644
|
}
|
|
25344
25645
|
}
|
|
25345
|
-
|
|
25646
|
+
|
|
25346
25647
|
remoteSortParams(data, config, silent, params){
|
|
25347
25648
|
var sorters = this.getSort();
|
|
25348
|
-
|
|
25649
|
+
|
|
25349
25650
|
sorters.forEach((item) => {
|
|
25350
25651
|
delete item.column;
|
|
25351
25652
|
});
|
|
25352
|
-
|
|
25653
|
+
|
|
25353
25654
|
params.sort = sorters;
|
|
25354
|
-
|
|
25655
|
+
|
|
25355
25656
|
return params;
|
|
25356
25657
|
}
|
|
25357
|
-
|
|
25358
|
-
|
|
25658
|
+
|
|
25659
|
+
|
|
25359
25660
|
///////////////////////////////////
|
|
25360
25661
|
///////// Table Functions /////////
|
|
25361
25662
|
///////////////////////////////////
|
|
25362
|
-
|
|
25663
|
+
|
|
25363
25664
|
userSetSort(sortList, dir){
|
|
25364
25665
|
this.setSort(sortList, dir);
|
|
25365
25666
|
// this.table.rowManager.sorterRefresh();
|
|
25366
25667
|
this.refreshSort();
|
|
25367
25668
|
}
|
|
25368
|
-
|
|
25669
|
+
|
|
25369
25670
|
clearSort(){
|
|
25370
25671
|
this.clear();
|
|
25371
25672
|
// this.table.rowManager.sorterRefresh();
|
|
25372
25673
|
this.refreshSort();
|
|
25373
25674
|
}
|
|
25374
|
-
|
|
25375
|
-
|
|
25675
|
+
|
|
25676
|
+
|
|
25376
25677
|
///////////////////////////////////
|
|
25377
25678
|
///////// Internal Logic //////////
|
|
25378
25679
|
///////////////////////////////////
|
|
25379
|
-
|
|
25680
|
+
|
|
25380
25681
|
//initialize column header for sorting
|
|
25381
25682
|
initializeColumn(column){
|
|
25382
25683
|
var sorter = false,
|
|
25383
25684
|
colEl,
|
|
25384
25685
|
arrowEl;
|
|
25385
|
-
|
|
25686
|
+
|
|
25386
25687
|
switch(typeof column.definition.sorter){
|
|
25387
25688
|
case "string":
|
|
25388
25689
|
if(Sort.sorters[column.definition.sorter]){
|
|
@@ -25391,28 +25692,28 @@
|
|
|
25391
25692
|
console.warn("Sort Error - No such sorter found: ", column.definition.sorter);
|
|
25392
25693
|
}
|
|
25393
25694
|
break;
|
|
25394
|
-
|
|
25695
|
+
|
|
25395
25696
|
case "function":
|
|
25396
25697
|
sorter = column.definition.sorter;
|
|
25397
25698
|
break;
|
|
25398
25699
|
}
|
|
25399
|
-
|
|
25700
|
+
|
|
25400
25701
|
column.modules.sort = {
|
|
25401
25702
|
sorter:sorter, dir:"none",
|
|
25402
25703
|
params:column.definition.sorterParams || {},
|
|
25403
25704
|
startingDir:column.definition.headerSortStartingDir || "asc",
|
|
25404
25705
|
tristate: column.definition.headerSortTristate,
|
|
25405
25706
|
};
|
|
25406
|
-
|
|
25707
|
+
|
|
25407
25708
|
if(column.definition.headerSort !== false){
|
|
25408
|
-
|
|
25709
|
+
|
|
25409
25710
|
colEl = column.getElement();
|
|
25410
|
-
|
|
25711
|
+
|
|
25411
25712
|
colEl.classList.add("tabulator-sortable");
|
|
25412
|
-
|
|
25713
|
+
|
|
25413
25714
|
arrowEl = document.createElement("div");
|
|
25414
25715
|
arrowEl.classList.add("tabulator-col-sorter");
|
|
25415
|
-
|
|
25716
|
+
|
|
25416
25717
|
switch(this.table.options.headerSortClickElement){
|
|
25417
25718
|
case "icon":
|
|
25418
25719
|
arrowEl.classList.add("tabulator-col-sorter-element");
|
|
@@ -25424,33 +25725,39 @@
|
|
|
25424
25725
|
colEl.classList.add("tabulator-col-sorter-element");
|
|
25425
25726
|
break;
|
|
25426
25727
|
}
|
|
25427
|
-
|
|
25728
|
+
|
|
25428
25729
|
switch(this.table.options.headerSortElement){
|
|
25429
25730
|
case "function":
|
|
25430
|
-
|
|
25731
|
+
//do nothing
|
|
25431
25732
|
break;
|
|
25432
|
-
|
|
25733
|
+
|
|
25433
25734
|
case "object":
|
|
25434
25735
|
arrowEl.appendChild(this.table.options.headerSortElement);
|
|
25435
25736
|
break;
|
|
25436
|
-
|
|
25737
|
+
|
|
25437
25738
|
default:
|
|
25438
25739
|
arrowEl.innerHTML = this.table.options.headerSortElement;
|
|
25439
25740
|
}
|
|
25440
|
-
|
|
25741
|
+
|
|
25441
25742
|
//create sorter arrow
|
|
25442
25743
|
column.titleHolderElement.appendChild(arrowEl);
|
|
25443
|
-
|
|
25744
|
+
|
|
25444
25745
|
column.modules.sort.element = arrowEl;
|
|
25445
|
-
|
|
25746
|
+
|
|
25446
25747
|
this.setColumnHeaderSortIcon(column, "none");
|
|
25447
|
-
|
|
25748
|
+
|
|
25749
|
+
if(this.table.options.headerSortClickElement === "icon"){
|
|
25750
|
+
arrowEl.addEventListener("mousedown", (e) => {
|
|
25751
|
+
e.stopPropagation();
|
|
25752
|
+
});
|
|
25753
|
+
}
|
|
25754
|
+
|
|
25448
25755
|
//sort on click
|
|
25449
25756
|
(this.table.options.headerSortClickElement === "icon" ? arrowEl : colEl).addEventListener("click", (e) => {
|
|
25450
25757
|
var dir = "",
|
|
25451
25758
|
sorters=[],
|
|
25452
25759
|
match = false;
|
|
25453
|
-
|
|
25760
|
+
|
|
25454
25761
|
if(column.modules.sort){
|
|
25455
25762
|
if(column.modules.sort.tristate){
|
|
25456
25763
|
if(column.modules.sort.dir == "none"){
|
|
@@ -25467,26 +25774,26 @@
|
|
|
25467
25774
|
case "asc":
|
|
25468
25775
|
dir = "desc";
|
|
25469
25776
|
break;
|
|
25470
|
-
|
|
25777
|
+
|
|
25471
25778
|
case "desc":
|
|
25472
25779
|
dir = "asc";
|
|
25473
25780
|
break;
|
|
25474
|
-
|
|
25781
|
+
|
|
25475
25782
|
default:
|
|
25476
25783
|
dir = column.modules.sort.startingDir;
|
|
25477
25784
|
}
|
|
25478
25785
|
}
|
|
25479
|
-
|
|
25786
|
+
|
|
25480
25787
|
if (this.table.options.columnHeaderSortMulti && (e.shiftKey || e.ctrlKey)) {
|
|
25481
25788
|
sorters = this.getSort();
|
|
25482
|
-
|
|
25789
|
+
|
|
25483
25790
|
match = sorters.findIndex((sorter) => {
|
|
25484
25791
|
return sorter.field === column.getField();
|
|
25485
25792
|
});
|
|
25486
|
-
|
|
25793
|
+
|
|
25487
25794
|
if(match > -1){
|
|
25488
25795
|
sorters[match].dir = dir;
|
|
25489
|
-
|
|
25796
|
+
|
|
25490
25797
|
match = sorters.splice(match, 1)[0];
|
|
25491
25798
|
if(dir != "none"){
|
|
25492
25799
|
sorters.push(match);
|
|
@@ -25496,7 +25803,7 @@
|
|
|
25496
25803
|
sorters.push({column:column, dir:dir});
|
|
25497
25804
|
}
|
|
25498
25805
|
}
|
|
25499
|
-
|
|
25806
|
+
|
|
25500
25807
|
//add to existing sort
|
|
25501
25808
|
this.setSort(sorters);
|
|
25502
25809
|
}else {
|
|
@@ -25506,63 +25813,63 @@
|
|
|
25506
25813
|
//sort by column only
|
|
25507
25814
|
this.setSort(column, dir);
|
|
25508
25815
|
}
|
|
25509
|
-
|
|
25816
|
+
|
|
25510
25817
|
}
|
|
25511
|
-
|
|
25818
|
+
|
|
25512
25819
|
// this.table.rowManager.sorterRefresh(!this.sortList.length);
|
|
25513
25820
|
this.refreshSort();
|
|
25514
25821
|
}
|
|
25515
25822
|
});
|
|
25516
25823
|
}
|
|
25517
25824
|
}
|
|
25518
|
-
|
|
25825
|
+
|
|
25519
25826
|
refreshSort(){
|
|
25520
25827
|
if(this.table.options.sortMode === "remote"){
|
|
25521
25828
|
this.reloadData(null, false, false);
|
|
25522
25829
|
}else {
|
|
25523
25830
|
this.refreshData(true);
|
|
25524
25831
|
}
|
|
25525
|
-
|
|
25832
|
+
|
|
25526
25833
|
//TODO - Persist left position of row manager
|
|
25527
25834
|
// left = this.scrollLeft;
|
|
25528
25835
|
// this.scrollHorizontal(left);
|
|
25529
25836
|
}
|
|
25530
|
-
|
|
25837
|
+
|
|
25531
25838
|
//check if the sorters have changed since last use
|
|
25532
25839
|
hasChanged(){
|
|
25533
25840
|
var changed = this.changed;
|
|
25534
25841
|
this.changed = false;
|
|
25535
25842
|
return changed;
|
|
25536
25843
|
}
|
|
25537
|
-
|
|
25844
|
+
|
|
25538
25845
|
//return current sorters
|
|
25539
25846
|
getSort(){
|
|
25540
25847
|
var self = this,
|
|
25541
25848
|
sorters = [];
|
|
25542
|
-
|
|
25849
|
+
|
|
25543
25850
|
self.sortList.forEach(function(item){
|
|
25544
25851
|
if(item.column){
|
|
25545
25852
|
sorters.push({column:item.column.getComponent(), field:item.column.getField(), dir:item.dir});
|
|
25546
25853
|
}
|
|
25547
25854
|
});
|
|
25548
|
-
|
|
25855
|
+
|
|
25549
25856
|
return sorters;
|
|
25550
25857
|
}
|
|
25551
|
-
|
|
25858
|
+
|
|
25552
25859
|
//change sort list and trigger sort
|
|
25553
25860
|
setSort(sortList, dir){
|
|
25554
25861
|
var self = this,
|
|
25555
25862
|
newSortList = [];
|
|
25556
|
-
|
|
25863
|
+
|
|
25557
25864
|
if(!Array.isArray(sortList)){
|
|
25558
25865
|
sortList = [{column: sortList, dir:dir}];
|
|
25559
25866
|
}
|
|
25560
|
-
|
|
25867
|
+
|
|
25561
25868
|
sortList.forEach(function(item){
|
|
25562
25869
|
var column;
|
|
25563
|
-
|
|
25870
|
+
|
|
25564
25871
|
column = self.table.columnManager.findColumn(item.column);
|
|
25565
|
-
|
|
25872
|
+
|
|
25566
25873
|
if(column){
|
|
25567
25874
|
item.column = column;
|
|
25568
25875
|
newSortList.push(item);
|
|
@@ -25570,42 +25877,42 @@
|
|
|
25570
25877
|
}else {
|
|
25571
25878
|
console.warn("Sort Warning - Sort field does not exist and is being ignored: ", item.column);
|
|
25572
25879
|
}
|
|
25573
|
-
|
|
25880
|
+
|
|
25574
25881
|
});
|
|
25575
|
-
|
|
25882
|
+
|
|
25576
25883
|
self.sortList = newSortList;
|
|
25577
|
-
|
|
25884
|
+
|
|
25578
25885
|
this.dispatch("sort-changed");
|
|
25579
25886
|
}
|
|
25580
|
-
|
|
25887
|
+
|
|
25581
25888
|
//clear sorters
|
|
25582
25889
|
clear(){
|
|
25583
25890
|
this.setSort([]);
|
|
25584
25891
|
}
|
|
25585
|
-
|
|
25892
|
+
|
|
25586
25893
|
//find appropriate sorter for column
|
|
25587
25894
|
findSorter(column){
|
|
25588
25895
|
var row = this.table.rowManager.activeRows[0],
|
|
25589
25896
|
sorter = "string",
|
|
25590
25897
|
field, value;
|
|
25591
|
-
|
|
25898
|
+
|
|
25592
25899
|
if(row){
|
|
25593
25900
|
row = row.getData();
|
|
25594
25901
|
field = column.getField();
|
|
25595
|
-
|
|
25902
|
+
|
|
25596
25903
|
if(field){
|
|
25597
|
-
|
|
25904
|
+
|
|
25598
25905
|
value = column.getFieldValue(row);
|
|
25599
|
-
|
|
25906
|
+
|
|
25600
25907
|
switch(typeof value){
|
|
25601
25908
|
case "undefined":
|
|
25602
25909
|
sorter = "string";
|
|
25603
25910
|
break;
|
|
25604
|
-
|
|
25911
|
+
|
|
25605
25912
|
case "boolean":
|
|
25606
25913
|
sorter = "boolean";
|
|
25607
25914
|
break;
|
|
25608
|
-
|
|
25915
|
+
|
|
25609
25916
|
default:
|
|
25610
25917
|
if(!isNaN(value) && value !== ""){
|
|
25611
25918
|
sorter = "number";
|
|
@@ -25618,70 +25925,70 @@
|
|
|
25618
25925
|
}
|
|
25619
25926
|
}
|
|
25620
25927
|
}
|
|
25621
|
-
|
|
25928
|
+
|
|
25622
25929
|
return Sort.sorters[sorter];
|
|
25623
25930
|
}
|
|
25624
|
-
|
|
25931
|
+
|
|
25625
25932
|
//work through sort list sorting data
|
|
25626
25933
|
sort(data){
|
|
25627
25934
|
var self = this,
|
|
25628
25935
|
sortList = this.table.options.sortOrderReverse ? self.sortList.slice().reverse() : self.sortList,
|
|
25629
25936
|
sortListActual = [],
|
|
25630
25937
|
rowComponents = [];
|
|
25631
|
-
|
|
25938
|
+
|
|
25632
25939
|
if(this.subscribedExternal("dataSorting")){
|
|
25633
25940
|
this.dispatchExternal("dataSorting", self.getSort());
|
|
25634
25941
|
}
|
|
25635
|
-
|
|
25942
|
+
|
|
25636
25943
|
self.clearColumnHeaders();
|
|
25637
|
-
|
|
25944
|
+
|
|
25638
25945
|
if(this.table.options.sortMode !== "remote"){
|
|
25639
|
-
|
|
25946
|
+
|
|
25640
25947
|
//build list of valid sorters and trigger column specific callbacks before sort begins
|
|
25641
25948
|
sortList.forEach(function(item, i){
|
|
25642
25949
|
var sortObj;
|
|
25643
|
-
|
|
25950
|
+
|
|
25644
25951
|
if(item.column){
|
|
25645
25952
|
sortObj = item.column.modules.sort;
|
|
25646
|
-
|
|
25953
|
+
|
|
25647
25954
|
if(sortObj){
|
|
25648
|
-
|
|
25955
|
+
|
|
25649
25956
|
//if no sorter has been defined, take a guess
|
|
25650
25957
|
if(!sortObj.sorter){
|
|
25651
25958
|
sortObj.sorter = self.findSorter(item.column);
|
|
25652
25959
|
}
|
|
25653
|
-
|
|
25960
|
+
|
|
25654
25961
|
item.params = typeof sortObj.params === "function" ? sortObj.params(item.column.getComponent(), item.dir) : sortObj.params;
|
|
25655
|
-
|
|
25962
|
+
|
|
25656
25963
|
sortListActual.push(item);
|
|
25657
25964
|
}
|
|
25658
|
-
|
|
25965
|
+
|
|
25659
25966
|
self.setColumnHeader(item.column, item.dir);
|
|
25660
25967
|
}
|
|
25661
25968
|
});
|
|
25662
|
-
|
|
25969
|
+
|
|
25663
25970
|
//sort data
|
|
25664
25971
|
if (sortListActual.length) {
|
|
25665
25972
|
self._sortItems(data, sortListActual);
|
|
25666
25973
|
}
|
|
25667
|
-
|
|
25974
|
+
|
|
25668
25975
|
}else {
|
|
25669
25976
|
sortList.forEach(function(item, i){
|
|
25670
25977
|
self.setColumnHeader(item.column, item.dir);
|
|
25671
25978
|
});
|
|
25672
25979
|
}
|
|
25673
|
-
|
|
25980
|
+
|
|
25674
25981
|
if(this.subscribedExternal("dataSorted")){
|
|
25675
25982
|
data.forEach((row) => {
|
|
25676
25983
|
rowComponents.push(row.getComponent());
|
|
25677
25984
|
});
|
|
25678
|
-
|
|
25985
|
+
|
|
25679
25986
|
this.dispatchExternal("dataSorted", self.getSort(), rowComponents);
|
|
25680
25987
|
}
|
|
25681
|
-
|
|
25988
|
+
|
|
25682
25989
|
return data;
|
|
25683
25990
|
}
|
|
25684
|
-
|
|
25991
|
+
|
|
25685
25992
|
//clear sort arrows on columns
|
|
25686
25993
|
clearColumnHeaders(){
|
|
25687
25994
|
this.table.columnManager.getRealColumns().forEach((column) => {
|
|
@@ -25692,21 +25999,21 @@
|
|
|
25692
25999
|
}
|
|
25693
26000
|
});
|
|
25694
26001
|
}
|
|
25695
|
-
|
|
26002
|
+
|
|
25696
26003
|
//set the column header sort direction
|
|
25697
26004
|
setColumnHeader(column, dir){
|
|
25698
26005
|
column.modules.sort.dir = dir;
|
|
25699
26006
|
column.getElement().setAttribute("aria-sort", dir === "asc" ? "ascending" : "descending");
|
|
25700
26007
|
this.setColumnHeaderSortIcon(column, dir);
|
|
25701
26008
|
}
|
|
25702
|
-
|
|
26009
|
+
|
|
25703
26010
|
setColumnHeaderSortIcon(column, dir){
|
|
25704
26011
|
var sortEl = column.modules.sort.element,
|
|
25705
26012
|
arrowEl;
|
|
25706
|
-
|
|
26013
|
+
|
|
25707
26014
|
if(column.definition.headerSort && typeof this.table.options.headerSortElement === "function"){
|
|
25708
26015
|
while(sortEl.firstChild) sortEl.removeChild(sortEl.firstChild);
|
|
25709
|
-
|
|
26016
|
+
|
|
25710
26017
|
arrowEl = this.table.options.headerSortElement.call(this.table, column.getComponent(), dir);
|
|
25711
26018
|
|
|
25712
26019
|
if(typeof arrowEl === "object"){
|
|
@@ -25716,45 +26023,45 @@
|
|
|
25716
26023
|
}
|
|
25717
26024
|
}
|
|
25718
26025
|
}
|
|
25719
|
-
|
|
26026
|
+
|
|
25720
26027
|
//sort each item in sort list
|
|
25721
26028
|
_sortItems(data, sortList){
|
|
25722
26029
|
var sorterCount = sortList.length - 1;
|
|
25723
|
-
|
|
26030
|
+
|
|
25724
26031
|
data.sort((a, b) => {
|
|
25725
26032
|
var result;
|
|
25726
|
-
|
|
26033
|
+
|
|
25727
26034
|
for(var i = sorterCount; i>= 0; i--){
|
|
25728
26035
|
let sortItem = sortList[i];
|
|
25729
|
-
|
|
26036
|
+
|
|
25730
26037
|
result = this._sortRow(a, b, sortItem.column, sortItem.dir, sortItem.params);
|
|
25731
|
-
|
|
26038
|
+
|
|
25732
26039
|
if(result !== 0){
|
|
25733
26040
|
break;
|
|
25734
26041
|
}
|
|
25735
26042
|
}
|
|
25736
|
-
|
|
26043
|
+
|
|
25737
26044
|
return result;
|
|
25738
26045
|
});
|
|
25739
26046
|
}
|
|
25740
|
-
|
|
26047
|
+
|
|
25741
26048
|
//process individual rows for a sort function on active data
|
|
25742
26049
|
_sortRow(a, b, column, dir, params){
|
|
25743
26050
|
var el1Comp, el2Comp;
|
|
25744
|
-
|
|
26051
|
+
|
|
25745
26052
|
//switch elements depending on search direction
|
|
25746
26053
|
var el1 = dir == "asc" ? a : b;
|
|
25747
26054
|
var el2 = dir == "asc" ? b : a;
|
|
25748
|
-
|
|
26055
|
+
|
|
25749
26056
|
a = column.getFieldValue(el1.getData());
|
|
25750
26057
|
b = column.getFieldValue(el2.getData());
|
|
25751
|
-
|
|
26058
|
+
|
|
25752
26059
|
a = typeof a !== "undefined" ? a : "";
|
|
25753
26060
|
b = typeof b !== "undefined" ? b : "";
|
|
25754
|
-
|
|
26061
|
+
|
|
25755
26062
|
el1Comp = el1.getComponent();
|
|
25756
26063
|
el2Comp = el2.getComponent();
|
|
25757
|
-
|
|
26064
|
+
|
|
25758
26065
|
return column.modules.sort.sorter.call(this, a, b, el1Comp, el2Comp, column.getComponent(), dir, params);
|
|
25759
26066
|
}
|
|
25760
26067
|
}
|
|
@@ -25764,25 +26071,1329 @@
|
|
|
25764
26071
|
//load defaults
|
|
25765
26072
|
Sort.sorters = defaultSorters;
|
|
25766
26073
|
|
|
25767
|
-
class
|
|
26074
|
+
class RangeComponent {
|
|
26075
|
+
constructor(range) {
|
|
26076
|
+
this._range = range;
|
|
26077
|
+
|
|
26078
|
+
return new Proxy(this, {
|
|
26079
|
+
get: function (target, name, receiver) {
|
|
26080
|
+
if (typeof target[name] !== "undefined") {
|
|
26081
|
+
return target[name];
|
|
26082
|
+
} else {
|
|
26083
|
+
return target._range.table.componentFunctionBinder.handle("range", target._range, name);
|
|
26084
|
+
}
|
|
26085
|
+
},
|
|
26086
|
+
});
|
|
26087
|
+
}
|
|
26088
|
+
|
|
26089
|
+
getElement() {
|
|
26090
|
+
return this._range.element;
|
|
26091
|
+
}
|
|
26092
|
+
|
|
26093
|
+
getData() {
|
|
26094
|
+
return this._range.getData();
|
|
26095
|
+
}
|
|
26096
|
+
|
|
26097
|
+
getCells() {
|
|
26098
|
+
return this._range.getCells(true);
|
|
26099
|
+
}
|
|
26100
|
+
|
|
26101
|
+
getStructuredCells() {
|
|
26102
|
+
return this._range.getStructuredCells();
|
|
26103
|
+
}
|
|
26104
|
+
|
|
26105
|
+
getRows() {
|
|
26106
|
+
return this._range.getRows().map((row) => row.getComponent());
|
|
26107
|
+
}
|
|
26108
|
+
|
|
26109
|
+
getColumns() {
|
|
26110
|
+
return this._range.getColumns().map((column) => column.getComponent());
|
|
26111
|
+
}
|
|
25768
26112
|
|
|
25769
|
-
|
|
26113
|
+
getBounds() {
|
|
26114
|
+
return this._range.getBounds();
|
|
26115
|
+
}
|
|
26116
|
+
|
|
26117
|
+
getTopEdge() {
|
|
26118
|
+
return this._range.top;
|
|
26119
|
+
}
|
|
26120
|
+
|
|
26121
|
+
getBottomEdge() {
|
|
26122
|
+
return this._range.bottom;
|
|
26123
|
+
}
|
|
26124
|
+
|
|
26125
|
+
getLeftEdge() {
|
|
26126
|
+
return this._range.left;
|
|
26127
|
+
}
|
|
26128
|
+
|
|
26129
|
+
getRightEdge() {
|
|
26130
|
+
return this._range.right;
|
|
26131
|
+
}
|
|
26132
|
+
|
|
26133
|
+
setBounds(start, end){
|
|
26134
|
+
if(this._range.destroyedGuard("setBounds")){
|
|
26135
|
+
this._range.setBounds(start ? start._cell : start, end ? end._cell : end);
|
|
26136
|
+
}
|
|
26137
|
+
}
|
|
26138
|
+
|
|
26139
|
+
setStartBound(start){
|
|
26140
|
+
if(this._range.destroyedGuard("setStartBound")){
|
|
26141
|
+
this._range.setEndBound(start ? start._cell : start);
|
|
26142
|
+
this._range.rangeManager.layoutElement();
|
|
26143
|
+
}
|
|
26144
|
+
}
|
|
26145
|
+
|
|
26146
|
+
setEndBound(end){
|
|
26147
|
+
if(this._range.destroyedGuard("setEndBound")){
|
|
26148
|
+
this._range.setEndBound(end ? end._cell : end);
|
|
26149
|
+
this._range.rangeManager.layoutElement();
|
|
26150
|
+
}
|
|
26151
|
+
}
|
|
26152
|
+
|
|
26153
|
+
clearValues(){
|
|
26154
|
+
if(this._range.destroyedGuard("clearValues")){
|
|
26155
|
+
this._range.clearValues();
|
|
26156
|
+
}
|
|
26157
|
+
}
|
|
26158
|
+
|
|
26159
|
+
remove(){
|
|
26160
|
+
if(this._range.destroyedGuard("remove")){
|
|
26161
|
+
this._range.destroy(true);
|
|
26162
|
+
}
|
|
26163
|
+
}
|
|
26164
|
+
}
|
|
26165
|
+
|
|
26166
|
+
class Range extends CoreFeature{
|
|
26167
|
+
constructor(table, rangeManager, start, end) {
|
|
25770
26168
|
super(table);
|
|
25771
26169
|
|
|
25772
|
-
this.
|
|
25773
|
-
this.
|
|
26170
|
+
this.rangeManager = rangeManager;
|
|
26171
|
+
this.element = null;
|
|
26172
|
+
this.initialized = false;
|
|
26173
|
+
this.initializing = {
|
|
26174
|
+
start:false,
|
|
26175
|
+
end:false,
|
|
26176
|
+
};
|
|
26177
|
+
this.destroyed = false;
|
|
25774
26178
|
|
|
25775
|
-
this.
|
|
25776
|
-
this.
|
|
26179
|
+
this.top = 0;
|
|
26180
|
+
this.bottom = 0;
|
|
26181
|
+
this.left = 0;
|
|
26182
|
+
this.right = 0;
|
|
25777
26183
|
|
|
25778
|
-
this.
|
|
25779
|
-
this.
|
|
26184
|
+
this.table = table;
|
|
26185
|
+
this.start = {row:0, col:0};
|
|
26186
|
+
this.end = {row:0, col:0};
|
|
26187
|
+
|
|
26188
|
+
if(this.rangeManager.rowHeader){
|
|
26189
|
+
this.left = 1;
|
|
26190
|
+
this.right = 1;
|
|
26191
|
+
this.start.col = 1;
|
|
26192
|
+
this.end.col = 1;
|
|
26193
|
+
}
|
|
25780
26194
|
|
|
25781
|
-
this.
|
|
25782
|
-
|
|
26195
|
+
this.initElement();
|
|
26196
|
+
|
|
26197
|
+
setTimeout(() => {
|
|
26198
|
+
this.initBounds(start, end);
|
|
26199
|
+
});
|
|
25783
26200
|
}
|
|
25784
26201
|
|
|
25785
|
-
|
|
26202
|
+
initElement(){
|
|
26203
|
+
this.element = document.createElement("div");
|
|
26204
|
+
this.element.classList.add("tabulator-range");
|
|
26205
|
+
}
|
|
26206
|
+
|
|
26207
|
+
initBounds(start, end){
|
|
26208
|
+
this._updateMinMax();
|
|
26209
|
+
|
|
26210
|
+
if(start){
|
|
26211
|
+
this.setBounds(start, end || start);
|
|
26212
|
+
}
|
|
26213
|
+
}
|
|
26214
|
+
|
|
26215
|
+
///////////////////////////////////
|
|
26216
|
+
/////// Boundary Setup ///////
|
|
26217
|
+
///////////////////////////////////
|
|
26218
|
+
|
|
26219
|
+
setStart(row, col) {
|
|
26220
|
+
if(this.start.row !== row || this.start.col !== col){
|
|
26221
|
+
this.start.row = row;
|
|
26222
|
+
this.start.col = col;
|
|
26223
|
+
|
|
26224
|
+
this.initializing.start = true;
|
|
26225
|
+
this._updateMinMax();
|
|
26226
|
+
}
|
|
26227
|
+
}
|
|
26228
|
+
|
|
26229
|
+
setEnd(row, col) {
|
|
26230
|
+
if(this.end.row !== row || this.end.col !== col){
|
|
26231
|
+
this.end.row = row;
|
|
26232
|
+
this.end.col = col;
|
|
26233
|
+
|
|
26234
|
+
this.initializing.end = true;
|
|
26235
|
+
this._updateMinMax();
|
|
26236
|
+
}
|
|
26237
|
+
}
|
|
26238
|
+
|
|
26239
|
+
setBounds(start, end, visibleRows){
|
|
26240
|
+
if(start){
|
|
26241
|
+
this.setStartBound(start);
|
|
26242
|
+
}
|
|
26243
|
+
|
|
26244
|
+
this.setEndBound(end || start);
|
|
26245
|
+
this.rangeManager.layoutElement(visibleRows);
|
|
26246
|
+
}
|
|
26247
|
+
|
|
26248
|
+
setStartBound(element){
|
|
26249
|
+
var row, col;
|
|
26250
|
+
|
|
26251
|
+
if (element.type === "column") {
|
|
26252
|
+
if(this.rangeManager.columnSelection){
|
|
26253
|
+
this.setStart(0, element.getPosition() - 1);
|
|
26254
|
+
}
|
|
26255
|
+
}else {
|
|
26256
|
+
row = element.row.position - 1;
|
|
26257
|
+
col = element.column.getPosition() - 1;
|
|
26258
|
+
|
|
26259
|
+
if (element.column === this.rangeManager.rowHeader) {
|
|
26260
|
+
this.setStart(row, 1);
|
|
26261
|
+
} else {
|
|
26262
|
+
this.setStart(row, col);
|
|
26263
|
+
}
|
|
26264
|
+
}
|
|
26265
|
+
}
|
|
26266
|
+
|
|
26267
|
+
setEndBound(element){
|
|
26268
|
+
var rowsCount = this._getTableRows().length,
|
|
26269
|
+
row, col, isRowHeader;
|
|
26270
|
+
|
|
26271
|
+
if (element.type === "column") {
|
|
26272
|
+
if(this.rangeManager.columnSelection){
|
|
26273
|
+
if (this.rangeManager.selecting === "column") {
|
|
26274
|
+
this.setEnd(rowsCount - 1, element.getPosition() - 1);
|
|
26275
|
+
} else if (this.rangeManager.selecting === "cell") {
|
|
26276
|
+
this.setEnd(0, element.getPosition() - 1);
|
|
26277
|
+
}
|
|
26278
|
+
}
|
|
26279
|
+
}else {
|
|
26280
|
+
row = element.row.position - 1;
|
|
26281
|
+
col = element.column.getPosition() - 1;
|
|
26282
|
+
isRowHeader = element.column === this.rangeManager.rowHeader;
|
|
26283
|
+
|
|
26284
|
+
if (this.rangeManager.selecting === "row") {
|
|
26285
|
+
this.setEnd(row, this._getTableColumns().length - 1);
|
|
26286
|
+
} else if (this.rangeManager.selecting !== "row" && isRowHeader) {
|
|
26287
|
+
this.setEnd(row, 0);
|
|
26288
|
+
} else if (this.rangeManager.selecting === "column") {
|
|
26289
|
+
this.setEnd(rowsCount - 1, col);
|
|
26290
|
+
} else {
|
|
26291
|
+
this.setEnd(row, col);
|
|
26292
|
+
}
|
|
26293
|
+
}
|
|
26294
|
+
}
|
|
26295
|
+
|
|
26296
|
+
_updateMinMax() {
|
|
26297
|
+
this.top = Math.min(this.start.row, this.end.row);
|
|
26298
|
+
this.bottom = Math.max(this.start.row, this.end.row);
|
|
26299
|
+
this.left = Math.min(this.start.col, this.end.col);
|
|
26300
|
+
this.right = Math.max(this.start.col, this.end.col);
|
|
26301
|
+
|
|
26302
|
+
if(this.initialized){
|
|
26303
|
+
this.dispatchExternal("rangeChanged", this.getComponent());
|
|
26304
|
+
}else {
|
|
26305
|
+
if(this.initializing.start && this.initializing.end){
|
|
26306
|
+
this.initialized = true;
|
|
26307
|
+
this.dispatchExternal("rangeAdded", this.getComponent());
|
|
26308
|
+
}
|
|
26309
|
+
}
|
|
26310
|
+
}
|
|
26311
|
+
|
|
26312
|
+
_getTableColumns() {
|
|
26313
|
+
return this.table.columnManager.getVisibleColumnsByIndex();
|
|
26314
|
+
}
|
|
26315
|
+
|
|
26316
|
+
_getTableRows() {
|
|
26317
|
+
return this.table.rowManager.getDisplayRows();
|
|
26318
|
+
}
|
|
26319
|
+
|
|
26320
|
+
///////////////////////////////////
|
|
26321
|
+
/////// Rendering ///////
|
|
26322
|
+
///////////////////////////////////
|
|
26323
|
+
|
|
26324
|
+
layout() {
|
|
26325
|
+
var _vDomTop = this.table.rowManager.renderer.vDomTop,
|
|
26326
|
+
_vDomBottom = this.table.rowManager.renderer.vDomBottom,
|
|
26327
|
+
_vDomLeft = this.table.columnManager.renderer.leftCol,
|
|
26328
|
+
_vDomRight = this.table.columnManager.renderer.rightCol,
|
|
26329
|
+
top, bottom, left, right, topLeftCell, bottomRightCell;
|
|
26330
|
+
|
|
26331
|
+
if (_vDomTop == null) {
|
|
26332
|
+
_vDomTop = 0;
|
|
26333
|
+
}
|
|
26334
|
+
|
|
26335
|
+
if (_vDomBottom == null) {
|
|
26336
|
+
_vDomBottom = Infinity;
|
|
26337
|
+
}
|
|
26338
|
+
|
|
26339
|
+
if (_vDomLeft == null) {
|
|
26340
|
+
_vDomLeft = 0;
|
|
26341
|
+
}
|
|
26342
|
+
|
|
26343
|
+
if (_vDomRight == null) {
|
|
26344
|
+
_vDomRight = Infinity;
|
|
26345
|
+
}
|
|
26346
|
+
|
|
26347
|
+
if (this.overlaps(_vDomLeft, _vDomTop, _vDomRight, _vDomBottom)) {
|
|
26348
|
+
top = Math.max(this.top, _vDomTop);
|
|
26349
|
+
bottom = Math.min(this.bottom, _vDomBottom);
|
|
26350
|
+
left = Math.max(this.left, _vDomLeft);
|
|
26351
|
+
right = Math.min(this.right, _vDomRight);
|
|
26352
|
+
|
|
26353
|
+
topLeftCell = this.rangeManager.getCell(top, left);
|
|
26354
|
+
bottomRightCell = this.rangeManager.getCell(bottom, right);
|
|
26355
|
+
|
|
26356
|
+
this.element.classList.add("tabulator-range-active");
|
|
26357
|
+
// this.element.classList.toggle("tabulator-range-active", this === this.rangeManager.activeRange);
|
|
26358
|
+
|
|
26359
|
+
this.element.style.left = topLeftCell.row.getElement().offsetLeft + topLeftCell.getElement().offsetLeft + "px";
|
|
26360
|
+
this.element.style.top = topLeftCell.row.getElement().offsetTop + "px";
|
|
26361
|
+
this.element.style.width = bottomRightCell.getElement().offsetLeft + bottomRightCell.getElement().offsetWidth - topLeftCell.getElement().offsetLeft + "px";
|
|
26362
|
+
this.element.style.height = bottomRightCell.row.getElement().offsetTop + bottomRightCell.row.getElement().offsetHeight - topLeftCell.row.getElement().offsetTop + "px";
|
|
26363
|
+
}
|
|
26364
|
+
}
|
|
26365
|
+
|
|
26366
|
+
atTopLeft(cell) {
|
|
26367
|
+
return cell.row.position - 1 === this.top && cell.column.getPosition() - 1 === this.left;
|
|
26368
|
+
}
|
|
26369
|
+
|
|
26370
|
+
atBottomRight(cell) {
|
|
26371
|
+
return cell.row.position - 1 === this.bottom && cell.column.getPosition() - 1 === this.right;
|
|
26372
|
+
}
|
|
26373
|
+
|
|
26374
|
+
occupies(cell) {
|
|
26375
|
+
return this.occupiesRow(cell.row) && this.occupiesColumn(cell.column);
|
|
26376
|
+
}
|
|
26377
|
+
|
|
26378
|
+
occupiesRow(row) {
|
|
26379
|
+
return this.top <= row.position - 1 && row.position - 1 <= this.bottom;
|
|
26380
|
+
}
|
|
26381
|
+
|
|
26382
|
+
occupiesColumn(col) {
|
|
26383
|
+
return this.left <= col.getPosition() - 1 && col.getPosition() - 1 <= this.right;
|
|
26384
|
+
}
|
|
26385
|
+
|
|
26386
|
+
overlaps(left, top, right, bottom) {
|
|
26387
|
+
if ((this.left > right || left > this.right) || (this.top > bottom || top > this.bottom)){
|
|
26388
|
+
return false;
|
|
26389
|
+
}
|
|
26390
|
+
|
|
26391
|
+
return true;
|
|
26392
|
+
}
|
|
26393
|
+
|
|
26394
|
+
getData() {
|
|
26395
|
+
var data = [],
|
|
26396
|
+
rows = this.getRows(),
|
|
26397
|
+
columns = this.getColumns();
|
|
26398
|
+
|
|
26399
|
+
rows.forEach((row) => {
|
|
26400
|
+
var rowData = row.getData(),
|
|
26401
|
+
result = {};
|
|
26402
|
+
|
|
26403
|
+
columns.forEach((column) => {
|
|
26404
|
+
result[column.field] = rowData[column.field];
|
|
26405
|
+
});
|
|
26406
|
+
|
|
26407
|
+
data.push(result);
|
|
26408
|
+
});
|
|
26409
|
+
|
|
26410
|
+
return data;
|
|
26411
|
+
}
|
|
26412
|
+
|
|
26413
|
+
getCells(structured, component) {
|
|
26414
|
+
var cells = [],
|
|
26415
|
+
rows = this.getRows(),
|
|
26416
|
+
columns = this.getColumns();
|
|
26417
|
+
|
|
26418
|
+
if (structured) {
|
|
26419
|
+
cells = rows.map((row) => {
|
|
26420
|
+
var arr = [];
|
|
26421
|
+
|
|
26422
|
+
row.getCells().forEach((cell) => {
|
|
26423
|
+
if (columns.includes(cell.column)) {
|
|
26424
|
+
arr.push(component ? cell.getComponent() : cell);
|
|
26425
|
+
}
|
|
26426
|
+
});
|
|
26427
|
+
|
|
26428
|
+
return arr;
|
|
26429
|
+
});
|
|
26430
|
+
} else {
|
|
26431
|
+
rows.forEach((row) => {
|
|
26432
|
+
row.getCells().forEach((cell) => {
|
|
26433
|
+
if (columns.includes(cell.column)) {
|
|
26434
|
+
cells.push(component ? cell.getComponent() : cell);
|
|
26435
|
+
}
|
|
26436
|
+
});
|
|
26437
|
+
});
|
|
26438
|
+
}
|
|
26439
|
+
|
|
26440
|
+
return cells;
|
|
26441
|
+
}
|
|
26442
|
+
|
|
26443
|
+
getStructuredCells() {
|
|
26444
|
+
return this.getCells(true, true);
|
|
26445
|
+
}
|
|
26446
|
+
|
|
26447
|
+
getRows() {
|
|
26448
|
+
return this._getTableRows().slice(this.top, this.bottom + 1);
|
|
26449
|
+
}
|
|
26450
|
+
|
|
26451
|
+
getColumns() {
|
|
26452
|
+
return this._getTableColumns().slice(this.left, this.right + 1);
|
|
26453
|
+
}
|
|
26454
|
+
|
|
26455
|
+
clearValues(){
|
|
26456
|
+
var cells = this.getCells();
|
|
26457
|
+
var clearValue = this.table.options.selectableRangeClearCellsValue;
|
|
26458
|
+
|
|
26459
|
+
this.table.blockRedraw();
|
|
26460
|
+
|
|
26461
|
+
cells.forEach((cell) => {
|
|
26462
|
+
cell.setValue(clearValue);
|
|
26463
|
+
});
|
|
26464
|
+
|
|
26465
|
+
this.table.restoreRedraw();
|
|
26466
|
+
|
|
26467
|
+
}
|
|
26468
|
+
|
|
26469
|
+
getBounds(component){
|
|
26470
|
+
var cells = this.getCells(false, component),
|
|
26471
|
+
output = {
|
|
26472
|
+
start:null,
|
|
26473
|
+
end:null,
|
|
26474
|
+
};
|
|
26475
|
+
|
|
26476
|
+
if(cells.length){
|
|
26477
|
+
output.start = cells[0];
|
|
26478
|
+
output.end = cells[cells.length - 1];
|
|
26479
|
+
}else {
|
|
26480
|
+
console.warn("No bounds defined on range");
|
|
26481
|
+
}
|
|
26482
|
+
|
|
26483
|
+
return output;
|
|
26484
|
+
}
|
|
26485
|
+
|
|
26486
|
+
getComponent() {
|
|
26487
|
+
if (!this.component) {
|
|
26488
|
+
this.component = new RangeComponent(this);
|
|
26489
|
+
}
|
|
26490
|
+
return this.component;
|
|
26491
|
+
}
|
|
26492
|
+
|
|
26493
|
+
destroy(notify) {
|
|
26494
|
+
this.destroyed = true;
|
|
26495
|
+
|
|
26496
|
+
this.element.remove();
|
|
26497
|
+
|
|
26498
|
+
if(notify){
|
|
26499
|
+
this.rangeManager.rangeRemoved(this);
|
|
26500
|
+
}
|
|
26501
|
+
|
|
26502
|
+
if(this.initialized){
|
|
26503
|
+
this.dispatchExternal("rangeRemoved", this.getComponent());
|
|
26504
|
+
}
|
|
26505
|
+
}
|
|
26506
|
+
|
|
26507
|
+
destroyedGuard(func){
|
|
26508
|
+
if(this.destroyed){
|
|
26509
|
+
console.warn("You cannot call the " + func + " function on a destroyed range");
|
|
26510
|
+
}
|
|
26511
|
+
|
|
26512
|
+
return !this.destroyed;
|
|
26513
|
+
}
|
|
26514
|
+
}
|
|
26515
|
+
|
|
26516
|
+
class SelectRange extends Module {
|
|
26517
|
+
constructor(table) {
|
|
26518
|
+
super(table);
|
|
26519
|
+
|
|
26520
|
+
this.selecting = "cell";
|
|
26521
|
+
this.mousedown = false;
|
|
26522
|
+
this.ranges = [];
|
|
26523
|
+
this.overlay = null;
|
|
26524
|
+
this.rowHeader = null;
|
|
26525
|
+
this.layoutChangeTimeout = null;
|
|
26526
|
+
this.columnSelection = false;
|
|
26527
|
+
this.rowSelection = false;
|
|
26528
|
+
this.maxRanges = 0;
|
|
26529
|
+
this.activeRange = false;
|
|
26530
|
+
this.blockKeydown = false;
|
|
26531
|
+
|
|
26532
|
+
this.keyDownEvent = this._handleKeyDown.bind(this);
|
|
26533
|
+
this.mouseUpEvent = this._handleMouseUp.bind(this);
|
|
26534
|
+
|
|
26535
|
+
this.registerTableOption("selectableRange", false); //enable selectable range
|
|
26536
|
+
this.registerTableOption("selectableRangeColumns", false); //enable selectable range
|
|
26537
|
+
this.registerTableOption("selectableRangeRows", false); //enable selectable range
|
|
26538
|
+
this.registerTableOption("selectableRangeClearCells", false); //allow clearing of active range
|
|
26539
|
+
this.registerTableOption("selectableRangeClearCellsValue", undefined); //value for cleared active range
|
|
26540
|
+
|
|
26541
|
+
this.registerTableFunction("getRangesData", this.getRangesData.bind(this));
|
|
26542
|
+
this.registerTableFunction("getRanges", this.getRanges.bind(this));
|
|
26543
|
+
this.registerTableFunction("addRange", this.addRangeFromComponent.bind(this));
|
|
26544
|
+
|
|
26545
|
+
this.registerComponentFunction("cell", "getRanges", this.cellGetRanges.bind(this));
|
|
26546
|
+
this.registerComponentFunction("row", "getRanges", this.rowGetRanges.bind(this));
|
|
26547
|
+
this.registerComponentFunction("column", "getRanges", this.colGetRanges.bind(this));
|
|
26548
|
+
}
|
|
26549
|
+
|
|
26550
|
+
///////////////////////////////////
|
|
26551
|
+
/////// Initialization ///////
|
|
26552
|
+
///////////////////////////////////
|
|
26553
|
+
|
|
26554
|
+
initialize() {
|
|
26555
|
+
if (this.options("selectableRange")) {
|
|
26556
|
+
if(!this.options("selectableRows")){
|
|
26557
|
+
|
|
26558
|
+
this.maxRanges = this.options("selectableRange");
|
|
26559
|
+
|
|
26560
|
+
this.initializeTable();
|
|
26561
|
+
this.initializeWatchers();
|
|
26562
|
+
}else {
|
|
26563
|
+
console.warn("SelectRange functionality cannot be used in conjunction with row selection");
|
|
26564
|
+
}
|
|
26565
|
+
}
|
|
26566
|
+
}
|
|
26567
|
+
|
|
26568
|
+
|
|
26569
|
+
initializeTable() {
|
|
26570
|
+
this.overlay = document.createElement("div");
|
|
26571
|
+
this.overlay.classList.add("tabulator-range-overlay");
|
|
26572
|
+
|
|
26573
|
+
this.rangeContainer = document.createElement("div");
|
|
26574
|
+
this.rangeContainer.classList.add("tabulator-range-container");
|
|
26575
|
+
|
|
26576
|
+
this.activeRangeCellElement = document.createElement("div");
|
|
26577
|
+
this.activeRangeCellElement.classList.add("tabulator-range-cell-active");
|
|
26578
|
+
|
|
26579
|
+
this.overlay.appendChild(this.rangeContainer);
|
|
26580
|
+
this.overlay.appendChild(this.activeRangeCellElement);
|
|
26581
|
+
|
|
26582
|
+
this.table.rowManager.element.addEventListener("keydown", this.keyDownEvent);
|
|
26583
|
+
|
|
26584
|
+
this.resetRanges();
|
|
26585
|
+
|
|
26586
|
+
this.table.rowManager.element.appendChild(this.overlay);
|
|
26587
|
+
this.table.columnManager.element.setAttribute("tabindex", 0);
|
|
26588
|
+
this.table.element.classList.add("tabulator-ranges");
|
|
26589
|
+
}
|
|
26590
|
+
|
|
26591
|
+
initializeWatchers() {
|
|
26592
|
+
this.columnSelection = this.options("selectableRangeColumns");
|
|
26593
|
+
this.rowSelection = this.options("selectableRangeRows");
|
|
26594
|
+
|
|
26595
|
+
this.subscribe("column-init", this.initializeColumn.bind(this));
|
|
26596
|
+
this.subscribe("column-mousedown", this.handleColumnMouseDown.bind(this));
|
|
26597
|
+
this.subscribe("column-mousemove", this.handleColumnMouseMove.bind(this));
|
|
26598
|
+
this.subscribe("column-resized", this.handleColumnResized.bind(this));
|
|
26599
|
+
this.subscribe("column-width", this.layoutChange.bind(this));
|
|
26600
|
+
this.subscribe("column-height", this.layoutChange.bind(this));
|
|
26601
|
+
this.subscribe("column-resized", this.layoutChange.bind(this));
|
|
26602
|
+
this.subscribe("columns-loaded", this.updateHeaderColumn.bind(this));
|
|
26603
|
+
|
|
26604
|
+
this.subscribe("cell-height", this.layoutChange.bind(this));
|
|
26605
|
+
this.subscribe("cell-rendered", this.renderCell.bind(this));
|
|
26606
|
+
this.subscribe("cell-mousedown", this.handleCellMouseDown.bind(this));
|
|
26607
|
+
this.subscribe("cell-mousemove", this.handleCellMouseMove.bind(this));
|
|
26608
|
+
this.subscribe("cell-click", this.handleCellClick.bind(this));
|
|
26609
|
+
this.subscribe("cell-editing", this.handleEditingCell.bind(this));
|
|
26610
|
+
|
|
26611
|
+
this.subscribe("page-changed", this.redraw.bind(this));
|
|
26612
|
+
|
|
26613
|
+
this.subscribe("scroll-vertical", this.layoutChange.bind(this));
|
|
26614
|
+
this.subscribe("scroll-horizontal", this.layoutChange.bind(this));
|
|
26615
|
+
|
|
26616
|
+
this.subscribe("data-destroy", this.tableDestroyed.bind(this));
|
|
26617
|
+
this.subscribe("data-processed", this.resetRanges.bind(this));
|
|
26618
|
+
|
|
26619
|
+
this.subscribe("table-layout", this.layoutElement.bind(this));
|
|
26620
|
+
this.subscribe("table-redraw", this.redraw.bind(this));
|
|
26621
|
+
this.subscribe("table-destroy", this.tableDestroyed.bind(this));
|
|
26622
|
+
|
|
26623
|
+
this.subscribe("edit-editor-clear", this.finishEditingCell.bind(this));
|
|
26624
|
+
this.subscribe("edit-blur", this.restoreFocus.bind(this));
|
|
26625
|
+
|
|
26626
|
+
this.subscribe("keybinding-nav-prev", this.keyNavigate.bind(this, "left"));
|
|
26627
|
+
this.subscribe("keybinding-nav-next", this.keyNavigate.bind(this, "right"));
|
|
26628
|
+
this.subscribe("keybinding-nav-left", this.keyNavigate.bind(this, "left"));
|
|
26629
|
+
this.subscribe("keybinding-nav-right", this.keyNavigate.bind(this, "right"));
|
|
26630
|
+
this.subscribe("keybinding-nav-up", this.keyNavigate.bind(this, "up"));
|
|
26631
|
+
this.subscribe("keybinding-nav-down", this.keyNavigate.bind(this, "down"));
|
|
26632
|
+
this.subscribe("keybinding-nav-range", this.keyNavigateRange.bind(this));
|
|
26633
|
+
}
|
|
26634
|
+
|
|
26635
|
+
|
|
26636
|
+
initializeColumn(column) {
|
|
26637
|
+
if(this.columnSelection && column.definition.headerSort && this.options("headerSortClickElement") !== "icon"){
|
|
26638
|
+
console.warn("Using column headerSort with selectableRangeColumns option may result in unpredictable behavior. Consider using headerSortClickElement: 'icon'.");
|
|
26639
|
+
}
|
|
26640
|
+
|
|
26641
|
+
if (column.modules.edit) ;
|
|
26642
|
+
}
|
|
26643
|
+
|
|
26644
|
+
updateHeaderColumn(){
|
|
26645
|
+
if(this.rowSelection){
|
|
26646
|
+
this.rowHeader = this.table.columnManager.getVisibleColumnsByIndex()[0];
|
|
26647
|
+
|
|
26648
|
+
if(this.rowHeader){
|
|
26649
|
+
this.rowHeader.definition.cssClass = this.rowHeader.definition.cssClass + " tabulator-range-row-header";
|
|
26650
|
+
|
|
26651
|
+
if(this.rowHeader.definition.headerSort){
|
|
26652
|
+
console.warn("Using column headerSort with selectableRangeRows option may result in unpredictable behavior");
|
|
26653
|
+
}
|
|
26654
|
+
|
|
26655
|
+
if(this.rowHeader.definition.editor){
|
|
26656
|
+
console.warn("Using column editor with selectableRangeRows option may result in unpredictable behavior");
|
|
26657
|
+
}
|
|
26658
|
+
}
|
|
26659
|
+
}
|
|
26660
|
+
}
|
|
26661
|
+
|
|
26662
|
+
///////////////////////////////////
|
|
26663
|
+
/////// Table Functions ///////
|
|
26664
|
+
///////////////////////////////////
|
|
26665
|
+
|
|
26666
|
+
getRanges(){
|
|
26667
|
+
return this.ranges.map((range) => range.getComponent());
|
|
26668
|
+
}
|
|
26669
|
+
|
|
26670
|
+
getRangesData() {
|
|
26671
|
+
return this.ranges.map((range) => range.getData());
|
|
26672
|
+
}
|
|
26673
|
+
|
|
26674
|
+
addRangeFromComponent(start, end){
|
|
26675
|
+
start = start ? start._cell : null;
|
|
26676
|
+
end = end ? end._cell : null;
|
|
26677
|
+
|
|
26678
|
+
return this.addRange(start, end);
|
|
26679
|
+
}
|
|
26680
|
+
|
|
26681
|
+
///////////////////////////////////
|
|
26682
|
+
/////// Component Functions ///////
|
|
26683
|
+
///////////////////////////////////
|
|
26684
|
+
|
|
26685
|
+
cellGetRanges(cell){
|
|
26686
|
+
var ranges = [];
|
|
26687
|
+
|
|
26688
|
+
if (cell.column === this.rowHeader) {
|
|
26689
|
+
ranges = this.ranges.filter((range) => range.occupiesRow(cell.row));
|
|
26690
|
+
} else {
|
|
26691
|
+
ranges = this.ranges.filter((range) => range.occupies(cell));
|
|
26692
|
+
}
|
|
26693
|
+
|
|
26694
|
+
return ranges.map((range) => range.getComponent());
|
|
26695
|
+
}
|
|
26696
|
+
|
|
26697
|
+
rowGetRanges(row){
|
|
26698
|
+
var ranges = this.ranges.filter((range) => range.occupiesRow(row));
|
|
26699
|
+
|
|
26700
|
+
return ranges.map((range) => range.getComponent());
|
|
26701
|
+
}
|
|
26702
|
+
|
|
26703
|
+
colGetRanges(col){
|
|
26704
|
+
var ranges = this.ranges.filter((range) => range.occupiesColumn(col));
|
|
26705
|
+
|
|
26706
|
+
return ranges.map((range) => range.getComponent());
|
|
26707
|
+
}
|
|
26708
|
+
|
|
26709
|
+
///////////////////////////////////
|
|
26710
|
+
////////// Event Handlers /////////
|
|
26711
|
+
///////////////////////////////////
|
|
26712
|
+
|
|
26713
|
+
_handleMouseUp(e){
|
|
26714
|
+
this.mousedown = false;
|
|
26715
|
+
document.removeEventListener("mouseup", this.mouseUpEvent);
|
|
26716
|
+
}
|
|
26717
|
+
|
|
26718
|
+
_handleKeyDown(e) {
|
|
26719
|
+
if (!this.blockKeydown && (!this.table.modules.edit || (this.table.modules.edit && !this.table.modules.edit.currentCell))) {
|
|
26720
|
+
if (e.key === "Enter") {
|
|
26721
|
+
// is editing a cell?
|
|
26722
|
+
if (this.table.modules.edit && this.table.modules.edit.currentCell) {
|
|
26723
|
+
return;
|
|
26724
|
+
}
|
|
26725
|
+
|
|
26726
|
+
this.table.modules.edit.editCell(this.getActiveCell());
|
|
26727
|
+
|
|
26728
|
+
e.preventDefault();
|
|
26729
|
+
}
|
|
26730
|
+
|
|
26731
|
+
if ((e.key === "Backspace" || e.key === "Delete") && this.options("selectableRangeClearCells")) {
|
|
26732
|
+
if(this.activeRange){
|
|
26733
|
+
this.activeRange.clearValues();
|
|
26734
|
+
}
|
|
26735
|
+
}
|
|
26736
|
+
}
|
|
26737
|
+
}
|
|
26738
|
+
|
|
26739
|
+
initializeFocus(cell){
|
|
26740
|
+
var range;
|
|
26741
|
+
|
|
26742
|
+
try{
|
|
26743
|
+
if (document.selection) { // IE
|
|
26744
|
+
range = document.body.createTextRange();
|
|
26745
|
+
range.moveToElementText(cell.getElement());
|
|
26746
|
+
range.select();
|
|
26747
|
+
} else if (window.getSelection) {
|
|
26748
|
+
range = document.createRange();
|
|
26749
|
+
range.selectNode(cell.getElement());
|
|
26750
|
+
window.getSelection().removeAllRanges();
|
|
26751
|
+
window.getSelection().addRange(range);
|
|
26752
|
+
}
|
|
26753
|
+
}catch(e){}
|
|
26754
|
+
}
|
|
26755
|
+
|
|
26756
|
+
restoreFocus(element){
|
|
26757
|
+
this.table.rowManager.element.focus();
|
|
26758
|
+
|
|
26759
|
+
return true;
|
|
26760
|
+
}
|
|
26761
|
+
|
|
26762
|
+
///////////////////////////////////
|
|
26763
|
+
////// Column Functionality ///////
|
|
26764
|
+
///////////////////////////////////
|
|
26765
|
+
|
|
26766
|
+
handleColumnResized(column) {
|
|
26767
|
+
var selected;
|
|
26768
|
+
|
|
26769
|
+
if (this.selecting !== "column" && this.selecting !== "all") {
|
|
26770
|
+
return;
|
|
26771
|
+
}
|
|
26772
|
+
|
|
26773
|
+
selected = this.ranges.some((range) => range.occupiesColumn(column));
|
|
26774
|
+
|
|
26775
|
+
if (!selected) {
|
|
26776
|
+
return;
|
|
26777
|
+
}
|
|
26778
|
+
|
|
26779
|
+
this.ranges.forEach((range) => {
|
|
26780
|
+
var selectedColumns = range.getColumns(true);
|
|
26781
|
+
|
|
26782
|
+
selectedColumns.forEach((selectedColumn) => {
|
|
26783
|
+
if (selectedColumn !== column) {
|
|
26784
|
+
selectedColumn.setWidth(column.width);
|
|
26785
|
+
}
|
|
26786
|
+
});
|
|
26787
|
+
});
|
|
26788
|
+
}
|
|
26789
|
+
|
|
26790
|
+
handleColumnMouseDown(event, column) {
|
|
26791
|
+
if (event.button === 2 && (this.selecting === "column" || this.selecting === "all") && this.activeRange.occupiesColumn(column)) {
|
|
26792
|
+
return;
|
|
26793
|
+
}
|
|
26794
|
+
|
|
26795
|
+
this.mousedown = true;
|
|
26796
|
+
|
|
26797
|
+
document.addEventListener("mouseup", this.mouseUpEvent);
|
|
26798
|
+
|
|
26799
|
+
this.newSelection(event, column);
|
|
26800
|
+
}
|
|
26801
|
+
|
|
26802
|
+
handleColumnMouseMove(e, column) {
|
|
26803
|
+
if (column === this.rowHeader || !this.mousedown || this.selecting === 'all') {
|
|
26804
|
+
return;
|
|
26805
|
+
}
|
|
26806
|
+
|
|
26807
|
+
this.activeRange.setBounds(false, column, true);
|
|
26808
|
+
}
|
|
26809
|
+
|
|
26810
|
+
///////////////////////////////////
|
|
26811
|
+
//////// Cell Functionality ///////
|
|
26812
|
+
///////////////////////////////////
|
|
26813
|
+
|
|
26814
|
+
renderCell(cell) {
|
|
26815
|
+
var el = cell.getElement(),
|
|
26816
|
+
rangeIdx = this.ranges.findIndex((range) => range.occupies(cell));
|
|
26817
|
+
|
|
26818
|
+
el.classList.toggle("tabulator-range-selected", rangeIdx !== -1);
|
|
26819
|
+
el.classList.toggle("tabulator-range-only-cell-selected", this.ranges.length === 1 && this.ranges[0].atTopLeft(cell) && this.ranges[0].atBottomRight(cell));
|
|
26820
|
+
|
|
26821
|
+
el.dataset.range = rangeIdx;
|
|
26822
|
+
}
|
|
26823
|
+
|
|
26824
|
+
handleCellMouseDown(event, cell) {
|
|
26825
|
+
if (event.button === 2 && (this.activeRange.occupies(cell) || ((this.selecting === "row" || this.selecting === "all") && this.activeRange.occupiesRow(cell.row)))) {
|
|
26826
|
+
return;
|
|
26827
|
+
}
|
|
26828
|
+
|
|
26829
|
+
this.mousedown = true;
|
|
26830
|
+
|
|
26831
|
+
document.addEventListener("mouseup", this.mouseUpEvent);
|
|
26832
|
+
|
|
26833
|
+
this.newSelection(event, cell);
|
|
26834
|
+
}
|
|
26835
|
+
|
|
26836
|
+
handleCellMouseMove(e, cell) {
|
|
26837
|
+
if (!this.mousedown || this.selecting === "all") {
|
|
26838
|
+
return;
|
|
26839
|
+
}
|
|
26840
|
+
|
|
26841
|
+
this.activeRange.setBounds(false, cell, true);
|
|
26842
|
+
}
|
|
26843
|
+
|
|
26844
|
+
handleCellClick(e, cell){
|
|
26845
|
+
this.initializeFocus(cell);
|
|
26846
|
+
}
|
|
26847
|
+
|
|
26848
|
+
handleEditingCell(cell) {
|
|
26849
|
+
if(this.activeRange){
|
|
26850
|
+
this.activeRange.setBounds(cell);
|
|
26851
|
+
}
|
|
26852
|
+
}
|
|
26853
|
+
|
|
26854
|
+
finishEditingCell() {
|
|
26855
|
+
this.blockKeydown = true;
|
|
26856
|
+
this.table.rowManager.element.focus();
|
|
26857
|
+
|
|
26858
|
+
setTimeout(() => {
|
|
26859
|
+
this.blockKeydown = false;
|
|
26860
|
+
}, 10);
|
|
26861
|
+
}
|
|
26862
|
+
|
|
26863
|
+
///////////////////////////////////
|
|
26864
|
+
/////// Navigation ///////
|
|
26865
|
+
///////////////////////////////////
|
|
26866
|
+
|
|
26867
|
+
keyNavigate(dir, e){
|
|
26868
|
+
if(this.navigate(false, false, dir)){
|
|
26869
|
+
e.preventDefault();
|
|
26870
|
+
}
|
|
26871
|
+
}
|
|
26872
|
+
|
|
26873
|
+
keyNavigateRange(e, dir, jump, expand){
|
|
26874
|
+
if(this.navigate(jump, expand, dir)){
|
|
26875
|
+
e.preventDefault();
|
|
26876
|
+
}
|
|
26877
|
+
}
|
|
26878
|
+
|
|
26879
|
+
navigate(jump, expand, dir) {
|
|
26880
|
+
var moved = false,
|
|
26881
|
+
range, rangeEdge, nextRow, nextCol, row, column;
|
|
26882
|
+
|
|
26883
|
+
// Don't navigate while editing
|
|
26884
|
+
if (this.table.modules.edit && this.table.modules.edit.currentCell) {
|
|
26885
|
+
return false;
|
|
26886
|
+
}
|
|
26887
|
+
|
|
26888
|
+
// If there are more than 1 range, use the active range and destroy the others
|
|
26889
|
+
if (this.ranges.length > 1) {
|
|
26890
|
+
this.ranges = this.ranges.filter((range) => {
|
|
26891
|
+
if (range === this.activeRange) {
|
|
26892
|
+
range.setEnd(range.start.row, range.start.col);
|
|
26893
|
+
return true;
|
|
26894
|
+
}
|
|
26895
|
+
range.destroy();
|
|
26896
|
+
return false;
|
|
26897
|
+
});
|
|
26898
|
+
}
|
|
26899
|
+
|
|
26900
|
+
range = this.activeRange;
|
|
26901
|
+
|
|
26902
|
+
rangeEdge = expand ? range.end : range.start;
|
|
26903
|
+
nextRow = rangeEdge.row;
|
|
26904
|
+
nextCol = rangeEdge.col;
|
|
26905
|
+
|
|
26906
|
+
if(jump){
|
|
26907
|
+
switch(dir){
|
|
26908
|
+
case "left":
|
|
26909
|
+
nextCol = this.findJumpCellLeft(range.start.row, rangeEdge.col);
|
|
26910
|
+
break;
|
|
26911
|
+
case "right":
|
|
26912
|
+
nextCol = this.findJumpCellRight(range.start.row, rangeEdge.col);
|
|
26913
|
+
break;
|
|
26914
|
+
case "up":
|
|
26915
|
+
nextRow = this.findJumpCellUp(rangeEdge.row, range.start.col);
|
|
26916
|
+
break;
|
|
26917
|
+
case "down":
|
|
26918
|
+
nextRow = this.findJumpCellDown(rangeEdge.row, range.start.col);
|
|
26919
|
+
break;
|
|
26920
|
+
}
|
|
26921
|
+
}else {
|
|
26922
|
+
if(expand){
|
|
26923
|
+
if ((this.selecting === 'row' && (dir === 'left' || dir === 'right')) || (this.selecting === 'column' && (dir === 'up' || dir === 'down'))) {
|
|
26924
|
+
return;
|
|
26925
|
+
}
|
|
26926
|
+
}
|
|
26927
|
+
|
|
26928
|
+
switch(dir){
|
|
26929
|
+
case "left":
|
|
26930
|
+
nextCol = Math.max(nextCol - 1, 0);
|
|
26931
|
+
break;
|
|
26932
|
+
case "right":
|
|
26933
|
+
nextCol = Math.min(nextCol + 1, this.getTableColumns().length - 1);
|
|
26934
|
+
break;
|
|
26935
|
+
case "up":
|
|
26936
|
+
nextRow = Math.max(nextRow - 1, 0);
|
|
26937
|
+
break;
|
|
26938
|
+
case "down":
|
|
26939
|
+
nextRow = Math.min(nextRow + 1, this.getTableRows().length - 1);
|
|
26940
|
+
break;
|
|
26941
|
+
}
|
|
26942
|
+
}
|
|
26943
|
+
|
|
26944
|
+
moved = nextCol !== rangeEdge.col || nextRow !== rangeEdge.row;
|
|
26945
|
+
|
|
26946
|
+
if(!expand){
|
|
26947
|
+
range.setStart(nextRow, nextCol);
|
|
26948
|
+
}
|
|
26949
|
+
|
|
26950
|
+
range.setEnd(nextRow, nextCol);
|
|
26951
|
+
|
|
26952
|
+
if(!expand){
|
|
26953
|
+
this.selecting = "cell";
|
|
26954
|
+
}
|
|
26955
|
+
|
|
26956
|
+
if (moved) {
|
|
26957
|
+
row = this.getRowByRangePos(range.end.row);
|
|
26958
|
+
column = this.getColumnByRangePos(range.end.col);
|
|
26959
|
+
|
|
26960
|
+
if ((dir === 'left' || dir === 'right') && column.getElement().parentNode === null) {
|
|
26961
|
+
column.getComponent().scrollTo(undefined, false);
|
|
26962
|
+
} else if ((dir === 'up' || dir === 'down') && row.getElement().parentNode === null) {
|
|
26963
|
+
row.getComponent().scrollTo(undefined, false);
|
|
26964
|
+
} else {
|
|
26965
|
+
// Use faster autoScroll when the elements are on the DOM
|
|
26966
|
+
this.autoScroll(range, row.getElement(), column.getElement());
|
|
26967
|
+
}
|
|
26968
|
+
|
|
26969
|
+
this.layoutElement();
|
|
26970
|
+
|
|
26971
|
+
return true;
|
|
26972
|
+
}
|
|
26973
|
+
}
|
|
26974
|
+
|
|
26975
|
+
rangeRemoved(removed){
|
|
26976
|
+
this.ranges = this.ranges.filter((range) => range !== removed);
|
|
26977
|
+
|
|
26978
|
+
if(this.activeRange === removed){
|
|
26979
|
+
if(this.ranges.length){
|
|
26980
|
+
this.activeRange = this.ranges[this.ranges.length - 1];
|
|
26981
|
+
}else {
|
|
26982
|
+
this.addRange();
|
|
26983
|
+
}
|
|
26984
|
+
}
|
|
26985
|
+
|
|
26986
|
+
this.layoutElement();
|
|
26987
|
+
}
|
|
26988
|
+
|
|
26989
|
+
findJumpCell(cells, reverse, emptyStart, emptySide){
|
|
26990
|
+
var nextCell;
|
|
26991
|
+
|
|
26992
|
+
if(reverse){
|
|
26993
|
+
cells = cells.reverse();
|
|
26994
|
+
}
|
|
26995
|
+
|
|
26996
|
+
for(let currentCell of cells){
|
|
26997
|
+
let currentValue = currentCell.getValue();
|
|
26998
|
+
|
|
26999
|
+
if(emptyStart){
|
|
27000
|
+
nextCell = currentCell;
|
|
27001
|
+
if(currentValue){
|
|
27002
|
+
break;
|
|
27003
|
+
}
|
|
27004
|
+
}else {
|
|
27005
|
+
if(emptySide){
|
|
27006
|
+
nextCell = currentCell;
|
|
27007
|
+
|
|
27008
|
+
if(currentValue){
|
|
27009
|
+
break;
|
|
27010
|
+
}
|
|
27011
|
+
}else {
|
|
27012
|
+
if(currentValue){
|
|
27013
|
+
nextCell = currentCell;
|
|
27014
|
+
}else {
|
|
27015
|
+
break;
|
|
27016
|
+
}
|
|
27017
|
+
}
|
|
27018
|
+
}
|
|
27019
|
+
}
|
|
27020
|
+
|
|
27021
|
+
return nextCell;
|
|
27022
|
+
}
|
|
27023
|
+
|
|
27024
|
+
findJumpCellLeft(rowPos, colPos){
|
|
27025
|
+
var row = this.getRowByRangePos(rowPos),
|
|
27026
|
+
cells = row.cells.filter((cell) => cell.column.visible),
|
|
27027
|
+
isStartingCellEmpty = !cells[colPos].getValue(),
|
|
27028
|
+
isLeftOfStartingCellEmpty = cells[colPos] ? !cells[colPos].getValue() : false,
|
|
27029
|
+
jumpCol = colPos,
|
|
27030
|
+
targetCells = this.rowHeader ? cells.slice(1, colPos) : cells.slice(0, colPos),
|
|
27031
|
+
nextCell = this.findJumpCell(targetCells, true, isStartingCellEmpty, isLeftOfStartingCellEmpty);
|
|
27032
|
+
|
|
27033
|
+
if(nextCell){
|
|
27034
|
+
jumpCol = nextCell.column.getPosition() - 1;
|
|
27035
|
+
}
|
|
27036
|
+
|
|
27037
|
+
return jumpCol;
|
|
27038
|
+
}
|
|
27039
|
+
|
|
27040
|
+
findJumpCellRight(rowPos, colPos){
|
|
27041
|
+
var row = this.getRowByRangePos(rowPos),
|
|
27042
|
+
cells = row.cells.filter((cell) => cell.column.visible),
|
|
27043
|
+
isStartingCellEmpty = !cells[colPos].getValue(),
|
|
27044
|
+
isRightOfStartingCellEmpty = cells[colPos + 1] ? !cells[colPos + 1].getValue() : false,
|
|
27045
|
+
jumpCol = colPos,
|
|
27046
|
+
nextCell = this.findJumpCell(cells.slice(colPos + 1, cells.length), false, isStartingCellEmpty, isRightOfStartingCellEmpty);
|
|
27047
|
+
|
|
27048
|
+
if(nextCell){
|
|
27049
|
+
jumpCol = nextCell.column.getPosition() - 1;
|
|
27050
|
+
}
|
|
27051
|
+
|
|
27052
|
+
return jumpCol;
|
|
27053
|
+
}
|
|
27054
|
+
|
|
27055
|
+
findJumpCellUp(rowPos, colPos) {
|
|
27056
|
+
var column = this.getColumnByRangePos(colPos),
|
|
27057
|
+
cells = column.cells.filter((cell) => this.table.rowManager.activeRows.includes(cell.row)),
|
|
27058
|
+
isStartingCellEmpty = !cells[rowPos].getValue(),
|
|
27059
|
+
isTopOfStartingCellEmpty = cells[rowPos - 1] ? !cells[rowPos - 1].getValue() : false,
|
|
27060
|
+
jumpRow = rowPos,
|
|
27061
|
+
nextCell = this.findJumpCell(cells.slice(0, jumpRow), true, isStartingCellEmpty, isTopOfStartingCellEmpty);
|
|
27062
|
+
|
|
27063
|
+
if(nextCell){
|
|
27064
|
+
jumpRow = nextCell.row.position - 1;
|
|
27065
|
+
}
|
|
27066
|
+
|
|
27067
|
+
return jumpRow;
|
|
27068
|
+
}
|
|
27069
|
+
|
|
27070
|
+
findJumpCellDown(rowPos, colPos) {
|
|
27071
|
+
var column = this.getColumnByRangePos(colPos),
|
|
27072
|
+
cells = column.cells.filter((cell) => this.table.rowManager.activeRows.includes(cell.row)),
|
|
27073
|
+
isStartingCellEmpty = !cells[rowPos].getValue(),
|
|
27074
|
+
isBottomOfStartingCellEmpty = cells[rowPos + 1] ? !cells[rowPos + 1].getValue() : false,
|
|
27075
|
+
jumpRow = rowPos,
|
|
27076
|
+
nextCell = this.findJumpCell(cells.slice(jumpRow + 1, cells.length), false, isStartingCellEmpty, isBottomOfStartingCellEmpty);
|
|
27077
|
+
|
|
27078
|
+
if(nextCell){
|
|
27079
|
+
jumpRow = nextCell.row.position - 1;
|
|
27080
|
+
}
|
|
27081
|
+
|
|
27082
|
+
return jumpRow;
|
|
27083
|
+
}
|
|
27084
|
+
|
|
27085
|
+
///////////////////////////////////
|
|
27086
|
+
/////// Selection ///////
|
|
27087
|
+
///////////////////////////////////
|
|
27088
|
+
newSelection(event, element) {
|
|
27089
|
+
var range;
|
|
27090
|
+
|
|
27091
|
+
if (element.type === "column") {
|
|
27092
|
+
if(!this.columnSelection){
|
|
27093
|
+
return;
|
|
27094
|
+
}
|
|
27095
|
+
|
|
27096
|
+
if (element === this.rowHeader) {
|
|
27097
|
+
range = this.resetRanges();
|
|
27098
|
+
this.selecting = "all";
|
|
27099
|
+
|
|
27100
|
+
var topLeftCell, bottomRightCell = this.getCell(-1, -1);
|
|
27101
|
+
|
|
27102
|
+
if(this.rowHeader){
|
|
27103
|
+
topLeftCell = this.getCell(0, 1);
|
|
27104
|
+
}else {
|
|
27105
|
+
topLeftCell = this.getCell(0, 0);
|
|
27106
|
+
}
|
|
27107
|
+
|
|
27108
|
+
range.setBounds(topLeftCell, bottomRightCell);
|
|
27109
|
+
return;
|
|
27110
|
+
} else {
|
|
27111
|
+
this.selecting = "column";
|
|
27112
|
+
}
|
|
27113
|
+
} else if (element.column === this.rowHeader) {
|
|
27114
|
+
this.selecting = "row";
|
|
27115
|
+
} else {
|
|
27116
|
+
this.selecting = "cell";
|
|
27117
|
+
}
|
|
27118
|
+
|
|
27119
|
+
if (event.shiftKey) {
|
|
27120
|
+
this.activeRange.setBounds(false, element);
|
|
27121
|
+
} else if (event.ctrlKey) {
|
|
27122
|
+
this.addRange().setBounds(element);
|
|
27123
|
+
} else {
|
|
27124
|
+
this.resetRanges().setBounds(element);
|
|
27125
|
+
}
|
|
27126
|
+
}
|
|
27127
|
+
|
|
27128
|
+
autoScroll(range, row, column) {
|
|
27129
|
+
var tableHolder = this.table.rowManager.element,
|
|
27130
|
+
rowHeader, rect, view, withinHorizontalView, withinVerticalView;
|
|
27131
|
+
|
|
27132
|
+
if (typeof row === 'undefined') {
|
|
27133
|
+
row = this.getRowByRangePos(range.end.row).getElement();
|
|
27134
|
+
}
|
|
27135
|
+
|
|
27136
|
+
if (typeof column === 'undefined') {
|
|
27137
|
+
column = this.getColumnByRangePos(range.end.col).getElement();
|
|
27138
|
+
}
|
|
27139
|
+
|
|
27140
|
+
if (this.rowHeader) {
|
|
27141
|
+
rowHeader = this.rowHeader.getElement();
|
|
27142
|
+
}
|
|
27143
|
+
|
|
27144
|
+
rect = {
|
|
27145
|
+
left: column.offsetLeft,
|
|
27146
|
+
right: column.offsetLeft + column.offsetWidth,
|
|
27147
|
+
top: row.offsetTop,
|
|
27148
|
+
bottom: row.offsetTop + row.offsetHeight,
|
|
27149
|
+
};
|
|
27150
|
+
|
|
27151
|
+
view = {
|
|
27152
|
+
left: tableHolder.scrollLeft,
|
|
27153
|
+
right: Math.ceil(tableHolder.scrollLeft + tableHolder.clientWidth),
|
|
27154
|
+
top: tableHolder.scrollTop,
|
|
27155
|
+
bottom: tableHolder.scrollTop + tableHolder.offsetHeight - this.table.rowManager.scrollbarWidth,
|
|
27156
|
+
};
|
|
27157
|
+
|
|
27158
|
+
if (rowHeader) {
|
|
27159
|
+
view.left += rowHeader.offsetWidth;
|
|
27160
|
+
}
|
|
27161
|
+
|
|
27162
|
+
withinHorizontalView = view.left < rect.left && rect.left < view.right && view.left < rect.right && rect.right < view.right;
|
|
27163
|
+
|
|
27164
|
+
withinVerticalView = view.top < rect.top && rect.top < view.bottom && view.top < rect.bottom && rect.bottom < view.bottom;
|
|
27165
|
+
|
|
27166
|
+
if (!withinHorizontalView) {
|
|
27167
|
+
if (rect.left < view.left) {
|
|
27168
|
+
tableHolder.scrollLeft = rect.left;
|
|
27169
|
+
if (rowHeader) {
|
|
27170
|
+
tableHolder.scrollLeft -= rowHeader.offsetWidth;
|
|
27171
|
+
}
|
|
27172
|
+
} else if (rect.right > view.right) {
|
|
27173
|
+
tableHolder.scrollLeft = rect.right - tableHolder.clientWidth;
|
|
27174
|
+
}
|
|
27175
|
+
}
|
|
27176
|
+
|
|
27177
|
+
if (!withinVerticalView) {
|
|
27178
|
+
if (rect.top < view.top) {
|
|
27179
|
+
tableHolder.scrollTop = rect.top;
|
|
27180
|
+
} else if (rect.bottom > view.bottom) {
|
|
27181
|
+
tableHolder.scrollTop = rect.bottom - tableHolder.clientHeight;
|
|
27182
|
+
}
|
|
27183
|
+
}
|
|
27184
|
+
}
|
|
27185
|
+
|
|
27186
|
+
|
|
27187
|
+
///////////////////////////////////
|
|
27188
|
+
/////// Layout ///////
|
|
27189
|
+
///////////////////////////////////
|
|
27190
|
+
|
|
27191
|
+
layoutChange(){
|
|
27192
|
+
this.overlay.style.visibility = "hidden";
|
|
27193
|
+
clearTimeout(this.layoutChangeTimeout);
|
|
27194
|
+
this.layoutChangeTimeout = setTimeout(this.layoutRanges.bind(this), 200);
|
|
27195
|
+
}
|
|
27196
|
+
|
|
27197
|
+
redraw(force) {
|
|
27198
|
+
if (force) {
|
|
27199
|
+
this.selecting = 'cell';
|
|
27200
|
+
this.resetRanges();
|
|
27201
|
+
this.layoutElement();
|
|
27202
|
+
}
|
|
27203
|
+
}
|
|
27204
|
+
|
|
27205
|
+
layoutElement(visibleRows) {
|
|
27206
|
+
var rows;
|
|
27207
|
+
|
|
27208
|
+
if (visibleRows) {
|
|
27209
|
+
rows = this.table.rowManager.getVisibleRows(true);
|
|
27210
|
+
} else {
|
|
27211
|
+
rows = this.table.rowManager.getRows();
|
|
27212
|
+
}
|
|
27213
|
+
|
|
27214
|
+
rows.forEach((row) => {
|
|
27215
|
+
if (row.type === "row") {
|
|
27216
|
+
this.layoutRow(row);
|
|
27217
|
+
row.cells.forEach((cell) => this.renderCell(cell));
|
|
27218
|
+
}
|
|
27219
|
+
});
|
|
27220
|
+
|
|
27221
|
+
this.getTableColumns().forEach((column) => {
|
|
27222
|
+
this.layoutColumn(column);
|
|
27223
|
+
});
|
|
27224
|
+
|
|
27225
|
+
this.layoutRanges();
|
|
27226
|
+
}
|
|
27227
|
+
|
|
27228
|
+
layoutRow(row) {
|
|
27229
|
+
var el = row.getElement(),
|
|
27230
|
+
selected = false,
|
|
27231
|
+
occupied = this.ranges.some((range) => range.occupiesRow(row));
|
|
27232
|
+
|
|
27233
|
+
if (this.selecting === "row") {
|
|
27234
|
+
selected = occupied;
|
|
27235
|
+
} else if (this.selecting === "all") {
|
|
27236
|
+
selected = true;
|
|
27237
|
+
}
|
|
27238
|
+
|
|
27239
|
+
el.classList.toggle("tabulator-range-selected", selected);
|
|
27240
|
+
el.classList.toggle("tabulator-range-highlight", occupied);
|
|
27241
|
+
}
|
|
27242
|
+
|
|
27243
|
+
layoutColumn(column) {
|
|
27244
|
+
var el = column.getElement(),
|
|
27245
|
+
selected = false,
|
|
27246
|
+
occupied = this.ranges.some((range) => range.occupiesColumn(column));
|
|
27247
|
+
|
|
27248
|
+
if (this.selecting === "column") {
|
|
27249
|
+
selected = occupied;
|
|
27250
|
+
} else if (this.selecting === "all") {
|
|
27251
|
+
selected = true;
|
|
27252
|
+
}
|
|
27253
|
+
|
|
27254
|
+
el.classList.toggle("tabulator-range-selected", selected);
|
|
27255
|
+
el.classList.toggle("tabulator-range-highlight", occupied);
|
|
27256
|
+
}
|
|
27257
|
+
|
|
27258
|
+
layoutRanges() {
|
|
27259
|
+
var activeCell;
|
|
27260
|
+
|
|
27261
|
+
if (!this.table.initialized) {
|
|
27262
|
+
return;
|
|
27263
|
+
}
|
|
27264
|
+
|
|
27265
|
+
activeCell = this.getActiveCell();
|
|
27266
|
+
|
|
27267
|
+
if (!activeCell) {
|
|
27268
|
+
return;
|
|
27269
|
+
}
|
|
27270
|
+
|
|
27271
|
+
this.activeRangeCellElement.style.left = activeCell.row.getElement().offsetLeft + activeCell.getElement().offsetLeft + "px";
|
|
27272
|
+
this.activeRangeCellElement.style.top = activeCell.row.getElement().offsetTop + "px";
|
|
27273
|
+
this.activeRangeCellElement.style.width = activeCell.getElement().offsetLeft + activeCell.getElement().offsetWidth - activeCell.getElement().offsetLeft + "px";
|
|
27274
|
+
this.activeRangeCellElement.style.height = activeCell.row.getElement().offsetTop + activeCell.row.getElement().offsetHeight - activeCell.row.getElement().offsetTop + "px";
|
|
27275
|
+
|
|
27276
|
+
this.ranges.forEach((range) => range.layout());
|
|
27277
|
+
|
|
27278
|
+
this.overlay.style.visibility = "visible";
|
|
27279
|
+
}
|
|
27280
|
+
|
|
27281
|
+
|
|
27282
|
+
///////////////////////////////////
|
|
27283
|
+
/////// Helper Functions ///////
|
|
27284
|
+
///////////////////////////////////
|
|
27285
|
+
|
|
27286
|
+
getCell(rowIdx, colIdx) {
|
|
27287
|
+
var row;
|
|
27288
|
+
|
|
27289
|
+
if (colIdx < 0) {
|
|
27290
|
+
colIdx = this.getTableColumns().length + colIdx;
|
|
27291
|
+
if (colIdx < 0) {
|
|
27292
|
+
return null;
|
|
27293
|
+
}
|
|
27294
|
+
}
|
|
27295
|
+
|
|
27296
|
+
if (rowIdx < 0) {
|
|
27297
|
+
rowIdx = this.getTableRows().length + rowIdx;
|
|
27298
|
+
}
|
|
27299
|
+
|
|
27300
|
+
row = this.table.rowManager.getRowFromPosition(rowIdx + 1);
|
|
27301
|
+
|
|
27302
|
+
return row ? row.getCells(false, true).filter((cell) => cell.column.visible)[colIdx] : null;
|
|
27303
|
+
}
|
|
27304
|
+
|
|
27305
|
+
|
|
27306
|
+
getActiveCell() {
|
|
27307
|
+
return this.getCell(this.activeRange.start.row, this.activeRange.start.col);
|
|
27308
|
+
}
|
|
27309
|
+
|
|
27310
|
+
getRowByRangePos(pos) {
|
|
27311
|
+
return this.getTableRows()[pos];
|
|
27312
|
+
}
|
|
27313
|
+
|
|
27314
|
+
getColumnByRangePos(pos) {
|
|
27315
|
+
return this.getTableColumns()[pos];
|
|
27316
|
+
}
|
|
27317
|
+
|
|
27318
|
+
getTableRows() {
|
|
27319
|
+
return this.table.rowManager.getDisplayRows();
|
|
27320
|
+
}
|
|
27321
|
+
|
|
27322
|
+
getTableColumns() {
|
|
27323
|
+
return this.table.columnManager.getVisibleColumnsByIndex();
|
|
27324
|
+
}
|
|
27325
|
+
|
|
27326
|
+
addRange(start, end) {
|
|
27327
|
+
var range;
|
|
27328
|
+
|
|
27329
|
+
if(this.maxRanges !== true && this.ranges.length >= this.maxRanges){
|
|
27330
|
+
this.ranges.shift().destroy();
|
|
27331
|
+
}
|
|
27332
|
+
|
|
27333
|
+
range = new Range(this.table, this, start, end);
|
|
27334
|
+
|
|
27335
|
+
this.activeRange = range;
|
|
27336
|
+
this.ranges.push(range);
|
|
27337
|
+
this.rangeContainer.appendChild(range.element);
|
|
27338
|
+
|
|
27339
|
+
return range;
|
|
27340
|
+
}
|
|
27341
|
+
|
|
27342
|
+
resetRanges() {
|
|
27343
|
+
var range, cell;
|
|
27344
|
+
|
|
27345
|
+
this.ranges.forEach((range) => range.destroy());
|
|
27346
|
+
this.ranges = [];
|
|
27347
|
+
|
|
27348
|
+
range = this.addRange();
|
|
27349
|
+
|
|
27350
|
+
if(this.table.rowManager.activeRows.length){
|
|
27351
|
+
cell = this.table.rowManager.activeRows[0].cells[this.rowHeader ? 1 : 0];
|
|
27352
|
+
|
|
27353
|
+
if(cell){
|
|
27354
|
+
range.setBounds(cell);
|
|
27355
|
+
this.initializeFocus(cell);
|
|
27356
|
+
}
|
|
27357
|
+
}
|
|
27358
|
+
|
|
27359
|
+
return range;
|
|
27360
|
+
}
|
|
27361
|
+
|
|
27362
|
+
tableDestroyed(){
|
|
27363
|
+
document.removeEventListener("mouseup", this.mouseUpEvent);
|
|
27364
|
+
this.table.rowManager.element.removeEventListener("keydown", this.keyDownEvent);
|
|
27365
|
+
}
|
|
27366
|
+
|
|
27367
|
+
selectedRows(component) {
|
|
27368
|
+
return component ? this.activeRange.getRows().map((row) => row.getComponent()) : this.activeRange.getRows();
|
|
27369
|
+
}
|
|
27370
|
+
|
|
27371
|
+
selectedColumns(component) {
|
|
27372
|
+
return component ? this.activeRange.getColumns().map((col) => col.getComponent()) : this.activeRange.getColumns();
|
|
27373
|
+
}
|
|
27374
|
+
}
|
|
27375
|
+
|
|
27376
|
+
SelectRange.moduleName = "selectRange";
|
|
27377
|
+
|
|
27378
|
+
class Tooltip extends Module{
|
|
27379
|
+
|
|
27380
|
+
constructor(table){
|
|
27381
|
+
super(table);
|
|
27382
|
+
|
|
27383
|
+
this.tooltipSubscriber = null,
|
|
27384
|
+
this.headerSubscriber = null,
|
|
27385
|
+
|
|
27386
|
+
this.timeout = null;
|
|
27387
|
+
this.popupInstance = null;
|
|
27388
|
+
|
|
27389
|
+
this.registerTableOption("tooltipGenerationMode", undefined); //deprecated
|
|
27390
|
+
this.registerTableOption("tooltipDelay", 300);
|
|
27391
|
+
|
|
27392
|
+
this.registerColumnOption("tooltip");
|
|
27393
|
+
this.registerColumnOption("headerTooltip");
|
|
27394
|
+
}
|
|
27395
|
+
|
|
27396
|
+
initialize(){
|
|
25786
27397
|
this.deprecatedOptionsCheck();
|
|
25787
27398
|
|
|
25788
27399
|
this.subscribe("column-init", this.initializeColumn.bind(this));
|
|
@@ -25929,6 +27540,17 @@
|
|
|
25929
27540
|
return isNaN(value);
|
|
25930
27541
|
},
|
|
25931
27542
|
|
|
27543
|
+
//must be alphanumeric
|
|
27544
|
+
alphanumeric: function(cell, value, parameters){
|
|
27545
|
+
if(value === "" || value === null || typeof value === "undefined"){
|
|
27546
|
+
return true;
|
|
27547
|
+
}
|
|
27548
|
+
|
|
27549
|
+
var reg = new RegExp(/^[a-z0-9]+$/i);
|
|
27550
|
+
|
|
27551
|
+
return reg.test(value);
|
|
27552
|
+
},
|
|
27553
|
+
|
|
25932
27554
|
//maximum value
|
|
25933
27555
|
max: function(cell, value, parameters){
|
|
25934
27556
|
if(value === "" || value === null || typeof value === "undefined"){
|
|
@@ -26365,6 +27987,7 @@
|
|
|
26365
27987
|
ResponsiveLayoutModule: ResponsiveLayout,
|
|
26366
27988
|
SelectRowModule: SelectRow,
|
|
26367
27989
|
SortModule: Sort,
|
|
27990
|
+
SelectRangeModule: SelectRange,
|
|
26368
27991
|
TooltipModule: Tooltip,
|
|
26369
27992
|
ValidateModule: Validate
|
|
26370
27993
|
});
|