',
+ '
',
+ '
'
+ ].join(''));
+ this.cmbWrapType.render($('#chart-combo-wrap'));
+ this.cmbWrapType.openButton.menu.cmpEl.css({
+ 'min-width': 178,
+ 'max-width': 178
});
- this.btnWrapType.render($('#chart-button-wrap'));
- this.mnuWrapPicker.on('item:click', _.bind(this.onSelectWrap, this, this.btnWrapType));
- this.lockedControls.push(this.btnWrapType);
+ this.cmbWrapType.on('click', _.bind(this.onSelectWrap, this));
+ this.cmbWrapType.openButton.menu.on('show:after', function () {
+ me.cmbWrapType.menuPicker.scroller.update({alwaysVisibleY: true});
+ });
+ this.lockedControls.push(this.cmbWrapType);
this.btnChartType = new Common.UI.Button({
cls : 'btn-large-dataview',
@@ -315,42 +320,24 @@ define([
},
_ChartWrapStyleChanged: function(style) {
- if (!this.mnuWrapPicker) return;
+ if (!this.cmbWrapType) return;
if (this._state.WrappingStyle!==style) {
- this._noApply = true;
- var record = this.mnuWrapPicker.store.findWhere({data: style});
- this.mnuWrapPicker.selectRecord(record, true);
- if (record)
- this.btnWrapType.setIconCls('item-wrap ' + record.get('iconCls'));
+ this.cmbWrapType.suspendEvents();
+ var rec = this.cmbWrapType.menuPicker.store.findWhere({
+ data: style
+ });
+ this.cmbWrapType.menuPicker.selectRecord(rec);
+ this.cmbWrapType.resumeEvents();
this._state.WrappingStyle=style;
- this._noApply = false;
}
},
- onSelectWrap: function(btn, picker, itemView, record) {
- if (this._noApply) return;
-
- var rawData = {},
- isPickerSelect = _.isFunction(record.toJSON);
-
- if (isPickerSelect){
- if (record.get('selected')) {
- rawData = record.toJSON();
- } else {
- // record deselected
- return;
- }
- } else {
- rawData = record;
- }
-
- this.btnWrapType.setIconCls('item-wrap ' + rawData.iconCls);
-
+ onSelectWrap: function(combo, record) {
if (this.api) {
- var props = new Asc.asc_CImgProperty();
- props.put_WrappingStyle((rawData.data));
-
- if (this._state.WrappingStyle===Asc.c_oAscWrapStyle2.Inline && rawData.data!==Asc.c_oAscWrapStyle2.Inline ) {
+ var props = new Asc.asc_CImgProperty(),
+ data = record.get('data');
+ props.put_WrappingStyle(data);
+ if (this._state.WrappingStyle===Asc.c_oAscWrapStyle2.Inline && data!==Asc.c_oAscWrapStyle2.Inline ) {
props.put_PositionH(new Asc.CImagePositionH());
props.get_PositionH().put_UseAlign(false);
props.get_PositionH().put_RelativeFrom(Asc.c_oAscRelativeFromH.Column);
@@ -366,7 +353,6 @@ define([
this.api.ImgApply(props);
}
-
this.fireEvent('editcomplete', this);
},
diff --git a/apps/documenteditor/main/app/view/ImageSettings.js b/apps/documenteditor/main/app/view/ImageSettings.js
index 6b7243c99..75e6589d7 100644
--- a/apps/documenteditor/main/app/view/ImageSettings.js
+++ b/apps/documenteditor/main/app/view/ImageSettings.js
@@ -126,7 +126,7 @@ define([
menuMaxHeight: 300,
enableKeyEvents: true,
store: new Common.UI.DataViewStore(viewData),
- cls: 'combo-wrap'
+ cls: 'combo-chart-style'
});
this.cmbWrapType.menuPicker.itemTemplate = this.cmbWrapType.fieldPicker.itemTemplate = _.template([
'',
+ '',
diff --git a/apps/documenteditor/main/app/view/ShapeSettings.js b/apps/documenteditor/main/app/view/ShapeSettings.js
index d33dec7d0..75c136fe4 100644
--- a/apps/documenteditor/main/app/view/ShapeSettings.js
+++ b/apps/documenteditor/main/app/view/ShapeSettings.js
@@ -640,42 +640,24 @@ define([
},
_ImgWrapStyleChanged: function(style) {
- if (!this.mnuWrapPicker) return;
+ if (!this.cmbWrapType) return;
if (this._state.WrappingStyle!==style) {
- this._noApply = true;
- var record = this.mnuWrapPicker.store.findWhere({data: style});
- this.mnuWrapPicker.selectRecord(record, true);
- if (record)
- this.btnWrapType.setIconCls('item-wrap ' + record.get('iconcls'));
+ this.cmbWrapType.suspendEvents();
+ var rec = this.cmbWrapType.menuPicker.store.findWhere({
+ data: style
+ });
+ this.cmbWrapType.menuPicker.selectRecord(rec);
+ this.cmbWrapType.resumeEvents();
this._state.WrappingStyle=style;
- this._noApply = false;
}
},
- onSelectWrap: function(btn, picker, itemView, record) {
- if (this._noApply) return;
-
- var rawData = {},
- isPickerSelect = _.isFunction(record.toJSON);
-
- if (isPickerSelect){
- if (record.get('selected')) {
- rawData = record.toJSON();
- } else {
- // record deselected
- return;
- }
- } else {
- rawData = record;
- }
-
- this.btnWrapType.setIconCls('item-wrap ' + rawData.iconcls);
-
+ onSelectWrap: function(combo, record) {
if (this.api) {
- var props = new Asc.asc_CImgProperty();
- props.put_WrappingStyle((rawData.data));
-
- if (this._state.WrappingStyle===Asc.c_oAscWrapStyle2.Inline && rawData.data!==Asc.c_oAscWrapStyle2.Inline ) {
+ var props = new Asc.asc_CImgProperty(),
+ data = record.get('data');
+ props.put_WrappingStyle(data);
+ if (this._state.WrappingStyle===Asc.c_oAscWrapStyle2.Inline && data!==Asc.c_oAscWrapStyle2.Inline ) {
props.put_PositionH(new Asc.CImagePositionH());
props.get_PositionH().put_UseAlign(false);
props.get_PositionH().put_RelativeFrom(Asc.c_oAscRelativeFromH.Column);
@@ -691,7 +673,6 @@ define([
this.api.ImgApply(props);
}
-
this.fireEvent('editcomplete', this);
},
@@ -782,19 +763,19 @@ define([
var value = props.get_WrappingStyle();
if (this._state.WrappingStyle!==value) {
- var record = this.mnuWrapPicker.store.findWhere({data: value});
- this.mnuWrapPicker.selectRecord(record, true);
- if (record)
- this.btnWrapType.setIconCls('item-wrap ' + record.get('iconcls'));
- else
- this.btnWrapType.setIconCls('');
+ this.cmbWrapType.suspendEvents();
+ var rec = this.cmbWrapType.menuPicker.store.findWhere({
+ data: value
+ });
+ this.cmbWrapType.menuPicker.selectRecord(rec);
+ this.cmbWrapType.resumeEvents();
this._state.WrappingStyle=value;
}
value = props.get_CanBeFlow() && !this._locked;
var fromgroup = props.get_FromGroup() || this._locked;
if (this._state.CanBeFlow!==value || this._state.FromGroup!==fromgroup) {
- this.btnWrapType.setDisabled(!value || fromgroup);
+ this.cmbWrapType.setDisabled(!value || fromgroup);
this._state.CanBeFlow=value;
this._state.FromGroup=fromgroup;
}
@@ -1379,35 +1360,41 @@ define([
this.lockedControls.push(this.cmbBorderType);
var viewData = [
- { offsetx: 0, data: Asc.c_oAscWrapStyle2.Inline, iconcls:'wrap-inline', tip: this.txtInline, selected: true },
- { offsetx: 50, data: Asc.c_oAscWrapStyle2.Square, iconcls:'wrap-square', tip: this.txtSquare },
- { offsetx: 100, data: Asc.c_oAscWrapStyle2.Tight, iconcls:'wrap-tight', tip: this.txtTight },
- { offsetx: 150, data: Asc.c_oAscWrapStyle2.Through, iconcls:'wrap-through', tip: this.txtThrough },
- { offsetx: 200, data: Asc.c_oAscWrapStyle2.TopAndBottom, iconcls:'wrap-topAndBottom', tip: this.txtTopAndBottom },
- { offsetx: 250, data: Asc.c_oAscWrapStyle2.InFront, iconcls:'wrap-inFront', tip: this.txtInFront },
- { offsetx: 300, data: Asc.c_oAscWrapStyle2.Behind, iconcls:'wrap-behind', tip: this.txtBehind }
+ { offsetx: 0, data: Asc.c_oAscWrapStyle2.Inline, tip: this.txtInline, selected: true },
+ { offsetx: 50, data: Asc.c_oAscWrapStyle2.Square, tip: this.txtSquare },
+ { offsetx: 100, data: Asc.c_oAscWrapStyle2.Tight, tip: this.txtTight },
+ { offsetx: 150, data: Asc.c_oAscWrapStyle2.Through, tip: this.txtThrough },
+ { offsetx: 200, data: Asc.c_oAscWrapStyle2.TopAndBottom, tip: this.txtTopAndBottom },
+ { offsetx: 250, data: Asc.c_oAscWrapStyle2.InFront, tip: this.txtInFront },
+ { offsetx: 300, data: Asc.c_oAscWrapStyle2.Behind, tip: this.txtBehind }
];
- this.btnWrapType = new Common.UI.Button({
- cls : 'btn-large-dataview',
- iconCls : 'item-wrap wrap-inline',
- menu : new Common.UI.Menu({
- items: [
- { template: _.template('') }
- ]
- })
+
+ this.cmbWrapType = new Common.UI.ComboDataView({
+ itemWidth: 50,
+ itemHeight: 50,
+ menuMaxHeight: 300,
+ enableKeyEvents: true,
+ store: new Common.UI.DataViewStore(viewData),
+ cls: 'combo-chart-style'
});
- this.btnWrapType.on('render:after', function(btn) {
- me.mnuWrapPicker = new Common.UI.DataView({
- el: $('#id-shape-menu-wrap'),
- parentMenu: btn.menu,
- store: new Common.UI.DataViewStore(viewData),
- itemTemplate: _.template('')
- });
+ this.cmbWrapType.menuPicker.itemTemplate = this.cmbWrapType.fieldPicker.itemTemplate = _.template([
+ '
',
+ '',
+ '
'
+ ].join(''));
+ this.cmbWrapType.render($('#shape-combo-wrap'));
+ this.cmbWrapType.openButton.menu.cmpEl.css({
+ 'min-width': 178,
+ 'max-width': 178
});
- this.btnWrapType.render($('#shape-button-wrap'));
- this.mnuWrapPicker.on('item:click', _.bind(this.onSelectWrap, this, this.btnWrapType));
- this.lockedControls.push(this.btnWrapType);
+ this.cmbWrapType.on('click', _.bind(this.onSelectWrap, this));
+ this.cmbWrapType.openButton.menu.on('show:after', function () {
+ me.cmbWrapType.menuPicker.scroller.update({alwaysVisibleY: true});
+ });
+ this.lockedControls.push(this.cmbWrapType);
this.btnChangeShape = new Common.UI.Button({
cls: 'btn-icon-default',
',
+ '