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

94.52% Statements 345/365
86.55% Branches 193/223
100% Functions 47/47
94.49% Lines 343/363
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 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405 406 407 408 409 410 411 412 413 414 415 416 417 418 419 420 421 422 423 424 425 426 427 428 429 430 431 432 433 434 435 436 437 438 439 440 441 442 443 444 445 446 447 448 449 450 451 452 453 454 455 456 457 458 459 460 461 462 463 464 465 466 467 468 469 470 471 472 473 474 475 476 477 478 479 480 481 482 483 484 485 486 487 488 489 490 491 492 493 494 495 496 497 498 499 500 501 502 503 504 505 506 507 508 509 510 511 512 513 514 515 516 517 518 519 520 521 522 523 524 525 526 527 528 529 530 531 532 533 534 535 536 537 538 539 540 541 542 543 544 545 546 547 548 549 550 551 552 553 554 555 556 557 558 559 560 561 562 563 564 565 566 567   2517× 2517× 2517× 2517× 2517× 2517× 2517× 2517× 2517× 2517× 2517× 2517×     2515×     2530× 2530× 2530×   2511× 2423×                                                 2530× 2530×       2530× 2439×         2439× 2439× 145×     2294×       91×     85×         2404× 2404×   2395× 2395×         2404× 19×   2404×   2530× 2480×   50× 50× 50×         50×             50× 50× 50× 15×     35×     50× 50×         50×     50×   2378× 2378× 2378× 60×           2380× 2380× 2379× 2379×         2530× 2530× 2530× 50×   2480× 76×     2404×             2404×           2404× 2404× 2378× 2378×   2404× 2404× 2395×       2480× 2480× 67×   2480× 2404×         2404× 2404×   2480×           83×     11× 11×         140× 140× 140× 43×     140× 140× 140× 117× 117× 117× 117× 117× 117× 117×     23×     3346× 105×   3241×             3241×   18×     5851×   25×   5763× 5763× 5763× 5763×     5761× 5761×   5763× 39302× 39302× 39302×     5763× 5592×             25× 25× 24× 24×             24×     25×   97×   59125×   2500× 2500× 2500× 31×     5046×   2529× 2529× 2529× 2529× 2529× 2433×   2529× 2529× 2529× 2529× 2423× 2423×   2529× 2529× 2529× 2529× 2529× 2529× 2529× 2436×   2529× 2485×       5000× 2483×   2517× 2517×   2517× 2517× 2517× 2517× 2517× 2517× 2517× 2517× 2517× 2517× 2517× 2517× 2517× 2517× 2517× 2517× 2517×   611× 11×     107×         341×   1139× 1139× 1139× 945× 945× 173× 173×               2530×   2521×   2529×   2536×     2536× 2536× 2536× 2536× 2536× 2536× 2536× 2536× 2536× 2536× 2536× 2536× 2536× 2536× 2536× 2536× 2536×   2529× 2529× 2529× 2529× 2529× 2529× 2529× 2529× 2529× 2529× 2529× 2529× 2529× 2529×   2526×                 60× 55×   60×   242×         242× 13×     242× 229×   13×   19×   19× 19× 19× 12×   19× 19×     19× 19× 19× 19× 19× 15×   19×     46012×   2454×        
define(["require", "exports", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "../base/constant", "../base/classes", "../base/enum", "../base/util", "../../common/util", "../base/util", "../models/items", "./base-toolbar", "./dropdown-buttons", "./toolbar-action", "./color-picker", "../../common/enum"], function (require, exports, ej2_base_1, ej2_base_2, ej2_base_3, events, classes, enum_1, util_1, util_2, util_3, model, base_toolbar_1, dropdown_buttons_1, toolbar_action_1, color_picker_1, enum_2) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var Toolbar = (function () {
        function Toolbar(parent, serviceLocator) {
            this.tools = {};
            this.parent = parent;
            this.isDestroyed = false;
            this.isToolbar = false;
            this.locator = serviceLocator;
            this.isTransformChild = false;
            this.renderFactory = this.locator.getService('rendererFactory');
            model.updateDropDownLocale(this.parent);
            util_3.updateDropDownFontFormatLocale(this.parent);
            this.baseToolbar = new base_toolbar_1.BaseToolbar(this.parent, this.locator);
            this.addEventListener();
            if (this.parent.toolbarSettings && Object.keys(this.parent.toolbarSettings.itemConfigs).length > 0) {
                ej2_base_3.extend(this.tools, model.tools, util_1.toObjectLowerCase(this.parent.toolbarSettings.itemConfigs), true);
            }
            else {
                this.tools = model.tools;
            }
        }
        Toolbar.prototype.initializeInstance = function () {
            this.contentRenderer = this.renderFactory.getRenderer(enum_1.RenderType.Content);
            this.editableElement = this.contentRenderer.getEditPanel();
            this.editPanel = this.contentRenderer.getPanel();
        };
        Toolbar.prototype.toolbarBindEvent = function () {
            if (!this.parent.inlineMode.enable && this.getToolbarElement()) {
                this.keyBoardModule = new ej2_base_1.KeyboardEvents(this.getToolbarElement(), {
                    keyAction: this.toolBarKeyDown.bind(this), keyConfigs: this.parent.formatter.keyConfig, eventName: 'keydown'
                });
            }
        };
        Toolbar.prototype.toolBarKeyDown = function (e) {
            var target;
            switch (e.action) {
                case 'escape':
                    this.parent.contentModule.getEditPanel().focus();
                    break;
                case 'enter':
                    target = e.target;
                    Eif (!ej2_base_2.isNullOrUndefined(target)) {
                        var targetEle = target.nodeName === 'BUTTON' ?
                            target.closest('.e-split-btn-wrapper.e-rte-dropdown') : target;
                        if (targetEle) {
                            var hasFontColor = targetEle.querySelector('.e-rte-font-colorpicker');
                            if (hasFontColor || targetEle.querySelector('.e-rte-background-colorpicker')) {
                                this.parent.notify(events.showColorPicker, {
                                    toolbarClick: hasFontColor ?
                                        'fontcolor' : 'backgroundcolor'
                                });
                                return;
                            }
                            var hasNumberList = targetEle.querySelector('.e-rte-numberformatlist-dropdown');
                            Eif (hasNumberList || targetEle.querySelector('.e-rte-bulletformatlist-dropdown')) {
                                this.parent.notify(events.showDropDown, {
                                    toolbarClick: hasNumberList ?
                                        'NumberFormatList' : 'BulletFormaList'
                                });
                                return;
                            }
                            var codeBlockToolbarItem = targetEle.querySelector('.e-rte-codeblock-dropdown');
                            if (codeBlockToolbarItem) {
                                this.parent.notify(events.showDropDown, { toolbarClick: 'CodeBlock' });
                                return;
                            }
                        }
                    }
            }
        };
        Toolbar.prototype.createToolbarElement = function () {
            this.tbElement = this.parent.createElement('div', { id: this.parent.getID() + '_toolbar' });
            Iif (!ej2_base_1.Browser.isDevice && this.parent.inlineMode.enable && util_2.isIDevice()) {
                return;
            }
            else {
                if (!this.parent.inlineMode.enable) {
                    this.tbWrapper = this.parent.createElement('div', {
                        id: this.parent.getID() + '_toolbar_wrapper',
                        innerHTML: this.tbElement.outerHTML,
                        className: classes.CLS_TB_WRAP
                    });
                    this.tbElement = this.tbWrapper.firstElementChild;
                    if (this.parent.iframeSettings.enable) {
                        this.parent.rootContainer.prepend(this.tbWrapper);
                    }
                    else {
                        this.parent.rootContainer.insertBefore(this.tbWrapper, this.editPanel);
                    }
                }
                else {
                    if (this.parent.iframeSettings.enable) {
                        this.parent.rootContainer.prepend(this.tbElement);
                    }
                    else {
                        this.parent.rootContainer.insertBefore(this.tbElement, this.editPanel);
                    }
                }
            }
        };
        Toolbar.prototype.getToolbarMode = function () {
            var tbMode;
            switch (this.parent.toolbarSettings.type) {
                case enum_2.ToolbarType.Expand:
                    tbMode = 'Extended';
                    break;
                case enum_2.ToolbarType.Scrollable:
                    tbMode = 'Scrollable';
                    break;
                case enum_2.ToolbarType.Popup:
                    tbMode = 'Popup';
                    break;
                default:
                    tbMode = 'MultiRow';
            }
            if (util_2.isIDevice() && this.parent.toolbarSettings.type === enum_2.ToolbarType.Expand) {
                tbMode = enum_2.ToolbarType.Scrollable;
            }
            return tbMode;
        };
        Toolbar.prototype.checkToolbarResponsive = function (ele) {
            if (!ej2_base_1.Browser.isDevice || util_2.isIDevice()) {
                return false;
            }
            var tBarMode;
            Eif (this.parent.toolbarSettings.type === enum_2.ToolbarType.Expand) {
                tBarMode = enum_2.ToolbarType.MultiRow;
            }
            else {
                tBarMode = this.parent.toolbarSettings.type;
            }
            this.baseToolbar.render({
                container: ((this.parent.inlineMode.enable) ? 'quick' : 'toolbar'),
                items: this.parent.toolbarSettings.items,
                mode: tBarMode,
                target: ele,
                cssClass: this.parent.getCssClass()
            });
            Eif (this.parent.toolbarSettings.type === enum_2.ToolbarType.Expand) {
                ej2_base_1.addClass([ele], ['e-rte-tb-mobile']);
                if (this.parent.inlineMode.enable) {
                    this.addFixedTBarClass();
                }
                else {
                    ej2_base_1.addClass([ele], [classes.CLS_TB_STATIC]);
                }
            }
            this.wireEvents();
            this.dropDownModule.renderDropDowns({
                container: ele,
                containerType: ((this.parent.inlineMode.enable) ? 'quick' : 'toolbar'),
                items: this.parent.toolbarSettings.items
            });
            this.renderColorPicker({
                container: this.tbElement, containerType: ((this.parent.inlineMode.enable) ? 'quick' : 'toolbar'), items: this.parent.toolbarSettings.items
            });
            return true;
        };
        Toolbar.prototype.checkIsTransformChild = function () {
            this.isTransformChild = false;
            var transformElements = ej2_base_1.selectAll('[style*="transform"]', document);
            for (var i = 0; i < transformElements.length; i++) {
                Iif (!ej2_base_2.isNullOrUndefined(transformElements[i].contains) && transformElements[i].contains(this.parent.element)) {
                    this.isTransformChild = true;
                    break;
                }
            }
        };
        Toolbar.prototype.toggleFloatClass = function () {
            var floatOffset = this.parent.floatingToolbarOffset;
            if (this.parent.toolbarSettings.enableFloating) {
                ej2_base_1.addClass([this.tbElement.parentElement], [classes.CLS_TB_FLOAT]);
                ej2_base_3.setStyleAttribute(this.tbElement.parentElement, { top: (floatOffset) + 'px' });
            }
            else {
                ej2_base_1.removeClass([this.tbElement.parentElement], [classes.CLS_TB_FLOAT]);
                ej2_base_3.setStyleAttribute(this.tbElement.parentElement, { top: '' });
            }
        };
        Toolbar.prototype.renderToolbar = function () {
            this.initializeInstance();
            this.createToolbarElement();
            if (this.checkToolbarResponsive(this.tbElement)) {
                return;
            }
            if (this.parent.inlineMode.enable) {
                this.parent.notify(events.renderInlineToolbar, {});
            }
            else {
                this.baseToolbar.render({
                    container: 'toolbar',
                    items: this.parent.toolbarSettings.items,
                    mode: this.getToolbarMode(),
                    target: this.tbElement,
                    cssClass: this.parent.getCssClass()
                });
                if (this.parent.element.classList.contains('e-rte-full-screen')) {
                    this.updateItem({
                        targetItem: 'Maximize',
                        updateItem: 'Minimize',
                        baseToolbar: this.parent.getBaseToolbarObject()
                    });
                }
                Eif (!this.parent.inlineMode.enable) {
                    if (this.parent.toolbarSettings.enableFloating) {
                        this.checkIsTransformChild();
                        this.toggleFloatClass();
                    }
                    ej2_base_1.addClass([this.parent.element], [classes.CLS_RTE_TB_ENABLED]);
                    if (this.parent.toolbarSettings.type === enum_2.ToolbarType.Expand) {
                        ej2_base_1.addClass([this.parent.element], [classes.CLS_RTE_EXPAND_TB]);
                    }
                }
            }
            this.wireEvents();
            if (this.parent.inlineMode.enable && !util_2.isIDevice()) {
                this.addFixedTBarClass();
            }
            if (!this.parent.inlineMode.enable) {
                this.dropDownModule.renderDropDowns({
                    container: this.tbElement,
                    containerType: 'toolbar',
                    items: this.parent.toolbarSettings.items
                });
                this.renderColorPicker({ container: this.tbElement, containerType: 'toolbar', items: this.parent.toolbarSettings.items });
                this.refreshToolbarOverflow();
            }
            if (this.parent.rootContainer && this.parent.rootContainer.classList.contains('e-source-code-enabled')) {
                this.parent.notify(events.updateToolbarItem, {
                    targetItem: 'SourceCode', updateItem: 'Preview',
                    baseToolbar: this.parent.getBaseToolbarObject()
                });
                this.parent.disableToolbarItem(this.parent.toolbarSettings.items);
            }
        };
        Toolbar.prototype.addFixedTBarClass = function () {
            ej2_base_1.addClass([this.tbElement], [classes.CLS_TB_FIXED]);
        };
        Toolbar.prototype.removeFixedTBarClass = function () {
            ej2_base_1.removeClass([this.tbElement], [classes.CLS_TB_FIXED]);
        };
        Toolbar.prototype.showFixedTBar = function () {
            ej2_base_1.addClass([this.tbElement], [classes.CLS_SHOW]);
            Iif (ej2_base_1.Browser.isIos) {
                ej2_base_1.addClass([this.tbElement], [classes.CLS_TB_IOS_FIX]);
            }
        };
        Toolbar.prototype.hideFixedTBar = function () {
            (!this.isToolbar) ? ej2_base_1.removeClass([this.tbElement], [classes.CLS_SHOW, classes.CLS_TB_IOS_FIX]) : this.isToolbar = false;
        };
        Toolbar.prototype.updateItem = function (args) {
            var item = this.tools[args.updateItem.toLocaleLowerCase()];
            Eif (this.parent.enabled) {
                if ((util_1.getTooltipText(args.updateItem.toLocaleLowerCase(), this.locator) !== 'Code View' && util_1.getTooltipText(args.updateItem.toLocaleLowerCase(), this.locator) !== 'Preview') || this.parent.locale !== 'en-US') {
                    item.tooltip = util_1.getTooltipText(args.updateItem.toLocaleLowerCase(), this.locator);
                }
            }
            var trgItem = this.tools[args.targetItem.toLocaleLowerCase()];
            var index = util_1.getTBarItemsIndex(util_1.getCollection(trgItem.subCommand), args.baseToolbar.toolbarObj.items)[0];
            if (!ej2_base_2.isNullOrUndefined(index)) {
                var prefixId = this.parent.inlineMode.enable ? '_quick_' : '_toolbar_';
                args.baseToolbar.toolbarObj.items[index].id = this.parent.getID() + prefixId + item.id;
                args.baseToolbar.toolbarObj.items[index].prefixIcon = item.icon;
                args.baseToolbar.toolbarObj.items[index].tooltipText = item.tooltip;
                args.baseToolbar.toolbarObj.items[index].subCommand = item.subCommand;
                args.baseToolbar.toolbarObj.dataBind();
                args.baseToolbar.toolbarObj.refreshOverflow();
            }
            else {
                this.addTBarItem(args, 0);
            }
        };
        Toolbar.prototype.updateToolbarStatus = function (args) {
            if (!this.tbElement || (this.parent.inlineMode.enable && (util_2.isIDevice() || !ej2_base_1.Browser.isDevice))) {
                return;
            }
            var options = {
                args: args,
                dropDownModule: this.dropDownModule,
                parent: this.parent,
                tbElements: ej2_base_1.selectAll('.' + classes.CLS_TB_ITEM, this.tbElement),
                tbItems: this.baseToolbar.toolbarObj.items
            };
            util_1.setToolbarStatus(options, (this.parent.inlineMode.enable ? true : false), this.parent);
        };
        Toolbar.prototype.fullScreen = function (e) {
            this.parent.fullScreenModule.showFullScreen(e);
        };
        Toolbar.prototype.hideScreen = function (e) {
            this.parent.fullScreenModule.hideFullScreen(e);
        };
        Toolbar.prototype.getBaseToolbar = function () {
            return this.baseToolbar;
        };
        Toolbar.prototype.addTBarItem = function (args, index) {
            args.baseToolbar.toolbarObj.addItems([args.baseToolbar.getObject(args.updateItem, 'toolbar')], index);
        };
        Toolbar.prototype.enableTBarItems = function (baseToolbar, items, isEnable, muteToolbarUpdate) {
            var filterItems;
            var trgItems;
            var baseToolbaritems;
            if (this.parent.toolbarSettings.type === 'Popup' && typeof (items) != 'string') {
                filterItems = items.filter(function (item) { return item !== '|'; });
                baseToolbaritems = baseToolbar.toolbarObj.items.filter(function (item) { return item.type !== 'Separator'; });
                trgItems = util_1.getTBarItemsIndex(util_1.getCollection(filterItems), baseToolbaritems);
                this.tbItems = ej2_base_1.selectAll('.' + classes.CLS_TB_ITEM + ':not(.e-separator)', baseToolbar.toolbarObj.element);
            }
            else {
                trgItems = util_1.getTBarItemsIndex(util_1.getCollection(items), baseToolbar.toolbarObj.items);
                this.tbItems = ej2_base_1.selectAll('.' + classes.CLS_TB_ITEM, baseToolbar.toolbarObj.element);
            }
            for (var i = 0; i < trgItems.length; i++) {
                var item = this.tbItems[trgItems[i]];
                Eif (item) {
                    baseToolbar.toolbarObj.enableItems(item, isEnable);
                }
            }
            if (!ej2_base_1.select('.' + classes.CLS_RTE_SOURCE_CODE_TXTAREA, this.parent.element) && !muteToolbarUpdate) {
                util_1.updateUndoRedoStatus(baseToolbar, this.parent.formatter.editorManager.undoRedoManager.getUndoStatus());
            }
        };
        Toolbar.prototype.removeTBarItems = function (items) {
            if (ej2_base_2.isNullOrUndefined(this.baseToolbar.toolbarObj)) {
                this.baseToolbar = this.parent.getBaseToolbarObject();
            }
            var trgItems = util_1.getTBarItemsIndex(util_1.getCollection(items), this.baseToolbar.toolbarObj.items);
            this.tbItems = (this.parent.inlineMode.enable) ? ej2_base_1.selectAll('.' + classes.CLS_TB_ITEM, this.baseToolbar.toolbarObj.element)
                : ej2_base_1.selectAll('.' + classes.CLS_TB_ITEM, this.parent.element);
            for (var i = 0; i < trgItems.length; i++) {
                this.baseToolbar.toolbarObj.removeItems(this.tbItems[trgItems[i]]);
            }
        };
        Toolbar.prototype.getExpandTBarPopHeight = function () {
            var popHeight = 0;
            if (this.parent.toolbarSettings.type === enum_2.ToolbarType.Expand && this.tbElement.classList.contains('e-extended-toolbar')) {
                var expandPopup = ej2_base_1.select('.e-toolbar-extended', this.tbElement);
                Iif (expandPopup && this.tbElement.classList.contains('e-expand-open')
                    || expandPopup && expandPopup.classList.contains('e-popup-open')) {
                    ej2_base_1.addClass([expandPopup], [classes.CLS_VISIBLE]);
                    popHeight = popHeight + expandPopup.offsetHeight;
                    ej2_base_1.removeClass([expandPopup], [classes.CLS_VISIBLE]);
                }
                else {
                    ej2_base_1.removeClass([this.tbElement], [classes.CLS_EXPAND_OPEN]);
                }
            }
            return popHeight;
        };
        Toolbar.prototype.getToolbarHeight = function () {
            return this.tbElement.offsetHeight;
        };
        Toolbar.prototype.getToolbarElement = function () {
            return this.parent && this.parent.element ? ej2_base_1.select('.' + classes.CLS_TOOLBAR, this.parent.element) : null;
        };
        Toolbar.prototype.refreshToolbarOverflow = function () {
            this.parent.element.classList.remove(classes.CLS_RTL);
            this.baseToolbar.toolbarObj.refreshOverflow();
            if (this.parent.enableRtl) {
                this.parent.element.classList.add(classes.CLS_RTL);
            }
        };
        Toolbar.prototype.isToolbarDestroyed = function () {
            return this.baseToolbar && this.baseToolbar.toolbarObj && this.baseToolbar.toolbarObj.isDestroyed ? true : false;
        };
        Toolbar.prototype.destroyToolbar = function () {
            Eif (!this.isToolbarDestroyed()) {
                this.parent.unWireScrollElementsEvents();
                this.unWireEvents();
                this.dropDownModule.destroy();
                if (this.parent.emojiPickerModule && !this.parent.emojiPickerModule.isPopupDestroyed) {
                    this.parent.emojiPickerModule.childDestroy();
                }
                this.dropDownModule = null;
                this.colorPickerModule.destroy();
                this.colorPickerModule = null;
                if (this.keyBoardModule) {
                    this.keyBoardModule.destroy();
                    this.keyBoardModule = null;
                }
                this.baseToolbar.destroy();
                this.removeEventListener();
                ej2_base_1.removeClass([this.parent.element], [classes.CLS_RTE_TB_ENABLED]);
                ej2_base_1.removeClass([this.parent.element], [classes.CLS_RTE_EXPAND_TB]);
                var tbWrapper = ej2_base_1.select('.' + classes.CLS_TB_WRAP, this.parent.element);
                var tbElement = ej2_base_1.select('.' + classes.CLS_TOOLBAR, this.parent.element);
                if (!ej2_base_2.isNullOrUndefined(tbWrapper)) {
                    ej2_base_1.detach(tbWrapper);
                }
                if (!ej2_base_2.isNullOrUndefined(tbElement)) {
                    ej2_base_1.detach(tbElement);
                }
            }
        };
        Toolbar.prototype.destroy = function () {
            if (this.isDestroyed) {
                return;
            }
            Eif (!this.isToolbarDestroyed()) {
                this.destroyToolbar();
            }
            this.toolbarObj = null;
            this.editPanel = null;
            this.isToolbar = null;
            this.editableElement = null;
            this.tbItems = null;
            this.baseToolbar = null;
            this.tbElement = null;
            this.tbWrapper = null;
            this.isTransformChild = null;
            this.contentRenderer = null;
            this.dropDownModule = null;
            this.colorPickerModule = null;
            this.toolbarActionModule = null;
            this.tools = null;
            this.locator = null;
            this.renderFactory = null;
            this.isDestroyed = true;
        };
        Toolbar.prototype.mouseDownHandler = function () {
            if (ej2_base_1.Browser.isDevice && this.parent.inlineMode.enable && !util_2.isIDevice()) {
                this.showFixedTBar();
            }
        };
        Toolbar.prototype.focusChangeHandler = function () {
            Iif (ej2_base_1.Browser.isDevice && this.parent.inlineMode.enable && !util_2.isIDevice()) {
                this.isToolbar = false;
                this.hideFixedTBar();
            }
        };
        Toolbar.prototype.dropDownBeforeOpenHandler = function () {
            this.isToolbar = true;
        };
        Toolbar.prototype.tbFocusHandler = function (e) {
            var activeElm = document.activeElement;
            var isToolbaractive = ej2_base_2.closest(activeElm, '.e-rte-toolbar');
            if (activeElm === this.parent.getToolbarElement() || isToolbaractive === this.parent.getToolbarElement()) {
                var toolbarItem = this.parent.getToolbarElement().querySelectorAll('.e-expended-nav');
                for (var i = 0; i < toolbarItem.length; i++) {
                    Eif (ej2_base_2.isNullOrUndefined(this.parent.getToolbarElement().querySelector('.e-insert-table-btn'))) {
                        toolbarItem[i].setAttribute('tabindex', '0');
                    }
                    else {
                        toolbarItem[i].setAttribute('tabindex', '1');
                    }
                }
            }
        };
        Toolbar.prototype.wireEvents = function () {
            if (this.parent.inlineMode.enable && util_2.isIDevice()) {
                return;
            }
            ej2_base_1.EventHandler.add(this.tbElement, 'focusin', this.tbFocusHandler, this);
        };
        Toolbar.prototype.unWireEvents = function () {
            ej2_base_1.EventHandler.remove(this.tbElement, 'focusin', this.tbFocusHandler);
        };
        Toolbar.prototype.addEventListener = function () {
            Iif (this.parent.isDestroyed) {
                return;
            }
            this.dropDownModule = new dropdown_buttons_1.DropDownButtons(this.parent, this.locator);
            this.toolbarActionModule = new toolbar_action_1.ToolbarAction(this.parent);
            this.colorPickerModule = new color_picker_1.ColorPickerInput(this.parent, this.locator);
            this.parent.on(events.initialEnd, this.renderToolbar, this);
            this.parent.on(events.bindOnEnd, this.toolbarBindEvent, this);
            this.parent.on(events.toolbarUpdated, this.updateToolbarStatus, this);
            this.parent.on(events.modelChanged, this.onPropertyChanged, this);
            this.parent.on(events.refreshBegin, this.onRefresh, this);
            this.parent.on(events.destroy, this.destroy, this);
            this.parent.on(events.enableFullScreen, this.fullScreen, this);
            this.parent.on(events.disableFullScreen, this.hideScreen, this);
            this.parent.on(events.updateToolbarItem, this.updateItem, this);
            this.parent.on(events.beforeDropDownOpen, this.dropDownBeforeOpenHandler, this);
            this.parent.on(events.focusChange, this.focusChangeHandler, this);
            this.parent.on(events.mouseDown, this.mouseDownHandler, this);
            this.parent.on(events.sourceCodeMouseDown, this.mouseDownHandler, this);
            this.parent.on(events.bindCssClass, this.setCssClass, this);
        };
        Toolbar.prototype.removeEventListener = function () {
            this.parent.off(events.initialEnd, this.renderToolbar);
            this.parent.off(events.bindOnEnd, this.toolbarBindEvent);
            this.parent.off(events.toolbarUpdated, this.updateToolbarStatus);
            this.parent.off(events.modelChanged, this.onPropertyChanged);
            this.parent.off(events.refreshBegin, this.onRefresh);
            this.parent.off(events.destroy, this.destroy);
            this.parent.off(events.enableFullScreen, this.parent.fullScreenModule.showFullScreen);
            this.parent.off(events.disableFullScreen, this.parent.fullScreenModule.hideFullScreen);
            this.parent.off(events.updateToolbarItem, this.updateItem);
            this.parent.off(events.beforeDropDownOpen, this.dropDownBeforeOpenHandler);
            this.parent.off(events.focusChange, this.focusChangeHandler);
            this.parent.off(events.mouseDown, this.mouseDownHandler);
            this.parent.off(events.sourceCodeMouseDown, this.mouseDownHandler);
            this.parent.off(events.bindCssClass, this.setCssClass);
        };
        Toolbar.prototype.setCssClass = function (e) {
            Iif (this.toolbarObj && e.cssClass) {
                if (ej2_base_2.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() });
                }
            }
        };
        Toolbar.prototype.onRefresh = function () {
            if (!this.parent.inlineMode.enable) {
                this.refreshToolbarOverflow();
            }
            this.parent.autoResize();
        };
        Toolbar.prototype.onPropertyChanged = function (e) {
            if (!ej2_base_2.isNullOrUndefined(e.newProp.inlineMode)) {
                for (var _i = 0, _a = Object.keys(e.newProp.inlineMode); _i < _a.length; _i++) {
                    var prop = _a[_i];
                    switch (prop) {
                        case 'enable':
                            this.refreshToolbar();
                            break;
                    }
                }
            }
            if (!ej2_base_2.isNullOrUndefined(e.newProp.toolbarSettings)) {
                if (!ej2_base_2.isNullOrUndefined(e.newProp.toolbarSettings.enableFloating)) {
                    this.toggleFloatClass();
                }
            }
            if (e.module !== this.getModuleName()) {
                return;
            }
            this.refreshToolbar();
        };
        Toolbar.prototype.refreshToolbar = function () {
            if (ej2_base_2.isNullOrUndefined(this.baseToolbar.toolbarObj)) {
                this.baseToolbar = this.parent.getBaseToolbarObject();
            }
            var tbWrapper = ej2_base_1.select('.' + classes.CLS_TB_WRAP, this.parent.element);
            var tbElement = ej2_base_1.select('.' + classes.CLS_TOOLBAR, this.parent.element);
            if (tbElement || tbWrapper) {
                this.destroyToolbar();
            }
            Eif (this.parent.toolbarSettings.enable) {
                Iif (this.baseToolbar && this.baseToolbar.toolbarObj && !this.baseToolbar.toolbarObj.isDestroyed) {
                    this.baseToolbar.destroy();
                }
                this.baseToolbar = new base_toolbar_1.BaseToolbar(this.parent, this.locator);
                this.addEventListener();
                this.renderToolbar();
                this.parent.wireScrollElementsEvents();
                if (!ej2_base_1.select('.' + classes.CLS_RTE_SOURCE_CODE_TXTAREA, this.parent.element) && !this.parent.inlineMode.enable) {
                    util_1.updateUndoRedoStatus(this.baseToolbar, this.parent.formatter.editorManager.undoRedoManager.getUndoStatus());
                }
                this.parent.notify(events.dynamicModule, {});
            }
        };
        Toolbar.prototype.getModuleName = function () {
            return 'toolbar';
        };
        Toolbar.prototype.renderColorPicker = function (args) {
            this.colorPickerModule.renderColorPickerInput(args);
        };
        return Toolbar;
    }());
    exports.Toolbar = Toolbar;
});