tabulator-tables 5.0.9 → 5.0.10

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "tabulator-tables",
3
- "version": "5.0.9",
3
+ "version": "5.0.10",
4
4
  "description": "Interactive table generation JavaScript library",
5
5
  "style": "dist/css/tabulator.css",
6
6
  "main": "dist/js/tabulator.js",
@@ -703,7 +703,7 @@ class Column extends CoreFeature{
703
703
  cell.hide();
704
704
  });
705
705
 
706
- this.dispatch("column-hide", this);
706
+ this.dispatch("column-hide", this, responsiveToggle);
707
707
 
708
708
  if(!silent){
709
709
  this.dispatchExternal("columnVisibilityChanged", this.getComponent(), false);
@@ -79,7 +79,7 @@ export default class Renderer extends CoreFeature{
79
79
  }
80
80
 
81
81
  scrollToRowNearestTop(row){
82
- //determin weather the row is nearest the top or bottom of the table, retur true for top or false for bottom
82
+ //determine weather the row is nearest the top or bottom of the table, retur true for top or false for bottom
83
83
  }
84
84
 
85
85
  visibleRows(includingBuffer){
@@ -4,157 +4,157 @@ import Helpers from '../../tools/Helpers.js';
4
4
  export default class VirtualDomHorizontal extends Renderer{
5
5
  constructor(table){
6
6
  super(table);
7
-
7
+
8
8
  this.leftCol = 0;
9
9
  this.rightCol = 0;
10
10
  this.scrollLeft = 0;
11
-
11
+
12
12
  this.vDomScrollPosLeft = 0;
13
13
  this.vDomScrollPosRight = 0;
14
-
14
+
15
15
  this.vDomPadLeft = 0;
16
16
  this.vDomPadRight = 0;
17
-
17
+
18
18
  this.fitDataColAvg = 0;
19
-
19
+
20
20
  this.window = 200; //pixel margin to make column visible before it is shown on screen
21
-
21
+
22
22
  this.initialized = false;
23
-
23
+
24
24
  this.columns = [];
25
25
  }
26
-
26
+
27
27
  initialize(){
28
28
  this.compatabilityCheck();
29
29
  }
30
-
30
+
31
31
  compatabilityCheck(){
32
32
  var columns = this.options("columns"),
33
33
  frozen = false,
34
34
  ok = true;
35
-
35
+
36
36
  if(this.options("layout") == "fitDataTable"){
37
- console.warn("Horizontal Vitrual DOM is not compatible with fitDataTable layout mode");
37
+ console.warn("Horizontal Virtual DOM is not compatible with fitDataTable layout mode");
38
38
  ok = false;
39
39
  }
40
-
40
+
41
41
  if(this.options("responsiveLayout")){
42
- console.warn("Horizontal Vitrual DOM is not compatible with responsive columns");
42
+ console.warn("Horizontal Virtual DOM is not compatible with responsive columns");
43
43
  ok = false;
44
44
  }
45
-
45
+
46
46
  if(this.options("rtl")){
47
- console.warn("Horizontal Vitrual DOM is not currently compatible with RTL text direction");
47
+ console.warn("Horizontal Virtual DOM is not currently compatible with RTL text direction");
48
48
  ok = false;
49
49
  }
50
-
50
+
51
51
  if(columns){
52
52
  frozen = columns.find((col) => {
53
53
  return col.frozen;
54
54
  });
55
-
55
+
56
56
  if(frozen){
57
- console.warn("Horizontal Vitrual DOM is not compatible with frozen columns");
57
+ console.warn("Horizontal Virtual DOM is not compatible with frozen columns");
58
58
  ok = false;
59
59
  }
60
60
  }
61
-
61
+
62
62
  // if(!ok){
63
63
  // options.virtualDomHoz = false;
64
64
  // }
65
-
65
+
66
66
  return ok;
67
67
  }
68
-
68
+
69
69
  //////////////////////////////////////
70
70
  ///////// Public Functions ///////////
71
71
  //////////////////////////////////////
72
-
72
+
73
73
  renderColumns(row, force){
74
74
  this.dataChange();
75
75
  }
76
-
76
+
77
77
  scrollColumns(left, dir){
78
78
  if(this.scrollLeft != left){
79
79
  this.scrollLeft = left;
80
-
80
+
81
81
  this.scroll(left - (this.vDomScrollPosLeft + this.window));
82
82
  }
83
83
  }
84
-
85
- rerenderColumns(update, blockRedraw){
84
+
85
+ rerenderColumns(update, blockRedraw){
86
86
  var old = {
87
87
  cols:this.columns,
88
88
  leftCol:this.leftCol,
89
89
  rightCol:this.rightCol,
90
90
  };
91
-
91
+
92
92
  if(update && !this.initialized){
93
93
  return;
94
94
  }
95
-
95
+
96
96
  this.clear();
97
-
97
+
98
98
  this.scrollLeft = this.elementVertical.scrollLeft;
99
-
99
+
100
100
  this.vDomScrollPosLeft = this.scrollLeft - this.window;
101
101
  this.vDomScrollPosRight = this.scrollLeft + this.elementVertical.clientWidth + this.window;
102
-
102
+
103
103
  var colPos = 0;
104
-
104
+
105
105
  this.table.columnManager.columnsByIndex.forEach((column) => {
106
106
  var config = {};
107
-
107
+
108
108
  if(column.visible){
109
109
  var width = column.getWidth();
110
-
110
+
111
111
  config.leftPos = colPos;
112
112
  config.rightPos = colPos + width;
113
-
113
+
114
114
  config.width = width;
115
-
115
+
116
116
  if (this.options("layout") === "fitData") {
117
117
  config.fitDataCheck = true;
118
118
  }
119
-
119
+
120
120
  if((colPos + width > this.vDomScrollPosLeft) && (colPos < this.vDomScrollPosRight)){
121
- //column is visible
122
-
123
- if(this.leftCol == -1){
124
- this.leftCol = this.columns.length;
125
- this.vDomPadLeft = colPos;
126
- }
127
-
128
- this.rightCol = this.columns.length;
129
- }else{
130
- // column is hidden
131
- if(this.leftCol !== -1){
132
- this.vDomPadRight += width;
133
- }
134
- }
135
-
136
- this.columns.push(column);
137
-
138
- column.modules.vdomHoz = config;
139
-
140
- colPos += width;
141
- }
142
- });
143
-
121
+ //column is visible
122
+
123
+ if(this.leftCol == -1){
124
+ this.leftCol = this.columns.length;
125
+ this.vDomPadLeft = colPos;
126
+ }
127
+
128
+ this.rightCol = this.columns.length;
129
+ }else{
130
+ // column is hidden
131
+ if(this.leftCol !== -1){
132
+ this.vDomPadRight += width;
133
+ }
134
+ }
135
+
136
+ this.columns.push(column);
137
+
138
+ column.modules.vdomHoz = config;
139
+
140
+ colPos += width;
141
+ }
142
+ });
143
+
144
144
  this.tableElement.style.paddingLeft = this.vDomPadLeft + "px";
145
145
  this.tableElement.style.paddingRight = this.vDomPadRight + "px";
146
-
146
+
147
147
  this.initialized = true;
148
-
148
+
149
149
  if(!blockRedraw){
150
150
  if(!update || this.reinitChanged(old)){
151
- this.renitializeRows();
151
+ this.reinitializeRows();
152
152
  }
153
153
  }
154
-
154
+
155
155
  this.elementVertical.scrollLeft = this.scrollLeft;
156
156
  }
