| 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 | 1×
1×
1×
1×
1390×
1390×
1×
1390×
1390×
1×
1390×
1390×
1390×
1390×
1390×
1×
1390×
1390×
1390×
1390×
1390×
1×
1390×
1390×
1390×
1390×
1×
1390×
1390×
1390×
1×
1390×
1390×
1390×
1390×
1390×
1×
1390×
1390×
1390×
1390×
1×
5×
1×
4×
4×
4×
4×
4×
4×
4×
4×
4×
4×
4×
4×
1×
40×
40×
39×
39×
12×
1×
7×
1×
57×
57×
57×
57×
1×
50×
1×
1390×
1390×
1390×
1390×
1390×
1×
1×
| define(["require", "exports", "@syncfusion/ej2-base", "../../common/constant", "../../common/constant"], function (require, exports, ej2_base_1, constant_1, constants) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var LinkModule = (function () {
function LinkModule(editor) {
this.editor = editor;
this.initializeModule();
}
LinkModule.prototype.initializeModule = function () {
this.addEventListeners();
this.createLinkPopup();
};
LinkModule.prototype.addEventListeners = function () {
this.editor.blockManager.observer.on('showLinkPopup', this.showLinkPopup, this);
this.editor.blockManager.observer.on('hideLinkPopup', this.hideLinkPopup, this);
this.editor.on(constant_1.events.localeChanged, this.updateLinkPopupLocale, this);
this.editor.on(constant_1.events.rtlChanged, this.applyRtlSettings, this);
this.editor.on(constant_1.events.destroy, this.destroy, this);
};
LinkModule.prototype.removeEventListeners = function () {
this.editor.blockManager.observer.off('showLinkPopup', this.showLinkPopup);
this.editor.blockManager.observer.off('hideLinkPopup', this.hideLinkPopup);
this.editor.off(constant_1.events.localeChanged, this.updateLinkPopupLocale);
this.editor.off(constant_1.events.rtlChanged, this.applyRtlSettings);
this.editor.off(constant_1.events.destroy, this.destroy);
};
LinkModule.prototype.createLinkPopup = function () {
this.popupElement = this.createPopupElement();
this.linkDialog = this.initializeDialog();
this.updateTargetAndActionForPopup();
this.editor.blockManager.observer.notify('linkPopupCreated');
};
LinkModule.prototype.createPopupElement = function () {
var element = this.editor.createElement('div', {
id: (this.editor.element.id + constants.LINKDIALOG_ID),
className: constants.LINKDIALOG_CLS
});
this.editor.element.appendChild(element);
return element;
};
LinkModule.prototype.initializeDialog = function () {
var footerTemplate = "<div class='e-be-link-footer'>\n <button type='button' tabindex='0' class='e-btn e-flat e-primary e-insert-link-btn'>" + this.editor.l10n.getConstant('linkInsert') + "</button>\n <button type='button' tabindex='0' class='e-btn e-flat e-remove-link-btn'>" + this.editor.l10n.getConstant('linkRemove') + "</button>\n <button type='button' tabindex='0' class='e-btn e-flat e-cancel-link-btn'>" + this.editor.l10n.getConstant('linkCancel') + "</button>\n </div>";
var contentTemplate = "<div class='e-be-link-content'>\n <div class='e-link-form-row'>\n <label for='linkUrl'>" + this.editor.l10n.getConstant('linkUrl') + "</label>\n <input type='text' spellcheck=false id='linkUrl' class='e-input' placeholder='" + this.editor.l10n.getConstant('linkUrlPlaceholder') + "' required>\n </div>\n <div class='e-link-form-row'>\n <label for='linkText'>" + this.editor.l10n.getConstant('linkText') + "</label>\n <input type='text' spellcheck=false id='linkText' class='e-input' placeholder='" + this.editor.l10n.getConstant('linkTextPlaceholder') + "' required>\n </div>\n <div class='e-link-form-row'>\n <label for='linkTitle'>" + this.editor.l10n.getConstant('linkTitle') + "</label>\n <input type='text' spellcheck=false id='linkTitle' class='e-input' placeholder='" + this.editor.l10n.getConstant('linkTitlePlaceholder') + "'>\n </div>\n </div>";
var headerTemplate = "<div class=\"e-be-link-header\">" + this.editor.l10n.getConstant('insertLink') + "</div>";
var dialogOptions = {
element: this.popupElement,
headerTemplate: headerTemplate,
footerTemplate: footerTemplate,
contentTemplate: contentTemplate,
showCloseIcon: true,
closeOnEscape: true,
width: '300px',
height: 'auto',
visible: false
};
return this.editor.dialogRenderer.renderDialog(dialogOptions);
};
LinkModule.prototype.updateTargetAndActionForPopup = function () {
var popup = ej2_base_1.getComponent(this.linkDialog.element, 'popup');
popup.relateTo = this.editor.element;
popup.actionOnScroll = 'hide';
popup.dataBind();
};
LinkModule.prototype.updateLinkPopupLocale = function () {
if (!this.linkDialog || !this.popupElement) {
return;
}
this.linkDialog.locale = this.editor.locale;
this.linkDialog.dataBind();
this.updatePopupElementLocale('.e-be-link-header', 'insertLink');
this.updatePopupElementLocale('.e-insert-link-btn', 'linkInsert');
this.updatePopupElementLocale('.e-remove-link-btn', 'linkRemove');
this.updatePopupElementLocale('.e-cancel-link-btn', 'linkCancel');
this.updatePopupElementLocale('label[for="linkText"]', 'linkText');
this.updatePopupElementLocale('#linkText', 'linkText', 'linkTextPlaceholder');
this.updatePopupElementLocale('label[for="linkUrl"]', 'linkUrl');
this.updatePopupElementLocale('#linkUrl', 'linkUrl', 'linkUrlPlaceholder');
this.updatePopupElementLocale('label[for="linkTitle"]', 'linkTitle');
this.updatePopupElementLocale('#linkTitle', 'linkTitle', 'linkTitlePlaceholder');
};
LinkModule.prototype.updatePopupElementLocale = function (selector, textKey, placeholderKey) {
var element = this.popupElement.querySelector(selector);
if (element) {
element.textContent = this.editor.l10n.getConstant(textKey);
if (placeholderKey && element instanceof HTMLInputElement) {
element.placeholder = this.editor.l10n.getConstant(placeholderKey);
}
}
};
LinkModule.prototype.applyRtlSettings = function () {
this.linkDialog.enableRtl = this.editor.enableRtl;
};
LinkModule.prototype.showLinkPopup = function (position) {
this.linkDialog.position = { X: position.x, Y: position.y };
this.linkDialog.dataBind();
this.linkDialog.show();
this.editor.blockManager.observer.notify('linkPopupAfterOpen', this.linkDialog);
};
LinkModule.prototype.hideLinkPopup = function () {
this.linkDialog.hide();
};
LinkModule.prototype.destroy = function () {
Eif (this.linkDialog) {
this.linkDialog.destroy();
ej2_base_1.detach(this.popupElement);
}
this.removeEventListeners();
this.linkDialog = null;
};
return LinkModule;
}());
exports.LinkModule = LinkModule;
});
|