[DE] ColorButton: fix auto color

This commit is contained in:
Julia Radzhabova 2021-01-20 16:40:00 +03:00
parent 53868564d9
commit e90296cda1
2 changed files with 14 additions and 19 deletions

View file

@ -82,6 +82,8 @@ define([
}, },
setColor: function(color) { setColor: function(color) {
if (color == 'auto' && this.options.auto)
color = this.autocolor;
var span = $(this.cmpEl).find('button span:nth-child(1)'); var span = $(this.cmpEl).find('button span:nth-child(1)');
this.color = color; this.color = color;
@ -102,6 +104,7 @@ define([
if (this.options.auto) { if (this.options.auto) {
this.cmpEl.find('#' + this.menu.id + '-color-auto').on('click', _.bind(this.onAutoColorSelect, this)); this.cmpEl.find('#' + this.menu.id + '-color-auto').on('click', _.bind(this.onAutoColorSelect, this));
this.colorAuto = this.cmpEl.find('#' + this.menu.id + '-color-auto > a'); this.colorAuto = this.cmpEl.find('#' + this.menu.id + '-color-auto > a');
(color == 'auto') && this.setAutoColor(true);
} }
} }
return this.colorPicker; return this.colorPicker;
@ -148,7 +151,7 @@ define([
}, },
onAutoColorSelect: function() { onAutoColorSelect: function() {
this.setColor(this.autocolor); this.setColor('auto');
this.setAutoColor(true); this.setAutoColor(true);
this.colorPicker && this.colorPicker.clearSelection(); this.colorPicker && this.colorPicker.clearSelection();
this.trigger('auto:select', this, this.autocolor); this.trigger('auto:select', this, this.autocolor);
@ -162,6 +165,10 @@ define([
this.colorAuto.removeClass('selected'); this.colorAuto.removeClass('selected');
}, },
isAutoColor: function() {
return this.colorAuto && this.colorAuto.hasClass('selected');
},
textNewColor: 'Add New Custom Color', textNewColor: 'Add New Custom Color',
textAutoColor: 'Automatic' textAutoColor: 'Automatic'

View file

@ -132,10 +132,10 @@ define([ 'text!documenteditor/main/app/template/ControlSettingsDialog.template',
parentEl: $('#control-settings-color-btn'), parentEl: $('#control-settings-color-btn'),
auto: { auto: {
caption: this.textSystemColor, caption: this.textSystemColor,
color: 'dcdcdc' color: Common.Utils.ThemeColor.getHexColor(220, 220, 220)
}, },
additionalAlign: this.menuAddAlign, additionalAlign: this.menuAddAlign,
color: '000000', color: 'auto',
colors: ['000000', '993300', '333300', '003300', '003366', '000080', '333399', '333333', '800000', 'FF6600', colors: ['000000', '993300', '333300', '003300', '003366', '000080', '333399', '333333', '800000', 'FF6600',
'808000', '00FF00', '008080', '0000FF', '666699', '808080', 'FF0000', 'FF9900', '99CC00', '339966', '808000', '00FF00', '008080', '0000FF', '666699', '808080', 'FF0000', 'FF9900', '99CC00', '339966',
'33CCCC', '3366FF', '800080', '999999', 'FF00FF', 'FFCC00', 'FFFF00', '00FF00', '00FFFF', '00CCFF', '33CCCC', '3366FF', '800080', '999999', 'FF00FF', 'FFCC00', 'FFFF00', '00FF00', '00FFFF', '00CCFF',
@ -143,8 +143,6 @@ define([ 'text!documenteditor/main/app/template/ControlSettingsDialog.template',
], ],
paletteHeight: 94 paletteHeight: 94
}); });
this.btnColor.on('color:select', _.bind(this.onColorsSelect, this));
this.btnColor.on('auto:select', _.bind(this.onSystemColor, this));
this.colors = this.btnColor.getPicker(); this.colors = this.btnColor.getPicker();
this.btnApplyAll = new Common.UI.Button({ this.btnApplyAll = new Common.UI.Button({
@ -379,14 +377,6 @@ define([ 'text!documenteditor/main/app/template/ControlSettingsDialog.template',
}, 100); }, 100);
}, },
onColorsSelect: function(btn, color) {
this.isSystemColor = false;
},
onSystemColor: function(btn, color) {
this.isSystemColor = true;
},
afterRender: function() { afterRender: function() {
this.updateMetricUnit(); this.updateMetricUnit();
this._setDefaults(this.props); this._setDefaults(this.props);
@ -415,16 +405,14 @@ define([ 'text!documenteditor/main/app/template/ControlSettingsDialog.template',
(val!==null && val!==undefined) && this.cmbShow.setValue(val); (val!==null && val!==undefined) && this.cmbShow.setValue(val);
val = props.get_Color(); val = props.get_Color();
this.isSystemColor = (val===null);
if (val) { if (val) {
val = Common.Utils.ThemeColor.getHexColor(val.get_r(), val.get_g(), val.get_b()); val = Common.Utils.ThemeColor.getHexColor(val.get_r(), val.get_g(), val.get_b());
this.colors.selectByRGB(val,true); this.colors.selectByRGB(val,true);
this.btnColor.setAutoColor(false);
} else { } else {
this.colors.clearSelection(); this.colors.clearSelection();
this.btnColor.setAutoColor(true); val = 'auto';
val = Common.Utils.ThemeColor.getHexColor(220, 220, 220);
} }
this.btnColor.setAutoColor(val == 'auto');
this.btnColor.setColor(val); this.btnColor.setColor(val);
val = props.get_Lock(); val = props.get_Lock();
@ -559,7 +547,7 @@ define([ 'text!documenteditor/main/app/template/ControlSettingsDialog.template',
props.put_PlaceholderText(this.txtPlaceholder.getValue() || ' '); props.put_PlaceholderText(this.txtPlaceholder.getValue() || ' ');
props.put_Appearance(this.cmbShow.getValue()); props.put_Appearance(this.cmbShow.getValue());
if (this.isSystemColor) { if (this.btnColor.isAutoColor()) {
props.put_Color(null); props.put_Color(null);
} else { } else {
var color = Common.Utils.ThemeColor.getRgbColor(this.colors.getColor()); var color = Common.Utils.ThemeColor.getRgbColor(this.colors.getColor());
@ -669,7 +657,7 @@ define([ 'text!documenteditor/main/app/template/ControlSettingsDialog.template',
if (this.api) { if (this.api) {
var props = new AscCommon.CContentControlPr(); var props = new AscCommon.CContentControlPr();
props.put_Appearance(this.cmbShow.getValue()); props.put_Appearance(this.cmbShow.getValue());
if (this.isSystemColor) { if (this.btnColor.isAutoColor()) {
props.put_Color(null); props.put_Color(null);
} else { } else {
var color = Common.Utils.ThemeColor.getRgbColor(this.colors.getColor()); var color = Common.Utils.ThemeColor.getRgbColor(this.colors.getColor());