157
-
157
+
158
158
  renderRowCells(row){
159
159
  if(this.initialized){
160
160
  this.initializeRow(row);
@@ -165,88 +165,88 @@ export default class VirtualDomHorizontal extends Renderer{
165
165
  });
166
166
  }
167
167
  }
168
-
168
+
169
169
  rerenderRowCells(row, force){
170
170
  this.reinitializeRow(row, force);
171
171
  }
172
-
172
+
173
173
  reinitializeColumnWidths(columns){
174
174
  for(let i = this.leftCol; i <= this.rightCol; i++){
175
175
  this.columns[i].reinitializeWidth();
176
176
  }
177
177
  }
178
-
178
+
179
179
  //////////////////////////////////////
180
180
  //////// Internal Rendering //////////
181
181
  //////////////////////////////////////
182
-
182
+
183
183
  deinitialize(){
184
184
  this.initialized = false;
185
185
  }
186
-
186
+
187
187
  clear(){
188
188
  this.columns = [];
189
-
189
+
190
190
  this.leftCol = -1;
191
191
  this.rightCol = 0;
192
-
192
+
193
193
  this.vDomScrollPosLeft = 0;
194
194
  this.vDomScrollPosRight = 0;
195
195
  this.vDomPadLeft = 0;
196
196
  this.vDomPadRight = 0;
197
197
  }
