diff --git a/apps/documenteditor/main/app/controller/LeftMenu.js b/apps/documenteditor/main/app/controller/LeftMenu.js index b8f6ab3ae..9eccb802c 100644 --- a/apps/documenteditor/main/app/controller/LeftMenu.js +++ b/apps/documenteditor/main/app/controller/LeftMenu.js @@ -46,7 +46,7 @@ define([ 'common/main/lib/view/SaveAsDlg', 'documenteditor/main/app/view/LeftMenu', 'documenteditor/main/app/view/FileMenu', - 'documenteditor/main/app/view/ViewTab', + 'documenteditor/main/app/view/ViewTab' ], function () { 'use strict'; diff --git a/apps/documenteditor/main/app/controller/Main.js b/apps/documenteditor/main/app/controller/Main.js index 8fddc1d40..ea7b89e84 100644 --- a/apps/documenteditor/main/app/controller/Main.js +++ b/apps/documenteditor/main/app/controller/Main.js @@ -1596,12 +1596,10 @@ define([ reviewController = application.getController('Common.Controllers.ReviewChanges'); reviewController.setMode(me.appOptions).setConfig({config: me.editorConfig}, me.api).loadDocument({doc:me.document}); - if (this.appOptions.isEdit || this.appOptions.isRestrictedEdit) { // set api events for toolbar in the Restricted Editing mode - var toolbarController = application.getController('Toolbar'); - toolbarController && toolbarController.setApi(me.api); - - if (!this.appOptions.isEdit) return; + var toolbarController = application.getController('Toolbar'); + toolbarController && toolbarController.setApi(me.api); + if (this.appOptions.isEdit) { var rightmenuController = application.getController('RightMenu'), fontsControllers = application.getController('Common.Controllers.Fonts'); fontsControllers && fontsControllers.setApi(me.api); diff --git a/apps/documenteditor/main/app/controller/Toolbar.js b/apps/documenteditor/main/app/controller/Toolbar.js index 39315b884..12b31b2b5 100644 --- a/apps/documenteditor/main/app/controller/Toolbar.js +++ b/apps/documenteditor/main/app/controller/Toolbar.js @@ -3183,11 +3183,8 @@ define([ var links = me.getApplication().getController('Links'); links.setApi(me.api).setConfig({toolbar: me}); Array.prototype.push.apply(me.toolbar.lockControls, links.getView('Links').getButtons()); - - var viewtab = me.getApplication().getController('ViewTab'); - viewtab.setApi(me.api).setConfig({toolbar: me, mode: config}); - Array.prototype.push.apply(me.toolbar.lockControls, viewtab.getView('ViewTab').getButtons()); } + if ( config.isEdit && config.canFeatureContentControl && config.canFeatureForms || config.isRestrictedEdit && config.canFillForms ) { if (config.isFormCreator) { tab = {caption: me.textTabForms, action: 'forms', dataHintTitle: 'M'}; @@ -3203,6 +3200,15 @@ define([ } } config.isEdit && config.canFeatureContentControl && me.onChangeSdtGlobalSettings(); + + tab = {caption: me.toolbar.textTabView, action: 'view', extcls: config.isEdit ? 'canedit' : '', layoutname: 'toolbar-view', dataHintTitle: 'W'}; + var viewtab = me.getApplication().getController('ViewTab'); + viewtab.setApi(me.api).setConfig({toolbar: me, mode: config}); + $panel = viewtab.createToolbarPanel(); + if ($panel) { + me.toolbar.addTab(tab, $panel, 7); + me.toolbar.setVisible('view', Common.UI.LayoutManager.isElementVisible('toolbar-view')); + } }, onAppReady: function (config) { diff --git a/apps/documenteditor/main/app/controller/ViewTab.js b/apps/documenteditor/main/app/controller/ViewTab.js index 7f138783d..eef096ce6 100644 --- a/apps/documenteditor/main/app/controller/ViewTab.js +++ b/apps/documenteditor/main/app/controller/ViewTab.js @@ -61,12 +61,15 @@ define([ Common.NotificationCenter.on('app:ready', this.onAppReady.bind(this)); Common.NotificationCenter.on('contenttheme:dark', this.onContentThemeChangedToDark.bind(this)); Common.NotificationCenter.on('uitheme:changed', this.onThemeChanged.bind(this)); + Common.NotificationCenter.on('document:ready', _.bind(this.onDocumentReady, this)); }, setApi: function (api) { if (api) { this.api = api; this.api.asc_registerCallback('asc_onZoomChange', _.bind(this.onZoomChange, this)); + this.api.asc_registerCallback('asc_onCoAuthoringDisconnect', _.bind(this.onCoAuthoringDisconnect, this)); + Common.NotificationCenter.on('api:disconnect', _.bind(this.onCoAuthoringDisconnect, this)); } return this; }, @@ -79,27 +82,6 @@ define([ mode: mode, compactToolbar: this.toolbar.toolbar.isCompactView }); - if (mode.canBrandingExt && mode.customization && mode.customization.statusBar === false || !Common.UI.LayoutManager.isElementVisible('statusBar')) { - this.view.chStatusbar.$el.remove(); - var slotChkRulers = this.view.chRulers.$el, - groupRulers = slotChkRulers.closest('.group'), - groupToolbar = this.view.chToolbar.$el.closest('.group'); - groupToolbar.find('.elset')[1].append(slotChkRulers[0]); - groupRulers.remove(); - this.view.cmpEl.find('.separator-rulers').remove(); - } - - if (!mode.isEdit) { // if view tab will be visible in view/restricted-editing mode - this.view.chToolbar.hide(); - var me = this; - Common.NotificationCenter.on('tab:visible', _.bind(function(action, visible){ - if ((action=='plugins' || action=='review' || action=='forms') && visible) { - me.view.chToolbar.show(); - } - }, this)); - - this.view.chRulers.hide(); - } this.addListeners({ 'ViewTab': { @@ -125,13 +107,17 @@ define([ this.view && this.view.SetDisabled(state); }, + createToolbarPanel: function() { + return this.view.getPanel(); + }, + getView: function(name) { return !name && this.view ? this.view : Backbone.Controller.prototype.getView.call(this, name); }, onCoAuthoringDisconnect: function() { - this.SetDisabled(true); + Common.Utils.lockControls(Common.enumLock.lostConnect, true, {array: this.view.lockedControls}); }, onAppReady: function (config) { @@ -142,6 +128,19 @@ define([ })).then(function(){ me.view.setEvents(); + if (config.canBrandingExt && config.customization && config.customization.statusBar === false || !Common.UI.LayoutManager.isElementVisible('statusBar')) { + me.view.chStatusbar.$el.remove(); + var slotChkRulers = me.view.chRulers.$el, + groupRulers = slotChkRulers.closest('.group'), + groupToolbar = me.view.chToolbar.$el.closest('.group'); + groupToolbar.find('.elset')[1].append(slotChkRulers[0]); + groupRulers.remove(); + } + + if (!config.isEdit) { // if view tab will be visible in view/restricted-editing mode + me.view.chRulers.hide(); + } + me.view.cmbZoom.on('selected', _.bind(me.onSelectedZoomValue, me)) .on('changed:before',_.bind(me.onZoomChanged, me, true)) .on('changed:after', _.bind(me.onZoomChanged, me, false)) @@ -181,6 +180,10 @@ define([ } }, + onDocumentReady: function() { + Common.Utils.lockControls(Common.enumLock.disableOnStart, false, {array: this.view.lockedControls}); + }, + onZoomChange: function (percent, type) { this.view.btnFitToPage.toggle(type == 2, true); this.view.btnFitToWidth.toggle(type == 1, true); diff --git a/apps/documenteditor/main/app/template/Toolbar.template b/apps/documenteditor/main/app/template/Toolbar.template index 32f4fe63d..9949bbeac 100644 --- a/apps/documenteditor/main/app/template/Toolbar.template +++ b/apps/documenteditor/main/app/template/Toolbar.template @@ -174,49 +174,6 @@ -
-
- -
-
-
-
- -
-
- -
-
-
-
- -
-
- -
-
-
-
- - -
-
-
-
- -
-
- -
-
-
-
-
- -
-
-
-
\ No newline at end of file diff --git a/apps/documenteditor/main/app/view/Toolbar.js b/apps/documenteditor/main/app/view/Toolbar.js index 11bd07a1a..4b41fc6c3 100644 --- a/apps/documenteditor/main/app/view/Toolbar.js +++ b/apps/documenteditor/main/app/view/Toolbar.js @@ -174,9 +174,8 @@ define([ {caption: me.textTabHome, action: 'home', extcls: 'canedit', dataHintTitle: 'H'}, {caption: me.textTabInsert, action: 'ins', extcls: 'canedit', dataHintTitle: 'I'}, {caption: me.textTabLayout, action: 'layout', extcls: 'canedit', layoutname: 'toolbar-layout', dataHintTitle: 'L'}, - {caption: me.textTabLinks, action: 'links', extcls: 'canedit', layoutname: 'toolbar-references', dataHintTitle: 'R'}, - undefined, undefined, undefined, - {caption: me.textTabView, action: 'view', extcls: 'canedit', layoutname: 'toolbar-view', dataHintTitle: 'W'} + {caption: me.textTabLinks, action: 'links', extcls: 'canedit', layoutname: 'toolbar-references', dataHintTitle: 'R'} + // undefined, undefined, undefined, undefined, ] } ); diff --git a/apps/documenteditor/main/app/view/ViewTab.js b/apps/documenteditor/main/app/view/ViewTab.js index c302bf453..c47409331 100644 --- a/apps/documenteditor/main/app/view/ViewTab.js +++ b/apps/documenteditor/main/app/view/ViewTab.js @@ -46,6 +46,50 @@ define([ 'use strict'; DE.Views.ViewTab = Common.UI.BaseView.extend(_.extend((function(){ + var template = + '
' + + '
' + + '' + + '
' + + '
' + + '
' + + '
' + + '' + + '
' + + '
' + + '' + + '
' + + '
' + + '
' + + '
' + + '' + + '
' + + '
' + + '' + + '
' + + '
' + + '
' + + '
' + + '' + + '' + + '
' + + '
' + + '
' + + '
' + + '' + + '
' + + '
' + + '' + + '
' + + '
' + + '
' + + '
' + + '' + + '
' + + '
' + + '
' + + '
'; + return { options: {}, @@ -88,7 +132,6 @@ define([ var _set = Common.enumLock; this.btnNavigation = new Common.UI.Button({ - parentEl: $host.find('#slot-btn-navigation'), cls: 'btn-toolbar x-huge icon-top', iconCls: 'toolbar__icon btn-menu-navigation', lock: [_set.lostConnect, _set.disableOnStart], @@ -101,7 +144,6 @@ define([ this.lockedControls.push(this.btnNavigation); this.cmbZoom = new Common.UI.ComboBox({ - el: $host.find('#slot-field-zoom'), cls: 'input-group-nr', lock: [_set.lostConnect, _set.disableOnStart], menuStyle: 'min-width: 55px;', @@ -125,10 +167,7 @@ define([ this.cmbZoom.setValue(100); this.lockedControls.push(this.cmbZoom); - $host.find('#slot-lbl-zoom').text(this.textZoom); - this.btnFitToPage = new Common.UI.Button({ - parentEl: $host.find('#slot-btn-ftp'), cls: 'btn-toolbar', iconCls: 'toolbar__icon btn-ic-zoomtopage', lock: [_set.lostConnect, _set.disableOnStart], @@ -142,7 +181,6 @@ define([ this.lockedControls.push(this.btnFitToPage); this.btnFitToWidth = new Common.UI.Button({ - parentEl: $host.find('#slot-btn-ftw'), cls: 'btn-toolbar', iconCls: 'toolbar__icon btn-ic-zoomtowidth', lock: [_set.lostConnect, _set.disableOnStart], @@ -156,7 +194,6 @@ define([ this.lockedControls.push(this.btnFitToWidth); this.btnInterfaceTheme = new Common.UI.Button({ - parentEl: $host.find('#slot-btn-interface-theme'), cls: 'btn-toolbar x-huge icon-top', iconCls: 'toolbar__icon day', lock: [_set.lostConnect, _set.disableOnStart], @@ -169,7 +206,6 @@ define([ this.lockedControls.push(this.btnInterfaceTheme); this.btnDarkDocument = new Common.UI.Button({ - parentEl: $host.find('#slot-btn-dark-document'), cls: 'btn-toolbar x-huge icon-top', iconCls: 'toolbar__icon dark-mode', lock: [_set.inLightTheme, _set.lostConnect, _set.disableOnStart], @@ -182,7 +218,6 @@ define([ this.lockedControls.push(this.btnDarkDocument); this.chStatusbar = new Common.UI.CheckBox({ - el: $host.findById('#slot-chk-statusbar'), lock: [_set.lostConnect, _set.disableOnStart], labelText: this.textStatusBar, value: !Common.localStorage.getBool("de-hidden-status"), @@ -193,7 +228,6 @@ define([ this.lockedControls.push(this.chStatusbar); this.chToolbar = new Common.UI.CheckBox({ - el: $host.findById('#slot-chk-toolbar'), lock: [_set.lostConnect, _set.disableOnStart], labelText: this.textAlwaysShowToolbar, value: !options.compactToolbar, @@ -204,7 +238,6 @@ define([ this.lockedControls.push(this.chToolbar); this.chRulers = new Common.UI.CheckBox({ - el: $host.findById('#slot-chk-rulers'), lock: [_set.lostConnect, _set.disableOnStart], labelText: this.textRulers, value: !Common.Utils.InternalSettings.get("de-hidden-rulers"), @@ -219,9 +252,28 @@ define([ }, render: function (el) { + if ( el ) el.html( this.getPanel() ); + return this; }, + getPanel: function () { + this.$el = $(_.template(template)( {} )); + var $host = this.$el; + + this.btnNavigation.render($host.find('#slot-btn-navigation')); + this.cmbZoom.render($host.find('#slot-field-zoom')); + $host.find('#slot-lbl-zoom').text(this.textZoom); + this.btnFitToPage.render($host.find('#slot-btn-ftp')); + this.btnFitToWidth.render($host.find('#slot-btn-ftw')); + this.btnInterfaceTheme.render($host.find('#slot-btn-interface-theme')); + this.btnDarkDocument.render($host.find('#slot-btn-dark-document')); + this.chStatusbar.render($host.find('#slot-chk-statusbar')); + this.chToolbar.render($host.find('#slot-chk-toolbar')); + this.chRulers.render($host.find('#slot-chk-rulers')); + return this.$el; + }, + show: function () { Common.UI.BaseView.prototype.show.call(this); this.fireEvent('show', this);