1 |
|
2 |
|
3 |
|
4 |
|
5 |
|
6 |
|
7 | "use strict";
|
8 | var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
9 | var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
10 | if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
11 | 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;
|
12 | return c > 3 && r && Object.defineProperty(target, key, r), r;
|
13 | };
|
14 | var __metadata = (this && this.__metadata) || function (k, v) {
|
15 | if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
|
16 | };
|
17 | Object.defineProperty(exports, "__esModule", { value: true });
|
18 | var utils_1 = require("../utils");
|
19 | var constants_1 = require("../constants");
|
20 | var context_1 = require("../context/context");
|
21 | var gridCore_1 = require("../gridCore");
|
22 | var gridOptionsWrapper_1 = require("../gridOptionsWrapper");
|
23 | var environment_1 = require("../environment");
|
24 | var PopupService = (function () {
|
25 | function PopupService() {
|
26 | this.activePopupElements = [];
|
27 | }
|
28 | PopupService.prototype.getPopupParent = function () {
|
29 | var ePopupParent = this.gridOptionsWrapper.getPopupParent();
|
30 | if (ePopupParent) {
|
31 |
|
32 | return ePopupParent;
|
33 | }
|
34 | else {
|
35 | return this.gridCore.getRootGui();
|
36 | }
|
37 | };
|
38 | PopupService.prototype.positionPopupForMenu = function (params) {
|
39 | var sourceRect = params.eventSource.getBoundingClientRect();
|
40 | var parentRect = this.getPopupParent().getBoundingClientRect();
|
41 | var y = sourceRect.top - parentRect.top;
|
42 | y = this.keepYWithinBounds(params, y);
|
43 | var minWidth = (params.ePopup.clientWidth > 0) ? params.ePopup.clientWidth : 200;
|
44 | var widthOfParent = parentRect.right - parentRect.left;
|
45 | var maxX = widthOfParent - minWidth;
|
46 |
|
47 |
|
48 |
|
49 | var x;
|
50 | if (this.gridOptionsWrapper.isEnableRtl()) {
|
51 |
|
52 | x = xLeftPosition();
|
53 | if (x < 0) {
|
54 | x = xRightPosition();
|
55 | }
|
56 | if (x > maxX) {
|
57 | x = 0;
|
58 | }
|
59 | }
|
60 | else {
|
61 |
|
62 | x = xRightPosition();
|
63 | if (x > maxX) {
|
64 | x = xLeftPosition();
|
65 | }
|
66 | if (x < 0) {
|
67 | x = 0;
|
68 | }
|
69 | }
|
70 | params.ePopup.style.left = x + "px";
|
71 | params.ePopup.style.top = y + "px";
|
72 | function xRightPosition() {
|
73 | return sourceRect.right - parentRect.left - 2;
|
74 | }
|
75 | function xLeftPosition() {
|
76 | return sourceRect.left - parentRect.left - minWidth;
|
77 | }
|
78 | };
|
79 | PopupService.prototype.positionPopupUnderMouseEvent = function (params) {
|
80 | var parentRect = this.getPopupParent().getBoundingClientRect();
|
81 | this.positionPopup({
|
82 | ePopup: params.ePopup,
|
83 | x: params.mouseEvent.clientX - parentRect.left,
|
84 | y: params.mouseEvent.clientY - parentRect.top,
|
85 | keepWithinBounds: true
|
86 | });
|
87 | this.callPostProcessPopup(params.ePopup, null, params.mouseEvent, params.type, params.column, params.rowNode);
|
88 | };
|
89 | PopupService.prototype.positionPopupUnderComponent = function (params) {
|
90 | var sourceRect = params.eventSource.getBoundingClientRect();
|
91 | var parentRect = this.getPopupParent().getBoundingClientRect();
|
92 | this.positionPopup({
|
93 | ePopup: params.ePopup,
|
94 | minWidth: params.minWidth,
|
95 | nudgeX: params.nudgeX,
|
96 | nudgeY: params.nudgeY,
|
97 | x: sourceRect.left - parentRect.left,
|
98 | y: sourceRect.top - parentRect.top + sourceRect.height,
|
99 | keepWithinBounds: params.keepWithinBounds
|
100 | });
|
101 | this.callPostProcessPopup(params.ePopup, params.eventSource, null, params.type, params.column, params.rowNode);
|
102 | };
|
103 | PopupService.prototype.callPostProcessPopup = function (ePopup, eventSource, mouseEvent, type, column, rowNode) {
|
104 | var callback = this.gridOptionsWrapper.getPostProcessPopupFunc();
|
105 | if (callback) {
|
106 | var params = {
|
107 | column: column,
|
108 | rowNode: rowNode,
|
109 | ePopup: ePopup,
|
110 | type: type,
|
111 | eventSource: eventSource,
|
112 | mouseEvent: mouseEvent
|
113 | };
|
114 | callback(params);
|
115 | }
|
116 | };
|
117 | PopupService.prototype.positionPopupOverComponent = function (params) {
|
118 | var sourceRect = params.eventSource.getBoundingClientRect();
|
119 | var parentRect = this.getPopupParent().getBoundingClientRect();
|
120 | this.positionPopup({
|
121 | ePopup: params.ePopup,
|
122 | minWidth: params.minWidth,
|
123 | nudgeX: params.nudgeX,
|
124 | nudgeY: params.nudgeY,
|
125 | x: sourceRect.left - parentRect.left,
|
126 | y: sourceRect.top - parentRect.top,
|
127 | keepWithinBounds: params.keepWithinBounds
|
128 | });
|
129 | this.callPostProcessPopup(params.ePopup, params.eventSource, null, params.type, params.column, params.rowNode);
|
130 | };
|
131 | PopupService.prototype.positionPopup = function (params) {
|
132 | var x = params.x;
|
133 | var y = params.y;
|
134 | if (params.nudgeX) {
|
135 | x += params.nudgeX;
|
136 | }
|
137 | if (params.nudgeY) {
|
138 | y += params.nudgeY;
|
139 | }
|
140 |
|
141 | if (params.keepWithinBounds) {
|
142 | x = this.keepXWithinBounds(params, x);
|
143 | y = this.keepYWithinBounds(params, y);
|
144 | }
|
145 | params.ePopup.style.left = x + "px";
|
146 | params.ePopup.style.top = y + "px";
|
147 | };
|
148 | PopupService.prototype.keepYWithinBounds = function (params, y) {
|
149 | var parentRect = this.getPopupParent().getBoundingClientRect();
|
150 | var minHeight;
|
151 | if (params.ePopup.clientHeight > 0) {
|
152 | minHeight = params.ePopup.clientHeight;
|
153 | }
|
154 | else {
|
155 | minHeight = 200;
|
156 | }
|
157 | var heightOfParent = parentRect.bottom - parentRect.top;
|
158 | var maxY = heightOfParent - minHeight - 5;
|
159 | if (y > maxY) {
|
160 | return maxY;
|
161 | }
|
162 | else if (y < 0) {
|
163 | return 0;
|
164 | }
|
165 | else {
|
166 | return y;
|
167 | }
|
168 | };
|
169 | PopupService.prototype.keepXWithinBounds = function (params, x) {
|
170 | var parentRect = this.getPopupParent().getBoundingClientRect();
|
171 | var minWidth;
|
172 | if (params.minWidth > 0) {
|
173 | minWidth = params.minWidth;
|
174 | }
|
175 | else if (params.ePopup.clientWidth > 0) {
|
176 | minWidth = params.ePopup.clientWidth;
|
177 | }
|
178 | else {
|
179 | minWidth = 200;
|
180 | }
|
181 | var widthOfParent = parentRect.right - parentRect.left;
|
182 | var maxX = widthOfParent - minWidth - 5;
|
183 | if (x > maxX) {
|
184 | return maxX;
|
185 | }
|
186 | else if (x < 0) {
|
187 | return 0;
|
188 | }
|
189 | else {
|
190 | return x;
|
191 | }
|
192 | };
|
193 |
|
194 |
|
195 |
|
196 | PopupService.prototype.addAsModalPopup = function (eChild, closeOnEsc, closedCallback, click) {
|
197 | var _this = this;
|
198 | var eBody = this.gridOptionsWrapper.getDocument();
|
199 | if (!eBody) {
|
200 | console.warn('ag-grid: could not find the body of the document, document.body is empty');
|
201 | return;
|
202 | }
|
203 | eChild.style.top = '0px';
|
204 | eChild.style.left = '0px';
|
205 | var popupAlreadyShown = utils_1.Utils.isVisible(eChild);
|
206 | if (popupAlreadyShown) {
|
207 | return;
|
208 | }
|
209 | var ePopupParent = this.getPopupParent();
|
210 |
|
211 |
|
212 | var eWrapper = document.createElement('div');
|
213 | utils_1.Utils.addCssClass(eWrapper, this.environment.getTheme());
|
214 | eWrapper.appendChild(eChild);
|
215 | ePopupParent.appendChild(eWrapper);
|
216 | this.activePopupElements.push(eChild);
|
217 | var popupHidden = false;
|
218 | var hidePopupOnKeyboardEvent = function (event) {
|
219 | var key = event.which || event.keyCode;
|
220 | if (key === constants_1.Constants.KEY_ESCAPE) {
|
221 | hidePopup(null);
|
222 | }
|
223 | };
|
224 | var hidePopupOnMouseEvent = function (event) {
|
225 | hidePopup(event);
|
226 | };
|
227 | var hidePopupOnTouchEvent = function (event) {
|
228 | hidePopup(null, event);
|
229 | };
|
230 | var hidePopup = function (mouseEvent, touchEvent) {
|
231 |
|
232 |
|
233 | if (_this.isEventFromCurrentPopup(mouseEvent, touchEvent, eChild)) {
|
234 | return;
|
235 | }
|
236 |
|
237 | if (_this.isEventSameChainAsOriginalEvent(click, mouseEvent, touchEvent)) {
|
238 | return;
|
239 | }
|
240 |
|
241 |
|
242 | if (popupHidden) {
|
243 | return;
|
244 | }
|
245 | popupHidden = true;
|
246 | ePopupParent.removeChild(eWrapper);
|
247 | utils_1.Utils.removeFromArray(_this.activePopupElements, eChild);
|
248 | eBody.removeEventListener('keydown', hidePopupOnKeyboardEvent);
|
249 | eBody.removeEventListener('click', hidePopupOnMouseEvent);
|
250 | eBody.removeEventListener('touchstart', hidePopupOnTouchEvent);
|
251 | eBody.removeEventListener('contextmenu', hidePopupOnMouseEvent);
|
252 | if (closedCallback) {
|
253 | closedCallback();
|
254 | }
|
255 | };
|
256 |
|
257 |
|
258 | setTimeout(function () {
|
259 | if (closeOnEsc) {
|
260 | eBody.addEventListener('keydown', hidePopupOnKeyboardEvent);
|
261 | }
|
262 | eBody.addEventListener('click', hidePopupOnMouseEvent);
|
263 | eBody.addEventListener('touchstart', hidePopupOnTouchEvent);
|
264 | eBody.addEventListener('contextmenu', hidePopupOnMouseEvent);
|
265 | }, 0);
|
266 | return hidePopup;
|
267 | };
|
268 | PopupService.prototype.isEventFromCurrentPopup = function (mouseEvent, touchEvent, eChild) {
|
269 | var event = mouseEvent ? mouseEvent : touchEvent;
|
270 | if (event) {
|
271 | var indexOfThisChild = this.activePopupElements.indexOf(eChild);
|
272 | for (var i = indexOfThisChild; i < this.activePopupElements.length; i++) {
|
273 | var element = this.activePopupElements[i];
|
274 | if (utils_1.Utils.isElementInEventPath(element, event)) {
|
275 | return true;
|
276 | }
|
277 | }
|
278 | }
|
279 | return false;
|
280 | };
|
281 |
|
282 |
|
283 | PopupService.prototype.isEventSameChainAsOriginalEvent = function (originalClick, mouseEvent, touchEvent) {
|
284 |
|
285 |
|
286 |
|
287 |
|
288 | var mouseEventOrTouch;
|
289 | if (mouseEvent) {
|
290 |
|
291 | mouseEventOrTouch = mouseEvent;
|
292 | }
|
293 | else if (touchEvent) {
|
294 |
|
295 | mouseEventOrTouch = touchEvent.touches[0];
|
296 | }
|
297 | if (mouseEventOrTouch && originalClick) {
|
298 |
|
299 |
|
300 | var xMatch = Math.abs(originalClick.screenX - mouseEvent.screenX) < 5;
|
301 | var yMatch = Math.abs(originalClick.screenY - mouseEvent.screenY) < 5;
|
302 | if (xMatch && yMatch) {
|
303 | return true;
|
304 | }
|
305 | }
|
306 | return false;
|
307 | };
|
308 | __decorate([
|
309 | context_1.Autowired('gridCore'),
|
310 | __metadata("design:type", gridCore_1.GridCore)
|
311 | ], PopupService.prototype, "gridCore", void 0);
|
312 | __decorate([
|
313 | context_1.Autowired('gridOptionsWrapper'),
|
314 | __metadata("design:type", gridOptionsWrapper_1.GridOptionsWrapper)
|
315 | ], PopupService.prototype, "gridOptionsWrapper", void 0);
|
316 | __decorate([
|
317 | context_1.Autowired('environment'),
|
318 | __metadata("design:type", environment_1.Environment)
|
319 | ], PopupService.prototype, "environment", void 0);
|
320 | PopupService = __decorate([
|
321 | context_1.Bean('popupService')
|
322 | ], PopupService);
|
323 | return PopupService;
|
324 | }());
|
325 | exports.PopupService = PopupService;
|