| 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389 | 1×
1×
1×
1×
1795×
1795×
1795×
1795×
1795×
1795×
1795×
1795×
1795×
1795×
1×
1795×
1795×
1795×
1795×
1795×
1795×
1795×
1795×
1×
1781×
1781×
1781×
1781×
1781×
1781×
1781×
1781×
1×
27×
27×
1×
10×
10×
10×
9×
9×
9×
9×
1×
8×
9×
4×
9×
6×
9×
9×
6×
6×
9×
9×
9×
7×
1×
1×
144×
144×
144×
144×
3×
141×
141×
144×
29×
144×
144×
8×
144×
1×
10×
10×
19×
10×
1×
10×
7×
1×
17×
17×
15×
15×
15×
13×
13×
2×
2×
15×
1×
1114×
1114×
1114×
1114×
153×
153×
961×
1114×
1029×
1029×
1029×
1029×
165×
1029×
959×
1029×
243×
1114×
597×
1×
2204×
2204×
2204×
2204×
18×
263×
263×
40×
40×
18×
18×
1×
24×
24×
1×
13×
13×
13×
1×
2×
2×
2×
2×
2×
1×
111×
111×
111×
36×
36×
36×
36×
36×
36×
36×
111×
11×
11×
11×
11×
11×
11×
11×
11×
5×
5×
5×
5×
5×
5×
5×
3×
6×
1×
11×
1×
11×
111×
111×
15×
15×
15×
15×
1×
14×
3×
1×
2×
2×
2×
15×
111×
111×
111×
111×
111×
111×
1×
6×
1×
5×
5×
5×
5×
5×
5×
1×
7×
7×
7×
7×
5×
5×
2×
2×
2×
1×
5×
5×
1×
5×
11520×
11520×
1×
11524×
8646×
2×
1×
1×
2878×
2878×
2×
1×
1×
1×
2×
2×
2×
2×
2×
2×
2×
1×
2×
1×
1×
1×
1×
4150×
1×
1×
1×
12×
5×
12×
12×
1×
168×
168×
168×
168×
168×
159×
1×
1781×
1×
1×
| define(["require", "exports", "@syncfusion/ej2-base"], function (require, exports, ej2_base_1) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var ChartScroll = (function () {
function ChartScroll(parent) {
this.previousCount = -1;
this.isSetScrollLeft = false;
this.previousScroll = { top: 0, left: 0 };
this.isScrollArrowPressed = false;
this.scrollArrowDirection = null;
this.scrollArrowInterval = 0;
this.lastScrollLeft = 0;
this.parent = parent;
this.element = this.parent.ganttChartModule.scrollElement;
this.addEventListeners();
}
ChartScroll.prototype.addEventListeners = function () {
this.parent.on('grid-scroll', this.gridScrollHandler, this);
ej2_base_1.EventHandler.add(this.element, 'scroll', this.onScroll, this);
ej2_base_1.EventHandler.add(this.element, 'pointerdown', this.startHold, this);
ej2_base_1.EventHandler.add(this.element, 'pointerup', this.stopHold, this);
ej2_base_1.EventHandler.add(this.element, 'pointercancel', this.stopHold, this);
this.parent.treeGrid.grid.on('showGanttShimmer', this.updateShimmer, this);
this.parent.treeGrid.grid.on('removeGanttShimmer', this.removeShimmer, this);
this.parent.treeGrid.grid.on('virtualTransform', this.transformChange, this);
};
ChartScroll.prototype.removeEventListeners = function () {
ej2_base_1.EventHandler.remove(this.element, 'scroll', this.onScroll);
ej2_base_1.EventHandler.remove(this.element, 'pointerdown', this.startHold);
ej2_base_1.EventHandler.remove(this.element, 'pointerup', this.stopHold);
ej2_base_1.EventHandler.remove(this.element, 'pointercancel', this.stopHold);
this.parent.off('grid-scroll', this.gridScrollHandler);
this.parent.treeGrid.grid.off('showGanttShimmer', this.updateShimmer);
this.parent.treeGrid.grid.off('removeGanttShimmer', this.removeShimmer);
this.parent.treeGrid.grid.off('virtualTransform', this.transformChange);
};
ChartScroll.prototype.gridScrollHandler = function (args) {
this.element.scrollTop = ej2_base_1.getValue('top', args);
this.isFromTreeGrid = true;
};
ChartScroll.prototype.updateContent = function () {
var ganttElement = this.parent.element;
var currentCount = Math.round(this.element.scrollLeft / ganttElement.offsetWidth);
if (this.previousCount !== currentCount || this.parent.timelineModule['performedTimeSpanAction'] || this.parent.timelineModule.isZoomingAction) {
this.parent.timelineModule.isZoomingAction = false;
this.deleteTableElements();
this.parent.timelineModule.createTimelineSeries();
if (!this.parent.isLoad && this.parent.isReact && !ej2_base_1.isNullOrUndefined(this.parent.timelineTemplate)) {
this.parent.renderTemplates();
}
else {
void 0;
}
if (this.parent.gridLines === 'Vertical' || this.parent.gridLines === 'Both') {
this.parent['renderChartVerticalLines']();
}
if (this.parent.dayMarkersModule) {
this.parent.dayMarkersModule['eventMarkerRender'].renderEventMarkers();
}
this.parent.timelineModule['performedTimeSpanAction'] = false;
if (this.parent.dayMarkersModule) {
this.parent.dayMarkersModule.nonworkingDayRender.renderWeekends();
this.parent.dayMarkersModule.nonworkingDayRender.renderHolidays();
}
this.updateChartElementStyles();
this.previousCount = currentCount;
if (this.isSetScrollLeft) {
this.parent.ganttChartModule.chartTimelineContainer.scrollLeft = this.element.scrollLeft;
}
}
else {
void 0;
}
};
ChartScroll.prototype.getTimelineLeft = function () {
var tLeft;
var ganttElement = this.parent.element;
var resultantWidth = this.parent.timelineModule.wholeTimelineWidth > (ganttElement.offsetWidth * 3) ?
this.parent.timelineModule.wholeTimelineWidth - ganttElement.offsetWidth * 3 : 0;
if (this.element.scrollLeft === (this.parent.enableRtl ? -resultantWidth : resultantWidth)) {
tLeft = this.element.scrollLeft;
}
else {
var left = this.parent.enableRtl ? -this.element.scrollLeft : this.element.scrollLeft;
tLeft = (left > ganttElement.offsetWidth) ? left - ganttElement.offsetWidth : 0;
}
if (tLeft >= resultantWidth) {
tLeft = resultantWidth;
}
Iif ((tLeft <= ganttElement.offsetWidth) && this.isBackwardScrolled) {
tLeft = 0;
}
if (this.parent.timelineModule.isZoomToFit || this.parent.timelineModule.isZooming) {
tLeft = 0;
}
return tLeft;
};
ChartScroll.prototype.deleteTableElements = function () {
var tableContainer = this.parent.element.getElementsByClassName('e-timeline-header-table-container');
do {
tableContainer[0].remove();
} while (tableContainer.length > 0);
if (this.parent.element.querySelector('#ganttContainerline-container')) {
this.parent.element.querySelector('#ganttContainerline-container').innerHTML = '';
}
if (this.parent.element.querySelector('.e-nonworking-day-container')) {
this.parent.element.querySelector('.e-nonworking-day-container').outerHTML = null;
}
};
ChartScroll.prototype.updateChartElementStyles = function () {
var translateXValue = this.getTimelineLeft();
if (this.parent.enableTimelineVirtualization) {
var dependencyViewer = this.parent.connectorLineModule.dependencyViewContainer;
var taskTable = this.parent.chartRowsModule.taskTable;
if (!this.parent.enableRtl) {
dependencyViewer.style.left = -translateXValue + 'px';
taskTable.style.left = -translateXValue + 'px';
}
else {
dependencyViewer.style.left = translateXValue + 'px';
taskTable.style.right = -translateXValue + 'px';
}
taskTable.style.width = this.parent.timelineModule.wholeTimelineWidth + 'px';
}
};
ChartScroll.prototype.updateTopPosition = function () {
var content = this.parent.treeGrid.element.querySelector('.e-content');
var contentScrollTop = content.scrollTop;
var scrollTop;
if (this.parent.virtualScrollModule && this.parent.enableVirtualization) {
var top_1 = this.parent.virtualScrollModule.getTopPosition();
scrollTop = contentScrollTop - top_1;
}
else {
scrollTop = contentScrollTop;
}
if (!ej2_base_1.isNullOrUndefined(this.parent.dayMarkersModule)) {
var holidayContainer = ej2_base_1.getValue('nonworkingDayRender.holidayContainer', this.parent.dayMarkersModule);
var weekendContainer = ej2_base_1.getValue('nonworkingDayRender.weekendContainer', this.parent.dayMarkersModule);
var eventMarkersContainer = ej2_base_1.getValue('eventMarkerRender.eventMarkersContainer', this.parent.dayMarkersModule);
if (holidayContainer) {
holidayContainer.style.top = ej2_base_1.formatUnit(scrollTop);
}
if (weekendContainer) {
weekendContainer.style.top = ej2_base_1.formatUnit(scrollTop);
}
if (eventMarkersContainer) {
eventMarkersContainer.style.top = ej2_base_1.formatUnit(scrollTop);
}
}
if (this.parent.chartVerticalLineContainer) {
this.parent.chartVerticalLineContainer.style.top = ej2_base_1.formatUnit(scrollTop);
}
};
ChartScroll.prototype.removeShimmer = function () {
var parent = this.parent;
setTimeout(function () {
parent.hideMaskRow();
if (!parent.allowTaskbarOverlap && parent.showOverAllocation) {
for (var i = 0; i < parent.currentViewData.length; i++) {
var tr = parent.chartRowsModule.ganttChartTableBody.childNodes[i];
if (tr['style'].display !== 'none' && parent.currentViewData[i].hasChildRecords && !parent.currentViewData[i].expanded) {
Iif (parent.ganttChartModule.isExpandAll || parent.ganttChartModule.isCollapseAll) {
parent.treeGrid.getRowByIndex(i)['style'].height = tr['style'].height;
}
else {
parent.treeGrid.getRows()[i]['style'].height = tr['style'].height;
}
}
}
parent.contentHeight = parent.enableRtl ? parent['element'].getElementsByClassName('e-content')[2].children[0]['offsetHeight'] :
parent['element'].getElementsByClassName('e-content')[0].children[0]['offsetHeight'];
parent.element.getElementsByClassName('e-chart-rows-container')[0]['style'].height = parent.contentHeight + 'px';
}
}, 0);
};
ChartScroll.prototype.transformChange = function () {
this.parent.ganttChartModule.virtualRender.adjustTable();
this.parent.ganttChartModule.scrollObject.updateTopPosition();
};
ChartScroll.prototype.updateShimmer = function () {
var parent = this.parent;
setTimeout(function () {
parent.showMaskRow();
}, 0);
};
ChartScroll.prototype.updateSpinner = function () {
var parent = this.parent;
this.parent.showSpinner();
window.clearTimeout(this.isScrolling);
this.isScrolling = setTimeout(function () {
parent.hideSpinner();
}, 200);
};
ChartScroll.prototype.onScroll = function () {
var _this = this;
var scrollArgs = {};
if (this.element.scrollTop !== this.previousScroll.top) {
!this.isFromTreeGrid ? this.parent.notify('chartScroll', { top: this.element.scrollTop }) : (this.isFromTreeGrid = false);
scrollArgs.previousScrollTop = this.previousScroll.top;
this.previousScroll.top = this.element.scrollTop;
scrollArgs.scrollTop = this.element.scrollTop;
scrollArgs.scrollDirection = 'Vertical';
scrollArgs.action = 'VerticalScroll';
this.updateTopPosition();
}
if (this.element.scrollLeft !== this.previousScroll.left) {
this.isBackwardScrolled = this.parent.enableRtl ?
(this.element.scrollLeft > this.previousScroll.left) :
(this.element.scrollLeft < this.previousScroll.left);
this.parent.ganttChartModule.chartTimelineContainer.scrollLeft = this.element.scrollLeft;
scrollArgs.previousScrollLeft = this.previousScroll.left;
this.previousScroll.left = this.element.scrollLeft;
scrollArgs.scrollLeft = this.element.scrollLeft;
scrollArgs.scrollDirection = 'Horizontal';
scrollArgs.action = 'HorizontalScroll';
if (this.parent.enableTimelineVirtualization && this.parent.timelineModule.wholeTimelineWidth >
this.parent.element.offsetWidth * 3) {
this.isSetScrollLeft = true;
Eif (this.parent.timelineModule.totalTimelineWidth > this.parent.element.offsetWidth * 3) {
this.updateContent();
}
this.parent.ganttChartModule.updateWidthAndHeight();
Eif (this.parent.element.getElementsByClassName('e-weekend-container')[0]) {
this.parent.element.getElementsByClassName('e-weekend-container')[0]['style'].height = '100%';
}
if (this.parent.element.getElementsByClassName('e-holiday-container')[0]) {
this.parent.element.getElementsByClassName('e-holiday-container')[0]['style'].height = '100%';
}
}
else if (this.parent.enableTimelineVirtualization && this.parent.timelineModule.wholeTimelineWidth <
this.parent.element.offsetWidth * 3) {
this.parent.connectorLineModule.svgObject.setAttribute('width', '100%');
}
if (this.parent.enableInfiniteTimelineScroll && !this.parent.timelineModule.isZoomedToFit &&
!this.parent.ganttChartModule.scrollObject.isBackwardScrolled) {
this.parent.timelineModule.handleInfiniteTimelineScroll('right');
}
Iif (!ej2_base_1.isNullOrUndefined(document.body.className) && document.body.className.includes('e-bigger') &&
this.parent.enableInfiniteTimelineScroll) {
this.trimTimelines();
}
}
this.parent.timelineModule['performedTimeSpanAction'] = false;
if ((!ej2_base_1.isNullOrUndefined(scrollArgs.scrollDirection)) && (this.parent.enableVirtualization === true ||
this.parent.enableTimelineVirtualization === true) && (this.parent.isToolBarClick ||
ej2_base_1.isNullOrUndefined(this.parent.isToolBarClick))) {
this.parent.isVirtualScroll = true;
this.parent['isVirtualScrollAction'] = true;
Eif (this.parent.showIndicator || ej2_base_1.isNullOrUndefined(this.parent.showIndicator)) {
if (!this.parent.enableVirtualMaskRow && this.parent.enableVirtualization && this.parent.loadingIndicator.indicatorType === 'Spinner') {
this.updateSpinner();
}
else if (this.parent.enableTimelineVirtualization && !this.parent['isRowSelected'] && Math.abs(this.element.scrollLeft - scrollArgs.previousScrollLeft) > 1000) {
if (!this.parent.enableVirtualMaskRow && this.parent.loadingIndicator.indicatorType === 'Spinner') {
this.updateSpinner();
}
else {
this.parent.showMaskRow();
setTimeout(function () {
_this.removeShimmer();
}, 0);
}
}
this.parent['isRowSelected'] = false;
}
}
this.isSetScrollLeft = false;
this.parent.isToolBarClick = true;
scrollArgs.requestType = 'scroll';
this.parent.trigger('actionComplete', scrollArgs);
this.parent.isVirtualScroll = false;
this.parent.timelineModule.isZoomOut = false;
};
ChartScroll.prototype.startHold = function (e) {
if (!this.parent.enableInfiniteTimelineScroll || this.parent.timelineModule.isZoomedToFit) {
return;
}
var scrollElement = this.element;
var scrollbarHeight = 16;
var scrollbarTop = scrollElement.offsetHeight - scrollbarHeight;
var isOnHorizontalScrollbar = e.clientY >= scrollElement.getBoundingClientRect().top + scrollbarTop;
Iif (scrollElement.scrollWidth <= scrollElement.clientWidth) {
return;
}
this.extendStartHold(isOnHorizontalScrollbar, e, scrollElement);
};
ChartScroll.prototype.extendStartHold = function (isOnHorizontalScrollbar, e, scrollElement) {
Eif (isOnHorizontalScrollbar) {
this.isScrollArrowPressed = true;
var rect = scrollElement.getBoundingClientRect();
if (e.clientX < rect.left + 30) {
this.scrollArrowDirection = 'left';
this.startContinuousScroll('left');
}
else Eif (e.clientX > rect.right - 30) {
this.scrollArrowDirection = 'right';
this.startContinuousScroll('right');
}
}
};
ChartScroll.prototype.startContinuousScroll = function (direction) {
var _this = this;
if (this.scrollArrowInterval) {
clearInterval(this.scrollArrowInterval);
}
this.scrollArrowInterval = window.setInterval(function () {
Iif (!_this.isScrollArrowPressed) {
clearInterval(_this.scrollArrowInterval);
_this.scrollArrowInterval = 0;
return;
}
_this.extendContinuousScrolling(direction);
}, 100);
};
ChartScroll.prototype.extendContinuousScrolling = function (direction) {
if (direction === 'left') {
if (this.parent.enableInfiniteTimelineScroll && this.parent.timelineModule) {
if (!this.parent.enableRtl) {
this.parent.timelineModule.handleInfiniteTimelineScroll('left');
}
else {
this.parent.timelineModule.handleInfiniteTimelineScroll('right');
}
}
}
else Eif (direction === 'right') {
if (this.parent.enableInfiniteTimelineScroll && this.parent.timelineModule) {
if (!this.parent.enableRtl) {
this.parent.timelineModule.handleInfiniteTimelineScroll('right');
}
else {
this.parent.timelineModule.handleInfiniteTimelineScroll('left');
}
}
}
};
ChartScroll.prototype.stopHold = function (e) {
Iif (!this.isScrollArrowPressed) {
return;
}
this.isScrollArrowPressed = false;
this.scrollArrowDirection = null;
Eif (this.scrollArrowInterval) {
clearInterval(this.scrollArrowInterval);
this.scrollArrowInterval = 0;
}
this.trimTimelines();
};
ChartScroll.prototype.trimTimelines = function () {
if (this.parent.enableInfiniteTimelineScroll && !this.parent.timelineModule.isZoomedToFit &&
this.parent.ganttChartModule.scrollObject.isBackwardScrolled) {
this.parent.timelineModule.trimInfiniteTimelineRightCells();
}
else Eif (this.parent.enableInfiniteTimelineScroll && !this.parent.timelineModule.isZoomedToFit &&
!this.parent.ganttChartModule.scrollObject.isBackwardScrolled) {
this.parent.timelineModule.trimInfiniteTimelineLeftCells();
}
};
ChartScroll.prototype.setHeight = function (height) {
this.element.style.height = ej2_base_1.formatUnit(height);
};
ChartScroll.prototype.setWidth = function (width) {
this.element.style.width = ej2_base_1.formatUnit(width);
};
ChartScroll.prototype.setScrollTop = function (scrollTop) {
if (this.parent.enableVirtualization) {
this.parent['isVirtualScrollAction'] = true;
}
this.element.scrollTop = scrollTop;
this.parent.treeGrid.element.querySelector('.e-content').scrollTop = scrollTop;
};
ChartScroll.prototype.setScrollLeft = function (scrollLeft, leftSign) {
scrollLeft = leftSign === -1 && this.parent.enableRtl ? -scrollLeft : scrollLeft;
this.isSetScrollLeft = true;
this.element.scrollLeft = scrollLeft;
this.parent.ganttChartModule.chartTimelineContainer.scrollLeft = this.element.scrollLeft;
if (!this.parent.enableTimelineVirtualization) {
this.previousScroll.left = this.element.scrollLeft;
}
};
ChartScroll.prototype.destroy = function () {
this.removeEventListeners();
};
return ChartScroll;
}());
exports.ChartScroll = ChartScroll;
});
|