diff --git a/apps/common/main/lib/component/InputField.js b/apps/common/main/lib/component/InputField.js index 875a0704c4..d46057f613 100644 --- a/apps/common/main/lib/component/InputField.js +++ b/apps/common/main/lib/component/InputField.js @@ -498,6 +498,17 @@ define([ ? this._input.attr('disabled', true) : this._input.removeAttr('disabled'); this._button.setDisabled(disabled); + }, + + setBtnDisabled: function(disabled) { + this._button.setDisabled(disabled); + }, + + updateBtnHint: function(hint) { + this.options.hint = hint; + + if (!this.rendered) return; + this._button.updateHint(this.options.hint); } } })()); diff --git a/apps/common/main/resources/less/input.less b/apps/common/main/resources/less/input.less index cea867ac81..1500060e1b 100644 --- a/apps/common/main/resources/less/input.less +++ b/apps/common/main/resources/less/input.less @@ -96,6 +96,8 @@ textarea.form-control:focus { } .input-field-btn { + position: relative; + .select-button { position: absolute; top: 1px; diff --git a/apps/spreadsheeteditor/main/app/controller/Print.js b/apps/spreadsheeteditor/main/app/controller/Print.js index d5b06d30e5..2c913d7b54 100644 --- a/apps/spreadsheeteditor/main/app/controller/Print.js +++ b/apps/spreadsheeteditor/main/app/controller/Print.js @@ -170,8 +170,14 @@ define([ panel.dataRangeLeft = value; value = (this.api.asc_getActiveWorksheetIndex()==sheet); - (panel.btnPresetsTop.menu.items[0].value == 'select') && panel.btnPresetsTop.menu.items[0].setVisible(value); - (panel.btnPresetsLeft.menu.items[0].value == 'select') && panel.btnPresetsLeft.menu.items[0].setVisible(value); + if (panel.btnPresetsTop.menu.items[0].value == 'select') { + panel.btnPresetsTop.menu.items[0].setVisible(value); + panel.txtRangeTop.setBtnDisabled && panel.txtRangeTop.setBtnDisabled(!value); + } + if (panel.btnPresetsLeft.menu.items[0].value == 'select') { + panel.btnPresetsLeft.menu.items[0].setVisible(value); + panel.txtRangeLeft.setBtnDisabled && panel.txtRangeLeft.setBtnDisabled(!value); + } panel.btnPresetsTop.menu.items[panel.btnPresetsTop.menu.items[0].value == 'frozen' ? 0 : 1].setDisabled(!this.api.asc_getPrintTitlesRange(Asc.c_oAscPrintTitlesRangeType.frozen, false, sheet)); panel.btnPresetsLeft.menu.items[panel.btnPresetsLeft.menu.items[0].value == 'frozen' ? 0 : 1].setDisabled(!this.api.asc_getPrintTitlesRange(Asc.c_oAscPrintTitlesRangeType.frozen, true, sheet)); @@ -380,6 +386,8 @@ define([ panel.chPrintRows.on('change', _.bind(this.propertyChange, this, panel)); panel.txtRangeTop.on('changing', _.bind(this.propertyChange, this, panel)); panel.txtRangeLeft.on('changing', _.bind(this.propertyChange, this, panel)); + panel.txtRangeTop.on('button:click', _.bind(this.onPresetSelect, this, panel, 'top', panel.btnPresetsTop.menu, {value: 'select'})); + panel.txtRangeLeft.on('button:click', _.bind(this.onPresetSelect, this, panel, 'left', panel.btnPresetsLeft.menu, {value: 'select'})); panel.btnPresetsTop.menu.on('item:click', _.bind(this.onPresetSelect, this, panel, 'top')); panel.btnPresetsLeft.menu.on('item:click', _.bind(this.onPresetSelect, this, panel, 'left')); }, @@ -446,6 +454,8 @@ define([ var isvalid = me.api.asc_checkDataRange(Asc.c_oAscSelectionDialogType.PrintTitles, value, false); return (isvalid==Asc.c_oAscError.ID.DataRangeError) ? me.textInvalidRange : true; }; + selectdata && panel.txtRangeTop.updateBtnHint(this.textSelectRange); + panel.txtRangeLeft.validation = function(value) { me.propertyChange(panel); if (_.isEmpty(value)) { @@ -454,6 +464,8 @@ define([ var isvalid = me.api.asc_checkDataRange(Asc.c_oAscSelectionDialogType.PrintTitles, value, false); return (isvalid==Asc.c_oAscError.ID.DataRangeError) ? me.textInvalidRange : true; }; + selectdata && panel.txtRangeLeft.updateBtnHint(this.textSelectRange); + var data = ((selectdata) ? [{caption: this.textSelectRange, value: 'select'}] : []).concat([ {caption: this.textFrozenRows, value: 'frozen'}, {caption: this.textFirstRow, value: 'first'}, diff --git a/apps/spreadsheeteditor/main/app/template/ChartSettingsDlg.template b/apps/spreadsheeteditor/main/app/template/ChartSettingsDlg.template index 37f163ce8d..3f2e877d25 100644 --- a/apps/spreadsheeteditor/main/app/template/ChartSettingsDlg.template +++ b/apps/spreadsheeteditor/main/app/template/ChartSettingsDlg.template @@ -11,9 +11,9 @@
- +
- @@ -21,12 +21,9 @@ - - @@ -341,12 +338,9 @@ - + - - - @@ -354,12 +348,9 @@ - + - - - diff --git a/apps/spreadsheeteditor/main/app/template/PivotSettingsAdvanced.template b/apps/spreadsheeteditor/main/app/template/PivotSettingsAdvanced.template index ffc7f6aa1a..cfc007e428 100644 --- a/apps/spreadsheeteditor/main/app/template/PivotSettingsAdvanced.template +++ b/apps/spreadsheeteditor/main/app/template/PivotSettingsAdvanced.template @@ -58,18 +58,15 @@
-
+
- -
+
+
- -
+
-
-
- +
diff --git a/apps/spreadsheeteditor/main/app/view/ChartSettingsDlg.js b/apps/spreadsheeteditor/main/app/view/ChartSettingsDlg.js index 40c9eff965..81871d9891 100644 --- a/apps/spreadsheeteditor/main/app/view/ChartSettingsDlg.js +++ b/apps/spreadsheeteditor/main/app/view/ChartSettingsDlg.js @@ -148,18 +148,15 @@ define([ 'text!spreadsheeteditor/main/app/template/ChartSettingsDlg.template' ] }); - this.txtDataRange = new Common.UI.InputField({ + this.txtDataRange = new Common.UI.InputFieldBtn({ el : $('#chart-dlg-txt-range'), name : 'range', style : 'width: 100%;', + btnHint : this.textSelectData, allowBlank : true, validateOnChange: true }); - - this.btnSelectData = new Common.UI.Button({ - el: $('#chart-dlg-btn-data') - }); - this.btnSelectData.on('click', _.bind(this.onSelectData, this)); + this.txtDataRange.on('button:click', _.bind(this.onSelectData, this)); this.cmbChartTitle = new Common.UI.ComboBox({ el : $('#chart-dlg-combo-chart-title'), @@ -791,33 +788,27 @@ define([ 'text!spreadsheeteditor/main/app/template/ChartSettingsDlg.template' name: 'asc-radio-sparkline' }); - this.txtSparkDataRange = new Common.UI.InputField({ + this.txtSparkDataRange = new Common.UI.InputFieldBtn({ el : $('#spark-dlg-txt-range'), name : 'range', style : 'width: 100%;', + btnHint : this.textSelectData, allowBlank : true, blankError : this.txtEmpty, validateOnChange: true }); + this.txtSparkDataRange.on('button:click', _.bind(this.onSelectSparkData, this)); - this.btnSelectSparkData = new Common.UI.Button({ - el: $('#spark-dlg-btn-data') - }); - this.btnSelectSparkData.on('click', _.bind(this.onSelectSparkData, this)); - - this.txtSparkDataLocation = new Common.UI.InputField({ + this.txtSparkDataLocation = new Common.UI.InputFieldBtn({ el : $('#spark-dlg-txt-location'), name : 'range', style : 'width: 100%;', + btnHint : this.textSelectData, allowBlank : true, blankError : this.txtEmpty, validateOnChange: true }); - - this.btnSelectLocationData = new Common.UI.Button({ - el: $('#spark-dlg-btn-location-data') - }); - this.btnSelectLocationData.on('click', _.bind(this.onSelectLocationData, this)); + this.txtSparkDataLocation.on('button:click', _.bind(this.onSelectLocationData, this)); */ this._arrEmptyCells = [ diff --git a/apps/spreadsheeteditor/main/app/view/CreatePivotDialog.js b/apps/spreadsheeteditor/main/app/view/CreatePivotDialog.js index d8048ca655..8b4601aeba 100644 --- a/apps/spreadsheeteditor/main/app/view/CreatePivotDialog.js +++ b/apps/spreadsheeteditor/main/app/view/CreatePivotDialog.js @@ -47,7 +47,7 @@ define([ SSE.Views.CreatePivotDialog = Common.Views.AdvancedSettingsWindow.extend(_.extend({ options: { - contentWidth: 330, + contentWidth: 310, height: 250 }, @@ -68,8 +68,7 @@ define([ '', '', '', - '
', - '', + '
', '', '', '', @@ -88,9 +87,8 @@ define([ '', '', '', - '', - '
', - '', + '', + '
', '', '', '', @@ -122,34 +120,27 @@ define([ Common.Views.AdvancedSettingsWindow.prototype.render.call(this); var me = this; - this.txtSourceRange = new Common.UI.InputField({ + this.txtSourceRange = new Common.UI.InputFieldBtn({ el : $('#create-pivot-input-source'), name : 'range', style : 'width: 100%;', + btnHint : this.textSelectData, allowBlank : true, validateOnChange: true }); + this.txtSourceRange.on('button:click', _.bind(this.onSelectData, this, 'source')); - this.btnSelectSource = new Common.UI.Button({ - el: $('#create-pivot-btn-source') - }); - this.btnSelectSource.on('click', _.bind(this.onSelectData, this, 'source')); - - this.txtDestRange = new Common.UI.InputField({ + this.txtDestRange = new Common.UI.InputFieldBtn({ el : $('#create-pivot-input-dest'), name : 'range', style : 'width: 100%;', + btnHint : this.textSelectData, allowBlank : true, validateOnChange: true, validateOnBlur: false, disabled: true }); - - this.btnSelectDest = new Common.UI.Button({ - el: $('#create-pivot-btn-dest'), - disabled: true - }); - this.btnSelectDest.on('click', _.bind(this.onSelectData, this, 'dest')); + this.txtDestRange.on('button:click', _.bind(this.onSelectData, this, 'dest')); this.radioNew = new Common.UI.RadioBox({ el: $('#create-pivot-radio-new'), @@ -158,7 +149,6 @@ define([ checked: true }).on('change', function(field, newValue) { me.txtDestRange.setDisabled(newValue); - me.btnSelectDest.setDisabled(newValue); me.txtDestRange.showError(); }); @@ -168,7 +158,6 @@ define([ name: 'asc-radio-pivot-dest' }).on('change', function(field, newValue) { me.txtDestRange.setDisabled(!newValue); - me.btnSelectDest.setDisabled(!newValue); me.txtDestRange.cmpEl.find('input').focus(); }); diff --git a/apps/spreadsheeteditor/main/app/view/HyperlinkSettingsDialog.js b/apps/spreadsheeteditor/main/app/view/HyperlinkSettingsDialog.js index bdfc83d334..6cc6b2bb5e 100644 --- a/apps/spreadsheeteditor/main/app/view/HyperlinkSettingsDialog.js +++ b/apps/spreadsheeteditor/main/app/view/HyperlinkSettingsDialog.js @@ -90,10 +90,7 @@ define([ '
', '', '
', - '
', - '', - '', - '
', + '', '
', '
', '', @@ -157,11 +154,12 @@ define([ me.btnOk.setDisabled($.trim(val)==''); }); - me.inputRange = new Common.UI.InputField({ + me.inputRange = new Common.UI.InputFieldBtn({ el : $('#id-dlg-hyperlink-range'), allowBlank : false, blankError : me.txtEmpty, style : 'width: 100%;', + btnHint : me.textSelectData, validateOnChange: true, validateOnBlur: false, value: Common.Utils.InternalSettings.get("sse-settings-r1c1") ? 'R1C1' : 'A1', @@ -183,6 +181,7 @@ define([ me.isAutoUpdate && me.inputDisplay.setValue(me.internalList.getSelectedRec().get('name') + (val!=='' ? '!' + val : '')); me.btnOk.setDisabled($.trim(val)==''); }); + me.inputRange.on('button:click', _.bind(me.onSelectData, me)); me.inputDisplay = new Common.UI.InputField({ el : $('#id-dlg-hyperlink-display'), @@ -207,11 +206,6 @@ define([ }); me.internalList.on('item:select', _.bind(this.onSelectItem, this)); - me.btnSelectData = new Common.UI.Button({ - el: $('#id-dlg-hyperlink-btn-data') - }); - me.btnSelectData.on('click', _.bind(me.onSelectData, me)); - if (me.appOptions && me.appOptions.canMakeActionLink) { var inputCopy = new Common.UI.InputField({ el : $('#id-dlg-clip-copy'), @@ -289,7 +283,6 @@ define([ defrange = settings.props.asc_getSheet() + '!' + settings.props.asc_getRange(); } else {// named range this.inputRange.setDisabled(true); - this.btnSelectData.setDisabled(true); defrange = settings.props.asc_getLocation(); } } else { @@ -481,7 +474,6 @@ define([ onSelectItem: function(picker, item, record, e){ this.btnOk.setDisabled(record.get('level')==0 || record.get('type')==0 && $.trim(this.inputRange.getValue())==''); this.inputRange.setDisabled(record.get('type')==1 || record.get('level')==0); - this.btnSelectData.setDisabled(record.get('type')==1 || record.get('level')==0); if (this.isAutoUpdate) { var list = record.get('level') ? record.get('name') : ''; if (record.get('type')==1) { diff --git a/apps/spreadsheeteditor/main/app/view/NamedRangeEditDlg.js b/apps/spreadsheeteditor/main/app/view/NamedRangeEditDlg.js index 0753998121..9c471fed8c 100644 --- a/apps/spreadsheeteditor/main/app/view/NamedRangeEditDlg.js +++ b/apps/spreadsheeteditor/main/app/view/NamedRangeEditDlg.js @@ -64,29 +64,26 @@ define([ '
', '
', '
', - '', + '
', '', - '', '', '', - '', '', '', - '', '', '', '', - '', '', '
', + '', '', '
', '
', + '', '', '
', '
', + '', '', '
', - '
', - '
', - '', + '
', '
', @@ -156,11 +153,12 @@ define([ data : [] }); - this.txtDataRange = new Common.UI.InputField({ + this.txtDataRange = new Common.UI.InputFieldBtn({ el : $('#named-range-txt-range'), name : 'range', style : 'width: 100%;', allowBlank : true, + btnHint : this.textSelectData, blankError : this.txtEmpty, validateOnChange: true, validation : function(value) { @@ -171,11 +169,7 @@ define([ return (isvalid!==Asc.c_oAscError.ID.DataRangeError || (me.isEdit && me.props.asc_getRef().toLowerCase() == value.toLowerCase())) ? true : me.textInvalidRange; } }); - - this.btnSelectData = new Common.UI.Button({ - el: $('#named-range-btn-data') - }); - this.btnSelectData.on('click', _.bind(this.onSelectData, this)); + this.txtDataRange.on('button:click', _.bind(this.onSelectData, this)); this.afterRender(); }, @@ -212,7 +206,6 @@ define([ this.dataRangeValid = val; this.txtDataRange.setDisabled(this.isEdit && props.asc_getIsTable()); - this.btnSelectData.setDisabled(this.isEdit && props.asc_getIsTable()); } else this.cmbScope.setValue(-255); diff --git a/apps/spreadsheeteditor/main/app/view/PivotSettingsAdvanced.js b/apps/spreadsheeteditor/main/app/view/PivotSettingsAdvanced.js index 500d8e07b6..c32910f452 100644 --- a/apps/spreadsheeteditor/main/app/view/PivotSettingsAdvanced.js +++ b/apps/spreadsheeteditor/main/app/view/PivotSettingsAdvanced.js @@ -148,19 +148,16 @@ define([ 'text!spreadsheeteditor/main/app/template/PivotSettingsAdvanced.temp labelText: this.textShowHeaders }); - this.txtDataRange = new Common.UI.InputField({ + this.txtDataRange = new Common.UI.InputFieldBtn({ el : $('#pivot-adv-txt-range'), name : 'range', style : 'width: 100%;', + btnHint : this.textSelectData, allowBlank : true, blankError : this.txtEmpty, validateOnChange: true }); - - this.btnSelectData = new Common.UI.Button({ - el: $('#pivot-adv-btn-data') - }); - this.btnSelectData.on('click', _.bind(this.onSelectData, this)); + this.txtDataRange.on('button:click', _.bind(this.onSelectData, this)); // Alt Text diff --git a/apps/spreadsheeteditor/main/app/view/PrintSettings.js b/apps/spreadsheeteditor/main/app/view/PrintSettings.js index dcc0946927..9d3568cdb6 100644 --- a/apps/spreadsheeteditor/main/app/view/PrintSettings.js +++ b/apps/spreadsheeteditor/main/app/view/PrintSettings.js @@ -229,7 +229,7 @@ define([ 'text!spreadsheeteditor/main/app/template/PrintSettings.template', itemsTemplate: itemsTemplate }); - this.txtRangeTop = new Common.UI.InputField({ + this.txtRangeTop = new Common.UI.InputFieldBtn({ el : $('#printadv-dlg-txt-top'), style : 'width: 147px;', allowBlank : true, @@ -244,7 +244,7 @@ define([ 'text!spreadsheeteditor/main/app/template/PrintSettings.template', }); this.btnPresetsTop.render( $('#printadv-dlg-presets-top')) ; - this.txtRangeLeft = new Common.UI.InputField({ + this.txtRangeLeft = new Common.UI.InputFieldBtn({ el : $('#printadv-dlg-txt-left'), style : 'width: 147px;', allowBlank : true, diff --git a/apps/spreadsheeteditor/main/app/view/PrintTitlesDialog.js b/apps/spreadsheeteditor/main/app/view/PrintTitlesDialog.js index 3bc77a06e5..3c126c41fc 100644 --- a/apps/spreadsheeteditor/main/app/view/PrintTitlesDialog.js +++ b/apps/spreadsheeteditor/main/app/view/PrintTitlesDialog.js @@ -120,9 +120,10 @@ define([ } }; - this.txtRangeTop = new Common.UI.InputField({ + this.txtRangeTop = new Common.UI.InputFieldBtn({ el : $('#print-titles-txt-top'), style : 'width: 100%;', + btnHint : this.textSelectRange, allowBlank : true, validateOnChange: true, validation : function(value) { @@ -154,10 +155,12 @@ define([ }); this.btnPresetsTop.render( $('#print-titles-presets-top')) ; this.btnPresetsTop.menu.on('item:click', _.bind(this.onPresetSelect, this, 'top')); + this.txtRangeTop.on('button:click', _.bind(this.onPresetSelect, this, 'top', this.btnPresetsTop.menu, {value: 'select'})); - this.txtRangeLeft = new Common.UI.InputField({ + this.txtRangeLeft = new Common.UI.InputFieldBtn({ el : $('#print-titles-txt-left'), style : 'width: 100%;', + btnHint : this.textSelectRange, allowBlank : true, validateOnChange: true, validation : function(value) { @@ -189,6 +192,7 @@ define([ }); this.btnPresetsLeft.render( $('#print-titles-presets-left')) ; this.btnPresetsLeft.menu.on('item:click', _.bind(this.onPresetSelect, this, 'left')); + this.txtRangeLeft.on('button:click', _.bind(this.onPresetSelect, this, 'left', this.btnPresetsLeft.menu, {value: 'select'})); var $window = this.getChild(); $window.find('.dlg-btn').on('click', _.bind(this.onBtnClick, this));