all files / rich-text-editor/actions/ base-toolbar.js

100% Statements 118/118
95.89% Branches 70/73
100% Functions 16/16
100% Lines 118/118
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 205 206 207 208   3808× 3808× 3808× 3808× 3808× 3808× 3808×     3806×   3808× 3808× 3808×     3808× 3808×   3799× 3799×   1819× 1744× 1736×           1812×     773× 773×   10× 10×     72× 72×   691× 691×   773×   6877× 6877×         798× 798×   6079× 6079×   6877×                     31621× 31621× 6877×     24744×   3727×   884×   20133×                   3890× 3890×   3889× 3889× 31617×   31596× 31596×   21×               21×     3889× 3889× 31617× 31617×   3889× 3888× 31616× 31616× 31616× 31616× 12368×     19248×   31616× 26959× 26582×         3889×   3726×                     3726× 3726× 14×   3726×   3801×   3799× 3799× 3724× 3724×   3799× 3799× 3799× 3799×        
define(["require", "exports", "../base/enum", "../base/classes", "../base/constant", "../base/util", "../models/items", "@syncfusion/ej2-base", "../renderer"], function (require, exports, enum_1, classes_1, events, util_1, items_1, ej2_base_1, renderer_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var BaseToolbar = (function () {
        function BaseToolbar(parent, serviceLocator) {
            this.tools = {};
            this.parent = parent;
            this.locator = serviceLocator;
            this.isDestroyed = false;
            this.renderFactory = this.locator.getService('rendererFactory');
            this.addEventListener();
            if (this.parent.toolbarSettings && Object.keys(this.parent.toolbarSettings.itemConfigs).length > 0) {
                ej2_base_1.extend(this.tools, items_1.tools, util_1.toObjectLowerCase(this.parent.toolbarSettings.itemConfigs), true);
            }
            else {
                this.tools = items_1.tools;
            }
            Eif (this.parent.toolbarSettings.enable || this.parent.quickToolbarSettings.enable) {
                this.toolbarRenderer = new renderer_1.ToolbarRenderer(this.parent, this.locator);
                this.renderFactory.addRenderer(enum_1.RenderType.Toolbar, this.toolbarRenderer);
            }
        }
        BaseToolbar.prototype.addEventListener = function () {
            this.parent.on(events.rtlMode, this.setRtl, this);
            this.parent.on(events.bindCssClass, this.setCssClass, this);
        };
        BaseToolbar.prototype.removeEventListener = function () {
            this.parent.off(events.rtlMode, this.setRtl);
            this.parent.off(events.bindCssClass, this.setCssClass);
        };
        BaseToolbar.prototype.setCssClass = function (e) {
            if (!ej2_base_1.isNullOrUndefined(this.toolbarObj)) {
                if (ej2_base_1.isNullOrUndefined(e.oldCssClass)) {
                    this.toolbarObj.setProperties({ cssClass: (this.toolbarObj.cssClass + ' ' + e.cssClass).trim() });
                }
                else {
                    this.toolbarObj.setProperties({ cssClass: (this.toolbarObj.cssClass.replace(e.oldCssClass, '').trim() + ' ' + e.cssClass).trim() });
                }
            }
        };
        BaseToolbar.prototype.setRtl = function (args) {
            if (!ej2_base_1.isNullOrUndefined(this.toolbarObj)) {
                this.toolbarObj.setProperties({ enableRtl: args.enableRtl });
            }
        };
        BaseToolbar.prototype.getClass = function (item) {
            var classes;
            switch (item) {
                case 'fontsize':
                    classes = 'e-rte-inline-size-template';
                    break;
                case 'fontcolor':
                case 'backgroundcolor':
                    classes = 'e-rte-inline-color-template';
                    break;
                default:
                    classes = 'e-rte-inline-template';
                    break;
            }
            return classes;
        };
        BaseToolbar.prototype.getTemplateObject = function (itemStr, container) {
            var tagName;
            switch (itemStr) {
                case 'fontcolor':
                case 'backgroundcolor':
                case 'numberformatlist':
                case 'bulletformatlist':
                    tagName = 'span';
                    break;
                default:
                    tagName = 'button';
                    break;
            }
            return {
                command: this.tools[itemStr.toLocaleLowerCase()].command,
                subCommand: this.tools[itemStr.toLocaleLowerCase()].subCommand,
                template: this.parent.createElement(tagName, {
                    id: this.parent.getID() + '_' + container
                        + '_' + this.tools[itemStr.toLocaleLowerCase()].id
                }).outerHTML,
                cssClass: this.parent.inlineMode.enable ? this.getClass(itemStr) : '',
                tooltipText: util_1.getTooltipText(itemStr, this.locator)
            };
        };
        BaseToolbar.prototype.getObject = function (item, container) {
            var itemStr = item.toLowerCase();
            if (items_1.templateItems.indexOf(itemStr) !== -1) {
                return this.getTemplateObject(itemStr, container);
            }
            else {
                switch (itemStr) {
                    case '|':
                        return { type: 'Separator' };
                    case '-':
                        return { type: 'Separator', cssClass: classes_1.CLS_HR_SEPARATOR };
                    default:
                        return {
                            id: this.parent.getID() + '_' + container + '_' + this.tools[itemStr.toLocaleLowerCase()].id,
                            prefixIcon: this.tools[itemStr.toLocaleLowerCase()].icon,
                            tooltipText: util_1.getTooltipText(itemStr, this.locator),
                            command: this.tools[itemStr.toLocaleLowerCase()].command,
                            subCommand: this.tools[itemStr.toLocaleLowerCase()].subCommand
                        };
                }
            }
        };
        BaseToolbar.prototype.getItems = function (tbItems, container) {
            var _this = this;
            if (this.parent.toolbarSettings.items.length < 1) {
                return [];
            }
            var items = [];
            var _loop_1 = function (item) {
                switch (typeof item) {
                    case 'string':
                        items.push(this_1.getObject(item, container));
                        break;
                    default:
                        if (!ej2_base_1.isNullOrUndefined(item.click)) {
                            var proxy_1 = item;
                            var callback_1 = proxy_1.click;
                            proxy_1.click = function () {
                                if (proxy_1.undo && _this.parent.formatter.getUndoRedoStack().length === 0) {
                                    _this.parent.formatter.saveData();
                                }
                                callback_1.call(_this);
                                if (_this.parent.formatter.getUndoRedoStack().length > 0) {
                                    var currentContentElem = _this.parent.createElement('div');
                                    var stackItem = _this.parent.formatter.
                                        getUndoRedoStack()[_this.parent.formatter.getUndoRedoStack().length - 1];
                                    var clonedItem = (stackItem.text).cloneNode(true);
                                    currentContentElem.appendChild(clonedItem);
                                    if (currentContentElem.innerHTML.trim() === _this.parent.inputElement.innerHTML.trim()) {
                                        return;
                                    }
                                }
                                if (proxy_1.undo) {
                                    _this.parent.formatter.saveData();
                                }
                            };
                        }
                        items.push(item);
                }
            };
            var this_1 = this;
            for (var _i = 0, tbItems_1 = tbItems; _i < tbItems_1.length; _i++) {
                var item = tbItems_1[_i];
                _loop_1(item);
            }
            if (this.parent.showTooltip) {
                for (var num = 0; num < items.length; num++) {
                    var tooltipText = items[num].tooltipText;
                    var shortCutKey = void 0;
                    var isMacDev = window.navigator.platform.toLocaleLowerCase().includes('mac');
                    if (items_1.windowKeys["" + tooltipText] && (!ej2_base_1.isNullOrUndefined(items[num].id) || !ej2_base_1.isNullOrUndefined(items[num].cssClass))) {
                        shortCutKey = isMacDev ? items_1.windowKeys["" + tooltipText].replace('Ctrl+', '⌘').replace('Shift+', '⇧').replace('Alt+', '⌥') : items_1.windowKeys["" + tooltipText];
                    }
                    else {
                        shortCutKey = tooltipText;
                    }
                    if (shortCutKey) {
                        if (!(items[num].command === 'Images' && items[num].subCommand === 'InsertLink')) {
                            items[num].tooltipText = (tooltipText !== shortCutKey) ? tooltipText + ' (' + shortCutKey + ')' : tooltipText;
                        }
                    }
                }
            }
            return items;
        };
        BaseToolbar.prototype.getToolbarOptions = function (args) {
            return {
                target: args.target,
                rteToolbarObj: this,
                items: this.getItems(args.items, args.container),
                overflowMode: args.mode,
                enablePersistence: this.parent.enablePersistence,
                enableRtl: this.parent.enableRtl,
                cssClass: args.cssClass,
                type: args.container
            };
        };
        BaseToolbar.prototype.render = function (args) {
            this.toolbarRenderer = this.renderFactory.getRenderer(enum_1.RenderType.Toolbar);
            if (this.toolbarRenderer && this.toolbarRenderer.isDestroyed) {
                this.toolbarRenderer = new renderer_1.ToolbarRenderer(this.parent, this.locator);
            }
            this.toolbarRenderer.renderToolbar(this.getToolbarOptions(args));
        };
        BaseToolbar.prototype.destroy = function () {
            if (this.isDestroyed) {
                return;
            }
            this.removeEventListener();
            if (this.toolbarObj && !this.toolbarObj.isDestroyed) {
                this.toolbarObj.destroy();
                this.toolbarObj = null;
            }
            this.toolbarRenderer.destroy();
            this.toolbarRenderer = null;
            this.tools = {};
            this.isDestroyed = true;
        };
        return BaseToolbar;
    }());
    exports.BaseToolbar = BaseToolbar;
});