| 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 | 1×
1×
1×
1×
1802×
1802×
1802×
1802×
1×
1802×
1802×
1802×
1802×
1×
1802×
1×
1801×
1801×
1801×
1801×
1801×
1801×
1×
49×
1×
56×
56×
1×
1822×
70×
1822×
56×
1×
21×
1×
56×
1×
3×
1×
3×
1×
1×
1×
2×
2×
2×
2×
2×
1×
355×
2×
2×
2×
2×
1×
56×
56×
56×
56×
56×
56×
56×
56×
56×
56×
56×
49×
56×
56×
56×
49×
7×
7×
56×
56×
56×
56×
56×
56×
56×
55×
56×
56×
56×
56×
56×
56×
56×
56×
2386×
1×
21×
21×
21×
21×
21×
21×
21×
21×
21×
21×
10×
1×
9×
1×
8×
11×
21×
21×
21×
21×
21×
21×
21×
21×
21×
21×
21×
21×
21×
21×
21×
1×
56×
1×
77×
1×
1801×
1801×
1×
1×
| define(["require", "exports", "@syncfusion/ej2-base", "../base/constant", "../base/classes", "../../common/constant", "../base/enum", "../actions/keyboard"], function (require, exports, ej2_base_1, events, classes_1, CONSTANT, enum_1, keyboard_1) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var ViewSource = (function () {
function ViewSource(parent, locator) {
this.parent = parent;
var serviceLocator = locator;
this.rendererFactory = serviceLocator.getService('rendererFactory');
this.addEventListener();
}
ViewSource.prototype.addEventListener = function () {
this.parent.on(events.sourceCode, this.sourceCode, this);
this.parent.on(events.initialEnd, this.onInitialEnd, this);
this.parent.on(events.updateSource, this.updateSourceCode, this);
this.parent.on(events.destroy, this.destroy, this);
};
ViewSource.prototype.onInitialEnd = function () {
this.parent.formatter.editorManager.observer.on(CONSTANT.KEY_DOWN_HANDLER, this.onKeyDown, this);
};
ViewSource.prototype.removeEventListener = function () {
this.unWireEvent();
this.parent.off(events.sourceCode, this.sourceCode);
this.parent.off(events.updateSource, this.updateSourceCode);
this.parent.off(events.initialEnd, this.onInitialEnd);
this.parent.off(events.destroy, this.destroy);
this.parent.formatter.editorManager.observer.off(CONSTANT.KEY_DOWN_HANDLER, this.onKeyDown);
};
ViewSource.prototype.getSourceCode = function () {
return this.parent.createElement('textarea', { className: classes_1.CLS_RTE_SOURCE_CODE_TXTAREA + this.parent.getCssClass(true) });
};
ViewSource.prototype.wireEvent = function (element) {
this.keyboardModule = new keyboard_1.KeyboardEvents(element, {
keyAction: this.previewKeyDown.bind(this), keyConfigs: this.parent.formatter.keyConfig, eventName: 'keydown'
});
ej2_base_1.EventHandler.add(this.previewElement, 'mousedown', this.mouseDownHandler, this);
};
ViewSource.prototype.unWireEvent = function () {
if (this.previewElement) {
ej2_base_1.EventHandler.remove(this.previewElement, 'mousedown', this.mouseDownHandler);
}
if (this.keyboardModule && !this.keyboardModule.isDestroyed) {
this.keyboardModule.destroy();
}
};
ViewSource.prototype.wireBaseKeyDown = function () {
this.parent.keyboardModule = new keyboard_1.KeyboardEvents(this.contentModule.getEditPanel(), {
keyAction: this.parent.keyDown.bind(this.parent), keyConfigs: this.parent.formatter.keyConfig, eventName: 'keydown'
});
};
ViewSource.prototype.unWireBaseKeyDown = function () {
this.parent.keyboardModule.destroy();
};
ViewSource.prototype.mouseDownHandler = function (e) {
this.parent.notify(events.sourceCodeMouseDown, { args: e });
};
ViewSource.prototype.previewKeyDown = function (event) {
switch (event.action) {
case 'html-source':
this.updateSourceCode(event);
event.preventDefault();
break;
case 'toolbar-focus':
Eif (this.parent.toolbarSettings.enable && this.parent.getToolbarElement()) {
var firstActiveItem = this.parent.getToolbarElement().querySelector('.e-toolbar-item:not(.e-overlay)[title]');
firstActiveItem.firstElementChild.removeAttribute('tabindex');
firstActiveItem.firstElementChild.focus();
}
break;
}
};
ViewSource.prototype.onKeyDown = function (e) {
switch (e.event.action) {
case 'html-source':
e.event.preventDefault();
this.sourceCode(e);
e.callBack({
requestType: 'SourceCode',
editorMode: 'HTML',
event: e.event
});
break;
}
};
ViewSource.prototype.sourceCode = function (args) {
var _this = this;
this.parent.notify(events.hidePopup, {});
this.parent.isBlur = false;
this.parent.trigger(events.actionBegin, { requestType: 'SourceCode', targetItem: 'SourceCode', args: args, cancel: false }, function (actionBeginArgs) {
Eif (!actionBeginArgs.cancel) {
var tbItems = ej2_base_1.selectAll('.' + classes_1.CLS_TB_ITEM, _this.parent.element);
_this.contentModule = _this.rendererFactory.getRenderer(enum_1.RenderType.Content);
var height = _this.parent.inputElement.getBoundingClientRect().height;
_this.parent.rootContainer.classList.add('e-source-code-enabled');
_this.parent.notify(events.updateToolbarItem, {
targetItem: 'SourceCode', updateItem: 'Preview',
baseToolbar: _this.parent.getBaseToolbarObject()
});
if (ej2_base_1.isNullOrUndefined(_this.previewElement)) {
_this.previewElement = _this.getSourceCode();
}
_this.parent.updateValueData();
var rteContent = void 0;
if (ej2_base_1.isNullOrUndefined(_this.parent.element.querySelector('#' + _this.parent.getID() + '_source-view'))) {
rteContent = _this.parent.createElement('div', {
className: 'e-source-content', id: _this.parent.getID() + '_source-view',
attrs: { style: 'height:' + height + 'px' }
});
}
else {
rteContent = _this.parent.element.querySelector('#' + _this.parent.getID() + '_source-view');
rteContent.style.height = height + 'px';
}
rteContent.appendChild(_this.previewElement);
_this.parent.rootContainer.appendChild(rteContent);
_this.getPanel().value = _this.getTextAreaValue();
_this.parent.isBlur = false;
_this.parent.disableToolbarItem(_this.parent.toolbarSettings.items);
_this.parent.enableToolbarItem('SourceCode');
if (_this.parent.getToolbar()) {
ej2_base_1.removeClass([_this.parent.getToolbar()], [classes_1.CLS_EXPAND_OPEN]);
}
ej2_base_1.removeClass(tbItems, [classes_1.CLS_ACTIVE]);
_this.wireEvent(_this.previewElement);
_this.unWireBaseKeyDown();
_this.previewElement.focus();
_this.parent.updateValue();
_this.parent.trigger(events.actionComplete, { requestType: 'SourceCode', targetItem: 'SourceCode', args: args });
_this.parent.invokeChangeEvent();
if (!ej2_base_1.isNullOrUndefined(_this.parent.saveInterval) && _this.parent.saveInterval > 0 && _this.parent.autoSaveOnIdle) {
_this.codeViewTimeInterval = setInterval(function () { _this.parent.notify(events.updateValueOnIdle, {}); }, _this.parent.saveInterval);
}
}
});
};
ViewSource.prototype.updateSourceCode = function (args) {
var _this = this;
this.parent.isBlur = false;
this.parent.trigger(events.actionBegin, { requestType: 'Preview', targetItem: 'Preview', args: args, cancel: false }, function (actionBeginArgs) {
Eif (!actionBeginArgs.cancel) {
_this.parent.rootContainer.classList.remove('e-source-code-enabled');
var editHTML = _this.getPanel();
_this.parent.notify(events.updateToolbarItem, {
targetItem: 'Preview', updateItem: 'SourceCode',
baseToolbar: _this.parent.getBaseToolbarObject()
});
var serializeValue = _this.parent.serializeValue(editHTML.value);
var value = void 0;
if (serializeValue === null || serializeValue === '') {
if (_this.parent.enterKey === 'DIV') {
value = '<div><br/></div>';
}
else if (_this.parent.enterKey === 'BR') {
value = '<br/>';
}
else {
value = '<p><br/></p>';
}
}
else {
value = serializeValue;
}
_this.contentModule.getEditPanel().innerHTML = value;
_this.parent.isBlur = false;
_this.parent.enableToolbarItem(_this.parent.toolbarSettings.items);
Eif (_this.parent.getToolbar()) {
ej2_base_1.removeClass([_this.parent.getToolbar()], [classes_1.CLS_EXPAND_OPEN]);
}
_this.unWireEvent();
_this.wireBaseKeyDown();
_this.contentModule.getEditPanel().focus();
_this.parent.updateValue();
_this.parent.trigger(events.actionComplete, { requestType: 'Preview', targetItem: 'Preview', args: args });
_this.parent.formatter.enableUndo(_this.parent);
_this.parent.addAudioVideoWrapper();
clearTimeout(_this.codeViewTimeInterval);
_this.parent.invokeChangeEvent();
_this.parent.notify(events.tableclass, {});
}
});
};
ViewSource.prototype.getTextAreaValue = function () {
return (this.contentModule.getEditPanel().innerHTML === '<p><br></p>') ||
(this.contentModule.getEditPanel().innerHTML === '<div><br></div>') ||
(this.contentModule.getEditPanel().innerHTML === '<br>') ||
(this.contentModule.getEditPanel().childNodes.length === 1 &&
(this.contentModule.getEditPanel().childNodes[0].tagName === 'P' &&
this.contentModule.getEditPanel().innerHTML.length === 7) ||
(this.contentModule.getEditPanel().childNodes[0].tagName === 'DIV' &&
this.contentModule.getEditPanel().innerHTML.length === 11)) ? '' : this.parent.value;
};
ViewSource.prototype.getPanel = function () {
return this.parent.element && this.parent.element.querySelector('.e-rte-srctextarea');
};
ViewSource.prototype.destroy = function () {
Iif (ej2_base_1.isNullOrUndefined(this.parent)) {
return;
}
this.removeEventListener();
};
return ViewSource;
}());
exports.ViewSource = ViewSource;
});
|