Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

[SSE] Added PivotTable tab.

Browse source
This commit is contained in:
Julia Radzhabova 2017-06-30 17:49:58 +03:00
parent 917ff1da54
commit c230f90eec
9 changed files with 543 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

38
apps/common/main/lib/component/CheckBox.js
View file

@ -99,10 +99,32 @@ define([
initialize : function(options) {
Common.UI.BaseView.prototype.initialize.call(this, options);
if (this.options.el)
this.render();
},
render: function (parentEl) {
var me = this,
el = $(this.el);
if (!me.rendered) {
if (parentEl) {
this.setElement(parentEl, false);
parentEl.html(this.template({
labelText: this.options.labelText
}));
el = $(this.el);
} else {
el.html(this.template({
labelText: this.options.labelText
}));
}
this.render();
this.$chk = el.find('input[type=button]');
this.$label = el.find('label');
this.$chk.on('click', _.bind(this.onItemCheck, this));
}
this.rendered = true;
if (this.options.disabled)
this.setDisabled(this.options.disabled);
@ -111,20 +133,6 @@ define([
this.setValue(this.options.value, true);
// handle events
this.$chk.on('click', _.bind(this.onItemCheck, this));
},
render: function () {
var el = $(this.el);
el.html(this.template({
labelText: this.options.labelText
}));
this.$chk = el.find('input[type=button]');
this.$label = el.find('label');
this.rendered = true;
return this;
},

7
apps/common/main/resources/less/combo-dataview.less
View file

@ -271,4 +271,11 @@
}
}
}
}
.combo-pivot-template {
.combo-template(60px);
margin-top: -6px;
margin-bottom: -6px;
}

4
apps/common/main/resources/less/toolbar.less
View file

@ -227,6 +227,10 @@
&.x-huge {
height: 45px;
}
.checkbox-indeterminate {
margin-top: 3px;
}
}
}

2
apps/spreadsheeteditor/main/app.js
View file

