diff --git a/apps/common/main/lib/component/ComboBox.js b/apps/common/main/lib/component/ComboBox.js index b7e7da1d5..f86049013 100644 --- a/apps/common/main/lib/component/ComboBox.js +++ b/apps/common/main/lib/component/ComboBox.js @@ -112,6 +112,7 @@ define([ this.menuCls = me.options.menuCls; this.menuStyle = me.options.menuStyle; this.template = me.options.template || me.template; + this.itemsTemplate = me.options.itemsTemplate; this.hint = me.options.hint; this.editable = me.options.editable; this.disabled = me.options.disabled; @@ -134,15 +135,22 @@ define([ var me = this; if (!me.rendered) { + var items = this.store.toJSON(); this.cmpEl = $(this.template({ id : this.id, cls : this.cls, style : this.style, menuCls : this.menuCls, menuStyle : this.menuStyle, - items : this.store.toJSON(), + items : items, scope : me })); + if (this.itemsTemplate) + this.cmpEl.find('ul').append( + $(this.itemsTemplate({ + items : items, + scope : me + }))); if (parentEl) { this.setElement(parentEl, false); @@ -274,7 +282,7 @@ define([ } if (this.scroller) - this.scroller.update(); + this.scroller.update({alwaysVisibleY: this.scrollAlwaysVisible}); this.trigger('show:after', this, e); }, @@ -441,7 +449,7 @@ define([ return this.rendered ? this._input.val() : null; }, - setValue: function(value) { + setValue: function(value, defValue) { if (!this.rendered) return; @@ -454,7 +462,7 @@ define([ this.setRawValue(this._selectedItem.get(this.displayField)); $('#' + this._selectedItem.get('id'), $(this.el)).addClass('selected'); } else { - this.setRawValue(value); + this.setRawValue((defValue!==undefined) ? defValue : value); } }, @@ -529,14 +537,21 @@ define([ }, onResetItems: function() { - $(this.el).find('ul').html(_.template([ - '<% _.each(items, function(item) { %>', - '
  • <%= scope.getDisplayValue(item) %>
  • ', - '<% }); %>' - ].join(''), { - items: this.store.toJSON(), - scope: this - })); + if (this.itemsTemplate) { + $(this.el).find('ul').html( $(this.itemsTemplate({ + items: this.store.toJSON(), + scope: this + }))); + } else { + $(this.el).find('ul').html(_.template([ + '<% _.each(items, function(item) { %>', + '
  • <%= scope.getDisplayValue(item) %>
  • ', + '<% }); %>' + ].join(''), { + items: this.store.toJSON(), + scope: this + })); + } if (!_.isUndefined(this.scroller)) { this.scroller.destroy(); diff --git a/apps/spreadsheeteditor/main/app/controller/Toolbar.js b/apps/spreadsheeteditor/main/app/controller/Toolbar.js index e6ec0d782..5f5644d17 100644 --- a/apps/spreadsheeteditor/main/app/controller/Toolbar.js +++ b/apps/spreadsheeteditor/main/app/controller/Toolbar.js @@ -50,7 +50,8 @@ define([ 'spreadsheeteditor/main/app/view/TableOptionsDialog', 'spreadsheeteditor/main/app/view/NamedRangeEditDlg', 'spreadsheeteditor/main/app/view/NamedRangePasteDlg', - 'spreadsheeteditor/main/app/view/NameManagerDlg' + 'spreadsheeteditor/main/app/view/NameManagerDlg', + 'spreadsheeteditor/main/app/view/FormatSettingsDialog' ], function () { 'use strict'; SSE.Controllers.Toolbar = Backbone.Controller.extend(_.extend({ @@ -101,7 +102,9 @@ define([ namedrange_locked: false, fontsize: undefined, multiselect: false, - sparklines_disabled: false + sparklines_disabled: false, + numformattype: undefined, + langId: undefined }; var checkInsertAutoshape = function(e, action) { @@ -252,19 +255,16 @@ define([ if (toolbar.mnuZoomOut) toolbar.mnuZoomOut.on('click', _.bind(this.onZoomOutClick, this)); if (toolbar.btnShowMode.rendered) toolbar.btnShowMode.menu.on('item:click', _.bind(this.onHideMenu, this)); toolbar.listStyles.on('click', _.bind(this.onListStyleSelect, this)); - if (toolbar.btnNumberFormat.rendered) toolbar.btnNumberFormat.menu.on('item:click', _.bind(this.onNumberFormatMenu, this)); + toolbar.cmbNumberFormat.on('selected', _.bind(this.onNumberFormatSelect, this)); + toolbar.cmbNumberFormat.on('show:before', _.bind(this.onNumberFormatOpenBefore, this, true)); + if (toolbar.cmbNumberFormat.cmpEl) + toolbar.cmbNumberFormat.cmpEl.on('click', '#id-toolbar-mnu-item-more-formats a', _.bind(this.onNumberFormatSelect, this)); toolbar.btnCurrencyStyle.menu.on('item:click', _.bind(this.onNumberFormatMenu, this)); if (toolbar.mnuitemCompactToolbar) toolbar.mnuitemCompactToolbar.on('toggle', _.bind(this.onChangeViewMode, this)); $('#id-toolbar-menu-new-fontcolor').on('click', _.bind(this.onNewTextColor, this)); $('#id-toolbar-menu-new-paracolor').on('click', _.bind(this.onNewBackColor, this)); $('#id-toolbar-menu-new-bordercolor').on('click', _.bind(this.onNewBorderColor, this)); - _.each(toolbar.btnNumberFormat.menu.items, function(item) { - if (item.menu) { - item.menu.on('item:click', _.bind(me.onNumberFormatMenu, me)); - } - }); - this.onSetupCopyStyleButton(); }, @@ -885,6 +885,63 @@ define([ Common.component.Analytics.trackEvent('ToolBar', 'Number Format'); }, + onNumberFormatSelect: function(combo, record) { + if (record) { + if (this.api) + this.api.asc_setCellFormat(record.format); + } else { + this.onCustomNumberFormat(); + } + Common.NotificationCenter.trigger('edit:complete', this.toolbar); + Common.component.Analytics.trackEvent('ToolBar', 'Number Format'); + }, + + onCustomNumberFormat: function() { + var me = this, + value = Common.localStorage.getItem("sse-settings-reg-settings"); + value = (value!==null) ? parseInt(value) : ((me.toolbar.mode.lang) ? parseInt(Common.util.LanguageInfo.getLocalLanguageCode(me.toolbar.mode.lang)) : 0x0409); + + (new SSE.Views.FormatSettingsDialog({ + api: me.api, + handler: function(result, settings) { + if (settings) { + me.api.asc_setCellFormat(settings.format); + } + Common.NotificationCenter.trigger('edit:complete', me.toolbar); + }, + props : {formatType: me._state.numformattype, langId: value} + })).show(); + Common.NotificationCenter.trigger('edit:complete', this.toolbar); + Common.component.Analytics.trackEvent('ToolBar', 'Number Format'); + }, + + onNumberFormatOpenBefore: function(combo) { + if (this.api) { + var me = this; + + var value = Common.localStorage.getItem("sse-settings-reg-settings"); + value = (value!==null) ? parseInt(value) : ((this.toolbar.mode.lang) ? parseInt(Common.util.LanguageInfo.getLocalLanguageCode(this.toolbar.mode.lang)) : 0x0409); + + if (this._state.langId !== value) { + this._state.langId = value; + + var info = new Asc.asc_CFormatCellsInfo(); + info.asc_setType(Asc.c_oAscNumFormatType.None); + info.asc_setSymbol(this._state.langId); + var arr = this.api.asc_getFormatCells(info); // all formats + me.toolbar.numFormatData.forEach( function(item, index) { + me.toolbar.numFormatData[index].format = arr[index]; + }); + } + + me.toolbar.numFormatData.forEach( function(item, index) { + item.exampleval = me.api.asc_getLocaleExample(item.format); + }); + me.toolbar.cmbNumberFormat.setData(me.toolbar.numFormatData); + me.toolbar.cmbNumberFormat.setValue(me._state.numformattype, me.toolbar.txtCustom); + } + }, + onDecrement: function(btn) { if (this.api) this.api.asc_decreaseCellDigitNumbers(); @@ -1238,6 +1295,13 @@ define([ if (me.editMode && !me.toolbar.mode.isEditMailMerge && !me.toolbar.mode.isEditDiagram && !me.api.isCellEdited && !me._state.multiselect) me.onHyperlink(); e.preventDefault(); + }, + 'command+1,ctrl+1': function(e) { + if (me.editMode && !me.toolbar.mode.isEditMailMerge && !me.api.isCellEdited && !me.toolbar.cmbNumberFormat.isDisabled()) { + me.onCustomNumberFormat(); + } + + return false; } } }); @@ -1459,7 +1523,7 @@ define([ var toolbar = this.toolbar; if (toolbar.mode.isEditDiagram || toolbar.mode.isEditMailMerge) { is_cell_edited = (state == Asc.c_oAscCellEditorState.editStart); - toolbar.lockToolbar(SSE.enumLock.editCell, state == Asc.c_oAscCellEditorState.editStart, {array: [toolbar.btnDecDecimal,toolbar.btnIncDecimal,toolbar.btnNumberFormat]}); + toolbar.lockToolbar(SSE.enumLock.editCell, state == Asc.c_oAscCellEditorState.editStart, {array: [toolbar.btnDecDecimal,toolbar.btnIncDecimal,toolbar.cmbNumberFormat]}); } else if (state == Asc.c_oAscCellEditorState.editStart || state == Asc.c_oAscCellEditorState.editEnd) { toolbar.lockToolbar(SSE.enumLock.editCell, state == Asc.c_oAscCellEditorState.editStart, { @@ -1477,8 +1541,8 @@ define([ }); var is_cell_edited = (state == Asc.c_oAscCellEditorState.editStart); - (is_cell_edited) ? Common.util.Shortcuts.suspendEvents('command+l, ctrl+l, command+shift+l, ctrl+shift+l, command+k, ctrl+k, alt+h') : - Common.util.Shortcuts.resumeEvents('command+l, ctrl+l, command+shift+l, ctrl+shift+l, command+k, ctrl+k, alt+h'); + (is_cell_edited) ? Common.util.Shortcuts.suspendEvents('command+l, ctrl+l, command+shift+l, ctrl+shift+l, command+k, ctrl+k, alt+h, command+1, ctrl+1') : + Common.util.Shortcuts.resumeEvents('command+l, ctrl+l, command+shift+l, ctrl+shift+l, command+k, ctrl+k, alt+h, command+1, ctrl+1'); if (is_cell_edited) { toolbar.listStyles.suspendEvents(); @@ -1871,12 +1935,11 @@ define([ toolbar.lockToolbar(SSE.enumLock.multiselect, this._state.multiselect, { array: [toolbar.btnTableTemplate, toolbar.btnInsertHyperlink]}); } - fontparam = toolbar.numFormatTypes[info.asc_getNumFormatType()]; - - if (!fontparam) - fontparam = toolbar.numFormatTypes[1]; - - toolbar.btnNumberFormat.setCaption(fontparam); + val = info.asc_getNumFormatType(); + if (this._state.numformattype !== val) { + toolbar.cmbNumberFormat.setValue(val, toolbar.txtCustom); + this._state.numformattype = val; + } val = info.asc_getAngle(); if (this._state.angle !== val) { @@ -2532,10 +2595,10 @@ define([ var left = toolbar.isCompactView ? 75 : (toolbar.mode.nativeApp ? 80 : 48 ); mask.css('left', left + 'px'); mask.css('right', (toolbar.isCompactView ? 0 : 45) + 'px'); - Common.util.Shortcuts.suspendEvents('command+l, ctrl+l, command+shift+l, ctrl+shift+l, command+k, ctrl+k, command+alt+h, ctrl+alt+h'); + Common.util.Shortcuts.suspendEvents('command+l, ctrl+l, command+shift+l, ctrl+shift+l, command+k, ctrl+k, command+alt+h, ctrl+alt+h, command+1, ctrl+1'); } else { mask.remove(); - Common.util.Shortcuts.resumeEvents('command+l, ctrl+l, command+shift+l, ctrl+shift+l, command+k, ctrl+k, command+alt+h, ctrl+alt+h'); + Common.util.Shortcuts.resumeEvents('command+l, ctrl+l, command+shift+l, ctrl+shift+l, command+k, ctrl+k, command+alt+h, ctrl+alt+h, command+1, ctrl+1'); } }, diff --git a/apps/spreadsheeteditor/main/app/template/Toolbar.template b/apps/spreadsheeteditor/main/app/template/Toolbar.template index 45a6cf555..e32978c2d 100644 --- a/apps/spreadsheeteditor/main/app/template/Toolbar.template +++ b/apps/spreadsheeteditor/main/app/template/Toolbar.template @@ -22,7 +22,7 @@
    - +
    @@ -124,7 +124,7 @@
    - +
    @@ -249,7 +249,7 @@
    - +
    diff --git a/apps/spreadsheeteditor/main/app/view/FileMenuPanels.js b/apps/spreadsheeteditor/main/app/view/FileMenuPanels.js index 71eebd591..5cec300a5 100644 --- a/apps/spreadsheeteditor/main/app/view/FileMenuPanels.js +++ b/apps/spreadsheeteditor/main/app/view/FileMenuPanels.js @@ -754,7 +754,16 @@ define([ updateRegionalExample: function(landId) { if (this.api) { - var text = (landId) ? this.api.asc_getLocaleExample(landId, 1000.01, new Date()) : ''; + var text = ''; + if (landId) { + var info = new Asc.asc_CFormatCellsInfo(); + info.asc_setType(Asc.c_oAscNumFormatType.None); + info.asc_setSymbol(landId); + var arr = this.api.asc_getFormatCells(info); // all formats + text = this.api.asc_getLocaleExample(arr[4], 1000.01, landId); + text = text + ' ' + this.api.asc_getLocaleExample(arr[5], (new Date()).getExcelDateWithTime(), landId); + text = text + ' ' + this.api.asc_getLocaleExample(arr[6], (new Date()).getExcelDateWithTime(), landId); + } $('#fms-lbl-reg-settings').text(_.isEmpty(text) ? '' : this.strRegSettingsEx + text); } }, diff --git a/apps/spreadsheeteditor/main/app/view/FormatSettingsDialog.js b/apps/spreadsheeteditor/main/app/view/FormatSettingsDialog.js new file mode 100644 index 000000000..33012cc72 --- /dev/null +++ b/apps/spreadsheeteditor/main/app/view/FormatSettingsDialog.js @@ -0,0 +1,485 @@ +/* + * + * (c) Copyright Ascensio System Limited 2010-2017 + * + * This program is a free software product. You can redistribute it and/or + * modify it under the terms of the GNU Affero General Public License (AGPL) + * version 3 as published by the Free Software Foundation. In accordance with + * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect + * that Ascensio System SIA expressly excludes the warranty of non-infringement + * of any third-party rights. + * + * This program is distributed WITHOUT ANY WARRANTY; without even the implied + * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. For + * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html + * + * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia, + * EU, LV-1021. + * + * The interactive user interfaces in modified source and object code versions + * of the Program must display Appropriate Legal Notices, as required under + * Section 5 of the GNU AGPL version 3. + * + * Pursuant to Section 7(b) of the License you must retain the original Product + * logo when distributing the program. Pursuant to Section 7(e) we decline to + * grant you any rights under trademark law for use of our trademarks. + * + * All the Product's GUI elements, including illustrations and icon sets, as + * well as technical writing content are licensed under the terms of the + * Creative Commons Attribution-ShareAlike 4.0 International. See the License + * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode + * + */ + +/** + * FormatSettingsDialog.js + * + * Created by Julia Radzhabova on 13.01.2017 + * Copyright (c) 2017 Ascensio System SIA. All rights reserved. + * + */ + +define([ + 'common/main/lib/util/utils', + 'common/main/lib/component/MetricSpinner', + 'common/main/lib/component/ComboBox', + 'common/main/lib/view/AdvancedSettingsWindow' +], function () { 'use strict'; + + SSE.Views.FormatSettingsDialog = Common.Views.AdvancedSettingsWindow.extend(_.extend({ + options: { + contentWidth: 284, + height: 340 + }, + + initialize : function(options) { + var me = this; + + me.numFormatData = [ + { value: Asc.c_oAscNumFormatType.General, displayValue: this.txtGeneral }, + { value: Asc.c_oAscNumFormatType.Number, displayValue: this.txtNumber }, + { value: Asc.c_oAscNumFormatType.Scientific,displayValue: this.txtScientific }, + { value: Asc.c_oAscNumFormatType.Accounting,displayValue: this.txtAccounting }, + { value: Asc.c_oAscNumFormatType.Currency, displayValue: this.txtCurrency }, + { value: Asc.c_oAscNumFormatType.Date, displayValue: this.txtDate }, + { value: Asc.c_oAscNumFormatType.Time, displayValue: this.txtTime }, + { value: Asc.c_oAscNumFormatType.Percent, displayValue: this.txtPercentage }, + { value: Asc.c_oAscNumFormatType.Fraction, displayValue: this.txtFraction }, + { value: Asc.c_oAscNumFormatType.Text, displayValue: this.txtText }, + { value: Asc.c_oAscNumFormatType.Custom, displayValue: this.txtCustom } + ]; + + me.FractionData = [ + { displayValue: this.txtUpto1, value: "# ?/?" }, + { displayValue: this.txtUpto2, value: "# ??/??" }, + { displayValue: this.txtUpto3, value: "# ???/???" }, + { displayValue: this.txtAs2, value: "# ?/2" }, + { displayValue: this.txtAs4, value: "# ?/4" }, + { displayValue: this.txtAs8, value: "# ?/8" }, + { displayValue: this.txtAs16, value: "# ??/16" }, + { displayValue: this.txtAs10, value: "# ?/10" }, + { displayValue: this.txtAs100, value: "# ??/100" } + ]; + + me.CurrencySymbolsData = null; + me.langId = 0x0409; + + _.extend(this.options, { + title: this.textTitle, + template: [ + '
    ', + '
    ', + '
    ', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '', + '
    ', + '', + '
    ', + '
    ', + '', + '
    ', + '', + '
    ', + '
    ', + '
    ', + '
    ', + '', + '
    ', + '
    ', + '', + '
    ', + '
    ', + '', + '
    ', + '
    ', + '', + '
    ', + '
    ', + '
    ', + '
    ', + '
    ', + '
    ', + '' + ].join('') + }, options); + + this.api = options.api; + this.handler = options.handler; + this.props = options.props; + + Common.Views.AdvancedSettingsWindow.prototype.initialize.call(this, this.options); + + this.FormatType = Asc.c_oAscNumFormatType.General; + this.Format = "General"; + }, + + render: function() { + Common.Views.AdvancedSettingsWindow.prototype.render.call(this); + var me = this; + + this.cmbFormat = new Common.UI.ComboBox({ + el: $('#format-settings-combo-format'), + cls: 'input-group-nr', + menuStyle: 'min-width: 264px;', + editable: false, + data: this.numFormatData + }); + this.cmbFormat.setValue(this.FormatType); + this.cmbFormat.on('selected', _.bind(this.onFormatSelect, this)); + + this.cmbNegative = new Common.UI.ComboBox({ + el: $('#format-settings-combo-negative'), + cls: 'input-group-nr', + menuStyle: 'min-width: 264px;max-height:210px;', + editable: false, + data: [], + scrollAlwaysVisible: true + }); + this.cmbNegative.on('selected', _.bind(this.onNegativeSelect, this)); + + this.spnDecimal = new Common.UI.MetricSpinner({ + el: $('#format-settings-spin-decimal'), + step: 1, + width: 45, + defaultUnit : "", + value: 2, + maxValue: 30, + minValue: 0, + allowDecimal: false + }); + this.spnDecimal.on('change', _.bind(this.onDecimalChange, this)); + + this.chSeparator = new Common.UI.CheckBox({ + el: $('#format-settings-checkbox-separator'), + labelText: this.textSeparator + }); + this.chSeparator.on('change', _.bind(this.onSeparatorChange, this)); + + this.cmbSymbols = new Common.UI.ComboBox({ + el: $('#format-settings-combo-symbols'), + cls: 'input-group-nr', + menuStyle: 'min-width: 264px;max-height:210px;', + editable: false, + data: [], + scrollAlwaysVisible: true + }); + this.cmbSymbols.on('selected', _.bind(this.onSymbolsSelect, this)); + + this.cmbType = new Common.UI.ComboBox({ + el: $('#format-settings-combo-type'), + cls: 'input-group-nr', + menuStyle: 'min-width: 264px;max-height:210px;', + editable: false, + data: [], + scrollAlwaysVisible: true + }); + this.cmbType.on('selected', _.bind(this.onTypeSelect, this)); + + this.cmbCode = new Common.UI.ComboBox({ + el: $('#format-settings-combo-code'), + cls: 'input-group-nr', + menuStyle: 'min-width: 310px;max-height:210px;', + editable: false, + data: [], + scrollAlwaysVisible: true + }); + this.cmbCode.on('selected', _.bind(this.onCodeSelect, this)); + + this._decimalPanel = this.$window.find('.format-decimal'); + this._negativePanel = this.$window.find('.format-negative'); + this._separatorPanel = this.$window.find('.format-separator'); + this._typePanel = this.$window.find('.format-type'); + this._symbolsPanel = this.$window.find('.format-symbols'); + this._codePanel = this.$window.find('.format-code'); + + this.lblExample = this.$window.find('#format-settings-label-example'); + + this.afterRender(); + }, + + afterRender: function() { + this._setDefaults(this.props); + }, + + show: function() { + Common.Views.AdvancedSettingsWindow.prototype.show.apply(this, arguments); + }, + + _setDefaults: function (props) { + if (props) { + if (this.langId) + this.langId = props.langId; + this.cmbFormat.setValue(props.formatType, this.txtCustom); + + this.onFormatSelect(this.cmbFormat, this.cmbFormat.getSelectedRecord()); + // for fraction - if props.format not in cmbType - setValue(this.txtCustom) + // for date/time - if props.format not in cmbType - setValue(this.api.asc_getLocaleExample(props.format, 37973)) + // for cmbNegative - if props.format not in cmbNegative - setValue(this.api.asc_getLocaleExample(props.format)) + } + }, + + getSettings: function () { + return {format: this.Format}; + }, + + onDlgBtnClick: function(event) { + var me = this; + var state = (typeof(event) == 'object') ? event.currentTarget.attributes['result'].value : event; + if (state == 'ok') { + this.handler && this.handler.call(this, state, (state == 'ok') ? this.getSettings() : undefined); + } + + this.close(); + }, + + onPrimary: function() { + return true; + }, + + onNegativeSelect: function(combo, record) { + this.Format = record.value; + this.lblExample.text(this.api.asc_getLocaleExample(this.Format)); + }, + + onSymbolsSelect: function(combo, record) { + var me = this, + info = new Asc.asc_CFormatCellsInfo(); + info.asc_setType(this.FormatType); + info.asc_setDecimalPlaces(this.spnDecimal.getNumberValue()); + info.asc_setSeparator(false); + info.asc_setSymbol(record.value); + + var format = this.api.asc_getFormatCells(info), + data = []; + format.forEach(function(item) { + data.push({value: item, displayValue: me.api.asc_getLocaleExample(item, -1234.12345678901234567890)}); + }); + this.cmbNegative.setData(data); + this.cmbNegative.selectRecord(this.cmbNegative.store.at(0)); + this.cmbNegative.cmpEl.find('li:nth-child(2) a, li:nth-child(4) a').css({color: '#ff0000'}); + this.Format = format[0]; + + this.lblExample.text(this.api.asc_getLocaleExample(this.Format)); + }, + + onDecimalChange: function(field, newValue, oldValue, eOpts){ + var me = this, + info = new Asc.asc_CFormatCellsInfo(); + info.asc_setType(this.FormatType); + info.asc_setDecimalPlaces(field.getNumberValue()); + info.asc_setSeparator((this.FormatType == Asc.c_oAscNumFormatType.Number) ? this.chSeparator.getValue()=='checked' : false); + info.asc_setSymbol((this.FormatType == Asc.c_oAscNumFormatType.Currency || this.FormatType == Asc.c_oAscNumFormatType.Accounting) ? this.cmbSymbols.getValue() : false); + + var format = this.api.asc_getFormatCells(info); + if (this.FormatType == Asc.c_oAscNumFormatType.Number || this.FormatType == Asc.c_oAscNumFormatType.Currency || this.FormatType == Asc.c_oAscNumFormatType.Accounting) { + var data = []; + format.forEach(function(item) { + data.push({value: item, displayValue: me.api.asc_getLocaleExample(item, -1234.12345678901234567890)}); + }); + this.cmbNegative.setData(data); + this.cmbNegative.selectRecord(this.cmbNegative.store.at(0)); + this.cmbNegative.cmpEl.find('li:nth-child(2) a, li:nth-child(4) a').css({color: '#ff0000'}); + this.Format = format[0]; + } else { + this.Format = format[0]; + } + + this.lblExample.text(this.api.asc_getLocaleExample(this.Format)); + }, + + onSeparatorChange: function(field, newValue, oldValue, eOpts){ + var me = this, + info = new Asc.asc_CFormatCellsInfo(); + info.asc_setType(this.FormatType); + info.asc_setDecimalPlaces(this.spnDecimal.getNumberValue()); + info.asc_setSeparator(field.getValue()=='checked'); + + var format = this.api.asc_getFormatCells(info), + data = []; + format.forEach(function(item) { + data.push({value: item, displayValue: me.api.asc_getLocaleExample(item, -1234.12345678901234567890)}); + }); + this.cmbNegative.setData(data); + this.cmbNegative.selectRecord(this.cmbNegative.store.at(0)); + this.cmbNegative.cmpEl.find('li:nth-child(2) a, li:nth-child(4) a').css({color: '#ff0000'}); + this.Format = format[0]; + + this.lblExample.text(this.api.asc_getLocaleExample(this.Format)); + }, + + onTypeSelect: function(combo, record){ + this.Format = record.value; + this.lblExample.text(this.api.asc_getLocaleExample(this.Format)); + }, + + onCodeSelect: function(combo, record){ + this.Format = record.value; + this.lblExample.text(this.api.asc_getLocaleExample(this.Format)); + }, + + onFormatSelect: function(combo, record) { + if (!record) return; + + this.FormatType = record.value; + + var hasDecimal = (record.value == Asc.c_oAscNumFormatType.Number || record.value == Asc.c_oAscNumFormatType.Scientific || record.value == Asc.c_oAscNumFormatType.Accounting || + record.value == Asc.c_oAscNumFormatType.Currency || record.value == Asc.c_oAscNumFormatType.Percent), + hasNegative = (record.value == Asc.c_oAscNumFormatType.Number || record.value == Asc.c_oAscNumFormatType.Currency || record.value == Asc.c_oAscNumFormatType.Accounting), + hasSeparator = (record.value == Asc.c_oAscNumFormatType.Number), + hasType = (record.value == Asc.c_oAscNumFormatType.Date || record.value == Asc.c_oAscNumFormatType.Time || record.value == Asc.c_oAscNumFormatType.Fraction), + hasSymbols = (record.value == Asc.c_oAscNumFormatType.Accounting || record.value == Asc.c_oAscNumFormatType.Currency), + hasCode = (record.value == Asc.c_oAscNumFormatType.Custom), + me = this; + + if (record.value !== Asc.c_oAscNumFormatType.Custom) { + var info = new Asc.asc_CFormatCellsInfo(); + info.asc_setType(record.value); + info.asc_setDecimalPlaces(hasDecimal ? this.spnDecimal.getNumberValue() : 0); + info.asc_setSeparator(hasSeparator ? this.chSeparator.getValue()=='checked' : false); + + if (hasNegative || record.value == Asc.c_oAscNumFormatType.Date || record.value == Asc.c_oAscNumFormatType.Time) { + if (hasSymbols) { + if (!me.CurrencySymbolsData) { + me.CurrencySymbolsData = []; + var symbolssarr = this.api.asc_getCurrencySymbols(); + for (var code in symbolssarr) { + if (symbolssarr.hasOwnProperty(code)) { + me.CurrencySymbolsData.push({value: parseInt(code), displayValue: symbolssarr[code] + ' ' + Common.util.LanguageInfo.getLocalLanguageName(code)[1]}); + } + } + this.cmbSymbols.setData(this.CurrencySymbolsData); + this.cmbSymbols.setValue(this.langId); + } + info.asc_setSymbol(this.cmbSymbols.getValue()); + } + + var formatsarr = this.api.asc_getFormatCells(info), + data = [], + exampleVal = (record.value == Asc.c_oAscNumFormatType.Date) ? 37973 : ((record.value == Asc.c_oAscNumFormatType.Time) ? 0.123 : parseFloat("-1234.12345678901234567890")); + formatsarr.forEach(function(item) { + data.push({value: item, displayValue: me.api.asc_getLocaleExample(item, exampleVal)}); + }); + if (hasNegative) { + this.cmbNegative.setData(data); + this.cmbNegative.selectRecord(this.cmbNegative.store.at(0)); + this.cmbNegative.cmpEl.find('li:nth-child(2) a, li:nth-child(4) a').css({color: '#ff0000'}); + } else { + this.cmbType.setData(data); + this.cmbType.selectRecord(this.cmbType.store.at(0)); + } + this.Format = formatsarr[0]; + } else if (record.value == Asc.c_oAscNumFormatType.Fraction) { + this.cmbType.setData(this.FractionData); + this.cmbType.selectRecord(this.cmbType.store.at(0)); + this.Format = this.cmbType.getValue(); + } else { + this.Format = this.api.asc_getFormatCells(info)[0]; + } + + } else { + var info = new Asc.asc_CFormatCellsInfo(); + info.asc_setType(Asc.c_oAscNumFormatType.None); + info.asc_setSymbol(this.langId); + + var formatsarr = this.api.asc_getFormatCells(info), + data = []; + formatsarr.forEach(function(item) { + data.push({value: item, displayValue: item}); + }); + this.cmbCode.setData(data); + this.cmbCode.setValue(this.Format); + } + + this.lblExample.text(this.api.asc_getLocaleExample(this.Format)); + + this._decimalPanel.toggleClass('hidden', !hasDecimal); + this._negativePanel.css('visibility', hasNegative ? '' : 'hidden'); + this._separatorPanel.toggleClass('hidden', !hasSeparator); + this._typePanel.toggleClass('hidden', !hasType); + this._symbolsPanel.toggleClass('hidden', !hasSymbols); + this._codePanel.toggleClass('hidden', !hasCode); + }, + + textTitle: 'Number Format', + textCategory: 'Category', + textDecimal: 'Decimal', + textSeparator: 'Use 1000 separator', + textFormat: 'Format', + textSymbols: 'Symbols', + textCancel: 'Cancel', + textOk: 'OK', + txtGeneral: 'General', + txtNumber: 'Number', + txtCustom: 'Custom', + txtCurrency: 'Currency', + txtAccounting: 'Accounting', + txtDate: 'Date', + txtTime: 'Time', + txtPercentage: 'Percentage', + txtFraction: 'Fraction', + txtScientific: 'Scientific', + txtText: 'Text', + txtUpto1: 'Up to one digit', + txtUpto2: 'Up to two digits', + txtUpto3: 'Up to three digits', + txtAs2: 'As halfs', + txtAs8: 'As eighths', + txtAs4: 'As fourths', + txtAs16: 'As sixteenths', + txtAs10: 'As tenths', + txtAs100: 'As hundredths', + txtSample: 'Sample:' + + }, SSE.Views.FormatSettingsDialog || {})) +}); \ No newline at end of file diff --git a/apps/spreadsheeteditor/main/app/view/Toolbar.js b/apps/spreadsheeteditor/main/app/view/Toolbar.js index 47117a921..564dd4b1e 100644 --- a/apps/spreadsheeteditor/main/app/view/Toolbar.js +++ b/apps/spreadsheeteditor/main/app/view/Toolbar.js @@ -124,19 +124,18 @@ define([ Text : '@' }; - me.numFormatTypes = {}; - me.numFormatTypes[Asc.c_oAscNumFormatType.General] = me.txtGeneral; - me.numFormatTypes[Asc.c_oAscNumFormatType.Custom] = me.txtCustom; - me.numFormatTypes[Asc.c_oAscNumFormatType.Text] = me.txtText; - me.numFormatTypes[Asc.c_oAscNumFormatType.Number] = me.txtNumber; - me.numFormatTypes[Asc.c_oAscNumFormatType.Integer] = me.txtInteger; - me.numFormatTypes[Asc.c_oAscNumFormatType.Scientific] = me.txtScientific; - me.numFormatTypes[Asc.c_oAscNumFormatType.Currency] = me.txtCurrency; - me.numFormatTypes[Asc.c_oAscNumFormatType.Accounting] = me.txtAccounting; - me.numFormatTypes[Asc.c_oAscNumFormatType.Date] = me.txtDate; - me.numFormatTypes[Asc.c_oAscNumFormatType.Time] = me.txtTime; - me.numFormatTypes[Asc.c_oAscNumFormatType.Percent] = me.txtPercentage; - me.numFormatTypes[Asc.c_oAscNumFormatType.Fraction] = me.txtFraction; + me.numFormatData = [ + { value: Asc.c_oAscNumFormatType.General, format: this.ascFormatOptions.General, displayValue: this.txtGeneral, exampleval: '100' }, + { value: Asc.c_oAscNumFormatType.Number, format: this.ascFormatOptions.Number, displayValue: this.txtNumber, exampleval: '100,00' }, + { value: Asc.c_oAscNumFormatType.Scientific,format: this.ascFormatOptions.Scientific, displayValue: this.txtScientific, exampleval: '1,00E+02' }, + { value: Asc.c_oAscNumFormatType.Accounting,format: this.ascFormatOptions.Accounting, displayValue: this.txtAccounting, exampleval: '100,00 $' }, + { value: Asc.c_oAscNumFormatType.Currency, format: this.ascFormatOptions.Currency, displayValue: this.txtCurrency, exampleval: '100,00 $' }, + { value: Asc.c_oAscNumFormatType.Date, format: 'MM-dd-yyyy', displayValue: this.txtDate, exampleval: '04-09-1900' }, + { value: Asc.c_oAscNumFormatType.Time, format: 'HH:MM:ss', displayValue: this.txtTime, exampleval: '00:00:00' }, + { value: Asc.c_oAscNumFormatType.Percent, format: this.ascFormatOptions.Percentage, displayValue: this.txtPercentage, exampleval: '100,00%' }, + { value: Asc.c_oAscNumFormatType.Fraction, format: this.ascFormatOptions.Fraction, displayValue: this.txtFraction, exampleval: '100' }, + { value: Asc.c_oAscNumFormatType.Text, format: this.ascFormatOptions.Text, displayValue: this.txtText, exampleval: '100' } + ]; function dummyCmp() { return { @@ -651,13 +650,26 @@ define([ } }); - me.btnNumberFormat = new Common.UI.Button({ - id : 'id-toolbar-btn-num-format', - cls : 'btn-toolbar btn-text-value', - caption : me.txtGeneral, - style : 'width: 100%;', + var formatTemplate = + _.template([ + '<% _.each(items, function(item) { %>', + '
  • ', + '
    <%= scope.getDisplayValue(item) %>
    ', + '
    <%= item.exampleval ? item.exampleval : "" %>
    ', + '
  • ', + '<% }); %>', + '
  • ', + '
  • ' + me.textMoreFormats + '
  • ' + ].join('')); + + me.cmbNumberFormat = new Common.UI.ComboBox({ + cls : 'input-group-nr', + menuStyle : 'min-width: 180px;', + hint : me.tipNumFormat, lock : [_set.editCell, _set.selChart, _set.selChartText, _set.selShape, _set.selShapeText, _set.selImage, _set.selRange, _set.lostConnect, _set.coAuth], - menu : true + itemsTemplate: formatTemplate, + editable : false, + data : me.numFormatData }); me.btnPercentStyle = new Common.UI.Button({ @@ -680,7 +692,7 @@ define([ items : [ { caption : me.txtDollar, - value : me.ascFormatOptions.Accounting + value : '_($* #,##0.00_);_($* (#,##0.00);_($* "-"??_);_(@_)' }, { caption : me.txtEuro, @@ -1080,7 +1092,7 @@ define([ me.btnMerge, me.btnInsertFormula, me.btnNamedRange, me.btnIncDecimal, me.btnInsertShape, me.btnInsertEquation, me.btnInsertText, me.btnSortUp, me.btnSortDown, me.btnSetAutofilter, me.btnClearAutofilter, me.btnTableTemplate, me.btnPercentStyle, me.btnCurrencyStyle, me.btnDecDecimal, me.btnAddCell, me.btnDeleteCell, - me.btnNumberFormat, me.btnBorders, me.btnInsertImage, me.btnInsertHyperlink, + me.cmbNumberFormat, me.btnBorders, me.btnInsertImage, me.btnInsertHyperlink, me.btnInsertChart, me.btnColorSchemas, me.btnAutofilter, me.btnCopy, me.btnPaste, me.btnSettings, me.listStyles, me.btnPrint, me.btnShowMode, /*me.btnSave, */me.btnClearStyle, me.btnCopyStyle @@ -1097,7 +1109,7 @@ define([ me.btnInsertImage, me.btnInsertText, me.btnInsertShape, me.btnInsertEquation, me.btnIncFontSize, me.btnDecFontSize, me.btnBold, me.btnItalic, me.btnUnderline, me.btnTextColor, me.btnBackColor, me.btnInsertHyperlink, me.btnBorders, me.btnTextOrient, me.btnPercentStyle, me.btnCurrencyStyle, me.btnColorSchemas, - me.btnSettings, me.btnInsertFormula, me.btnNamedRange, me.btnDecDecimal, me.btnIncDecimal, me.btnNumberFormat, me.btnWrap, + me.btnSettings, me.btnInsertFormula, me.btnNamedRange, me.btnDecDecimal, me.btnIncDecimal, me.cmbNumberFormat, me.btnWrap, me.btnInsertChart, me.btnMerge, me.btnAddCell, me.btnDeleteCell, me.btnShowMode, me.btnPrint, me.btnAutofilter, me.btnSortUp, me.btnSortDown, me.btnTableTemplate, me.btnSetAutofilter, me.btnClearAutofilter, me.btnSave, me.btnClearStyle, me.btnCopyStyle, me.btnCopy, me.btnPaste]; @@ -1229,7 +1241,7 @@ define([ replacePlacholder('#id-toolbar-' + mode + '-placeholder-btn-setfilter', this.btnSetAutofilter); replacePlacholder('#id-toolbar-' + mode + '-placeholder-btn-clear-filter', this.btnClearAutofilter); replacePlacholder('#id-toolbar-' + mode + '-placeholder-btn-table-tpl', this.btnTableTemplate); - replacePlacholder('#id-toolbar-' + mode + '-placeholder-btn-format', this.btnNumberFormat); + replacePlacholder('#id-toolbar-' + mode + '-placeholder-btn-format', this.cmbNumberFormat); replacePlacholder('#id-toolbar-' + mode + '-placeholder-btn-percents', this.btnPercentStyle); replacePlacholder('#id-toolbar-' + mode + '-placeholder-btn-currency', this.btnCurrencyStyle); replacePlacholder('#id-toolbar-' + mode + '-placeholder-btn-digit-dec', this.btnDecDecimal); @@ -1295,7 +1307,6 @@ define([ this.btnClearAutofilter.updateHint(this.txtClearFilter); this.btnSearch.updateHint(this.txtSearch); this.btnTableTemplate.updateHint(this.txtTableTemplate); - this.btnNumberFormat.updateHint(this.tipNumFormat); this.btnPercentStyle.updateHint(this.tipDigStylePercent); this.btnCurrencyStyle.updateHint(this.tipDigStyleAccounting); this.btnDecDecimal.updateHint(this.tipDecDecimal); @@ -1520,180 +1531,6 @@ define([ }); } - var formatTemplate = _.template('<%= caption %><%= options.tplval ? options.tplval : options.value %>'); - this.btnNumberFormat.setMenu( new Common.UI.Menu({ - style: 'margin-left: -1px;', - items: [ - { - caption : this.txtGeneral, - value : this.ascFormatOptions.General - }, - { - caption : this.txtNumber, - value : this.ascFormatOptions.Number - }, - { - caption : this.txtInteger, - value : '#0' - }, - { - caption : this.txtScientific, - value : this.ascFormatOptions.Scientific - }, - { - caption : this.txtAccounting, - menu : new Common.UI.Menu({ - style: 'min-width: 120px;', - menuAlign: 'tl-tr', - items : [ - { - caption : this.txtDollar, - value : this.ascFormatOptions.Accounting - }, - { - caption : this.txtEuro, - value : '_(€* #,##0.00_);_(€* (#,##0.00);_(€* "-"??_);_(@_)' - }, - { - caption : this.txtPound, - value : '_(£* #,##0.00_);_(£* (#,##0.00);_(£* "-"??_);_(@_)' - }, - { - caption : this.txtRouble, - value : '_-* #,##0.00[$р.-419]_-;-* #,##0.00[$р.-419]_-;_-* "-"??[$р.-419]_-;_-@_-' - }, - { - caption : this.txtYen, - value : '_(¥* #,##0.00_);_(¥* (#,##0.00);_(¥* "-"??_);_(@_)' - } - ] - }) - }, - { - caption : this.txtCurrency, - menu : new Common.UI.Menu({ - style: 'min-width: 120px;', - menuAlign: 'tl-tr', - items : [ - { - caption : this.txtDollar, - value : this.ascFormatOptions.Currency - }, - { - caption : this.txtEuro, - value : '€#,##0.00' - }, - { - caption : this.txtPound, - value : '£#,##0.00' - }, - { - caption : this.txtRouble, - value : '#,##0.00"р."' - }, - { - caption : this.txtYen, - value : '¥#,##0.00' - } - ] - }) - }, - { - caption : this.txtDate, - menu : new Common.UI.Menu({ - style: 'min-width: 200px;', - menuAlign: 'tl-tr', - items: [ - { - caption : '07-24-88', - value : 'MM-dd-yy', - template: formatTemplate - }, - { - caption : '07-24-1988', - value : 'MM-dd-yyyy', - template: formatTemplate - }, - { - caption : '24-07-88', - value : 'dd-MM-yy', - template: formatTemplate - }, - { - caption : '24-07-1988', - value : 'dd-MM-yyyy', - template: formatTemplate - }, - { - caption : '24-Jul-1988', - value : 'dd-MMM-yyyy', - template: formatTemplate - }, - { - caption : '24-Jul', - value : 'dd-MMM', - template: formatTemplate - }, - { - caption : 'Jul-88', - value : 'MMM-yy', - template: formatTemplate - } - ] - }) - }, - { - caption : this.txtTime, - menu : new Common.UI.Menu({ - style: 'min-width: 200px;', - menuAlign: 'tl-tr', - showSeparator : false, - items: [ - { - caption : '10:56', - value : 'HH:mm', - template: formatTemplate - }, - { - caption : '21:56:00', - value : 'HH:MM:ss', - template: formatTemplate - }, - { - caption : '05:56 AM', - tplval : 'hh:mm tt', - value : 'hh:mm AM/PM', - template: formatTemplate - }, - { - caption : '05:56:00 AM', - tplval : 'hh:mm:ss tt', - value : 'hh:mm:ss AM/PM', - template: formatTemplate - }, - { - caption : '38:56:00', - value : '[h]:mm:ss', - template: formatTemplate - } - ] - }) - }, - { - caption : this.txtPercentage, - value : this.ascFormatOptions.Percentage - }, - { - caption : this.txtFraction, - value : this.ascFormatOptions.Fraction - }, - { - caption : this.txtText, - value : this.ascFormatOptions.Text - } - ] - })); - this.mnuInsertChartPicker = new Common.UI.DataView({ el: $('#id-toolbar-menu-insertchart'), parentMenu: this.btnInsertChart.menu, @@ -2103,6 +1940,7 @@ define([ tipInsertEquation: 'Insert Equation', textCharts: 'Charts', textSparks: 'Sparklines', - tipInsertChartSpark: 'Insert Chart or Sparkline' + tipInsertChartSpark: 'Insert Chart or Sparkline', + textMoreFormats: 'More formats' }, SSE.Views.Toolbar || {})); }); \ No newline at end of file diff --git a/apps/spreadsheeteditor/main/locale/en.json b/apps/spreadsheeteditor/main/locale/en.json index 5c9560616..e51ebed98 100644 --- a/apps/spreadsheeteditor/main/locale/en.json +++ b/apps/spreadsheeteditor/main/locale/en.json @@ -1045,6 +1045,35 @@ "SSE.Views.FileMenuPanels.MainSettingsGeneral.txtWin": "as Windows", "SSE.Views.FileMenuPanels.Settings.txtGeneral": "General", "SSE.Views.FileMenuPanels.Settings.txtPageSettings": "Page Settings", + "SSE.Views.FormatSettingsDialog.textTitle": "Number Format", + "SSE.Views.FormatSettingsDialog.textCategory": "Category", + "SSE.Views.FormatSettingsDialog.textDecimal": "Decimal", + "SSE.Views.FormatSettingsDialog.textSeparator": "Use 1000 separator", + "SSE.Views.FormatSettingsDialog.textFormat": "Format", + "SSE.Views.FormatSettingsDialog.textSymbols": "Symbols", + "SSE.Views.FormatSettingsDialog.textCancel": "Cancel", + "SSE.Views.FormatSettingsDialog.textOk": "OK", + "SSE.Views.FormatSettingsDialog.txtGeneral": "General", + "SSE.Views.FormatSettingsDialog.txtNumber": "Number", + "SSE.Views.FormatSettingsDialog.txtCustom": "Custom", + "SSE.Views.FormatSettingsDialog.txtCurrency": "Currency", + "SSE.Views.FormatSettingsDialog.txtAccounting": "Accounting", + "SSE.Views.FormatSettingsDialog.txtDate": "Date", + "SSE.Views.FormatSettingsDialog.txtTime": "Time", + "SSE.Views.FormatSettingsDialog.txtPercentage": "Percentage", + "SSE.Views.FormatSettingsDialog.txtFraction": "Fraction", + "SSE.Views.FormatSettingsDialog.txtScientific": "Scientific", + "SSE.Views.FormatSettingsDialog.txtText": "Text", + "SSE.Views.FormatSettingsDialog.txtUpto1": "Up to one digit", + "SSE.Views.FormatSettingsDialog.txtUpto2": "Up to two digits", + "SSE.Views.FormatSettingsDialog.txtUpto3": "Up to three digits", + "SSE.Views.FormatSettingsDialog.txtAs2": "As halfs", + "SSE.Views.FormatSettingsDialog.txtAs8": "As eighths", + "SSE.Views.FormatSettingsDialog.txtAs4": "As fourths", + "SSE.Views.FormatSettingsDialog.txtAs16": "As sixteenths", + "SSE.Views.FormatSettingsDialog.txtAs10": "As tenths", + "SSE.Views.FormatSettingsDialog.txtAs100": "As hundredths", + "SSE.Views.FormatSettingsDialog.txtSample": "Sample:", "SSE.Views.FormulaDialog.cancelButtonText": "Cancel", "SSE.Views.FormulaDialog.okButtonText": "OK", "SSE.Views.FormulaDialog.sCategoryAll": "All", @@ -1625,6 +1654,7 @@ "SSE.Views.Toolbar.textLineSpark": "Line", "SSE.Views.Toolbar.textColumnSpark": "Column", "SSE.Views.Toolbar.textWinLossSpark": "Win/Loss", + "SSE.Views.Toolbar.textMoreFormats": "More formats", "SSE.Views.Top10FilterDialog.cancelButtonText": "Cancel", "SSE.Views.Top10FilterDialog.okButtonText": "OK", "SSE.Views.Top10FilterDialog.textType": "Show",