diff --git a/apps/spreadsheeteditor/main/app/view/FormatRulesEditDlg.js b/apps/spreadsheeteditor/main/app/view/FormatRulesEditDlg.js index 7be8f519a..6f4f22643 100644 --- a/apps/spreadsheeteditor/main/app/view/FormatRulesEditDlg.js +++ b/apps/spreadsheeteditor/main/app/view/FormatRulesEditDlg.js @@ -51,8 +51,8 @@ define([ SSE.Views.FormatRulesEditDlg = Common.Views.AdvancedSettingsWindow.extend(_.extend({ options: { alias: 'FormatRulesEditDlg', - contentWidth: 480, - height: 350 + contentWidth: 490, + height: 445 }, initialize: function (options) { @@ -65,24 +65,24 @@ define([ '
', '
', '', - '', - '', - '', '', '', '', '', '', '', @@ -100,13 +100,13 @@ define([ '', '', '', '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', '
', - '', - '
', - '
', - '', - '
', + '
', + '', + '
', + '
', + '
', + '', + '
', + '
', '
', - '
', - '
', + '
', + '
', '
', - '
', + '
', '
', '
', - '
', + '
', '', '
', '
', '
', '
', - '
', + '
', '', '
', '
', @@ -120,6 +120,72 @@ define([ '
', '
', + '
', + '', + '
', + '
', + '
', + '
', + '', + '
', + '
', + '
', + '
', + '', + '
', + '
', + '', + '
', + '
', + '', + '
', + '
', + '
', + '', + '
', + '
', + '
', + '
', + '
', + '', + '
', + '
', + '', + '
', + '
', + '
', + '', + '
', + '
', + '
', + '
', + '
', + '', + '
', + '
', + '
', + '
', + '', + '
', + '', + '
', + '
', + '
', '
', '
', @@ -498,9 +564,9 @@ define([ for (var i=0; i<3; i++) { var arr = data; if (i==0) - arr = [{value: Asc.c_oAscCfvoType.Minimum, displayValue: 'Minimum'}].concat(arr); + arr = [{value: Asc.c_oAscCfvoType.Minimum, displayValue: this.textMinimum}].concat(arr); else if (i==2) - arr = [{value: Asc.c_oAscCfvoType.Maximum, displayValue: 'Maximum'}].concat(arr); + arr = [{value: Asc.c_oAscCfvoType.Maximum, displayValue: this.textMaximum}].concat(arr); var combo = new Common.UI.ComboBox({ el : $('#format-rules-edit-combo-scale-' + (i+1)), style : 'width: 100%;', @@ -537,6 +603,168 @@ define([ this.scaleControls.push({combo: combo, range: range, color: color}); } + // Data Bar + this.barControls = []; + + for (var i=0; i<2; i++) { + var arr = data; + if (i==0) { + arr = [{value: Asc.c_oAscCfvoType.Minimum, displayValue: this.textMinimum}].concat(arr); + arr.push({value: Asc.c_oAscCfvoType.AutoMin, displayValue: 'Automatic'}); + } else { + arr = [{value: Asc.c_oAscCfvoType.Maximum, displayValue: this.textMaximum}].concat(arr); + arr.push({value: Asc.c_oAscCfvoType.AutoMax, displayValue: 'Automatic'}); + } + var combo = new Common.UI.ComboBox({ + el : $('#format-rules-edit-combo-bar-' + (i+1)), + style : 'width: 100%;', + menuStyle : 'min-width: 100%;max-height: 211px;', + editable : false, + cls : 'input-group-nr', + data : arr, + type : i + }).on('selected', function(combo, record) { + me.barControls[combo.options.type].range.setDisabled(record.value==Asc.c_oAscCfvoType.Minimum || record.value==Asc.c_oAscCfvoType.Maximum || + record.value==Asc.c_oAscCfvoType.AutoMin || record.value==Asc.c_oAscCfvoType.AutoMax); + }); + combo.setValue(arr[1].value); + + var range = new Common.UI.InputFieldBtn({ + el : $('#format-rules-edit-txt-bar-' + (i+1)), + name : 'range', + style : 'width: 100%;', + allowBlank : true, + btnHint : this.textSelectData, + validateOnChange: false, + type : i + }); + range.setValue(''); + range.on('button:click', _.bind(this.onSelectData, this)); + this.barControls.push({combo: combo, range: range}); + } + + // Fill + this.cmbFill = new Common.UI.ComboBox({ + el : $('#format-rules-edit-combo-fill'), + style : 'width: 100%;', + menuStyle : 'min-width: 100%;max-height: 211px;', + editable : false, + cls : 'input-group-nr', + data : [ + {value: false, displayValue: 'Solid'}, + {value: true, displayValue: 'Gradient'} + ] + }).on('selected', function(combo, record) { + }); + this.cmbFill.setValue(false); + + this.btnPosFill = new Common.UI.ColorButton({ + style: "width:45px;", + menu : true + }); + this.btnPosFill.render( $('#format-rules-edit-color-pos-fill')); + this.btnPosFill.setColor('000000'); + + this.btnNegFill = new Common.UI.ColorButton({ + style: "width:45px;", + menu : true + }); + this.btnNegFill.render( $('#format-rules-edit-color-neg-fill')); + this.btnNegFill.setColor('000000'); + + this.chFill = new Common.UI.CheckBox({ + el: $('#format-rules-edit-chk-fill'), + labelText: 'Same as positive' + }); + this.chFill.on('change', function(field, newValue, oldValue, eOpts){ + me.btnNegFill.setDisabled(field.getValue()=='checked'); + }); + + // Border + this.cmbBorder = new Common.UI.ComboBox({ + el : $('#format-rules-edit-combo-border'), + style : 'width: 100%;', + menuStyle : 'min-width: 100%;max-height: 211px;', + editable : false, + cls : 'input-group-nr', + data : [ + {value: false, displayValue: 'Solid'}, + {value: true, displayValue: 'None'} + ] + }).on('selected', function(combo, record) { + me.btnPosBorder.setDisabled(record.value); + me.btnNegBorder.setDisabled(record.value || me.chBorder.getValue()=='checked'); + me.chBorder.setDisabled(record.value); + }); + this.cmbBorder.setValue(false); + + this.btnPosBorder = new Common.UI.ColorButton({ + style: "width:45px;", + menu : true + }); + this.btnPosBorder.render( $('#format-rules-edit-color-pos-border')); + this.btnPosBorder.setColor('000000'); + + this.btnNegBorder = new Common.UI.ColorButton({ + style: "width:45px;", + menu : true + }); + this.btnNegBorder.render( $('#format-rules-edit-color-neg-border')); + this.btnNegBorder.setColor('000000'); + + this.chBorder = new Common.UI.CheckBox({ + el: $('#format-rules-edit-chk-border'), + labelText: 'Same as positive' + }); + this.chBorder.on('change', function(field, newValue, oldValue, eOpts){ + me.btnNegBorder.setDisabled(field.getValue()=='checked'); + }); + + // Axis + this.cmbBarDirection = new Common.UI.ComboBox({ + el : $('#format-rules-edit-combo-direction'), + style : 'width: 100%;', + menuStyle : 'min-width: 100%;max-height: 211px;', + editable : false, + cls : 'input-group-nr', + data : [ + {value: Asc.c_oAscDataBarDirection.context, displayValue: 'Context'}, + {value: Asc.c_oAscDataBarDirection.leftToRight, displayValue: 'Left to right'}, + {value: Asc.c_oAscDataBarDirection.rightToLeft, displayValue: 'Right to left'} + ] + }).on('selected', function(combo, record) { + }); + this.cmbBarDirection.setValue(Asc.c_oAscDataBarDirection.context); + + this.chShowBar = new Common.UI.CheckBox({ + el: $('#format-rules-edit-chk-show-bar'), + labelText: 'Show bar only' + }); + // this.chShowBar.on('change', _.bind(this.onShowBarChange, this)); + + this.cmbAxisPos = new Common.UI.ComboBox({ + el : $('#format-rules-edit-combo-axis-pos'), + style : 'width: 150px;', + menuStyle : 'min-width: 100%;max-height: 211px;', + editable : false, + cls : 'input-group-nr', + data : [ + {value: Asc.c_oAscDataBarAxisPosition.automatic, displayValue: 'Automatic'}, + {value: Asc.c_oAscDataBarAxisPosition.middle, displayValue: 'Cell midpoint'}, + {value: Asc.c_oAscDataBarAxisPosition.none, displayValue: 'None'} + ] + }).on('selected', function(combo, record) { + me.btnAxisColor.setDisabled(record.value == Asc.c_oAscDataBarAxisPosition.none); + }); + this.cmbAxisPos.setValue(Asc.c_oAscDataBarDirection.context); + + this.btnAxisColor = new Common.UI.ColorButton({ + style: "width:45px;", + menu : true + }); + this.btnAxisColor.render( $('#format-rules-edit-color-axis-color')); + this.btnAxisColor.setColor('000000'); + this.afterRender(); }, @@ -556,6 +784,24 @@ define([ ruleType, subtype = this.subtype; + var setColor = function(color, control) { + color = Common.Utils.ThemeColor.colorValue2EffectId(color); + control.setColor(color); + if (_.isObject(color)) { + var isselected = false; + for (var j = 0; j < 10; j++) { + if (Common.Utils.ThemeColor.ThemeValues[i] == color.effectValue) { + control.colorPicker.select(color, true); + isselected = true; + break; + } + } + if (!isselected) control.colorPicker.clearSelection(); + } else { + control.colorPicker.select(color, true); + } + }; + if (props) { var value; switch (type) { @@ -608,24 +854,43 @@ define([ controls.combo.setValue(scaletype); controls.range.setDisabled(scaletype == Asc.c_oAscCfvoType.Minimum || scaletype == Asc.c_oAscCfvoType.Maximum); controls.range.setValue((scaletype !== Asc.c_oAscCfvoType.Minimum && scaletype !== Asc.c_oAscCfvoType.Maximum && val!==null && val!==undefined) ? val : ''); - controls.color.setColor(color); - if (_.isObject(color)) { - var isselected = false; - for (var j = 0; j < 10; j++) { - if (Common.Utils.ThemeColor.ThemeValues[i] == color.effectValue) { - controls.colorPicker.select(color, true); - isselected = true; - break; - } - } - if (!isselected) controls.colorPicker.clearSelection(); - } else { - controls.colorPicker.select(color, true); - } + setColor(color, controls.color); } break; case Asc.c_oAscCFType.dataBar: value = props.asc_getColorScaleOrDataBarOrIconSetRule(); + var bars = value.asc_getCFVOs(); + var arr = this.barControls; + for (var i=0; i') }, + { template: _.template('' + me.textNewColor + '') } + ] + })); + var colorPicker = new Common.UI.ThemeColorPalette({ + el: me.$window.find('#' + id), + transparent: false, + type: i + }); + colorPicker.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors()); + // btn.items[1].on('click', _.bind(this.addNewColor, this, colorPicker, btn)); + btn.colorPicker = colorPicker; + }; + initColor(this.btnPosFill); + // this.btnPosFill.colorPicker.on('select', _.bind(this.onBarColorsSelect, this)); + initColor(this.btnNegFill); + // this.btnNegFill.colorPicker.on('select', _.bind(this.onBarColorsSelect, this)); + initColor(this.btnPosBorder); + // this.btnPosBorder.colorPicker.on('select', _.bind(this.onBarColorsSelect, this)); + initColor(this.btnNegBorder); + // this.btnNegBorder.colorPicker.on('select', _.bind(this.onBarColorsSelect, this)); + initColor(this.btnAxisColor); + // this.btnAxisColor.colorPicker.on('select', _.bind(this.onAxisColorsSelect, this)); + this.mnuTextColorPicker.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors()); this.mnuFillColorPicker.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors()); }, @@ -833,7 +1130,10 @@ define([ fillColor: 'Background color', textMinpoint: 'Minpoint', textMidpoint: 'Midpoint', - textMaxpoint: 'Maxpoint' + textMaxpoint: 'Maxpoint', + textMinimum: 'Minimum', + textMaximum: 'Maximum', + textAppearance: 'Bar Appearance' }, SSE.Views.FormatRulesEditDlg || {})); }); \ No newline at end of file diff --git a/apps/spreadsheeteditor/main/app/view/FormatRulesManagerDlg.js b/apps/spreadsheeteditor/main/app/view/FormatRulesManagerDlg.js index 998335446..18282658c 100644 --- a/apps/spreadsheeteditor/main/app/view/FormatRulesManagerDlg.js +++ b/apps/spreadsheeteditor/main/app/view/FormatRulesManagerDlg.js @@ -344,7 +344,7 @@ define([ 'text!spreadsheeteditor/main/app/template/FormatRulesManagerDlg.templa }); me.hide(); - win.show(xy.left + 65, xy.top + 77); + win.show(); }, onDeleteRule: function () {