all files / rich-text-editor/renderer/ view-source.js

99.25% Statements 132/133
90.38% Branches 47/52
100% Functions 22/22
99.24% Lines 131/132
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204   1833× 1833× 1833× 1833×   1833× 1833× 1833× 1833×   1833×   1832× 1832× 1832× 1832× 1832× 1832×   51×   58×     58×   1854× 73×   1854× 58×     22×       58×               362×               58× 58× 58× 58× 58× 58× 58× 58× 58× 58×       58× 51×   58× 58× 58× 51×             58× 58× 58× 58× 58× 58× 58× 57×   58× 58× 58× 58× 58× 58× 58× 58× 2811×         22× 22× 22× 22× 22× 22× 22×       22× 22× 22× 10×             12×   22× 22× 22× 22× 22×   22× 22× 22× 22× 22× 22× 22× 22× 22× 22×       58×                 81×   1832×     1832×        
define(["require", "exports", "@syncfusion/ej2-base", "../base/constant", "../base/classes", "../../common/constant", "../base/enum", "../actions/keyboard"], function (require, exports, ej2_base_1, events, classes_1, CONSTANT, enum_1, keyboard_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var ViewSource = (function () {
        function ViewSource(parent, locator) {
            this.parent = parent;
            var serviceLocator = locator;
            this.rendererFactory = serviceLocator.getService('rendererFactory');
            this.addEventListener();
        }
        ViewSource.prototype.addEventListener = function () {
            this.parent.on(events.sourceCode, this.sourceCode, this);
            this.parent.on(events.initialEnd, this.onInitialEnd, this);
            this.parent.on(events.updateSource, this.updateSourceCode, this);
            this.parent.on(events.destroy, this.destroy, this);
        };
        ViewSource.prototype.onInitialEnd = function () {
            this.parent.formatter.editorManager.observer.on(CONSTANT.KEY_DOWN_HANDLER, this.onKeyDown, this);
        };
        ViewSource.prototype.removeEventListener = function () {
            this.unWireEvent();
            this.parent.off(events.sourceCode, this.sourceCode);
            this.parent.off(events.updateSource, this.updateSourceCode);
            this.parent.off(events.initialEnd, this.onInitialEnd);
            this.parent.off(events.destroy, this.destroy);
            this.parent.formatter.editorManager.observer.off(CONSTANT.KEY_DOWN_HANDLER, this.onKeyDown);
        };
        ViewSource.prototype.getSourceCode = function () {
            return this.parent.createElement('textarea', { className: classes_1.CLS_RTE_SOURCE_CODE_TXTAREA + this.parent.getCssClass(true) });
        };
        ViewSource.prototype.wireEvent = function (element) {
            this.keyboardModule = new keyboard_1.KeyboardEvents(element, {
                keyAction: this.previewKeyDown.bind(this), keyConfigs: this.parent.formatter.keyConfig, eventName: 'keydown'
            });
            ej2_base_1.EventHandler.add(this.previewElement, 'mousedown', this.mouseDownHandler, this);
        };
        ViewSource.prototype.unWireEvent = function () {
            if (this.previewElement) {
                ej2_base_1.EventHandler.remove(this.previewElement, 'mousedown', this.mouseDownHandler);
            }
            if (this.keyboardModule && !this.keyboardModule.isDestroyed) {
                this.keyboardModule.destroy();
            }
        };
        ViewSource.prototype.wireBaseKeyDown = function () {
            this.parent.keyboardModule = new keyboard_1.KeyboardEvents(this.contentModule.getEditPanel(), {
                keyAction: this.parent.keyDown.bind(this.parent), keyConfigs: this.parent.formatter.keyConfig, eventName: 'keydown'
            });
        };
        ViewSource.prototype.unWireBaseKeyDown = function () {
            this.parent.keyboardModule.destroy();
        };
        ViewSource.prototype.mouseDownHandler = function (e) {
            this.parent.notify(events.sourceCodeMouseDown, { args: e });
        };
        ViewSource.prototype.previewKeyDown = function (event) {
            switch (event.action) {
                case 'html-source':
                    this.updateSourceCode(event);
                    event.preventDefault();
                    break;
                case 'toolbar-focus':
                    Eif (this.parent.toolbarSettings.enable && this.parent.getToolbarElement()) {
                        var firstActiveItem = this.parent.getToolbarElement().querySelector('.e-toolbar-item:not(.e-overlay)[title]');
                        firstActiveItem.firstElementChild.removeAttribute('tabindex');
                        firstActiveItem.firstElementChild.focus();
                    }
                    break;
            }
        };
        ViewSource.prototype.onKeyDown = function (e) {
            switch (e.event.action) {
                case 'html-source':
                    e.event.preventDefault();
                    this.sourceCode(e);
                    e.callBack({
                        requestType: 'SourceCode',
                        editorMode: 'HTML',
                        event: e.event
                    });
                    break;
            }
        };
        ViewSource.prototype.sourceCode = function (args) {
            var _this = this;
            this.parent.notify(events.hidePopup, {});
            this.parent.isBlur = false;
            this.parent.trigger(events.actionBegin, { requestType: 'SourceCode', targetItem: 'SourceCode', args: args, cancel: false }, function (actionBeginArgs) {
                Eif (!actionBeginArgs.cancel) {
                    var tbItems = ej2_base_1.selectAll('.' + classes_1.CLS_TB_ITEM, _this.parent.element);
                    _this.contentModule = _this.rendererFactory.getRenderer(enum_1.RenderType.Content);
                    var height = _this.parent.inputElement.getBoundingClientRect().height;
                    _this.parent.rootContainer.classList.add('e-source-code-enabled');
                    _this.parent.notify(events.updateToolbarItem, {
                        targetItem: 'SourceCode', updateItem: 'Preview',
                        baseToolbar: _this.parent.getBaseToolbarObject()
                    });
                    if (ej2_base_1.isNullOrUndefined(_this.previewElement)) {
                        _this.previewElement = _this.getSourceCode();
                    }
                    _this.parent.updateValueData();
                    var rteContent = void 0;
                    if (ej2_base_1.isNullOrUndefined(_this.parent.element.querySelector('#' + _this.parent.getID() + '_source-view'))) {
                        rteContent = _this.parent.createElement('div', {
                            className: 'e-source-content', id: _this.parent.getID() + '_source-view',
                            attrs: { style: 'height:' + height + 'px' }
                        });
                    }
                    else {
                        rteContent = _this.parent.element.querySelector('#' + _this.parent.getID() + '_source-view');
                        rteContent.style.height = height + 'px';
                    }
                    rteContent.appendChild(_this.previewElement);
                    _this.parent.rootContainer.appendChild(rteContent);
                    _this.getPanel().value = _this.getTextAreaValue();
                    _this.parent.isBlur = false;
                    _this.parent.disableToolbarItem(_this.parent.toolbarSettings.items);
                    _this.parent.enableToolbarItem('SourceCode');
                    if (_this.parent.getToolbar()) {
                        ej2_base_1.removeClass([_this.parent.getToolbar()], [classes_1.CLS_EXPAND_OPEN]);
                    }
                    ej2_base_1.removeClass(tbItems, [classes_1.CLS_ACTIVE]);
                    _this.wireEvent(_this.previewElement);
                    _this.unWireBaseKeyDown();
                    _this.previewElement.focus();
                    _this.parent.updateValue();
                    _this.parent.trigger(events.actionComplete, { requestType: 'SourceCode', targetItem: 'SourceCode', args: args });
                    _this.parent.invokeChangeEvent();
                    if (!ej2_base_1.isNullOrUndefined(_this.parent.saveInterval) && _this.parent.saveInterval > 0 && _this.parent.autoSaveOnIdle) {
                        _this.codeViewTimeInterval = setInterval(function () { _this.parent.notify(events.updateValueOnIdle, {}); }, _this.parent.saveInterval);
                    }
                }
            });
        };
        ViewSource.prototype.updateSourceCode = function (args) {
            var _this = this;
            this.parent.isBlur = false;
            this.parent.trigger(events.actionBegin, { requestType: 'Preview', targetItem: 'Preview', args: args, cancel: false }, function (actionBeginArgs) {
                Eif (!actionBeginArgs.cancel) {
                    _this.parent.rootContainer.classList.remove('e-source-code-enabled');
                    var editHTML = _this.getPanel();
                    _this.parent.notify(events.updateToolbarItem, {
                        targetItem: 'Preview', updateItem: 'SourceCode',
                        baseToolbar: _this.parent.getBaseToolbarObject()
                    });
                    var serializeValue = _this.parent.serializeValue(editHTML.value);
                    var value = void 0;
                    if (serializeValue === null || serializeValue === '') {
                        if (_this.parent.enterKey === 'DIV') {
                            value = '<div><br/></div>';
                        }
                        else if (_this.parent.enterKey === 'BR') {
                            value = '<br/>';
                        }
                        else {
                            value = '<p><br/></p>';
                        }
                    }
                    else {
                        value = serializeValue;
                    }
                    _this.contentModule.getEditPanel().innerHTML = value;
                    _this.parent.isBlur = false;
                    _this.parent.enableToolbarItem(_this.parent.toolbarSettings.items);
                    Eif (_this.parent.getToolbar()) {
                        ej2_base_1.removeClass([_this.parent.getToolbar()], [classes_1.CLS_EXPAND_OPEN]);
                    }
                    _this.unWireEvent();
                    _this.wireBaseKeyDown();
                    _this.contentModule.getEditPanel().focus();
                    _this.parent.updateValue();
                    _this.parent.trigger(events.actionComplete, { requestType: 'Preview', targetItem: 'Preview', args: args });
                    _this.parent.formatter.enableUndo(_this.parent);
                    _this.parent.addAudioVideoWrapper();
                    clearTimeout(_this.codeViewTimeInterval);
                    _this.parent.invokeChangeEvent();
                    _this.parent.notify(events.tableclass, {});
                }
            });
        };
        ViewSource.prototype.getTextAreaValue = function () {
            return (this.contentModule.getEditPanel().innerHTML === '<p><br></p>') ||
                (this.contentModule.getEditPanel().innerHTML === '<div><br></div>') ||
                (this.contentModule.getEditPanel().innerHTML === '<br>') ||
                (this.contentModule.getEditPanel().childNodes.length === 1 &&
                    (this.contentModule.getEditPanel().childNodes[0].tagName === 'P' &&
                        this.contentModule.getEditPanel().innerHTML.length === 7) ||
                    (this.contentModule.getEditPanel().childNodes[0].tagName === 'DIV' &&
                        this.contentModule.getEditPanel().innerHTML.length === 11)) ? '' : this.parent.value;
        };
        ViewSource.prototype.getPanel = function () {
            return this.parent.element && this.parent.element.querySelector('.e-rte-srctextarea');
        };
        ViewSource.prototype.destroy = function () {
            Iif (ej2_base_1.isNullOrUndefined(this.parent)) {
                return;
            }
            this.removeEventListener();
        };
        return ViewSource;
    }());
    exports.ViewSource = ViewSource;
});