all files / rich-text-editor/renderer/ iframe-content-renderer.js

100% Statements 73/73
94.44% Branches 34/36
100% Functions 15/15
100% Lines 70/70
11 statements, 6 functions, 9 branches Ignored     
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            82×   82× 82× 82×   82× 82×         82× 82× 82×       82× 82× 82× 82× 82× 82× 82× 82× 82× 71×   82×   82×   82× 82×   82×           82× 82×   3577× 3577× 3561×     16×   3577×   977×        
/* istanbul ignore next */ 
var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
define(["require", "exports", "../renderer/content-renderer", "@syncfusion/ej2-base", "../base/util", "../../common/editor-styles"], function (require, exports, content_renderer_1, ej2_base_1, util_1, editor_styles_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var IFRAMEHEADER = "\n    <!DOCTYPE html> \n    <html>\n         <head>\n            <meta charset='utf-8' /> \n            <style>" +
        editor_styles_1.IFRAME_EDITOR_STYLES.replace(/[\n\t]/g, '') + "\n            </style>\n        </head>\n";
    var IframeContentRender = (function (_super) {
        __extends(IframeContentRender, _super);
        function IframeContentRender() {
            return _super !== null && _super.apply(this, arguments) || this;
        }
        IframeContentRender.prototype.renderPanel = function () {
            var rteObj = this.parent;
            var rteContent = util_1.getEditValue(rteObj.value, rteObj);
            var iFrameBodyContent = '<body contenteditable="true">' +
                rteContent + '</body></html>';
            var iFrameContent = IFRAMEHEADER + iFrameBodyContent;
            var iframe = this.parent.createElement('iframe', {
                id: this.parent.getID() + '_rte-view',
                className: 'e-rte-content',
                attrs: { 'srcdoc': iFrameContent }
            });
            iframe.setAttribute('role', 'none');
            this.setPanel(iframe);
            if (!ej2_base_1.isNullOrUndefined(this.parent.iframeSettings.sandbox)) {
                var sandboxValues = this.parent.iframeSettings.sandbox
                    .map(function (element) { return element.toLocaleLowerCase().trim(); })
                    .join(' ');
                Eif (!sandboxValues.includes('allow-same-origin')) {
                    sandboxValues += ' allow-same-origin';
                }
                iframe.setAttribute('sandbox', sandboxValues.trim());
            }
            rteObj.rootContainer.appendChild(iframe);
            iframe.contentDocument.body.setAttribute('aria-owns', this.parent.getID());
            iframe.contentDocument.open();
            iFrameContent = this.setThemeColor(iFrameContent, { color: '#333' });
            iframe.contentDocument.write(iFrameContent);
            iframe.contentDocument.close();
            var body = iframe.contentDocument.body;
            body.className = 'e-content';
            if (this.parent.height === 'auto') {
                body.style.overflowY = 'hidden';
            }
            if (!ej2_base_1.isNullOrUndefined(this.parent.fontFamily.default)) {
                body.style.fontFamily = this.parent.fontFamily.default;
            }
            if (!ej2_base_1.isNullOrUndefined(this.parent.fontSize.default)) {
                body.style.fontSize = this.parent.fontSize.default;
            }
            body.id = this.parent.getID() + '_rte-edit-view';
            if (rteObj.enableRtl) {
                this.contentPanel.contentDocument.body.setAttribute('class', 'e-rtl');
            }
            if (!ej2_base_1.isNullOrUndefined(iframe.contentDocument.head) && this.parent.iframeSettings.metaTags.length > 0) {
                var head_1 = iframe.contentDocument.head;
                var metaData = this.parent.iframeSettings.metaTags;
                metaData.forEach(function (tag) {
                    var meta = document.createElement('meta');
                    for (var key in tag) {
                        Eif (!ej2_base_1.isNullOrUndefined(tag[key])) {
                            meta.setAttribute((key === 'httpEquiv') ? 'http-equiv' : key, tag[key]);
                        }
                    }
                    head_1.appendChild(meta);
                });
            }
        };
        IframeContentRender.prototype.setThemeColor = function (content, styles) {
            var fontColor = getComputedStyle(this.parent.element, '.e-richtexteditor').getPropertyValue('color');
            return content.replace(styles.color, fontColor);
        };
        IframeContentRender.prototype.getEditPanel = function () {
            var editNode;
            if (!ej2_base_1.isNullOrUndefined(this.contentPanel.contentDocument)) {
                editNode = this.contentPanel.contentDocument.body;
            }
            else {
                editNode = this.parent.inputElement;
            }
            return editNode;
        };
        IframeContentRender.prototype.getDocument = function () {
            return this.getEditPanel().ownerDocument;
        };
        return IframeContentRender;
    }(content_renderer_1.ContentRender));
    exports.IframeContentRender = IframeContentRender;
});