From f3a5fcb268d64a12a501df27c6b556cbdb73eda5 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Wed, 1 Nov 2023 21:05:26 +0300 Subject: [PATCH] [SSE] Refactoring focus in edit rules dialog --- .../main/app/view/FormatRulesEditDlg.js | 40 +++++++++++-------- 1 file changed, 24 insertions(+), 16 deletions(-) diff --git a/apps/spreadsheeteditor/main/app/view/FormatRulesEditDlg.js b/apps/spreadsheeteditor/main/app/view/FormatRulesEditDlg.js index 6ad4ce27a6..7d391e74d1 100644 --- a/apps/spreadsheeteditor/main/app/view/FormatRulesEditDlg.js +++ b/apps/spreadsheeteditor/main/app/view/FormatRulesEditDlg.js @@ -512,17 +512,17 @@ define([ 'text!spreadsheeteditor/main/app/template/FormatRulesEditDlg.template', style : 'min-width: 100px;', menuAlign : 'tl-tr', items: [ - { template: itemTemplate, stopPropagation: true, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.Thin , imgId: "solid-s", checked:true}, - { template: itemTemplate, stopPropagation: true, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.Hair, imgId: "dots-s"}, - { template: itemTemplate, stopPropagation: true, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.Dotted, imgId: "dashes-s"}, - { template: itemTemplate, stopPropagation: true, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.Dashed, imgId: "dashes-m"}, - { template: itemTemplate, stopPropagation: true, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.DashDot, imgId: "dash-dot-s"}, - { template: itemTemplate, stopPropagation: true, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.DashDotDot, imgId: "dash-dot-dot-s"}, - { template: itemTemplate, stopPropagation: true, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.Medium, imgId: "solid-m"}, - { template: itemTemplate, stopPropagation: true, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.MediumDashed, imgId: "dashes-l"}, - { template: itemTemplate, stopPropagation: true, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.MediumDashDot, imgId: "dash-dot-m"}, - { template: itemTemplate, stopPropagation: true, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.MediumDashDotDot, imgId: "dash-dot-dot-m"}, - { template: itemTemplate, stopPropagation: true, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.Thick, imgId: "solid-l"} + { template: itemTemplate, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.Thin , imgId: "solid-s", checked:true}, + { template: itemTemplate, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.Hair, imgId: "dots-s"}, + { template: itemTemplate, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.Dotted, imgId: "dashes-s"}, + { template: itemTemplate, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.Dashed, imgId: "dashes-m"}, + { template: itemTemplate, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.DashDot, imgId: "dash-dot-s"}, + { template: itemTemplate, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.DashDotDot, imgId: "dash-dot-dot-s"}, + { template: itemTemplate, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.Medium, imgId: "solid-m"}, + { template: itemTemplate, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.MediumDashed, imgId: "dashes-l"}, + { template: itemTemplate, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.MediumDashDot, imgId: "dash-dot-m"}, + { template: itemTemplate, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.MediumDashDotDot, imgId: "dash-dot-dot-m"}, + { template: itemTemplate, checkable: true, toggleGroup: 'border-width', value: Asc.c_oAscBorderStyles.Thick, imgId: "solid-l"} ] }); @@ -537,12 +537,11 @@ define([ 'text!spreadsheeteditor/main/app/template/FormatRulesEditDlg.template', menu : new Common.UI.Menu({ menuAlign : 'tl-tr', items : [ - { template: _.template('
'), stopPropagation: true }, + { template: _.template('
') }, {caption: '--'}, { id: "format-rules-borders-menu-new-bordercolor", - template: _.template('' + this.textNewColor + ''), - stopPropagation: true + template: _.template('' + this.textNewColor + '') } ] }) @@ -558,9 +557,12 @@ define([ 'text!spreadsheeteditor/main/app/template/FormatRulesEditDlg.template', }); this.mnuBorderColor.menu.setInnerMenu([{menu: this.mnuBorderColorPicker, index: 0}]); this.mnuBorderColorPicker.on('select', _.bind(this.onBordersColor, this)); - $('#format-rules-borders-menu-new-bordercolor').on('click', _.bind(function() { + this.mnuBorderColorPicker.on('close:extended', function() { + setTimeout(function(){me.btnBorders.focus();}, 1); + }); + $('#format-rules-borders-menu-new-bordercolor').on('click', function() { me.mnuBorderColorPicker.addNewColor(); - }, this)); + }); this.mnuBorderWidth.on('item:toggle', _.bind(this.onBordersWidth, this)); Common.UI.FocusManager.add(this, this.btnBorders); @@ -1663,6 +1665,7 @@ define([ 'text!spreadsheeteditor/main/app/template/FormatRulesEditDlg.template', onBordersWidth: function(menu, item, state) { if (state) { this.btnBorders.options.borderswidth = item.value; + this.onBorders(this.btnBorders); } }, @@ -1670,6 +1673,11 @@ define([ 'text!spreadsheeteditor/main/app/template/FormatRulesEditDlg.template', $('#format-rules-borders-border-color .menu-item-icon').css('border-color', '#' + ((typeof(color) == 'object') ? color.color : color)); this.mnuBorderColor.onUnHoverItem(); this.btnBorders.options.borderscolor = Common.Utils.ThemeColor.getRgbColor(color); + this.onBorders(this.btnBorders); + var me = this; + setTimeout(function() { + me.btnBorders.menu.hide(); + }, 1); }, onBorders: function(btn) {