| 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 | 1×
1×
1×
1×
1137×
1137×
1137×
1137×
1137×
1137×
1×
1137×
1137×
1137×
1137×
1137×
1×
1137×
1137×
1137×
1137×
1137×
1×
17×
17×
1×
4×
4×
4×
4×
4×
4×
1×
4×
3×
4×
4×
3×
3×
4×
4×
4×
4×
1×
91×
91×
91×
91×
2×
89×
89×
91×
28×
91×
91×
7×
91×
1×
4×
4×
8×
4×
4×
3×
1×
11×
11×
11×
11×
11×
11×
11×
11×
1×
106×
106×
106×
106×
92×
92×
14×
106×
38×
38×
38×
38×
10×
38×
17×
38×
8×
106×
16×
1×
1497×
1497×
1497×
1497×
12×
162×
162×
21×
21×
12×
12×
1×
21×
21×
1×
12×
12×
12×
1×
1×
1×
1×
1×
1×
1×
70×
70×
70×
23×
23×
23×
23×
23×
23×
23×
70×
8×
8×
8×
8×
8×
8×
8×
8×
4×
4×
3×
4×
4×
4×
4×
3×
4×
70×
70×
12×
12×
12×
12×
3×
1×
2×
2×
2×
12×
70×
70×
70×
70×
1×
2420×
1×
1×
1×
8×
8×
1×
99×
99×
99×
99×
99×
92×
1×
1137×
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.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);
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);
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);
Eif (this.previousCount !== currentCount || this.parent.timelineModule['performedTimeSpanAction']) {
this.deleteTableElements();
this.parent.timelineModule.createTimelineSeries();
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;
Eif (this.isSetScrollLeft) {
this.parent.ganttChartModule.chartTimelineContainer.scrollLeft = this.element.scrollLeft;
}
}
};
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);
Iif (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();
Eif (this.parent.enableTimelineVirtualization) {
var dependencyViewer = this.parent.connectorLineModule.dependencyViewContainer;
var taskTable = this.parent.chartRowsModule.taskTable;
Eif (!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.element.scrollLeft < this.previousScroll.left && !this.parent.enableRtl);
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;
if (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 Iif (this.parent.enableTimelineVirtualization && this.parent.timelineModule.wholeTimelineWidth <
this.parent.element.offsetWidth * 3) {
this.parent.connectorLineModule.svgObject.setAttribute('width', '100%');
}
}
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;
Eif (this.parent.showIndicator || ej2_base_1.isNullOrUndefined(this.parent.showIndicator)) {
Iif (!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);
};
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) {
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;
});
|