From c0bb96eb7a548f18c900e44ce96d36f5a7640a32 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Tue, 18 Jul 2017 11:44:12 +0300 Subject: [PATCH] [SSE] Added pivot table advanced settings. --- .../template/PivotSettingsAdvanced.template | 100 ++++++ .../main/app/view/FieldSettingsDialog.js | 12 +- .../main/app/view/PivotSettings.js | 98 +----- .../main/app/view/PivotSettingsAdvanced.js | 308 ++++++++++++++++++ 4 files changed, 428 insertions(+), 90 deletions(-) create mode 100644 apps/spreadsheeteditor/main/app/template/PivotSettingsAdvanced.template create mode 100644 apps/spreadsheeteditor/main/app/view/PivotSettingsAdvanced.js diff --git a/apps/spreadsheeteditor/main/app/template/PivotSettingsAdvanced.template b/apps/spreadsheeteditor/main/app/template/PivotSettingsAdvanced.template new file mode 100644 index 000000000..ffc7f6aa1 --- /dev/null +++ b/apps/spreadsheeteditor/main/app/template/PivotSettingsAdvanced.template @@ -0,0 +1,100 @@ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+
+ +
+
+
+
+
+ +
+
+
+
+
+ +
+
+ +
+
+
+
+
+
+
+ + + + + + + + +
+ +
+
+ 		+ +
+
+
+
+
+ + + + + + + + + + +
+ +
+
+ + +
+ +
+
+
\ No newline at end of file diff --git a/apps/spreadsheeteditor/main/app/view/FieldSettingsDialog.js b/apps/spreadsheeteditor/main/app/view/FieldSettingsDialog.js index 5769c910e..d6fa930a5 100644 --- a/apps/spreadsheeteditor/main/app/view/FieldSettingsDialog.js +++ b/apps/spreadsheeteditor/main/app/view/FieldSettingsDialog.js @@ -265,12 +265,12 @@ define([ 'text!spreadsheeteditor/main/app/template/FieldSettingsDialog.templa txtTabular: 'Tabular', txtOutline: 'Outline', txtCompact: 'Compact', - txtRepeat: 'Repeat Items Labels at Each Row', - txtBlank: 'Insert Blank Rows After Each Item', - txtShowSubtotals: 'Show Subtotals', - txtTop: 'Show at Top of Group', - txtBottom: 'Show at Bottom of Group', - txtEmpty: 'Show Items with No Data', + txtRepeat: 'Repeat items labels at each row', + txtBlank: 'Insert blank rows after each item', + txtShowSubtotals: 'Show subtotals', + txtTop: 'Show at top of group', + txtBottom: 'Show at bottom of group', + txtEmpty: 'Show items with no data', txtSummarize: 'Functions for Subtotals', txtAverage: 'Average', txtCount: 'Count', diff --git a/apps/spreadsheeteditor/main/app/view/PivotSettings.js b/apps/spreadsheeteditor/main/app/view/PivotSettings.js index 89e62652f..9b914de16 100644 --- a/apps/spreadsheeteditor/main/app/view/PivotSettings.js +++ b/apps/spreadsheeteditor/main/app/view/PivotSettings.js @@ -47,7 +47,8 @@ define([ 'common/main/lib/component/Button', 'common/main/lib/component/ListView', 'spreadsheeteditor/main/app/view/FieldSettingsDialog', - 'spreadsheeteditor/main/app/view/ValueFieldSettingsDialog' + 'spreadsheeteditor/main/app/view/ValueFieldSettingsDialog', + 'spreadsheeteditor/main/app/view/PivotSettingsAdvanced' ], function (menuTemplate, $, _, Backbone, Sortable) { 'use strict'; @@ -70,7 +71,8 @@ define([ this._state = { names: [], - DisabledControls: false + DisabledControls: false, + field: {} }; this.lockedControls = []; this._locked = false; @@ -81,85 +83,13 @@ define([ this.render(); }, - onCheckTemplateChange: function(type, stateName, field, newValue, oldValue, eOpts) { - this._state[stateName] = undefined; - if (this.api) - this.api.asc_changeFormatTableInfo(this._state.TableName, type, newValue=='checked'); - Common.NotificationCenter.trigger('edit:complete', this); - }, - - onTableTemplateSelect: function(combo, record){ - if (this.api && !this._noApply) { - this.api.asc_changeAutoFilter(this._state.TableName, Asc.c_oAscChangeFilterOptions.style, record.get('name')); - } - Common.NotificationCenter.trigger('edit:complete', this); - }, - - onEditClick: function(menu, item, e) { - if (this.api) { - if (item.options.idx>=0 && item.options.idx<4) - this.api.asc_changeSelectionFormatTable(this._state.TableName, item.value); - else if (item.options.idx>=4 && item.options.idx<8) { - this.api.asc_insertCellsInTable(this._state.TableName, item.value); - } else { - this.api.asc_deleteCellsInTable(this._state.TableName, item.value); - } - } - Common.NotificationCenter.trigger('edit:complete', this); - }, - - onTableNameChanged: function(input, newValue, oldValue) { - var oldName = this._state.TableName; - this._state.TableName = ''; - - if (oldName.toLowerCase() == newValue.toLowerCase()) { - Common.NotificationCenter.trigger('edit:complete', this); - return; - } - - var me = this, - isvalid = this.api.asc_checkDefinedName(newValue, null); - if (isvalid.asc_getStatus() === true) isvalid = true; - else { - switch (isvalid.asc_getReason()) { - case Asc.c_oAscDefinedNameReason.IsLocked: - isvalid = this.textIsLocked; - break; - case Asc.c_oAscDefinedNameReason.Existed: - isvalid = this.textExistName; - break; - case Asc.c_oAscDefinedNameReason.NameReserved: - isvalid = this.textReservedName; - break; - default: - isvalid = this.textInvalidName; - } - } - if (isvalid === true) { - this.api.asc_changeDisplayNameTable(oldName, newValue); - Common.NotificationCenter.trigger('edit:complete', this); - } else if (!this._state.TableNameError) { - this._state.TableNameError = true; - Common.UI.alert({ - msg: isvalid, - title: this.notcriticalErrorTitle, - iconCls: 'warn', - buttons: ['ok'], - callback: function(btn){ - Common.NotificationCenter.trigger('edit:complete', this); - me._state.TableNameError = false; - } - }); - } - }, - render: function () { var el = $(this.el); el.html(this.template({ scope: this })); - this.linkAdvanced = $('#table-advanced-link'); + this.linkAdvanced = $('#pivot-advanced-link'); }, setApi: function(o) { @@ -255,13 +185,12 @@ define([ var me = this; var win; if (me.api && !this._locked){ - (new SSE.Views.TableSettingsAdvanced( + (new SSE.Views.PivotSettingsAdvanced( { - tableProps: me._originalProps, + props: me._originalProps, api: me.api, handler: function(result, value) { if (result == 'ok' && me.api && value) { - me.api.asc_changeFormatTableInfo(me._state.TableName, Asc.c_oAscChangeTableStyleInfo.advancedSettings, value); } Common.NotificationCenter.trigger('edit:complete', me); @@ -513,6 +442,7 @@ define([ onColumnsSelect: function(type, picker, item, record, e){ var btn = $(e.target); if (btn && btn.hasClass('listitem-icon')) { + this._state.field = {record: record, type: type}; if (this.fieldsMenu) { if (this.fieldsMenu.isVisible()) { this.fieldsMenu.hide(); @@ -571,7 +501,7 @@ define([ caption : this.txtFieldSettings, checkable : false }); - this.miFieldSettings.on('click', _.bind(this.onFieldSettings, this, record, type)); + this.miFieldSettings.on('click', _.bind(this.onFieldSettings, this)); this.fieldsMenu = new Common.UI.Menu({ menuAlign: 'tr-br', @@ -652,12 +582,12 @@ define([ onFieldSettings: function(record, type, e) { var me = this; var win; - if (me.api && !this._locked){ - if (type == 2) { // value field + if (me.api && !this._locked && me._state.field){ + if (me._state.field.type == 2) { // value field (new SSE.Views.ValueFieldSettingsDialog( { props: me._originalProps, - fieldIndex: record.get('index'), + fieldIndex: me._state.field.record.get('index'), names: me._state.names, api: me.api, handler: function(result, value) { @@ -672,10 +602,10 @@ define([ (new SSE.Views.FieldSettingsDialog( { props: me._originalProps, - fieldIndex: record.get('index'), + fieldIndex: me._state.field.record.get('index'), names: me._state.names, api: me.api, - type: type, + type: me._state.field.type, handler: function(result, value) { if (result == 'ok' && me.api && value) { // me.api.asc_changeFormatTableInfo(me._state.TableName, Asc.c_oAscChangeTableStyleInfo.advancedSettings, value); diff --git a/apps/spreadsheeteditor/main/app/view/PivotSettingsAdvanced.js b/apps/spreadsheeteditor/main/app/view/PivotSettingsAdvanced.js new file mode 100644 index 000000000..745cf5dcd --- /dev/null +++ b/apps/spreadsheeteditor/main/app/view/PivotSettingsAdvanced.js @@ -0,0 +1,308 @@ +/* + * + * (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 + * + */ + +/** + * PivotSettingsAdvanced.js + * + * Created by Julia Radzhabova on 17.07.2017 + * Copyright (c) 2017 Ascensio System SIA. All rights reserved. + * + */ + +define([ 'text!spreadsheeteditor/main/app/template/PivotSettingsAdvanced.template', + 'common/main/lib/util/utils', + 'common/main/lib/component/InputField', + 'common/main/lib/component/ComboBox', + 'common/main/lib/component/CheckBox', + 'common/main/lib/component/MetricSpinner', + 'common/main/lib/view/AdvancedSettingsWindow' +], function (contentTemplate) { 'use strict'; + + SSE.Views.PivotSettingsAdvanced = Common.Views.AdvancedSettingsWindow.extend(_.extend({ + options: { + contentWidth: 300, + height: 395, + toggleGroup: 'pivot-adv-settings-group', + storageName: 'sse-pivot-adv-settings-category' + }, + + initialize : function(options) { + var me = this; + + _.extend(this.options, { + title: this.textTitle, + items: [ + {panelId: 'id-adv-pivot-layout', panelCaption: this.strLayout}, + {panelId: 'id-adv-pivot-data', panelCaption: this.textDataSource}, + {panelId: 'id-adv-pivot-alttext', panelCaption: this.textAlt} + ], + contentTemplate: _.template(contentTemplate)({ + scope: this + }) + }, options); + + this.api = options.api; + this.handler = options.handler; + this.props = options.props; + + Common.Views.AdvancedSettingsWindow.prototype.initialize.call(this, this.options); + }, + + render: function() { + Common.Views.AdvancedSettingsWindow.prototype.render.call(this); + var me = this; + + this.inputName = new Common.UI.InputField({ + el : $('#pivot-adv-name'), + allowBlank : true, + validateOnBlur: false, + style : 'width: 100%;' + }); + + this.radioDown = new Common.UI.RadioBox({ + el: $('#pivot-adv-radio-down'), + labelText: this.textDown, + name: 'asc-radio-display-field', + checked: true + }); + this.radioDown.on('change', _.bind(function(field, newValue, eOpts) { + if (newValue) { + this.lblPageWrap.html(this.textWrapCol); + } + }, this)); + + this.radioOver = new Common.UI.RadioBox({ + el: $('#pivot-adv-radio-over'), + labelText: this.textOver, + name: 'asc-radio-display-field' + }); + this.radioOver.on('change', _.bind(function(field, newValue, eOpts) { + if (newValue) { + this.lblPageWrap.html(this.textWrapRow); + } + }, this)); + + this.chRows = new Common.UI.CheckBox({ + el: $('#pivot-adv-chk-show-rows'), + labelText: this.textShowRows + }); + + this.chCols = new Common.UI.CheckBox({ + el: $('#pivot-adv-chk-show-columns'), + labelText: this.textShowCols + }); + + this.numWrap = new Common.UI.MetricSpinner({ + el: $('#pivot-adv-spin-wrap'), + step: 1, + width: 85, + allowDecimal: false, + defaultUnit : "", + value: '0', + maxValue: 255, + minValue: 0 + }); + + this.lblPageWrap = this.$window.find('#pivot-adv-label-wrap'); + + this.chHeaders = new Common.UI.CheckBox({ + el: $('#pivot-adv-chk-show-headers'), + labelText: this.textShowHeaders + }); + + this.txtDataRange = new Common.UI.InputField({ + el : $('#pivot-adv-txt-range'), + name : 'range', + style : 'width: 100%;', + 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)); + + // Alt Text + + this.inputAltTitle = new Common.UI.InputField({ + el : $('#pivot-advanced-alt-title'), + allowBlank : true, + validateOnBlur: false, + style : 'width: 100%;' + }).on('changed:after', function() { + me.isAltTitleChanged = true; + }); + + this.textareaAltDescription = this.$window.find('textarea'); + this.textareaAltDescription.keydown(function (event) { + if (event.keyCode == Common.UI.Keys.RETURN) { + event.stopPropagation(); + } + me.isAltDescChanged = true; + }); + + this.afterRender(); + }, + + afterRender: function() { + this._setDefaults(this.props); + if (this.storageName) { + var value = Common.localStorage.getItem(this.storageName); + this.setActiveCategory((value!==null) ? parseInt(value) : 0); + } + }, + + show: function() { + Common.Views.AdvancedSettingsWindow.prototype.show.apply(this, arguments); + }, + + _setDefaults: function (props) { + if (props) { + var me = this; + this.inputName.setValue(Common.Utils.String.htmlEncode(props.asc_getName())); + + this.chCols.setValue(props.asc_getColGrandTotals(), true); + this.chRows.setValue(props.asc_getRowGrandTotals(), true); + + (props.asc_getPageOverThenDown()) ? this.radioOver.setValue(true) : this.radioDown.setValue(true); + this.lblPageWrap.html((props.asc_getPageOverThenDown()) ? this.textWrapRow : this.textWrapCol); + + this.numWrap.setValue(props.asc_getPageWrap()); + + this.chHeaders.setValue(props.asc_getShowHeaders(), true); + + // var value = props.getRange(); + // this.txtDataRange.setValue((value) ? value : ''); + // this.dataRangeValid = value; + + this.txtDataRange.validation = function(value) { + // var isvalid = me.api.asc_checkDataRange(Asc.c_oAscSelectionDialogType.Pivot, value, false); + // return (isvalid==Asc.c_oAscError.ID.DataRangeError) ? me.textInvalidRange : true; + return true; + }; + } + }, + + getSettings: function () { + return {}; + }, + + onDlgBtnClick: function(event) { + var me = this; + var state = (typeof(event) == 'object') ? event.currentTarget.attributes['result'].value : event; + if (state == 'ok' && this.isRangeValid()) { + this.handler && this.handler.call(this, state, (state == 'ok') ? this.getSettings() : undefined); + } + + this.close(); + }, + + onPrimary: function() { + this.onDlgBtnClick('ok'); + return false; + }, + + isRangeValid: function() { + if (this.isChart) { + var isvalid; + if (!_.isEmpty(this.txtDataRange.getValue())) { + isvalid = this.api.asc_checkDataRange(Asc.c_oAscSelectionDialogType.Pivot, this.txtDataRange.getValue()); + if (isvalid == Asc.c_oAscError.ID.No) + return true; + } else + this.txtDataRange.showError([this.txtEmpty]); + + this.setActiveCategory(1); + this.txtDataRange.cmpEl.find('input').focus(); + return false; + } else + return true; + }, + + onSelectData: function() { + var me = this; + if (me.api) { + var handlerDlg = function(dlg, result) { + if (result == 'ok') { + me.dataRangeValid = dlg.getSettings(); + me.txtDataRange.setValue(me.dataRangeValid); + me.txtDataRange.checkValidate(); + } + }; + + var win = new SSE.Views.CellRangeDialog({ + handler: handlerDlg + }).on('close', function() { + me.show(); + }); + + var xy = me.$window.offset(); + me.hide(); + win.show(xy.left + 160, xy.top + 125); + win.setSettings({ + api : me.api, + range : (!_.isEmpty(me.txtDataRange.getValue()) && (me.txtDataRange.checkValidate()==true)) ? me.txtDataRange.getValue() : me.dataRangeValid, + type : Asc.c_oAscSelectionDialogType.Pivot + }); + } + }, + + textTitle: 'Pivot Table - Advanced Settings', + textCancel: 'Cancel', + textOk: 'OK', + strLayout: 'Name and Layout', + txtName: 'Name', + textGrandTotals: 'Grand Totals', + textShowRows: 'Show for rows', + textShowCols: 'Show for columns', + textDataSource: 'Data Source', + textDataRange: 'Data Range', + textSelectData: 'Select Data', + textAlt: 'Alternative Text', + textAltTitle: 'Title', + textAltDescription: 'Description', + textAltTip: 'The alternative text-based representation of the visual object information, which will be read to the people with vision or cognitive impairments to help them better understand what information there is in the image, autoshape, chart or table.', + txtEmpty: 'This field is required', + textInvalidRange: 'ERROR! Invalid cells range', + textDisplayFields: 'Display fields in report filter area', + textDown: 'Down, then over', + textOver: 'Over, then down', + textWrapCol: 'Report filter fields per column', + textWrapRow: 'Report filter fields per row', + textHeaders: 'Field Headers', + textShowHeaders: 'Show field headers for rows and columns' + + }, SSE.Views.PivotSettingsAdvanced || {})) +}); \ No newline at end of file