| 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 | 1×
1×
1×
1×
19×
19×
19×
19×
19×
1×
19×
19×
19×
1×
19×
19×
19×
19×
19×
19×
7×
7×
19×
19×
19×
1×
14×
14×
14×
14×
14×
14×
14×
14×
14×
2×
1×
19×
19×
19×
19×
7×
1×
19×
19×
17×
17×
17×
17×
4×
4×
4×
4×
2×
2×
2×
19×
19×
1×
19×
1×
11×
11×
11×
11×
11×
1×
21×
1×
19×
19×
17×
19×
1×
14×
14×
14×
14×
14×
14×
1×
14×
14×
14×
14×
1×
38×
19×
19×
19×
19×
19×
19×
1×
19×
19×
19×
19×
19×
7×
7×
19×
19×
19×
19×
19×
19×
1×
1×
1×
1×
32823×
1×
1×
| define(["require", "exports", "@syncfusion/ej2-base", "../base/constant", "../base/classes"], function (require, exports, ej2_base_1, events, classes) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var Resize = (function () {
function Resize(parent) {
this.parent = parent;
this.addEventListener();
this.isDestroyed = false;
this.isResizing = false;
this.iframeMouseUpBoundFn = this.iframeMouseUp.bind(this);
}
Resize.prototype.addEventListener = function () {
Iif (this.parent.isDestroyed) {
return;
}
this.parent.on(events.initialEnd, this.renderResizable, this);
this.parent.on(events.destroy, this.destroy, this);
};
Resize.prototype.renderResizable = function () {
var enableRtlClass = (this.parent.enableRtl) ? classes.CLS_RTE_RES_WEST : classes.CLS_RTE_RES_EAST;
this.resizer = this.parent.createElement('div', {
id: this.parent.getID() + '-resizable', className: 'e-icons'
+ ' ' + classes.CLS_RTE_RES_HANDLE + ' ' + enableRtlClass
});
this.parent.element.classList.add(classes.CLS_RTE_RES_CNT);
this.parent.rootContainer.appendChild(this.resizer);
this.parent.rootContainer.classList.add('e-resize-enabled');
if (this.parent.iframeSettings.enable) {
this.parent.inputElement.classList.add('e-resize-enabled');
this.parent.contentModule.getDocument().addEventListener('mouseup', this.iframeMouseUpBoundFn);
}
this.touchStartEvent = (ej2_base_1.Browser.info.name === 'msie') ? 'pointerdown' : 'touchstart';
ej2_base_1.EventHandler.add(this.resizer, 'mousedown', this.resizeStart, this);
ej2_base_1.EventHandler.add(this.resizer, this.touchStartEvent, this.resizeStart, this);
};
Resize.prototype.resizeStart = function (e) {
var _this = this;
this.isResizing = false;
Eif (e.cancelable) {
e.preventDefault();
}
this.wireResizeEvents();
this.parent.notify(events.resizeInitialized, {});
var args = { event: e, requestType: 'editor' };
this.parent.trigger(events.resizeStart, args, function (resizeStartArgs) {
if (resizeStartArgs.cancel) {
_this.unwireResizeEvents();
}
});
};
Resize.prototype.performResize = function (e) {
var _this = this;
this.isResizing = true;
var args = { event: e, requestType: 'editor' };
this.parent.trigger(events.onResize, args, function (resizingArgs) {
if (resizingArgs.cancel) {
_this.unwireResizeEvents();
}
});
var boundRect = this.parent.element.getBoundingClientRect();
if (this.isMouseEvent(e)) {
this.parent.element.style.height = e.clientY - boundRect.top + 'px';
this.parent.element.style.width = (!this.parent.enableRtl) ? e.clientX - boundRect.left + 'px' :
boundRect.right - e.clientX + 'px';
var toolBarEle = this.parent.toolbarModule.getToolbarElement();
if (!ej2_base_1.isNullOrUndefined(toolBarEle) && !ej2_base_1.isNullOrUndefined(toolBarEle.parentElement)) {
Eif (toolBarEle.parentElement.classList.contains(classes.CLS_TB_FLOAT) && this.parent.toolbarSettings.enableFloating &&
this.parent.getToolbar() && !this.parent.inlineMode.enable) {
var contentPanel = this.parent.contentModule.getPanel();
var contentPanelWidth = contentPanel.getBoundingClientRect().width;
toolBarEle.style.width = contentPanelWidth + 'px';
}
}
}
else {
var eventType = ej2_base_1.Browser.info.name !== 'msie' ? e.touches[0] : e;
this.parent.element.style.height = eventType.clientY - boundRect.top + 'px';
this.parent.element.style.width = (!this.parent.enableRtl) ? eventType.clientX - boundRect.left + 'px' : boundRect.right - eventType.clientX + 'px';
}
var rteContent = this.parent.element.querySelector('#' + this.parent.getID() + '_source-view');
if (!ej2_base_1.isNullOrUndefined(rteContent)) {
rteContent.style.height = this.parent.element.style.height;
}
this.parent.refreshUI();
};
Resize.prototype.stopResize = function (e) {
this.isResizing = false;
this.parent.refreshUI();
this.unwireResizeEvents();
var args = { event: e, requestType: 'editor' };
this.parent.trigger(events.resizeStop, args);
};
Resize.prototype.getEventType = function (e) {
return (e.indexOf('mouse') > -1) ? 'mouse' : 'touch';
};
Resize.prototype.isMouseEvent = function (e) {
var isMouse = false;
if (this.getEventType(e.type) === 'mouse' || (!ej2_base_1.isNullOrUndefined(e.pointerType) &&
this.getEventType(e.pointerType) === 'mouse')) {
isMouse = true;
}
return isMouse;
};
Resize.prototype.wireResizeEvents = function () {
ej2_base_1.EventHandler.add(document, 'mousemove', this.performResize, this);
ej2_base_1.EventHandler.add(document, 'mouseup', this.stopResize, this);
this.touchMoveEvent = (ej2_base_1.Browser.info.name === 'msie') ? 'pointermove' : 'touchmove';
this.touchEndEvent = (ej2_base_1.Browser.info.name === 'msie') ? 'pointerup' : 'touchend';
ej2_base_1.EventHandler.add(document, this.touchMoveEvent, this.performResize, this);
ej2_base_1.EventHandler.add(document, this.touchEndEvent, this.stopResize, this);
};
Resize.prototype.unwireResizeEvents = function () {
ej2_base_1.EventHandler.remove(document, 'mousemove', this.performResize);
ej2_base_1.EventHandler.remove(document, 'mouseup', this.stopResize);
ej2_base_1.EventHandler.remove(document, this.touchMoveEvent, this.performResize);
ej2_base_1.EventHandler.remove(document, this.touchEndEvent, this.stopResize);
};
Resize.prototype.destroy = function () {
if (this.isDestroyed) {
return;
}
this.removeEventListener();
Eif (this.resizer) {
ej2_base_1.detach(this.resizer);
this.resizer = null;
}
this.isDestroyed = true;
};
Resize.prototype.removeEventListener = function () {
this.parent.off(events.initialEnd, this.renderResizable);
this.parent.element.classList.remove(classes.CLS_RTE_RES_CNT);
Eif (this.parent && this.parent.rootContainer && this.parent.rootContainer.classList.contains('e-resize-enabled')) {
this.parent.rootContainer.classList.remove('e-resize-enabled');
}
if (this.parent.iframeSettings.enable && !ej2_base_1.isNullOrUndefined(this.parent.inputElement)) {
this.parent.inputElement.classList.remove('e-resize-enabled');
this.parent.contentModule.getDocument().removeEventListener('mouseup', this.iframeMouseUpBoundFn);
}
Eif (this.resizer) {
ej2_base_1.EventHandler.remove(this.resizer, 'mousedown', this.resizeStart);
ej2_base_1.EventHandler.remove(this.resizer, this.touchStartEvent, this.resizeStart);
ej2_base_1.detach(this.resizer);
}
this.parent.off(events.destroy, this.destroy);
this.iframeMouseUpBoundFn = null;
};
Resize.prototype.iframeMouseUp = function (e) {
Eif (this.isResizing) {
this.stopResize(e);
}
};
Resize.prototype.getModuleName = function () {
return 'resize';
};
return Resize;
}());
exports.Resize = Resize;
});
|