1 |
|
2 |
|
3 |
|
4 |
|
5 |
|
6 |
|
7 | "use strict";
|
8 | var __extends = (this && this.__extends) || (function () {
|
9 | var extendStatics = Object.setPrototypeOf ||
|
10 | ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
11 | function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
12 | return function (d, b) {
|
13 | extendStatics(d, b);
|
14 | function __() { this.constructor = d; }
|
15 | d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
16 | };
|
17 | })();
|
18 | var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
19 | var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
20 | if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
21 | else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
22 | return c > 3 && r && Object.defineProperty(target, key, r), r;
|
23 | };
|
24 | var __metadata = (this && this.__metadata) || function (k, v) {
|
25 | if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
|
26 | };
|
27 | Object.defineProperty(exports, "__esModule", { value: true });
|
28 | var component_1 = require("../../widgets/component");
|
29 | var column_1 = require("../../entities/column");
|
30 | var utils_1 = require("../../utils");
|
31 | var columnGroup_1 = require("../../entities/columnGroup");
|
32 | var columnApi_1 = require("../../columnController/columnApi");
|
33 | var columnController_1 = require("../../columnController/columnController");
|
34 | var gridOptionsWrapper_1 = require("../../gridOptionsWrapper");
|
35 | var horizontalResizeService_1 = require("../horizontalResizeService");
|
36 | var context_1 = require("../../context/context");
|
37 | var cssClassApplier_1 = require("../cssClassApplier");
|
38 | var dragAndDropService_1 = require("../../dragAndDrop/dragAndDropService");
|
39 | var setLeftFeature_1 = require("../../rendering/features/setLeftFeature");
|
40 | var gridApi_1 = require("../../gridApi");
|
41 | var componentRecipes_1 = require("../../components/framework/componentRecipes");
|
42 | var beans_1 = require("../../rendering/beans");
|
43 | var hoverFeature_1 = require("../hoverFeature");
|
44 | var HeaderGroupWrapperComp = (function (_super) {
|
45 | __extends(HeaderGroupWrapperComp, _super);
|
46 | function HeaderGroupWrapperComp(columnGroup, dragSourceDropTarget, pinned) {
|
47 | var _this = _super.call(this, HeaderGroupWrapperComp.TEMPLATE) || this;
|
48 |
|
49 | _this.childColumnsDestroyFuncs = [];
|
50 | _this.columnGroup = columnGroup;
|
51 | _this.dragSourceDropTarget = dragSourceDropTarget;
|
52 | _this.pinned = pinned;
|
53 | return _this;
|
54 | }
|
55 | HeaderGroupWrapperComp.prototype.postConstruct = function () {
|
56 | cssClassApplier_1.CssClassApplier.addHeaderClassesFromColDef(this.columnGroup.getColGroupDef(), this.getGui(), this.gridOptionsWrapper, null, this.columnGroup);
|
57 | var displayName = this.columnController.getDisplayNameForColumnGroup(this.columnGroup, 'header');
|
58 | this.appendHeaderGroupComp(displayName);
|
59 | this.setupResize();
|
60 | this.addClasses();
|
61 | this.setupWidth();
|
62 | this.addAttributes();
|
63 | this.setupMovingCss();
|
64 | this.setupTooltip();
|
65 | this.addFeature(this.context, new hoverFeature_1.HoverFeature(this.columnGroup.getOriginalColumnGroup().getLeafColumns(), this.getGui()));
|
66 | var setLeftFeature = new setLeftFeature_1.SetLeftFeature(this.columnGroup, this.getGui(), this.beans);
|
67 | setLeftFeature.init();
|
68 | this.addDestroyFunc(setLeftFeature.destroy.bind(setLeftFeature));
|
69 | };
|
70 | HeaderGroupWrapperComp.prototype.setupMovingCss = function () {
|
71 | var _this = this;
|
72 | var originalColumnGroup = this.columnGroup.getOriginalColumnGroup();
|
73 | var leafColumns = originalColumnGroup.getLeafColumns();
|
74 | leafColumns.forEach(function (col) {
|
75 | _this.addDestroyableEventListener(col, column_1.Column.EVENT_MOVING_CHANGED, _this.onColumnMovingChanged.bind(_this));
|
76 | });
|
77 | this.onColumnMovingChanged();
|
78 | };
|
79 | HeaderGroupWrapperComp.prototype.setupTooltip = function () {
|
80 | var colGroupDef = this.columnGroup.getColGroupDef();
|
81 |
|
82 | if (colGroupDef && colGroupDef.headerTooltip) {
|
83 | this.getGui().title = colGroupDef.headerTooltip;
|
84 | }
|
85 | };
|
86 | HeaderGroupWrapperComp.prototype.onColumnMovingChanged = function () {
|
87 |
|
88 |
|
89 |
|
90 | if (this.columnGroup.isMoving()) {
|
91 | utils_1.Utils.addCssClass(this.getGui(), 'ag-header-cell-moving');
|
92 | }
|
93 | else {
|
94 | utils_1.Utils.removeCssClass(this.getGui(), 'ag-header-cell-moving');
|
95 | }
|
96 | };
|
97 | HeaderGroupWrapperComp.prototype.addAttributes = function () {
|
98 | this.getGui().setAttribute("col-id", this.columnGroup.getUniqueId());
|
99 | };
|
100 | HeaderGroupWrapperComp.prototype.appendHeaderGroupComp = function (displayName) {
|
101 | var _this = this;
|
102 | var params = {
|
103 | displayName: displayName,
|
104 | columnGroup: this.columnGroup,
|
105 | setExpanded: function (expanded) {
|
106 | _this.columnController.setColumnGroupOpened(_this.columnGroup.getOriginalColumnGroup(), expanded, "gridInitializing");
|
107 | },
|
108 | api: this.gridApi,
|
109 | columnApi: this.columnApi,
|
110 | context: this.gridOptionsWrapper.getContext()
|
111 | };
|
112 | if (!displayName) {
|
113 | var leafCols = this.columnGroup.getLeafColumns();
|
114 | displayName = leafCols ? leafCols[0].getColDef().headerName : '';
|
115 | }
|
116 | var callback = this.afterHeaderCompCreated.bind(this, displayName);
|
117 | this.componentRecipes.newHeaderGroupComponent(params).then(callback);
|
118 | };
|
119 | HeaderGroupWrapperComp.prototype.afterHeaderCompCreated = function (displayName, headerGroupComp) {
|
120 | this.appendChild(headerGroupComp);
|
121 | this.setupMove(headerGroupComp.getGui(), displayName);
|
122 | if (headerGroupComp.destroy) {
|
123 | this.addDestroyFunc(headerGroupComp.destroy.bind(headerGroupComp));
|
124 | }
|
125 | };
|
126 | HeaderGroupWrapperComp.prototype.addClasses = function () {
|
127 |
|
128 |
|
129 |
|
130 | if (this.columnGroup.isPadding()) {
|
131 | this.addCssClass('ag-header-group-cell-no-group');
|
132 | }
|
133 | else {
|
134 | this.addCssClass('ag-header-group-cell-with-group');
|
135 | }
|
136 | };
|
137 | HeaderGroupWrapperComp.prototype.setupMove = function (eHeaderGroup, displayName) {
|
138 | var _this = this;
|
139 | if (!eHeaderGroup) {
|
140 | return;
|
141 | }
|
142 | if (this.isSuppressMoving()) {
|
143 | return;
|
144 | }
|
145 | var allLeafColumns = this.columnGroup.getOriginalColumnGroup().getLeafColumns();
|
146 | if (eHeaderGroup) {
|
147 | var dragSource_1 = {
|
148 | type: dragAndDropService_1.DragSourceType.HeaderCell,
|
149 | eElement: eHeaderGroup,
|
150 | dragItemName: displayName,
|
151 |
|
152 | dragItemCallback: this.getDragItemForGroup.bind(this),
|
153 | dragSourceDropTarget: this.dragSourceDropTarget,
|
154 | dragStarted: function () { return allLeafColumns.forEach(function (col) { return col.setMoving(true, "uiColumnDragged"); }); },
|
155 | dragStopped: function () { return allLeafColumns.forEach(function (col) { return col.setMoving(false, "uiColumnDragged"); }); }
|
156 | };
|
157 | this.dragAndDropService.addDragSource(dragSource_1, true);
|
158 | this.addDestroyFunc(function () { return _this.dragAndDropService.removeDragSource(dragSource_1); });
|
159 | }
|
160 | };
|
161 |
|
162 |
|
163 | HeaderGroupWrapperComp.prototype.getDragItemForGroup = function () {
|
164 | var allColumnsOriginalOrder = this.columnGroup.getOriginalColumnGroup().getLeafColumns();
|
165 |
|
166 | var visibleState = {};
|
167 | allColumnsOriginalOrder.forEach(function (column) { return visibleState[column.getId()] = column.isVisible(); });
|
168 | var allColumnsCurrentOrder = [];
|
169 | this.columnController.getAllDisplayedColumns().forEach(function (column) {
|
170 | if (allColumnsOriginalOrder.indexOf(column) >= 0) {
|
171 | allColumnsCurrentOrder.push(column);
|
172 | utils_1.Utils.removeFromArray(allColumnsOriginalOrder, column);
|
173 | }
|
174 | });
|
175 |
|
176 | allColumnsOriginalOrder.forEach(function (column) { return allColumnsCurrentOrder.push(column); });
|
177 |
|
178 | return {
|
179 | columns: allColumnsCurrentOrder,
|
180 | visibleState: visibleState
|
181 | };
|
182 | };
|
183 | HeaderGroupWrapperComp.prototype.isSuppressMoving = function () {
|
184 |
|
185 | var childSuppressesMoving = false;
|
186 | this.columnGroup.getLeafColumns().forEach(function (column) {
|
187 | if (column.getColDef().suppressMovable || column.isLockPosition()) {
|
188 | childSuppressesMoving = true;
|
189 | }
|
190 | });
|
191 | var result = childSuppressesMoving || this.gridOptionsWrapper.isSuppressMovableColumns();
|
192 | return result;
|
193 | };
|
194 | HeaderGroupWrapperComp.prototype.setupWidth = function () {
|
195 |
|
196 | this.addListenersToChildrenColumns();
|
197 |
|
198 | this.addDestroyableEventListener(this.columnGroup, columnGroup_1.ColumnGroup.EVENT_DISPLAYED_CHILDREN_CHANGED, this.onDisplayedChildrenChanged.bind(this));
|
199 | this.onWidthChanged();
|
200 |
|
201 |
|
202 |
|
203 | this.addDestroyFunc(this.destroyListenersOnChildrenColumns.bind(this));
|
204 | };
|
205 | HeaderGroupWrapperComp.prototype.onDisplayedChildrenChanged = function () {
|
206 | this.addListenersToChildrenColumns();
|
207 | this.onWidthChanged();
|
208 | };
|
209 | HeaderGroupWrapperComp.prototype.addListenersToChildrenColumns = function () {
|
210 | var _this = this;
|
211 |
|
212 | this.destroyListenersOnChildrenColumns();
|
213 |
|
214 | var widthChangedListener = this.onWidthChanged.bind(this);
|
215 | this.columnGroup.getLeafColumns().forEach(function (column) {
|
216 | column.addEventListener(column_1.Column.EVENT_WIDTH_CHANGED, widthChangedListener);
|
217 | column.addEventListener(column_1.Column.EVENT_VISIBLE_CHANGED, widthChangedListener);
|
218 | _this.childColumnsDestroyFuncs.push(function () {
|
219 | column.removeEventListener(column_1.Column.EVENT_WIDTH_CHANGED, widthChangedListener);
|
220 | column.removeEventListener(column_1.Column.EVENT_VISIBLE_CHANGED, widthChangedListener);
|
221 | });
|
222 | });
|
223 | };
|
224 | HeaderGroupWrapperComp.prototype.destroyListenersOnChildrenColumns = function () {
|
225 | this.childColumnsDestroyFuncs.forEach(function (func) { return func(); });
|
226 | this.childColumnsDestroyFuncs = [];
|
227 | };
|
228 | HeaderGroupWrapperComp.prototype.onWidthChanged = function () {
|
229 | this.getGui().style.width = this.columnGroup.getActualWidth() + 'px';
|
230 | };
|
231 | HeaderGroupWrapperComp.prototype.setupResize = function () {
|
232 | var _this = this;
|
233 | this.eHeaderCellResize = this.getRefElement('agResize');
|
234 | if (!this.columnGroup.isResizable()) {
|
235 | utils_1.Utils.removeFromParent(this.eHeaderCellResize);
|
236 | return;
|
237 | }
|
238 | var finishedWithResizeFunc = this.horizontalResizeService.addResizeBar({
|
239 | eResizeBar: this.eHeaderCellResize,
|
240 | onResizeStart: this.onResizeStart.bind(this),
|
241 | onResizing: this.onResizing.bind(this, false),
|
242 | onResizeEnd: this.onResizing.bind(this, true)
|
243 | });
|
244 | this.addDestroyFunc(finishedWithResizeFunc);
|
245 | if (!this.gridOptionsWrapper.isSuppressAutoSize()) {
|
246 | this.eHeaderCellResize.addEventListener('dblclick', function (event) {
|
247 |
|
248 | var keys = [];
|
249 | _this.columnGroup.getDisplayedLeafColumns().forEach(function (column) {
|
250 |
|
251 | if (!column.getColDef().suppressAutoSize) {
|
252 | keys.push(column.getColId());
|
253 | }
|
254 | });
|
255 | if (keys.length > 0) {
|
256 | _this.columnController.autoSizeColumns(keys, "uiColumnResized");
|
257 | }
|
258 | });
|
259 | }
|
260 | };
|
261 | HeaderGroupWrapperComp.prototype.onResizeStart = function (shiftKey) {
|
262 | var _this = this;
|
263 | var leafCols = this.columnGroup.getDisplayedLeafColumns();
|
264 | this.resizeCols = utils_1.Utils.filter(leafCols, function (col) { return col.isResizable(); });
|
265 | this.resizeStartWidth = 0;
|
266 | this.resizeCols.forEach(function (col) { return _this.resizeStartWidth += col.getActualWidth(); });
|
267 | this.resizeRatios = [];
|
268 | this.resizeCols.forEach(function (col) { return _this.resizeRatios.push(col.getActualWidth() / _this.resizeStartWidth); });
|
269 | var takeFromGroup = null;
|
270 | if (shiftKey) {
|
271 | takeFromGroup = this.columnController.getDisplayedGroupAfter(this.columnGroup);
|
272 | }
|
273 | if (takeFromGroup) {
|
274 | var takeFromLeafCols = takeFromGroup.getDisplayedLeafColumns();
|
275 | this.resizeTakeFromCols = utils_1.Utils.filter(takeFromLeafCols, function (col) { return col.isResizable(); });
|
276 | this.resizeTakeFromStartWidth = 0;
|
277 | this.resizeTakeFromCols.forEach(function (col) { return _this.resizeTakeFromStartWidth += col.getActualWidth(); });
|
278 | this.resizeTakeFromRatios = [];
|
279 | this.resizeTakeFromCols.forEach(function (col) { return _this.resizeTakeFromRatios.push(col.getActualWidth() / _this.resizeTakeFromStartWidth); });
|
280 | }
|
281 | else {
|
282 | this.resizeTakeFromCols = null;
|
283 | this.resizeTakeFromStartWidth = null;
|
284 | this.resizeTakeFromRatios = null;
|
285 | }
|
286 | };
|
287 | HeaderGroupWrapperComp.prototype.onResizing = function (finished, resizeAmount) {
|
288 | var resizeSets = [];
|
289 | var resizeAmountNormalised = this.normaliseDragChange(resizeAmount);
|
290 | resizeSets.push({
|
291 | columns: this.resizeCols,
|
292 | ratios: this.resizeRatios,
|
293 | width: this.resizeStartWidth + resizeAmountNormalised
|
294 | });
|
295 | if (this.resizeTakeFromCols) {
|
296 | resizeSets.push({
|
297 | columns: this.resizeTakeFromCols,
|
298 | ratios: this.resizeTakeFromRatios,
|
299 | width: this.resizeTakeFromStartWidth - resizeAmountNormalised
|
300 | });
|
301 | }
|
302 | this.columnController.resizeColumnSets(resizeSets, finished, 'uiColumnDragged');
|
303 | };
|
304 |
|
305 |
|
306 | HeaderGroupWrapperComp.prototype.normaliseDragChange = function (dragChange) {
|
307 | var result = dragChange;
|
308 | if (this.gridOptionsWrapper.isEnableRtl()) {
|
309 |
|
310 | if (this.pinned !== column_1.Column.PINNED_LEFT) {
|
311 | result *= -1;
|
312 | }
|
313 | }
|
314 | else {
|
315 |
|
316 | if (this.pinned === column_1.Column.PINNED_RIGHT) {
|
317 | result *= -1;
|
318 | }
|
319 | }
|
320 | return result;
|
321 | };
|
322 | HeaderGroupWrapperComp.TEMPLATE = '<div class="ag-header-group-cell">' +
|
323 | '<div ref="agResize" class="ag-header-cell-resize"></div>' +
|
324 | '</div>';
|
325 | __decorate([
|
326 | context_1.Autowired('gridOptionsWrapper'),
|
327 | __metadata("design:type", gridOptionsWrapper_1.GridOptionsWrapper)
|
328 | ], HeaderGroupWrapperComp.prototype, "gridOptionsWrapper", void 0);
|
329 | __decorate([
|
330 | context_1.Autowired('columnController'),
|
331 | __metadata("design:type", columnController_1.ColumnController)
|
332 | ], HeaderGroupWrapperComp.prototype, "columnController", void 0);
|
333 | __decorate([
|
334 | context_1.Autowired('horizontalResizeService'),
|
335 | __metadata("design:type", horizontalResizeService_1.HorizontalResizeService)
|
336 | ], HeaderGroupWrapperComp.prototype, "horizontalResizeService", void 0);
|
337 | __decorate([
|
338 | context_1.Autowired('dragAndDropService'),
|
339 | __metadata("design:type", dragAndDropService_1.DragAndDropService)
|
340 | ], HeaderGroupWrapperComp.prototype, "dragAndDropService", void 0);
|
341 | __decorate([
|
342 | context_1.Autowired('context'),
|
343 | __metadata("design:type", context_1.Context)
|
344 | ], HeaderGroupWrapperComp.prototype, "context", void 0);
|
345 | __decorate([
|
346 | context_1.Autowired('componentRecipes'),
|
347 | __metadata("design:type", componentRecipes_1.ComponentRecipes)
|
348 | ], HeaderGroupWrapperComp.prototype, "componentRecipes", void 0);
|
349 | __decorate([
|
350 | context_1.Autowired('gridApi'),
|
351 | __metadata("design:type", gridApi_1.GridApi)
|
352 | ], HeaderGroupWrapperComp.prototype, "gridApi", void 0);
|
353 | __decorate([
|
354 | context_1.Autowired('columnApi'),
|
355 | __metadata("design:type", columnApi_1.ColumnApi)
|
356 | ], HeaderGroupWrapperComp.prototype, "columnApi", void 0);
|
357 | __decorate([
|
358 | context_1.Autowired('beans'),
|
359 | __metadata("design:type", beans_1.Beans)
|
360 | ], HeaderGroupWrapperComp.prototype, "beans", void 0);
|
361 | __decorate([
|
362 | context_1.PostConstruct,
|
363 | __metadata("design:type", Function),
|
364 | __metadata("design:paramtypes", []),
|
365 | __metadata("design:returntype", void 0)
|
366 | ], HeaderGroupWrapperComp.prototype, "postConstruct", null);
|
367 | return HeaderGroupWrapperComp;
|
368 | }(component_1.Component));
|
369 | exports.HeaderGroupWrapperComp = HeaderGroupWrapperComp;
|