198
-
198
+
199
199
  dataChange(){
200
200
  var change = false,
201
201
  collsWidth = 0,
202
202
  colEnd = 0,
203
203
  group, row, rowEl;
204
-
204
+
205
205
  if(this.options("layout") === "fitData"){
206
206
  this.table.columnManager.columnsByIndex.forEach((column) => {
207
207
  if(!column.definition.width && column.visible){
208
208
  change = true;
209
209
  }
210
210
  });
211
-
211
+
212
212
  if(change){
213
213
  if(change && this.table.rowManager.getDisplayRows().length){
214
-
214
+
215
215
  this.vDomScrollPosRight = this.scrollLeft + this.elementVertical.clientWidth + this.window;
216
-
216
+
217
217
  var row = this.chain("rows-sample", [1], [], () => {
218
218
  return this.table.rowManager.getDisplayRows()[0];
219
219
  })[0];
220
-
220
+
221
221
  if(row){
222
-
222
+
223
223
  rowEl = row.getElement();
224
-
224
+
225
225
  row.generateCells();
226
-
226
+
227
227
  this.tableElement.appendChild(rowEl);
228
-
228
+
229
229
  for(var colEnd = 0; colEnd < row.cells.length; colEnd++){
230
230
  let cell = row.cells[colEnd];
231
231
  rowEl.appendChild(cell.getElement());
232
-
232
+
233
233
  cell.column.reinitializeWidth();
234
-
234
+
235
235
  collsWidth += cell.column.getWidth();
236
-
236
+
237
237
  if(collsWidth > this.vDomScrollPosRight){
238
238
  break;
239
239
  }
240
240
  }
241
-
241
+
242
242
  rowEl.parentNode.removeChild(rowEl);
243
-
243
+
244
244
  this.fitDataColAvg = Math.floor(collsWidth / (colEnd + 1));
245
-
245
+
246
246
  for(colEnd; colEnd < this.table.columnManager.columnsByIndex.length; colEnd++){
247
247
  this.table.columnManager.columnsByIndex[colEnd].setWidth(this.fitDataColAvg);
248
248
  }
249
-
249
+
250
250
  this.rerenderColumns(false, true);
251
251
  }
252
252
  }
@@ -258,34 +258,34 @@ export default class VirtualDomHorizontal extends Renderer{
258
258
  }
259
259
  }
260
260
  }
261
-
261
+
262
262
  reinitChanged(old){
263
263
  var match = true;
264
-
264
+
265
265
  if(old.cols.length !== this.columns.length || old.leftCol !== this.leftCol || old.rightCol !== this.rightCol){
266
266
  return true;
267
267
  }
268
-
268
+
269
269
  old.cols.forEach((col, i) => {
270
270
  if(col !== this.columns[i]){
271
271
  match = false;
272
272
  }
273
273
  });
274
-
274
+
275
275
  return !match;
276
276
  }
277
-
278
- renitializeRows(){
277
+
278
+ reinitializeRows(){
279
279
  var rows = this.table.rowManager.getVisibleRows();
280
280
  rows.forEach((row) => {
281
281
  this.reinitializeRow(row, true);
282
282
  });
283
283
  }
284
-
284
+
285
285
  scroll(diff){
286
286
  this.vDomScrollPosLeft += diff;
287
287
  this.vDomScrollPosRight += diff;
288
-
288
+
289
289
  if(diff > (this.elementVertical.clientWidth * .8)){
290
290
  this.rerenderColumns();
291
291
  }else{
@@ -300,24 +300,23 @@ export default class VirtualDomHorizontal extends Renderer{
300
300
  }
301
301
  }
302
302
  }
303
-
303
+
304
304
  colPositionAdjust (start, end, diff){
305
305
  for(let i = start; i < end; i++){
306
306
  let column = this.columns[i];
307
-
307
+
308
308
  column.modules.vdomHoz.leftPos += diff;
309
309
  column.modules.vdomHoz.rightPos += diff;
310
310
  }
311
311
  }
312
-
312
+
313
313
  addColRight(){
314
314
  var column = this.columns[this.rightCol + 1],
315
315
  rows, newWidth, widthDiff;
316
-
316
+
317
317
  if(column && column.modules.vdomHoz.leftPos <= this.vDomScrollPosRight){
318
-
319
318
  rows = this.table.rowManager.getVisibleRows();
320
-
319
+
321
320
  rows.forEach((row) => {
322
321
  if(row.type !== "group"){
323
322
  var cell = row.getCell(column);
@@ -325,30 +324,30 @@ export default class VirtualDomHorizontal extends Renderer{
325
324
  cell.cellRendered();
326
325
  }
327
326
  });
328
-
327
+
329
328
  this.fitDataColActualWidthCheck(column);
330
-
329
+
331
330
  this.rightCol++;
332
-
331
+
333
332
  if(this.rightCol >= (this.columns.length - 1)){
334
333
  this.vDomPadRight = 0;
335
334
  }else{
336
335
  this.vDomPadRight -= column.getWidth();
337
336
  }
338
-
337
+
339
338
  this.tableElement.style.paddingRight = this.vDomPadRight + "px";
340
-
339
+
341
340
  this.addColRight();
342
341
  }
343
342
  }
344
-
343
+
345
344
  addColLeft(){
346
345
  var column = this.columns[this.leftCol - 1],
347
346
  rows;
348
-
347
+
349
348
  if(column && column.modules.vdomHoz.rightPos >= this.vDomScrollPosLeft){
350
349
  var rows = this.table.rowManager.getVisibleRows();
351
-
350
+
352
351
  rows.forEach((row) => {
353
352
  if(row.type !== "group"){
354
353
  var cell = row.getCell(column);
@@ -356,119 +355,125 @@ export default class VirtualDomHorizontal extends Renderer{
356
355
  cell.cellRendered();
357
356
  }
358
357
  });
359
-
358
+
360
359
  this.fitDataColActualWidthCheck(column);
361
-
360
+
362
361
  if(!this.leftCol){
363
362
  this.vDomPadLeft = 0;
364
363
  }else{
365
364
  this.vDomPadLeft -= column.getWidth();
366
365
  }
367
-
366
+
368
367
  this.tableElement.style.paddingLeft = this.vDomPadLeft + "px";
369
-
368
+
370
369
  this.leftCol--;
371
-
370
+
372
371
  this.addColLeft();
373
372
  }
374
373
  }
375
-
374
+
376
375
  removeColRight(column){
377
376
  var column = this.columns[this.rightCol],
378
377
  rows;
379
-
378
+
380
379
  if(column && column.modules.vdomHoz.leftPos > this.vDomScrollPosRight){
381
380
  rows = this.table.rowManager.getVisibleRows();
382
-
381
+
383
382
  column.modules.vdomHoz.visible = false;
384
-
383
+
385
384
  rows.forEach((row) => {
386
385
  if(row.type !== "group"){
387
386
  var cell = row.getCell(column);
388
387
  row.getElement().removeChild(cell.getElement());
389
388
  }
390
389
  });
391
-
390
+
392
391
  this.vDomPadRight += column.getWidth();
393
392
  this.tableElement.style.paddingRight = this.vDomPadRight + "px";
394
-
393
+
395
394
  this.rightCol --;
396
-
395
+
397
396
  this.removeColRight();
398
397
  }
399
398
  }
400
-
399
+
401
400
  removeColLeft(){
402
401
  var column = this.columns[this.leftCol],
403
402
  rows;
404
-
405
- if(column && column.modules.vdomHoz.rightPos < this.vDomScrollPosLeft){
406
-
403
+
404
+ if(column && column.modules.vdomHoz.rightPos < this.vDomScrollPosLeft){
407
405
  rows = this.table.rowManager.getVisibleRows();
408
-
406
+
409
407
  rows.forEach((row) => {
408
+ var cell, el;
409
+
410
410
  if(row.type !== "group"){
411
- var cell = row.getCell(column);
412
- if(cell.parentNode){
413
- row.getElement().removeChild(cell.getElement());
411
+ cell = row.getCell(column);
412
+
413
+ if(cell){
414
+ el = cell.getElement();
415
+
416
+ if(el.parentNode){
417
+ row.getElement().removeChild(el);
418
+ }
414
419
  }
415
420
  }
416
421
  });
417
-
422
+
418
423
  this.vDomPadLeft += column.getWidth();
419
424
  this.tableElement.style.paddingLeft = this.vDomPadLeft + "px";
420
-
425
+
421
426
  this.leftCol ++;
422
-
427
+
423
428
  this.removeColLeft();
424
429
  }
425
430
  }
426
-
431
+
427
432
  fitDataColActualWidthCheck(column){
428
433
  var newWidth, widthDiff;
429
-
434
+
430
435
  if(column.modules.vdomHoz.fitDataCheck){
431
436
  column.reinitializeWidth();
432
-
437
+
433
438
  newWidth = column.getWidth();
434
439
  widthDiff = newWidth - column.modules.vdomHoz.width;
435
-
440
+
436
441
  if(widthDiff){
437
442
  column.modules.vdomHoz.rightPos += widthDiff;
438
443
  column.modules.vdomHoz.width = newWidth;
439
444
  this.colPositionAdjust(this.rightCol + 2, this.columns.length, widthDiff);
440
445
  }
441
-
446
+
442
447
  column.modules.vdomHoz.fitDataCheck = false;
443
448
  }
444
449
  };
445
-
450
+
446
451
  initializeRow(row){
447
452
  if(row.type !== "group"){
448
453
  row.modules.vdomHoz = {
449
454
  leftCol:this.leftCol,
450
455
  rightCol:this.rightCol,
451
456
  };
452
-
457
+
453
458
  for(let i = this.leftCol; i <= this.rightCol; i++){
454
459
  let column = this.columns[i];
455
-
460
+
456
461
  if(column && column.visible){
457
462
  let cell = row.getCell(column);
458
-
463
+
459
464
  row.getElement().appendChild(cell.getElement());
460
465
  cell.cellRendered();
461
466
  }
462
467
  }
463
468
  }
464
469
  }
465
-
470
+
466
471
  reinitializeRow(row, force){
467
472
  if(row.type !== "group"){
468
473
  if(force || !row.modules.vdomHoz || row.modules.vdomHoz.leftCol !== this.leftCol || row.modules.vdomHoz.rightCol !== this.rightCol){
469
474
  var rowEl = row.getElement();
470
475
  while(rowEl.firstChild) rowEl.removeChild(rowEl.firstChild);
471
-
476
+
472
477
  this.initializeRow(row);
473
478
  }
474
479
  }
@@ -64,7 +64,7 @@ export default class DataLoader extends CoreFeature{
64
64
  data = JSON.parse(data);
65
65
  }
66
66
 
67
- if(this.confirm("data-loading", data, params, config, silent)){
67
+ if(this.confirm("data-loading", [data, params, config, silent])){
68
68
  this.loading = true;
69
69
 
70
70
  if(!silent){