diff --git a/apps/common/main/resources/less/buttons.less b/apps/common/main/resources/less/buttons.less
index 160ccb572..a0e6c8a3f 100644
--- a/apps/common/main/resources/less/buttons.less
+++ b/apps/common/main/resources/less/buttons.less
@@ -784,6 +784,13 @@
height: 54px;
}
+ .icon-template-slicer.icon {
+ min-width: 36px;
+ height: 55px;
+ line-height: 53px;
+ border: none;
+ }
+
.icon {
display: inline-block;
.btn.btnsize(52px);
diff --git a/apps/spreadsheeteditor/main/app/template/SlicerSettings.template b/apps/spreadsheeteditor/main/app/template/SlicerSettings.template
index 304bf2cf6..fb68d3f6b 100644
--- a/apps/spreadsheeteditor/main/app/template/SlicerSettings.template
+++ b/apps/spreadsheeteditor/main/app/template/SlicerSettings.template
@@ -72,7 +72,7 @@
|
-
+
|
diff --git a/apps/spreadsheeteditor/main/app/view/SlicerSettings.js b/apps/spreadsheeteditor/main/app/view/SlicerSettings.js
index a98e2b830..fcd2475be 100644
--- a/apps/spreadsheeteditor/main/app/view/SlicerSettings.js
+++ b/apps/spreadsheeteditor/main/app/view/SlicerSettings.js
@@ -83,6 +83,7 @@ define([
this._noApply = false;
this._originalProps = null;
+ this.styles = null;
this.render();
},
@@ -99,9 +100,7 @@ define([
setApi: function(api) {
if ( api == undefined ) return;
this.api = api;
- if (this.api) {
- // this.api.asc_registerCallback('asc_InitSlicerStyles', _.bind(this.onInitStyles, this));
- }
+ this.api.asc_registerCallback('asc_onSendThemeColors', _.bind(this.onSendThemeColors, this));
return this;
},
@@ -160,9 +159,10 @@ define([
this._nRatio = this.spnWidth.getNumberValue()/this.spnHeight.getNumberValue();
}
if (this.api) {
- var props = new Asc.asc_CImgProperty();
- props.asc_putLockAspect(btn.pressed);
- this.api.asc_setGraphicObjectProps(props);
+ if (this._originalProps) {
+ this._originalProps.asc_putLockAspect(btn.pressed);
+ this.api.asc_setGraphicObjectProps(this._originalProps);
+ }
}
}, this));
@@ -237,9 +237,9 @@ define([
});
this.lockedControls.push(this.numCols);
- // this.spnColWidth.on('change', _.bind(this.onColWidthChange, this));
- // this.spnColHeight.on('change', _.bind(this.onColHeightChange, this));
- // this.numCols.on('change', _.bind(this.onColChange, this));
+ this.spnColWidth.on('change', _.bind(this.onColWidthChange, this));
+ this.spnColHeight.on('change', _.bind(this.onColHeightChange, this));
+ this.numCols.on('change', _.bind(this.onColChange, this));
this.spnColWidth.on('inputleave', function(){ Common.NotificationCenter.trigger('edit:complete', me);});
this.spnColHeight.on('inputleave', function(){ Common.NotificationCenter.trigger('edit:complete', me);});
this.numCols.on('inputleave', function(){ Common.NotificationCenter.trigger('edit:complete', me);});
@@ -253,6 +253,14 @@ define([
this._initSettings = false;
},
+ onSendThemeColors: function() {
+ // get new table templates
+ if (this.mnuSlicerPicker && this._originalProps) {
+ this.onInitStyles(this._originalProps.asc_getSlicerProperties().asc_getStylesPictures());
+ this.mnuSlicerPicker.scroller.update({alwaysVisibleY: true});
+ }
+ },
+
openAdvancedSettings: function(e) {
if (this.linkAdvanced.hasClass('disabled')) return;
@@ -270,6 +278,7 @@ define([
{
imageProps: elValue,
api: me.api,
+ styles: me.styles || me._originalProps.asc_getSlicerProperties().asc_getStylesPictures(),
handler: function(result, value) {
if (result == 'ok') {
if (me.api) {
@@ -328,12 +337,12 @@ define([
this._state.ColCount = value;
}
- // value = props.asc_getColWidth()/36000;
- // if ( Math.abs(this._state.ColWidth-value)>0.001 ||
- // (this._state.ColWidth===null || value===null)&&(this._state.ColWidth!==value)) {
- // this.spnColWidth.setValue((value!==null) ? Common.Utils.Metric.fnRecalcFromMM(value) : '', true);
- // this._state.ColWidth = value;
- // }
+ value = slicerprops.asc_getButtonWidth()/36000;
+ if ( Math.abs(this._state.ColWidth-value)>0.001 ||
+ (this._state.ColWidth===null || value===null)&&(this._state.ColWidth!==value)) {
+ this.spnColWidth.setValue((value!==null) ? Common.Utils.Metric.fnRecalcFromMM(value) : '', true);
+ this._state.ColWidth = value;
+ }
value = slicerprops.asc_getRowHeight()/36000;
if ( Math.abs(this._state.ColHeight-value)>0.001 ||
@@ -342,18 +351,22 @@ define([
this._state.ColHeight = value;
}
- value = slicerprops.asc_getStyle();
if (!this.btnSlicerStyle)
- this.onInitStyles();
- // var rec = this.mnuSlicerPicker.store.findWhere({type: value});
- // if (!rec) {
- // rec = this.mnuSlicerPicker.store.at(0);
- // }
- // this.btnSlicerStyle.suspendEvents();
- // this.mnuSlicerPicker.selectRecord(rec, true);
- // this.btnSlicerStyle.resumeEvents();
- // this.$el.find('.icon-template-table').css({'background-image': 'url(' + rec.get("imageUrl") + ')', 'height': '48px', 'width': '63px', 'background-position': 'center', 'background-size': 'cover'});
- this.$el.find('.icon-template-table').css({'height': '48px', 'width': '63px', 'background-position': 'center', 'background-size': 'cover'});
+ this.onInitStyles(slicerprops.asc_getStylesPictures());
+ value = slicerprops.asc_getStyle();
+ if (this._state.StyleType!==value || this._isTemplatesChanged) {
+ var rec = this.mnuSlicerPicker.store.findWhere({type: value});
+ if (!rec) {
+ rec = this.mnuSlicerPicker.store.at(0);
+ }
+ this.btnSlicerStyle.suspendEvents();
+ this.mnuSlicerPicker.selectRecord(rec, true);
+ this.btnSlicerStyle.resumeEvents();
+ this.$el.find('.icon-template-slicer').css({'background-image': 'url(' + rec.get("imageUrl") + ')', 'height': '49px', 'width': '36px', 'background-position': 'center', 'background-size': 'cover'});
+ this._state.StyleType=value;
+ }
+ this._isTemplatesChanged = false;
+
}
}
},
@@ -371,10 +384,11 @@ define([
this.spnHeight.setValue(h, true);
}
if (this.api) {
- var props = new Asc.asc_CImgProperty();
- props.asc_putWidth(Common.Utils.Metric.fnRecalcToMM(w));
- props.asc_putHeight(Common.Utils.Metric.fnRecalcToMM(h));
- this.api.asc_setGraphicObjectProps(props);
+ if (this._originalProps) {
+ this._originalProps.asc_putWidth(Common.Utils.Metric.fnRecalcToMM(w));
+ this._originalProps.asc_putHeight(Common.Utils.Metric.fnRecalcToMM(h));
+ this.api.asc_setGraphicObjectProps(this._originalProps);
+ }
}
},
@@ -390,25 +404,54 @@ define([
this.spnWidth.setValue(w, true);
}
if (this.api) {
- var props = new Asc.asc_CImgProperty();
- props.asc_putWidth(Common.Utils.Metric.fnRecalcToMM(w));
- props.asc_putHeight(Common.Utils.Metric.fnRecalcToMM(h));
- this.api.asc_setGraphicObjectProps(props);
+ if (this._originalProps) {
+ this._originalProps.asc_putWidth(Common.Utils.Metric.fnRecalcToMM(w));
+ this._originalProps.asc_putHeight(Common.Utils.Metric.fnRecalcToMM(h));
+ this.api.asc_setGraphicObjectProps(this._originalProps);
+ }
+ }
+ },
+
+ onColWidthChange: function(field, newValue, oldValue, eOpts){
+ if (this.api) {
+ if (this._originalProps) {
+ this._originalProps.asc_getSlicerProperties().asc_setButtonWidth(Common.Utils.Metric.fnRecalcToMM(field.getNumberValue())*36000);
+ this.api.asc_setGraphicObjectProps(this._originalProps);
+ }
+ }
+ },
+
+ onColHeightChange: function(field, newValue, oldValue, eOpts){
+ if (this.api) {
+ if (this._originalProps) {
+ this._originalProps.asc_getSlicerProperties().asc_setRowHeight(Common.Utils.Metric.fnRecalcToMM(field.getNumberValue())*36000);
+ this.api.asc_setGraphicObjectProps(this._originalProps);
+ }
+ }
+ },
+
+ onColChange: function(field, newValue, oldValue, eOpts){
+ if (this.api) {
+ if (this._originalProps) {
+ this._originalProps.asc_getSlicerProperties().asc_setColumnCount(field.getNumberValue());
+ this.api.asc_setGraphicObjectProps(this._originalProps);
+ }
}
},
onInitStyles: function(Templates){
var self = this;
this._isTemplatesChanged = true;
+ this.styles = Templates;
if (!this.btnSlicerStyle) {
this.btnSlicerStyle = new Common.UI.Button({
- cls : 'btn-large-dataview sheet-template-table',
- iconCls : 'icon-template-table',
+ cls : 'btn-large-dataview sheet-template-slicer',
+ iconCls : 'icon-template-slicer',
menu : new Common.UI.Menu({
- style: 'width: 400px;',
+ style: 'width: 333px;',
items: [
- { template: _.template('') }
+ { template: _.template('') }
]
})
});
@@ -419,7 +462,7 @@ define([
restoreHeight: 325,
groups: new Common.UI.DataViewGroupStore(),
store: new Common.UI.DataViewStore(),
- itemTemplate: _.template(''),
+ itemTemplate: _.template(''),
style: 'max-height: 325px;'
});
});
@@ -441,7 +484,7 @@ define([
_.each(Templates, function(template){
arr.push({
id : Common.UI.getId(),
- type : template.asc_getType(),
+ type : template.asc_getName(),
imageUrl : template.asc_getImage(),
allowSelected : true,
selected : false
@@ -452,12 +495,13 @@ define([
}
},
- onSelectSlicerStyle: function(combo, record) {
+ onSelectSlicerStyle: function(btn, picker, itemView, record) {
if (this._noApply) return;
- // if (this._originalProps) {
- // this._originalProps..asc_getSlicerProperties().asc_setStyle(record.get('type'));
- // }
+ if (this._originalProps) {
+ this._originalProps.asc_getSlicerProperties().asc_setStyle(record.get('type'));
+ this.api.asc_setGraphicObjectProps(this._originalProps);
+ }
},
setLocked: function (locked) {
diff --git a/apps/spreadsheeteditor/main/app/view/SlicerSettingsAdvanced.js b/apps/spreadsheeteditor/main/app/view/SlicerSettingsAdvanced.js
index be8a75ff1..924fe5148 100644
--- a/apps/spreadsheeteditor/main/app/view/SlicerSettingsAdvanced.js
+++ b/apps/spreadsheeteditor/main/app/view/SlicerSettingsAdvanced.js
@@ -105,12 +105,12 @@ define([ 'text!spreadsheeteditor/main/app/template/SlicerSettingsAdvanced.tem
this.btnSlicerStyle = new Common.UI.Button({
parentEl: $('#sliceradv-btn-style'),
- cls : 'btn-large-dataview sheet-template-table',
- iconCls : 'icon-template-table',
+ cls : 'btn-large-dataview sheet-template-slicer',
+ iconCls : 'icon-template-slicer',
menu : new Common.UI.Menu({
- style: 'width: 400px;',
+ style: 'width: 333px;',
items: [
- { template: _.template('') }
+ { template: _.template('') }
]
})
});
@@ -120,7 +120,7 @@ define([ 'text!spreadsheeteditor/main/app/template/SlicerSettingsAdvanced.tem
restoreHeight: 325,
groups: new Common.UI.DataViewGroupStore(),
store: new Common.UI.DataViewStore(),
- itemTemplate: _.template(''),
+ itemTemplate: _.template(''),
style: 'max-height: 325px;'
});
this.mnuSlicerPicker.on('item:click', _.bind(this.onSelectSlicerStyle, this, this.btnSlicerStyle));
@@ -161,24 +161,6 @@ define([ 'text!spreadsheeteditor/main/app/template/SlicerSettingsAdvanced.tem
}, this));
this.spinners.push(this.numHeight);
- // this.numColWidth = new Common.UI.MetricSpinner({
- // el: $('#sliceradv-spin-col-width'),
- // step: .1,
- // width: 85,
- // defaultUnit : "cm",
- // defaultValue : 0,
- // value: '0 cm',
- // maxValue: 5963.9,
- // minValue: 0,
- // visible: false
- // });
- // this.numColWidth.on('change', _.bind(function(field, newValue, oldValue, eOpts){
- // var numval = field.getNumberValue();
- // if (this._changedProps) {
- // }
- // }, this));
- // this.spinners.push(this.numColWidth);
-
this.numColHeight = new Common.UI.MetricSpinner({
el: $('#sliceradv-spin-col-height'),
step: .1,
@@ -393,15 +375,14 @@ define([ 'text!spreadsheeteditor/main/app/template/SlicerSettingsAdvanced.tem
this.lblFormula.text(slicerprops.asc_getNameInFormulas());
value = slicerprops.asc_getStyle();
- // var rec = this.mnuSlicerPicker.store.findWhere({type: value});
- // if (!rec) {
- // rec = this.mnuSlicerPicker.store.at(0);
- // }
- // this.btnSlicerStyle.suspendEvents();
- // this.mnuSlicerPicker.selectRecord(rec, true);
- // this.btnSlicerStyle.resumeEvents();
- // this.$el.find('.icon-template-table').css({'background-image': 'url(' + rec.get("imageUrl") + ')', 'height': '48px', 'width': '63px', 'background-position': 'center', 'background-size': 'cover'});
- this.$window.find('.icon-template-table').css({'height': '48px', 'width': '63px', 'background-position': 'center', 'background-size': 'cover'});
+ var rec = this.mnuSlicerPicker.store.findWhere({type: value});
+ if (!rec) {
+ rec = this.mnuSlicerPicker.store.at(0);
+ }
+ this.btnSlicerStyle.suspendEvents();
+ this.mnuSlicerPicker.selectRecord(rec, true);
+ this.btnSlicerStyle.resumeEvents();
+ this.$window.find('.icon-template-slicer').css({'background-image': 'url(' + rec.get("imageUrl") + ')', 'height': '49px', 'width': '36px', 'background-position': 'center', 'background-size': 'cover'});
this._noApply = false;
@@ -421,7 +402,7 @@ define([ 'text!spreadsheeteditor/main/app/template/SlicerSettingsAdvanced.tem
afterRender: function() {
this.updateMetricUnit();
- // this.onInitStyles(this.options.styles);
+ this.onInitStyles(this.options.styles);
this._setDefaults(this._originalProps);
if (this.storageName) {
var value = Common.localStorage.getItem(this.storageName);
@@ -432,10 +413,10 @@ define([ 'text!spreadsheeteditor/main/app/template/SlicerSettingsAdvanced.tem
onInitStyles: function(Templates){
var count = this.mnuSlicerPicker.store.length,
arr = [];
- _.each(Templates, function(template){
+ Templates && _.each(Templates, function(template){
arr.push({
id : Common.UI.getId(),
- type : template.asc_getType(),
+ type : template.asc_getName(),
imageUrl : template.asc_getImage(),
allowSelected : true,
selected : false
@@ -444,7 +425,7 @@ define([ 'text!spreadsheeteditor/main/app/template/SlicerSettingsAdvanced.tem
this.mnuSlicerPicker.store.reset(arr);
},
- onSelectSlicerStyle: function(combo, record) {
+ onSelectSlicerStyle: function(btn, picker, itemView, record) {
if (this._noApply) return;
if (this._changedProps) {
diff --git a/apps/spreadsheeteditor/main/resources/less/rightmenu.less b/apps/spreadsheeteditor/main/resources/less/rightmenu.less
index 596b0f3a6..28a25d517 100644
--- a/apps/spreadsheeteditor/main/resources/less/rightmenu.less
+++ b/apps/spreadsheeteditor/main/resources/less/rightmenu.less
@@ -320,4 +320,16 @@ button:active:not(.disabled) .btn-change-shape {background-position: -56px -
}
}
}
-}
\ No newline at end of file
+}
+
+.sheet-template-slicer {
+ width: 56px;
+ height: 55px;
+}
+
+.menu-slicer-template {
+ .item {
+ border: none;
+ .box-shadow(none);
+ }
+}