[PE] Add columns settings to Home tab
Julia Radzhabova
|
Before Width: | Height: | Size: 118 B After Width: | Height: | Size: 118 B |
|
Before Width: | Height: | Size: 118 B After Width: | Height: | Size: 118 B |
|
Before Width: | Height: | Size: 118 B After Width: | Height: | Size: 118 B |
|
Before Width: | Height: | Size: 102 B After Width: | Height: | Size: 102 B |
|
Before Width: | Height: | Size: 105 B After Width: | Height: | Size: 105 B |
|
Before Width: | Height: | Size: 104 B After Width: | Height: | Size: 104 B |
|
Before Width: | Height: | Size: 119 B After Width: | Height: | Size: 119 B |
|
Before Width: | Height: | Size: 118 B After Width: | Height: | Size: 118 B |
|
Before Width: | Height: | Size: 120 B After Width: | Height: | Size: 120 B |
|
Before Width: | Height: | Size: 96 B After Width: | Height: | Size: 96 B |
|
Before Width: | Height: | Size: 93 B After Width: | Height: | Size: 93 B |
|
Before Width: | Height: | Size: 99 B After Width: | Height: | Size: 99 B |
|
Before Width: | Height: | Size: 118 B After Width: | Height: | Size: 118 B |
|
Before Width: | Height: | Size: 120 B After Width: | Height: | Size: 120 B |
|
Before Width: | Height: | Size: 120 B After Width: | Height: | Size: 120 B |
|
|
@ -104,7 +104,8 @@ define([
|
|||
zoom_percent: undefined,
|
||||
fontsize: undefined,
|
||||
in_equation: undefined,
|
||||
in_chart: false
|
||||
in_chart: false,
|
||||
no_columns: false
|
||||
};
|
||||
this._isAddingShape = false;
|
||||
this.slideSizeArr = [
|
||||
|
|
@ -300,6 +301,8 @@ define([
|
|||
toolbar.mnuFontColorPicker.on('select', _.bind(this.onSelectFontColor, this));
|
||||
$('#id-toolbar-menu-new-fontcolor').on('click', _.bind(this.onNewFontColor, this));
|
||||
toolbar.btnLineSpace.menu.on('item:toggle', _.bind(this.onLineSpaceToggle, this));
|
||||
toolbar.btnColumns.menu.on('item:click', _.bind(this.onColumnsSelect, this));
|
||||
toolbar.btnColumns.menu.on('show:before', _.bind(this.onBeforeColumns, this));
|
||||
toolbar.btnShapeAlign.menu.on('item:click', _.bind(this.onShapeAlign, this));
|
||||
toolbar.btnShapeAlign.menu.on('show:before', _.bind(this.onBeforeShapeAlign, this));
|
||||
toolbar.btnShapeArrange.menu.on('item:click', _.bind(this.onShapeArrange, this));
|
||||
|
|
@ -671,7 +674,8 @@ define([
|
|||
no_object = true,
|
||||
in_equation = false,
|
||||
in_chart = false,
|
||||
layout_index = -1;
|
||||
layout_index = -1,
|
||||
no_columns = false;
|
||||
|
||||
while (++i < selectedObjects.length) {
|
||||
type = selectedObjects[i].get_ObjectType();
|
||||
|
|
@ -695,7 +699,20 @@ define([
|
|||
type == Asc.c_oAscTypeSelectElement.Shape && !pr.get_FromImage() && !pr.get_FromChart()) {
|
||||
no_paragraph = false;
|
||||
}
|
||||
in_chart = type == Asc.c_oAscTypeSelectElement.Chart;
|
||||
if (type == Asc.c_oAscTypeSelectElement.Chart) {
|
||||
in_chart = true;
|
||||
no_columns = true;
|
||||
}
|
||||
if (type == Asc.c_oAscTypeSelectElement.Shape) {
|
||||
var shapetype = pr.asc_getType();
|
||||
if (shapetype=='line' || shapetype=='bentConnector2' || shapetype=='bentConnector3'
|
||||
|| shapetype=='bentConnector4' || shapetype=='bentConnector5' || shapetype=='curvedConnector2'
|
||||
|| shapetype=='curvedConnector3' || shapetype=='curvedConnector4' || shapetype=='curvedConnector5'
|
||||
|| shapetype=='straightConnector1')
|
||||
no_columns = true;
|
||||
}
|
||||
if (type == Asc.c_oAscTypeSelectElement.Image || type == Asc.c_oAscTypeSelectElement.Table)
|
||||
no_columns = true;
|
||||
} else if (type === Asc.c_oAscTypeSelectElement.Math) {
|
||||
in_equation = true;
|
||||
}
|
||||
|
|
@ -749,6 +766,11 @@ define([
|
|||
this.toolbar.lockToolbar(PE.enumLock.inEquation, in_equation, {array: [me.toolbar.btnSuperscript, me.toolbar.btnSubscript]});
|
||||
}
|
||||
|
||||
if (this._state.no_columns !== no_columns) {
|
||||
if (this._state.activated) this._state.no_columns = no_columns;
|
||||
this.toolbar.lockToolbar(PE.enumLock.noColumns, no_columns, {array: [me.toolbar.btnColumns]});
|
||||
}
|
||||
|
||||
if (this.toolbar.btnChangeSlide) {
|
||||
if (this.toolbar.btnChangeSlide.mnuSlidePicker)
|
||||
this.toolbar.btnChangeSlide.mnuSlidePicker.options.layout_index = layout_index;
|
||||
|
|
@ -1303,6 +1325,77 @@ define([
|
|||
}
|
||||
},
|
||||
|
||||
onColumnsSelect: function(menu, item) {
|
||||
if (_.isUndefined(item.value))
|
||||
return;
|
||||
|
||||
this._state.columns = undefined;
|
||||
|
||||
if (this.api) {
|
||||
if (item.value == 'advanced') {
|
||||
var win,
|
||||
me = this;
|
||||
var selectedElements = me.api.getSelectedElements();
|
||||
if (selectedElements && selectedElements.length>0){
|
||||
var elType, elValue;
|
||||
for (var i = selectedElements.length - 1; i >= 0; i--) {
|
||||
elType = selectedElements[i].get_ObjectType();
|
||||
elValue = selectedElements[i].get_ObjectValue();
|
||||
if (Asc.c_oAscTypeSelectElement.Shape == elType) {
|
||||
var win = new PE.Views.ShapeSettingsAdvanced(
|
||||
{
|
||||
shapeProps: elValue,
|
||||
handler: function(result, value) {
|
||||
if (result == 'ok') {
|
||||
if (me.api) {
|
||||
me.api.ShapeApply(value.shapeProps);
|
||||
}
|
||||
}
|
||||
me.fireEvent('editcomplete', me);
|
||||
}
|
||||
});
|
||||
win.show();
|
||||
win.setActiveCategory(4);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
} else if (item.checked) {
|
||||
var props = new Asc.asc_CShapeProperty(),
|
||||
cols = item.value;
|
||||
props.asc_putColumnNumber(cols+1);
|
||||
this.api.ShapeApply(props);
|
||||
}
|
||||
}
|
||||
|
||||
Common.NotificationCenter.trigger('edit:complete', this.toolbar);
|
||||
Common.component.Analytics.trackEvent('ToolBar', 'Insert Columns');
|
||||
},
|
||||
|
||||
onBeforeColumns: function() {
|
||||
var index = -1;
|
||||
var selectedElements = this.api.getSelectedElements();
|
||||
if (selectedElements && selectedElements.length>0){
|
||||
var elType, elValue;
|
||||
for (var i = selectedElements.length - 1; i >= 0; i--) {
|
||||
if (Asc.c_oAscTypeSelectElement.Shape == selectedElements[i].get_ObjectType()) {
|
||||
var value = selectedElements[i].get_ObjectValue().asc_getColumnNumber();
|
||||
if (value<4)
|
||||
index = value-1;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
if (this._state.columns === index)
|
||||
return;
|
||||
|
||||
if (index < 0)
|
||||
this.toolbar.btnColumns.menu.clearAll();
|
||||
else
|
||||
this.toolbar.btnColumns.menu.items[index].setChecked(true);
|
||||
this._state.columns = index;
|
||||
},
|
||||
|
||||
onBeforeShapeAlign: function() {
|
||||
var value = this.api.asc_getSelectedDrawingObjectsCount(),
|
||||
slide_checked = Common.Utils.InternalSettings.get("pe-align-to-slide") || false;
|
||||
|
|
|
|||
|
|
@ -65,12 +65,13 @@
|
|||
<span class="btn-slot split" id="slot-btn-markers"></span>
|
||||
<span class="btn-slot split" id="slot-btn-numbering"></span>
|
||||
<span class="btn-slot split" id="slot-btn-decoffset"></span>
|
||||
<span class="btn-slot" id="slot-btn-incoffset"></span>
|
||||
<span class="btn-slot split" id="slot-btn-incoffset"></span>
|
||||
</div>
|
||||
<div class="elset">
|
||||
<span class="btn-slot split" id="slot-btn-halign"></span>
|
||||
<span class="btn-slot split" id="slot-btn-valign"></span>
|
||||
<span class="btn-slot split" id="slot-btn-linespace"></span>
|
||||
<span class="btn-slot split" id="slot-btn-columns"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="separator long"></div>
|
||||
|
|
|
|||
|
|
@ -81,7 +81,8 @@ define([
|
|||
cantPrint: 'cant-print',
|
||||
noTextSelected: 'no-text',
|
||||
inEquation: 'in-equation',
|
||||
commentLock: 'can-comment'
|
||||
commentLock: 'can-comment',
|
||||
noColumns: 'no-columns'
|
||||
};
|
||||
|
||||
PE.Views.Toolbar = Common.UI.Mixtbar.extend(_.extend((function(){
|
||||
|
|
@ -531,6 +532,45 @@ define([
|
|||
});
|
||||
me.paragraphControls.push(me.btnLineSpace);
|
||||
|
||||
me.btnColumns = new Common.UI.Button({
|
||||
id: 'id-toolbar-btn-columns',
|
||||
cls: 'btn-toolbar',
|
||||
iconCls: 'toolbar__icon columns-two',
|
||||
lock: [_set.slideDeleted, _set.paragraphLock, _set.lostConnect, _set.noSlides, _set.noParagraphSelected, _set.noColumns],
|
||||
menu: new Common.UI.Menu({
|
||||
cls: 'ppm-toolbar shifted-right',
|
||||
items: [
|
||||
{
|
||||
caption: this.textColumnsOne,
|
||||
iconCls: 'menu__icon columns-one',
|
||||
checkable: true,
|
||||
checkmark: false,
|
||||
toggleGroup: 'menuColumns',
|
||||
value: 0
|
||||
},
|
||||
{
|
||||
caption: this.textColumnsTwo,
|
||||
iconCls: 'menu__icon columns-two',
|
||||
checkable: true,
|
||||
checkmark: false,
|
||||
toggleGroup: 'menuColumns',
|
||||
value: 1
|
||||
},
|
||||
{
|
||||
caption: this.textColumnsThree,
|
||||
iconCls: 'menu__icon columns-three',
|
||||
checkable: true,
|
||||
checkmark: false,
|
||||
toggleGroup: 'menuColumns',
|
||||
value: 2
|
||||
},
|
||||
{caption: '--'},
|
||||
{caption: this.textColumnsCustom, value: 'advanced'}
|
||||
]
|
||||
})
|
||||
});
|
||||
me.paragraphControls.push(me.btnColumns);
|
||||
|
||||
me.btnInsertTable = new Common.UI.Button({
|
||||
id: 'tlbtn-inserttable',
|
||||
cls: 'btn-toolbar x-huge icon-top',
|
||||
|
|
@ -869,7 +909,7 @@ define([
|
|||
this.btnCopy, this.btnPaste, this.btnUndo, this.btnRedo, this.cmbFontName, this.cmbFontSize, this.btnIncFontSize, this.btnDecFontSize,
|
||||
this.btnBold, this.btnItalic, this.btnUnderline, this.btnStrikeout, this.btnSuperscript,
|
||||
this.btnSubscript, this.btnFontColor, this.btnClearStyle, this.btnCopyStyle, this.btnMarkers,
|
||||
this.btnNumbers, this.btnDecLeftOffset, this.btnIncLeftOffset, this.btnLineSpace, this.btnHorizontalAlign,
|
||||
this.btnNumbers, this.btnDecLeftOffset, this.btnIncLeftOffset, this.btnLineSpace, this.btnHorizontalAlign, this.btnColumns,
|
||||
this.btnVerticalAlign, this.btnShapeArrange, this.btnShapeAlign, this.btnInsertTable, this.btnInsertChart,
|
||||
this.btnInsertEquation, this.btnInsertSymbol, this.btnInsertHyperlink, this.btnColorSchemas, this.btnSlideSize, this.listTheme, this.mnuShowSettings
|
||||
];
|
||||
|
|
@ -988,6 +1028,7 @@ define([
|
|||
_injectComponent('#slot-btn-halign', this.btnHorizontalAlign);
|
||||
_injectComponent('#slot-btn-valign', this.btnVerticalAlign);
|
||||
_injectComponent('#slot-btn-linespace', this.btnLineSpace);
|
||||
_injectComponent('#slot-btn-columns', this.btnColumns);
|
||||
_injectComponent('#slot-btn-arrange-shape', this.btnShapeArrange);
|
||||
_injectComponent('#slot-btn-align-shape', this.btnShapeAlign);
|
||||
_injectComponent('#slot-btn-insertequation', this.btnInsertEquation);
|
||||
|
|
@ -1108,6 +1149,7 @@ define([
|
|||
this.btnDecLeftOffset.updateHint(this.tipDecPrLeft + Common.Utils.String.platformKey('Ctrl+Shift+M'));
|
||||
this.btnIncLeftOffset.updateHint(this.tipIncPrLeft);
|
||||
this.btnLineSpace.updateHint(this.tipLineSpace);
|
||||
this.btnColumns.updateHint(this.tipColumns);
|
||||
this.btnInsertTable.updateHint(this.tipInsertTable);
|
||||
this.btnInsertChart.updateHint(this.tipInsertChart);
|
||||
this.btnInsertEquation.updateHint(this.tipInsertEquation);
|
||||
|
|
@ -1704,7 +1746,12 @@ define([
|
|||
tipInsertAudio: 'Insert audio',
|
||||
tipInsertVideo: 'Insert video',
|
||||
tipIncFont: 'Increment font size',
|
||||
tipDecFont: 'Decrement font size'
|
||||
tipDecFont: 'Decrement font size',
|
||||
tipColumns: 'Insert columns',
|
||||
textColumnsOne: 'One Column',
|
||||
textColumnsTwo: 'Two Columns',
|
||||
textColumnsThree: 'Three Columns',
|
||||
textColumnsCustom: 'Custom Columns'
|
||||
}
|
||||
}()), PE.Views.Toolbar || {}));
|
||||
});
|
||||
|
|
@ -1947,5 +1947,11 @@
|
|||
"PE.Views.Toolbar.txtScheme8": "Flow",
|
||||
"PE.Views.Toolbar.txtScheme9": "Foundry",
|
||||
"PE.Views.Toolbar.txtSlideAlign": "Align to Slide",
|
||||
"PE.Views.Toolbar.txtUngroup": "Ungroup"
|
||||
"PE.Views.Toolbar.txtUngroup": "Ungroup",
|
||||
"PE.Views.Toolbar.textColumnsCustom": "Custom Columns",
|
||||
"PE.Views.Toolbar.textColumnsOne": "One Column",
|
||||
"PE.Views.Toolbar.textColumnsThree": "Three Columns",
|
||||
"PE.Views.Toolbar.textColumnsTwo": "Two Columns",
|
||||
"PE.Views.Toolbar.tipColumns": "Insert columns"
|
||||
|
||||
}
|
||||