From 5d40fdc1edbe47dff08ec0e32bea0c15f280bf3c Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Thu, 15 Jun 2017 16:18:40 +0300 Subject: [PATCH] Debug toolbar layout. --- apps/common/main/resources/less/toolbar.less | 7 +------ apps/documenteditor/main/app/controller/Toolbar.js | 9 +++------ apps/documenteditor/main/app/controller/Viewport.js | 4 ++-- apps/documenteditor/main/app/view/Toolbar.js | 3 ++- apps/documenteditor/main/resources/less/toolbar.less | 2 +- .../presentationeditor/main/app/controller/Toolbar.js | 9 +++------ .../main/app/controller/Viewport.js | 4 ++-- apps/presentationeditor/main/app/view/Toolbar.js | 11 ++++++----- .../main/resources/less/toolbar.less | 9 +++------ apps/spreadsheeteditor/main/app/controller/Toolbar.js | 9 +++------ .../spreadsheeteditor/main/app/controller/Viewport.js | 2 +- .../main/app/template/Toolbar.template | 8 ++++++-- apps/spreadsheeteditor/main/app/view/Toolbar.js | 11 ++++++----- apps/spreadsheeteditor/main/app/view/Viewport.js | 2 +- .../main/resources/less/toolbar.less | 6 +++--- 15 files changed, 43 insertions(+), 53 deletions(-) diff --git a/apps/common/main/resources/less/toolbar.less b/apps/common/main/resources/less/toolbar.less index e55b3a2361..ecca2be13a 100644 --- a/apps/common/main/resources/less/toolbar.less +++ b/apps/common/main/resources/less/toolbar.less @@ -191,7 +191,7 @@ .group { display: table-cell; - vertical-align: top; + vertical-align: middle; white-space: nowrap; padding-left: 12px; @@ -200,11 +200,6 @@ } } - .group { - //background-color: #a9f261; - vertical-align: middle; - } - .elset { height: 20px; font-size: 0; diff --git a/apps/documenteditor/main/app/controller/Toolbar.js b/apps/documenteditor/main/app/controller/Toolbar.js index c2e1af67b7..b140a8f492 100644 --- a/apps/documenteditor/main/app/controller/Toolbar.js +++ b/apps/documenteditor/main/app/controller/Toolbar.js @@ -2714,10 +2714,7 @@ define([ toolbar.$el.find('.toolbar').toggleClass('masked', disable); toolbar.btnHide.setDisabled(disable); if(disable) { - mask = $("
").appendTo(toolbar.$el); - var left = toolbar.isCompactView ? 75 : 48; - mask.css('left', left + 'px'); - mask.css('right', (toolbar.isCompactView ? 0 : 45) + 'px'); + mask = $("
").appendTo(toolbar.$el.find('.toolbar')); Common.util.Shortcuts.suspendEvents('alt+h'); } else { mask.remove(); @@ -2781,7 +2778,7 @@ define([ onAppReady: function (config) { var me = this; - if ( config.canComments ) { + if ( config.canCoAuthoring && config.canComments ) { var _btnsComment = []; var slots = me.toolbar.$el.find('.slot-comment'); slots.each(function(index, el) { @@ -2791,7 +2788,7 @@ define([ var button = new Common.UI.Button({ cls: _cls, iconCls: 'btn-menu-comments', - caption: 'Comment' + caption: me.toolbar.capBtnComment }).render( slots.eq(index) ); _btnsComment.push(button); diff --git a/apps/documenteditor/main/app/controller/Viewport.js b/apps/documenteditor/main/app/controller/Viewport.js index c34863558a..7cbe4cf050 100644 --- a/apps/documenteditor/main/app/controller/Viewport.js +++ b/apps/documenteditor/main/app/controller/Viewport.js @@ -75,7 +75,7 @@ define([ toolbar.setExtra('left', me.header.getPanel('left', config)); }, 'view:compact' : function (toolbar, state) { - me.viewport.vlayout.panels[0].height = state ? 40 : 40+67; + me.viewport.vlayout.panels[0].height = state ? 32 : 32+67; } }, 'Common.Views.Header': { @@ -123,7 +123,7 @@ define([ if ( !config.isEdit || ( !Common.localStorage.itemExists("de-compact-toolbar") && config.customization && config.customization.compactToolbar )) { - me.viewport.vlayout.panels[0].height = 40; + me.viewport.vlayout.panels[0].height = 32; } }, diff --git a/apps/documenteditor/main/app/view/Toolbar.js b/apps/documenteditor/main/app/view/Toolbar.js index a8fc490edf..bc85f9758e 100644 --- a/apps/documenteditor/main/app/view/Toolbar.js +++ b/apps/documenteditor/main/app/view/Toolbar.js @@ -2486,7 +2486,8 @@ define([ capImgGroup: 'Group', capImgForward: 'Move forward', capImgBackward: 'Move backward', - capImgWrapping: 'Wrapping' + capImgWrapping: 'Wrapping', + capBtnComment: 'Comment' } })(), DE.Views.Toolbar || {})); }); diff --git a/apps/documenteditor/main/resources/less/toolbar.less b/apps/documenteditor/main/resources/less/toolbar.less index da3bc227b3..ae9d0ac2aa 100644 --- a/apps/documenteditor/main/resources/less/toolbar.less +++ b/apps/documenteditor/main/resources/less/toolbar.less @@ -31,7 +31,7 @@ top: 32px; left: 48px; right: 45px; - height: 100%; + bottom: 0; opacity: 0; background-color: @gray-light; z-index: @zindex-tooltip + 1; diff --git a/apps/presentationeditor/main/app/controller/Toolbar.js b/apps/presentationeditor/main/app/controller/Toolbar.js index c15d802179..9ee7a08eaa 100644 --- a/apps/presentationeditor/main/app/controller/Toolbar.js +++ b/apps/presentationeditor/main/app/controller/Toolbar.js @@ -2028,10 +2028,7 @@ define([ this.toolbar.lockToolbar(PE.enumLock.menuFileOpen, disable, {array: [toolbar.btnAddSlide, toolbar.btnChangeSlide, toolbar.btnPreview, toolbar.btnHide]}); if(disable) { - mask = $("
").appendTo(toolbar.$el); - var left = toolbar.isCompactView ? 150 : (toolbar.mode.nativeApp ? 190 : 145 ); - mask.css('left', left + 'px'); - mask.css('right', (toolbar.isCompactView ? 0 : 45) + 'px'); + mask = $("
").appendTo(toolbar.$el.find('.toolbar')); Common.util.Shortcuts.suspendEvents('command+k, ctrl+k, alt+h, command+f5, ctrl+f5'); } else { mask.remove(); @@ -2062,7 +2059,7 @@ define([ onAppReady: function (config) { var me = this; - if ( config.canComments ) { + if ( config.canCoAuthoring && config.canComments ) { var _btnsComment = []; var slots = me.toolbar.$el.find('.slot-comment'); slots.each(function(index, el) { @@ -2072,7 +2069,7 @@ define([ var button = new Common.UI.Button({ cls: _cls, iconCls: 'svgicon svg-btn-comments', - caption: 'Comment' + caption: me.toolbar.capBtnComment }).render( slots.eq(index) ); _btnsComment.push(button); diff --git a/apps/presentationeditor/main/app/controller/Viewport.js b/apps/presentationeditor/main/app/controller/Viewport.js index 3ca7ff640a..2288b2ace1 100644 --- a/apps/presentationeditor/main/app/controller/Viewport.js +++ b/apps/presentationeditor/main/app/controller/Viewport.js @@ -76,7 +76,7 @@ define([ toolbar.setExtra('left', me.header.getPanel('left', config)); }, 'view:compact' : function (toolbar, state) { - me.viewport.vlayout.panels[0].height = state ? 40 : 40+67; + me.viewport.vlayout.panels[0].height = state ? 32 : 32+67; } }, 'Common.Views.Header': { @@ -126,7 +126,7 @@ define([ ( !Common.localStorage.itemExists("pe-compact-toolbar") && config.customization && config.customization.compactToolbar )) { - me.viewport.vlayout.panels[0].height = 40; + me.viewport.vlayout.panels[0].height = 32; } }, diff --git a/apps/presentationeditor/main/app/view/Toolbar.js b/apps/presentationeditor/main/app/view/Toolbar.js index 612fea515b..63bc160cc4 100644 --- a/apps/presentationeditor/main/app/view/Toolbar.js +++ b/apps/presentationeditor/main/app/view/Toolbar.js @@ -209,7 +209,7 @@ define([ me.btnPrint = new Common.UI.Button({ id : 'id-toolbar-btn-print', cls : 'btn-toolbar', - iconCls : 'btn-print', + iconCls : 'btn-print no-mask', lock : [_set.slideDeleted, _set.noSlides, _set.cantPrint] }); me.paragraphControls.push(me.btnPrint); @@ -217,7 +217,7 @@ define([ me.btnSave = new Common.UI.Button({ id : 'id-toolbar-btn-save', cls : 'btn-toolbar', - iconCls : me.btnSaveCls, + iconCls : 'no-mask ' + me.btnSaveCls, lock : [_set.lostConnect] }); @@ -625,7 +625,7 @@ define([ me.btnHide = new Common.UI.Button({ id : 'id-toolbar-btn-hidebars', cls : 'btn-toolbar', - iconCls : 'btn-hidebars', + iconCls : 'btn-hidebars no-mask', lock : [_set.menuFileOpen, _set.slideDeleted, _set.disableOnStart], menu : true }); @@ -642,7 +642,7 @@ define([ me.btnAdvSettings = new Common.UI.Button({ id : 'id-toolbar-btn-settings', cls : 'btn-toolbar', - iconCls : 'btn-settings', + iconCls : 'btn-settings no-mask', lock : [_set.slideDeleted, _set.disableOnStart] }); me.slideOnlyControls.push(me.btnAdvSettings); @@ -1821,7 +1821,8 @@ define([ capAddSlide: 'Add Slide', capTabFile: 'File', capTabHome: 'Home', - capTabInsert: 'Insert' + capTabInsert: 'Insert', + capBtnComment: 'Comment' } }()), PE.Views.Toolbar || {})); }); \ No newline at end of file diff --git a/apps/presentationeditor/main/resources/less/toolbar.less b/apps/presentationeditor/main/resources/less/toolbar.less index 716594bd06..6f6d55dba7 100644 --- a/apps/presentationeditor/main/resources/less/toolbar.less +++ b/apps/presentationeditor/main/resources/less/toolbar.less @@ -6,13 +6,10 @@ } &.masked { - .btn-toolbar.disabled .icon:not(.btn-print):not(.btn-save):not(.btn-save-coauth):not(.btn-settings):not(.btn-hidebars) { + button.disabled .icon:not(.no-mask) { background-position-x: 0px !important; } - .btn-toolbar.large.disabled .icon:not(.btn-print):not(.btn-save) { - background-position-y: -5px !important; - } - .toolbar-group:not(.no-mask) { + .group:not(.no-mask) { opacity: 0.4; } } @@ -29,7 +26,7 @@ top: 32px; left: 48px; right: 45px; - height: 100%; + bottom: 0; opacity: 0; background-color: @gray-light; z-index: @zindex-tooltip + 1; diff --git a/apps/spreadsheeteditor/main/app/controller/Toolbar.js b/apps/spreadsheeteditor/main/app/controller/Toolbar.js index ddbbabf7da..944350a846 100644 --- a/apps/spreadsheeteditor/main/app/controller/Toolbar.js +++ b/apps/spreadsheeteditor/main/app/controller/Toolbar.js @@ -2840,10 +2840,7 @@ define([ this.toolbar.lockToolbar(SSE.enumLock.menuFileOpen, disable, {array: [toolbar.btnShowMode]}); if(disable) { - mask = $("
").appendTo(toolbar.$el); - var left = toolbar.isCompactView ? 75 : (toolbar.mode.nativeApp ? 80 : 48 ); - mask.css('left', left + 'px'); - mask.css('right', (toolbar.isCompactView ? 0 : 45) + 'px'); + mask = $("
").appendTo(toolbar.$el.find('.toolbar')); Common.util.Shortcuts.suspendEvents('command+l, ctrl+l, command+shift+l, ctrl+shift+l, command+k, ctrl+k, command+alt+h, ctrl+alt+h, command+1, ctrl+1'); } else { mask.remove(); @@ -2887,7 +2884,7 @@ define([ onAppReady: function (config) { var me = this; - if ( config.canComments ) { + if ( config.canCoAuthoring && config.canComments ) { var _btnsComment = []; var slots = me.toolbar.$el.find('.slot-comment'); slots.each(function(index, el) { @@ -2897,7 +2894,7 @@ define([ var button = new Common.UI.Button({ cls: _cls, iconCls: 'svgicon svg-btn-comments', - caption: 'Comment' + caption: me.toolbar.capBtnComment }).render( slots.eq(index) ); _btnsComment.push(button); diff --git a/apps/spreadsheeteditor/main/app/controller/Viewport.js b/apps/spreadsheeteditor/main/app/controller/Viewport.js index bb8bed570d..16706e6151 100644 --- a/apps/spreadsheeteditor/main/app/controller/Viewport.js +++ b/apps/spreadsheeteditor/main/app/controller/Viewport.js @@ -99,7 +99,7 @@ define([ ( !Common.localStorage.itemExists("sse-compact-toolbar") && config.customization && config.customization.compactToolbar )) { - me.viewport.vlayout.panels[0].height = 40; + me.viewport.vlayout.panels[0].height = 32; } else if ( config.isEditDiagram || config.isEditMailMerge ) { me.viewport.vlayout.panels[0].height = 41; diff --git a/apps/spreadsheeteditor/main/app/template/Toolbar.template b/apps/spreadsheeteditor/main/app/template/Toolbar.template index 8582ee51f1..15de2bb693 100644 --- a/apps/spreadsheeteditor/main/app/template/Toolbar.template +++ b/apps/spreadsheeteditor/main/app/template/Toolbar.template @@ -154,10 +154,14 @@ -
+
+
+
-
+
+
+
diff --git a/apps/spreadsheeteditor/main/app/view/Toolbar.js b/apps/spreadsheeteditor/main/app/view/Toolbar.js index dfc1e5532d..41461ee3ee 100644 --- a/apps/spreadsheeteditor/main/app/view/Toolbar.js +++ b/apps/spreadsheeteditor/main/app/view/Toolbar.js @@ -360,14 +360,14 @@ define([ me.btnPrint = new Common.UI.Button({ id : 'id-toolbar-btn-print', cls : 'btn-toolbar', - iconCls : 'btn-print', + iconCls : 'btn-print no-mask', lock : [_set.editCell, _set.cantPrint] }); me.btnSave = new Common.UI.Button({ id : 'id-toolbar-btn-save', cls : 'btn-toolbar', - iconCls : me.btnSaveCls + iconCls : 'no-mask ' + me.btnSaveCls }); me.btnIncFontSize = new Common.UI.Button({ @@ -1045,7 +1045,7 @@ define([ me.btnShowMode = new Common.UI.Button({ id : 'id-toolbar-btn-showmode', cls : 'btn-toolbar', - iconCls : 'btn-showmode', + iconCls : 'btn-showmode no-mask', lock : [_set.menuFileOpen, _set.editCell], menu : true }); @@ -1053,7 +1053,7 @@ define([ me.btnSettings = new Common.UI.Button({ id : 'id-toolbar-btn-settings', cls : 'btn-toolbar', - iconCls : 'btn-settings' + iconCls : 'btn-settings no-mask' }); // Is unique for the short view @@ -2049,6 +2049,7 @@ define([ capInsertShape: 'Shape', capInsertChart: 'Chart', capInsertHyperlink: 'Hyperlink', - capInsertEquation: 'Equation' + capInsertEquation: 'Equation', + capBtnComment: 'Comment' }, SSE.Views.Toolbar || {})); }); \ No newline at end of file diff --git a/apps/spreadsheeteditor/main/app/view/Viewport.js b/apps/spreadsheeteditor/main/app/view/Viewport.js index ecdb6d43e8..341b4a1e11 100644 --- a/apps/spreadsheeteditor/main/app/view/Viewport.js +++ b/apps/spreadsheeteditor/main/app/view/Viewport.js @@ -91,7 +91,7 @@ define([ // height: 5 // }, { el: items[0], - height: Common.localStorage.getBool('sse-compact-toolbar') ? 40 : 40+67 + height: Common.localStorage.getBool('sse-compact-toolbar') ? 32 : 32+67 }, { el: items[1], stretch: true diff --git a/apps/spreadsheeteditor/main/resources/less/toolbar.less b/apps/spreadsheeteditor/main/resources/less/toolbar.less index 7a30611d65..f0ed5f4704 100644 --- a/apps/spreadsheeteditor/main/resources/less/toolbar.less +++ b/apps/spreadsheeteditor/main/resources/less/toolbar.less @@ -6,10 +6,10 @@ } &.masked { - button.disabled .btn-icon:not(.btn-print):not(.btn-save):not(.btn-save-coauth):not(.btn-settings):not(.btn-showmode) { + button.disabled .icon:not(.no-mask) { background-position-x: 0px !important; } - .toolbar-group:not(.no-mask) { + .group:not(.no-mask) { opacity: 0.4; } } @@ -48,7 +48,7 @@ top: 32px; left: 48px; right: 45px; - height: 100%; + bottom: 0; opacity: 0; background-color: @gray-light; z-index: @zindex-tooltip + 1;