Commit 79ad673a authored by Julia Radzhabova's avatar Julia Radzhabova

Merge pull request #3 from ONLYOFFICE/feature/sse-table-settings

Feature/sse table settings
parents 7599123a 09064a26
......@@ -157,9 +157,8 @@
}
}
.combo-template {
.combo-template(@combo-dataview-height: 64px) {
@combo-dataview-button-width: 18px;
@combo-dataview-height: 64px;
height: @combo-dataview-height;
......@@ -196,6 +195,10 @@
}
};
.combo-template {
.combo-template(64px);
}
.combo-pattern {
@combo-dataview-button-width: 15px;
@combo-dataview-height: 40px;
......
......@@ -91,7 +91,6 @@ define([
this._locked = false;
this._originalLook = new Asc.CTablePropLook();
var fullwidth = 218;
this._originalProps = null;
this.CellBorders = {};
this.CellColor = {Value: 1, Color: 'transparent'}; // value=1 - цвет определен - прозрачный или другой, value=0 - цвет не определен, рисуем прозрачным
......
......@@ -153,6 +153,9 @@ define([
view.pmiDeleteCells.menu.on('item:click', _.bind(me.onDeleteCells, me));
view.pmiSortCells.menu.on('item:click', _.bind(me.onSortCells, me));
view.pmiClear.menu.on('item:click', _.bind(me.onClear, me));
view.pmiSelectTable.menu.on('item:click', _.bind(me.onSelectTable, me));
view.pmiInsertTable.menu.on('item:click', _.bind(me.onInsertTable, me));
view.pmiDeleteTable.menu.on('item:click', _.bind(me.onDeleteTable, me));
view.pmiInsFunction.on('click', _.bind(me.onInsFunction, me));
view.menuAddHyperlink.on('click', _.bind(me.onInsHyperlink, me));
view.menuEditHyperlink.on('click', _.bind(me.onInsHyperlink, me));
......@@ -349,6 +352,33 @@ define([
}
},
onSelectTable: function(menu, item) {
if (this.api && this.documentHolder.ssMenu.formatTableName) {
this.api.asc_changeSelectionFormatTable(this.documentHolder.ssMenu.formatTableName, item.value);
Common.NotificationCenter.trigger('edit:complete', this.documentHolder);
Common.component.Analytics.trackEvent('DocumentHolder', 'Select Table');
}
},
onInsertTable: function(menu, item) {
if (this.api && this.documentHolder.ssMenu.formatTableName) {
this.api.asc_insertCellsInTable(this.documentHolder.ssMenu.formatTableName, item.value);
Common.NotificationCenter.trigger('edit:complete', this.documentHolder);
Common.component.Analytics.trackEvent('DocumentHolder', 'Insert to Table');
}
},
onDeleteTable: function(menu, item) {
if (this.api && this.documentHolder.ssMenu.formatTableName) {
this.api.asc_deleteCellsInTable(this.documentHolder.ssMenu.formatTableName, item.value);
Common.NotificationCenter.trigger('edit:complete', this.documentHolder);
Common.component.Analytics.trackEvent('DocumentHolder', 'Delete from Table');
}
},
onInsFunction: function(item) {
var controller = this.getApplication().getController('FormulaDialog');
if (controller && this.api) {
......@@ -1147,17 +1177,35 @@ define([
seltype !== Asc.c_oAscSelectionType.RangeChart && seltype !== Asc.c_oAscSelectionType.RangeChartText && seltype !== Asc.c_oAscSelectionType.RangeShapeText)) {
if (!showMenu && !documentHolder.ssMenu.isVisible()) return;
var iscelledit = this.api.isCellEdited;
var iscelledit = this.api.isCellEdited,
formatTableInfo = cellinfo.asc_getFormatTableInfo(),
isintable = (formatTableInfo !== null);
documentHolder.ssMenu.formatTableName = (isintable) ? formatTableInfo.asc_getTableName() : null;
documentHolder.pmiInsertEntire.setVisible(isrowmenu||iscolmenu);
documentHolder.pmiInsertEntire.setCaption((isrowmenu) ? this.textInsertTop : this.textInsertLeft);
documentHolder.pmiDeleteEntire.setVisible(isrowmenu||iscolmenu);
documentHolder.pmiInsertCells.setVisible(iscellmenu && !iscelledit);
documentHolder.pmiDeleteCells.setVisible(iscellmenu && !iscelledit);
documentHolder.pmiSortCells.setVisible((iscellmenu||isallmenu||cansort) && !iscelledit);
documentHolder.pmiInsertCells.setVisible(iscellmenu && !iscelledit && !isintable);
documentHolder.pmiDeleteCells.setVisible(iscellmenu && !iscelledit && !isintable);
documentHolder.pmiSelectTable.setVisible(iscellmenu && !iscelledit && isintable);
documentHolder.pmiInsertTable.setVisible(iscellmenu && !iscelledit && isintable);
documentHolder.pmiDeleteTable.setVisible(iscellmenu && !iscelledit && isintable);
documentHolder.pmiSortCells.setVisible((iscellmenu||isallmenu||cansort) && !iscelledit && !isintable);
documentHolder.pmiInsFunction.setVisible(iscellmenu||insfunc);
documentHolder.pmiAddNamedRange.setVisible(iscellmenu && !iscelledit);
if (isintable) {
documentHolder.pmiInsertTable.menu.items[0].setDisabled(!formatTableInfo.asc_getIsInsertRowAbove());
documentHolder.pmiInsertTable.menu.items[1].setDisabled(!formatTableInfo.asc_getIsInsertRowBelow());
documentHolder.pmiInsertTable.menu.items[2].setDisabled(!formatTableInfo.asc_getIsInsertColumnLeft());
documentHolder.pmiInsertTable.menu.items[3].setDisabled(!formatTableInfo.asc_getIsInsertColumnRight());
documentHolder.pmiDeleteTable.menu.items[0].setDisabled(!formatTableInfo.asc_getIsDeleteRow());
documentHolder.pmiDeleteTable.menu.items[1].setDisabled(!formatTableInfo.asc_getIsDeleteColumn());
documentHolder.pmiDeleteTable.menu.items[2].setDisabled(!formatTableInfo.asc_getIsDeleteTable());
}
var hyperinfo = cellinfo.asc_getHyperlink();
documentHolder.menuHyperlink.setVisible(iscellmenu && hyperinfo && !iscelledit);
documentHolder.menuAddHyperlink.setVisible(iscellmenu && !hyperinfo && !iscelledit);
......@@ -1170,7 +1218,7 @@ define([
documentHolder.pmiFreezePanes.setCaption(this.api.asc_getSheetViewSettings().asc_getIsFreezePane() ? documentHolder.textUnFreezePanes : documentHolder.textFreezePanes);
/** coauthoring begin **/
documentHolder.ssMenu.items[10].setVisible(iscellmenu && !iscelledit && this.permissions.canCoAuthoring && this.permissions.canComments);
documentHolder.ssMenu.items[13].setVisible(iscellmenu && !iscelledit && this.permissions.canCoAuthoring && this.permissions.canComments);
documentHolder.pmiAddComment.setVisible(iscellmenu && !iscelledit && this.permissions.canCoAuthoring && this.permissions.canComments);
/** coauthoring end **/
documentHolder.pmiCellMenuSeparator.setVisible(iscellmenu || isrowmenu || iscolmenu || isallmenu || insfunc);
......@@ -1188,7 +1236,8 @@ define([
documentHolder.pmiClear.menu.items[3].setVisible(!this.permissions.isEditDiagram);
documentHolder.pmiClear.menu.items[4].setVisible(!this.permissions.isEditDiagram);
var filterInfo = cellinfo.asc_getAutoFilterInfo() && cellinfo.asc_getAutoFilterInfo().asc_getIsApplyAutoFilter();
var filterInfo = cellinfo.asc_getAutoFilterInfo();
filterInfo = (filterInfo) ? filterInfo.asc_getIsApplyAutoFilter() : false;
documentHolder.pmiInsertCells.menu.items[0].setDisabled(filterInfo);
documentHolder.pmiDeleteCells.menu.items[0].setDisabled(filterInfo);
documentHolder.pmiInsertCells.menu.items[1].setDisabled(filterInfo);
......
......@@ -78,6 +78,7 @@ define([
this._settings[Common.Utils.documentSettingsType.Shape] = {panelId: "id-shape-settings", panel: rightMenu.shapeSettings, btn: rightMenu.btnShape, hidden: 1, locked: false};
this._settings[Common.Utils.documentSettingsType.TextArt] = {panelId: "id-textart-settings", panel: rightMenu.textartSettings, btn: rightMenu.btnTextArt, hidden: 1, locked: false};
this._settings[Common.Utils.documentSettingsType.Chart] = {panelId: "id-chart-settings", panel: rightMenu.chartSettings, btn: rightMenu.btnChart, hidden: 1, locked: false};
this._settings[Common.Utils.documentSettingsType.Table] = {panelId: "id-table-settings", panel: rightMenu.tableSettings, btn: rightMenu.btnTable, hidden: 1, locked: false};
},
setApi: function(api) {
......@@ -103,19 +104,20 @@ define([
onSelectionChanged: function(info) {
var SelectedObjects = [],
selectType = info.asc_getFlags().asc_getSelectionType();
selectType = info.asc_getFlags().asc_getSelectionType(),
formatTableInfo = info.asc_getFormatTableInfo();
if (selectType == Asc.c_oAscSelectionType.RangeImage || selectType == Asc.c_oAscSelectionType.RangeShape ||
selectType == Asc.c_oAscSelectionType.RangeChart || selectType == Asc.c_oAscSelectionType.RangeChartText || selectType == Asc.c_oAscSelectionType.RangeShapeText) {
SelectedObjects = this.api.asc_getGraphicObjectProps();
}
if (SelectedObjects.length<=0 && !this.rightmenu.minimizedMode) {
if (SelectedObjects.length<=0 && !formatTableInfo && !this.rightmenu.minimizedMode) {
this.rightmenu.clearSelection();
this._openRightMenu = true;
}
this.onFocusObject(SelectedObjects);
this.onFocusObject(SelectedObjects, formatTableInfo);
var need_disable = info.asc_getLocked(),
me = this;
......@@ -128,7 +130,7 @@ define([
}
},
onFocusObject: function(SelectedObjects) {
onFocusObject: function(SelectedObjects, formatTableInfo) {
if (!this.editMode)
return;
......@@ -166,6 +168,12 @@ define([
this._settings[settingsType].locked = value.asc_getLocked();
}
if (formatTableInfo) {
settingsType = Common.Utils.documentSettingsType.Table;
this._settings[settingsType].props = formatTableInfo;
this._settings[settingsType].hidden = 0;
}
var lastactive = -1, currentactive, priorityactive = -1;
for (i=0; i<this._settings.length; ++i) {
var pnl = this._settings[i];
......@@ -256,6 +264,7 @@ define([
this.api.asc_registerCallback('asc_onFocusObject', _.bind(this.onFocusObject, this));
this.api.asc_registerCallback('asc_onSelectionChanged', _.bind(this.onSelectionChanged, this));
this.api.asc_registerCallback('asc_doubleClickOnObject', _.bind(this.onDoubleClickOnObject, this));
this.onSelectionChanged(this.api.asc_getCellInfo());
}
},
......
......@@ -1182,9 +1182,7 @@ define([
shortcuts: {
'command+l,ctrl+l': function(e) {
if (me.editMode) {
var cellinfo = me.api.asc_getCellInfo(),
filterinfo = cellinfo.asc_getAutoFilterInfo();
if (!filterinfo || filterinfo.asc_getTableName()===null)
if (!me.api.asc_getCellInfo().asc_getFormatTableInfo())
me._setTableFormat(me.toolbar.mnuTableTemplatePicker.store.at(23).get('name'));
}
......@@ -1687,7 +1685,8 @@ define([
// (coauth_disable !== toolbar.btnClearStyle.isDisabled()) && toolbar.btnClearStyle.setDisabled(coauth_disable);
// (coauth_disable !== toolbar.btnCopyStyle.isDisabled()) && toolbar.btnCopyStyle.setDisabled(coauth_disable);
var filterInfo = info.asc_getAutoFilterInfo();
var filterInfo = info.asc_getAutoFilterInfo(),
formatTableInfo = info.asc_getFormatTableInfo();
if (!toolbar.mode.isEditMailMerge) {
/* read cell horizontal align */
fontparam = info.asc_getHorAlign();
......@@ -1764,7 +1763,7 @@ define([
}
}
need_disable = this._state.controlsdisabled.filters || filterInfo && (filterInfo.asc_getTableName()!==null || filterInfo.asc_getIsAutoFilter()===null);
need_disable = this._state.controlsdisabled.filters || formatTableInfo!==null || filterInfo && filterInfo.asc_getIsAutoFilter()===null;
// (need_disable !== toolbar.btnMerge.isDisabled()) && toolbar.btnMerge.setDisabled(need_disable);
toolbar.lockToolbar(SSE.enumLock.ruleMerge, need_disable, {array:[toolbar.btnMerge]});
......@@ -1795,7 +1794,7 @@ define([
{ array: [toolbar.btnSortDown, toolbar.btnSortUp, toolbar.mnuitemSortAZ, toolbar.mnuitemSortZA,
toolbar.btnTableTemplate,toolbar.btnSetAutofilter,toolbar.mnuitemAutoFilter,toolbar.btnAutofilter] });
val = (filterInfo) ? filterInfo.asc_getTableStyleName() : null;
val = (formatTableInfo) ? formatTableInfo.asc_getTableStyleName() : null;
if (this._state.tablestylename !== val && this.toolbar.mnuTableTemplatePicker) {
val = this.toolbar.mnuTableTemplatePicker.store.findWhere({name: val});
if (val) {
......@@ -1807,7 +1806,7 @@ define([
}
}
this._state.tablename = (filterInfo) ? filterInfo.asc_getTableName() : undefined;
this._state.tablename = (formatTableInfo) ? formatTableInfo.asc_getTableName() : undefined;
need_disable = this._state.controlsdisabled.filters || !filterInfo || (filterInfo.asc_getIsApplyAutoFilter()!==true);
toolbar.lockToolbar(SSE.enumLock.ruleDelFilter, need_disable, {array:[toolbar.btnClearAutofilter,toolbar.mnuitemClearFilter]});
......
<div id="view-right-menu" class="tool-menu right">
<div class="right-panel">
<div id="id-table-settings" class="settings-panel">
</div>
<div id="id-shape-settings" class="settings-panel">
</div>
<div id="id-image-settings" class="settings-panel">
......@@ -13,6 +15,7 @@
</div>
<div class="tool-menu-btns">
<div class="ct-btn-category arrow-left" />
<button id="id-right-menu-table" class="btn btn-category arrow-left" content-target="id-table-settings"><span class="btn-icon img-toolbarmenu btn-menu-table">&nbsp;</span></button>
<button id="id-right-menu-shape" class="btn btn-category arrow-left" content-target="id-shape-settings"><span class="btn-icon img-toolbarmenu btn-menu-shape">&nbsp;</span></button>
<button id="id-right-menu-image" class="btn btn-category arrow-left" content-target="id-image-settings"><span class="btn-icon img-toolbarmenu btn-menu-image">&nbsp;</span></button>
<button id="id-right-menu-chart" class="btn btn-category arrow-left" content-target="id-chart-settings"><span class="btn-icon img-toolbarmenu btn-menu-chart">&nbsp;</span></button>
......
<table cols="2">
<tr>
<td width="50%">
<label class="header"><%= scope.textRows %></label>
</td>
<td width="50%">
<label class="header"><%= scope.textColumns %></label>
</td>
</tr>
<tr>
<td class="padding-small">
<div id="table-checkbox-header"></div>
</td>
<td class="padding-small">
<div id="table-checkbox-first"></div>
</td>
</tr>
<tr>
<td class="padding-small">
<div id="table-checkbox-total"></div>
</td>
<td class="padding-small">
<div id="table-checkbox-last"></div>
</td>
</tr>
<tr>
<td class="padding-small">
<div id="table-checkbox-banded"></div>
</td>
<td class="padding-small">
<div id="table-checkbox-col-banded"></div>
</td>
</tr>
<tr>
<td colspan=2 class="padding-small">
<div id="table-checkbox-filter"></div>
</td>
</tr>
<tr>
<td colspan=2>
<label class="header"><%= scope.textTemplate %></label>
</td>
</tr>
<tr>
<td colspan=2 class="padding-small">
<div class="" id="table-combo-template" style="width: 100%; height: 60px;"></div>
</td>
</tr>
<tr>
<td class="padding-small" colspan=2>
<div class="separator horizontal"></div>
</td>
</tr>
<tr class="hidden">
<td colspan=2>
<label class="header"><%= scope.textTableName %></label>
</td>
</tr>
<tr class="hidden">
<td colspan=2 class="padding-small">
<div id="table-txt-name" class="input-row" style="width: 100%;"></div>
</td>
</tr>
<tr>
<td class="padding-small" colspan=2>
<label class="header" style="margin-top: 3px;"><%= scope.textResize %></label>
<button type="button" class="btn btn-text-default" id="table-btn-select-data" style="display: inline-block; float:right; min-width: 100px;"><%= scope.textSelectData %></button>
</td>
</tr>
<tr>
<td class="padding-small" colspan=2>
<div class="separator horizontal"></div>
</td>
</tr>
<tr>
<td colspan=2>
<label class="header" style="margin-top: 3px;"><%= scope.textEdit %></label>
<div id="table-btn-edit" style="display: inline-block; float:right;"></div>
</td>
</tr>
<tr class="finish-cell"></tr>
</table>
\ No newline at end of file
......@@ -104,6 +104,19 @@ define([
value : 'paste'
});
me.pmiSelectTable = new Common.UI.MenuItem({
caption : me.txtSelect,
menu : new Common.UI.Menu({
menuAlign : 'tl-tr',
items: [
{ caption: this.selectRowText, value: c_oAscChangeSelectionFormatTable.row},
{ caption: this.selectColumnText, value: c_oAscChangeSelectionFormatTable.column},
{ caption: this.selectDataText, value: c_oAscChangeSelectionFormatTable.data},
{ caption: this.selectTableText, value: c_oAscChangeSelectionFormatTable.all}
]
})
});
me.pmiInsertEntire = new Common.UI.MenuItem({
caption : me.txtInsert
});
......@@ -130,6 +143,19 @@ define([
})
});
me.pmiInsertTable = new Common.UI.MenuItem({
caption : me.txtInsert,
menu : new Common.UI.Menu({
menuAlign : 'tl-tr',
items: [
{ caption: me.insertRowAboveText, value: c_oAscInsertOptions.InsertTableRowAbove},
{ caption: me.insertRowBelowText, value: c_oAscInsertOptions.InsertTableRowBelow},
{ caption: me.insertColumnLeftText, value: c_oAscInsertOptions.InsertTableColLeft},
{ caption: me.insertColumnRightText, value: c_oAscInsertOptions.InsertTableColRight}
]
})
});
me.pmiDeleteEntire = new Common.UI.MenuItem({
caption : me.txtDelete
});
......@@ -156,6 +182,18 @@ define([
})
});
me.pmiDeleteTable = new Common.UI.MenuItem({
caption : me.txtDelete,
menu : new Common.UI.Menu({
menuAlign : 'tl-tr',
items: [
{ caption: this.deleteRowText, value: c_oAscDeleteOptions.DeleteRows},
{ caption: this.deleteColumnText, value: c_oAscDeleteOptions.DeleteColumns},
{ caption: this.deleteTableText, value: c_oAscDeleteOptions.DeleteTable}
]
})
});
me.pmiClear = new Common.UI.MenuItem({
caption : me.txtClear,
menu : new Common.UI.Menu({
......@@ -273,10 +311,13 @@ define([
me.pmiCopy,
me.pmiPaste,
{caption: '--'},
me.pmiSelectTable,
me.pmiInsertEntire,
me.pmiInsertCells,
me.pmiInsertTable,
me.pmiDeleteEntire,
me.pmiDeleteCells,
me.pmiDeleteTable,
me.pmiClear,
me.pmiSortCells,
{caption: '--'},
......@@ -576,7 +617,19 @@ define([
direct270Text: 'Rotate at 270°',
txtAddNamedRange: 'Define Name',
textFreezePanes: 'Freeze Panes',
textUnFreezePanes: 'Unfreeze Panes'
textUnFreezePanes: 'Unfreeze Panes',
txtSelect: 'Select',
selectRowText : 'Select Row',
selectColumnText : 'Select Entire Column',
selectDataText : 'Select Column Data',
selectTableText : 'Select Table',
insertRowAboveText : 'Insert Row Above',
insertRowBelowText : 'Insert Row Below',
insertColumnLeftText : 'Insert Column Left',
insertColumnRightText : 'Insert Column Right',
deleteRowText : 'Delete Row',
deleteColumnText : 'Delete Column',
deleteTableText : 'Delete Table'
}, SSE.Views.DocumentHolder || {}));
});
\ No newline at end of file
......@@ -54,6 +54,7 @@ define([
'spreadsheeteditor/main/app/view/ChartSettings',
'spreadsheeteditor/main/app/view/ShapeSettings',
'spreadsheeteditor/main/app/view/TextArtSettings',
'spreadsheeteditor/main/app/view/TableSettings',
'common/main/lib/component/Scroller'
], function (menuTemplate, $, _, Backbone) {
'use strict';
......@@ -108,12 +109,21 @@ define([
toggleGroup: 'tabpanelbtnsGroup'
});
this.btnTable = new Common.UI.Button({
hint: this.txtTableSettings,
asctype: Common.Utils.documentSettingsType.Table,
enableToggle: true,
disabled: true,
toggleGroup: 'tabpanelbtnsGroup'
});
this._settings = [];
this._settings[Common.Utils.documentSettingsType.Paragraph] = {panel: "id-paragraph-settings", btn: this.btnText};
this._settings[Common.Utils.documentSettingsType.Image] = {panel: "id-image-settings", btn: this.btnImage};
this._settings[Common.Utils.documentSettingsType.Shape] = {panel: "id-shape-settings", btn: this.btnShape};
this._settings[Common.Utils.documentSettingsType.Chart] = {panel: "id-chart-settings", btn: this.btnChart};
this._settings[Common.Utils.documentSettingsType.TextArt] = {panel: "id-textart-settings", btn: this.btnTextArt};
this._settings[Common.Utils.documentSettingsType.Table] = {panel: "id-table-settings", btn: this.btnTable};
return this;
},
......@@ -134,18 +144,21 @@ define([
this.btnChart.el = $('#id-right-menu-chart'); this.btnChart.render();
this.btnShape.el = $('#id-right-menu-shape'); this.btnShape.render();
this.btnTextArt.el = $('#id-right-menu-textart'); this.btnTextArt.render();
this.btnTable.el = $('#id-right-menu-table'); this.btnTable.render();
this.btnText.on('click', _.bind(this.onBtnMenuClick, this));
this.btnImage.on('click', _.bind(this.onBtnMenuClick, this));
this.btnChart.on('click', _.bind(this.onBtnMenuClick, this));
this.btnShape.on('click', _.bind(this.onBtnMenuClick, this));
this.btnTextArt.on('click', _.bind(this.onBtnMenuClick, this));
this.btnTable.on('click', _.bind(this.onBtnMenuClick, this));
this.paragraphSettings = new SSE.Views.ParagraphSettings();
this.imageSettings = new SSE.Views.ImageSettings();
this.chartSettings = new SSE.Views.ChartSettings();
this.shapeSettings = new SSE.Views.ShapeSettings();
this.textartSettings = new SSE.Views.TextArtSettings();
this.tableSettings = new SSE.Views.TableSettings();
if (_.isUndefined(this.scroller)) {
this.scroller = new Common.UI.Scroller({
......@@ -167,6 +180,7 @@ define([
this.chartSettings.setApi(api);
this.shapeSettings.setApi(api);
this.textartSettings.setApi(api);
this.tableSettings.setApi(api);
},
setMode: function(mode) {
......@@ -229,6 +243,7 @@ define([
this.shapeSettings.disableControls(disabled);
this.imageSettings.disableControls(disabled);
this.chartSettings.disableControls(disabled);
this.tableSettings.disableControls(disabled);
} else {
var cmp = $("#" + id);
if (disabled !== cmp.hasClass('disabled')) {
......@@ -255,6 +270,7 @@ define([
txtImageSettings: 'Image Settings',
txtShapeSettings: 'Shape Settings',
txtTextArtSettings: 'Text Art Settings',
txtChartSettings: 'Chart Settings'
txtChartSettings: 'Chart Settings',
txtTableSettings: 'Table Settings'
}, SSE.Views.RightMenu || {}));
});
\ No newline at end of file
......@@ -63,8 +63,8 @@ define([
this.template = [
'<div class="box">',
'<div id="id-dlg-tableoptions-range" class="input-row" style="margin-bottom: 10px;"></div>',
'<div class="input-row" id="id-dlg-tableoptions-title"></div>',
'<div id="id-dlg-tableoptions-range" class="input-row" style="margin-bottom: 5px;"></div>',
'<div class="input-row" id="id-dlg-tableoptions-title" style="margin-top: 5px;"></div>',
'</div>',
'<div class="footer right">',
'<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
......@@ -73,6 +73,7 @@ define([
].join('');
this.options.tpl = _.template(this.template, this.options);
this.checkRangeType = Asc.c_oAscSelectionDialogType.FormatTable;
Common.UI.Window.prototype.initialize.call(this, this.options);
},
......@@ -114,30 +115,39 @@ define([
if (settings.api) {
me.api = settings.api;
if (settings.range) {
me.cbTitle.setVisible(false);
me.setHeight(130);
me.checkRangeType = Asc.c_oAscSelectionDialogType.FormatTableChangeRange;
me.inputRange.setValue(settings.range);
me.api.asc_setSelectionDialogMode(Asc.c_oAscSelectionDialogType.FormatTable, settings.range);
} else {
var options = me.api.asc_getAddFormatTableOptions();
this.inputRange.setValue(options.asc_getRange());
this.cbTitle.setValue(options.asc_getIsTitle());
me.inputRange.setValue(options.asc_getRange());
me.cbTitle.setValue(options.asc_getIsTitle());
me.api.asc_setSelectionDialogMode(Asc.c_oAscSelectionDialogType.FormatTable, options.asc_getRange());
}
if (settings.title)
me.setTitle(settings.title);
me.api.asc_unregisterCallback('asc_onSelectionRangeChanged', _.bind(me.onApiRangeChanged, me));
me.api.asc_registerCallback('asc_onSelectionRangeChanged', _.bind(me.onApiRangeChanged, me));
Common.NotificationCenter.trigger('cells:range', Asc.c_oAscSelectionDialogType.FormatTable);
}
me.inputRange.validation = function(value) {
var isvalid = me.api.asc_checkDataRange(Asc.c_oAscSelectionDialogType.FormatTable, value, false);
var isvalid = me.api.asc_checkDataRange(me.checkRangeType, value, false);
return (isvalid==Asc.c_oAscError.ID.DataRangeError) ? me.txtInvalidRange : true;
};
},
getSettings: function () {
if (this.checkRangeType == Asc.c_oAscSelectionDialogType.FormatTable) {
var options = this.api.asc_getAddFormatTableOptions(this.inputRange.getValue());
// options.asc_setRange(this.inputRange.getValue());
options.asc_setIsTitle(this.cbTitle.checked);
return options;
} else
return this.inputRange.getValue();
},
onApiRangeChanged: function(info) {
......@@ -147,12 +157,16 @@ define([
},
isRangeValid: function() {
var isvalid = this.api.asc_checkDataRange(Asc.c_oAscSelectionDialogType.FormatTable, this.inputRange.getValue(), true);
var isvalid = this.api.asc_checkDataRange(this.checkRangeType, this.inputRange.getValue(), true);
if (isvalid == Asc.c_oAscError.ID.No)
return true;
else {
if (isvalid == Asc.c_oAscError.ID.AutoFilterDataRangeError) {
Common.UI.warning({msg: this.errorAutoFilterDataRange});
} else if (isvalid == Asc.c_oAscError.ID.FTChangeTableRangeError) {
Common.UI.warning({msg: this.errorFTChangeTableRangeError});
} if (isvalid == Asc.c_oAscError.ID.FTRangeIncludedOtherTables) {
Common.UI.warning({msg: this.errorFTRangeIncludedOtherTables});
}
}
return false;
......@@ -198,10 +212,12 @@ define([
// },
txtTitle : 'Title',
txtFormat : 'Format as table',
txtFormat : 'Create table',
textCancel : 'Cancel',
txtEmpty : 'This field is required',
txtInvalidRange: 'ERROR! Invalid cells range',
errorAutoFilterDataRange: 'The operation could not be done for the selected range of cells.<br>Select a uniform data range inside or outside the table and try again.'
errorAutoFilterDataRange: 'The operation could not be done for the selected range of cells.<br>Select a uniform data range inside or outside the table and try again.',
errorFTChangeTableRangeError: 'Operation could not be completed for the selected cell range.<br>Select a range so that the first table row was on the same row<br>and the resulting table overlapped the current one.',
errorFTRangeIncludedOtherTables: 'Operation could not be completed for the selected cell range.<br>Select a range which does not include other tables.'
}, SSE.Views.TableOptionsDialog || {}))
});
\ No newline at end of file
/**
* TableSettings.js
*
* Created by Julia Radzhabova on 3/28/16
* Copyright (c) 2016 Ascensio System SIA. All rights reserved.
*
*/
define([
'text!spreadsheeteditor/main/app/template/TableSettings.template',
'jquery',
'underscore',
'backbone',
'common/main/lib/component/Button',
'common/main/lib/component/CheckBox',
'common/main/lib/component/ComboDataView',
'spreadsheeteditor/main/app/view/TableOptionsDialog'
], function (menuTemplate, $, _, Backbone) {
'use strict';
SSE.Views.TableSettings = Backbone.View.extend(_.extend({
el: '#id-table-settings',
// Compile our stats template
template: _.template(menuTemplate),
// Delegated events for creating new items, and clearing completed ones.
events: {
},
options: {
alias: 'TableSettings'
},
initialize: function () {
var me = this;
this._state = {
TableName: '',
TemplateName: '',
Range: '',
CheckHeader: false,
CheckTotal: false,
CheckBanded: false,
CheckFirst: false,
CheckLast: false,
CheckColBanded: false,
CheckFilter: false,
DisabledControls: false,
TableNameError: false
};
this.lockedControls = [];
this._locked = false;
this._originalProps = null;
this._noApply = false;
this.render();
this.chHeader = new Common.UI.CheckBox({
el: $('#table-checkbox-header'),
labelText: this.textHeader
});
this.lockedControls.push(this.chHeader);
this.chTotal = new Common.UI.CheckBox({
el: $('#table-checkbox-total'),
labelText: this.textTotal
});
this.lockedControls.push(this.chTotal);
this.chBanded = new Common.UI.CheckBox({
el: $('#table-checkbox-banded'),
labelText: this.textBanded
});
this.lockedControls.push(this.chBanded);
this.chFirst = new Common.UI.CheckBox({
el: $('#table-checkbox-first'),
labelText: this.textFirst
});
this.lockedControls.push(this.chFirst);
this.chLast = new Common.UI.CheckBox({
el: $('#table-checkbox-last'),
labelText: this.textLast
});
this.lockedControls.push(this.chLast);
this.chColBanded = new Common.UI.CheckBox({
el: $('#table-checkbox-col-banded'),
labelText: this.textBanded
});
this.lockedControls.push(this.chColBanded);
this.chFilter = new Common.UI.CheckBox({
el: $('#table-checkbox-filter'),
labelText: this.textFilter
});
this.lockedControls.push(this.chFilter);
this.chHeader.on('change', _.bind(this.onCheckTemplateChange, this, Asc.c_oAscChangeTableStyleInfo.rowHeader));
this.chTotal.on('change', _.bind(this.onCheckTemplateChange, this, Asc.c_oAscChangeTableStyleInfo.rowTotal));
this.chBanded.on('change', _.bind(this.onCheckTemplateChange, this, Asc.c_oAscChangeTableStyleInfo.rowBanded));
this.chFirst.on('change', _.bind(this.onCheckTemplateChange, this, Asc.c_oAscChangeTableStyleInfo.columnFirst));
this.chLast.on('change', _.bind(this.onCheckTemplateChange, this, Asc.c_oAscChangeTableStyleInfo.columnLast));
this.chColBanded.on('change', _.bind(this.onCheckTemplateChange, this, Asc.c_oAscChangeTableStyleInfo.columnBanded));
this.chFilter.on('change', _.bind(this.onCheckTemplateChange, this, Asc.c_oAscChangeTableStyleInfo.filterButton));
this.cmbTableTemplate = new Common.UI.ComboDataView({
itemWidth: 61,
itemHeight: 46,
menuMaxHeight: 300,
enableKeyEvents: true
});
this.cmbTableTemplate.render($('#table-combo-template'));
this.cmbTableTemplate.openButton.menu.cmpEl.css({
'min-width': 175,
'max-width': 175
});
this.cmbTableTemplate.on('click', _.bind(this.onTableTemplateSelect, this));
this.cmbTableTemplate.openButton.menu.on('show:after', function () {
me.cmbTableTemplate.menuPicker.scroller.update({alwaysVisibleY: true});
});
this.lockedControls.push(this.cmbTableTemplate);
this.txtTableName = new Common.UI.InputField({
el : $('#table-txt-name'),
name : 'tablename',
style : 'width: 100%;',
validateOnBlur: false
});
this.txtTableName.on('changed:after', _.bind(this.onTableNameChanged, this));
this.lockedControls.push(this.txtTableName);
this.btnSelectData = new Common.UI.Button({
el: $('#table-btn-select-data')
});
this.btnSelectData.on('click', _.bind(this.onSelectData, this));
this.btnEdit = new Common.UI.Button({
cls: 'btn-icon-default',
iconCls: 'btn-edit-table',
menu : new Common.UI.Menu({
menuAlign: 'tr-br',
items: [
{ caption: this.selectRowText, value: Asc.c_oAscChangeSelectionFormatTable.row, idx: 0 },
{ caption: this.selectColumnText, value: Asc.c_oAscChangeSelectionFormatTable.column, idx: 1 },
{ caption: this.selectDataText, value: Asc.c_oAscChangeSelectionFormatTable.data, idx: 2 },
{ caption: this.selectTableText, value: Asc.c_oAscChangeSelectionFormatTable.all, idx: 3 },
{ caption: '--' },
{ caption: this.insertRowAboveText, value: Asc.c_oAscInsertOptions.InsertTableRowAbove, idx: 4 },
{ caption: this.insertRowBelowText, value: Asc.c_oAscInsertOptions.InsertTableRowBelow, idx: 5 },
{ caption: this.insertColumnLeftText, value: Asc.c_oAscInsertOptions.InsertTableColLeft, idx: 6 },
{ caption: this.insertColumnRightText, value: Asc.c_oAscInsertOptions.InsertTableColRight, idx: 7 },
{ caption: '--' },
{ caption: this.deleteRowText, value: Asc.c_oAscDeleteOptions.DeleteRows, idx: 8 },
{ caption: this.deleteColumnText, value: Asc.c_oAscDeleteOptions.DeleteColumns, idx: 9 },
{ caption: this.deleteTableText, value: Asc.c_oAscDeleteOptions.DeleteTable, idx: 10 }
]
})
});
this.btnEdit.render( $('#table-btn-edit')) ;
this.btnEdit.menu.on('show:after', _.bind( function(menu){
if (this.api) {
menu.items[5].setDisabled(!this._originalProps.asc_getIsInsertRowAbove());
menu.items[6].setDisabled(!this._originalProps.asc_getIsInsertRowBelow());
menu.items[7].setDisabled(!this._originalProps.asc_getIsInsertColumnLeft());
menu.items[8].setDisabled(!this._originalProps.asc_getIsInsertColumnRight());
menu.items[10].setDisabled(!this._originalProps.asc_getIsDeleteRow());
menu.items[11].setDisabled(!this._originalProps.asc_getIsDeleteColumn());
menu.items[12].setDisabled(!this._originalProps.asc_getIsDeleteTable());
}
}, this));
this.btnEdit.menu.on('item:click', _.bind(this.onEditClick, this));
this.lockedControls.push(this.btnEdit);
},
onCheckTemplateChange: function(type, field, newValue, oldValue, eOpts) {
if (this.api)
this.api.asc_changeFormatTableInfo(this._state.TableName, type, newValue=='checked');
Common.NotificationCenter.trigger('edit:complete', this);
},
onTableTemplateSelect: function(combo, record){
if (this.api && !this._noApply) {
if (this._state.TemplateName)
this.api.asc_changeAutoFilter(this._state.TableName, Asc.c_oAscChangeFilterOptions.style, record.get('name'));
}
Common.NotificationCenter.trigger('edit:complete', this);
},
onEditClick: function(menu, item, e) {
if (this.api) {
if (item.options.idx>=0 && item.options.idx<4)
this.api.asc_changeSelectionFormatTable(this._state.TableName, item.value);
else if (item.options.idx>=4 && item.options.idx<8) {
this.api.asc_insertCellsInTable(this._state.TableName, item.value);
} else {
this.api.asc_deleteCellsInTable(this._state.TableName, item.value);
}
}
Common.NotificationCenter.trigger('edit:complete', this);
},
onTableNameChanged: function(input, newValue, oldValue) {
var oldName = this._state.TableName;
this._state.TableName = '';
if (oldName.toLowerCase() == newValue.toLowerCase()) {
Common.NotificationCenter.trigger('edit:complete', this);
return;
}
var me = this,
isvalid = this.api.asc_checkDefinedName(newValue, null);
if (isvalid.asc_getStatus() === true) isvalid = true;
else {
switch (isvalid.asc_getReason()) {
case Asc.c_oAscDefinedNameReason.IsLocked:
isvalid = this.textIsLocked;
break;
case Asc.c_oAscDefinedNameReason.Existed:
isvalid = this.textExistName;
break;
case Asc.c_oAscDefinedNameReason.NameReserved:
isvalid = this.textReservedName;
break;
default:
isvalid = this.textInvalidName;
}
}
if (isvalid === true) {
this.api.asc_changeDisplayNameTable(oldName, newValue);
Common.NotificationCenter.trigger('edit:complete', this);
} else if (!this._state.TableNameError) {
this._state.TableNameError = true;
Common.UI.alert({
msg: isvalid,
title: this.notcriticalErrorTitle,
iconCls: 'warn',
buttons: ['ok'],
callback: function(btn){
Common.NotificationCenter.trigger('edit:complete', this);
me._state.TableNameError = false;
}
});
}
},
render: function () {
var el = $(this.el);
el.html(this.template({
scope: this
}));
},
setApi: function(o) {
this.api = o;
if (o) {
this.api.asc_registerCallback('asc_onInitTablePictures', _.bind(this.onApiInitTableTemplates, this));
}
return this;
},
ChangeSettings: function(props) {
this.disableControls(this._locked);
if (props )//formatTableInfo
{
this._originalProps = props;
var value = props.asc_getTableName();
if (this._state.TableName!==value) {
this.txtTableName.setValue(value);
this._state.TableName=value;
}
this._state.Range = props.asc_getTableRange();
var needTablePictures = false;
value = props.asc_getFirstRow();
if (this._state.CheckHeader!==value) {
this.chHeader.setValue(value, true);
this._state.CheckHeader=value;
needTablePictures = true;
}
value = props.asc_getLastRow();
if (this._state.CheckTotal!==value) {
this.chTotal.setValue(value, true);
this._state.CheckTotal=value;
needTablePictures = true;
}
value = props.asc_getBandHor();
if (this._state.CheckBanded!==value) {
this.chBanded.setValue(value, true);
this._state.CheckBanded=value;
needTablePictures = true;
}
value = props.asc_getFirstCol();
if (this._state.CheckFirst!==value) {
this.chFirst.setValue(value, true);
this._state.CheckFirst=value;
needTablePictures = true;
}
value = props.asc_getLastCol();
if (this._state.CheckLast!==value) {
this.chLast.setValue(value, true);
this._state.CheckLast=value;
needTablePictures = true;
}
value = props.asc_getBandVer();
if (this._state.CheckColBanded!==value) {
this.chColBanded.setValue(value, true);
this._state.CheckColBanded=value;
needTablePictures = true;
}
value = props.asc_getFilterButton();
if (this._state.CheckFilter!==value) {
this.chFilter.setValue(value, true);
this._state.CheckFilter=value;
}
if (this.chFilter.isDisabled() == this._state.CheckHeader)
this.chFilter.setDisabled(!this._state.CheckHeader);
if (needTablePictures)
this.onApiInitTableTemplates(this.api.asc_getTablePictures(props));
//for table-template
value = props.asc_getTableStyleName();
if (this._state.TemplateName!==value || this._isTemplatesChanged) {
this.cmbTableTemplate.suspendEvents();
var rec = this.cmbTableTemplate.menuPicker.store.findWhere({
name: value
});
this.cmbTableTemplate.menuPicker.selectRecord(rec);
this.cmbTableTemplate.resumeEvents();
if (this._isTemplatesChanged) {
if (rec)
this.cmbTableTemplate.fillComboView(this.cmbTableTemplate.menuPicker.getSelectedRec(),true);
else
this.cmbTableTemplate.fillComboView(this.cmbTableTemplate.menuPicker.store.at(0), true);
}
this._state.TemplateName=value;
}
this._isTemplatesChanged = false;
}
},
onApiInitTableTemplates: function(Templates){
var self = this;
this._isTemplatesChanged = true;
var count = self.cmbTableTemplate.menuPicker.store.length;
if (count>0 && count==Templates.length) {
var data = self.cmbTableTemplate.menuPicker.store.models;
_.each(Templates, function(template, index){
data[index].set('imageUrl', template.asc_getImage());
});
} else {
self.cmbTableTemplate.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
});
});
self.cmbTableTemplate.menuPicker.store.add(arr);
}
},
onSelectData: function() {
var me = this;
if (me.api) {
var handlerDlg = function(dlg, result) {
if (result == 'ok') {
me.api.asc_setSelectionDialogMode(Asc.c_oAscSelectionDialogType.None);
me.api.asc_changeTableRange(me._state.TableName, dlg.getSettings());
}
Common.NotificationCenter.trigger('edit:complete', me.toolbar);
};
var win = new SSE.Views.TableOptionsDialog({
handler: handlerDlg
});
win.show();
win.setSettings({
api : me.api,
range : me._state.Range,
title: me.textResize
});
}
},
setLocked: function (locked) {
this._locked = locked;
},
disableControls: function(disable) {
if (this._state.DisabledControls!==disable) {
this._state.DisabledControls = disable;
_.each(this.lockedControls, function(item) {
item.setDisabled(disable);
});
}
},
textEdit: 'Rows & Columns',
selectRowText : 'Select Row',
selectColumnText : 'Select Entire Column',
selectDataText : 'Select Column Data',
selectTableText : 'Select Table',
insertRowAboveText : 'Insert Row Above',
insertRowBelowText : 'Insert Row Below',
insertColumnLeftText : 'Insert Column Left',
insertColumnRightText : 'Insert Column Right',
deleteRowText : 'Delete Row',
deleteColumnText : 'Delete Column',
deleteTableText : 'Delete Table',
textOK : 'OK',
textCancel : 'Cancel',
textTemplate : 'Select From Template',
textRows : 'Rows',
textColumns : 'Columns',
textHeader : 'Header',
textTotal : 'Total',
textBanded : 'Banded',
textFirst : 'First',
textLast : 'Last',
textEmptyTemplate : 'No templates',
textFilter : 'Filter button',
textTableName : 'Table Name',
textResize : 'Resize table',
textSelectData : 'Select Data',
textInvalidName : 'ERROR! Invalid table name',
textExistName : 'ERROR! Range with such a name already exists',
textIsLocked : 'This element is being edited by another user.',
notcriticalErrorTitle : 'Warning',
textReservedName : 'The name you are trying to use is already referenced in cell formulas. Please use some other name.'
}, SSE.Views.TableSettings || {}));
});
\ No newline at end of file
......@@ -709,6 +709,7 @@
"SSE.Views.RightMenu.txtParagraphSettings": "Text Settings",
"SSE.Views.RightMenu.txtSettings": "Common Settings",
"SSE.Views.RightMenu.txtShapeSettings": "Shape Settings",
"SSE.Views.RightMenu.txtTableSettings": "Table Settings",
"SSE.Views.RightMenu.txtTextArtSettings": "Text Art Settings",
"SSE.Views.SetValueDialog.cancelButtonText": "Cancel",
"SSE.Views.SetValueDialog.okButtonText": "OK",
......@@ -825,6 +826,8 @@
"SSE.Views.TableOptionsDialog.txtFormat": "Create table",
"SSE.Views.TableOptionsDialog.txtInvalidRange": "ERROR! Invalid cells range",
"SSE.Views.TableOptionsDialog.txtTitle": "Title",
"SSE.Views.TableOptionsDialog.errorFTChangeTableRangeError": "Operation could not be completed for the selected cell range.<br>Select a range so that the first table row was on the same row<br>and the resulting table overlapped the current one.",
"SSE.Views.TableOptionsDialog.errorFTRangeIncludedOtherTables": "Operation could not be completed for the selected cell range.<br>Select a range which does not include other tables.",
"SSE.Views.TextArtSettings.strBackground": "Background color",
"SSE.Views.TextArtSettings.strColor": "Color",
"SSE.Views.TextArtSettings.strFill": "Fill",
......
......@@ -20,6 +20,9 @@
/*menuTextArt*/
.toolbar-btn-icon(btn-menu-textart, 66, @toolbar-icon-size);
/*menuTable*/
.toolbar-btn-icon(btn-menu-table, 80, @toolbar-icon-size);
}
}
......@@ -79,12 +82,19 @@
}
}
.btn-edit-table,
.btn-change-shape {
.background-ximage('@{app-image-path}/right-panels/rowscols_icon.png', '@{app-image-path}/right-panels/rowscols_icon@2x.png', 84px);
margin-right: 2px !important;
margin-bottom: 1px !important;
}
.btn-edit-table {background-position: 0 0;}
button.over .btn-edit-table {background-position: -28px 0;}
.btn-group.open .btn-edit-table,
button.active .btn-edit-table,
button:active .btn-edit-table {background-position: -56px 0;}
.btn-change-shape {background-position: 0 -16px;}
button.over .btn-change-shape {background-position: -28px -16px;}
.btn-group.open .btn-change-shape,
......@@ -284,3 +294,7 @@ button:active .btn-change-shape {background-position: -56px -16px;}
.pie-doughnut{
background-position: -200px 0;
}
#table-combo-template .combo-dataview{
.combo-template(60px);
}
\ No newline at end of file
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment