@progress/kendo-angular-pivotgrid 21.4.1-develop.1 → 22.0.0-develop.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/configurator/chip-menu/chip-menu-item-base.d.ts +1 -1
- package/data-binding/base-binding-directive.d.ts +1 -1
- package/fesm2022/progress-kendo-angular-pivotgrid.mjs +120 -120
- package/localization/messages.d.ts +1 -1
- package/package.json +18 -26
- package/schematics/ngAdd/index.js +2 -2
- package/esm2022/configurator/chip-kb-nav.directive.mjs +0 -69
- package/esm2022/configurator/chip-menu/chip-menu-container.component.mjs +0 -51
- package/esm2022/configurator/chip-menu/chip-menu-filter.component.mjs +0 -135
- package/esm2022/configurator/chip-menu/chip-menu-item-base.mjs +0 -40
- package/esm2022/configurator/chip-menu/chip-menu-item-content-template.directive.mjs +0 -29
- package/esm2022/configurator/chip-menu/chip-menu-item.component.mjs +0 -206
- package/esm2022/configurator/chip-menu/chip-menu-item.directive.mjs +0 -98
- package/esm2022/configurator/chip-menu/chip-menu-reorder.component.mjs +0 -198
- package/esm2022/configurator/chip-menu/chip-menu-sort.component.mjs +0 -104
- package/esm2022/configurator/chip-menu/chip-menu.component.mjs +0 -165
- package/esm2022/configurator/chip-menu/chip-menu.service.mjs +0 -40
- package/esm2022/configurator/chip-menu/filtering/filter-menu-container.component.mjs +0 -186
- package/esm2022/configurator/chip-menu/filtering/filter-menu-dropdownlist.directive.mjs +0 -44
- package/esm2022/configurator/chip-menu/filtering/menu-tabbing.service.mjs +0 -20
- package/esm2022/configurator/chip-menu/filtering/string-filter-menu.component.mjs +0 -148
- package/esm2022/configurator/chip-menu/single-popup.service.mjs +0 -136
- package/esm2022/configurator/configurator.component.mjs +0 -806
- package/esm2022/configurator/configurator.service.mjs +0 -53
- package/esm2022/configurator/draggable.directive.mjs +0 -131
- package/esm2022/configurator/drop-cue.service.mjs +0 -86
- package/esm2022/configurator/drop-target.directive.mjs +0 -190
- package/esm2022/data-binding/base-binding-directive.mjs +0 -164
- package/esm2022/data-binding/local-binding.directive.mjs +0 -107
- package/esm2022/data-binding/olap-binding.directive.mjs +0 -204
- package/esm2022/data-binding/pivotgrid-data.service.mjs +0 -76
- package/esm2022/directives.mjs +0 -97
- package/esm2022/index.mjs +0 -28
- package/esm2022/localization/custom-messages.component.mjs +0 -57
- package/esm2022/localization/localized-messages.directive.mjs +0 -39
- package/esm2022/localization/messages.mjs +0 -254
- package/esm2022/localization/pivot-localization.service.mjs +0 -30
- package/esm2022/models/configuration-change-event.mjs +0 -37
- package/esm2022/models/configurator-chipmenu-reorder-target.mjs +0 -5
- package/esm2022/models/configurator-orientation.mjs +0 -5
- package/esm2022/models/configurator-position.mjs +0 -5
- package/esm2022/models/configurator-settings.mjs +0 -21
- package/esm2022/models/data-row-item.mjs +0 -5
- package/esm2022/models/drop-section.mjs +0 -5
- package/esm2022/models/drop-target.mjs +0 -5
- package/esm2022/models/expanded-change-event.mjs +0 -29
- package/esm2022/models/expanded-state-action.mjs +0 -5
- package/esm2022/models/loader-settings.mjs +0 -5
- package/esm2022/models/virtualization-settings.mjs +0 -25
- package/esm2022/package-metadata.mjs +0 -16
- package/esm2022/pivotgrid.component.mjs +0 -729
- package/esm2022/pivotgrid.module.mjs +0 -87
- package/esm2022/progress-kendo-angular-pivotgrid.mjs +0 -8
- package/esm2022/rendering/pivotgrid-cell.directive.mjs +0 -247
- package/esm2022/rendering/pivotgrid-table.component.mjs +0 -386
- package/esm2022/rendering/templates/pivotgrid-cell-template.directive.mjs +0 -44
- package/esm2022/rendering/templates/pivotgrid-column-header-cell-template.directive.mjs +0 -44
- package/esm2022/rendering/templates/pivotgrid-row-header-cell-template.directive.mjs +0 -44
- package/esm2022/rendering/templates/pivotgrid-value-cell-template.directive.mjs +0 -43
- package/esm2022/util.mjs +0 -223
- package/esm2022/virtual/scroll.service.mjs +0 -18
- package/esm2022/virtual/scrollable-container.mjs +0 -128
package/esm2022/util.mjs
DELETED
|
@@ -1,223 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
const EMPTY_REGEX = /^\s*$/;
|
|
6
|
-
/**
|
|
7
|
-
* @hidden
|
|
8
|
-
*/
|
|
9
|
-
export const isPresent = (value) => value !== null && value !== undefined;
|
|
10
|
-
/**
|
|
11
|
-
* @hidden
|
|
12
|
-
*/
|
|
13
|
-
export const isBlank = (value) => value === null || value === undefined;
|
|
14
|
-
/**
|
|
15
|
-
* @hidden
|
|
16
|
-
*/
|
|
17
|
-
export const isNullOrEmptyString = (value) => isBlank(value) || EMPTY_REGEX.test(value);
|
|
18
|
-
/**
|
|
19
|
-
* @hidden
|
|
20
|
-
* Returns whether two arrays contain the same values.
|
|
21
|
-
* Assumes array elements are primitive types
|
|
22
|
-
*/
|
|
23
|
-
export const areSameArrays = (a1, a2) => {
|
|
24
|
-
const areArrays = (isPresent(a1) && Array.isArray(a1) && isPresent(a2) && Array.isArray(a2));
|
|
25
|
-
const areOfEqualLength = a1.length === a2.length;
|
|
26
|
-
if (!areArrays || !areOfEqualLength) {
|
|
27
|
-
return false;
|
|
28
|
-
}
|
|
29
|
-
for (let i = 0; i < a1.length; i++) {
|
|
30
|
-
if (a1[i] !== a2[i]) {
|
|
31
|
-
return false;
|
|
32
|
-
}
|
|
33
|
-
}
|
|
34
|
-
return true;
|
|
35
|
-
};
|
|
36
|
-
/**
|
|
37
|
-
* @hidden
|
|
38
|
-
*/
|
|
39
|
-
export const wheelDelta = (e, axis) => {
|
|
40
|
-
const delta = e[`wheelDelta${axis}`];
|
|
41
|
-
if (e.wheelDelta && (delta === undefined || delta)) {
|
|
42
|
-
return e.wheelDelta;
|
|
43
|
-
}
|
|
44
|
-
if (e.detail && e.axis === e[axis === 'X' ? 'HORIZONTAL_AXIS' : 'VERTICAL_AXIS']) {
|
|
45
|
-
return (-e.detail) * 10;
|
|
46
|
-
}
|
|
47
|
-
return 0;
|
|
48
|
-
};
|
|
49
|
-
/**
|
|
50
|
-
* @hidden
|
|
51
|
-
*/
|
|
52
|
-
export const syncScroll = (source, targets) => {
|
|
53
|
-
const sourceScrollTop = source.scrollTop;
|
|
54
|
-
const sourceScrollLeft = source.scrollLeft;
|
|
55
|
-
const targetScrollTop = targets[0].scrollTop;
|
|
56
|
-
const targetScrollLeft = targets[1].scrollLeft;
|
|
57
|
-
const syncVertically = sourceScrollTop !== targetScrollTop;
|
|
58
|
-
const syncHorizontally = sourceScrollLeft !== targetScrollLeft;
|
|
59
|
-
if (syncVertically) {
|
|
60
|
-
targets[0].scrollTop = sourceScrollTop;
|
|
61
|
-
}
|
|
62
|
-
else if (syncHorizontally) {
|
|
63
|
-
targets[1].scrollLeft = sourceScrollLeft;
|
|
64
|
-
}
|
|
65
|
-
};
|
|
66
|
-
/**
|
|
67
|
-
* @hidden
|
|
68
|
-
*/
|
|
69
|
-
export const syncWheel = (event, tables, prop, axis) => {
|
|
70
|
-
const delta = axis === 'Y' ? -(wheelDelta(event, axis)) : wheelDelta(event, axis);
|
|
71
|
-
if (delta) {
|
|
72
|
-
tables[0][prop] =
|
|
73
|
-
tables[1][prop] += delta;
|
|
74
|
-
}
|
|
75
|
-
};
|
|
76
|
-
/**
|
|
77
|
-
* @hidden
|
|
78
|
-
*/
|
|
79
|
-
const getDocument = element => element.ownerDocument.documentElement;
|
|
80
|
-
/**
|
|
81
|
-
* @hidden
|
|
82
|
-
*/
|
|
83
|
-
const getWindow = element => element.ownerDocument.defaultView;
|
|
84
|
-
/**
|
|
85
|
-
* @hidden
|
|
86
|
-
*/
|
|
87
|
-
export const offset = element => {
|
|
88
|
-
const { clientTop, clientLeft } = getDocument(element);
|
|
89
|
-
const { pageYOffset, pageXOffset } = getWindow(element);
|
|
90
|
-
const { top, left } = element.getBoundingClientRect();
|
|
91
|
-
return {
|
|
92
|
-
top: top + pageYOffset - clientTop,
|
|
93
|
-
left: left + pageXOffset - clientLeft
|
|
94
|
-
};
|
|
95
|
-
};
|
|
96
|
-
/**
|
|
97
|
-
* @hidden
|
|
98
|
-
*/
|
|
99
|
-
export const matchAriaAttributes = (wrapper) => {
|
|
100
|
-
const rowHeaderRows = wrapper.querySelectorAll('.k-pivotgrid-row-headers .k-pivotgrid-row');
|
|
101
|
-
const rowHeaderCols = rowHeaderRows.length ?
|
|
102
|
-
Array.from(rowHeaderRows[0]?.children)?.reduce((acc, curr) => acc += (+curr.getAttribute('colspan')), 0) : 0;
|
|
103
|
-
const colHeaderRows = wrapper.querySelectorAll('.k-pivotgrid-column-headers tr');
|
|
104
|
-
const colHeaderCells = wrapper.querySelectorAll('.k-pivotgrid-column-headers th');
|
|
105
|
-
const valueTableCells = wrapper.querySelectorAll('.k-pivotgrid-values td');
|
|
106
|
-
const emptyCell = wrapper.querySelector('.k-pivotgrid-empty-cell');
|
|
107
|
-
emptyCell.setAttribute('aria-rowspan', colHeaderRows.length.toString());
|
|
108
|
-
emptyCell.setAttribute('aria-colspan', rowHeaderCols.toString());
|
|
109
|
-
const firstColHeadersRow = colHeaderRows[0];
|
|
110
|
-
const firstColHeaderRowCellsIds = Array.from(firstColHeadersRow?.children).map(el => el.getAttribute('id')).join(' ');
|
|
111
|
-
firstColHeadersRow.setAttribute('aria-owns', `${emptyCell.getAttribute('id')} ${firstColHeaderRowCellsIds}`);
|
|
112
|
-
rowHeaderRows.forEach((row, index) => {
|
|
113
|
-
const valueCellsIds = filterAndMap(Array.from(valueTableCells), c => c.getAttribute('id')?.split('-')[4] === (index + 1).toString(), c => c.getAttribute('id'));
|
|
114
|
-
row.setAttribute('aria-owns', valueCellsIds.join(' '));
|
|
115
|
-
});
|
|
116
|
-
valueTableCells.forEach(cell => {
|
|
117
|
-
const cellColIndex = +cell.getAttribute('id')?.split('-')[5];
|
|
118
|
-
const colHeaderCellsIds = filterAndMap(Array.from(colHeaderCells), c => {
|
|
119
|
-
const headerCellColIndex = +c.getAttribute('id')?.split('-')[5];
|
|
120
|
-
const headerCellColspan = +c.getAttribute('colspan');
|
|
121
|
-
const colIndexIsEqual = cellColIndex === headerCellColIndex;
|
|
122
|
-
const cellColIndexIsWithinHeaderCellRange = headerCellColIndex < cellColIndex && headerCellColspan > 1 && (headerCellColIndex + headerCellColspan - 1 >= cellColIndex);
|
|
123
|
-
return colIndexIsEqual || cellColIndexIsWithinHeaderCellRange;
|
|
124
|
-
}, c => c.getAttribute('id'));
|
|
125
|
-
colHeaderCellsIds.length && cell.setAttribute('aria-describedby', colHeaderCellsIds.join(' '));
|
|
126
|
-
});
|
|
127
|
-
};
|
|
128
|
-
/**
|
|
129
|
-
* @hidden
|
|
130
|
-
*/
|
|
131
|
-
export const position = (target, before) => {
|
|
132
|
-
const targetRect = offset(target);
|
|
133
|
-
const { offsetWidth, offsetHeight } = target;
|
|
134
|
-
const left = targetRect.left + (before ? 0 : offsetWidth);
|
|
135
|
-
const top = targetRect.top + offsetHeight / 2;
|
|
136
|
-
return { left, top };
|
|
137
|
-
};
|
|
138
|
-
/**
|
|
139
|
-
* @hidden
|
|
140
|
-
*/
|
|
141
|
-
export const filterAndMap = (arr, predicate, mapper) => arr.reduce((acc, curr) => predicate(curr) ? [...acc, mapper(curr)] : acc, []);
|
|
142
|
-
/**
|
|
143
|
-
* @hidden
|
|
144
|
-
*/
|
|
145
|
-
export const cloneDate = (date) => date ? new Date(date.getTime()) : null;
|
|
146
|
-
/**
|
|
147
|
-
* @hidden
|
|
148
|
-
*/
|
|
149
|
-
export function clone(obj) {
|
|
150
|
-
const result = {};
|
|
151
|
-
cloneObject(obj, result);
|
|
152
|
-
return result;
|
|
153
|
-
}
|
|
154
|
-
/**
|
|
155
|
-
* @hidden
|
|
156
|
-
*/
|
|
157
|
-
export function cloneObject(obj, result) {
|
|
158
|
-
for (const field in obj) {
|
|
159
|
-
if (field === '__proto__' || field === 'constructor' || field === 'prototype') {
|
|
160
|
-
continue;
|
|
161
|
-
}
|
|
162
|
-
if (obj.hasOwnProperty(field)) {
|
|
163
|
-
const value = obj[field];
|
|
164
|
-
result[field] = cloneValue(value, result[field]);
|
|
165
|
-
}
|
|
166
|
-
}
|
|
167
|
-
}
|
|
168
|
-
/**
|
|
169
|
-
* @hidden
|
|
170
|
-
*/
|
|
171
|
-
export function cloneValue(value, nextValue) {
|
|
172
|
-
if (Array.isArray(value)) {
|
|
173
|
-
return cloneArray(value);
|
|
174
|
-
}
|
|
175
|
-
else if (value instanceof Date) {
|
|
176
|
-
return cloneDate(value);
|
|
177
|
-
}
|
|
178
|
-
else if (value && typeof value === 'object') {
|
|
179
|
-
const newNextValue = nextValue || {};
|
|
180
|
-
cloneObject(value, newNextValue);
|
|
181
|
-
return newNextValue;
|
|
182
|
-
}
|
|
183
|
-
return value;
|
|
184
|
-
}
|
|
185
|
-
/**
|
|
186
|
-
* @hidden
|
|
187
|
-
*/
|
|
188
|
-
export function cloneArray(array) {
|
|
189
|
-
return array.map(value => cloneValue(value, undefined));
|
|
190
|
-
}
|
|
191
|
-
/**
|
|
192
|
-
* @hidden
|
|
193
|
-
*/
|
|
194
|
-
export const swapItems = (arr, i1, i2) => {
|
|
195
|
-
const temp = arr[i1];
|
|
196
|
-
arr[i1] = arr[i2];
|
|
197
|
-
arr[i2] = temp;
|
|
198
|
-
};
|
|
199
|
-
/**
|
|
200
|
-
* @hidden
|
|
201
|
-
*/
|
|
202
|
-
export const isVisible = (el, container, offsetY, rtl) => {
|
|
203
|
-
const elTop = el.offsetTop;
|
|
204
|
-
const elBottom = elTop + el.clientHeight;
|
|
205
|
-
let rect;
|
|
206
|
-
let containerRect;
|
|
207
|
-
if (rtl) {
|
|
208
|
-
rect = el.getBoundingClientRect();
|
|
209
|
-
containerRect = container.getBoundingClientRect();
|
|
210
|
-
}
|
|
211
|
-
const elLeft = rtl ? rect.left : el.offsetLeft;
|
|
212
|
-
const elRight = rtl ? rect.right : elLeft + el.clientWidth;
|
|
213
|
-
const containerTop = container.scrollTop;
|
|
214
|
-
const containerBottom = containerTop + container.clientHeight;
|
|
215
|
-
const containerLeft = rtl ? containerRect.left : container.scrollLeft;
|
|
216
|
-
const containerRight = rtl ? containerRect.right : containerLeft + container.clientWidth;
|
|
217
|
-
const visibleY = elTop >= containerTop - offsetY && elBottom <= containerBottom - offsetY;
|
|
218
|
-
const visibleX = rtl ? elRight <= containerRight && elLeft >= containerLeft : elLeft >= containerLeft && elRight <= containerRight;
|
|
219
|
-
return {
|
|
220
|
-
visibleX,
|
|
221
|
-
visibleY
|
|
222
|
-
};
|
|
223
|
-
};
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
import { Injectable } from '@angular/core';
|
|
6
|
-
import * as i0 from "@angular/core";
|
|
7
|
-
/**
|
|
8
|
-
* @hidden
|
|
9
|
-
*/
|
|
10
|
-
export class PivotGridScrollService {
|
|
11
|
-
virtualScrolling = false;
|
|
12
|
-
pivotGrid;
|
|
13
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PivotGridScrollService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
14
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PivotGridScrollService });
|
|
15
|
-
}
|
|
16
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PivotGridScrollService, decorators: [{
|
|
17
|
-
type: Injectable
|
|
18
|
-
}] });
|
|
@@ -1,128 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
/**
|
|
6
|
-
* @hidden
|
|
7
|
-
*/
|
|
8
|
-
export class ScrollableTable {
|
|
9
|
-
element;
|
|
10
|
-
handlers;
|
|
11
|
-
options;
|
|
12
|
-
startRow = 0;
|
|
13
|
-
endRow;
|
|
14
|
-
startCol = 0;
|
|
15
|
-
endCol;
|
|
16
|
-
renderedRows;
|
|
17
|
-
renderedCols;
|
|
18
|
-
total;
|
|
19
|
-
totalCols;
|
|
20
|
-
rtl;
|
|
21
|
-
visibleRows;
|
|
22
|
-
visibleCols;
|
|
23
|
-
lastKnownScrollPosition = { top: 0, left: 0 };
|
|
24
|
-
offsetFirst = 0;
|
|
25
|
-
stretcher;
|
|
26
|
-
rect;
|
|
27
|
-
constructor(element, handlers, options) {
|
|
28
|
-
this.element = element;
|
|
29
|
-
this.handlers = handlers;
|
|
30
|
-
this.options = options;
|
|
31
|
-
this.initialize();
|
|
32
|
-
}
|
|
33
|
-
onNewData(recalculateSize = false) {
|
|
34
|
-
this.offsetFirst = this.startRow * this.options.itemHeight;
|
|
35
|
-
this.renderedRows = Math.min(this.options.renderedRows || Math.ceil(this.visibleRows * 3), this.total);
|
|
36
|
-
this.endRow = this.startRow + this.renderedRows;
|
|
37
|
-
this.renderedCols = Math.min(this.options.renderedCols || Math.ceil(this.visibleCols * 1.3), this.totalCols);
|
|
38
|
-
this.element.querySelector('table').style.transform = `translateY(${this.offsetFirst}px)`;
|
|
39
|
-
recalculateSize && this.recalculateSize();
|
|
40
|
-
}
|
|
41
|
-
destroy() {
|
|
42
|
-
this.element.removeEventListener('scroll', this.scrollHandler);
|
|
43
|
-
this.element.removeEventListener('scrollend', this.scrollEndHandler);
|
|
44
|
-
this.element.removeChild(this.stretcher);
|
|
45
|
-
}
|
|
46
|
-
initialize() {
|
|
47
|
-
this.rtl = this.options.rtl;
|
|
48
|
-
this.rect = this.element.getBoundingClientRect();
|
|
49
|
-
// visible rows and cols
|
|
50
|
-
this.visibleRows = Math.ceil(this.rect.height / this.options.itemHeight);
|
|
51
|
-
this.visibleCols = Math.ceil(this.rect.width / this.options.itemWidth);
|
|
52
|
-
// current totals
|
|
53
|
-
this.total = this.options.total;
|
|
54
|
-
this.totalCols = this.options.totalCols;
|
|
55
|
-
const totalHeight = this.total * this.options.itemHeight;
|
|
56
|
-
const totalWidth = this.totalCols * this.options.itemWidth;
|
|
57
|
-
// "page" size (rows and cols)
|
|
58
|
-
this.renderedRows = Math.min(this.options.renderedRows || Math.ceil(this.visibleRows * 3), this.total);
|
|
59
|
-
this.renderedCols = Math.min(this.options.renderedCols || Math.ceil(this.visibleCols * 1.3), this.totalCols);
|
|
60
|
-
// start and end row/col
|
|
61
|
-
this.startRow = 0;
|
|
62
|
-
this.startCol = 0;
|
|
63
|
-
this.endRow = this.startRow + this.renderedRows;
|
|
64
|
-
this.endCol = this.startCol + this.renderedCols;
|
|
65
|
-
// element that ensures correct scrolling dimensions of the container
|
|
66
|
-
this.stretcher = document.createElement('DIV');
|
|
67
|
-
this.stretcher.style.height = `${totalHeight}px`;
|
|
68
|
-
this.stretcher.style.width = `${totalWidth}px`;
|
|
69
|
-
this.element.appendChild(this.stretcher);
|
|
70
|
-
this.element.addEventListener('scroll', this.scrollHandler);
|
|
71
|
-
this.element.addEventListener('scrollend', this.scrollEndHandler);
|
|
72
|
-
}
|
|
73
|
-
scrollHandler = () => {
|
|
74
|
-
const verticalDir = this.element.scrollTop - this.lastKnownScrollPosition.top;
|
|
75
|
-
const horizontalDir = Math.abs(this.element.scrollLeft) - this.lastKnownScrollPosition.left;
|
|
76
|
-
if (this.options.rowVirtualization) {
|
|
77
|
-
if (verticalDir > 0) {
|
|
78
|
-
if (this.element.scrollTop > (this.renderedRows * this.options.itemHeight + this.offsetFirst - this.rect.height)) {
|
|
79
|
-
this.startRow = Math.floor(this.element.scrollTop / this.options.itemHeight);
|
|
80
|
-
this.rowVirtualizationUpdate();
|
|
81
|
-
}
|
|
82
|
-
}
|
|
83
|
-
else {
|
|
84
|
-
if (this.element.scrollTop <= this.offsetFirst) {
|
|
85
|
-
this.startRow = Math.max(0, Math.ceil(this.element.scrollTop / this.options.itemHeight) - Math.ceil(this.options.renderedRows / 3));
|
|
86
|
-
this.rowVirtualizationUpdate();
|
|
87
|
-
}
|
|
88
|
-
}
|
|
89
|
-
}
|
|
90
|
-
if (this.options.columnVirtualization) {
|
|
91
|
-
if (horizontalDir > 0) {
|
|
92
|
-
if (Math.abs(this.element.scrollLeft) - (Math.max(this.startCol - 1, 0) * (this.options.colWidth || 200)) > (this.options.colWidth || 200)) {
|
|
93
|
-
this.startCol = Math.min(Math.max(Math.floor(Math.abs(this.element.scrollLeft) / this.options.itemWidth) - 1, 0), this.totalCols - this.renderedCols);
|
|
94
|
-
this.handlers.onScroll();
|
|
95
|
-
}
|
|
96
|
-
}
|
|
97
|
-
else {
|
|
98
|
-
if (Math.abs(this.element.scrollLeft) <= (this.startCol + 1) * (this.options.colWidth || 200)) {
|
|
99
|
-
this.startCol = Math.min(Math.max(Math.floor(Math.abs(this.element.scrollLeft) / this.options.itemWidth) - 1, 0), this.totalCols - this.renderedCols);
|
|
100
|
-
this.handlers.onScroll();
|
|
101
|
-
}
|
|
102
|
-
}
|
|
103
|
-
}
|
|
104
|
-
this.lastKnownScrollPosition = {
|
|
105
|
-
top: this.element.scrollTop,
|
|
106
|
-
left: Math.abs(this.element.scrollLeft)
|
|
107
|
-
};
|
|
108
|
-
};
|
|
109
|
-
scrollEndHandler = () => {
|
|
110
|
-
this.handlers.onScrollEnd();
|
|
111
|
-
};
|
|
112
|
-
recalculateSize() {
|
|
113
|
-
const totalHeight = this.total * this.options.itemHeight;
|
|
114
|
-
const totalWidth = this.totalCols * this.options.itemWidth;
|
|
115
|
-
this.stretcher.style.height = `${totalHeight}px`;
|
|
116
|
-
this.stretcher.style.width = `${totalWidth}px`;
|
|
117
|
-
this.rect = this.element.getBoundingClientRect();
|
|
118
|
-
// visible rows and cols
|
|
119
|
-
this.visibleRows = Math.ceil(this.rect.height / this.options.itemHeight);
|
|
120
|
-
this.visibleCols = Math.ceil(this.rect.width / this.options.itemWidth);
|
|
121
|
-
}
|
|
122
|
-
rowVirtualizationUpdate() {
|
|
123
|
-
this.endRow = Math.min(this.startRow + this.renderedRows, this.total);
|
|
124
|
-
this.offsetFirst = this.startRow * this.options.itemHeight;
|
|
125
|
-
this.element.querySelector('table').style.transform = `translateY(${this.offsetFirst}px)`;
|
|
126
|
-
this.handlers.onScroll();
|
|
127
|
-
}
|
|
128
|
-
}
|