diff --git a/apps/spreadsheeteditor/main/app/view/PivotSettings.js b/apps/spreadsheeteditor/main/app/view/PivotSettings.js
index af155a8ec..c03a3a9aa 100644
--- a/apps/spreadsheeteditor/main/app/view/PivotSettings.js
+++ b/apps/spreadsheeteditor/main/app/view/PivotSettings.js
@@ -192,28 +192,30 @@ define([
'<% } %>',
'',
'
<%= Common.Utils.String.htmlEncode(value) %>
',
+ '',
''
].join(''))
});
- this.fieldsList.on('item:select', _.bind(this.onFieldsCheck, this));
+ this.fieldsList.on('item:click', _.bind(this.onFieldsCheck, this));
// this.fieldsList.onKeyDown = _.bind(this.onFieldsListKeyDown, this);
this.lockedControls.push(this.fieldsList);
// Sortable.create(this.fieldsList.$el.find('.listview')[0], {});
+ var itemTemplate = _.template([
+ '',
+ '
<%= Common.Utils.String.htmlEncode(value) %>
',
+ '
',
+ '
'
+ ].join(''));
this.columnsList = new Common.UI.ListView({
el: $('#pivot-list-columns'),
store: new Common.UI.DataViewStore(),
simpleAddMode: true,
template: _.template([''].join('')),
- itemTemplate: _.template([
- '',
- '
<%= Common.Utils.String.htmlEncode(value) %>
',
- '
',
- '
'
- ].join(''))
+ itemTemplate: itemTemplate
});
- // this.columnsList.on('item:select', _.bind(this.onColumnsSelect, this));
+ this.columnsList.on('item:click', _.bind(this.onColumnsSelect, this, 0));
// this.columnsList.onKeyDown = _.bind(this.onColumnsListKeyDown, this);
this.lockedControls.push(this.columnsList);
@@ -222,14 +224,9 @@ define([
store: new Common.UI.DataViewStore(),
simpleAddMode: true,
template: _.template([''].join('')),
- itemTemplate: _.template([
- '',
- '
<%= Common.Utils.String.htmlEncode(value) %>
',
- '
',
- '
'
- ].join(''))
+ itemTemplate: itemTemplate
});
- // this.rowsList.on('item:select', _.bind(this.onRowSelect, this));
+ this.rowsList.on('item:click', _.bind(this.onColumnsSelect, this, 1));
// this.rowsList.onKeyDown = _.bind(this.onRowsListKeyDown, this);
this.lockedControls.push(this.rowsList);
@@ -238,14 +235,9 @@ define([
store: new Common.UI.DataViewStore(),
simpleAddMode: true,
template: _.template([''].join('')),
- itemTemplate: _.template([
- '',
- '
<%= Common.Utils.String.htmlEncode(value) %>
',
- '
',
- '
'
- ].join(''))
+ itemTemplate: itemTemplate
});
- // this.valuesList.on('item:select', _.bind(this.onValuesSelect, this));
+ this.valuesList.on('item:click', _.bind(this.onColumnsSelect, this, 2));
// this.valuesList.onKeyDown = _.bind(this.onValuesListKeyDown, this);
this.lockedControls.push(this.valuesList);
@@ -254,14 +246,9 @@ define([
store: new Common.UI.DataViewStore(),
simpleAddMode: true,
template: _.template([''].join('')),
- itemTemplate: _.template([
- '',
- '
<%= Common.Utils.String.htmlEncode(value) %>
',
- '
',
- '
'
- ].join(''))
+ itemTemplate: itemTemplate
});
- // this.filtersList.on('item:select', _.bind(this.onFiltersSelect, this));
+ this.filtersList.on('item:click', _.bind(this.onColumnsSelect, this,3));
// this.filtersList.onKeyDown = _.bind(this.onFiltersListKeyDown, this);
this.lockedControls.push(this.filtersList);
@@ -313,15 +300,16 @@ define([
var arr = [], isChecked = [],
value = props.asc_getColumnFields();
- value && value.forEach(function (item) {
- var index = item.asc_getIndex();
- if (index>-1 || index == -2) {
- var name = (index>-1) ? names[index] : me.textValues;
+ value && value.forEach(function (item, index) {
+ var pivotIndex = item.asc_getIndex();
+ if (pivotIndex>-1 || pivotIndex == -2) {
+ var name = (pivotIndex>-1) ? names[pivotIndex] : me.textValues;
arr.push(new Common.UI.DataViewModel({
selected : false,
- allowSelected : true,
+ allowSelected : false,
+ pivotIndex : pivotIndex,
index : index,
- value : name,
+ value : name,
tip : (name.length>10) ? name : ''
}));
isChecked[name] = true;
@@ -332,13 +320,14 @@ define([
arr = [];
value = props.asc_getRowFields();
- value && value.forEach(function (item) {
- var index = item.asc_getIndex();
- if (index>-1 || index == -2) {
- var name = (index>-1) ? names[index] : me.textValues;
+ value && value.forEach(function (item, index) {
+ var pivotIndex = item.asc_getIndex();
+ if (pivotIndex>-1 || pivotIndex == -2) {
+ var name = (pivotIndex>-1) ? names[pivotIndex] : me.textValues;
arr.push(new Common.UI.DataViewModel({
selected : false,
- allowSelected : true,
+ allowSelected : false,
+ pivotIndex : pivotIndex,
index : index,
value : name,
tip : (name.length>10) ? name : ''
@@ -351,18 +340,19 @@ define([
arr = [];
value = props.asc_getDataFields();
- value && value.forEach(function (item) {
- var index = item.asc_getIndex();
- if (index>-1) {
+ value && value.forEach(function (item, index) {
+ var pivotIndex = item.asc_getIndex();
+ if (pivotIndex>-1) {
var name = item.asc_getName();
arr.push(new Common.UI.DataViewModel({
selected : false,
- allowSelected : true,
+ allowSelected : false,
+ pivotIndex : pivotIndex,
index : index,
value : name,
tip : (name.length>10) ? name : ''
}));
- isChecked[names[index]] = true;
+ isChecked[names[pivotIndex]] = true;
}
});
this.valuesList.store.reset(arr);
@@ -370,13 +360,14 @@ define([
arr = [];
value = props.asc_getPageFields();
- value && value.forEach(function (item) {
- var index = item.asc_getIndex();
- if (index>-1) {
- var name = names[index];
+ value && value.forEach(function (item, index) {
+ var pivotIndex = item.asc_getIndex();
+ if (pivotIndex>-1) {
+ var name = names[pivotIndex];
arr.push(new Common.UI.DataViewModel({
selected : false,
- allowSelected : true,
+ allowSelected : false,
+ pivotIndex : pivotIndex,
index : index,
value : name,
tip : (name.length>10) ? name : ''
@@ -388,11 +379,12 @@ define([
this.filtersList.scroller.update({minScrollbarLength : 40, alwaysVisibleY: true, suppressScrollX: true});
arr = [];
- names.forEach(function (item) {
+ names.forEach(function (item, index) {
arr.push(new Common.UI.DataViewModel({
selected : false,
- allowSelected : true,
+ allowSelected : false,
value : item,
+ index : index,
tip : (name.length>25) ? name : '',
check : isChecked[item]
}));
@@ -410,6 +402,87 @@ define([
var event = window.event ? window.event : window._event;
if (event) {
+
+ var btn = $(event.target);
+ if (btn && btn.hasClass('listitem-icon')) {
+ if (this.pivotFieldsMenu) {
+ if (this.pivotFieldsMenu.isVisible()) {
+ this.pivotFieldsMenu.hide();
+ return;
+ }
+ } else {
+ this.miAddFilter = new Common.UI.MenuItem({
+ caption : this.txtAddFilter,
+ checkable : false
+ });
+ // this.miAddFilter.on('click', _.bind(this.onAddFilter, this));
+ this.miAddRow = new Common.UI.MenuItem({
+ caption : this.txtAddRow,
+ checkable : false
+ });
+ // this.miAddRow.on('click', _.bind(this.onAddRow, this));
+ this.miAddColumn = new Common.UI.MenuItem({
+ caption : this.txtAddColumn,
+ checkable : false
+ });
+ // this.miAddColumn.on('click', _.bind(this.onAddColumn, this));
+ this.miAddValues = new Common.UI.MenuItem({
+ caption : this.txtAddValues,
+ checkable : false
+ });
+ // this.miAddValues.on('click', _.bind(this.onAddValues, this));
+
+ this.pivotFieldsMenu = new Common.UI.Menu({
+ menuAlign: 'tr-br',
+ items: [
+ this.miAddFilter,
+ this.miAddRow,
+ this.miAddColumn,
+ this.miAddValues
+ ]
+ });
+ }
+
+ var recIndex = (record != undefined) ? record.get('index') : -1;
+
+ var menu = this.pivotFieldsMenu,
+ showPoint, me = this,
+ currentTarget = $(event.currentTarget),
+ parent = $(this.el),
+ offset = currentTarget.offset(),
+ offsetParent = parent.offset();
+
+ showPoint = [offset.left - offsetParent.left + currentTarget.width(), offset.top - offsetParent.top + currentTarget.height()/2];
+
+ var menuContainer = parent.find('#menu-pivot-fields-container');
+ if (!menu.rendered) {
+ if (menuContainer.length < 1) {
+ menuContainer = $('', menu.id);
+ parent.append(menuContainer);
+ }
+ menu.render(menuContainer);
+ menu.cmpEl.attr({tabindex: "-1"});
+
+ menu.on('show:after', function(cmp) {
+ if (cmp && cmp.menuAlignEl)
+ cmp.menuAlignEl.toggleClass('over', true);
+ }).on('hide:after', function(cmp) {
+ if (cmp && cmp.menuAlignEl)
+ cmp.menuAlignEl.toggleClass('over', false);
+ });
+ }
+
+ menu.menuAlignEl = currentTarget;
+ menu.setOffset(-20, -currentTarget.height()/2 - 3);
+ menu.show();
+ _.delay(function() {
+ menu.cmpEl.focus();
+ }, 10);
+ event.stopPropagation();
+ event.preventDefault();
+ return;
+ }
+
type = event.target.type;
target = $(event.currentTarget).find('.list-item');
@@ -444,10 +517,164 @@ define([
}
},
+ onColumnsSelect: function(type, picker, item, record, e){
+ var btn = $(e.target);
+ if (btn && btn.hasClass('listitem-icon')) {
+ if (this.fieldsMenu) {
+ if (this.fieldsMenu.isVisible()) {
+ this.fieldsMenu.hide();
+ return;
+ }
+ } else {
+ this.miMoveUp = new Common.UI.MenuItem({
+ caption : this.txtMoveUp,
+ checkable : false
+ });
+ // this.miMoveUp.on('click', _.bind(this.onMoveUp, this));
+ this.miMoveDown = new Common.UI.MenuItem({
+ caption : this.txtMoveDown,
+ checkable : false
+ });
+ // this.miMoveDown.on('click', _.bind(this.onMoveDown, this));
+ this.miMoveBegin = new Common.UI.MenuItem({
+ caption : this.txtMoveBegin,
+ checkable : false
+ });
+ // this.miMoveBegin.on('click', _.bind(this.onMoveBegin, this));
+ this.miMoveEnd = new Common.UI.MenuItem({
+ caption : this.txtMoveEnd,
+ checkable : false
+ });
+ // this.miMoveEnd.on('click', _.bind(this.onMoveEnd, this));
+
+ this.miMoveFilter = new Common.UI.MenuItem({
+ caption : this.txtMoveFilter,
+ checkable : false
+ });
+ // this.miMoveFilter.on('click', _.bind(this.onMoveFilter, this));
+ this.miMoveRow = new Common.UI.MenuItem({
+ caption : this.txtMoveRow,
+ checkable : false
+ });
+ // this.miMoveRow.on('click', _.bind(this.onMoveRow, this));
+ this.miMoveColumn = new Common.UI.MenuItem({
+ caption : this.txtMoveColumn,
+ checkable : false
+ });
+ // this.miMoveColumn.on('click', _.bind(this.onMoveColumn, this));
+ this.miMoveValues = new Common.UI.MenuItem({
+ caption : this.txtMoveValues,
+ checkable : false
+ });
+ // this.miMoveValues.on('click', _.bind(this.onMoveValues, this));
+
+ this.miRemove = new Common.UI.MenuItem({
+ caption : this.txtRemove,
+ checkable : false
+ });
+ // this.miRemove.on('click', _.bind(this.onRemove, this));
+
+ this.miFieldSettings = new Common.UI.MenuItem({
+ caption : this.txtFieldSettings,
+ checkable : false
+ });
+ this.miFieldSettings.on('click', _.bind(this.onFieldSettings, this, record));
+
+ this.fieldsMenu = new Common.UI.Menu({
+ menuAlign: 'tr-br',
+ items: [
+ this.miMoveUp,
+ this.miMoveDown,
+ this.miMoveBegin,
+ this.miMoveEnd,
+ {caption : '--'},
+ this.miMoveFilter,
+ this.miMoveRow,
+ this.miMoveColumn,
+ this.miMoveValues,
+ {caption : '--'},
+ this.miRemove,
+ {caption : '--'},
+ this.miFieldSettings
+ ]
+ });
+ }
+
+ this.miMoveFilter.setDisabled(type == 3); // menu for filter
+ this.miMoveRow.setDisabled(type == 1); // menu for row
+ this.miMoveColumn.setDisabled(type == 0); // menu for column
+ this.miMoveValues.setDisabled(type == 2); // menu for value
+
+ var recIndex = (record != undefined) ? record.get('index') : -1,
+ len = picker.store.length;
+ this.miMoveUp.setDisabled(recIndex<1);
+ this.miMoveDown.setDisabled(recIndex>len-2 || recIndex<0);
+ this.miMoveBegin.setDisabled(recIndex<1);
+ this.miMoveEnd.setDisabled(recIndex>len-2 || recIndex<0);
+
+ this.miFieldSettings.setDisabled(record.get('pivotIndex')==-2);
+
+ var menu = this.fieldsMenu,
+ showPoint, me = this,
+ currentTarget = $(e.currentTarget),
+ parent = $(this.el),
+ offset = currentTarget.offset(),
+ offsetParent = parent.offset();
+
+ showPoint = [offset.left - offsetParent.left + currentTarget.width(), offset.top - offsetParent.top + currentTarget.height()/2];
+
+ var menuContainer = parent.find('#menu-pivot-container');
+ if (!menu.rendered) {
+ if (menuContainer.length < 1) {
+ menuContainer = $('', menu.id);
+ parent.append(menuContainer);
+ }
+ menu.render(menuContainer);
+ menu.cmpEl.attr({tabindex: "-1"});
+
+ menu.on('show:after', function(cmp) {
+ if (cmp && cmp.menuAlignEl)
+ cmp.menuAlignEl.toggleClass('over', true);
+ }).on('hide:after', function(cmp) {
+ if (cmp && cmp.menuAlignEl)
+ cmp.menuAlignEl.toggleClass('over', false);
+ });
+ }
+
+ menu.menuAlignEl = currentTarget;
+ menu.setOffset(-20, -currentTarget.height()/2 - 3);
+ menu.show();
+ _.delay(function() {
+ menu.cmpEl.focus();
+ }, 10);
+ e.stopPropagation();
+ e.preventDefault();
+ }
+ },
+
setLocked: function (locked) {
this._locked = locked;
},
+ onFieldSettings: function(e) {
+ var me = this;
+ var win;
+ if (me.api && !this._locked){
+ (new SSE.Views.TableSettingsAdvanced(
+ {
+ tableProps: 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);
+ }
+ })).show();
+ }
+ },
+
disableControls: function(disable) {
if (this._initSettings) return;
@@ -468,7 +695,21 @@ define([
textColumns : 'Columns',
textFilters : 'Filters',
notcriticalErrorTitle : 'Warning',
- textAdvanced: 'Show advanced settings'
+ textAdvanced: 'Show advanced settings',
+ txtMoveUp: 'Move Up',
+ txtMoveDown: 'Move Down',
+ txtMoveBegin: 'Move to Beginning',
+ txtMoveEnd: 'Move to End',
+ txtMoveFilter: 'Move to Filters',
+ txtMoveRow: 'Move to Rows',
+ txtMoveColumn: 'Move to Columns',
+ txtMoveValues: 'Move to Values',
+ txtRemove: 'Remove Field',
+ txtFieldSettings: 'Field Settings',
+ txtAddFilter: 'Add to Filters',
+ txtAddRow: 'Add to Rows',
+ txtAddColumn: 'Add to Columns',
+ txtAddValues: 'Add to Values',
}, SSE.Views.PivotSettings || {}));
});
\ No newline at end of file
diff --git a/apps/spreadsheeteditor/main/resources/less/rightmenu.less b/apps/spreadsheeteditor/main/resources/less/rightmenu.less
index bb847e37a..7197ac7e5 100644
--- a/apps/spreadsheeteditor/main/resources/less/rightmenu.less
+++ b/apps/spreadsheeteditor/main/resources/less/rightmenu.less
@@ -338,8 +338,12 @@ button:active:not(.disabled) .btn-change-shape {background-position: -56px -
width: 100%;
height: 250px;
+ .item {
+ padding-right: 3px;
+ }
+
.list-item {
- width: 160px;
+ width: 146px;
margin-left:20px;
display: inline-block;
white-space: pre;
@@ -347,6 +351,14 @@ button:active:not(.disabled) .btn-change-shape {background-position: -56px -
text-overflow: ellipsis;
vertical-align: middle;
}
+
+ .listitem-icon {
+ vertical-align: middle;
+ width: 16px;
+ height: 16px;
+ background-position: -1px -274px;
+ display: inline-block;
+ }
}
.pivot-listview {
@@ -354,6 +366,10 @@ button:active:not(.disabled) .btn-change-shape {background-position: -56px -
width: 95px;
height: 130px;
+ .item {
+ padding: 3px;
+ }
+
.list-item > div:nth-child(1) {
width:70px;
padding-right: 5px;
@@ -365,7 +381,10 @@ button:active:not(.disabled) .btn-change-shape {background-position: -56px -
}
.listitem-icon {
- display: inline;
vertical-align: middle;
+ width: 16px;
+ height: 16px;
+ background-position: -1px -274px;
+ display: inline-block;
}
}