From a8c09d32006295416ce754202349c75bfe318ce2 Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Mon, 21 Jun 2021 20:49:45 +0300 Subject: [PATCH] [PE] Hint Manager: add hints in file menu, left menu, statusbar --- .../main/app/view/FileMenuPanels.js | 27 ++++-- .../main/app/controller/LeftMenu.js | 3 +- .../main/app/template/LeftMenu.template | 14 +-- .../main/app/template/StatusBar.template | 10 +-- .../main/app/view/FileMenu.js | 85 ++++++++++++++---- .../main/app/view/FileMenuPanels.js | 90 ++++++++++++++----- .../main/app/view/Statusbar.js | 5 +- 7 files changed, 173 insertions(+), 61 deletions(-) diff --git a/apps/documenteditor/main/app/view/FileMenuPanels.js b/apps/documenteditor/main/app/view/FileMenuPanels.js index 8abcb98e1..1e3a9977b 100644 --- a/apps/documenteditor/main/app/view/FileMenuPanels.js +++ b/apps/documenteditor/main/app/view/FileMenuPanels.js @@ -300,7 +300,8 @@ define([ el: $markup.findById('#fms-chb-input-mode'), labelText: this.strInputMode, dataHint: '2', - dataHintDirection: 'left' + dataHintDirection: 'left', + dataHintOffset: 'small' }); /** coauthoring begin **/ @@ -308,7 +309,8 @@ define([ el: $markup.findById('#fms-chb-live-comment'), labelText: this.strLiveComment, dataHint: '2', - dataHintDirection: 'left' + dataHintDirection: 'left', + dataHintOffset: 'small' }).on('change', function(field, newValue, oldValue, eOpts){ me.chResolvedComment.setDisabled(field.getValue()!=='checked'); }); @@ -317,7 +319,8 @@ define([ el: $markup.findById('#fms-chb-resolved-comment'), labelText: this.strResolvedComment, dataHint: '2', - dataHintDirection: 'left' + dataHintDirection: 'left', + dataHintOffset: 'small' }); /** coauthoring end **/ @@ -325,21 +328,24 @@ define([ el: $markup.findById('#fms-chb-spell-check'), labelText: this.strSpellCheckMode, dataHint: '2', - dataHintDirection: 'left' + dataHintDirection: 'left', + dataHintOffset: 'small' }); this.chCompatible = new Common.UI.CheckBox({ el: $markup.findById('#fms-chb-compatible'), labelText: this.textOldVersions, dataHint: '2', - dataHintDirection: 'left' + dataHintDirection: 'left', + dataHintOffset: 'small' }); this.chAutosave = new Common.UI.CheckBox({ el: $markup.findById('#fms-chb-autosave'), labelText: this.strAutosave, dataHint: '2', - dataHintDirection: 'left' + dataHintDirection: 'left', + dataHintOffset: 'small' }).on('change', function(field, newValue, oldValue, eOpts){ if (field.getValue()!=='checked' && me.cmbCoAuthMode.getValue()) { me.cmbCoAuthMode.setValue(0); @@ -352,14 +358,16 @@ define([ el: $markup.findById('#fms-chb-forcesave'), labelText: this.strForcesave, dataHint: '2', - dataHintDirection: 'left' + dataHintDirection: 'left', + dataHintOffset: 'small' }); this.chAlignGuides = new Common.UI.CheckBox({ el: $markup.findById('#fms-chb-align-guides'), labelText: this.strAlignGuides, dataHint: '2', - dataHintDirection: 'left' + dataHintDirection: 'left', + dataHintOffset: 'small' }); this.cmbZoom = new Common.UI.ComboBox({ @@ -487,7 +495,8 @@ define([ el: $markup.findById('#fms-chb-paste-settings'), labelText: this.strPasteButton, dataHint: '2', - dataHintDirection: 'left' + dataHintDirection: 'left', + dataHintOffset: 'small' }); this.btnAutoCorrect = new Common.UI.Button({ diff --git a/apps/presentationeditor/main/app/controller/LeftMenu.js b/apps/presentationeditor/main/app/controller/LeftMenu.js index c96ed5458..f897826c7 100644 --- a/apps/presentationeditor/main/app/controller/LeftMenu.js +++ b/apps/presentationeditor/main/app/controller/LeftMenu.js @@ -672,7 +672,8 @@ define([ // if (!this.leftMenu.isOpened()) return true; // TODO: if ( this.leftMenu.menuFile.isVisible() ) { - this.leftMenu.menuFile.hide(); + if (Common.UI.HintManager.needCloseMenu()) + this.leftMenu.menuFile.hide(); return false; } diff --git a/apps/presentationeditor/main/app/template/LeftMenu.template b/apps/presentationeditor/main/app/template/LeftMenu.template index 7471d770d..abd645e85 100644 --- a/apps/presentationeditor/main/app/template/LeftMenu.template +++ b/apps/presentationeditor/main/app/template/LeftMenu.template @@ -1,14 +1,14 @@
- - + + - - + + - - - + + +
diff --git a/apps/presentationeditor/main/app/template/StatusBar.template b/apps/presentationeditor/main/app/template/StatusBar.template index 16159833c..deaf7d731 100644 --- a/apps/presentationeditor/main/app/template/StatusBar.template +++ b/apps/presentationeditor/main/app/template/StatusBar.template @@ -4,7 +4,7 @@
- +
-
+
@@ -36,11 +36,11 @@
- - + +
-
+
diff --git a/apps/presentationeditor/main/app/view/FileMenu.js b/apps/presentationeditor/main/app/view/FileMenu.js index ba9e00248..7bb5403af 100644 --- a/apps/presentationeditor/main/app/view/FileMenu.js +++ b/apps/presentationeditor/main/app/view/FileMenu.js @@ -92,7 +92,10 @@ define([ action : 'save', caption : this.btnSaveCaption, canFocused: false, - disabled: true + disabled: true, + dataHint: 1, + dataHintDirection: 'left-top', + dataHintOffset: [2, 14] }); if ( !!this.options.miSave ) { this.miSave.setDisabled(this.options.miSave.isDisabled()); @@ -103,49 +106,70 @@ define([ el : $markup.elementById('#fm-btn-edit'), action : 'edit', caption : this.btnToEditCaption, - canFocused: false + canFocused: false, + dataHint: 1, + dataHintDirection: 'left-top', + dataHintOffset: [2, 14] }); this.miDownload = new Common.UI.MenuItem({ el : $markup.elementById('#fm-btn-download'), action : 'saveas', caption : this.btnDownloadCaption, - canFocused: false + canFocused: false, + dataHint: 1, + dataHintDirection: 'left-top', + dataHintOffset: [2, 14] }); this.miSaveCopyAs = new Common.UI.MenuItem({ el : $markup.elementById('#fm-btn-save-copy'), action : 'save-copy', caption : this.btnSaveCopyAsCaption, - canFocused: false + canFocused: false, + dataHint: 1, + dataHintDirection: 'left-top', + dataHintOffset: [2, 14] }); this.miSaveAs = new Common.UI.MenuItem({ el : $markup.elementById('#fm-btn-save-desktop'), action : 'save-desktop', caption : this.btnSaveAsCaption, - canFocused: false + canFocused: false, + dataHint: 1, + dataHintDirection: 'left-top', + dataHintOffset: [2, 14] }); this.miPrint = new Common.UI.MenuItem({ el : $markup.elementById('#fm-btn-print'), action : 'print', caption : this.btnPrintCaption, - canFocused: false + canFocused: false, + dataHint: 1, + dataHintDirection: 'left-top', + dataHintOffset: [2, 14] }); this.miRename = new Common.UI.MenuItem({ el : $markup.elementById('#fm-btn-rename'), action : 'rename', caption : this.btnRenameCaption, - canFocused: false + canFocused: false, + dataHint: 1, + dataHintDirection: 'left-top', + dataHintOffset: [2, 14] }); this.miProtect = new Common.UI.MenuItem({ el : $markup.elementById('#fm-btn-protect'), action : 'protect', caption : this.btnProtectCaption, - canFocused: false + canFocused: false, + dataHint: 1, + dataHintDirection: 'left-top', + dataHintOffset: [2, 14] }); if ( !!this.options.miProtect ) { this.miProtect.setDisabled(this.options.miProtect.isDisabled()); @@ -156,35 +180,50 @@ define([ el : $markup.elementById('#fm-btn-recent'), action : 'recent', caption : this.btnRecentFilesCaption, - canFocused: false + canFocused: false, + dataHint: 1, + dataHintDirection: 'left-top', + dataHintOffset: [2, 14] }); this.miNew = new Common.UI.MenuItem({ el : $markup.elementById('#fm-btn-create'), action : 'new', caption : this.btnCreateNewCaption, - canFocused: false + canFocused: false, + dataHint: 1, + dataHintDirection: 'left-top', + dataHintOffset: [2, 14] }); this.miAccess = new Common.UI.MenuItem({ el : $markup.elementById('#fm-btn-rights'), action : 'rights', caption : this.btnRightsCaption, - canFocused: false + canFocused: false, + dataHint: 1, + dataHintDirection: 'left-top', + dataHintOffset: [2, 14] }); this.miHelp = new Common.UI.MenuItem({ el : $markup.elementById('#fm-btn-help'), action : 'help', caption : this.btnHelpCaption, - canFocused: false + canFocused: false, + dataHint: 1, + dataHintDirection: 'left-top', + dataHintOffset: [2, 14] }); this.miHistory = new Common.UI.MenuItem({ el : $markup.elementById('#fm-btn-history'), action : 'history', caption : this.btnHistoryCaption, - canFocused: false + canFocused: false, + dataHint: 1, + dataHintDirection: 'left-top', + dataHintOffset: [2, 14] }); this.items = []; @@ -193,7 +232,10 @@ define([ el : $markup.elementById('#fm-btn-return'), action : 'back', caption : this.btnCloseMenuCaption, - canFocused: false + canFocused: false, + dataHint: 1, + dataHintDirection: 'left-top', + dataHintOffset: [2, 14] }), this.miSave, this.miEdit, @@ -209,7 +251,10 @@ define([ el : $markup.elementById('#fm-btn-info'), action : 'info', caption : this.btnInfoCaption, - canFocused: false + canFocused: false, + dataHint: 1, + dataHintDirection: 'left-top', + dataHintOffset: [2, 14] }), this.miAccess, this.miHistory, @@ -217,14 +262,20 @@ define([ el : $markup.elementById('#fm-btn-settings'), action : 'opts', caption : this.btnSettingsCaption, - canFocused: false + canFocused: false, + dataHint: 1, + dataHintDirection: 'left-top', + dataHintOffset: [2, 14] }), this.miHelp, new Common.UI.MenuItem({ el : $markup.elementById('#fm-btn-back'), action : 'exit', caption : this.btnBackCaption, - canFocused: false + canFocused: false, + dataHint: 1, + dataHintDirection: 'left-top', + dataHintOffset: [2, 14] }) ); diff --git a/apps/presentationeditor/main/app/view/FileMenuPanels.js b/apps/presentationeditor/main/app/view/FileMenuPanels.js index 29e362480..40f0d3bfa 100644 --- a/apps/presentationeditor/main/app/view/FileMenuPanels.js +++ b/apps/presentationeditor/main/app/view/FileMenuPanels.js @@ -69,7 +69,7 @@ define([ '<% _.each(rows, function(row) { %>', '', '<% _.each(row, function(item) { %>', - '
', + '
', '', '
', '<% }) %>', @@ -188,7 +188,7 @@ define([ '','', '', '', - '
', + '
', '','', '', '', @@ -242,7 +242,7 @@ define([ '','', '', '', - '', + '', '', '', '
', @@ -250,7 +250,7 @@ define([ '', '', '', - '', + '', '', '
', '
' @@ -268,12 +268,18 @@ define([ this.chSpell = new Common.UI.CheckBox({ el: $markup.findById('#fms-chb-spell-check'), - labelText: this.strSpellCheckMode + labelText: this.strSpellCheckMode, + dataHint: '2', + dataHintDirection: 'left', + dataHintOffset: 'small' }); this.chInputMode = new Common.UI.CheckBox({ el: $markup.findById('#fms-chb-input-mode'), - labelText: this.strInputMode + labelText: this.strInputMode, + dataHint: '2', + dataHintDirection: 'left', + dataHintOffset: 'small' }); this.cmbZoom = new Common.UI.ComboBox({ @@ -296,7 +302,10 @@ define([ { value: 150, displayValue: "150%" }, { value: 175, displayValue: "175%" }, { value: 200, displayValue: "200%" } - ] + ], + dataHint: '2', + dataHintDirection: 'bottom', + dataHintOffset: 'big' }); /** coauthoring begin **/ @@ -308,7 +317,10 @@ define([ data : [ { value: 1, displayValue: this.strFast, descValue: this.strCoAuthModeDescFast}, { value: 0, displayValue: this.strStrict, descValue: this.strCoAuthModeDescStrict } - ] + ], + dataHint: '2', + dataHintDirection: 'bottom', + dataHintOffset: 'big' }).on('selected', function(combo, record) { if (record.value == 1 && (me.chAutosave.getValue()!=='checked')) me.chAutosave.setValue(1); @@ -320,7 +332,10 @@ define([ this.chAutosave = new Common.UI.CheckBox({ el: $markup.findById('#fms-chb-autosave'), - labelText: this.strAutosave + labelText: this.strAutosave, + dataHint: '2', + dataHintDirection: 'left', + dataHintOffset: 'small' }).on('change', function(field, newValue, oldValue, eOpts){ if (field.getValue()!=='checked' && me.cmbCoAuthMode.getValue()) { me.cmbCoAuthMode.setValue(0); @@ -331,12 +346,18 @@ define([ this.chForcesave = new Common.UI.CheckBox({ el: $markup.findById('#fms-chb-forcesave'), - labelText: this.strForcesave + labelText: this.strForcesave, + dataHint: '2', + dataHintDirection: 'left', + dataHintOffset: 'small' }); this.chAlignGuides = new Common.UI.CheckBox({ el: $markup.findById('#fms-chb-align-guides'), - labelText: this.strAlignGuides + labelText: this.strAlignGuides, + dataHint: '2', + dataHintDirection: 'left', + dataHintOffset: 'small' }); var itemsTemplate = @@ -356,7 +377,10 @@ define([ { value: Asc.c_oAscFontRenderingModeType.noHinting, displayValue: this.txtMac }, { value: Asc.c_oAscFontRenderingModeType.hinting, displayValue: this.txtNative }, { value: 'custom', displayValue: this.txtCacheMode } - ] + ], + dataHint: '2', + dataHintDirection: 'bottom', + dataHintOffset: 'big' }); this.cmbFontRender.on('selected', _.bind(this.onFontRenderSelected, this)); @@ -369,7 +393,10 @@ define([ { value: Common.Utils.Metric.c_MetricUnits['cm'], displayValue: this.txtCm }, { value: Common.Utils.Metric.c_MetricUnits['pt'], displayValue: this.txtPt }, { value: Common.Utils.Metric.c_MetricUnits['inch'], displayValue: this.txtInch } - ] + ], + dataHint: '2', + dataHintDirection: 'bottom', + dataHintOffset: 'big' }); this.cmbMacros = new Common.UI.ComboBox({ @@ -382,7 +409,10 @@ define([ { value: 2, displayValue: this.txtStopMacros, descValue: this.txtStopMacrosDesc }, { value: 0, displayValue: this.txtWarnMacros, descValue: this.txtWarnMacrosDesc }, { value: 1, displayValue: this.txtRunMacros, descValue: this.txtRunMacrosDesc } - ] + ], + dataHint: '2', + dataHintDirection: 'bottom', + dataHintOffset: 'big' }).on('selected', function(combo, record) { me.lblMacrosDesc.text(record.descValue); }); @@ -390,7 +420,10 @@ define([ this.chPaste = new Common.UI.CheckBox({ el: $markup.findById('#fms-chb-paste-settings'), - labelText: this.strPasteButton + labelText: this.strPasteButton, + dataHint: '2', + dataHintDirection: 'left', + dataHintOffset: 'small' }); this.btnAutoCorrect = new Common.UI.Button({ @@ -406,7 +439,10 @@ define([ data : [ { value: Common.UI.Themes.THEME_LIGHT_ID, displayValue: this.txtThemeLight }, { value: Common.UI.Themes.THEME_DARK_ID, displayValue: this.txtThemeDark } - ] + ], + dataHint: '2', + dataHintDirection: 'bottom', + dataHintOffset: 'big' }); $markup.find('.btn.primary').each(function(index, el){ @@ -863,7 +899,7 @@ define([ '', '', '', - '', + '', '', '
', '
' @@ -900,19 +936,28 @@ define([ el : $markup.findById('#id-info-title'), style : 'width: 200px;', placeHolder : this.txtAddText, - validateOnBlur: false + validateOnBlur: false, + dataHint: '2', + dataHintDirection: 'left', + dataHintOffset: 'small' }).on('keydown:before', keyDownBefore); this.inputSubject = new Common.UI.InputField({ el : $markup.findById('#id-info-subject'), style : 'width: 200px;', placeHolder : this.txtAddText, - validateOnBlur: false + validateOnBlur: false, + dataHint: '2', + dataHintDirection: 'left', + dataHintOffset: 'small' }).on('keydown:before', keyDownBefore); this.inputComment = new Common.UI.InputField({ el : $markup.findById('#id-info-comment'), style : 'width: 200px;', placeHolder : this.txtAddText, - validateOnBlur: false + validateOnBlur: false, + dataHint: '2', + dataHintDirection: 'left', + dataHintOffset: 'small' }).on('keydown:before', keyDownBefore); // modify info @@ -941,7 +986,10 @@ define([ el : $markup.findById('#id-info-add-author'), style : 'width: 200px;', validateOnBlur: false, - placeHolder: this.txtAddAuthor + placeHolder: this.txtAddAuthor, + dataHint: '2', + dataHintDirection: 'left', + dataHintOffset: 'small' }).on('changed:after', function(input, newValue, oldValue, e) { if (newValue == oldValue) return; diff --git a/apps/presentationeditor/main/app/view/Statusbar.js b/apps/presentationeditor/main/app/view/Statusbar.js index e6b427b7f..dbc02063d 100644 --- a/apps/presentationeditor/main/app/view/Statusbar.js +++ b/apps/presentationeditor/main/app/view/Statusbar.js @@ -244,7 +244,10 @@ define([ {caption: this.textShowCurrent, value: 1}, {caption: this.textShowPresenterView, value: 2} ] - }) + }), + dataHint: '0', + dataHintDirection: 'top', + dataHintOffset: '0, -16' }); var panelLang = $('.cnt-lang',this.el);