@syncfusion/ej2-richtexteditor 24.2.9 → 25.1.35
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +18 -0
- package/dist/ej2-richtexteditor.min.js +2 -2
- package/dist/ej2-richtexteditor.umd.min.js +2 -2
- package/dist/ej2-richtexteditor.umd.min.js.map +1 -1
- package/dist/es6/ej2-richtexteditor.es2015.js +908 -485
- package/dist/es6/ej2-richtexteditor.es2015.js.map +1 -1
- package/dist/es6/ej2-richtexteditor.es5.js +892 -474
- package/dist/es6/ej2-richtexteditor.es5.js.map +1 -1
- package/dist/global/ej2-richtexteditor.min.js +2 -2
- package/dist/global/ej2-richtexteditor.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/package.json +13 -13
- package/src/common/config.d.ts +7 -0
- package/src/common/config.js +11 -0
- package/src/common/interface.d.ts +12 -0
- package/src/common/types.d.ts +6 -0
- package/src/editor-manager/plugin/dom-node.d.ts +5 -1
- package/src/editor-manager/plugin/dom-node.js +161 -12
- package/src/editor-manager/plugin/formats.js +1 -1
- package/src/editor-manager/plugin/image.js +12 -16
- package/src/editor-manager/plugin/inserthtml.d.ts +1 -0
- package/src/editor-manager/plugin/inserthtml.js +31 -0
- package/src/editor-manager/plugin/link.js +1 -1
- package/src/editor-manager/plugin/lists.js +24 -2
- package/src/editor-manager/plugin/ms-word-clean-up.js +65 -57
- package/src/editor-manager/plugin/selection-commands.js +52 -3
- package/src/editor-manager/plugin/table.js +18 -3
- package/src/editor-manager/plugin/toolbar-status.d.ts +2 -2
- package/src/editor-manager/plugin/toolbar-status.js +17 -9
- package/src/rich-text-editor/actions/base-quick-toolbar.d.ts +3 -3
- package/src/rich-text-editor/actions/base-quick-toolbar.js +41 -10
- package/src/rich-text-editor/actions/base-toolbar.js +24 -30
- package/src/rich-text-editor/actions/dropdown-buttons.js +4 -4
- package/src/rich-text-editor/actions/emoji-picker.js +1 -1
- package/src/rich-text-editor/actions/enter-key.js +2 -1
- package/src/rich-text-editor/actions/full-screen.js +2 -2
- package/src/rich-text-editor/actions/html-editor.d.ts +0 -2
- package/src/rich-text-editor/actions/html-editor.js +8 -26
- package/src/rich-text-editor/actions/markdown-editor.js +3 -1
- package/src/rich-text-editor/actions/paste-clean-up.d.ts +1 -0
- package/src/rich-text-editor/actions/paste-clean-up.js +23 -0
- package/src/rich-text-editor/actions/quick-toolbar.d.ts +7 -0
- package/src/rich-text-editor/actions/quick-toolbar.js +23 -8
- package/src/rich-text-editor/actions/resize.js +2 -1
- package/src/rich-text-editor/actions/toolbar.d.ts +0 -2
- package/src/rich-text-editor/actions/toolbar.js +13 -85
- package/src/rich-text-editor/base/classes.d.ts +0 -5
- package/src/rich-text-editor/base/classes.js +0 -5
- package/src/rich-text-editor/base/constant.d.ts +5 -0
- package/src/rich-text-editor/base/constant.js +5 -0
- package/src/rich-text-editor/base/interface.d.ts +36 -2
- package/src/rich-text-editor/base/rich-text-editor-model.d.ts +2 -2
- package/src/rich-text-editor/base/rich-text-editor.d.ts +4 -3
- package/src/rich-text-editor/base/rich-text-editor.js +81 -58
- package/src/rich-text-editor/base/util.js +8 -2
- package/src/rich-text-editor/models/default-locale.js +15 -12
- package/src/rich-text-editor/models/toolbar-settings-model.d.ts +1 -1
- package/src/rich-text-editor/models/toolbar-settings.d.ts +1 -1
- package/src/rich-text-editor/models/toolbar-settings.js +1 -1
- package/src/rich-text-editor/renderer/iframe-content-renderer.js +2 -1
- package/src/rich-text-editor/renderer/image-module.d.ts +8 -1
- package/src/rich-text-editor/renderer/image-module.js +148 -155
- package/src/rich-text-editor/renderer/table-module.d.ts +2 -0
- package/src/rich-text-editor/renderer/table-module.js +71 -8
- package/src/rich-text-editor/renderer/toolbar-renderer.d.ts +3 -0
- package/src/rich-text-editor/renderer/toolbar-renderer.js +61 -2
- package/src/rich-text-editor/renderer/video-module.js +7 -4
- package/src/rich-text-editor/renderer/view-source.js +7 -4
- package/styles/bootstrap-dark.css +57 -17
- package/styles/bootstrap.css +58 -18
- package/styles/bootstrap4.css +58 -18
- package/styles/bootstrap5-dark.css +64 -17
- package/styles/bootstrap5.css +64 -17
- package/styles/fabric-dark.css +57 -17
- package/styles/fabric.css +58 -18
- package/styles/fluent-dark.css +57 -17
- package/styles/fluent.css +57 -17
- package/styles/highcontrast-light.css +57 -17
- package/styles/highcontrast.css +58 -18
- package/styles/material-dark.css +57 -17
- package/styles/material.css +57 -17
- package/styles/material3-dark.css +59 -19
- package/styles/material3.css +59 -19
- package/styles/rich-text-editor/_bds-definition.scss +279 -0
- package/styles/rich-text-editor/_bootstrap-dark-definition.scss +1 -0
- package/styles/rich-text-editor/_bootstrap-definition.scss +1 -1
- package/styles/rich-text-editor/_bootstrap4-definition.scss +3 -2
- package/styles/rich-text-editor/_bootstrap5-definition.scss +1 -0
- package/styles/rich-text-editor/_fabric-dark-definition.scss +1 -0
- package/styles/rich-text-editor/_fabric-definition.scss +2 -1
- package/styles/rich-text-editor/_fluent-definition.scss +1 -0
- package/styles/rich-text-editor/_fusionnew-definition.scss +1 -0
- package/styles/rich-text-editor/_highcontrast-definition.scss +2 -1
- package/styles/rich-text-editor/_highcontrast-light-definition.scss +1 -0
- package/styles/rich-text-editor/_layout.scss +47 -13
- package/styles/rich-text-editor/_material-dark-definition.scss +1 -0
- package/styles/rich-text-editor/_material-definition.scss +1 -0
- package/styles/rich-text-editor/_material3-definition.scss +1 -0
- package/styles/rich-text-editor/_tailwind-definition.scss +4 -3
- package/styles/rich-text-editor/_theme.scss +18 -5
- package/styles/rich-text-editor/bootstrap-dark.css +57 -17
- package/styles/rich-text-editor/bootstrap.css +58 -18
- package/styles/rich-text-editor/bootstrap4.css +58 -18
- package/styles/rich-text-editor/bootstrap5-dark.css +64 -17
- package/styles/rich-text-editor/bootstrap5.css +64 -17
- package/styles/rich-text-editor/fabric-dark.css +57 -17
- package/styles/rich-text-editor/fabric.css +58 -18
- package/styles/rich-text-editor/fluent-dark.css +57 -17
- package/styles/rich-text-editor/fluent.css +57 -17
- package/styles/rich-text-editor/highcontrast-light.css +57 -17
- package/styles/rich-text-editor/highcontrast.css +58 -18
- package/styles/rich-text-editor/icons/_bds.scss +351 -0
- package/styles/rich-text-editor/icons/_bootstrap-dark.scss +7 -4
- package/styles/rich-text-editor/icons/_bootstrap.scss +7 -4
- package/styles/rich-text-editor/icons/_bootstrap4.scss +7 -4
- package/styles/rich-text-editor/icons/_bootstrap5.scss +7 -4
- package/styles/rich-text-editor/icons/_fabric-dark.scss +7 -4
- package/styles/rich-text-editor/icons/_fabric.scss +7 -4
- package/styles/rich-text-editor/icons/_fluent.scss +7 -4
- package/styles/rich-text-editor/icons/_highcontrast-light.scss +7 -4
- package/styles/rich-text-editor/icons/_highcontrast.scss +7 -4
- package/styles/rich-text-editor/icons/_material-dark.scss +7 -4
- package/styles/rich-text-editor/icons/_material.scss +7 -4
- package/styles/rich-text-editor/icons/_material3.scss +7 -4
- package/styles/rich-text-editor/icons/_tailwind.scss +7 -4
- package/styles/rich-text-editor/material-dark.css +57 -17
- package/styles/rich-text-editor/material.css +57 -17
- package/styles/rich-text-editor/material3-dark.css +59 -19
- package/styles/rich-text-editor/material3.css +59 -19
- package/styles/rich-text-editor/tailwind-dark.css +61 -21
- package/styles/rich-text-editor/tailwind.css +61 -21
- package/styles/tailwind-dark.css +61 -21
- package/styles/tailwind.css +61 -21
|
@@ -769,6 +769,11 @@ const documentClickClosedBy = 'documentClickClosedBy';
|
|
|
769
769
|
* @deprecated
|
|
770
770
|
*/
|
|
771
771
|
const showColorPicker = 'showColorPicker';
|
|
772
|
+
/**
|
|
773
|
+
* @hidden
|
|
774
|
+
* @deprecated
|
|
775
|
+
*/
|
|
776
|
+
const closeTooltip = 'closeTooltip';
|
|
772
777
|
/**
|
|
773
778
|
* @hidden
|
|
774
779
|
* @deprecated
|
|
@@ -1019,11 +1024,6 @@ const CLS_TB_FIXED = 'e-rte-tb-fixed';
|
|
|
1019
1024
|
* @deprecated
|
|
1020
1025
|
*/
|
|
1021
1026
|
const CLS_TB_FLOAT = 'e-rte-tb-float';
|
|
1022
|
-
/**
|
|
1023
|
-
* @hidden
|
|
1024
|
-
* @deprecated
|
|
1025
|
-
*/
|
|
1026
|
-
const CLS_TB_ABS_FLOAT = 'e-rte-tb-abs-float';
|
|
1027
1027
|
/**
|
|
1028
1028
|
* @hidden
|
|
1029
1029
|
* @deprecated
|
|
@@ -2694,7 +2694,7 @@ let defaultLocale = {
|
|
|
2694
2694
|
'linkTooltipLabel': 'Title',
|
|
2695
2695
|
'linkWebUrl': 'Web address',
|
|
2696
2696
|
'linkTitle': 'Enter a title',
|
|
2697
|
-
'linkurl': '
|
|
2697
|
+
'linkurl': 'https://example.com',
|
|
2698
2698
|
'linkOpenInNewWindow': 'Open link in new window',
|
|
2699
2699
|
'linkHeader': 'Insert Link',
|
|
2700
2700
|
'dialogInsert': 'Insert',
|
|
@@ -2717,9 +2717,9 @@ let defaultLocale = {
|
|
|
2717
2717
|
'imageAlternateText': 'Alternate Text',
|
|
2718
2718
|
'alternateHeader': 'Alternative Text',
|
|
2719
2719
|
'browse': 'Browse',
|
|
2720
|
-
'imageUrl': '
|
|
2721
|
-
'audioUrl': '
|
|
2722
|
-
'videoUrl': '
|
|
2720
|
+
'imageUrl': 'https://example.com/image.png',
|
|
2721
|
+
'audioUrl': 'https://example.com/audio.mp3',
|
|
2722
|
+
'videoUrl': 'https://example.com/video.mp4',
|
|
2723
2723
|
'webUrl': 'Web URL',
|
|
2724
2724
|
'embedUrl': 'Embed Code',
|
|
2725
2725
|
'imageCaption': 'Caption',
|
|
@@ -2730,7 +2730,7 @@ let defaultLocale = {
|
|
|
2730
2730
|
'videoHeight': 'Height',
|
|
2731
2731
|
'videoWidth': 'Width',
|
|
2732
2732
|
'textPlaceholder': 'Enter text',
|
|
2733
|
-
'inserttablebtn': 'Insert
|
|
2733
|
+
'inserttablebtn': 'Insert Table',
|
|
2734
2734
|
'tabledialogHeader': 'Insert Table',
|
|
2735
2735
|
'tableWidth': 'Width',
|
|
2736
2736
|
'cellpadding': 'Cell Padding',
|
|
@@ -2744,7 +2744,7 @@ let defaultLocale = {
|
|
|
2744
2744
|
'createTable': 'Create Table',
|
|
2745
2745
|
'removeTable': 'Remove Table',
|
|
2746
2746
|
'tableHeader': 'Header Row',
|
|
2747
|
-
'tableRemove': 'Delete',
|
|
2747
|
+
'tableRemove': 'Delete Table',
|
|
2748
2748
|
'tableCellBackground': 'Table Cell Background',
|
|
2749
2749
|
'tableEditProperties': 'Table Edit Properties',
|
|
2750
2750
|
'styles': 'Styles',
|
|
@@ -2806,11 +2806,11 @@ let defaultLocale = {
|
|
|
2806
2806
|
'fontNameTimesNewRoman': 'Times New Roman',
|
|
2807
2807
|
'fontNameVerdana': 'Verdana',
|
|
2808
2808
|
'numberFormatListNumber': 'Number',
|
|
2809
|
-
'numberFormatListLowerAlpha': '
|
|
2810
|
-
'numberFormatListUpperAlpha': '
|
|
2811
|
-
'numberFormatListLowerRoman': '
|
|
2812
|
-
'numberFormatListUpperRoman': '
|
|
2813
|
-
'numberFormatListLowerGreek': '
|
|
2809
|
+
'numberFormatListLowerAlpha': 'Lower Alpha',
|
|
2810
|
+
'numberFormatListUpperAlpha': 'Upper Alpha',
|
|
2811
|
+
'numberFormatListLowerRoman': 'Lower Roman',
|
|
2812
|
+
'numberFormatListUpperRoman': 'Upper Roman',
|
|
2813
|
+
'numberFormatListLowerGreek': 'Lower Greek',
|
|
2814
2814
|
'bulletFormatListDisc': 'Disc',
|
|
2815
2815
|
'bulletFormatListCircle': 'Circle',
|
|
2816
2816
|
'bulletFormatListSquare': 'Square',
|
|
@@ -2824,7 +2824,10 @@ let defaultLocale = {
|
|
|
2824
2824
|
'emojiPickerNoResultFound': 'No results found',
|
|
2825
2825
|
'emojiPickerTrySomethingElse': 'Try something else',
|
|
2826
2826
|
'linkAriaLabel': 'Open in new window',
|
|
2827
|
-
'unsupportedImage': 'Unsupported file format'
|
|
2827
|
+
'unsupportedImage': 'Unsupported file format',
|
|
2828
|
+
'mergecells': 'Merge cells',
|
|
2829
|
+
'verticalsplit': 'Vertical split',
|
|
2830
|
+
'horizontalsplit': 'Horizontal split'
|
|
2828
2831
|
};
|
|
2829
2832
|
let toolsLocale = {
|
|
2830
2833
|
'alignments': 'alignments',
|
|
@@ -3215,7 +3218,12 @@ function setToolbarStatus(e, isPopToolbar, self) {
|
|
|
3215
3218
|
}
|
|
3216
3219
|
case 'bulletFormatList':
|
|
3217
3220
|
case 'numberFormatList': {
|
|
3218
|
-
|
|
3221
|
+
if (value !== '') {
|
|
3222
|
+
addClass([e.tbElements[j]], [CLS_ACTIVE]);
|
|
3223
|
+
}
|
|
3224
|
+
else {
|
|
3225
|
+
removeClass([e.tbElements[j]], [CLS_ACTIVE]);
|
|
3226
|
+
}
|
|
3219
3227
|
}
|
|
3220
3228
|
}
|
|
3221
3229
|
}
|
|
@@ -3456,7 +3464,8 @@ function updateTextNode(value, rteObj) {
|
|
|
3456
3464
|
imageElm[i].classList.add(CLS_RTE_IMAGE);
|
|
3457
3465
|
}
|
|
3458
3466
|
if (!(imageElm[i].classList.contains(CLS_IMGINLINE) ||
|
|
3459
|
-
imageElm[i].classList.contains(CLS_IMGBREAK))
|
|
3467
|
+
imageElm[i].classList.contains(CLS_IMGBREAK)) &&
|
|
3468
|
+
!(imageElm[i].classList.contains('e-imgleft') || imageElm[i].classList.contains('e-imgright') || imageElm[i].classList.contains('e-imgcenter'))) {
|
|
3460
3469
|
imageElm[i].classList.add(CLS_IMGINLINE);
|
|
3461
3470
|
}
|
|
3462
3471
|
}
|
|
@@ -3605,6 +3614,7 @@ class ToolbarRenderer {
|
|
|
3605
3614
|
wireEvent() {
|
|
3606
3615
|
this.parent.on(destroy, this.unWireEvent, this);
|
|
3607
3616
|
this.parent.on(destroyTooltip, this.destroyTooltip, this);
|
|
3617
|
+
this.parent.on(closeTooltip, this.closeTooltip, this);
|
|
3608
3618
|
}
|
|
3609
3619
|
destroyTooltip() {
|
|
3610
3620
|
const currentDocument = this.parent.iframeSettings.enable ? this.parent.contentModule.getPanel().ownerDocument :
|
|
@@ -3617,6 +3627,8 @@ class ToolbarRenderer {
|
|
|
3617
3627
|
}
|
|
3618
3628
|
unWireEvent() {
|
|
3619
3629
|
this.parent.off(destroy, this.unWireEvent);
|
|
3630
|
+
this.parent.off(destroyTooltip, this.destroyTooltip);
|
|
3631
|
+
this.parent.off(closeTooltip, this.closeTooltip);
|
|
3620
3632
|
}
|
|
3621
3633
|
toolbarBeforeCreate(e) {
|
|
3622
3634
|
if (this.mode === 'Extended') {
|
|
@@ -3735,7 +3747,7 @@ class ToolbarRenderer {
|
|
|
3735
3747
|
windowCollision: true,
|
|
3736
3748
|
position: 'BottomCenter'
|
|
3737
3749
|
});
|
|
3738
|
-
this.tooltip.appendTo(args.target);
|
|
3750
|
+
this.tooltip.appendTo(args.target.parentElement);
|
|
3739
3751
|
}
|
|
3740
3752
|
}
|
|
3741
3753
|
/**
|
|
@@ -3866,6 +3878,32 @@ class ToolbarRenderer {
|
|
|
3866
3878
|
popupElement.setAttribute('aria-owns', this.parent.getID());
|
|
3867
3879
|
return dropDown;
|
|
3868
3880
|
}
|
|
3881
|
+
mouseOutHandler() {
|
|
3882
|
+
if (!isNullOrUndefined(this.tooltipTargetEle)) {
|
|
3883
|
+
this.tooltipTargetEle.setAttribute('title', this.tooltipTargetEle.getAttribute('data-title'));
|
|
3884
|
+
}
|
|
3885
|
+
else {
|
|
3886
|
+
const currentDocument = this.parent.iframeSettings.enable ? this.parent.contentModule.getPanel().ownerDocument :
|
|
3887
|
+
this.parent.contentModule.getDocument();
|
|
3888
|
+
this.tooltipTargetEle = currentDocument.querySelector('[data-title]');
|
|
3889
|
+
this.tooltipTargetEle.setAttribute('title', this.tooltipTargetEle.getAttribute('data-title'));
|
|
3890
|
+
}
|
|
3891
|
+
this.tooltipTargetEle.removeAttribute('data-title');
|
|
3892
|
+
EventHandler.remove(this.tooltipTargetEle, 'mouseout', this.mouseOutHandler);
|
|
3893
|
+
}
|
|
3894
|
+
closeTooltip(args) {
|
|
3895
|
+
const currentDocument = this.parent.iframeSettings.enable ? this.parent.contentModule.getPanel().ownerDocument :
|
|
3896
|
+
this.parent.contentModule.getDocument();
|
|
3897
|
+
this.tooltipTargetEle = closest(args.target, '[data-tooltip-id]');
|
|
3898
|
+
if (!isNullOrUndefined(this.tooltipTargetEle) && this.parent.showTooltip && !isNullOrUndefined(currentDocument.querySelector('.e-tooltip-wrap'))) {
|
|
3899
|
+
this.destroyTooltip();
|
|
3900
|
+
if (!this.tooltipTargetEle.closest('.e-rte-quick-popup')) {
|
|
3901
|
+
this.tooltipTargetEle.setAttribute('data-title', this.tooltipTargetEle.getAttribute('title'));
|
|
3902
|
+
this.tooltipTargetEle.removeAttribute('title');
|
|
3903
|
+
EventHandler.add(this.tooltipTargetEle, 'mouseout', this.mouseOutHandler, this);
|
|
3904
|
+
}
|
|
3905
|
+
}
|
|
3906
|
+
}
|
|
3869
3907
|
/**
|
|
3870
3908
|
* renderListDropDown method
|
|
3871
3909
|
*
|
|
@@ -3890,6 +3928,35 @@ class ToolbarRenderer {
|
|
|
3890
3928
|
enableRtl: this.parent.enableRtl,
|
|
3891
3929
|
select: this.dropDownSelected.bind(this),
|
|
3892
3930
|
beforeOpen: (args) => {
|
|
3931
|
+
if (proxy.parent.editorMode !== 'Markdown') {
|
|
3932
|
+
const startNode = proxy.parent.getRange().startContainer.parentElement;
|
|
3933
|
+
const listElem = startNode.closest('LI');
|
|
3934
|
+
const currentLiElem = !isNullOrUndefined(listElem) ? listElem.parentElement : null;
|
|
3935
|
+
if (!isNullOrUndefined(currentLiElem) && (currentLiElem.nodeName === 'OL' || currentLiElem.nodeName === 'UL')) {
|
|
3936
|
+
if (currentLiElem.nodeName === 'UL' && args.items[0].subCommand === 'NumberFormatList') {
|
|
3937
|
+
addClass([args.element.childNodes[0]], 'e-active');
|
|
3938
|
+
}
|
|
3939
|
+
else if (currentLiElem.nodeName === 'OL' && args.items[0].subCommand === 'BulletFormatList') {
|
|
3940
|
+
addClass([args.element.childNodes[0]], 'e-active');
|
|
3941
|
+
}
|
|
3942
|
+
else {
|
|
3943
|
+
let currentListStyle = currentLiElem.style.listStyleType.split('-').join('').toLocaleLowerCase();
|
|
3944
|
+
currentListStyle = currentListStyle === 'decimal' ? 'number' : currentListStyle;
|
|
3945
|
+
for (let index = 0; index < args.element.childNodes.length; index++) {
|
|
3946
|
+
if (currentListStyle === args.element.childNodes[index].innerHTML.split(' ').join('').toLocaleLowerCase()) {
|
|
3947
|
+
addClass([args.element.childNodes[index]], 'e-active');
|
|
3948
|
+
}
|
|
3949
|
+
else if (currentListStyle === '') {
|
|
3950
|
+
addClass([args.element.childNodes[index]], 'e-active');
|
|
3951
|
+
}
|
|
3952
|
+
}
|
|
3953
|
+
}
|
|
3954
|
+
}
|
|
3955
|
+
else {
|
|
3956
|
+
addClass([args.element.childNodes[0]], 'e-active');
|
|
3957
|
+
}
|
|
3958
|
+
}
|
|
3959
|
+
this.closeTooltip({ target: args.event.target });
|
|
3893
3960
|
if (proxy.parent.readonly || !proxy.parent.enabled) {
|
|
3894
3961
|
args.cancel = true;
|
|
3895
3962
|
return;
|
|
@@ -4303,23 +4370,13 @@ class BaseToolbar {
|
|
|
4303
4370
|
case '-':
|
|
4304
4371
|
return { type: 'Separator', cssClass: CLS_HR_SEPARATOR };
|
|
4305
4372
|
default:
|
|
4306
|
-
|
|
4307
|
-
|
|
4308
|
-
|
|
4309
|
-
|
|
4310
|
-
|
|
4311
|
-
|
|
4312
|
-
|
|
4313
|
-
};
|
|
4314
|
-
}
|
|
4315
|
-
else {
|
|
4316
|
-
return {
|
|
4317
|
-
id: this.parent.getID() + '_' + container + '_' + this.tools[itemStr.toLocaleLowerCase()].id,
|
|
4318
|
-
prefixIcon: this.tools[itemStr.toLocaleLowerCase()].icon,
|
|
4319
|
-
command: this.tools[itemStr.toLocaleLowerCase()].command,
|
|
4320
|
-
subCommand: this.tools[itemStr.toLocaleLowerCase()].subCommand
|
|
4321
|
-
};
|
|
4322
|
-
}
|
|
4373
|
+
return {
|
|
4374
|
+
id: this.parent.getID() + '_' + container + '_' + this.tools[itemStr.toLocaleLowerCase()].id,
|
|
4375
|
+
prefixIcon: this.tools[itemStr.toLocaleLowerCase()].icon,
|
|
4376
|
+
tooltipText: getTooltipText(itemStr, this.locator),
|
|
4377
|
+
command: this.tools[itemStr.toLocaleLowerCase()].command,
|
|
4378
|
+
subCommand: this.tools[itemStr.toLocaleLowerCase()].subCommand
|
|
4379
|
+
};
|
|
4323
4380
|
}
|
|
4324
4381
|
}
|
|
4325
4382
|
}
|
|
@@ -4366,17 +4423,21 @@ class BaseToolbar {
|
|
|
4366
4423
|
items.push(item);
|
|
4367
4424
|
}
|
|
4368
4425
|
}
|
|
4369
|
-
|
|
4370
|
-
|
|
4371
|
-
|
|
4372
|
-
|
|
4373
|
-
|
|
4374
|
-
|
|
4375
|
-
|
|
4376
|
-
|
|
4377
|
-
|
|
4378
|
-
|
|
4379
|
-
|
|
4426
|
+
if (this.parent.showTooltip) {
|
|
4427
|
+
for (let num = 0; num < items.length; num++) {
|
|
4428
|
+
const tooltipText = items[num].tooltipText;
|
|
4429
|
+
let shortCutKey;
|
|
4430
|
+
if (windowKeys[`${tooltipText}`]) {
|
|
4431
|
+
shortCutKey = window.navigator.platform.toLocaleLowerCase().includes('mac') ? windowKeys[`${tooltipText}`].replace('Ctrl', 'Cmd') : windowKeys[`${tooltipText}`];
|
|
4432
|
+
}
|
|
4433
|
+
else {
|
|
4434
|
+
shortCutKey = tooltipText;
|
|
4435
|
+
}
|
|
4436
|
+
if (shortCutKey) {
|
|
4437
|
+
if (!(items[num].command === "Images" && items[num].subCommand === "InsertLink")) {
|
|
4438
|
+
items[num].tooltipText = (tooltipText !== shortCutKey) ? tooltipText + ' (' + shortCutKey + ')' : tooltipText;
|
|
4439
|
+
}
|
|
4440
|
+
}
|
|
4380
4441
|
}
|
|
4381
4442
|
}
|
|
4382
4443
|
return items;
|
|
@@ -4425,7 +4486,7 @@ class DropDownButtons {
|
|
|
4425
4486
|
addClass([args.element], item.cssClass);
|
|
4426
4487
|
}
|
|
4427
4488
|
if (item.command === 'Images' || item.command === 'Videos' || item.command === 'Audios' || item.command === 'Table') {
|
|
4428
|
-
args.element.setAttribute('title', getQuickToolbarTooltipText(item.text));
|
|
4489
|
+
args.element.setAttribute('title', getQuickToolbarTooltipText(item.text) !== '' ? getQuickToolbarTooltipText(item.text) : item.text);
|
|
4429
4490
|
}
|
|
4430
4491
|
if (item.command === 'Alignments' || item.subCommand === 'JustifyLeft'
|
|
4431
4492
|
|| item.subCommand === 'JustifyRight' || item.subCommand === 'JustifyCenter') {
|
|
@@ -4435,13 +4496,13 @@ class DropDownButtons {
|
|
|
4435
4496
|
args.element.setAttribute('title', getTooltipTextDropdownItems(item.subCommand.toLocaleLowerCase(), this.locator, formatsLocale));
|
|
4436
4497
|
}
|
|
4437
4498
|
if (item.command === 'Font') {
|
|
4438
|
-
args.element.setAttribute('title', getTooltipTextDropdownItems(item.
|
|
4499
|
+
args.element.setAttribute('title', getTooltipTextDropdownItems(item.text.toLocaleLowerCase(), this.locator, fontNameLocale) !== '' ? getTooltipTextDropdownItems(item.text.toLocaleLowerCase(), this.locator, fontNameLocale) : item.text);
|
|
4439
4500
|
}
|
|
4440
4501
|
if (item.subCommand === 'BulletFormatList') {
|
|
4441
|
-
args.element.setAttribute('title', getTooltipTextDropdownItems(item.
|
|
4502
|
+
args.element.setAttribute('title', getTooltipTextDropdownItems(item.text.toLocaleLowerCase(), this.locator, bulletFormatListLocale) !== '' ? getTooltipTextDropdownItems(item.text.toLocaleLowerCase(), this.locator, bulletFormatListLocale) : item.text);
|
|
4442
4503
|
}
|
|
4443
4504
|
if (item.subCommand === 'NumberFormatList') {
|
|
4444
|
-
args.element.setAttribute('title', getTooltipTextDropdownItems(item.text.
|
|
4505
|
+
args.element.setAttribute('title', (getTooltipTextDropdownItems(item.text.toLocaleLowerCase(), this.locator, numberFormatListLocale)) !== '' ? getTooltipTextDropdownItems(item.text.toLocaleLowerCase(), this.locator, numberFormatListLocale) : item.text);
|
|
4445
4506
|
}
|
|
4446
4507
|
if (item.subCommand === 'FontSize') {
|
|
4447
4508
|
args.element.setAttribute('title', getTooltipTextDropdownItems(item.value.toLocaleLowerCase(), null, null, this.parent));
|
|
@@ -5242,72 +5303,14 @@ class Toolbar$2 {
|
|
|
5242
5303
|
}
|
|
5243
5304
|
}
|
|
5244
5305
|
toggleFloatClass(e) {
|
|
5245
|
-
let topValue;
|
|
5246
|
-
let isBody = false;
|
|
5247
|
-
let isFloat = false;
|
|
5248
|
-
let scrollParent;
|
|
5249
5306
|
const floatOffset = this.parent.floatingToolbarOffset;
|
|
5250
|
-
if (
|
|
5251
|
-
|
|
5252
|
-
|
|
5253
|
-
else if (e && e.target !== document) {
|
|
5254
|
-
scrollParent = e.target;
|
|
5255
|
-
}
|
|
5256
|
-
else {
|
|
5257
|
-
isBody = true;
|
|
5258
|
-
scrollParent = document.body;
|
|
5259
|
-
}
|
|
5260
|
-
const tbHeight = this.getToolbarHeight() + this.getExpandTBarPopHeight();
|
|
5261
|
-
if (this.isTransformChild) {
|
|
5262
|
-
topValue = 0;
|
|
5263
|
-
let scrollParentRelativeTop = 0;
|
|
5264
|
-
const trgHeight = this.parent.element.offsetHeight;
|
|
5265
|
-
if (isBody) {
|
|
5266
|
-
const bodyStyle = window.getComputedStyle(scrollParent);
|
|
5267
|
-
scrollParentRelativeTop = parseFloat(bodyStyle.marginTop.split('px')[0]) + parseFloat(bodyStyle.paddingTop.split('px')[0]);
|
|
5268
|
-
}
|
|
5269
|
-
const targetTop = this.parent.element.getBoundingClientRect().top;
|
|
5270
|
-
const scrollParentYOffset = (Browser.isMSPointer && isBody) ? window.pageYOffset : scrollParent.parentElement.scrollTop;
|
|
5271
|
-
const scrollParentRect = scrollParent.getBoundingClientRect();
|
|
5272
|
-
const scrollParentTop = (!isBody) ? scrollParentRect.top : (scrollParentRect.top + scrollParentYOffset);
|
|
5273
|
-
const outOfRange = ((targetTop - ((!isBody) ? scrollParentTop : 0))
|
|
5274
|
-
+ trgHeight > tbHeight + floatOffset) ? false : true;
|
|
5275
|
-
if (targetTop > (scrollParentTop + floatOffset) || targetTop < -trgHeight || ((targetTop < 0) ? outOfRange : false)) {
|
|
5276
|
-
isFloat = false;
|
|
5277
|
-
removeClass([this.tbElement], [CLS_TB_ABS_FLOAT]);
|
|
5278
|
-
}
|
|
5279
|
-
else if (targetTop < (scrollParentTop + floatOffset)) {
|
|
5280
|
-
if (targetTop < 0) {
|
|
5281
|
-
topValue = (-targetTop) + scrollParentTop;
|
|
5282
|
-
}
|
|
5283
|
-
else {
|
|
5284
|
-
topValue = scrollParentTop - targetTop;
|
|
5285
|
-
}
|
|
5286
|
-
topValue = (isBody) ? topValue - scrollParentRelativeTop : topValue;
|
|
5287
|
-
addClass([this.tbElement], [CLS_TB_ABS_FLOAT]);
|
|
5288
|
-
isFloat = true;
|
|
5289
|
-
}
|
|
5290
|
-
}
|
|
5291
|
-
else {
|
|
5292
|
-
const parent = this.parent.element.getBoundingClientRect();
|
|
5293
|
-
if (window.innerHeight < parent.top) {
|
|
5294
|
-
return;
|
|
5295
|
-
}
|
|
5296
|
-
topValue = (e && e.target !== document) ? scrollParent.getBoundingClientRect().top : 0;
|
|
5297
|
-
if ((parent.bottom < (floatOffset + tbHeight + topValue)) || parent.bottom < 0 || parent.top > floatOffset + topValue) {
|
|
5298
|
-
isFloat = false;
|
|
5299
|
-
}
|
|
5300
|
-
else if (parent.top < floatOffset || parent.top < floatOffset + topValue) {
|
|
5301
|
-
isFloat = true;
|
|
5302
|
-
}
|
|
5303
|
-
}
|
|
5304
|
-
if (!isFloat) {
|
|
5305
|
-
removeClass([this.tbElement], [CLS_TB_FLOAT]);
|
|
5306
|
-
setStyleAttribute(this.tbElement, { top: 0 + 'px', width: '100%' });
|
|
5307
|
+
if (this.parent.toolbarSettings.enableFloating) {
|
|
5308
|
+
addClass([this.tbElement.parentElement], [CLS_TB_FLOAT]);
|
|
5309
|
+
setStyleAttribute(this.tbElement.parentElement, { top: (floatOffset) + 'px' });
|
|
5307
5310
|
}
|
|
5308
5311
|
else {
|
|
5309
|
-
|
|
5310
|
-
setStyleAttribute(this.tbElement, {
|
|
5312
|
+
removeClass([this.tbElement.parentElement], [CLS_TB_FLOAT]);
|
|
5313
|
+
setStyleAttribute(this.tbElement.parentElement, { top: '' });
|
|
5311
5314
|
}
|
|
5312
5315
|
}
|
|
5313
5316
|
renderToolbar() {
|
|
@@ -5613,19 +5616,6 @@ class Toolbar$2 {
|
|
|
5613
5616
|
this.toolbarActionModule.parent = null;
|
|
5614
5617
|
this.dropDownModule.parent = null;
|
|
5615
5618
|
}
|
|
5616
|
-
scrollHandler(e) {
|
|
5617
|
-
if (!this.parent.inlineMode.enable) {
|
|
5618
|
-
if (this.parent.toolbarSettings.enableFloating && this.getDOMVisibility(this.tbElement)) {
|
|
5619
|
-
this.toggleFloatClass(e.args);
|
|
5620
|
-
}
|
|
5621
|
-
}
|
|
5622
|
-
}
|
|
5623
|
-
getDOMVisibility(el) {
|
|
5624
|
-
if (!el.offsetParent && el.offsetWidth === 0 && el.offsetHeight === 0) {
|
|
5625
|
-
return false;
|
|
5626
|
-
}
|
|
5627
|
-
return true;
|
|
5628
|
-
}
|
|
5629
5619
|
mouseDownHandler() {
|
|
5630
5620
|
if (Browser.isDevice && this.parent.inlineMode.enable && !isIDevice()) {
|
|
5631
5621
|
this.showFixedTBar();
|
|
@@ -5662,11 +5652,6 @@ class Toolbar$2 {
|
|
|
5662
5652
|
}
|
|
5663
5653
|
adjustContentHeight(trg, isKeyboard) {
|
|
5664
5654
|
if (trg && this.parent.toolbarSettings.type === ToolbarType.Expand && !isNullOrUndefined(trg)) {
|
|
5665
|
-
const extendedTbar = this.tbElement.querySelector('.e-toolbar-extended');
|
|
5666
|
-
if (!isNullOrUndefined(extendedTbar)) {
|
|
5667
|
-
setStyleAttribute(extendedTbar, { maxHeight: '', display: 'block' });
|
|
5668
|
-
setStyleAttribute(extendedTbar, { maxHeight: extendedTbar.offsetHeight + 'px', display: '' });
|
|
5669
|
-
}
|
|
5670
5655
|
const hasActiveClass = trg.classList.contains('e-nav-active');
|
|
5671
5656
|
const isExpand = isKeyboard ? (hasActiveClass ? false : true) : (hasActiveClass ? true : false);
|
|
5672
5657
|
if (isExpand) {
|
|
@@ -5675,7 +5660,7 @@ class Toolbar$2 {
|
|
|
5675
5660
|
else {
|
|
5676
5661
|
removeClass([this.tbElement], [CLS_EXPAND_OPEN]);
|
|
5677
5662
|
}
|
|
5678
|
-
this.parent.setContentHeight('
|
|
5663
|
+
this.parent.setContentHeight('Toolbar', isExpand);
|
|
5679
5664
|
}
|
|
5680
5665
|
else if (Browser.isDevice || this.parent.inlineMode.enable) {
|
|
5681
5666
|
this.isToolbar = true;
|
|
@@ -5700,7 +5685,6 @@ class Toolbar$2 {
|
|
|
5700
5685
|
this.dropDownModule = new DropDownButtons(this.parent, this.locator);
|
|
5701
5686
|
this.toolbarActionModule = new ToolbarAction(this.parent);
|
|
5702
5687
|
this.parent.on(initialEnd, this.renderToolbar, this);
|
|
5703
|
-
this.parent.on(scroll, this.scrollHandler, this);
|
|
5704
5688
|
this.parent.on(bindOnEnd, this.toolbarBindEvent, this);
|
|
5705
5689
|
this.parent.on(toolbarUpdated, this.updateToolbarStatus, this);
|
|
5706
5690
|
this.parent.on(modelChanged, this.onPropertyChanged, this);
|
|
@@ -5725,7 +5709,6 @@ class Toolbar$2 {
|
|
|
5725
5709
|
return;
|
|
5726
5710
|
}
|
|
5727
5711
|
this.parent.off(initialEnd, this.renderToolbar);
|
|
5728
|
-
this.parent.off(scroll, this.scrollHandler);
|
|
5729
5712
|
this.parent.off(bindOnEnd, this.toolbarBindEvent);
|
|
5730
5713
|
this.parent.off(toolbarUpdated, this.updateToolbarStatus);
|
|
5731
5714
|
this.parent.off(modelChanged, this.onPropertyChanged);
|
|
@@ -5760,7 +5743,8 @@ class Toolbar$2 {
|
|
|
5760
5743
|
if (!this.parent.inlineMode.enable) {
|
|
5761
5744
|
this.refreshToolbarOverflow();
|
|
5762
5745
|
}
|
|
5763
|
-
this.parent.
|
|
5746
|
+
const isExpand = this.parent.element.querySelectorAll('.e-toolbar-extended.e-popup-open').length > 0 ? true : false;
|
|
5747
|
+
this.parent.setContentHeight('Refresh', isExpand);
|
|
5764
5748
|
}
|
|
5765
5749
|
/**
|
|
5766
5750
|
* Called internally if any of the property value changed.
|
|
@@ -5780,6 +5764,11 @@ class Toolbar$2 {
|
|
|
5780
5764
|
}
|
|
5781
5765
|
}
|
|
5782
5766
|
}
|
|
5767
|
+
if (!isNullOrUndefined(e.newProp.toolbarSettings)) {
|
|
5768
|
+
if (!isNullOrUndefined(e.newProp.toolbarSettings.enableFloating)) {
|
|
5769
|
+
this.toggleFloatClass();
|
|
5770
|
+
}
|
|
5771
|
+
}
|
|
5783
5772
|
if (e.module !== this.getModuleName()) {
|
|
5784
5773
|
return;
|
|
5785
5774
|
}
|
|
@@ -6279,7 +6268,7 @@ class BaseQuickToolbar {
|
|
|
6279
6268
|
constructor(parent, locator) {
|
|
6280
6269
|
this.parent = parent;
|
|
6281
6270
|
this.locator = locator;
|
|
6282
|
-
this.
|
|
6271
|
+
this.isRendered = false;
|
|
6283
6272
|
this.renderFactory = this.locator.getService('rendererFactory');
|
|
6284
6273
|
this.contentRenderer = this.renderFactory.getRenderer(RenderType.Content);
|
|
6285
6274
|
this.popupRenderer = this.renderFactory.getRenderer(RenderType.Popup);
|
|
@@ -6343,7 +6332,18 @@ class BaseQuickToolbar {
|
|
|
6343
6332
|
e.target.classList.contains('e-imgbreak')) ? false : true;
|
|
6344
6333
|
let target = !isNullOrUndefined(imgWrapper) ? imgWrapper : e.target;
|
|
6345
6334
|
addClass([this.toolbarElement], [CLS_RM_WHITE_SPACE]);
|
|
6346
|
-
|
|
6335
|
+
let targetOffsetTop;
|
|
6336
|
+
if (!isNullOrUndefined(closest(target, 'table'))) {
|
|
6337
|
+
targetOffsetTop = target.offsetTop;
|
|
6338
|
+
let parentTable = closest(target, 'table');
|
|
6339
|
+
while (!isNullOrUndefined(parentTable)) {
|
|
6340
|
+
targetOffsetTop += parentTable.offsetTop;
|
|
6341
|
+
parentTable = closest(parentTable.parentElement, 'table');
|
|
6342
|
+
}
|
|
6343
|
+
}
|
|
6344
|
+
else {
|
|
6345
|
+
targetOffsetTop = (target.classList.contains("e-rte-audio")) ? target.parentElement.offsetTop : target.offsetTop;
|
|
6346
|
+
}
|
|
6347
6347
|
const parentOffsetTop = window.pageYOffset + e.parentData.top;
|
|
6348
6348
|
if ((targetOffsetTop - e.editTop) > e.popHeight) {
|
|
6349
6349
|
y = parentOffsetTop + e.tBarElementHeight + (targetOffsetTop - e.editTop) - e.popHeight - 5;
|
|
@@ -6355,11 +6355,30 @@ class BaseQuickToolbar {
|
|
|
6355
6355
|
y = e.y;
|
|
6356
6356
|
}
|
|
6357
6357
|
target = isAligned ? e.target : target;
|
|
6358
|
-
|
|
6359
|
-
|
|
6358
|
+
let targetOffsetLeft;
|
|
6359
|
+
let currentOffsetWidth;
|
|
6360
|
+
if (!isNullOrUndefined(closest(target, 'table'))) {
|
|
6361
|
+
targetOffsetLeft = target.offsetLeft;
|
|
6362
|
+
let parentTable = closest(target, 'table');
|
|
6363
|
+
let checkOffSetParentWidth = false;
|
|
6364
|
+
if (!isNullOrUndefined(closest(parentTable, 'TD'))) {
|
|
6365
|
+
checkOffSetParentWidth = true;
|
|
6366
|
+
}
|
|
6367
|
+
while (!isNullOrUndefined(parentTable)) {
|
|
6368
|
+
targetOffsetLeft += parentTable.offsetLeft;
|
|
6369
|
+
currentOffsetWidth = checkOffSetParentWidth ? parentTable.offsetWidth : target.offsetWidth;
|
|
6370
|
+
parentTable = closest(parentTable.parentElement, 'table');
|
|
6371
|
+
}
|
|
6360
6372
|
}
|
|
6361
6373
|
else {
|
|
6362
|
-
|
|
6374
|
+
currentOffsetWidth = target.offsetWidth;
|
|
6375
|
+
targetOffsetLeft = (target.classList.contains("e-rte-audio")) ? target.parentElement.offsetLeft : target.offsetLeft;
|
|
6376
|
+
}
|
|
6377
|
+
if (currentOffsetWidth > e.popWidth) {
|
|
6378
|
+
x = (currentOffsetWidth / 2) - (e.popWidth / 2) + e.parentData.left + targetOffsetLeft;
|
|
6379
|
+
}
|
|
6380
|
+
else {
|
|
6381
|
+
x = e.parentData.left + targetOffsetLeft;
|
|
6363
6382
|
}
|
|
6364
6383
|
this.popupObj.position.X = ((x + e.popWidth) > e.parentData.right) ? e.parentData.right - e.popWidth : x;
|
|
6365
6384
|
this.popupObj.position.Y = (y >= 0) ? y : e.y + 5;
|
|
@@ -6496,7 +6515,8 @@ class BaseQuickToolbar {
|
|
|
6496
6515
|
openDelay: 400,
|
|
6497
6516
|
showTipPointer: true,
|
|
6498
6517
|
windowCollision: true,
|
|
6499
|
-
position: 'BottomCenter'
|
|
6518
|
+
position: 'BottomCenter',
|
|
6519
|
+
cssClass: this.parent.getCssClass()
|
|
6500
6520
|
});
|
|
6501
6521
|
this.tooltip.appendTo(this.element);
|
|
6502
6522
|
}
|
|
@@ -6530,7 +6550,7 @@ class BaseQuickToolbar {
|
|
|
6530
6550
|
parentData: parent.getBoundingClientRect(),
|
|
6531
6551
|
tBarElementHeight: tBarHeight
|
|
6532
6552
|
};
|
|
6533
|
-
if ((target.tagName === 'IMG' || target.tagName === 'AUDIO' || target.tagName === 'VIDEO' || target.tagName === 'IFRAME' || (target.classList &&
|
|
6553
|
+
if ((closest(target, 'TABLE') || target.tagName === 'IMG' || target.tagName === 'AUDIO' || target.tagName === 'VIDEO' || target.tagName === 'IFRAME' || (target.classList &&
|
|
6534
6554
|
(target.classList.contains(CLS_AUDIOWRAP) || target.classList.contains(CLS_CLICKELEM) ||
|
|
6535
6555
|
target.classList.contains(CLS_VID_CLICK_ELEM)))) && (x == beforeQuickToolbarArgs.positionX || y == beforeQuickToolbarArgs.positionY)) {
|
|
6536
6556
|
this.setPosition(showPopupData);
|
|
@@ -6550,7 +6570,7 @@ class BaseQuickToolbar {
|
|
|
6550
6570
|
maxWidth: window.outerWidth + 'px'
|
|
6551
6571
|
});
|
|
6552
6572
|
addClass([this.element], [CLS_POP]);
|
|
6553
|
-
this.
|
|
6573
|
+
this.isRendered = true;
|
|
6554
6574
|
}
|
|
6555
6575
|
});
|
|
6556
6576
|
}
|
|
@@ -6590,7 +6610,7 @@ class BaseQuickToolbar {
|
|
|
6590
6610
|
this.parent.notify(destroyTooltip, { args: event });
|
|
6591
6611
|
}
|
|
6592
6612
|
this.removeEleFromDOM();
|
|
6593
|
-
this.
|
|
6613
|
+
this.isRendered = false;
|
|
6594
6614
|
}
|
|
6595
6615
|
/**
|
|
6596
6616
|
* @param {string} item - specifies the string value
|
|
@@ -6613,7 +6633,7 @@ class BaseQuickToolbar {
|
|
|
6613
6633
|
}
|
|
6614
6634
|
removeEleFromDOM() {
|
|
6615
6635
|
const element = this.popupObj.element;
|
|
6616
|
-
if (this.
|
|
6636
|
+
if (this.isRendered) {
|
|
6617
6637
|
this.dropDownButtons.destroyDropDowns();
|
|
6618
6638
|
this.colorPickerObj.destroyColorPicker();
|
|
6619
6639
|
removeClass([this.element], [CLS_POP]);
|
|
@@ -7024,6 +7044,9 @@ class QuickToolbar {
|
|
|
7024
7044
|
}
|
|
7025
7045
|
}
|
|
7026
7046
|
if (!isNullOrUndefined(this.textQTBar) && !isNullOrUndefined(this.parent.quickToolbarSettings.text) && !this.parent.inlineMode.enable) {
|
|
7047
|
+
if (!isNullOrUndefined(e) && !isNullOrUndefined(e.name) && e.name === 'sourceCodeMouseDown') {
|
|
7048
|
+
return;
|
|
7049
|
+
}
|
|
7027
7050
|
const args = e.args.touches ?
|
|
7028
7051
|
e.args.changedTouches[0] : e.args;
|
|
7029
7052
|
const target = e.args.target;
|
|
@@ -7034,7 +7057,7 @@ class QuickToolbar {
|
|
|
7034
7057
|
this.offsetY = pageYOffset(args, this.parent.element, this.parent.iframeSettings.enable);
|
|
7035
7058
|
const range = this.parent.getRange();
|
|
7036
7059
|
if ((range.endContainer.parentElement.tagName === range.startContainer.parentElement.tagName && (range.startContainer.parentElement.tagName === 'A' && range.endContainer.parentElement.tagName === 'A')) ||
|
|
7037
|
-
(target.tagName === 'IMG') || (target.tagName === 'VIDEO') || (target.tagName === 'AUDIO') || (target.childNodes[0].nodeType === 1 && target.childNodes[0].classList.contains('e-rte-audio')) ||
|
|
7060
|
+
(target.tagName === 'IMG') || (target.tagName === 'VIDEO') || (target.tagName === 'AUDIO') || (target.childNodes[0] && target.childNodes[0].nodeType === 1 && target.childNodes[0].classList.contains('e-rte-audio')) ||
|
|
7038
7061
|
(this.parent.getRange().startOffset === this.parent.getRange().endOffset)) {
|
|
7039
7062
|
return;
|
|
7040
7063
|
}
|
|
@@ -7042,13 +7065,16 @@ class QuickToolbar {
|
|
|
7042
7065
|
this.textQTBar.showPopup(this.offsetX, this.offsetY, target, 'text');
|
|
7043
7066
|
}
|
|
7044
7067
|
}
|
|
7045
|
-
keyDownHandler() {
|
|
7046
|
-
|
|
7047
|
-
|
|
7048
|
-
this.
|
|
7049
|
-
|
|
7050
|
-
|
|
7051
|
-
|
|
7068
|
+
keyDownHandler(e) {
|
|
7069
|
+
const preventHide = e.args.altKey;
|
|
7070
|
+
if (!preventHide) {
|
|
7071
|
+
if ((this.parent.inlineMode.enable && (!Browser.isDevice || isIDevice()))
|
|
7072
|
+
&& !isNullOrUndefined(select('.' + CLS_INLINE_POP, document))) {
|
|
7073
|
+
this.hideInlineQTBar();
|
|
7074
|
+
}
|
|
7075
|
+
if (this.textQTBar && !hasClass(this.textQTBar.element, 'e-popup-close')) {
|
|
7076
|
+
this.textQTBar.hidePopup();
|
|
7077
|
+
}
|
|
7052
7078
|
}
|
|
7053
7079
|
}
|
|
7054
7080
|
inlineQTBarMouseDownHandler() {
|
|
@@ -7374,6 +7400,15 @@ class QuickToolbar {
|
|
|
7374
7400
|
getModuleName() {
|
|
7375
7401
|
return 'quickToolbar';
|
|
7376
7402
|
}
|
|
7403
|
+
/**
|
|
7404
|
+
*
|
|
7405
|
+
* @returns {BaseQuickToolbar[]} - specifies the quick toolbar instance.
|
|
7406
|
+
* @hidden
|
|
7407
|
+
* @private
|
|
7408
|
+
*/
|
|
7409
|
+
getQuickToolbarInstance() {
|
|
7410
|
+
return [this.linkQTBar, this.imageQTBar, this.audioQTBar, this.videoQTBar, this.tableQTBar, this.textQTBar, this.inlineQTBar];
|
|
7411
|
+
}
|
|
7377
7412
|
}
|
|
7378
7413
|
|
|
7379
7414
|
/**
|
|
@@ -9645,6 +9680,17 @@ const selfClosingTags = [
|
|
|
9645
9680
|
'BR',
|
|
9646
9681
|
'IMG'
|
|
9647
9682
|
];
|
|
9683
|
+
/**
|
|
9684
|
+
* Resize factor for image.
|
|
9685
|
+
* @hidden
|
|
9686
|
+
*
|
|
9687
|
+
*/
|
|
9688
|
+
const imageResizeFactor = {
|
|
9689
|
+
topLeft: [-1, -1],
|
|
9690
|
+
topRight: [1, -1],
|
|
9691
|
+
botRight: [1, 1],
|
|
9692
|
+
botLeft: [-1, 1]
|
|
9693
|
+
};
|
|
9648
9694
|
|
|
9649
9695
|
/**
|
|
9650
9696
|
* `Undo` module is used to handle undo actions.
|
|
@@ -10578,7 +10624,9 @@ class MarkdownEditor {
|
|
|
10578
10624
|
onToolbarClick(args) {
|
|
10579
10625
|
const item = args.item;
|
|
10580
10626
|
const textArea = this.parent.contentModule.getEditPanel();
|
|
10581
|
-
|
|
10627
|
+
if (item.command !== 'Formats') {
|
|
10628
|
+
textArea.focus();
|
|
10629
|
+
}
|
|
10582
10630
|
const startOffset = textArea.selectionStart;
|
|
10583
10631
|
const endOffset = textArea.selectionEnd;
|
|
10584
10632
|
const text = textArea.value.substring(startOffset, endOffset);
|
|
@@ -11899,11 +11947,12 @@ class DOMNode {
|
|
|
11899
11947
|
/**
|
|
11900
11948
|
* blockNodes method
|
|
11901
11949
|
*
|
|
11950
|
+
* @param {boolean} action - Optional Boolean that specifies the action is whether performed.
|
|
11902
11951
|
* @returns {Node[]} - returns the node array values
|
|
11903
11952
|
* @hidden
|
|
11904
11953
|
* @deprecated
|
|
11905
11954
|
*/
|
|
11906
|
-
blockNodes() {
|
|
11955
|
+
blockNodes(action) {
|
|
11907
11956
|
const collectionNodes = [];
|
|
11908
11957
|
const selection = this.getSelection();
|
|
11909
11958
|
if (this.isEditorArea() && selection.rangeCount) {
|
|
@@ -11917,23 +11966,46 @@ class DOMNode {
|
|
|
11917
11966
|
collectionNodes.push(startNode);
|
|
11918
11967
|
}
|
|
11919
11968
|
parentNode = this.blockParentNode(startNode);
|
|
11969
|
+
const endParentNode = this.blockParentNode(endNode);
|
|
11920
11970
|
if (parentNode && collectionNodes.indexOf(parentNode) < 0) {
|
|
11921
|
-
if (
|
|
11922
|
-
|
|
11923
|
-
|
|
11924
|
-
|
|
11925
|
-
|
|
11926
|
-
|
|
11927
|
-
|
|
11928
|
-
|
|
11929
|
-
|
|
11971
|
+
if (!isNullOrUndefined(action) && action) {
|
|
11972
|
+
if (range.commonAncestorContainer.nodeName === 'TD' || parentNode.nodeName === 'TD' || endParentNode.nodeName === 'TD') {
|
|
11973
|
+
const processedNodes = this.getPreBlockNodeCollection(range);
|
|
11974
|
+
if (processedNodes.length > 1) {
|
|
11975
|
+
this.wrapWithBlockNode(processedNodes, collectionNodes);
|
|
11976
|
+
}
|
|
11977
|
+
else if (processedNodes.length > 0) {
|
|
11978
|
+
if (startNode !== endNode && startNode.nodeName !== 'BR') {
|
|
11979
|
+
collectionNodes.push(this.createTempNode(startNode));
|
|
11980
|
+
}
|
|
11981
|
+
else if (startNode === endNode && startNode.nodeName === 'SPAN' && (startNode.classList.contains(markerClassName.startSelection)
|
|
11982
|
+
|| startNode.classList.contains(markerClassName.endSelection))) {
|
|
11983
|
+
collectionNodes.push(this.createTempNode(startNode));
|
|
11984
|
+
}
|
|
11985
|
+
}
|
|
11930
11986
|
}
|
|
11931
11987
|
else {
|
|
11932
|
-
collectionNodes.push(
|
|
11988
|
+
collectionNodes.push(parentNode);
|
|
11933
11989
|
}
|
|
11934
11990
|
}
|
|
11935
11991
|
else {
|
|
11936
|
-
|
|
11992
|
+
if (IGNORE_BLOCK_TAGS.indexOf(parentNode.tagName.toLocaleLowerCase()) >= 0 && (startNode.tagName === 'BR' ||
|
|
11993
|
+
startNode.nodeType === Node.TEXT_NODE ||
|
|
11994
|
+
startNode.classList.contains(markerClassName.startSelection) ||
|
|
11995
|
+
startNode.classList.contains(markerClassName.endSelection))) {
|
|
11996
|
+
const tempNode = startNode.previousSibling &&
|
|
11997
|
+
startNode.previousSibling.nodeType === Node.TEXT_NODE ?
|
|
11998
|
+
startNode.previousSibling : startNode;
|
|
11999
|
+
if (!startNode.nextSibling && !startNode.previousSibling && startNode.tagName === 'BR') {
|
|
12000
|
+
collectionNodes.push(tempNode);
|
|
12001
|
+
}
|
|
12002
|
+
else {
|
|
12003
|
+
collectionNodes.push(this.createTempNode(tempNode));
|
|
12004
|
+
}
|
|
12005
|
+
}
|
|
12006
|
+
else {
|
|
12007
|
+
collectionNodes.push(parentNode);
|
|
12008
|
+
}
|
|
11937
12009
|
}
|
|
11938
12010
|
}
|
|
11939
12011
|
const nodes = [];
|
|
@@ -12002,6 +12074,131 @@ class DOMNode {
|
|
|
12002
12074
|
ignoreTableTag(element) {
|
|
12003
12075
|
return !(TABLE_BLOCK_TAGS.indexOf(element.tagName.toLocaleLowerCase()) >= 0);
|
|
12004
12076
|
}
|
|
12077
|
+
getPreBlockNodeCollection(range) {
|
|
12078
|
+
const startNode = this.getSelectedNode(range.startContainer, range.startOffset);
|
|
12079
|
+
const endNode = this.getSelectedNode(range.endContainer, range.endOffset);
|
|
12080
|
+
const nodes = [];
|
|
12081
|
+
const rootNode = startNode.closest('td, th');
|
|
12082
|
+
if (isNullOrUndefined(rootNode)) {
|
|
12083
|
+
return nodes;
|
|
12084
|
+
}
|
|
12085
|
+
const rootChildNode = Array.from(rootNode.childNodes);
|
|
12086
|
+
let isContinue = true;
|
|
12087
|
+
const processedStart = this.getClosestInlineParent(startNode, rootNode, true);
|
|
12088
|
+
const processedEnd = this.getClosestInlineParent(endNode, rootNode, false);
|
|
12089
|
+
for (let i = 0; i < rootChildNode.length; i++) {
|
|
12090
|
+
const child = rootChildNode[i];
|
|
12091
|
+
if (processedStart === processedEnd && child === processedStart) {
|
|
12092
|
+
nodes.push(child);
|
|
12093
|
+
isContinue = true;
|
|
12094
|
+
}
|
|
12095
|
+
else if (child === processedStart) {
|
|
12096
|
+
isContinue = false;
|
|
12097
|
+
}
|
|
12098
|
+
else if (child === processedEnd) {
|
|
12099
|
+
nodes.push(child); // Early Exit so Push the end node.
|
|
12100
|
+
isContinue = true;
|
|
12101
|
+
}
|
|
12102
|
+
if (isContinue) {
|
|
12103
|
+
continue;
|
|
12104
|
+
}
|
|
12105
|
+
else {
|
|
12106
|
+
nodes.push(child);
|
|
12107
|
+
}
|
|
12108
|
+
}
|
|
12109
|
+
return nodes;
|
|
12110
|
+
}
|
|
12111
|
+
getClosestInlineParent(node, rootNode, isStart) {
|
|
12112
|
+
// 1. If the node is a text node, return the node
|
|
12113
|
+
// 2. If the node is a block node return block node
|
|
12114
|
+
// 3. If the node is a inline node,
|
|
12115
|
+
// Traverse back untill the TD or TH node
|
|
12116
|
+
// Check if the the previous sibling , next sibling is a block node.
|
|
12117
|
+
// If yes return the inline node that is closest to the block node.
|
|
12118
|
+
if (node.nodeType === Node.TEXT_NODE) {
|
|
12119
|
+
return node;
|
|
12120
|
+
}
|
|
12121
|
+
if (this.isBlockNode(node)) {
|
|
12122
|
+
return node;
|
|
12123
|
+
}
|
|
12124
|
+
let currentNode = node;
|
|
12125
|
+
let rootFlag = false;
|
|
12126
|
+
while (currentNode) {
|
|
12127
|
+
const previousNode = currentNode;
|
|
12128
|
+
if (rootFlag) {
|
|
12129
|
+
if (this.isBlockNode(currentNode)) {
|
|
12130
|
+
return previousNode;
|
|
12131
|
+
}
|
|
12132
|
+
if (isStart && currentNode.previousSibling) {
|
|
12133
|
+
if (this.isBlockNode(currentNode.previousSibling) || currentNode.previousSibling.nodeName === 'BR') {
|
|
12134
|
+
return previousNode;
|
|
12135
|
+
}
|
|
12136
|
+
else {
|
|
12137
|
+
currentNode = currentNode.previousSibling;
|
|
12138
|
+
}
|
|
12139
|
+
}
|
|
12140
|
+
else if (!isStart && currentNode.nextSibling) {
|
|
12141
|
+
if (this.isBlockNode(currentNode.nextSibling) || currentNode.nextSibling.nodeName === 'BR') {
|
|
12142
|
+
return previousNode;
|
|
12143
|
+
}
|
|
12144
|
+
else {
|
|
12145
|
+
currentNode = currentNode.nextSibling;
|
|
12146
|
+
}
|
|
12147
|
+
}
|
|
12148
|
+
else {
|
|
12149
|
+
return currentNode;
|
|
12150
|
+
}
|
|
12151
|
+
}
|
|
12152
|
+
else {
|
|
12153
|
+
currentNode = currentNode.parentElement;
|
|
12154
|
+
if (currentNode === rootNode) {
|
|
12155
|
+
currentNode = previousNode;
|
|
12156
|
+
rootFlag = true;
|
|
12157
|
+
}
|
|
12158
|
+
}
|
|
12159
|
+
}
|
|
12160
|
+
return null;
|
|
12161
|
+
}
|
|
12162
|
+
wrapWithBlockNode(nodes, collectionNodes) {
|
|
12163
|
+
let wrapperElement = createElement('p');
|
|
12164
|
+
for (let i = 0; i < nodes.length; i++) {
|
|
12165
|
+
const child = nodes[i];
|
|
12166
|
+
if (child.nodeName === 'BR') {
|
|
12167
|
+
child.parentNode.insertBefore(wrapperElement, child);
|
|
12168
|
+
wrapperElement.appendChild(child);
|
|
12169
|
+
if (wrapperElement.childNodes.length > 0) {
|
|
12170
|
+
collectionNodes.push(wrapperElement);
|
|
12171
|
+
}
|
|
12172
|
+
wrapperElement = createElement('p');
|
|
12173
|
+
}
|
|
12174
|
+
else {
|
|
12175
|
+
if (!this.isBlockNode(child)) {
|
|
12176
|
+
if (child.nodeName === '#text' && child.textContent.trim() === '') {
|
|
12177
|
+
continue;
|
|
12178
|
+
}
|
|
12179
|
+
if (wrapperElement.childElementCount === 0) {
|
|
12180
|
+
child.parentNode.insertBefore(wrapperElement, child);
|
|
12181
|
+
wrapperElement.appendChild(child);
|
|
12182
|
+
}
|
|
12183
|
+
else {
|
|
12184
|
+
wrapperElement.appendChild(child);
|
|
12185
|
+
}
|
|
12186
|
+
}
|
|
12187
|
+
else {
|
|
12188
|
+
collectionNodes.push(child);
|
|
12189
|
+
}
|
|
12190
|
+
// Use case when the BR is next sibling but the BR is not the part of selection.
|
|
12191
|
+
if ((i === nodes.length - 1) && wrapperElement.nextElementSibling &&
|
|
12192
|
+
wrapperElement.querySelectorAll('br').length === 0 &&
|
|
12193
|
+
wrapperElement.nextElementSibling.nodeName === 'BR') {
|
|
12194
|
+
wrapperElement.appendChild(wrapperElement.nextElementSibling);
|
|
12195
|
+
}
|
|
12196
|
+
}
|
|
12197
|
+
}
|
|
12198
|
+
if (wrapperElement.childNodes.length > 0 && collectionNodes.indexOf(wrapperElement) < 0) {
|
|
12199
|
+
collectionNodes.push(wrapperElement);
|
|
12200
|
+
}
|
|
12201
|
+
}
|
|
12005
12202
|
}
|
|
12006
12203
|
|
|
12007
12204
|
/**
|
|
@@ -12113,7 +12310,8 @@ class Lists {
|
|
|
12113
12310
|
startNode.textContent = '';
|
|
12114
12311
|
}
|
|
12115
12312
|
const startNodeParent = startNode.parentElement;
|
|
12116
|
-
|
|
12313
|
+
const parentOfCurrentOLUL = startNodeParent.parentElement;
|
|
12314
|
+
if (isNullOrUndefined(parentOfCurrentOLUL.closest('UL')) && isNullOrUndefined(parentOfCurrentOLUL.closest('OL'))) {
|
|
12117
12315
|
if (!isNullOrUndefined(startNode.nextElementSibling)) {
|
|
12118
12316
|
const nearBlockNode = this.parent.domNode.blockParentNode(startNode);
|
|
12119
12317
|
this.parent.nodeCutter.GetSpliceNode(range, nearBlockNode);
|
|
@@ -12140,6 +12338,15 @@ class Lists {
|
|
|
12140
12338
|
detach(startNode);
|
|
12141
12339
|
}
|
|
12142
12340
|
}
|
|
12341
|
+
// To handle the nested enter key press in the list for the first LI element
|
|
12342
|
+
if (!isNullOrUndefined(parentOfCurrentOLUL) && (!isNullOrUndefined(parentOfCurrentOLUL.closest('UL')) || !isNullOrUndefined(parentOfCurrentOLUL.closest('OL'))) &&
|
|
12343
|
+
parentOfCurrentOLUL.nodeName === 'LI' && parentOfCurrentOLUL.style.listStyleType === 'none' &&
|
|
12344
|
+
parentOfCurrentOLUL.textContent === '' && startNode.textContent === '' && startNode === startNodeParent.firstElementChild &&
|
|
12345
|
+
isNullOrUndefined(startNode.nextSibling)) {
|
|
12346
|
+
detach(startNodeParent);
|
|
12347
|
+
parentOfCurrentOLUL.style.removeProperty('list-style-type');
|
|
12348
|
+
e.event.preventDefault();
|
|
12349
|
+
}
|
|
12143
12350
|
}
|
|
12144
12351
|
}
|
|
12145
12352
|
backspaceList(e) {
|
|
@@ -12513,7 +12720,7 @@ class Lists {
|
|
|
12513
12720
|
this.currentAction = e.subCommand;
|
|
12514
12721
|
this.currentAction = e.subCommand = this.currentAction === 'NumberFormatList' ? 'OL' : this.currentAction === 'BulletFormatList' ? 'UL' : this.currentAction;
|
|
12515
12722
|
this.domNode.setMarker(this.saveSelection);
|
|
12516
|
-
let listsNodes = this.domNode.blockNodes();
|
|
12723
|
+
let listsNodes = this.domNode.blockNodes(true);
|
|
12517
12724
|
if (e.enterAction === 'BR') {
|
|
12518
12725
|
this.setSelectionBRConfig();
|
|
12519
12726
|
const allSelectedNode = this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument);
|
|
@@ -12627,6 +12834,17 @@ class Lists {
|
|
|
12627
12834
|
listEle.innerHTML = '<li><br/></li>';
|
|
12628
12835
|
elements[i].appendChild(listEle);
|
|
12629
12836
|
}
|
|
12837
|
+
else if ('LI' !== elements[i].tagName && isNullOrUndefined(item) &&
|
|
12838
|
+
elements[i].nodeName === 'BLOCKQUOTE') {
|
|
12839
|
+
const elemAtt = this.domNode.attributes(elements[i]);
|
|
12840
|
+
const openTag = '<' + type + '>';
|
|
12841
|
+
const closeTag = '</' + type + '>';
|
|
12842
|
+
const newTag = 'li' + elemAtt;
|
|
12843
|
+
const replaceHTML = elements[i].innerHTML;
|
|
12844
|
+
const innerHTML = this.domNode.createTagString(newTag, null, replaceHTML);
|
|
12845
|
+
const collectionString = openTag + innerHTML + closeTag;
|
|
12846
|
+
elements[i].innerHTML = collectionString;
|
|
12847
|
+
}
|
|
12630
12848
|
else if ('LI' !== elements[i].tagName && isNullOrUndefined(item)) {
|
|
12631
12849
|
const elemAtt = elements[i].tagName === 'IMG' ? '' : this.domNode.attributes(elements[i]);
|
|
12632
12850
|
const openTag = '<' + type + '>';
|
|
@@ -13413,7 +13631,7 @@ class Formats {
|
|
|
13413
13631
|
}
|
|
13414
13632
|
let save = this.parent.nodeSelection.save(range, this.parent.currentDocument);
|
|
13415
13633
|
this.parent.domNode.setMarker(save);
|
|
13416
|
-
let formatsNodes = this.parent.domNode.blockNodes();
|
|
13634
|
+
let formatsNodes = this.parent.domNode.blockNodes(true);
|
|
13417
13635
|
if (e.enterAction === 'BR') {
|
|
13418
13636
|
this.setSelectionBRConfig();
|
|
13419
13637
|
const allSelectedNode = this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument);
|
|
@@ -13630,6 +13848,10 @@ class InsertHtml {
|
|
|
13630
13848
|
const isCollapsed = range.collapsed;
|
|
13631
13849
|
const nodes = this.getNodeCollection(range, nodeSelection, node);
|
|
13632
13850
|
const closestParentNode = (node.nodeName.toLowerCase() === 'table') ? this.closestEle(nodes[0].parentNode, editNode) : nodes[0];
|
|
13851
|
+
if (closestParentNode && closestParentNode.nodeName === 'LI' && node.nodeName.toLowerCase() === 'table') {
|
|
13852
|
+
this.insertTableInList(range, node, closestParentNode, nodes[0], nodeCutter);
|
|
13853
|
+
return;
|
|
13854
|
+
}
|
|
13633
13855
|
if (isExternal || (!isNullOrUndefined(node) && !isNullOrUndefined(node.classList) &&
|
|
13634
13856
|
node.classList.contains('pasteContent'))) {
|
|
13635
13857
|
this.pasteInsertHTML(nodes, node, range, nodeSelection, nodeCutter, docElement, isCollapsed, closestParentNode, editNode, enterAction);
|
|
@@ -14125,6 +14347,9 @@ class InsertHtml {
|
|
|
14125
14347
|
}
|
|
14126
14348
|
static closestEle(element, editNode) {
|
|
14127
14349
|
let el = element;
|
|
14350
|
+
if (closest(el, 'li')) {
|
|
14351
|
+
return closest(el, 'li');
|
|
14352
|
+
}
|
|
14128
14353
|
while (el && el.nodeType === 1) {
|
|
14129
14354
|
if (el.parentNode === editNode ||
|
|
14130
14355
|
(!isNullOrUndefined(el.parentNode.tagName) &&
|
|
@@ -14135,6 +14360,30 @@ class InsertHtml {
|
|
|
14135
14360
|
}
|
|
14136
14361
|
return null;
|
|
14137
14362
|
}
|
|
14363
|
+
static insertTableInList(range, insertNode, parentNode, currentNode, nodeCutter) {
|
|
14364
|
+
if (range.collapsed) {
|
|
14365
|
+
const isStart = range.startOffset === 0;
|
|
14366
|
+
const isEnd = range.startContainer.textContent.trimEnd().length === range.startOffset;
|
|
14367
|
+
if (isStart || isEnd) {
|
|
14368
|
+
if (isStart) {
|
|
14369
|
+
InsertMethods.AppendBefore(insertNode, currentNode, false);
|
|
14370
|
+
}
|
|
14371
|
+
else {
|
|
14372
|
+
InsertMethods.AppendBefore(insertNode, currentNode, true);
|
|
14373
|
+
}
|
|
14374
|
+
}
|
|
14375
|
+
else {
|
|
14376
|
+
const preNode = nodeCutter.SplitNode(range, parentNode, true);
|
|
14377
|
+
const sibNode = preNode.previousSibling;
|
|
14378
|
+
sibNode.appendChild(insertNode);
|
|
14379
|
+
}
|
|
14380
|
+
}
|
|
14381
|
+
else {
|
|
14382
|
+
range.deleteContents();
|
|
14383
|
+
parentNode.appendChild(insertNode);
|
|
14384
|
+
}
|
|
14385
|
+
insertNode.classList.add('ignore-table');
|
|
14386
|
+
}
|
|
14138
14387
|
}
|
|
14139
14388
|
/**
|
|
14140
14389
|
* Insert method
|
|
@@ -14340,7 +14589,7 @@ class LinkCommand {
|
|
|
14340
14589
|
for (let i = 0, j = 0, k = 0; i <= finalinlineNodes.length; i++) {
|
|
14341
14590
|
if (i === 0) {
|
|
14342
14591
|
finalinlineNodes[i].parentNode.insertBefore(anchorNodes[j], finalinlineNodes[i].nextSibling);
|
|
14343
|
-
if (this.parent.domNode.blockNodes().length === 1) {
|
|
14592
|
+
if (this.parent.domNode.blockNodes().length === 1 && anchorNodes.length === 1) {
|
|
14344
14593
|
this.parent.nodeSelection.setSelectionNode(this.parent.currentDocument, anchorNodes[j]);
|
|
14345
14594
|
}
|
|
14346
14595
|
removeNodes[k] = finalinlineNodes[i];
|
|
@@ -14797,21 +15046,18 @@ class ImageCommand {
|
|
|
14797
15046
|
const selectedNode = this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)[0];
|
|
14798
15047
|
const imgElm = (e.value === 'Replace' || isReplaced) ? e.item.selectParent[0] :
|
|
14799
15048
|
(Browser.isIE ? selectedNode.previousSibling : selectedNode.previousElementSibling);
|
|
14800
|
-
|
|
14801
|
-
|
|
14802
|
-
|
|
14803
|
-
|
|
14804
|
-
|
|
14805
|
-
|
|
14806
|
-
|
|
14807
|
-
|
|
14808
|
-
|
|
14809
|
-
|
|
14810
|
-
}
|
|
14811
|
-
|
|
14812
|
-
if (e.value === 'Replace') {
|
|
14813
|
-
e.item.subCommand = 'Replace';
|
|
14814
|
-
this.callBack(e);
|
|
15049
|
+
let imageInstance = this;
|
|
15050
|
+
const onImageLoadEvent = () => {
|
|
15051
|
+
e.callBack({
|
|
15052
|
+
requestType: (e.value === 'Replace') ? (e.item.subCommand = 'Replace', "Replace") : 'Images',
|
|
15053
|
+
editorMode: 'HTML',
|
|
15054
|
+
event: e.event,
|
|
15055
|
+
range: imageInstance.parent.nodeSelection.getRange(imageInstance.parent.currentDocument),
|
|
15056
|
+
elements: [imgElm]
|
|
15057
|
+
});
|
|
15058
|
+
imgElm.removeEventListener('load', onImageLoadEvent);
|
|
15059
|
+
};
|
|
15060
|
+
imgElm.addEventListener('load', onImageLoadEvent);
|
|
14815
15061
|
}
|
|
14816
15062
|
}
|
|
14817
15063
|
setStyle(imgElement, e, imgReplace) {
|
|
@@ -15523,7 +15769,7 @@ class TableCommand {
|
|
|
15523
15769
|
e.item.selection.restore();
|
|
15524
15770
|
InsertHtml.Insert(this.parent.currentDocument, table, this.parent.editableElement);
|
|
15525
15771
|
e.item.selection.setSelectionText(this.parent.currentDocument, table.querySelector('td'), table.querySelector('td'), 0, 0);
|
|
15526
|
-
if (table.nextElementSibling === null) {
|
|
15772
|
+
if (table.nextElementSibling === null && !table.classList.contains('ignore-table')) {
|
|
15527
15773
|
let insertElem;
|
|
15528
15774
|
if (e.enterAction === 'DIV') {
|
|
15529
15775
|
insertElem = createElement('div');
|
|
@@ -15538,6 +15784,9 @@ class TableCommand {
|
|
|
15538
15784
|
}
|
|
15539
15785
|
this.insertAfter(insertElem, table);
|
|
15540
15786
|
}
|
|
15787
|
+
if (table.classList.contains('ignore-table')) {
|
|
15788
|
+
table.classList.remove('ignore-table');
|
|
15789
|
+
}
|
|
15541
15790
|
table.querySelector('td').classList.add('e-cell-select');
|
|
15542
15791
|
if (e.callBack) {
|
|
15543
15792
|
e.callBack({
|
|
@@ -15957,10 +16206,22 @@ class TableCommand {
|
|
|
15957
16206
|
firstCell.setAttribute('rowspan', (minMaxIndexes.endRow - minMaxIndexes.startRow + 1).toString());
|
|
15958
16207
|
}
|
|
15959
16208
|
let totalWidth = 0;
|
|
16209
|
+
let unit;
|
|
15960
16210
|
for (let j = rowSelectedCells.length - 1; j >= 0; j--) {
|
|
15961
|
-
|
|
16211
|
+
if (!isNullOrUndefined(rowSelectedCells[j].style.width)
|
|
16212
|
+
&& rowSelectedCells[j].style.width !== '') {
|
|
16213
|
+
if (!unit) {
|
|
16214
|
+
const match = rowSelectedCells[j].style.width.match(/^([\d.]+)([a-z%]+)$/i);
|
|
16215
|
+
unit = match ? match[2] : '%';
|
|
16216
|
+
}
|
|
16217
|
+
totalWidth = totalWidth + parseFloat(rowSelectedCells[j].style.width);
|
|
16218
|
+
}
|
|
16219
|
+
else {
|
|
16220
|
+
totalWidth = totalWidth + ((rowSelectedCells[j].offsetWidth / this.curTable.offsetWidth) * 100);
|
|
16221
|
+
unit = '%';
|
|
16222
|
+
}
|
|
15962
16223
|
}
|
|
15963
|
-
firstCell.style.width = totalWidth +
|
|
16224
|
+
firstCell.style.width = totalWidth + unit;
|
|
15964
16225
|
for (let i = 1; i <= selectedCells.length - 1; i++) {
|
|
15965
16226
|
detach(selectedCells[i]);
|
|
15966
16227
|
}
|
|
@@ -16968,6 +17229,30 @@ class SelectionCommands {
|
|
|
16968
17229
|
formatNode.style.textDecoration = 'none';
|
|
16969
17230
|
child = [formatNode];
|
|
16970
17231
|
}
|
|
17232
|
+
else if (IsFormatted.inlineTags.indexOf(formatNodeTagName.toLowerCase()) !== -1 && isFontStyle && formatNodeTagName.toLocaleLowerCase() !== 'span') {
|
|
17233
|
+
let fontNodeStyle = formatNode.style;
|
|
17234
|
+
if (fontNodeStyle.color && format === 'fontcolor') {
|
|
17235
|
+
if (formatNode.nodeName === 'A') {
|
|
17236
|
+
fontNodeStyle.color = value;
|
|
17237
|
+
}
|
|
17238
|
+
else {
|
|
17239
|
+
fontNodeStyle.color = '';
|
|
17240
|
+
}
|
|
17241
|
+
}
|
|
17242
|
+
else if (fontNodeStyle.backgroundColor && format === 'backgroundcolor') {
|
|
17243
|
+
fontNodeStyle.backgroundColor = '';
|
|
17244
|
+
}
|
|
17245
|
+
else if (fontNodeStyle.fontSize && format === 'fontsize') {
|
|
17246
|
+
fontNodeStyle.fontSize = '';
|
|
17247
|
+
}
|
|
17248
|
+
else if (fontNodeStyle.fontFamily && format === 'fontname') {
|
|
17249
|
+
fontNodeStyle.fontFamily = '';
|
|
17250
|
+
}
|
|
17251
|
+
if (formatNode.getAttribute("style") === '') {
|
|
17252
|
+
formatNode.removeAttribute("style");
|
|
17253
|
+
}
|
|
17254
|
+
child = [formatNode];
|
|
17255
|
+
}
|
|
16971
17256
|
else {
|
|
16972
17257
|
child = InsertMethods.unwrap(formatNode);
|
|
16973
17258
|
let liElement = nodes[index].parentElement;
|
|
@@ -17148,19 +17433,44 @@ class SelectionCommands {
|
|
|
17148
17433
|
parentElement = parentElement.parentElement;
|
|
17149
17434
|
liElement = parentElement;
|
|
17150
17435
|
}
|
|
17151
|
-
if (format === 'fontcolor') {
|
|
17436
|
+
if (format === 'fontcolor' || format === 'fontname') {
|
|
17152
17437
|
const parentElem = nodes[index].parentElement;
|
|
17153
17438
|
if (!isNullOrUndefined(parentElem) && parentElem.childNodes) {
|
|
17154
17439
|
for (let i = 0; i < parentElem.childNodes.length; i++) {
|
|
17155
17440
|
if (this.concatenateTextExcludingList(nodes, index) === nodes[index].textContent) {
|
|
17441
|
+
let liElement;
|
|
17156
17442
|
if (parentElem.tagName === 'LI') {
|
|
17157
|
-
|
|
17443
|
+
liElement = parentElem;
|
|
17444
|
+
}
|
|
17445
|
+
else if (parentElem.closest('li')) {
|
|
17446
|
+
liElement = parentElem.closest('li');
|
|
17447
|
+
}
|
|
17448
|
+
if (!isNullOrUndefined(liElement)) {
|
|
17449
|
+
switch (format) {
|
|
17450
|
+
case 'fontcolor':
|
|
17451
|
+
liElement.style.color = value;
|
|
17452
|
+
break;
|
|
17453
|
+
case 'fontname':
|
|
17454
|
+
liElement.style.fontFamily = value;
|
|
17455
|
+
break;
|
|
17456
|
+
default:
|
|
17457
|
+
break;
|
|
17458
|
+
}
|
|
17158
17459
|
}
|
|
17159
17460
|
}
|
|
17160
17461
|
// eslint-disable-next-line
|
|
17161
17462
|
const childElement = parentElem.childNodes[i];
|
|
17162
17463
|
if (childElement.tagName === 'OL' || childElement.tagName === 'UL') {
|
|
17163
|
-
|
|
17464
|
+
switch (format) {
|
|
17465
|
+
case 'fontcolor':
|
|
17466
|
+
childElement.style.color = 'initial';
|
|
17467
|
+
break;
|
|
17468
|
+
case 'fontname':
|
|
17469
|
+
childElement.style.fontFamily = 'initial';
|
|
17470
|
+
break;
|
|
17471
|
+
default:
|
|
17472
|
+
break;
|
|
17473
|
+
}
|
|
17164
17474
|
}
|
|
17165
17475
|
}
|
|
17166
17476
|
}
|
|
@@ -18588,72 +18898,80 @@ class MsWordPaste {
|
|
|
18588
18898
|
}
|
|
18589
18899
|
styleCorrection(elm, wordPasteStyleConfig) {
|
|
18590
18900
|
const styleElement = elm.querySelectorAll('style');
|
|
18901
|
+
let styles = [];
|
|
18591
18902
|
if (styleElement.length > 0) {
|
|
18592
|
-
|
|
18903
|
+
if (!isNullOrUndefined(styleElement[0].innerHTML.match(/[\S ]+\s+{[\s\S]+?}/gi))) {
|
|
18904
|
+
styles = styleElement[0].innerHTML.match(/[\S ]+\s+{[\s\S]+?}/gi);
|
|
18905
|
+
}
|
|
18906
|
+
else if (styleElement.length > 1) {
|
|
18907
|
+
styles = styleElement[1].innerHTML.match(/[\S ]+\s+{[\s\S]+?}/gi);
|
|
18908
|
+
}
|
|
18593
18909
|
const styleClassObject = !isNullOrUndefined(styles) ? this.findStyleObject(styles) : null;
|
|
18594
|
-
|
|
18595
|
-
|
|
18596
|
-
|
|
18597
|
-
|
|
18598
|
-
|
|
18599
|
-
|
|
18600
|
-
|
|
18601
|
-
|
|
18602
|
-
|
|
18603
|
-
|
|
18604
|
-
|
|
18605
|
-
|
|
18606
|
-
|
|
18607
|
-
|
|
18608
|
-
|
|
18609
|
-
}
|
|
18610
|
-
else if (keys[i].split('.').length === 1 && keys[i].split('.')[0].indexOf('@') < 0) {
|
|
18611
|
-
resultElem = elm.getElementsByTagName(keys[i]);
|
|
18612
|
-
}
|
|
18613
|
-
else {
|
|
18614
|
-
resultElem = elm.querySelectorAll(keys[i]);
|
|
18615
|
-
}
|
|
18616
|
-
for (let j = 0; j < resultElem.length; j++) {
|
|
18617
|
-
if (resultElem[j].closest('li') && keys[i] === 'p') {
|
|
18910
|
+
if (!isNullOrUndefined(styleClassObject)) {
|
|
18911
|
+
const keys = Object.keys(styleClassObject);
|
|
18912
|
+
let values = keys.map((key) => {
|
|
18913
|
+
return styleClassObject[`${key}`];
|
|
18914
|
+
});
|
|
18915
|
+
values = this.removeUnwantedStyle(values, wordPasteStyleConfig);
|
|
18916
|
+
this.filterStyles(elm, wordPasteStyleConfig);
|
|
18917
|
+
let resultElem;
|
|
18918
|
+
let fromClass = false;
|
|
18919
|
+
for (let i = 0; i < keys.length; i++) {
|
|
18920
|
+
if (keys[i].split('.')[0] === '') {
|
|
18921
|
+
resultElem = elm.getElementsByClassName(keys[i].split('.')[1]);
|
|
18922
|
+
fromClass = true;
|
|
18923
|
+
}
|
|
18924
|
+
else if (keys[i].split('.').length === 1 && keys[i].split('.')[0].indexOf('@') >= 0) {
|
|
18618
18925
|
continue;
|
|
18619
18926
|
}
|
|
18620
|
-
|
|
18621
|
-
|
|
18622
|
-
|
|
18623
|
-
|
|
18624
|
-
|
|
18625
|
-
|
|
18626
|
-
|
|
18627
|
-
|
|
18927
|
+
else if (keys[i].split('.').length === 1 && keys[i].split('.')[0].indexOf('@') < 0) {
|
|
18928
|
+
resultElem = elm.getElementsByTagName(keys[i]);
|
|
18929
|
+
}
|
|
18930
|
+
else {
|
|
18931
|
+
resultElem = elm.querySelectorAll(keys[i]);
|
|
18932
|
+
}
|
|
18933
|
+
for (let j = 0; j < resultElem.length; j++) {
|
|
18934
|
+
if (resultElem[j].closest('li') && keys[i] === 'p') {
|
|
18935
|
+
continue;
|
|
18936
|
+
}
|
|
18937
|
+
const styleProperty = resultElem[j].getAttribute('style');
|
|
18938
|
+
if (!isNullOrUndefined(styleProperty) && styleProperty.trim() !== '') {
|
|
18939
|
+
const valueSplit = values[i].split(';');
|
|
18940
|
+
if (!fromClass) {
|
|
18941
|
+
for (let k = 0; k < valueSplit.length; k++) {
|
|
18942
|
+
if (styleProperty.indexOf(valueSplit[k].split(':')[0]) >= 0) {
|
|
18943
|
+
valueSplit.splice(k, 1);
|
|
18944
|
+
k--;
|
|
18945
|
+
}
|
|
18628
18946
|
}
|
|
18629
18947
|
}
|
|
18948
|
+
const changedValue = styleProperty + valueSplit.join(';') + ';';
|
|
18949
|
+
resultElem[j].setAttribute('style', changedValue);
|
|
18950
|
+
}
|
|
18951
|
+
else {
|
|
18952
|
+
values[i] = values[i].replace(/text-indent:-(.*?)(?=;|$)/gm, '');
|
|
18953
|
+
resultElem[j].setAttribute('style', values[i]);
|
|
18630
18954
|
}
|
|
18631
|
-
const changedValue = styleProperty + valueSplit.join(';') + ';';
|
|
18632
|
-
resultElem[j].setAttribute('style', changedValue);
|
|
18633
|
-
}
|
|
18634
|
-
else {
|
|
18635
|
-
values[i] = values[i].replace(/text-indent:-(.*?)(?=;|$)/gm, '');
|
|
18636
|
-
resultElem[j].setAttribute('style', values[i]);
|
|
18637
18955
|
}
|
|
18638
|
-
|
|
18639
|
-
|
|
18640
|
-
|
|
18641
|
-
|
|
18642
|
-
|
|
18643
|
-
|
|
18644
|
-
|
|
18645
|
-
|
|
18646
|
-
|
|
18647
|
-
|
|
18648
|
-
|
|
18649
|
-
|
|
18650
|
-
|
|
18651
|
-
|
|
18652
|
-
|
|
18653
|
-
|
|
18654
|
-
|
|
18655
|
-
|
|
18656
|
-
|
|
18956
|
+
fromClass = false;
|
|
18957
|
+
}
|
|
18958
|
+
const listClass = ['MsoListParagraphCxSpFirst', 'MsoListParagraphCxSpMiddle', 'MsoListParagraphCxSpLast'];
|
|
18959
|
+
for (let i = 0; i < listClass.length; i++) {
|
|
18960
|
+
if (keys.indexOf('li.' + listClass[i]) > -1) {
|
|
18961
|
+
const olULElems = elm.querySelectorAll('ol.' + listClass[i] + ', ul.' + listClass[i]);
|
|
18962
|
+
for (let j = 0; j < olULElems.length; j++) {
|
|
18963
|
+
const styleProperty = olULElems[j].getAttribute('style');
|
|
18964
|
+
if (!isNullOrUndefined(styleProperty) && styleProperty.trim() !== '' && olULElems[j].style.marginLeft !== '') {
|
|
18965
|
+
const valueSplit = values[keys.indexOf('li.' + listClass[i])].split(';');
|
|
18966
|
+
for (let k = 0; k < valueSplit.length; k++) {
|
|
18967
|
+
if ('margin-left'.indexOf(valueSplit[k].split(':')[0]) >= 0) {
|
|
18968
|
+
if (!isNullOrUndefined(valueSplit[k].split(':')[1]) &&
|
|
18969
|
+
valueSplit[k].split(':')[1].indexOf('in') >= 0 &&
|
|
18970
|
+
olULElems[j].style.marginLeft.indexOf('in') >= 0) {
|
|
18971
|
+
const classStyle = parseFloat(valueSplit[k].split(':')[1].split('in')[0]);
|
|
18972
|
+
const inlineStyle = parseFloat(olULElems[j].style.marginLeft.split('in')[0]);
|
|
18973
|
+
olULElems[j].style.marginLeft = (inlineStyle - classStyle) + 'in';
|
|
18974
|
+
}
|
|
18657
18975
|
}
|
|
18658
18976
|
}
|
|
18659
18977
|
}
|
|
@@ -19224,7 +19542,7 @@ class ToolbarStatus {
|
|
|
19224
19542
|
* get method
|
|
19225
19543
|
*
|
|
19226
19544
|
* @param {Document} docElement - specifies the document element
|
|
19227
|
-
* @param {Node}
|
|
19545
|
+
* @param {Node} rootNode - specifies the content editable element
|
|
19228
19546
|
* @param {string[]} formatNode - specifies the format node
|
|
19229
19547
|
* @param {string[]} fontSize - specifies the font size
|
|
19230
19548
|
* @param {string[]} fontName - specifies the font name.
|
|
@@ -19233,7 +19551,7 @@ class ToolbarStatus {
|
|
|
19233
19551
|
* @hidden
|
|
19234
19552
|
* @deprecated
|
|
19235
19553
|
*/
|
|
19236
|
-
static get(docElement,
|
|
19554
|
+
static get(docElement, rootNode, formatNode, fontSize, fontName, documentNode) {
|
|
19237
19555
|
let formatCollection = JSON.parse(JSON.stringify(statusCollection));
|
|
19238
19556
|
const nodeCollection = JSON.parse(JSON.stringify(statusCollection));
|
|
19239
19557
|
const nodeSelection = new NodeSelection();
|
|
@@ -19263,7 +19581,7 @@ class ToolbarStatus {
|
|
|
19263
19581
|
}
|
|
19264
19582
|
for (let index = 0; index < nodes.length; index++) {
|
|
19265
19583
|
// eslint-disable-next-line max-len
|
|
19266
|
-
formatCollection = this.getFormatParent(docElement, formatCollection, nodes[index],
|
|
19584
|
+
formatCollection = this.getFormatParent(docElement, formatCollection, nodes[index], rootNode, formatNode, fontSize, fontName);
|
|
19267
19585
|
if ((index === 0 && formatCollection.bold) || !formatCollection.bold) {
|
|
19268
19586
|
nodeCollection.bold = formatCollection.bold;
|
|
19269
19587
|
}
|
|
@@ -19338,16 +19656,24 @@ class ToolbarStatus {
|
|
|
19338
19656
|
return node;
|
|
19339
19657
|
}
|
|
19340
19658
|
static getFormatParent(docElement, formatCollection, node, targetNode, formatNode, fontSize, fontName) {
|
|
19659
|
+
let isListUpdated = false;
|
|
19660
|
+
let isComplexListUpdated = false;
|
|
19341
19661
|
if (targetNode.contains(node) ||
|
|
19342
19662
|
(node.nodeType === 3 && targetNode.nodeType !== 3 && targetNode.contains(node.parentNode))) {
|
|
19343
19663
|
do {
|
|
19344
|
-
formatCollection = this.isFormattedNode(docElement, formatCollection, node, formatNode, fontSize, fontName);
|
|
19664
|
+
formatCollection = this.isFormattedNode(docElement, formatCollection, node, isListUpdated, isComplexListUpdated, formatNode, fontSize, fontName);
|
|
19665
|
+
if (formatCollection.orderedlist || formatCollection.unorderedlist) {
|
|
19666
|
+
isListUpdated = true;
|
|
19667
|
+
}
|
|
19668
|
+
if (formatCollection.bulletFormatList || formatCollection.numberFormatList) {
|
|
19669
|
+
isComplexListUpdated = true;
|
|
19670
|
+
}
|
|
19345
19671
|
node = node.parentNode;
|
|
19346
19672
|
} while (node && (node !== targetNode));
|
|
19347
19673
|
}
|
|
19348
19674
|
return formatCollection;
|
|
19349
19675
|
}
|
|
19350
|
-
static isFormattedNode(docElement, formatCollection, node, formatNode, fontSize, fontName) {
|
|
19676
|
+
static isFormattedNode(docElement, formatCollection, node, isListUpdated, isComplexListUpdated, formatNode, fontSize, fontName) {
|
|
19351
19677
|
if (!formatCollection.bold) {
|
|
19352
19678
|
formatCollection.bold = IsFormatted.isBold(node);
|
|
19353
19679
|
}
|
|
@@ -19378,10 +19704,10 @@ class ToolbarStatus {
|
|
|
19378
19704
|
if (!formatCollection.backgroundcolor) {
|
|
19379
19705
|
formatCollection.backgroundcolor = this.isBackgroundColor(node);
|
|
19380
19706
|
}
|
|
19381
|
-
if (!formatCollection.orderedlist) {
|
|
19707
|
+
if (!formatCollection.orderedlist && !isListUpdated) {
|
|
19382
19708
|
formatCollection.orderedlist = this.isOrderedList(node);
|
|
19383
19709
|
}
|
|
19384
|
-
if (!formatCollection.unorderedlist) {
|
|
19710
|
+
if (!formatCollection.unorderedlist && !isListUpdated) {
|
|
19385
19711
|
formatCollection.unorderedlist = this.isUnorderedList(node);
|
|
19386
19712
|
}
|
|
19387
19713
|
if (!formatCollection.alignments) {
|
|
@@ -19396,10 +19722,10 @@ class ToolbarStatus {
|
|
|
19396
19722
|
if (!formatCollection.createlink) {
|
|
19397
19723
|
formatCollection.createlink = this.isLink(node);
|
|
19398
19724
|
}
|
|
19399
|
-
if (!formatCollection.numberFormatList) {
|
|
19725
|
+
if (!formatCollection.numberFormatList && !isComplexListUpdated) {
|
|
19400
19726
|
formatCollection.numberFormatList = this.isNumberFormatList(node);
|
|
19401
19727
|
}
|
|
19402
|
-
if (!formatCollection.bulletFormatList) {
|
|
19728
|
+
if (!formatCollection.bulletFormatList && !isComplexListUpdated) {
|
|
19403
19729
|
formatCollection.bulletFormatList = this.isBulletFormatList(node);
|
|
19404
19730
|
}
|
|
19405
19731
|
return formatCollection;
|
|
@@ -20486,12 +20812,12 @@ class EditorManager {
|
|
|
20486
20812
|
}
|
|
20487
20813
|
}
|
|
20488
20814
|
getParentBlockNode(node) {
|
|
20489
|
-
|
|
20815
|
+
const treeWalker = this.currentDocument.createTreeWalker(this.editableElement, // root
|
|
20490
20816
|
NodeFilter.SHOW_ELEMENT, // whatToShow
|
|
20491
20817
|
{
|
|
20492
20818
|
acceptNode: function (currentNode) {
|
|
20493
20819
|
// Check if the node is a block element
|
|
20494
|
-
|
|
20820
|
+
const displayStyle = window.getComputedStyle(currentNode).display;
|
|
20495
20821
|
if (displayStyle.indexOf('inline') < 0) {
|
|
20496
20822
|
return NodeFilter.FILTER_ACCEPT;
|
|
20497
20823
|
}
|
|
@@ -20501,11 +20827,11 @@ class EditorManager {
|
|
|
20501
20827
|
}
|
|
20502
20828
|
});
|
|
20503
20829
|
treeWalker.currentNode = node;
|
|
20504
|
-
|
|
20830
|
+
const blockParent = treeWalker.parentNode();
|
|
20505
20831
|
return blockParent;
|
|
20506
20832
|
}
|
|
20507
20833
|
getLastTextNode(node) {
|
|
20508
|
-
|
|
20834
|
+
const treeWalker = this.currentDocument.createTreeWalker(node, NodeFilter.SHOW_TEXT, null);
|
|
20509
20835
|
let lastTextNode = null;
|
|
20510
20836
|
let currentNode = treeWalker.nextNode();
|
|
20511
20837
|
while (currentNode) {
|
|
@@ -20515,8 +20841,8 @@ class EditorManager {
|
|
|
20515
20841
|
return lastTextNode;
|
|
20516
20842
|
}
|
|
20517
20843
|
getFirstTextNode(node) {
|
|
20518
|
-
|
|
20519
|
-
|
|
20844
|
+
const treeWalker = this.currentDocument.createTreeWalker(node, NodeFilter.SHOW_TEXT, null);
|
|
20845
|
+
const firstTextNode = treeWalker.nextNode();
|
|
20520
20846
|
return firstTextNode;
|
|
20521
20847
|
}
|
|
20522
20848
|
}
|
|
@@ -20752,8 +21078,12 @@ const IFRAMEHEADER = `
|
|
|
20752
21078
|
.e-mob-rte.e-mob-span span.e-rte-imageboxmark, .e-mob-rte.e-mob-span span.e-rte-videoboxmark { background: #4a90e2; border: 1px solid #fff; }
|
|
20753
21079
|
.e-rte-content .e-content img.e-resize, .e-rte-content .e-content video.e-resize { z-index: 1000; }
|
|
20754
21080
|
.e-img-caption .e-img-inner { outline: 0; }
|
|
21081
|
+
.e-rte-img-caption.e-imgleft .e-img-inner { float: left; text-align: left; }
|
|
21082
|
+
.e-rte-img-caption.e-imgright .e-img-inner { float: right; text-align: right; }
|
|
21083
|
+
.e-rte-img-caption.e-imgleft .e-img-wrap, .e-rte-img-caption.e-imgright .e-img-wrap { display: contents; }
|
|
20755
21084
|
.e-img-caption a:focus-visible { outline: none; }
|
|
20756
|
-
.e-
|
|
21085
|
+
.e-rte-img-caption .e-rte-image.e-imgright { margin-left: auto; margin-right: 0; }
|
|
21086
|
+
.e-rte-img-caption .e-rte-image.e-imgleft { margin: 0; }
|
|
20757
21087
|
body{box-sizing: border-box;min-height: 100px;outline: 0 solid transparent;
|
|
20758
21088
|
overflow-x: auto;padding: 16px;position: relative;text-align: inherit;z-index: 2;}
|
|
20759
21089
|
p{margin: 0 0 10px;margin-bottom: 10px;}
|
|
@@ -20801,6 +21131,7 @@ const IFRAMEHEADER = `
|
|
|
20801
21131
|
.e-table-rhelper { background-color: #4a90e2;}
|
|
20802
21132
|
.e-rtl { direction: rtl; }
|
|
20803
21133
|
.e-rte-placeholder::before { content: attr(placeholder); opacity: 0.54; overflow: hidden; padding-top: 16px; position: absolute; text-align: start; top: 0; z-index: 1; }
|
|
21134
|
+
li ol, li ul { margin-block-start: 10px;}
|
|
20804
21135
|
</style>
|
|
20805
21136
|
</head>`;
|
|
20806
21137
|
/**
|
|
@@ -20828,6 +21159,7 @@ class IframeContentRender extends ContentRender {
|
|
|
20828
21159
|
styles: 'display:block;',
|
|
20829
21160
|
attrs: { 'srcdoc': iFrameContent }
|
|
20830
21161
|
});
|
|
21162
|
+
iframe.setAttribute("role", "none");
|
|
20831
21163
|
this.setPanel(iframe);
|
|
20832
21164
|
rteObj.element.appendChild(iframe);
|
|
20833
21165
|
iframe.contentDocument.body.id = this.parent.getID() + '_rte-edit-view';
|
|
@@ -21528,7 +21860,11 @@ class HtmlEditor {
|
|
|
21528
21860
|
(!isNullOrUndefined(this.deleteRangeElement.nextElementSibling) && this.deleteRangeElement.nextElementSibling.tagName === 'TABLE'))) {
|
|
21529
21861
|
return;
|
|
21530
21862
|
}
|
|
21531
|
-
|
|
21863
|
+
let isImgWithEmptyBlockNode = false;
|
|
21864
|
+
if (this.deleteRangeElement.querySelectorAll('img').length > 0 && this.deleteRangeElement.textContent.trim() === '') {
|
|
21865
|
+
isImgWithEmptyBlockNode = true;
|
|
21866
|
+
}
|
|
21867
|
+
if (this.getCaretIndex(currentRange, this.deleteRangeElement) === this.deleteRangeElement.textContent.length && !isImgWithEmptyBlockNode) {
|
|
21532
21868
|
if (!isNullOrUndefined(liElement)) {
|
|
21533
21869
|
if (isLiElement || !isNullOrUndefined(liElement.nextElementSibling)) {
|
|
21534
21870
|
this.deleteOldRangeElement = this.getRangeElement(liElement.nextElementSibling);
|
|
@@ -21720,36 +22056,14 @@ class HtmlEditor {
|
|
|
21720
22056
|
}, e, value);
|
|
21721
22057
|
}
|
|
21722
22058
|
}
|
|
21723
|
-
mouseOutHandler() {
|
|
21724
|
-
if (!isNullOrUndefined(this.tooltipTargetEle)) {
|
|
21725
|
-
this.tooltipTargetEle.setAttribute('title', this.tooltipTargetEle.getAttribute('data-title'));
|
|
21726
|
-
}
|
|
21727
|
-
else {
|
|
21728
|
-
const currentDocument = this.parent.iframeSettings.enable ? this.parent.contentModule.getPanel().ownerDocument :
|
|
21729
|
-
this.parent.contentModule.getDocument();
|
|
21730
|
-
this.tooltipTargetEle = currentDocument.querySelector('[data-title]');
|
|
21731
|
-
this.tooltipTargetEle.setAttribute('title', this.tooltipTargetEle.getAttribute('data-title'));
|
|
21732
|
-
}
|
|
21733
|
-
this.tooltipTargetEle.removeAttribute('data-title');
|
|
21734
|
-
EventHandler.remove(this.tooltipTargetEle, 'mouseout', this.mouseOutHandler);
|
|
21735
|
-
}
|
|
21736
22059
|
onToolbarClick(args) {
|
|
21737
22060
|
let save;
|
|
21738
22061
|
let selectNodeEle;
|
|
21739
22062
|
let selectParentEle;
|
|
21740
22063
|
const item = args.item;
|
|
21741
22064
|
const closestElement = closest(args.originalEvent.target, '.e-rte-quick-popup');
|
|
21742
|
-
|
|
21743
|
-
|
|
21744
|
-
this.tooltipTargetEle = closest(args.originalEvent.target, '[data-tooltip-id]');
|
|
21745
|
-
if (!isNullOrUndefined(this.tooltipTargetEle) && this.parent.showTooltip && !isNullOrUndefined(currentDocument.querySelector('.e-tooltip-wrap'))) {
|
|
21746
|
-
this.parent.notify(destroyTooltip, { args: event });
|
|
21747
|
-
if (!this.tooltipTargetEle.closest('.e-rte-quick-popup')) {
|
|
21748
|
-
this.tooltipTargetEle.setAttribute('data-title', this.tooltipTargetEle.getAttribute('title'));
|
|
21749
|
-
this.tooltipTargetEle.removeAttribute('title');
|
|
21750
|
-
EventHandler.add(this.tooltipTargetEle, 'mouseout', this.mouseOutHandler, this);
|
|
21751
|
-
}
|
|
21752
|
-
}
|
|
22065
|
+
let target = args.originalEvent.target;
|
|
22066
|
+
this.parent.notify(closeTooltip, { target: target });
|
|
21753
22067
|
if (item.command !== 'FormatPainter') {
|
|
21754
22068
|
if (closestElement && !closestElement.classList.contains('e-rte-inline-popup') && !closestElement.classList.contains('e-rte-text-popup')) {
|
|
21755
22069
|
if (!(item.subCommand === 'SourceCode' || item.subCommand === 'Preview' ||
|
|
@@ -22665,6 +22979,9 @@ class PasteCleanup {
|
|
|
22665
22979
|
this.setImageProperties(allImg[i]);
|
|
22666
22980
|
}
|
|
22667
22981
|
this.addTempClass(clipBoardElem);
|
|
22982
|
+
if (clipBoardElem.querySelectorAll('picture').length > 0) {
|
|
22983
|
+
this.processPictureElement(clipBoardElem);
|
|
22984
|
+
}
|
|
22668
22985
|
if (clipBoardElem.textContent !== '' || !isNullOrUndefined(clipBoardElem.querySelector('img')) ||
|
|
22669
22986
|
!isNullOrUndefined(clipBoardElem.querySelector('table'))) {
|
|
22670
22987
|
const tempWrapperElem = this.parent.createElement('div');
|
|
@@ -23122,6 +23439,26 @@ class PasteCleanup {
|
|
|
23122
23439
|
}
|
|
23123
23440
|
return null;
|
|
23124
23441
|
}
|
|
23442
|
+
processPictureElement(clipBoardElem) {
|
|
23443
|
+
const pictureElems = clipBoardElem.querySelectorAll('picture');
|
|
23444
|
+
for (let i = 0; i < pictureElems.length; i++) {
|
|
23445
|
+
const imgElem = pictureElems[i].querySelector('img');
|
|
23446
|
+
const sourceElems = pictureElems[i].querySelectorAll('source');
|
|
23447
|
+
if (imgElem && imgElem.getAttribute('src')) {
|
|
23448
|
+
const srcValue = imgElem.getAttribute('src');
|
|
23449
|
+
const url = new URL(srcValue);
|
|
23450
|
+
for (let j = 0; j < sourceElems.length; j++) {
|
|
23451
|
+
let srcset = sourceElems[j].getAttribute('srcset');
|
|
23452
|
+
if (srcset) {
|
|
23453
|
+
if (srcset.indexOf('http') === -1) {
|
|
23454
|
+
const fullPath = url.origin + srcset;
|
|
23455
|
+
sourceElems[j].setAttribute('srcset', fullPath);
|
|
23456
|
+
}
|
|
23457
|
+
}
|
|
23458
|
+
}
|
|
23459
|
+
}
|
|
23460
|
+
}
|
|
23461
|
+
}
|
|
23125
23462
|
/**
|
|
23126
23463
|
* For internal use only - Get the module name.
|
|
23127
23464
|
*
|
|
@@ -23201,7 +23538,8 @@ class Resize {
|
|
|
23201
23538
|
this.parent.element.style.width = (!this.parent.enableRtl) ? eventType.clientX - boundRect.left + 'px' : boundRect.right - eventType.clientX + 'px';
|
|
23202
23539
|
}
|
|
23203
23540
|
if (!this.parent.toolbarSettings.enable) {
|
|
23204
|
-
this.parent.
|
|
23541
|
+
const isExpand = this.parent.element.querySelectorAll('.e-toolbar-extended.e-popup-open').length > 0 ? true : false;
|
|
23542
|
+
this.parent.setContentHeight('Resize', isExpand);
|
|
23205
23543
|
}
|
|
23206
23544
|
this.parent.refreshUI();
|
|
23207
23545
|
}
|
|
@@ -23552,7 +23890,7 @@ class FullScreen {
|
|
|
23552
23890
|
this.parent.element.classList.add(CLS_FULL_SCREEN);
|
|
23553
23891
|
this.toggleParentOverflow(true);
|
|
23554
23892
|
const isExpand = this.parent.element.querySelectorAll('.e-toolbar-extended.e-popup-open').length > 0 ? true : false;
|
|
23555
|
-
this.parent.setContentHeight(
|
|
23893
|
+
this.parent.setContentHeight('Maximize', isExpand);
|
|
23556
23894
|
if (this.parent.toolbarModule) {
|
|
23557
23895
|
if (!this.parent.getBaseToolbarObject().toolbarObj.items[0].properties) {
|
|
23558
23896
|
this.parent.getBaseToolbarObject().toolbarObj.removeItems(0);
|
|
@@ -23603,7 +23941,7 @@ class FullScreen {
|
|
|
23603
23941
|
removeClass([elem[i]], ['e-rte-overflow']);
|
|
23604
23942
|
}
|
|
23605
23943
|
const isExpand = this.parent.element.querySelectorAll('.e-toolbar-extended.e-popup-open').length > 0 ? true : false;
|
|
23606
|
-
this.parent.setContentHeight(
|
|
23944
|
+
this.parent.setContentHeight('Minimize', isExpand);
|
|
23607
23945
|
if (this.parent.toolbarModule) {
|
|
23608
23946
|
if (!this.parent.getBaseToolbarObject().toolbarObj.items[0].properties) {
|
|
23609
23947
|
this.parent.getBaseToolbarObject().toolbarObj.removeItems(0);
|
|
@@ -23949,7 +24287,7 @@ class EmojiPicker {
|
|
|
23949
24287
|
}
|
|
23950
24288
|
this.popDiv = this.parent.createElement('div', { className: 'e-rte-emojipicker-popup', id: this.parent.getID() + '_emojiPicker' });
|
|
23951
24289
|
if (!isNullOrUndefined(this.parent.getToolbar()) && !this.parent.inlineMode.enable) {
|
|
23952
|
-
this.parent.getToolbar().appendChild(this.popDiv);
|
|
24290
|
+
this.parent.getToolbar().parentElement.appendChild(this.popDiv);
|
|
23953
24291
|
}
|
|
23954
24292
|
else if (this.parent.inlineMode.enable) {
|
|
23955
24293
|
this.parent.element.appendChild(this.popDiv);
|
|
@@ -25378,7 +25716,6 @@ class Image$1 {
|
|
|
25378
25716
|
this.isAllowedTypes = true;
|
|
25379
25717
|
this.pageX = null;
|
|
25380
25718
|
this.pageY = null;
|
|
25381
|
-
this.mouseX = null;
|
|
25382
25719
|
this.deletedImg = [];
|
|
25383
25720
|
this.parent = parent;
|
|
25384
25721
|
this.rteID = parent.element.id;
|
|
@@ -25536,11 +25873,6 @@ class Image$1 {
|
|
|
25536
25873
|
}
|
|
25537
25874
|
const args = { event: e, requestType: 'images' };
|
|
25538
25875
|
this.parent.trigger(resizeStop, args);
|
|
25539
|
-
/* eslint-disable */
|
|
25540
|
-
let pageX = this.getPointX(e);
|
|
25541
|
-
let pageY = (this.parent.iframeSettings.enable) ? window.pageYOffset +
|
|
25542
|
-
this.parent.element.getBoundingClientRect().top + e.clientY : e.pageY;
|
|
25543
|
-
/* eslint-enable */
|
|
25544
25876
|
this.parent.formatter.editorManager.observer.on(checkUndo, this.undoStack, this);
|
|
25545
25877
|
this.parent.formatter.saveData();
|
|
25546
25878
|
}
|
|
@@ -25570,17 +25902,15 @@ class Image$1 {
|
|
|
25570
25902
|
if (this.quickToolObj) {
|
|
25571
25903
|
this.quickToolObj.imageQTBar.hidePopup();
|
|
25572
25904
|
}
|
|
25573
|
-
|
|
25574
|
-
|
|
25575
|
-
|
|
25576
|
-
|
|
25577
|
-
|
|
25578
|
-
|
|
25579
|
-
|
|
25580
|
-
|
|
25581
|
-
|
|
25582
|
-
if (target.classList.contains('e-rte-botRight')) {
|
|
25583
|
-
this.resizeBtnStat.botRight = true;
|
|
25905
|
+
const handlers = ['topLeft', 'topRight', 'botLeft', 'botRight'];
|
|
25906
|
+
for (let i = 0; i < handlers.length; i++) {
|
|
25907
|
+
const handler = handlers[i];
|
|
25908
|
+
if (target.classList.contains('e-rte-' + handler)) {
|
|
25909
|
+
this.resizeBtnStat[handler] = true;
|
|
25910
|
+
this.currentResizeHandler = handler;
|
|
25911
|
+
this.aspectRatio = this.findAspectRatio(this.imgEle);
|
|
25912
|
+
break; // Exit the loop once a match is found
|
|
25913
|
+
}
|
|
25584
25914
|
}
|
|
25585
25915
|
if (Browser.isDevice && this.contentModule.getEditPanel().contains(this.imgResizeDiv) &&
|
|
25586
25916
|
!this.imgResizeDiv.classList.contains('e-mob-span')) {
|
|
@@ -25711,89 +26041,80 @@ class Image$1 {
|
|
|
25711
26041
|
};
|
|
25712
26042
|
}
|
|
25713
26043
|
}
|
|
25714
|
-
setAspectRatio(img, expectedX, expectedY
|
|
26044
|
+
setAspectRatio(img, expectedX, expectedY) {
|
|
25715
26045
|
if (isNullOrUndefined(img.width)) {
|
|
25716
26046
|
return;
|
|
25717
26047
|
}
|
|
25718
|
-
|
|
25719
|
-
const
|
|
25720
|
-
|
|
25721
|
-
const
|
|
25722
|
-
|
|
25723
|
-
|
|
25724
|
-
if (
|
|
25725
|
-
if (
|
|
25726
|
-
|
|
25727
|
-
|
|
25728
|
-
img.style.width = ((finalWidthByPerc > 3) ? finalWidthByPerc : 3) + '%';
|
|
26048
|
+
const width = img.width;
|
|
26049
|
+
const height = img.height;
|
|
26050
|
+
const sameHeightWidth = (width === height);
|
|
26051
|
+
const factor = this.parent.insertImageSettings.resizeByPercent ? '%' : 'px';
|
|
26052
|
+
const emptyStyleDimension = (img.style.width === '' && img.style.height === '');
|
|
26053
|
+
if (!sameHeightWidth && !emptyStyleDimension) {
|
|
26054
|
+
if (img.style.width !== '' && img.style.height !== '') {
|
|
26055
|
+
if (this.parent.insertImageSettings.resizeByPercent) {
|
|
26056
|
+
this.setImageWidth(img, expectedX, factor);
|
|
26057
|
+
this.removeImageHeight(img);
|
|
25729
26058
|
}
|
|
25730
26059
|
else {
|
|
25731
|
-
|
|
26060
|
+
this.setImageWidth(img, expectedX, factor);
|
|
26061
|
+
this.setImageHeight(img, expectedY, factor);
|
|
25732
26062
|
}
|
|
25733
|
-
img.style.height = null;
|
|
25734
|
-
img.removeAttribute('height');
|
|
25735
|
-
}
|
|
25736
|
-
else if (img.style.width === '' && img.style.height !== '') {
|
|
25737
|
-
img.style.height = expectedY + 'px';
|
|
25738
|
-
}
|
|
25739
|
-
else if (img.style.width !== '' && img.style.height === '') {
|
|
25740
|
-
const currentWidth = ((width / height * expectedY) + width / height) <
|
|
25741
|
-
(this.parent.inputElement.getBoundingClientRect().right - 32) ?
|
|
25742
|
-
((width / height * expectedY) + width / height) : (this.parent.inputElement.getBoundingClientRect().right - 32);
|
|
25743
|
-
img.style.width = currentWidth.toString() + 'px';
|
|
25744
|
-
img.style.height = expectedY + 'px';
|
|
25745
26063
|
}
|
|
25746
26064
|
else if (img.style.width !== '') {
|
|
25747
|
-
|
|
25748
|
-
|
|
25749
|
-
|
|
25750
|
-
img.style.height = expectedY + 'px';
|
|
25751
|
-
}
|
|
25752
|
-
else {
|
|
25753
|
-
if (this.parent.iframeSettings.enable) {
|
|
25754
|
-
img.setAttribute('width', (img.width + this.mouseX).toString());
|
|
26065
|
+
if (this.parent.insertImageSettings.resizeByPercent) {
|
|
26066
|
+
this.setImageWidth(img, expectedX, factor);
|
|
26067
|
+
this.removeImageHeight(img);
|
|
25755
26068
|
}
|
|
25756
26069
|
else {
|
|
25757
|
-
|
|
25758
|
-
img.setAttribute('width', (currentWidth).toString());
|
|
26070
|
+
this.setImageWidth(img, expectedX, factor);
|
|
25759
26071
|
}
|
|
25760
26072
|
}
|
|
25761
|
-
|
|
25762
|
-
|
|
25763
|
-
|
|
25764
|
-
|
|
25765
|
-
const original = img.offsetWidth + this.mouseX;
|
|
25766
|
-
const finalWidthByPerc = (original / img.offsetWidth) * (parseFloat(img.style.width).toString() === 'NaN' ?
|
|
25767
|
-
(img.offsetWidth / (parseFloat(getComputedStyle(this.parent.element).width)) * 100) :
|
|
25768
|
-
parseFloat(img.style.width));
|
|
25769
|
-
img.style.width = ((finalWidthByPerc > 3) ? finalWidthByPerc : 3) + '%';
|
|
26073
|
+
else if (img.style.height !== '') {
|
|
26074
|
+
if (this.parent.insertImageSettings.resizeByPercent) {
|
|
26075
|
+
this.setImageWidth(img, expectedX, factor);
|
|
26076
|
+
this.removeImageHeight(img);
|
|
25770
26077
|
}
|
|
25771
26078
|
else {
|
|
25772
|
-
|
|
26079
|
+
this.setImageHeight(img, expectedY, factor);
|
|
25773
26080
|
}
|
|
25774
|
-
img.style.height = null;
|
|
25775
|
-
img.removeAttribute('height');
|
|
25776
|
-
}
|
|
25777
|
-
else if (img.style.width !== '') {
|
|
25778
|
-
img.style.width = expectedX + 'px';
|
|
25779
|
-
img.style.height = (height / width * expectedX) + 'px';
|
|
25780
|
-
}
|
|
25781
|
-
else {
|
|
25782
|
-
img.setAttribute('width', this.resizeBtnStat.botRight ? (this.getPointX(e.event) - img.getBoundingClientRect().left).toString() : expectedX.toString());
|
|
25783
26081
|
}
|
|
25784
26082
|
}
|
|
25785
26083
|
else {
|
|
26084
|
+
this.setImageWidth(img, expectedX, factor);
|
|
25786
26085
|
if (this.parent.insertImageSettings.resizeByPercent) {
|
|
25787
|
-
|
|
25788
|
-
img.style.height = null;
|
|
25789
|
-
img.removeAttribute('height');
|
|
26086
|
+
this.removeImageHeight(img);
|
|
25790
26087
|
}
|
|
25791
26088
|
else {
|
|
25792
|
-
|
|
25793
|
-
img.style.height = ((expectedX >= 15) ? expectedX : 15) + 'px';
|
|
26089
|
+
this.setImageHeight(img, expectedY, factor);
|
|
25794
26090
|
}
|
|
25795
26091
|
}
|
|
25796
26092
|
}
|
|
26093
|
+
setImageWidth(img, value, suffix) {
|
|
26094
|
+
img.style.width = this.getImageDimension(value, img) + suffix;
|
|
26095
|
+
if (!this.parent.insertImageSettings.resizeByPercent) {
|
|
26096
|
+
img.setAttribute('width', value.toString());
|
|
26097
|
+
}
|
|
26098
|
+
}
|
|
26099
|
+
setImageHeight(img, value, suffix) {
|
|
26100
|
+
img.style.height = this.getImageDimension(value, img) + suffix;
|
|
26101
|
+
if (!this.parent.insertImageSettings.resizeByPercent) {
|
|
26102
|
+
img.setAttribute('height', value.toString());
|
|
26103
|
+
}
|
|
26104
|
+
}
|
|
26105
|
+
removeImageHeight(img) {
|
|
26106
|
+
img.style.height = '';
|
|
26107
|
+
img.removeAttribute('height');
|
|
26108
|
+
}
|
|
26109
|
+
getImageDimension(value, img) {
|
|
26110
|
+
if (this.parent.insertImageSettings.resizeByPercent) {
|
|
26111
|
+
const rootElem = img.parentElement || img.previousElementSibling;
|
|
26112
|
+
return this.pixToPerc(value, rootElem);
|
|
26113
|
+
}
|
|
26114
|
+
else {
|
|
26115
|
+
return value;
|
|
26116
|
+
}
|
|
26117
|
+
}
|
|
25797
26118
|
pixToPerc(expected, parentEle) {
|
|
25798
26119
|
return expected / parseFloat(getComputedStyle(parentEle).width) * 100;
|
|
25799
26120
|
}
|
|
@@ -25815,7 +26136,7 @@ class Image$1 {
|
|
|
25815
26136
|
return;
|
|
25816
26137
|
}
|
|
25817
26138
|
this.imgEle.parentElement.style.cursor = 'pointer';
|
|
25818
|
-
this.setAspectRatio(this.imgEle, parseInt(width, 10), parseInt(height, 10)
|
|
26139
|
+
this.setAspectRatio(this.imgEle, parseInt(width, 10), parseInt(height, 10));
|
|
25819
26140
|
this.resizeImgDupPos(this.imgEle);
|
|
25820
26141
|
this.imgResizePos(this.imgEle, this.imgResizeDiv);
|
|
25821
26142
|
}
|
|
@@ -25826,35 +26147,37 @@ class Image$1 {
|
|
|
25826
26147
|
this.cancelResizeAction();
|
|
25827
26148
|
return;
|
|
25828
26149
|
}
|
|
25829
|
-
if (this.
|
|
25830
|
-
|
|
25831
|
-
|
|
25832
|
-
|
|
25833
|
-
|
|
25834
|
-
|
|
25835
|
-
|
|
25836
|
-
|
|
25837
|
-
|
|
25838
|
-
|
|
25839
|
-
|
|
25840
|
-
|
|
25841
|
-
|
|
25842
|
-
|
|
25843
|
-
|
|
25844
|
-
|
|
25845
|
-
|
|
25846
|
-
|
|
25847
|
-
|
|
25848
|
-
|
|
25849
|
-
this.
|
|
25850
|
-
|
|
25851
|
-
else if (this.resizeBtnStat.topRight) {
|
|
25852
|
-
this.imgDupMouseMove(width + 'px', height + 'px', e);
|
|
25853
|
-
}
|
|
25854
|
-
else if (this.resizeBtnStat.topLeft) {
|
|
26150
|
+
if (this.resizeBtnStat.botRight || this.resizeBtnStat.botLeft || this.resizeBtnStat.topRight || this.resizeBtnStat.topLeft) {
|
|
26151
|
+
const pageX = this.getPointX(e);
|
|
26152
|
+
const pageY = this.getPointY(e);
|
|
26153
|
+
const resizeFactor = this.getResizeFactor(this.currentResizeHandler);
|
|
26154
|
+
const diffX = (pageX - this.pageX);
|
|
26155
|
+
const diffY = (pageY - this.pageY);
|
|
26156
|
+
const currentWidth = this.imgEle.clientWidth;
|
|
26157
|
+
const currentHeight = this.imgEle.clientHeight;
|
|
26158
|
+
let width = diffX * resizeFactor[0] + currentWidth;
|
|
26159
|
+
let height = diffY * resizeFactor[1] + currentHeight;
|
|
26160
|
+
width = (width < 16) ? 16 : width;
|
|
26161
|
+
height = (height < 16) ? 16 : height;
|
|
26162
|
+
if (Math.abs(diffX) > Math.abs(diffY)) {
|
|
26163
|
+
height = Math.round(width / this.aspectRatio);
|
|
26164
|
+
width = Math.round(height * this.aspectRatio);
|
|
26165
|
+
}
|
|
26166
|
+
else {
|
|
26167
|
+
width = Math.round(height * this.aspectRatio);
|
|
26168
|
+
height = Math.round(width / this.aspectRatio);
|
|
26169
|
+
}
|
|
26170
|
+
this.pageX = pageX;
|
|
26171
|
+
this.pageY = pageY;
|
|
25855
26172
|
this.imgDupMouseMove(width + 'px', height + 'px', e);
|
|
25856
26173
|
}
|
|
25857
26174
|
}
|
|
26175
|
+
getResizeFactor(value) {
|
|
26176
|
+
return imageResizeFactor[value];
|
|
26177
|
+
}
|
|
26178
|
+
findAspectRatio(image) {
|
|
26179
|
+
return image.clientWidth / image.clientHeight;
|
|
26180
|
+
}
|
|
25858
26181
|
cancelResizeAction() {
|
|
25859
26182
|
EventHandler.remove(this.contentModule.getDocument(), Browser.touchMoveEvent, this.resizing);
|
|
25860
26183
|
EventHandler.remove(this.contentModule.getDocument(), Browser.touchEndEvent, this.resizeEnd);
|
|
@@ -25864,6 +26187,8 @@ class Image$1 {
|
|
|
25864
26187
|
this.imgResizeDiv = null;
|
|
25865
26188
|
this.pageX = null;
|
|
25866
26189
|
this.pageY = null;
|
|
26190
|
+
this.currentResizeHandler = null;
|
|
26191
|
+
this.aspectRatio = null;
|
|
25867
26192
|
}
|
|
25868
26193
|
}
|
|
25869
26194
|
resizeImgDupPos(e) {
|
|
@@ -25874,6 +26199,8 @@ class Image$1 {
|
|
|
25874
26199
|
};
|
|
25875
26200
|
}
|
|
25876
26201
|
resizeBtnInit() {
|
|
26202
|
+
this.aspectRatio = null;
|
|
26203
|
+
this.currentResizeHandler = null;
|
|
25877
26204
|
return this.resizeBtnStat = { botLeft: false, botRight: false, topRight: false, topLeft: false };
|
|
25878
26205
|
}
|
|
25879
26206
|
onToolbarAction(args) {
|
|
@@ -26373,7 +26700,7 @@ class Image$1 {
|
|
|
26373
26700
|
this.checkBoxObj.createElement = this.parent.createElement;
|
|
26374
26701
|
this.checkBoxObj.appendTo(linkTarget);
|
|
26375
26702
|
let target = this.checkBoxObj.checked ? '_blank' : null;
|
|
26376
|
-
|
|
26703
|
+
const imageLabel = this.checkBoxObj.checked ? this.i10n.getConstant('imageLinkAriaLabel') : null;
|
|
26377
26704
|
const linkUpdate = this.i10n.getConstant('dialogUpdate');
|
|
26378
26705
|
const linkargs = {
|
|
26379
26706
|
args: e.args,
|
|
@@ -26381,7 +26708,6 @@ class Image$1 {
|
|
|
26381
26708
|
selectNode: e.selectNode, selectParent: e.selectParent, link: inputLink, target: target, ariaLabel: imageLabel
|
|
26382
26709
|
};
|
|
26383
26710
|
this.dialogObj.setProperties({
|
|
26384
|
-
height: 'inherit',
|
|
26385
26711
|
width: '290px',
|
|
26386
26712
|
header: this.parent.localeObj.getConstant('imageInsertLinkHeader'),
|
|
26387
26713
|
content: linkWrap,
|
|
@@ -26433,7 +26759,7 @@ class Image$1 {
|
|
|
26433
26759
|
alt: inputAlt
|
|
26434
26760
|
};
|
|
26435
26761
|
this.dialogObj.setProperties({
|
|
26436
|
-
|
|
26762
|
+
width: '290px', header: altHeader, content: altWrap,
|
|
26437
26763
|
buttons: [{
|
|
26438
26764
|
// eslint-disable-next-line
|
|
26439
26765
|
click: (e) => {
|
|
@@ -26681,7 +27007,7 @@ class Image$1 {
|
|
|
26681
27007
|
const dialogContent = this.imgsizeInput(e);
|
|
26682
27008
|
const selectObj = { args: e.args, selfImage: this, selection: e.selection, selectNode: e.selectNode };
|
|
26683
27009
|
this.dialogObj.setProperties({
|
|
26684
|
-
|
|
27010
|
+
width: '290px', header: imgSizeHeader, content: dialogContent,
|
|
26685
27011
|
buttons: [{
|
|
26686
27012
|
// eslint-disable-next-line
|
|
26687
27013
|
click: (e) => {
|
|
@@ -26881,7 +27207,6 @@ class Image$1 {
|
|
|
26881
27207
|
for (let i = 0; i < items.length; i++) {
|
|
26882
27208
|
removeClass([items[i]], 'e-img-focus');
|
|
26883
27209
|
removeClass([items[i]], 'e-resize');
|
|
26884
|
-
items[i].style.maxWidth = '';
|
|
26885
27210
|
}
|
|
26886
27211
|
}
|
|
26887
27212
|
}
|
|
@@ -26895,7 +27220,6 @@ class Image$1 {
|
|
|
26895
27220
|
this.cancelResizeAction();
|
|
26896
27221
|
}
|
|
26897
27222
|
}
|
|
26898
|
-
// eslint-disable-next-line
|
|
26899
27223
|
imageUrlPopup(e) {
|
|
26900
27224
|
const imgUrl = this.parent.createElement('div', { className: 'imgUrl' + this.parent.getCssClass(true) });
|
|
26901
27225
|
const placeUrl = this.i10n.getConstant('imageUrl');
|
|
@@ -26974,12 +27298,18 @@ class Image$1 {
|
|
|
26974
27298
|
const imgHeight = this.i10n.getConstant('imageHeight');
|
|
26975
27299
|
const imgWidth = this.i10n.getConstant('imageWidth');
|
|
26976
27300
|
const imgSizeWrap = this.parent.createElement('div', { className: 'e-img-sizewrap' + this.parent.getCssClass(true) });
|
|
26977
|
-
|
|
27301
|
+
let widthVal = isNullOrUndefined(this.changedWidthValue) && (selectNode.style.width.toString() === 'auto' ||
|
|
26978
27302
|
selectNode.style.width !== '') ? selectNode.style.width : !isNullOrUndefined(this.changedWidthValue) ?
|
|
26979
27303
|
this.changedWidthValue : (parseInt(selectNode.getClientRects()[0].width.toString(), 10)).toString();
|
|
26980
|
-
|
|
27304
|
+
let heightVal = isNullOrUndefined(this.changedHeightValue) && (selectNode.style.height.toString() === 'auto' ||
|
|
26981
27305
|
selectNode.style.height !== '') ? selectNode.style.height : !isNullOrUndefined(this.changedHeightValue) ?
|
|
26982
27306
|
this.changedHeightValue : (parseInt(selectNode.getClientRects()[0].height.toString(), 10)).toString();
|
|
27307
|
+
if (selectNode.style.width === '') {
|
|
27308
|
+
widthVal = 'auto';
|
|
27309
|
+
}
|
|
27310
|
+
if (selectNode.style.height === '') {
|
|
27311
|
+
heightVal = 'auto';
|
|
27312
|
+
}
|
|
26983
27313
|
this.changedWidthValue = null;
|
|
26984
27314
|
this.changedHeightValue = null;
|
|
26985
27315
|
const content = '<div class="e-rte-label' + this.parent.getCssClass(true) + '"><label>' + imgWidth +
|
|
@@ -27113,7 +27443,7 @@ class Image$1 {
|
|
|
27113
27443
|
this.parent.trigger(imageSelected, selectArgs, (selectArgs) => {
|
|
27114
27444
|
if (!selectArgs.cancel) {
|
|
27115
27445
|
this.checkExtension(selectArgs.filesData[0]);
|
|
27116
|
-
altText = selectArgs.filesData[0].name;
|
|
27446
|
+
altText = selectArgs.filesData[0].name.replace(/\.[a-zA-Z0-9]+$/, '');
|
|
27117
27447
|
if (this.parent.editorMode === 'HTML' && isNullOrUndefined(this.parent.insertImageSettings.path)) {
|
|
27118
27448
|
const reader = new FileReader();
|
|
27119
27449
|
// eslint-disable-next-line
|
|
@@ -28673,7 +29003,7 @@ class Video {
|
|
|
28673
29003
|
const dialogContent = this.vidsizeInput(e);
|
|
28674
29004
|
const selectObj = { args: e.args, selfVideo: this, selection: e.selection, selectNode: e.selectNode };
|
|
28675
29005
|
this.dialogObj.setProperties({
|
|
28676
|
-
|
|
29006
|
+
width: '290px', header: vidSizeHeader, content: dialogContent,
|
|
28677
29007
|
buttons: [{
|
|
28678
29008
|
// eslint-disable-next-line
|
|
28679
29009
|
click: (e) => {
|
|
@@ -29042,7 +29372,6 @@ class Video {
|
|
|
29042
29372
|
this.setAspectRatio(this.videoEle, parseInt(width, 10), parseInt(height, 10), args);
|
|
29043
29373
|
this.resizeVidDupPos(this.videoEle);
|
|
29044
29374
|
this.vidResizePos(this.videoEle, this.vidResizeDiv);
|
|
29045
|
-
this.parent.setContentHeight('', false);
|
|
29046
29375
|
}
|
|
29047
29376
|
});
|
|
29048
29377
|
}
|
|
@@ -29851,8 +30180,12 @@ class Video {
|
|
|
29851
30180
|
this.parent.trigger(fileRemoving, e, (e) => {
|
|
29852
30181
|
proxy.isVideoUploaded = false;
|
|
29853
30182
|
this.dialogObj.getButtons(0).element.disabled = true;
|
|
29854
|
-
|
|
29855
|
-
|
|
30183
|
+
if (proxy.inputUrl.getAttribute('disabled')) {
|
|
30184
|
+
proxy.inputUrl.removeAttribute('disabled');
|
|
30185
|
+
}
|
|
30186
|
+
if (proxy.embedInputUrl.getAttribute('disabled')) {
|
|
30187
|
+
proxy.embedInputUrl.removeAttribute('disabled');
|
|
30188
|
+
}
|
|
29856
30189
|
if (proxy.uploadUrl) {
|
|
29857
30190
|
proxy.uploadUrl.url = '';
|
|
29858
30191
|
}
|
|
@@ -30086,7 +30419,6 @@ class ViewSource {
|
|
|
30086
30419
|
rteContent.appendChild(this.previewElement);
|
|
30087
30420
|
this.parent.element.appendChild(rteContent);
|
|
30088
30421
|
rteContent.style.height = this.contentModule.getPanel().style.height;
|
|
30089
|
-
rteContent.style.marginTop = this.contentModule.getPanel().style.marginTop;
|
|
30090
30422
|
this.getPanel().value = this.getTextAreaValue();
|
|
30091
30423
|
this.contentModule.getPanel().style.display = 'none';
|
|
30092
30424
|
rteContent.style.display = 'block';
|
|
@@ -30107,14 +30439,17 @@ class ViewSource {
|
|
|
30107
30439
|
removeClass([this.parent.getToolbar()], [CLS_EXPAND_OPEN]);
|
|
30108
30440
|
}
|
|
30109
30441
|
removeClass(tbItems, [CLS_ACTIVE]);
|
|
30110
|
-
this.parent.
|
|
30442
|
+
const isExpand = this.parent.element.querySelectorAll('.e-toolbar-extended.e-popup-open').length > 0 ? true : false;
|
|
30443
|
+
this.parent.setContentHeight('SourceCode', isExpand);
|
|
30111
30444
|
this.wireEvent(this.previewElement);
|
|
30112
30445
|
this.unWireBaseKeyDown();
|
|
30113
30446
|
this.previewElement.focus();
|
|
30114
30447
|
this.parent.updateValue();
|
|
30115
30448
|
if (!isNullOrUndefined(this.parent.placeholder) && !this.parent.iframeSettings.enable) {
|
|
30116
30449
|
const placeHolderWrapper = this.parent.element.querySelector('.rte-placeholder.e-rte-placeholder');
|
|
30117
|
-
placeHolderWrapper
|
|
30450
|
+
if (placeHolderWrapper) {
|
|
30451
|
+
placeHolderWrapper.style.display = 'none';
|
|
30452
|
+
}
|
|
30118
30453
|
}
|
|
30119
30454
|
this.parent.trigger(actionComplete, { requestType: 'SourceCode', targetItem: 'SourceCode', args: args });
|
|
30120
30455
|
this.parent.invokeChangeEvent();
|
|
@@ -30170,7 +30505,8 @@ class ViewSource {
|
|
|
30170
30505
|
if (this.parent.getToolbar()) {
|
|
30171
30506
|
removeClass([this.parent.getToolbar()], [CLS_EXPAND_OPEN]);
|
|
30172
30507
|
}
|
|
30173
|
-
this.parent.
|
|
30508
|
+
const isExpand = this.parent.element.querySelectorAll('.e-toolbar-extended.e-popup-open').length > 0 ? true : false;
|
|
30509
|
+
this.parent.setContentHeight('Preview', isExpand);
|
|
30174
30510
|
this.unWireEvent();
|
|
30175
30511
|
this.wireBaseKeyDown();
|
|
30176
30512
|
this.contentModule.getEditPanel().focus();
|
|
@@ -30244,6 +30580,7 @@ class Table {
|
|
|
30244
30580
|
this.pageY = null;
|
|
30245
30581
|
this.moveEle = null;
|
|
30246
30582
|
this.currentColumnResize = '';
|
|
30583
|
+
this.resizeEndTime = 0;
|
|
30247
30584
|
this.parent = parent;
|
|
30248
30585
|
this.rteID = parent.element.id;
|
|
30249
30586
|
this.l10n = serviceLocator.getService('rteLocale');
|
|
@@ -30401,7 +30738,15 @@ class Table {
|
|
|
30401
30738
|
keyUp(e) {
|
|
30402
30739
|
const target = e.args.target;
|
|
30403
30740
|
if (e.args.key.toLocaleLowerCase() === 'escape' && target && target.classList && (this.popupObj && !closest(target, '[id=' + "'" + this.popupObj.element.id + "'" + ']')) && this.popupObj) {
|
|
30741
|
+
let createTableToolbarBtn = this.popupObj.relateTo;
|
|
30742
|
+
if (createTableToolbarBtn.nodeName !== 'BUTTON') {
|
|
30743
|
+
createTableToolbarBtn = createTableToolbarBtn.querySelector('span.e-create-table');
|
|
30744
|
+
createTableToolbarBtn = createTableToolbarBtn.parentElement;
|
|
30745
|
+
}
|
|
30404
30746
|
this.popupObj.hide();
|
|
30747
|
+
if (createTableToolbarBtn) {
|
|
30748
|
+
createTableToolbarBtn.focus();
|
|
30749
|
+
}
|
|
30405
30750
|
}
|
|
30406
30751
|
}
|
|
30407
30752
|
keyDown(e) {
|
|
@@ -30581,7 +30926,20 @@ class Table {
|
|
|
30581
30926
|
return false;
|
|
30582
30927
|
}
|
|
30583
30928
|
}
|
|
30929
|
+
removeEmptyTextNodes(element) {
|
|
30930
|
+
const children = element.childNodes;
|
|
30931
|
+
for (let i = children.length - 1; i >= 0; i--) {
|
|
30932
|
+
const node = children[i];
|
|
30933
|
+
if (node.nodeType === Node.TEXT_NODE && node.nodeValue.trim() === '') {
|
|
30934
|
+
element.removeChild(node);
|
|
30935
|
+
}
|
|
30936
|
+
}
|
|
30937
|
+
}
|
|
30584
30938
|
tabSelection(event, selection, ele) {
|
|
30939
|
+
let allHeadBodyTRElements = ele.closest('table').querySelectorAll('thead, tbody, tr');
|
|
30940
|
+
for (let i = 0; i < allHeadBodyTRElements.length; i++) {
|
|
30941
|
+
this.removeEmptyTextNodes(allHeadBodyTRElements[i]);
|
|
30942
|
+
}
|
|
30585
30943
|
this.previousTableElement = ele;
|
|
30586
30944
|
const insideList = this.insideList(selection.range);
|
|
30587
30945
|
if ((event.keyCode === 37 || event.keyCode === 39) && selection.range.startContainer.nodeType === 3 ||
|
|
@@ -30718,10 +31076,12 @@ class Table {
|
|
|
30718
31076
|
const startNode = this.parent.getRange().startContainer.parentElement;
|
|
30719
31077
|
const endNode = this.parent.getRange().endContainer.parentElement;
|
|
30720
31078
|
const isAnchorEle = this.getAnchorNode(target);
|
|
31079
|
+
const currentTime = new Date().getTime();
|
|
30721
31080
|
if (target && target.nodeName !== 'A' && isAnchorEle.nodeName !== 'A' && target.nodeName !== 'IMG' && target.nodeName !== 'VIDEO' && !target.classList.contains(CLS_CLICKELEM) &&
|
|
30722
31081
|
target.nodeName !== 'AUDIO' && startNode === endNode && (target.nodeName === 'TD' || target.nodeName === 'TH' ||
|
|
30723
31082
|
target.nodeName === 'TABLE' || (closestTable && this.parent.contentModule.getEditPanel().contains(closestTable)))
|
|
30724
|
-
&& !(range.startContainer.nodeType === 3 && !range.collapsed)
|
|
31083
|
+
&& !(range.startContainer.nodeType === 3 && !range.collapsed) &&
|
|
31084
|
+
currentTime - this.resizeEndTime > 100) {
|
|
30725
31085
|
const range = this.parent.formatter.editorManager.nodeSelection.getRange(this.contentModule.getDocument());
|
|
30726
31086
|
this.parent.formatter.editorManager.nodeSelection.save(range, this.contentModule.getDocument());
|
|
30727
31087
|
this.parent.formatter.editorManager.nodeSelection.Clear(this.contentModule.getDocument());
|
|
@@ -30817,7 +31177,10 @@ class Table {
|
|
|
30817
31177
|
const tdNode = closest(target, 'td,th');
|
|
30818
31178
|
target = (target.nodeName !== 'TD' && tdNode && this.parent.contentModule.getEditPanel().contains(tdNode)) ?
|
|
30819
31179
|
tdNode : target;
|
|
30820
|
-
|
|
31180
|
+
if (!(this.parent.quickToolbarSettings.showOnRightClick && e.args.which === 3 &&
|
|
31181
|
+
target.classList.contains(CLS_TABLE_SEL))) {
|
|
31182
|
+
removeClass(this.contentModule.getEditPanel().querySelectorAll('table td, table th'), CLS_TABLE_SEL);
|
|
31183
|
+
}
|
|
30821
31184
|
if (target && (target.tagName === 'TD' || target.tagName === 'TH')) {
|
|
30822
31185
|
addClass([target], CLS_TABLE_SEL);
|
|
30823
31186
|
this.activeCell = target;
|
|
@@ -31204,6 +31567,9 @@ class Table {
|
|
|
31204
31567
|
widthCompare = rteWidth;
|
|
31205
31568
|
}
|
|
31206
31569
|
if (this.resizeBtnStat.column) {
|
|
31570
|
+
if (this.curTable.closest('li')) {
|
|
31571
|
+
widthCompare = this.curTable.closest('li').offsetWidth;
|
|
31572
|
+
}
|
|
31207
31573
|
const colGroup = this.curTable.querySelectorAll('colgroup > col');
|
|
31208
31574
|
let currentTableWidth;
|
|
31209
31575
|
if (this.curTable.style.width !== '' && this.curTable.style.width.includes('%')) {
|
|
@@ -31229,6 +31595,15 @@ class Table {
|
|
|
31229
31595
|
(this.convertPixelToPercentage(tableWidth - mouseX, widthCompare) + '%');
|
|
31230
31596
|
const differenceWidth = currentTableWidth - this.convertPixelToPercentage(tableWidth - mouseX, widthCompare);
|
|
31231
31597
|
let preMarginLeft = 0;
|
|
31598
|
+
const widthType = this.curTable.style.width.indexOf('%') > -1;
|
|
31599
|
+
if (!widthType && this.curTable.offsetWidth > this.contentModule.getEditPanel().offsetWidth) {
|
|
31600
|
+
this.curTable.style.width = rteWidth + 'px';
|
|
31601
|
+
return;
|
|
31602
|
+
}
|
|
31603
|
+
if (widthType && parseFloat(this.curTable.style.width.split('%')[0]) > 100) {
|
|
31604
|
+
this.curTable.style.width = '100%';
|
|
31605
|
+
return;
|
|
31606
|
+
}
|
|
31232
31607
|
if (!isNullOrUndefined(this.curTable.style.marginLeft) && this.curTable.style.marginLeft !== '') {
|
|
31233
31608
|
const regex = /[-+]?\d*\.\d+|\d+/;
|
|
31234
31609
|
const value = this.curTable.style.marginLeft.match(regex);
|
|
@@ -31236,7 +31611,16 @@ class Table {
|
|
|
31236
31611
|
preMarginLeft = parseFloat(value[0]);
|
|
31237
31612
|
}
|
|
31238
31613
|
}
|
|
31239
|
-
|
|
31614
|
+
let currentMarginLeft = preMarginLeft + differenceWidth;
|
|
31615
|
+
if (currentMarginLeft && currentMarginLeft > 100) {
|
|
31616
|
+
const width = parseFloat(this.curTable.style.width);
|
|
31617
|
+
currentMarginLeft = 100 - width;
|
|
31618
|
+
}
|
|
31619
|
+
if (currentMarginLeft && currentMarginLeft < 1) {
|
|
31620
|
+
this.curTable.style.marginLeft = null;
|
|
31621
|
+
this.curTable.style.width = '100%';
|
|
31622
|
+
return;
|
|
31623
|
+
}
|
|
31240
31624
|
this.curTable.style.marginLeft = 'calc(' + (this.curTable.style.width === '100%' ? 0 : currentMarginLeft) + '%)';
|
|
31241
31625
|
for (let i = 0; i < firstColumnsCell.length; i++) {
|
|
31242
31626
|
const currentColumnCellWidth = this.getCurrentColWidth(firstColumnsCell[i], tableWidth);
|
|
@@ -31307,15 +31691,26 @@ class Table {
|
|
|
31307
31691
|
maxiumWidth = Math.abs(tableBoxPosition - currentTdElement.getBoundingClientRect().width) - 5;
|
|
31308
31692
|
this.curTable.style.maxWidth = maxiumWidth + 'px';
|
|
31309
31693
|
}
|
|
31310
|
-
const widthType = this.curTable.style.width.indexOf('%') > -1;
|
|
31311
|
-
this.curTable.style.width = widthType ? this.convertPixelToPercentage(tableWidth + mouseX, widthCompare) + '%'
|
|
31312
|
-
: tableWidth + mouseX + 'px';
|
|
31313
31694
|
this.curTable.style.height = tableHeight + mouseY + 'px';
|
|
31314
31695
|
if (!isNullOrUndefined(tableReBox)) {
|
|
31315
31696
|
tableReBox.classList.add('e-rbox-select');
|
|
31316
31697
|
tableReBox.style.cssText = 'top: ' + (this.calcPos(this.curTable).top + tableHeight - 4) +
|
|
31317
31698
|
'px; left:' + (this.calcPos(this.curTable).left + tableWidth - 4) + 'px;';
|
|
31318
31699
|
}
|
|
31700
|
+
if (this.curTable.closest('li')) {
|
|
31701
|
+
widthCompare = this.curTable.closest('li').offsetWidth;
|
|
31702
|
+
}
|
|
31703
|
+
const widthType = this.curTable.style.width.indexOf('%') > -1;
|
|
31704
|
+
if (widthType && parseFloat(this.curTable.style.width.split('%')[0]) > 100) {
|
|
31705
|
+
this.curTable.style.width = '100%';
|
|
31706
|
+
return;
|
|
31707
|
+
}
|
|
31708
|
+
if (!widthType && this.curTable.offsetWidth > this.contentModule.getEditPanel().offsetWidth) {
|
|
31709
|
+
this.curTable.style.width = rteWidth + 'px';
|
|
31710
|
+
return;
|
|
31711
|
+
}
|
|
31712
|
+
this.curTable.style.width = widthType ? this.convertPixelToPercentage(tableWidth + mouseX, widthCompare) + '%'
|
|
31713
|
+
: tableWidth + mouseX + 'px';
|
|
31319
31714
|
}
|
|
31320
31715
|
}
|
|
31321
31716
|
});
|
|
@@ -31389,6 +31784,7 @@ class Table {
|
|
|
31389
31784
|
const args = { event: e, requestType: 'table' };
|
|
31390
31785
|
this.parent.trigger(resizeStop, args);
|
|
31391
31786
|
this.parent.formatter.saveData();
|
|
31787
|
+
this.resizeEndTime = new Date().getTime();
|
|
31392
31788
|
}
|
|
31393
31789
|
resetResizeHelper(curTable) {
|
|
31394
31790
|
const colHelper = this.parent.element.querySelectorAll('.e-table-rhelper.e-column-helper');
|
|
@@ -31403,6 +31799,9 @@ class Table {
|
|
|
31403
31799
|
element.parentNode.removeChild(element);
|
|
31404
31800
|
}
|
|
31405
31801
|
});
|
|
31802
|
+
if (!curTable.style.width) {
|
|
31803
|
+
curTable.style.width = curTable.offsetWidth + 'px';
|
|
31804
|
+
}
|
|
31406
31805
|
const colGroup = curTable.querySelector('colgroup');
|
|
31407
31806
|
if (colGroup) {
|
|
31408
31807
|
for (let i = 0; i < curTable.rows.length; i++) {
|
|
@@ -31498,7 +31897,7 @@ class Table {
|
|
|
31498
31897
|
this.createTableButton.isStringTemplate = true;
|
|
31499
31898
|
this.createTableButton.appendTo(btnEle);
|
|
31500
31899
|
EventHandler.add(btnEle, 'click', this.insertTableDialog, { self: this, args: args.args, selection: args.selection });
|
|
31501
|
-
this.parent.getToolbar().appendChild(this.dlgDiv);
|
|
31900
|
+
this.parent.getToolbar().parentElement.appendChild(this.dlgDiv);
|
|
31502
31901
|
let target = args.args.originalEvent.target;
|
|
31503
31902
|
target = target.classList.contains('e-toolbar-item') ? target.firstChild : target.parentElement;
|
|
31504
31903
|
this.popupObj = new Popup(this.dlgDiv, {
|
|
@@ -32470,7 +32869,7 @@ __decorate$2([
|
|
|
32470
32869
|
Property(null)
|
|
32471
32870
|
], PasteCleanupSettings.prototype, "deniedAttrs", void 0);
|
|
32472
32871
|
__decorate$2([
|
|
32473
|
-
Property(['background', 'background-color', 'border', 'border-bottom', 'border-left', 'border-radius', 'border-right', 'border-style', 'border-top', 'border-width', 'clear', 'color', 'cursor', 'direction', 'display', 'float', 'font', 'font-family', 'font-size', 'font-weight', 'font-style', 'height', 'left', 'line-height', 'list-style-type', 'margin', 'margin-top', 'margin-left', 'margin-right', 'margin-bottom', 'max-height', 'max-width', 'min-height', 'min-width', 'overflow', 'overflow-x', 'overflow-y', 'padding', 'padding-bottom', 'padding-left', 'padding-right', 'padding-top', 'position', 'right', 'table-layout', 'text-align', 'text-decoration', 'text-indent', 'top', 'vertical-align', 'visibility', 'white-space', 'width'])
|
|
32872
|
+
Property(['background', 'background-color', 'border', 'border-bottom', 'border-left', 'border-radius', 'border-right', 'border-style', 'border-top', 'border-width', 'clear', 'color', 'cursor', 'direction', 'display', 'float', 'font', 'font-family', 'font-size', 'font-weight', 'font-style', 'height', 'left', 'line-height', 'list-style-type', 'margin', 'margin-top', 'margin-left', 'margin-right', 'margin-bottom', 'max-height', 'max-width', 'min-height', 'min-width', 'overflow', 'overflow-x', 'overflow-y', 'padding', 'padding-bottom', 'padding-left', 'padding-right', 'padding-top', 'position', 'right', 'table-layout', 'text-align', 'text-decoration', 'text-transform', 'text-indent', 'top', 'vertical-align', 'visibility', 'white-space', 'width'])
|
|
32474
32873
|
], PasteCleanupSettings.prototype, "allowedStyleProps", void 0);
|
|
32475
32874
|
__decorate$2([
|
|
32476
32875
|
Property(null)
|
|
@@ -32679,7 +33078,8 @@ class EnterKeyAction {
|
|
|
32679
33078
|
isTableEnter = blockElement.tagName === 'TD' || blockElement.tagName === 'TBODY' ? false : true;
|
|
32680
33079
|
}
|
|
32681
33080
|
if (e.args.which === 13 && !e.args.ctrlKey && (!Browser.isDevice ? e.args.code === 'Enter' : e.args.key === 'Enter')) {
|
|
32682
|
-
if (isNullOrUndefined(this.startNode.closest('LI, UL, OL')) && isNullOrUndefined(this.endNode.closest('LI, UL, OL')) &&
|
|
33081
|
+
if (isNullOrUndefined(this.startNode.closest('LI, UL, OL')) && isNullOrUndefined(this.endNode.closest('LI, UL, OL')) &&
|
|
33082
|
+
isNullOrUndefined(this.startNode.closest('.e-img-inner')) && isTableEnter &&
|
|
32683
33083
|
isNullOrUndefined(this.startNode.closest('PRE')) && isNullOrUndefined(this.endNode.closest('PRE'))) {
|
|
32684
33084
|
const shiftKey = e.args.shiftKey;
|
|
32685
33085
|
const actionBeginArgs = {
|
|
@@ -33167,6 +33567,14 @@ let RichTextEditor = class RichTextEditor extends Component {
|
|
|
33167
33567
|
member: 'image',
|
|
33168
33568
|
args: [this, this.serviceLocator]
|
|
33169
33569
|
});
|
|
33570
|
+
modules.push({
|
|
33571
|
+
member: 'audio',
|
|
33572
|
+
args: [this, this.serviceLocator]
|
|
33573
|
+
});
|
|
33574
|
+
modules.push({
|
|
33575
|
+
member: 'video',
|
|
33576
|
+
args: [this, this.serviceLocator]
|
|
33577
|
+
});
|
|
33170
33578
|
if (this.quickToolbarSettings.enable) {
|
|
33171
33579
|
modules.push({ member: 'quickToolbar', args: [this, this.serviceLocator] });
|
|
33172
33580
|
}
|
|
@@ -33180,14 +33588,6 @@ let RichTextEditor = class RichTextEditor extends Component {
|
|
|
33180
33588
|
if (this.editorMode === 'HTML') {
|
|
33181
33589
|
modules.push({ member: 'htmlEditor', args: [this, this.serviceLocator] });
|
|
33182
33590
|
modules.push({ member: 'pasteCleanup', args: [this, this.serviceLocator] });
|
|
33183
|
-
modules.push({
|
|
33184
|
-
member: 'audio',
|
|
33185
|
-
args: [this, this.serviceLocator]
|
|
33186
|
-
});
|
|
33187
|
-
modules.push({
|
|
33188
|
-
member: 'video',
|
|
33189
|
-
args: [this, this.serviceLocator]
|
|
33190
|
-
});
|
|
33191
33591
|
modules.push({
|
|
33192
33592
|
member: 'formatPainter',
|
|
33193
33593
|
args: [this]
|
|
@@ -33219,7 +33619,7 @@ let RichTextEditor = class RichTextEditor extends Component {
|
|
|
33219
33619
|
else {
|
|
33220
33620
|
if (this.getToolbar()) {
|
|
33221
33621
|
removeClass(this.getToolbar().querySelectorAll('.' + CLS_ACTIVE), CLS_ACTIVE);
|
|
33222
|
-
removeClass([this.getToolbar()], [CLS_TB_FLOAT
|
|
33622
|
+
removeClass([this.getToolbar().parentElement], [CLS_TB_FLOAT]);
|
|
33223
33623
|
}
|
|
33224
33624
|
addClass([this.element], CLS_DISABLED);
|
|
33225
33625
|
this.element.tabIndex = -1;
|
|
@@ -33640,7 +34040,7 @@ let RichTextEditor = class RichTextEditor extends Component {
|
|
|
33640
34040
|
(this.toolbarSettings.items.indexOf('Undo') > -1 && this.toolbarSettings.items.indexOf('Redo') > -1)) {
|
|
33641
34041
|
this.disableToolbarItem(['Undo', 'Redo']);
|
|
33642
34042
|
}
|
|
33643
|
-
this.setContentHeight();
|
|
34043
|
+
this.setContentHeight('Init');
|
|
33644
34044
|
if (this.value !== null) {
|
|
33645
34045
|
this.valueContainer.defaultValue = this.value;
|
|
33646
34046
|
}
|
|
@@ -33844,9 +34244,16 @@ let RichTextEditor = class RichTextEditor extends Component {
|
|
|
33844
34244
|
switch (e.action) {
|
|
33845
34245
|
case 'toolbar-focus':
|
|
33846
34246
|
if (this.toolbarSettings.enable && this.getToolbarElement()) {
|
|
33847
|
-
|
|
33848
|
-
|
|
33849
|
-
|
|
34247
|
+
let firstActiveItem = this.getToolbarElement().querySelector('.e-toolbar-item:not(.e-overlay)[title]');
|
|
34248
|
+
const quickToolbarElem = this.getRenderedQuickToolbarElem();
|
|
34249
|
+
if (quickToolbarElem) {
|
|
34250
|
+
firstActiveItem = quickToolbarElem.querySelector('.e-toolbar-item:not(.e-overlay)[title]');
|
|
34251
|
+
}
|
|
34252
|
+
if (firstActiveItem) {
|
|
34253
|
+
const firstChild = firstActiveItem.firstElementChild;
|
|
34254
|
+
firstChild.removeAttribute('tabindex');
|
|
34255
|
+
firstChild.focus();
|
|
34256
|
+
}
|
|
33850
34257
|
}
|
|
33851
34258
|
break;
|
|
33852
34259
|
case 'escape':
|
|
@@ -34062,6 +34469,7 @@ let RichTextEditor = class RichTextEditor extends Component {
|
|
|
34062
34469
|
this.notify(pasteClean, { args: e });
|
|
34063
34470
|
}
|
|
34064
34471
|
else {
|
|
34472
|
+
console.warn('[WARNING] :: Module "pasteCleanup" is not available in RichTextEditor component! You either misspelled the module name or forgot to load it.');
|
|
34065
34473
|
const args = { requestType: 'Paste', editorMode: this.editorMode, event: e };
|
|
34066
34474
|
let value = null;
|
|
34067
34475
|
let htmlValue = false;
|
|
@@ -34355,7 +34763,7 @@ let RichTextEditor = class RichTextEditor extends Component {
|
|
|
34355
34763
|
break;
|
|
34356
34764
|
case 'height':
|
|
34357
34765
|
this.setHeight(newProp[prop]);
|
|
34358
|
-
this.setContentHeight();
|
|
34766
|
+
this.setContentHeight('Init');
|
|
34359
34767
|
this.autoResize();
|
|
34360
34768
|
break;
|
|
34361
34769
|
case 'readonly':
|
|
@@ -34402,11 +34810,11 @@ let RichTextEditor = class RichTextEditor extends Component {
|
|
|
34402
34810
|
break;
|
|
34403
34811
|
case 'inlineMode':
|
|
34404
34812
|
this.notify(modelChanged, { module: 'quickToolbar', newProp: newProp, oldProp: oldProp });
|
|
34405
|
-
this.setContentHeight();
|
|
34813
|
+
this.setContentHeight('Init');
|
|
34406
34814
|
break;
|
|
34407
34815
|
case 'toolbarSettings':
|
|
34408
34816
|
this.notify(modelChanged, { module: 'toolbar', newProp: newProp, oldProp: oldProp });
|
|
34409
|
-
this.setContentHeight();
|
|
34817
|
+
this.setContentHeight('Init');
|
|
34410
34818
|
break;
|
|
34411
34819
|
case 'maxLength':
|
|
34412
34820
|
if (this.showCharCount) {
|
|
@@ -34565,7 +34973,7 @@ let RichTextEditor = class RichTextEditor extends Component {
|
|
|
34565
34973
|
this.inputElement.setAttribute('placeholder', this.placeholder);
|
|
34566
34974
|
}
|
|
34567
34975
|
}
|
|
34568
|
-
if (this.placeholder && this.iframeSettings.enable) {
|
|
34976
|
+
if (this.placeholder && this.iframeSettings.enable && this.inputElement) {
|
|
34569
34977
|
if (this.inputElement.textContent.length === 0 && this.inputElement.childNodes.length < 2 && !isNullOrUndefined(this.inputElement.firstChild) && (this.inputElement.firstChild.nodeName === 'BR' ||
|
|
34570
34978
|
((this.inputElement.firstChild.nodeName === 'P' || this.inputElement.firstChild.nodeName === 'DIV') && !isNullOrUndefined(this.inputElement.firstChild.firstChild) &&
|
|
34571
34979
|
this.inputElement.firstChild.firstChild.nodeName === 'BR'))) {
|
|
@@ -34910,12 +35318,9 @@ let RichTextEditor = class RichTextEditor extends Component {
|
|
|
34910
35318
|
*/
|
|
34911
35319
|
setContentHeight(target, isExpand) {
|
|
34912
35320
|
let heightValue;
|
|
34913
|
-
let topValue = 0;
|
|
34914
35321
|
let rteHeightPercent;
|
|
34915
35322
|
const heightPercent = typeof (this.height) === 'string' && this.height.indexOf('%') > -1;
|
|
34916
|
-
const cntEle =
|
|
34917
|
-
this.sourceCodeModule.getPanel().parentElement.style.display === 'block') ? this.sourceCodeModule.getPanel().parentElement :
|
|
34918
|
-
this.contentModule.getPanel();
|
|
35323
|
+
const cntEle = this.contentModule.getPanel();
|
|
34919
35324
|
let rteHeight = this.element.offsetHeight;
|
|
34920
35325
|
if (rteHeight === 0 && this.height !== 'auto' && !this.getToolbar()) {
|
|
34921
35326
|
rteHeight = parseInt(this.height, 10);
|
|
@@ -34923,43 +35328,40 @@ let RichTextEditor = class RichTextEditor extends Component {
|
|
|
34923
35328
|
rteHeightPercent = this.height;
|
|
34924
35329
|
}
|
|
34925
35330
|
}
|
|
34926
|
-
|
|
35331
|
+
let tbHeight = this.getToolbar() ? this.toolbarModule.getToolbarHeight() : 0;
|
|
34927
35332
|
const rzHandle = this.element.querySelector('.' + CLS_RTE_RES_HANDLE);
|
|
34928
35333
|
const rzHeight = this.enableResize ? (!isNullOrUndefined(rzHandle) ? (rzHandle.offsetHeight + 8) : 0) : 0;
|
|
34929
35334
|
const expandPopHeight = this.getToolbar() ? this.toolbarModule.getExpandTBarPopHeight() : 0;
|
|
34930
|
-
if (this.
|
|
34931
|
-
|
|
34932
|
-
topValue = (!this.toolbarSettings.enableFloating) ? expandPopHeight : 0;
|
|
35335
|
+
if (target && target !== 'Toolbar' && expandPopHeight && this.element.querySelectorAll('.e-toolbar-extended.e-popup-open').length > 0) {
|
|
35336
|
+
tbHeight = tbHeight - expandPopHeight;
|
|
34933
35337
|
}
|
|
34934
|
-
|
|
34935
|
-
if (
|
|
34936
|
-
heightValue = 'auto';
|
|
35338
|
+
if (this.toolbarSettings.type === ToolbarType.Expand) {
|
|
35339
|
+
if (isExpand) {
|
|
35340
|
+
heightValue = (this.height === 'auto' && this.element.style.height === 'auto') ? 'auto' : rteHeight - (tbHeight + expandPopHeight + rzHeight) + 'px';
|
|
34937
35341
|
}
|
|
34938
35342
|
else {
|
|
34939
|
-
heightValue =
|
|
35343
|
+
heightValue = (this.height === 'auto' && this.element.style.height === 'auto') ? 'auto' : rteHeight - (tbHeight - expandPopHeight + rzHeight) + 'px';
|
|
34940
35344
|
}
|
|
34941
35345
|
}
|
|
34942
|
-
|
|
34943
|
-
|
|
34944
|
-
|
|
34945
|
-
|
|
35346
|
+
else {
|
|
35347
|
+
heightValue = (this.height === 'auto' && this.element.style.height === 'auto') ? 'auto' : rteHeight - tbHeight + 'px';
|
|
35348
|
+
}
|
|
35349
|
+
const finalHeight = heightPercent && rteHeightPercent ? rteHeightPercent : heightValue;
|
|
35350
|
+
switch (target) {
|
|
35351
|
+
case 'Init':
|
|
35352
|
+
case 'Toolbar':
|
|
35353
|
+
case 'WindowResize':
|
|
35354
|
+
case 'Refresh':
|
|
35355
|
+
if (this.element.querySelectorAll('.e-source-content').length > 0 && this.element.querySelector('.e-source-content').style.display === 'block') {
|
|
35356
|
+
setStyleAttribute(this.element.querySelector('.e-source-content'), { height: finalHeight });
|
|
34946
35357
|
}
|
|
34947
|
-
|
|
34948
|
-
|
|
34949
|
-
if (target === 'windowResize' && heightPercent) {
|
|
34950
|
-
//cntEle hide the borderBottom of RichTextEditor. so removed the 2px of cntEle height.
|
|
34951
|
-
heightValue = parseInt(heightValue, 10) - 2 + 'px';
|
|
35358
|
+
else {
|
|
35359
|
+
setStyleAttribute(cntEle, { height: finalHeight });
|
|
34952
35360
|
}
|
|
34953
|
-
|
|
34954
|
-
|
|
34955
|
-
|
|
34956
|
-
|
|
34957
|
-
const codeElement = select('.' + CLS_RTE_CONTENT, this.element);
|
|
34958
|
-
setStyleAttribute(codeElement, { height: heightValue, marginTop: topValue + 'px' });
|
|
34959
|
-
}
|
|
34960
|
-
if (this.toolbarSettings.enableFloating && this.getToolbar() && !this.inlineMode.enable) {
|
|
34961
|
-
const tbWrapHeight = (isExpand ? (tbHeight + expandPopHeight) : tbHeight) + 'px';
|
|
34962
|
-
setStyleAttribute(this.getToolbar().parentElement, { height: tbWrapHeight });
|
|
35361
|
+
break;
|
|
35362
|
+
case 'Resize':
|
|
35363
|
+
setStyleAttribute(cntEle, { height: finalHeight });
|
|
35364
|
+
break;
|
|
34963
35365
|
}
|
|
34964
35366
|
if (rzHeight === 0) {
|
|
34965
35367
|
this.autoResize();
|
|
@@ -35162,18 +35564,14 @@ let RichTextEditor = class RichTextEditor extends Component {
|
|
|
35162
35564
|
resizeHandler() {
|
|
35163
35565
|
let isExpand = false;
|
|
35164
35566
|
if (!document.body.contains(this.element)) {
|
|
35165
|
-
document.defaultView.removeEventListener('resize', this.onResizeHandler, true);
|
|
35567
|
+
document.defaultView.removeEventListener('resize', debounce(this.onResizeHandler, 10), true);
|
|
35166
35568
|
return;
|
|
35167
35569
|
}
|
|
35168
35570
|
if (this.toolbarSettings.enable && !this.inlineMode.enable) {
|
|
35169
35571
|
this.toolbarModule.refreshToolbarOverflow();
|
|
35170
35572
|
isExpand = this.toolbarModule.baseToolbar.toolbarObj.element.classList.contains(CLS_EXPAND_OPEN);
|
|
35171
35573
|
}
|
|
35172
|
-
|
|
35173
|
-
// When resize the window,border bottom of cntEle and this.element border visible separatly.so none the cntEle borderBottom.
|
|
35174
|
-
this.contentModule.getPanel().style.borderBottom = 'none';
|
|
35175
|
-
}
|
|
35176
|
-
this.setContentHeight('windowResize', isExpand);
|
|
35574
|
+
this.setContentHeight('WindowResize', isExpand);
|
|
35177
35575
|
this.notify(windowResize, null);
|
|
35178
35576
|
}
|
|
35179
35577
|
scrollHandler(e) {
|
|
@@ -35309,6 +35707,10 @@ let RichTextEditor = class RichTextEditor extends Component {
|
|
|
35309
35707
|
this.isRTE = false;
|
|
35310
35708
|
}
|
|
35311
35709
|
this.notify(docClick, { args: e });
|
|
35710
|
+
const hideQuickToolbarChecker = this.quickToolbarModule && !this.inlineMode.enable && isNullOrUndefined(this.quickToolbarModule.inlineQTBar);
|
|
35711
|
+
if ((hideQuickToolbarChecker && !isNullOrUndefined(closest(target, '.' + 'e-toolbar-wrapper'))) || (hideQuickToolbarChecker && (!isNullOrUndefined(closest(target, '.e-rte-table-resize')) || !isNullOrUndefined(closest(target, '.e-table-box'))))) {
|
|
35712
|
+
this.quickToolbarModule.hideQuickToolbars();
|
|
35713
|
+
}
|
|
35312
35714
|
if (Browser.info.name !== 'msie' && e.detail > 3) {
|
|
35313
35715
|
e.preventDefault();
|
|
35314
35716
|
}
|
|
@@ -35456,9 +35858,10 @@ let RichTextEditor = class RichTextEditor extends Component {
|
|
|
35456
35858
|
this.triggerEditArea(e.originalEvent);
|
|
35457
35859
|
}
|
|
35458
35860
|
contextHandler(e) {
|
|
35459
|
-
const closestElem = closest(e.target, 'a, table, img');
|
|
35861
|
+
const closestElem = closest(e.target, 'a, table, img, video, audio');
|
|
35460
35862
|
if (this.inlineMode.onSelection === false || (!isNullOrUndefined(closestElem) && this.inputElement.contains(closestElem)
|
|
35461
|
-
&& (closestElem.tagName === 'IMG' || closestElem.tagName === 'TABLE' || closestElem.tagName === 'A'
|
|
35863
|
+
&& (closestElem.tagName === 'IMG' || closestElem.tagName === 'TABLE' || closestElem.tagName === 'A' ||
|
|
35864
|
+
closestElem.tagName.toLowerCase() === 'video' || closestElem.tagName.toLowerCase() === 'audio'))) {
|
|
35462
35865
|
e.preventDefault();
|
|
35463
35866
|
}
|
|
35464
35867
|
}
|
|
@@ -35491,10 +35894,21 @@ let RichTextEditor = class RichTextEditor extends Component {
|
|
|
35491
35894
|
}
|
|
35492
35895
|
}
|
|
35493
35896
|
setAutoHeight(element) {
|
|
35494
|
-
if (!isNullOrUndefined(element)) {
|
|
35897
|
+
if (!isNullOrUndefined(element) && !this.iframeSettings.enable) {
|
|
35495
35898
|
element.style.height = this.inputElement.scrollHeight + 'px';
|
|
35496
35899
|
element.style.overflow = 'hidden';
|
|
35497
35900
|
}
|
|
35901
|
+
else if (!isNullOrUndefined(element) && !isNullOrUndefined(element.parentElement) && this.iframeSettings.enable) {
|
|
35902
|
+
const newRange = this.getRange();
|
|
35903
|
+
element.style.height = 'auto';
|
|
35904
|
+
const newHeight = element.contentDocument.body.scrollHeight + 'px';
|
|
35905
|
+
element.style.height = newHeight;
|
|
35906
|
+
element.style.overflow = 'hidden';
|
|
35907
|
+
// 16 px added for padding doesn't affect the editor height
|
|
35908
|
+
if (newRange.startContainer.nodeName !== '#text' && newRange.startContainer.nodeName !== 'BODY' && window.innerHeight < newRange.startContainer.getBoundingClientRect().top + element.getBoundingClientRect().top + 16) {
|
|
35909
|
+
newRange.startContainer.scrollIntoView(false);
|
|
35910
|
+
}
|
|
35911
|
+
}
|
|
35498
35912
|
}
|
|
35499
35913
|
wireEvents() {
|
|
35500
35914
|
this.element.addEventListener('focusin', this.onFocusHandler, true);
|
|
@@ -35549,7 +35963,7 @@ let RichTextEditor = class RichTextEditor extends Component {
|
|
|
35549
35963
|
EventHandler.add(this.inputElement, Browser.touchStartEvent, this.mouseDownHandler, this);
|
|
35550
35964
|
this.wireContextEvent();
|
|
35551
35965
|
this.formatter.editorManager.observer.on(KEY_DOWN_HANDLER, this.editorKeyDown, this);
|
|
35552
|
-
this.element.ownerDocument.defaultView.addEventListener('resize', this.onResizeHandler, true);
|
|
35966
|
+
this.element.ownerDocument.defaultView.addEventListener('resize', debounce(this.onResizeHandler, 10), true);
|
|
35553
35967
|
if (this.iframeSettings.enable) {
|
|
35554
35968
|
EventHandler.add(this.inputElement, 'focusin', this.focusHandler, this);
|
|
35555
35969
|
EventHandler.add(this.inputElement, 'focusout', this.blurHandler, this);
|
|
@@ -35615,7 +36029,7 @@ let RichTextEditor = class RichTextEditor extends Component {
|
|
|
35615
36029
|
if (this.formatter) {
|
|
35616
36030
|
this.formatter.editorManager.observer.off(KEY_DOWN_HANDLER, this.editorKeyDown);
|
|
35617
36031
|
}
|
|
35618
|
-
this.element.ownerDocument.defaultView.removeEventListener('resize', this.onResizeHandler, true);
|
|
36032
|
+
this.element.ownerDocument.defaultView.removeEventListener('resize', debounce(this.onResizeHandler, 10), true);
|
|
35619
36033
|
if (this.iframeSettings.enable) {
|
|
35620
36034
|
EventHandler.remove(this.inputElement, 'focusin', this.focusHandler);
|
|
35621
36035
|
EventHandler.remove(this.inputElement, 'focusout', this.blurHandler);
|
|
@@ -35680,6 +36094,15 @@ let RichTextEditor = class RichTextEditor extends Component {
|
|
|
35680
36094
|
}
|
|
35681
36095
|
}
|
|
35682
36096
|
}
|
|
36097
|
+
getRenderedQuickToolbarElem() {
|
|
36098
|
+
const quickToolbars = this.quickToolbarModule.getQuickToolbarInstance();
|
|
36099
|
+
for (let i = 0; i < quickToolbars.length; i++) {
|
|
36100
|
+
if (quickToolbars[i] && quickToolbars[i].isRendered) {
|
|
36101
|
+
return quickToolbars[i].element;
|
|
36102
|
+
}
|
|
36103
|
+
}
|
|
36104
|
+
return null;
|
|
36105
|
+
}
|
|
35683
36106
|
};
|
|
35684
36107
|
__decorate$1([
|
|
35685
36108
|
Complex({}, ToolbarSettings$1)
|
|
@@ -35983,5 +36406,5 @@ RichTextEditor = __decorate$1([
|
|
|
35983
36406
|
* Rich Text Editor component exported items
|
|
35984
36407
|
*/
|
|
35985
36408
|
|
|
35986
|
-
export { Toolbar$2 as Toolbar, KeyboardEvents$1 as KeyboardEvents, BaseToolbar, BaseQuickToolbar, QuickToolbar, Count, ColorPickerInput, MarkdownToolbarStatus, ExecCommandCallBack, ToolbarAction, MarkdownEditor, HtmlEditor, PasteCleanup, Resize, DropDownButtons, FileManager$1 as FileManager, FullScreen, setAttributes, HtmlToolbarStatus, XhtmlValidation, FormatPainter, EmojiPicker, HTMLFormatter, Formatter, MarkdownFormatter, ContentRender, Render, ToolbarRenderer, Link, Image$1 as Image, Audio, Video, ViewSource, Table, DialogRenderer, IframeContentRender, MarkdownRender, PopupRenderer, RichTextEditor, RenderType, ToolbarType, DialogType, executeGroup, created, destroyed, tableclass, load, initialLoad, contentChanged, initialEnd, iframeMouseDown, destroy, toolbarClick, toolbarRefresh, refreshBegin, toolbarUpdated, bindOnEnd, renderColorPicker, htmlToolbarClick, markdownToolbarClick, destroyColorPicker, modelChanged, tableModulekeyUp, keyUp, keyDown, mouseUp, toolbarCreated, toolbarRenderComplete, enableFullScreen, disableFullScreen, dropDownSelect, beforeDropDownItemRender, execCommandCallBack, imageToolbarAction, audioToolbarAction, videoToolbarAction, linkToolbarAction, windowResize, resizeStart, onResize, resizeStop, undo, redo, insertLink, unLink, editLink, openLink, actionBegin, actionComplete, updatedToolbarStatus, actionSuccess, updateToolbarItem, insertImage, insertAudio, insertVideo, insertCompleted, imageLeft, imageRight, imageCenter, imageBreak, imageInline, imageLink, imageAlt, imageDelete, audioDelete, videoDelete, imageCaption, imageSize, videoSize, sourceCode, updateSource, toolbarOpen, beforeDropDownOpen, selectionSave, selectionRestore, expandPopupClick, count, contentFocus, contentBlur, mouseDown, sourceCodeMouseDown, editAreaClick, scroll, contentscroll, colorPickerChanged, tableColorPickerChanged, focusChange, selectAll$1 as selectAll, selectRange, getSelectedHtml, renderInlineToolbar, paste, imgModule, rtlMode, createTable, docClick, tableToolbarAction, checkUndo, readOnlyMode, moduleDestroy, pasteClean, enterHandler, beforeDialogOpen, clearDialogObj, dialogOpen, beforeDialogClose, dialogClose, beforeQuickToolbarOpen, quickToolbarOpen, quickToolbarClose, popupHide, imageSelected, imageUploading, imageUploadSuccess, imageUploadFailed, imageRemoving, fileSelected, fileUploading, fileUploadSuccess, fileUploadFailed, fileRemoving, afterImageDelete, afterMediaDelete, drop, xhtmlValidation, beforeImageUpload, beforeFileUpload, resizeInitialized, renderFileManager, beforeImageDrop, dynamicModule, beforePasteCleanup, afterPasteCleanup, updateTbItemsStatus, showLinkDialog, closeLinkDialog, showImageDialog, showAudioDialog, showVideoDialog, closeImageDialog, closeAudioDialog, closeVideoDialog, showTableDialog, closeTableDialog, bindCssClass, formatPainterClick, formatPainterDoubleClick, emojiPicker, destroyTooltip, hidePopup, cleanupResizeElements, afterKeyDown, updateValueOnIdle, documentClickClosedBy, showColorPicker, blockEmptyNodes, inlineEmptyNodes, supportedUnits, conversionFactors, onHandleFontsizeChange, CLS_RTE, CLS_RTL, CLS_CONTENT, CLS_DISABLED, CLS_SCRIPT_SHEET, CLS_STYLE_SHEET, CLS_TOOLBAR, CLS_TB_FIXED, CLS_TB_FLOAT,
|
|
36409
|
+
export { Toolbar$2 as Toolbar, KeyboardEvents$1 as KeyboardEvents, BaseToolbar, BaseQuickToolbar, QuickToolbar, Count, ColorPickerInput, MarkdownToolbarStatus, ExecCommandCallBack, ToolbarAction, MarkdownEditor, HtmlEditor, PasteCleanup, Resize, DropDownButtons, FileManager$1 as FileManager, FullScreen, setAttributes, HtmlToolbarStatus, XhtmlValidation, FormatPainter, EmojiPicker, HTMLFormatter, Formatter, MarkdownFormatter, ContentRender, Render, ToolbarRenderer, Link, Image$1 as Image, Audio, Video, ViewSource, Table, DialogRenderer, IframeContentRender, MarkdownRender, PopupRenderer, RichTextEditor, RenderType, ToolbarType, DialogType, executeGroup, created, destroyed, tableclass, load, initialLoad, contentChanged, initialEnd, iframeMouseDown, destroy, toolbarClick, toolbarRefresh, refreshBegin, toolbarUpdated, bindOnEnd, renderColorPicker, htmlToolbarClick, markdownToolbarClick, destroyColorPicker, modelChanged, tableModulekeyUp, keyUp, keyDown, mouseUp, toolbarCreated, toolbarRenderComplete, enableFullScreen, disableFullScreen, dropDownSelect, beforeDropDownItemRender, execCommandCallBack, imageToolbarAction, audioToolbarAction, videoToolbarAction, linkToolbarAction, windowResize, resizeStart, onResize, resizeStop, undo, redo, insertLink, unLink, editLink, openLink, actionBegin, actionComplete, updatedToolbarStatus, actionSuccess, updateToolbarItem, insertImage, insertAudio, insertVideo, insertCompleted, imageLeft, imageRight, imageCenter, imageBreak, imageInline, imageLink, imageAlt, imageDelete, audioDelete, videoDelete, imageCaption, imageSize, videoSize, sourceCode, updateSource, toolbarOpen, beforeDropDownOpen, selectionSave, selectionRestore, expandPopupClick, count, contentFocus, contentBlur, mouseDown, sourceCodeMouseDown, editAreaClick, scroll, contentscroll, colorPickerChanged, tableColorPickerChanged, focusChange, selectAll$1 as selectAll, selectRange, getSelectedHtml, renderInlineToolbar, paste, imgModule, rtlMode, createTable, docClick, tableToolbarAction, checkUndo, readOnlyMode, moduleDestroy, pasteClean, enterHandler, beforeDialogOpen, clearDialogObj, dialogOpen, beforeDialogClose, dialogClose, beforeQuickToolbarOpen, quickToolbarOpen, quickToolbarClose, popupHide, imageSelected, imageUploading, imageUploadSuccess, imageUploadFailed, imageRemoving, fileSelected, fileUploading, fileUploadSuccess, fileUploadFailed, fileRemoving, afterImageDelete, afterMediaDelete, drop, xhtmlValidation, beforeImageUpload, beforeFileUpload, resizeInitialized, renderFileManager, beforeImageDrop, dynamicModule, beforePasteCleanup, afterPasteCleanup, updateTbItemsStatus, showLinkDialog, closeLinkDialog, showImageDialog, showAudioDialog, showVideoDialog, closeImageDialog, closeAudioDialog, closeVideoDialog, showTableDialog, closeTableDialog, bindCssClass, formatPainterClick, formatPainterDoubleClick, emojiPicker, destroyTooltip, hidePopup, cleanupResizeElements, afterKeyDown, updateValueOnIdle, documentClickClosedBy, showColorPicker, closeTooltip, blockEmptyNodes, inlineEmptyNodes, supportedUnits, conversionFactors, onHandleFontsizeChange, CLS_RTE, CLS_RTL, CLS_CONTENT, CLS_DISABLED, CLS_SCRIPT_SHEET, CLS_STYLE_SHEET, CLS_TOOLBAR, CLS_TB_FIXED, CLS_TB_FLOAT, CLS_INLINE, CLS_TB_INLINE, CLS_RTE_EXPAND_TB, CLS_FULL_SCREEN, CLS_QUICK_TB, CLS_TEXT_QUICK_TB, CLS_POP, CLS_TB_STATIC, CLS_QUICK_POP, CLS_QUICK_DROPDOWN, CLS_IMAGE_POP, CLS_TEXT_POP, CLS_INLINE_POP, CLS_INLINE_DROPDOWN, CLS_DROPDOWN_POPUP, CLS_DROPDOWN_ICONS, CLS_DROPDOWN_ITEMS, CLS_DROPDOWN_BTN, CLS_RTE_CONTENT, CLS_TB_ITEM, CLS_TB_EXTENDED, CLS_TB_WRAP, CLS_POPUP, CLS_SEPARATOR, CLS_MINIMIZE, CLS_MAXIMIZE, CLS_BACK, CLS_SHOW, CLS_HIDE, CLS_VISIBLE, CLS_FOCUS, CLS_RM_WHITE_SPACE, CLS_IMGRIGHT, CLS_IMGLEFT, CLS_IMGCENTER, CLS_IMGBREAK, CLS_AUDIOBREAK, CLS_CLICKELEM, CLS_VID_CLICK_ELEM, CLS_AUDIOWRAP, CLS_VIDEOWRAP, CLS_VIDEOBREAK, CLS_CAPTION, CLS_RTE_CAPTION, CLS_CAPINLINE, CLS_IMGINLINE, CLS_AUDIOINLINE, CLS_VIDEOINLINE, CLS_COUNT, CLS_WARNING, CLS_ERROR, CLS_ICONS, CLS_ACTIVE, CLS_EXPAND_OPEN, CLS_RTE_ELEMENTS, CLS_TB_BTN, CLS_HR_SEPARATOR, CLS_TB_IOS_FIX, CLS_LIST_PRIMARY_CONTENT, CLS_NUMBERFORMATLIST_TB_BTN, CLS_BULLETFORMATLIST_TB_BTN, CLS_FORMATS_TB_BTN, CLS_FONT_NAME_TB_BTN, CLS_FONT_SIZE_TB_BTN, CLS_ALIGN_TB_BTN, CLS_FONT_COLOR_TARGET, CLS_BACKGROUND_COLOR_TARGET, CLS_COLOR_CONTENT, CLS_FONT_COLOR_DROPDOWN, CLS_BACKGROUND_COLOR_DROPDOWN, CLS_COLOR_PALETTE, CLS_FONT_COLOR_PICKER, CLS_BACKGROUND_COLOR_PICKER, CLS_RTE_READONLY, CLS_TABLE_SEL, CLS_TB_DASH_BOR, CLS_TB_ALT_BOR, CLS_TB_COL_RES, CLS_TB_ROW_RES, CLS_TB_BOX_RES, CLS_RTE_HIDDEN, CLS_RTE_PASTE_KEEP_FORMAT, CLS_RTE_PASTE_REMOVE_FORMAT, CLS_RTE_PASTE_PLAIN_FORMAT, CLS_RTE_PASTE_OK, CLS_RTE_PASTE_CANCEL, CLS_RTE_DIALOG_MIN_HEIGHT, CLS_RTE_RES_HANDLE, CLS_RTE_RES_EAST, CLS_RTE_IMAGE, CLS_RESIZE, CLS_IMG_FOCUS, CLS_AUD_FOCUS, CLS_VID_FOCUS, CLS_RTE_DRAG_IMAGE, CLS_RTE_UPLOAD_POPUP, CLS_POPUP_OPEN, CLS_IMG_RESIZE, CLS_DROPAREA, CLS_IMG_INNER, CLS_UPLOAD_FILES, CLS_RTE_DIALOG_UPLOAD, CLS_RTE_RES_CNT, CLS_CUSTOM_TILE, CLS_NOCOLOR_ITEM, CLS_TABLE, CLS_TABLE_BORDER, CLS_RTE_TABLE_RESIZE, CLS_RTE_FIXED_TB_EXPAND, CLS_RTE_TB_ENABLED, CLS_RTE_RES_WEST, CLS_RTE_SOURCE_CODE_TXTAREA, getIndex, hasClass, getDropDownValue, isIDevice, getFormattedFontSize, pageYOffset, getTooltipText, getTooltipTextDropdownItems, getQuickToolbarTooltipText, setToolbarStatus, getCollection, getTBarItemsIndex, updateUndoRedoStatus, dispatchEvent, parseHtml, getTextNodesUnder, toObjectLowerCase, getEditValue, updateTextNode, getDefaultValue, isEditableValueEmpty, decode, sanitizeHelper, convertToBlob, getLocaleFontFormat, updateDropDownFontFormatLocale, ServiceLocator, RendererFactory, EditorManager, IMAGE, AUDIO, VIDEO, TABLE, LINK, INSERT_ROW, INSERT_COLUMN, DELETEROW, DELETECOLUMN, REMOVETABLE, TABLEHEADER, TABLE_VERTICAL_ALIGN, TABLE_MERGE, TABLE_VERTICAL_SPLIT, TABLE_HORIZONTAL_SPLIT, TABLE_MOVE, ALIGNMENT_TYPE, INDENT_TYPE, DEFAULT_TAG, BLOCK_TAGS, IGNORE_BLOCK_TAGS, TABLE_BLOCK_TAGS, SELECTION_TYPE, INSERTHTML_TYPE, INSERT_TEXT_TYPE, CLEAR_TYPE, SELF_CLOSING_TAGS, PASTE_SOURCE, CLASS_IMAGE_RIGHT, CLASS_IMAGE_LEFT, CLASS_IMAGE_CENTER, CLASS_VIDEO_RIGHT, CLASS_VIDEO_LEFT, CLASS_VIDEO_CENTER, CLASS_IMAGE_BREAK, CLASS_AUDIO_BREAK, CLASS_VIDEO_BREAK, CLASS_CAPTION, CLASS_RTE_CAPTION, CLASS_CAPTION_INLINE, CLASS_IMAGE_INLINE, CLASS_AUDIO_INLINE, CLASS_CLICK_ELEM, CLASS_VIDEO_CLICK_ELEM, CLASS_AUDIO, CLASS_VIDEO, CLASS_AUDIO_WRAP, CLASS_VIDEO_WRAP, CLASS_EMBED_VIDEO_WRAP, CLASS_AUDIO_FOCUS, CLASS_VIDEO_FOCUS, CLASS_VIDEO_INLINE, Lists, markerClassName, DOMNode, Alignments, Indents, Formats, LinkCommand, InsertMethods, InsertTextExec, InsertHtmlExec, InsertHtml, IsFormatted, MsWordPaste, NodeCutter, ImageCommand, AudioCommand, VideoCommand, SelectionCommands, SelectionBasedExec, ClearFormatExec, UndoRedoManager, TableCommand, statusCollection, ToolbarStatus, FormatPainterActions, EmojiPickerAction, NodeSelection, MarkdownParser, LISTS_COMMAND, selectionCommand, LINK_COMMAND, CLEAR_COMMAND, MD_TABLE, INSERT_TEXT_COMMAND, ClearFormat, MDLists, MDFormats, MarkdownSelection, UndoRedoCommands, MDSelectionFormats, MDLink, MDTable, markdownFormatTags, markdownSelectionTags, markdownListsTags, htmlKeyConfig, markdownKeyConfig, pasteCleanupGroupingTags, listConversionFilters, selfClosingTags, imageResizeFactor, KEY_DOWN, ACTION, FORMAT_TYPE, KEY_DOWN_HANDLER, LIST_TYPE, KEY_UP_HANDLER, KEY_UP, MODEL_CHANGED_PLUGIN, MODEL_CHANGED, MS_WORD_CLEANUP_PLUGIN, MS_WORD_CLEANUP, ON_BEGIN, SPACE_ACTION, FORMAT_PAINTER_ACTIONS, EMOJI_PICKER_ACTIONS, MOUSE_DOWN };
|
|
35987
36410
|
//# sourceMappingURL=ej2-richtexteditor.es2015.js.map
|