From 7653dc866d334780697cc7846862cdb3c338d167 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Tue, 26 Mar 2019 16:20:44 +0300 Subject: [PATCH 1/2] Bug 40330 --- .../main/app/view/ControlSettingsDialog.js | 54 +++++++++++++++---- apps/documenteditor/main/locale/en.json | 1 + .../main/resources/less/toolbar.less | 4 +- 3 files changed, 49 insertions(+), 10 deletions(-) diff --git a/apps/documenteditor/main/app/view/ControlSettingsDialog.js b/apps/documenteditor/main/app/view/ControlSettingsDialog.js index aa3aff9db..e58720538 100644 --- a/apps/documenteditor/main/app/view/ControlSettingsDialog.js +++ b/apps/documenteditor/main/app/view/ControlSettingsDialog.js @@ -187,6 +187,12 @@ define([ style: "width:45px;", menu : new Common.UI.Menu({ items: [ + { + id: 'control-settings-system-color', + caption: this.textSystemColor, + template: _.template('<%= caption %>') + }, + {caption: '--'}, { template: _.template('
') }, { template: _.template('' + me.textNewColor + '') } ] @@ -201,7 +207,8 @@ define([ }); this.btnColor.render( $('#control-settings-color-btn')); this.btnColor.setColor('000000'); - this.btnColor.menu.items[1].on('click', _.bind(this.addNewColor, this, this.colors, this.btnColor)); + this.btnColor.menu.items[3].on('click', _.bind(this.addNewColor, this, this.colors, this.btnColor)); + $('#control-settings-system-color').on('click', _.bind(this.onSystemColor, this)); this.btnApplyAll = new Common.UI.Button({ el: $('#control-settings-btn-all') @@ -223,7 +230,10 @@ define([ onColorsSelect: function(picker, color) { this.btnColor.setColor(color); + var clr_item = this.btnColor.menu.$el.find('#control-settings-system-color > a'); + clr_item.hasClass('selected') && clr_item.removeClass('selected'); this._isCanApplyColor = true; + this.isSystemColor = false; }, updateThemeColors: function() { @@ -234,6 +244,16 @@ define([ picker.addNewColor((typeof(btn.color) == 'object') ? btn.color.color : btn.color); }, + onSystemColor: function(e) { + var color = Common.Utils.ThemeColor.getHexColor(220, 220, 220); + this.btnColor.setColor(color); + this.colors.clearSelection(); + var clr_item = this.btnColor.menu.$el.find('#control-settings-system-color > a'); + !clr_item.hasClass('selected') && clr_item.addClass('selected'); + this._isCanApplyColor = true; + this.isSystemColor = true; + }, + afterRender: function() { this.updateThemeColors(); this._setDefaults(this.props); @@ -255,10 +275,17 @@ define([ (val!==null && val!==undefined) && this.cmbShow.setValue(val); val = props.get_Color(); - this._isCanApplyColor = !!val; - val = (val) ? Common.Utils.ThemeColor.getHexColor(val.get_r(), val.get_g(), val.get_b()) : 'transparent'; + this.isSystemColor = this._isCanApplyColor = !!val; + if (val) { + val = Common.Utils.ThemeColor.getHexColor(val.get_r(), val.get_g(), val.get_b()); + this.colors.selectByRGB(val,true); + } else { + this.colors.clearSelection(); + var clr_item = this.btnColor.menu.$el.find('#control-settings-system-color > a'); + !clr_item.hasClass('selected') && clr_item.addClass('selected'); + val = Common.Utils.ThemeColor.getHexColor(220, 220, 220); + } this.btnColor.setColor(val); - this.colors.selectByRGB(val,true); val = props.get_Lock(); (val===undefined) && (val = Asc.c_oAscSdtLockType.Unlocked); @@ -274,8 +301,12 @@ define([ props.put_Appearance(this.cmbShow.getValue()); if (this._isCanApplyColor) { - var color = Common.Utils.ThemeColor.getRgbColor(this.colors.getColor()); - props.put_Color(color.get_r(), color.get_g(), color.get_b()); + if (this.isSystemColor) { + props.put_Color(null); + } else { + var color = Common.Utils.ThemeColor.getRgbColor(this.colors.getColor()); + props.put_Color(color.get_r(), color.get_g(), color.get_b()); + } } var lock = Asc.c_oAscSdtLockType.Unlocked; @@ -306,8 +337,12 @@ define([ var props = new AscCommon.CContentControlPr(); props.put_Appearance(this.cmbShow.getValue()); if (this._isCanApplyColor) { - var color = Common.Utils.ThemeColor.getRgbColor(this.colors.getColor()); - props.put_Color(color.get_r(), color.get_g(), color.get_b()); + if (this.isSystemColor) { + props.put_Color(null); + } else { + var color = Common.Utils.ThemeColor.getRgbColor(this.colors.getColor()); + props.put_Color(color.get_r(), color.get_g(), color.get_b()); + } } this.api.asc_SetContentControlProperties(props, null, true); } @@ -327,7 +362,8 @@ define([ textNone: 'None', textNewColor: 'Add New Custom Color', textApplyAll: 'Apply to All', - textAppearance: 'Appearance' + textAppearance: 'Appearance', + textSystemColor: 'System' }, DE.Views.ControlSettingsDialog || {})) }); \ No newline at end of file diff --git a/apps/documenteditor/main/locale/en.json b/apps/documenteditor/main/locale/en.json index 64de7844a..e07514514 100644 --- a/apps/documenteditor/main/locale/en.json +++ b/apps/documenteditor/main/locale/en.json @@ -1053,6 +1053,7 @@ "DE.Views.ControlSettingsDialog.textTitle": "Content Control Settings", "DE.Views.ControlSettingsDialog.txtLockDelete": "Content control cannot be deleted", "DE.Views.ControlSettingsDialog.txtLockEdit": "Contents cannot be edited", + "DE.Views.ControlSettingsDialog.textSystemColor": "System", "DE.Views.CustomColumnsDialog.cancelButtonText": "Cancel", "DE.Views.CustomColumnsDialog.okButtonText": "Ok", "DE.Views.CustomColumnsDialog.textColumns": "Number of columns", diff --git a/apps/documenteditor/main/resources/less/toolbar.less b/apps/documenteditor/main/resources/less/toolbar.less index 2465dda2f..db0e1ab91 100644 --- a/apps/documenteditor/main/resources/less/toolbar.less +++ b/apps/documenteditor/main/resources/less/toolbar.less @@ -395,7 +395,9 @@ text-overflow: ellipsis; } -#id-toolbar-menu-auto-fontcolor > a.selected { +#id-toolbar-menu-auto-fontcolor > a.selected, +#control-settings-system-color > a.selected, +#control-settings-system-color > a:hover { span { outline: 1px solid #000; border: 1px solid #fff; From a81de8611f464196beed7ebfdc818f42ea547798 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Wed, 27 Mar 2019 10:23:00 +0300 Subject: [PATCH 2/2] Fix Bug 40330 --- .../main/app/view/ControlSettingsDialog.js | 28 ++++++++----------- 1 file changed, 11 insertions(+), 17 deletions(-) diff --git a/apps/documenteditor/main/app/view/ControlSettingsDialog.js b/apps/documenteditor/main/app/view/ControlSettingsDialog.js index e58720538..5a21cd1c7 100644 --- a/apps/documenteditor/main/app/view/ControlSettingsDialog.js +++ b/apps/documenteditor/main/app/view/ControlSettingsDialog.js @@ -232,7 +232,6 @@ define([ this.btnColor.setColor(color); var clr_item = this.btnColor.menu.$el.find('#control-settings-system-color > a'); clr_item.hasClass('selected') && clr_item.removeClass('selected'); - this._isCanApplyColor = true; this.isSystemColor = false; }, @@ -250,7 +249,6 @@ define([ this.colors.clearSelection(); var clr_item = this.btnColor.menu.$el.find('#control-settings-system-color > a'); !clr_item.hasClass('selected') && clr_item.addClass('selected'); - this._isCanApplyColor = true; this.isSystemColor = true; }, @@ -275,7 +273,7 @@ define([ (val!==null && val!==undefined) && this.cmbShow.setValue(val); val = props.get_Color(); - this.isSystemColor = this._isCanApplyColor = !!val; + this.isSystemColor = (val===null); if (val) { val = Common.Utils.ThemeColor.getHexColor(val.get_r(), val.get_g(), val.get_b()); this.colors.selectByRGB(val,true); @@ -300,13 +298,11 @@ define([ props.put_Tag(this.txtTag.getValue()); props.put_Appearance(this.cmbShow.getValue()); - if (this._isCanApplyColor) { - if (this.isSystemColor) { - props.put_Color(null); - } else { - var color = Common.Utils.ThemeColor.getRgbColor(this.colors.getColor()); - props.put_Color(color.get_r(), color.get_g(), color.get_b()); - } + if (this.isSystemColor) { + props.put_Color(null); + } else { + var color = Common.Utils.ThemeColor.getRgbColor(this.colors.getColor()); + props.put_Color(color.get_r(), color.get_g(), color.get_b()); } var lock = Asc.c_oAscSdtLockType.Unlocked; @@ -336,13 +332,11 @@ define([ if (this.api) { var props = new AscCommon.CContentControlPr(); props.put_Appearance(this.cmbShow.getValue()); - if (this._isCanApplyColor) { - if (this.isSystemColor) { - props.put_Color(null); - } else { - var color = Common.Utils.ThemeColor.getRgbColor(this.colors.getColor()); - props.put_Color(color.get_r(), color.get_g(), color.get_b()); - } + if (this.isSystemColor) { + props.put_Color(null); + } else { + var color = Common.Utils.ThemeColor.getRgbColor(this.colors.getColor()); + props.put_Color(color.get_r(), color.get_g(), color.get_b()); } this.api.asc_SetContentControlProperties(props, null, true); }