@ -155,6 +155,7 @@ require([
'RightMenu',
'LeftMenu',
'Main',
'PivotTable',
'Common.Controllers.Fonts',
'Common.Controllers.Chat',
'Common.Controllers.Comments',
@ -174,6 +175,7 @@ require([
'spreadsheeteditor/main/app/controller/LeftMenu',
'spreadsheeteditor/main/app/controller/Main',
'spreadsheeteditor/main/app/controller/Print',
'spreadsheeteditor/main/app/controller/PivotTable',
'spreadsheeteditor/main/app/view/FileMenuPanels',
'spreadsheeteditor/main/app/view/ParagraphSettings',
'spreadsheeteditor/main/app/view/ImageSettings',

3
apps/spreadsheeteditor/main/app/controller/Main.js
View file

@ -908,6 +908,7 @@ define([
toolbarController = application.getController('Toolbar'),
statusbarController = application.getController('Statusbar'),
rightmenuController = application.getController('RightMenu'),
pivotController = application.getController('PivotTable'),
fontsControllers = application.getController('Common.Controllers.Fonts');
fontsControllers && fontsControllers.setApi(me.api);
@ -920,6 +921,8 @@ define([
statusbarController.getView('Statusbar').changeViewMode(true);
}
pivotController.setMode(me.appOptions).setConfig({config: me.editorConfig}, me.api);
var viewport = this.getApplication().getController('Viewport').getView('Viewport');
viewport.applyEditorMode();
rightmenuController.getView('RightMenu').setMode(me.appOptions).setApi(me.api);

278
apps/spreadsheeteditor/main/app/controller/PivotTable.js Normal file
View file

@ -0,0 +1,278 @@
/*
*
* (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
*
*/
/**
* PivotTable.js
*
* Created by Julia.Radzhabova on 06.27.17
* Copyright (c) 2017 Ascensio System SIA. All rights reserved.
*
*/
define([
'core',
'spreadsheeteditor/main/app/view/PivotTable'
], function () {
'use strict';
SSE.Controllers.PivotTable = Backbone.Controller.extend(_.extend({
models : [],
views : [
'PivotTable'
],
sdkViewName : '#id_main',
initialize: function () {
this.addListeners({
'PivotTable': {
// comments handlers
'pivottable:rowscolumns': _.bind(this.onCheckTemplateChange, this),
'pivottable:create': _.bind(this.onCreateClick, this),
'pivottable:style': _.bind(this.onPivotStyleSelect, this)
}
});
},
onLaunch: function () {
this._state = {
TableName: '',
TemplateName: '',
RowHeader: undefined,
RowBanded: undefined,
ColHeader: undefined,
ColBanded: undefined,
DisabledControls: false
};
this._originalProps = null;
this.view = this.createView('PivotTable');
Common.NotificationCenter.on('app:ready', this.onAppReady.bind(this));
Common.NotificationCenter.on('api:disconnect', _.bind(this.SetDisabled, this));
},
setConfig: function (data, api) {
this.setApi(api);
if (data) {
this.sdkViewName = data['sdkviewname'] || this.sdkViewName;
}
},
setApi: function (api) {
if (api) {
this.api = api;
this.api.asc_registerCallback('asc_onCoAuthoringDisconnect',_.bind(this.SetDisabled, this));
this.api.asc_registerCallback('asc_onSendThemeColors', _.bind(this.onSendThemeColors, this));
this.api.asc_registerCallback('asc_onSelectionChanged', _.bind(this.onSelectionChanged, this));
}
},
setMode: function(mode) {
this.appConfig = mode;
return this;
},
SetDisabled: function() {
this.view && this.view.SetDisabled(true);
},
// helpers
onCheckTemplateChange: function(type, value) {
// this._state[stateName] = undefined;
// if (this.api)
// this.api.asc_changeFormatTableInfo(this._state.TableName, type, value=='checked');
// for test
switch (type) {
case 0:
this._originalProps.asc_getStyleInfo().asc_putShowRowHeaders(value=='checked');
break;
case 1:
this._originalProps.asc_getStyleInfo().asc_putShowColHeaders(value=='checked');
break;
case 2:
this._originalProps.asc_getStyleInfo().asc_putShowRowBanded(value=='checked');
break;
case 3:
this._originalProps.asc_getStyleInfo().asc_putShowColBanded(value=='checked');
break;
}
// this.onApiInitPivotStyles(this.api.asc_getTablePictures(this._originalProps.asc_getStyleInfo(), true));
this.onApiInitPivotStyles(this.api.asc_getTablePictures(null, true));
Common.NotificationCenter.trigger('edit:complete', this);
},
onCreateClick: function(btn, opts){
Common.NotificationCenter.trigger('edit:complete', this);
},
onPivotStyleSelect: 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);
},
ChangeSettings: function(props) {
if (props )
{
this._originalProps = props;
var view = this.view,
needTablePictures = false,
styleInfo = props.asc_getStyleInfo(),
value = styleInfo.asc_getShowRowHeaders();
if (this._state.RowHeader!==value) {
view.chRowHeader.setValue(value, true);
this._state.RowHeader=value;
needTablePictures = true;
}
value = styleInfo.asc_getShowColHeaders();
if (this._state.RowBanded!==value) {
view.chRowBanded.setValue(value, true);
this._state.RowBanded=value;
needTablePictures = true;
}
value = styleInfo.asc_getShowColStripes();
if (this._state.ColHeader!==value) {
view.chColHeader.setValue(value, true);
this._state.ColHeader=value;
needTablePictures = true;
}
value = styleInfo.asc_getShowRowStripes();
if (this._state.ColBanded!==value) {
view.chColBanded.setValue(value, true);
this._state.ColBanded=value;
needTablePictures = true;
}
if (needTablePictures)
// this.onApiInitPivotStyles(this.api.asc_getTablePictures(styleInfo, true));
this.onApiInitPivotStyles(this.api.asc_getTablePictures(null, true));
//for table-template
value = styleInfo.asc_getName();
if (this._state.TemplateName!==value || this._isTemplatesChanged) {
view.pivotStyles.suspendEvents();
var rec = view.pivotStyles.menuPicker.store.findWhere({
name: value
});
view.pivotStyles.menuPicker.selectRecord(rec);
view.pivotStyles.resumeEvents();
if (this._isTemplatesChanged) {
if (rec)
view.pivotStyles.fillComboView(view.pivotStyles.menuPicker.getSelectedRec()[0],true);
else
view.pivotStyles.fillComboView(view.pivotStyles.menuPicker.store.at(0), true);
}
this._state.TemplateName=value;
}
this._isTemplatesChanged = false;
}
},
onSendThemeColors: function() {
// get new table templates
if (this.view.pivotStyles && this._originalProps) {
// this.onApiInitPivotStyles(this.api.asc_getTablePictures(this._originalProps.asc_getStyleInfo(), true));
this.onApiInitPivotStyles(this.api.asc_getTablePictures(null, true));
this.view.pivotStyles.menuPicker.scroller.update({alwaysVisibleY: true});
}
},
onApiInitPivotStyles: function(Templates){
var self = this,
styles = this.view.pivotStyles;
this._isTemplatesChanged = true;
var count = styles.menuPicker.store.length;
if (count>0 && count==Templates.length) {
var data = styles.menuPicker.store.models;
_.each(Templates, function(template, index){
data[index].set('imageUrl', template.asc_getImage());
});
} else {
styles.menuPicker.store.reset([]);
var arr = [];
_.each(Templates, function(template){
arr.push({
id : Common.UI.getId(),
name : template.asc_getName(),
caption : template.asc_getDisplayName(),
type : template.asc_getType(),
imageUrl : template.asc_getImage(),
allowSelected : true,
selected : false,
tip : template.asc_getDisplayName()
});
});
styles.menuPicker.store.add(arr);
}
},
onSelectionChanged: function(info) {
if (this.rangeSelectionMode || !this.appConfig.isEdit) return;
var selectType = info.asc_getFlags().asc_getSelectionType(),
pivotInfo = info.asc_getPivotTableInfo();
var need_disable = info.asc_getLocked();
this.view.SetDisabled(!pivotInfo);
if (pivotInfo)
this.ChangeSettings(pivotInfo);
},
createToolbarPanel: function() {
return this.view.getPanel();
},
getView: function(name) {
return !name && this.view ?
this.view : Backbone.Controller.prototype.getView.call(this, name);
},
onAppReady: function (config) {
var me = this;
(new Promise(function (resolve) {
resolve();
})).then(function () {
});
}
}, SSE.Controllers.PivotTable || {}));
});

13
apps/spreadsheeteditor/main/app/controller/Toolbar.js
View file

@ -46,6 +46,7 @@ define([
'common/main/lib/util/define',
'spreadsheeteditor/main/app/view/Toolbar',
'spreadsheeteditor/main/app/collection/TableTemplates',
'spreadsheeteditor/main/app/controller/PivotTable',
'spreadsheeteditor/main/app/view/HyperlinkSettingsDialog',
'spreadsheeteditor/main/app/view/TableOptionsDialog',
'spreadsheeteditor/main/app/view/NamedRangeEditDlg',
@ -2884,6 +2885,15 @@ define([
if ( config.isEdit )
me.toolbar.setApi(me.api);
if ( !config.isEditDiagram && !config.isEditMailMerge ) {
var tab = {action: 'pivot', caption: me.textPivot};
var $panel = me.getApplication().getController('PivotTable').createToolbarPanel();
if ( $panel ) {
me.toolbar.addTab(tab, $panel, 3);
}
}
});
},
@ -3286,7 +3296,8 @@ define([
warnLongOperation: 'The operation you are about to perform might take rather much time to complete.<br>Are you sure you want to continue?',
txtInvalidRange: 'ERROR! Invalid cells range',
errorMaxRows: 'ERROR! The maximum number of data series per chart is 255.',
errorStockChart: 'Incorrect row order. To build a stock chart place the data on the sheet in the following order:<br> opening price, max price, min price, closing price.'
errorStockChart: 'Incorrect row order. To build a stock chart place the data on the sheet in the following order:<br> opening price, max price, min price, closing price.',
textPivot: 'Pivot Table'
}, SSE.Controllers.Toolbar || {}));
});

212
apps/spreadsheeteditor/main/app/view/PivotTable.js Normal file
View file

@ -0,0 +1,212 @@
/*
*
* (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
*
*/
/**
* PivotTable.js
*
* View
*
* Created by Julia.Radzhabova on 06.27.17
* Copyright (c) 2017 Ascensio System SIA. All rights reserved.
*
*/
define([
// 'text!spreadsheeteditor/main/app/template/PivotTableSettings.template',
'common/main/lib/util/utils',
'common/main/lib/component/Button',
'common/main/lib/component/ComboDataView',
'common/main/lib/component/Layout'
], function (menuTemplate) {
'use strict';
SSE.Views.PivotTable = Common.UI.BaseView.extend(_.extend((function(){
var template =
'<section id="pivot-table-panel" class="panel" data-tab="pivot">' +
'<div class="group">' +
'<span id="slot-btn-add-pivot" class="btn-slot text x-huge"></span>' +
'</div>' +
'<div class="separator long"/>' +
'<div class="group">' +
'<div class="elset">' +
'<span class="btn-slot text" id="slot-chk-header-row"></span>' +
'</div>' +
'<div class="elset">' +
'<span class="btn-slot text" id="slot-chk-header-column"></span>' +
'</div>' +
'</div>' +
'<div class="group">' +
'<div class="elset">' +
'<span class="btn-slot text" id="slot-chk-banded-row"></span>' +
'</div>' +
'<div class="elset">' +
'<span class="btn-slot text" id="slot-chk-banded-column"></span>' +
'</div>' +
'</div>' +
'<div class="group" id="slot-field-pivot-styles" style="width: 347px;">' +
'</div>' +
'</section>';
function setEvents() {
var me = this;
this.btnAddPivot.on('click', function (e) {
me.fireEvent('pivottable:create');
});
this.chRowHeader.on('change', function (field, value) {
me.fireEvent('pivottable:rowscolumns', [0, value]);
});
this.chColHeader.on('change', function (field, value) {
me.fireEvent('pivottable:rowscolumns', [1, value]);
});
this.chRowBanded.on('change', function (field, value) {
me.fireEvent('pivottable:rowscolumns', [2, value]);
});
this.chColBanded.on('change', function (field, value) {
me.fireEvent('pivottable:rowscolumns', [3, value]);
});
this.pivotStyles.on('click', function (combo, record) {
me.fireEvent('pivottable:style', [record]);
});
this.pivotStyles.openButton.menu.on('show:after', function () {
me.pivotStyles.menuPicker.scroller.update({alwaysVisibleY: true});
});
}
return {
options: {},
initialize: function (options) {
Common.UI.BaseView.prototype.initialize.call(this, options);
this.appConfig = options.mode;
this.lockedControls = [];
this.chRowHeader = new Common.UI.CheckBox({
labelText: this.textRowHeader
});
this.lockedControls.push(this.chRowHeader);
this.chColHeader = new Common.UI.CheckBox({
labelText: this.textColHeader
});
this.lockedControls.push(this.chColHeader);
this.chRowBanded = new Common.UI.CheckBox({
labelText: this.textRowBanded
});
this.lockedControls.push(this.chRowBanded);
this.chColBanded = new Common.UI.CheckBox({
labelText: this.textColBanded
});
this.lockedControls.push(this.chColBanded);
this.btnAddPivot = new Common.UI.Button({
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'btn-ic-docspell',
caption: this.txtCreate
});
// this.lockedControls.push(this.btnAddPivot);
this.pivotStyles = new Common.UI.ComboDataView({
cls : 'combo-pivot-template',
enableKeyEvents : true,
itemWidth : 61,
itemHeight : 49,
menuMaxHeight : 300
// lock : [_set.editCell, _set.selChart, _set.selChartText, _set.selShape, _set.selShapeText, _set.selImage, _set.lostConnect, _set.coAuth]
});
this.lockedControls.push(this.pivotStyles);
Common.NotificationCenter.on('app:ready', this.onAppReady.bind(this));
},
render: function (el) {
this.boxSdk = $('#editor_sdk');
if ( el ) el.html( this.getPanel() );
return this;
},
onAppReady: function (config) {
var me = this;
(new Promise(function (accept, reject) {
accept();
})).then(function(){
me.btnAddPivot.updateHint(me.tipCreatePivot);
setEvents.call(me);
});
},
getPanel: function () {
this.$el = $(_.template(template)( {} ));
this.chRowHeader.render(this.$el.find('#slot-chk-header-row'));
this.chColHeader.render(this.$el.find('#slot-chk-header-column'));
this.chRowBanded.render(this.$el.find('#slot-chk-banded-row'));
this.chColBanded.render(this.$el.find('#slot-chk-banded-column'));
this.btnAddPivot.render(this.$el.find('#slot-btn-add-pivot'));
this.pivotStyles.render(this.$el.find('#slot-field-pivot-styles'));
return this.$el;
},
show: function () {
Common.UI.BaseView.prototype.show.call(this);
this.fireEvent('show', this);
},
getButton: function(type, parent) {
},
SetDisabled: function (state) {
this.lockedControls && this.lockedControls.forEach(function(button) {
if ( button ) {
button.setDisabled(state);
}
}, this);
},
txtCreate: 'Insert Table',
tipCreatePivot: 'Insert Pivot Table',
textRowHeader: 'Row Headers',
textColHeader: 'Column Headers',
textRowBanded: 'Banded Rows',
textColBanded: 'Banded Columns'
}
}()), SSE.Views.PivotTable || {}));
});

2
apps/spreadsheeteditor/main/app_dev.js
View file

@ -145,6 +145,7 @@ require([
'RightMenu',
'LeftMenu',
'Main',
'PivotTable',
'Common.Controllers.Fonts',
'Common.Controllers.Chat',
'Common.Controllers.Comments',
@ -164,6 +165,7 @@ require([
'spreadsheeteditor/main/app/controller/LeftMenu',
'spreadsheeteditor/main/app/controller/Main',
'spreadsheeteditor/main/app/controller/Print',
'spreadsheeteditor/main/app/controller/PivotTable',
'spreadsheeteditor/main/app/view/FileMenuPanels',
'spreadsheeteditor/main/app/view/ParagraphSettings',
'spreadsheeteditor/main/app/view/ImageSettings',