all files / document-editor-container/ribbon/ ribbon.js

91.46% Statements 150/164
72.22% Branches 52/72
96.88% Functions 31/32
91.46% Lines 150/164
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   14× 14× 14× 14×     334×         41×   14× 14× 14× 14× 14×   14× 14× 14× 14×     14× 14× 14× 14×     14×   14× 14× 14× 14× 14×                     14×               14×               14×                                                                                           334×     334× 334× 334×   334× 334×   334× 40×     294×   334×               142×   33×   14×     14× 14×                 142× 142× 142× 142×   43× 43×   43× 43×     33× 33× 33× 33×     335× 335×     14× 14× 14×   14× 14× 14×   14× 14×   14× 14× 14×   14×        
define(["require", "exports", "@syncfusion/ej2-base", "@syncfusion/ej2-ribbon", "../../document-editor/base/index", "./ribbon-base/ribbon-tab-manager", "./ribbon-base/ribbon-contextual-tab-manager", "./ribbon-base/ribbon-state-manager", "./ribbon-base/ribbon-event-manager", "../helper/ribbon-helper"], function (require, exports, ej2_base_1, ej2_ribbon_1, index_1, ribbon_tab_manager_1, ribbon_contextual_tab_manager_1, ribbon_state_manager_1, ribbon_event_manager_1, ribbon_helper_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var Ribbon = (function () {
        function Ribbon(container) {
            this.numericTextBoxCollection = new index_1.Dictionary();
            this.previousContext = '';
            this.container = container;
            this.localObj = new ej2_base_1.L10n('documenteditorcontainer', this.container.defaultLocale, this.container.locale);
        }
        Object.defineProperty(Ribbon.prototype, "documentEditor", {
            get: function () {
                return this.container.documentEditor;
            },
            enumerable: true,
            configurable: true
        });
        Ribbon.prototype.getModuleName = function () {
            return 'ribbon';
        };
        Ribbon.prototype.initializeRibbon = function () {
            this.tabManager = new ribbon_tab_manager_1.RibbonTabManager(this.container, this.localObj);
            this.contextualTabManager = new ribbon_contextual_tab_manager_1.RibbonContextualTabManager(this.container);
            this.stateManager = new ribbon_state_manager_1.RibbonStateManager(this.container);
            this.eventManager = new ribbon_event_manager_1.RibbonEventManager(this, this.container);
            this.initializeInternal();
        };
        Ribbon.prototype.initializeInternal = function () {
            this.createRibbonElement();
            this.renderRibbon();
            Eif (this.tabManager.homeTab) {
                this.tabManager.homeTab.updateStyleGallery();
            }
        };
        Ribbon.prototype.createRibbonElement = function () {
            this.ribbonElement = document.createElement('div');
            this.ribbonElement.id = 'document-editor-ribbon';
            this.ribbonElement.classList.add('e-de-ribbon');
            Iif (this.container.enableRtl) {
                this.ribbonElement.classList.add('e-rtl');
            }
            this.container.ribbonContainer.appendChild(this.ribbonElement);
        };
        Ribbon.prototype.renderRibbon = function () {
            var tabs = this.tabManager.getRibbonTabs();
            var fileMenuItems = this.tabManager.getFileMenuItems();
            var contextualTabs = this.contextualTabManager.getContextualTabs();
            ej2_ribbon_1.Ribbon.Inject(ej2_ribbon_1.RibbonFileMenu, ej2_ribbon_1.RibbonColorPicker, ej2_ribbon_1.RibbonGallery, ej2_ribbon_1.RibbonContextualTab, ej2_ribbon_1.RibbonKeyTip);
            this.ribbon = new ej2_ribbon_1.Ribbon({
                tabs: tabs,
                selectedTab: 0,
                enableRtl: this.container.enableRtl,
                contextualTabs: contextualTabs,
                launcherIconClick: this.eventManager.onLauncherIconClicked.bind(this.eventManager),
                enableKeyTips: true,
                activeLayout: this.container.ribbonLayout,
                tabSelected: this.eventManager.onTabSelected.bind(this.eventManager),
                ribbonLayoutSwitched: this.eventManager.onRibbonLayoutChange.bind(this.eventManager)
            });
            Iif (this.backstageMenu) {
                ej2_ribbon_1.Ribbon.Inject(ej2_ribbon_1.RibbonBackstage);
                this.ribbon.backStageMenu = this.backstageMenu;
                this.ribbon.fileMenu = {
                    visible: false
                };
            }
            else {
                this.ribbon.fileMenu = {
                    text: this.localObj.getConstant('File'),
                    menuItems: fileMenuItems,
                    keyTip: 'F',
                    visible: true,
                    select: this.eventManager.onFileMenuItemSelect.bind(this.eventManager)
                };
            }
            this.ribbon.appendTo(this.ribbonElement);
        };
        Ribbon.prototype.addTab = function (tab, insertBefore) {
            if (insertBefore !== undefined) {
                this.ribbon.addTab(tab, ribbon_helper_1.RibbonHelper.getTabId(insertBefore, this.container.element.id));
            }
            else {
                this.ribbon.addTab(tab);
            }
        };
        Ribbon.prototype.addItem = function (groupId, item, insertBefore) {
            if (insertBefore !== undefined) {
                if (typeof insertBefore === 'string') {
                    var collectionId = ribbon_helper_1.RibbonHelper.getCollectionIdFromItem(groupId, this.container, insertBefore);
                    this.ribbon.addItem(collectionId, item, insertBefore);
                }
                else {
                    var targetInfo = { tabId: groupId.tabId, groupIndex: groupId.index, itemIndexes: [insertBefore] };
                    var itemIds = ribbon_helper_1.RibbonHelper.getItemIdsFromGroup(targetInfo, this.container);
                    this.ribbon.addItem(ribbon_helper_1.RibbonHelper.getCollectionIdFromItem(groupId, this.container), item, itemIds[0]);
                }
            }
            else {
                this.ribbon.addItem(ribbon_helper_1.RibbonHelper.getCollectionIdFromItem(groupId, this.container), item);
            }
        };
        Ribbon.prototype.addGroup = function (tabId, group, insertBefore) {
            if (insertBefore !== undefined) {
                this.ribbon.addGroup(ribbon_helper_1.RibbonHelper.getTabId(tabId, this.container.element.id), group, ribbon_helper_1.RibbonHelper.getGroupId({ tabId: tabId, index: insertBefore }, this.ribbon.tabs, this.container.element.id));
            }
            else {
                this.ribbon.addGroup(ribbon_helper_1.RibbonHelper.getTabId(tabId, this.container.element.id), group);
            }
        };
        Ribbon.prototype.showTab = function (tabId, show) {
            var ribbonTabId = ribbon_helper_1.RibbonHelper.getTabId(tabId, this.container.element.id);
            Iif (ribbonTabId === '') {
                return;
            }
            if (show) {
                this.ribbon.showTab(ribbonTabId);
            }
            else {
                this.ribbon.hideTab(ribbonTabId);
            }
        };
        Ribbon.prototype.showGroup = function (groupId, show) {
            var ribbonGroupId = ribbon_helper_1.RibbonHelper.getGroupId(groupId, this.ribbon.tabs, this.container.element.id);
            if (ribbonGroupId === '') {
                return;
            }
            if (show) {
                this.ribbon.showGroup(ribbonGroupId);
            }
            else {
                this.ribbon.hideGroup(ribbonGroupId);
            }
        };
        Ribbon.prototype.showItems = function (itemId, show) {
            if (typeof itemId === 'string') {
                this.showItemInternal(itemId, show);
            }
            else {
                var itemIds = ribbon_helper_1.RibbonHelper.getItemIdsFromGroup(itemId, this.container);
                for (var _i = 0, itemIds_1 = itemIds; _i < itemIds_1.length; _i++) {
                    var id = itemIds_1[_i];
                    this.showItemInternal(id, show);
                }
            }
        };
        Ribbon.prototype.showItemInternal = function (itemId, show) {
            if (show) {
                this.ribbon.showItem(itemId);
            }
            else {
                this.ribbon.hideItem(itemId);
            }
        };
        Ribbon.prototype.enableItems = function (itemId, enable) {
            if (typeof itemId === 'string') {
                this.enableItemInternal(itemId, enable);
            }
            else {
                var itemIds = ribbon_helper_1.RibbonHelper.getItemIdsFromGroup(itemId, this.container);
                for (var _i = 0, itemIds_2 = itemIds; _i < itemIds_2.length; _i++) {
                    var id = itemIds_2[_i];
                    this.enableItemInternal(id, enable);
                }
            }
        };
        Ribbon.prototype.enableItemInternal = function (itemId, enable) {
            if (enable) {
                this.ribbon.enableItem(itemId);
            }
            else {
                this.ribbon.disableItem(itemId);
            }
        };
        Ribbon.prototype.updateRibbonState = function () {
            Iif (!this.ribbon) {
                return;
            }
            this.stateManager.updateRibbonState(this.ribbon);
            this.updateContextualTab();
            this.tabManager.updateAllTabs();
        };
        Ribbon.prototype.updateContextualTab = function () {
            var currentContext = this.documentEditor.selectionModule.contextType;
            var isInHeaderFooter = currentContext.indexOf('Header') >= 0
                || currentContext.indexOf('Footer') >= 0;
            if (isInHeaderFooter || currentContext.indexOf('Image') >= 0 || currentContext.indexOf('Table') >= 0 && currentContext.indexOf('TableOfContents') === -1) {
                this.contextualTabManager.updateContextualTabs(this.ribbon);
            }
            else {
                this.contextualTabManager.hideContextualTab(this.ribbon);
            }
            this.previousContext = currentContext;
        };
        Ribbon.prototype.onZoomFactorChange = function () {
            this.tabManager.viewTab.zoomGroup.updateZoomButtonState();
        };
        Ribbon.prototype.refresh = function () {
            if (this.ribbon) {
                this.ribbon.refresh();
                this.updateRibbonState();
            }
        };
        Ribbon.prototype.onContentChange = function () {
            this.onRibbonContentChange();
        };
        Ribbon.prototype.onDocumentChange = function () {
            this.onRibbonDocumentChange();
        };
        Ribbon.prototype.initialize = function (isToggle) {
            Iif (this.container.backstageMenu) {
                this.backstageMenu = this.container.backstageMenu;
            }
            this.initializeRibbon();
            Iif (isToggle) {
                this.container.destroyPane();
                this.updateRibbonState();
                if (this.tabManager && this.tabManager.homeTab) {
                    this.tabManager.homeTab.updateContentChanged();
                }
            }
        };
        Ribbon.prototype.restrictEditingToggleHelper = function (restrictEditing) {
            this.enableDisableRibbonItem(!restrictEditing);
        };
        Ribbon.prototype.onRibbonContentChange = function () {
            this.tabManager.homeTab.updateContentChanged();
            this.contextualTabManager.setContentChangeFlag(true);
            this.contextualTabManager.updateContextualTabs(this.ribbon);
            this.contextualTabManager.setContentChangeFlag(false);
        };
        Ribbon.prototype.enableDisableInsertComment = function (enable) {
            Eif (this.tabManager.insertTab && this.tabManager.insertTab.commentsGroup) {
                this.tabManager.insertTab.commentsGroup.enableDisableComment(enable);
            }
            Eif (this.tabManager.reviewTab && this.tabManager.reviewTab.commentsGroup) {
                this.tabManager.reviewTab.commentsGroup.enableDisableCommentGroup(enable);
            }
        };
        Ribbon.prototype.onRibbonDocumentChange = function () {
            this.tabManager.homeTab.updateContentChanged();
            this.tabManager.updateStyleGallery();
            this.contextualTabManager.setContentChangeFlag(false);
            this.contextualTabManager.updateContextualTabs(this.ribbon);
        };
        Ribbon.prototype.enableDisableRibbonItem = function (enable) {
            this.stateManager.enableDisableRibbonItem(this.ribbon, enable);
        };
        Ribbon.prototype.toggleTrackChanges = function () {
            Eif (this.tabManager.reviewTab && this.tabManager.reviewTab.trackingGroup) {
                this.tabManager.reviewTab.trackingGroup.updateSelection();
            }
        };
        Ribbon.prototype.destroy = function () {
            Eif (this.tabManager) {
                this.tabManager.destroy();
                this.tabManager = null;
            }
            Eif (this.ribbon) {
                this.ribbon.destroy();
                this.ribbon = null;
            }
            Eif (this.ribbonElement && this.ribbonElement.parentNode) {
                this.ribbonElement.parentNode.removeChild(this.ribbonElement);
            }
            Eif (this.container.ribbonContainer) {
                this.container.containerTarget.removeChild(this.container.ribbonContainer);
                this.container.ribbonContainer = undefined;
            }
            this.ribbonElement = null;
        };
        return Ribbon;
    }());
    exports.Ribbon = Ribbon;
});