From ff89d888dc043b8a925d6ec48205ed153b1835f9 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Sat, 9 Jun 2018 14:11:56 +0300 Subject: [PATCH] [SSE] Add cell settings to the right panel --- apps/common/main/lib/util/utils.js | 3 +- .../main/app/controller/RightMenu.js | 33 +- .../main/app/template/CellSettings.template | 48 +++ .../main/app/template/RightMenu.template | 3 + .../main/app/view/CellSettings.js | 337 ++++++++++++++++++ .../main/app/view/RightMenu.js | 17 +- apps/spreadsheeteditor/main/locale/en.json | 18 + .../main/resources/less/rightmenu.less | 20 ++ 8 files changed, 464 insertions(+), 15 deletions(-) create mode 100644 apps/spreadsheeteditor/main/app/template/CellSettings.template create mode 100644 apps/spreadsheeteditor/main/app/view/CellSettings.js diff --git a/apps/common/main/lib/util/utils.js b/apps/common/main/lib/util/utils.js index 0d2bf70f9..12d516fca 100644 --- a/apps/common/main/lib/util/utils.js +++ b/apps/common/main/lib/util/utils.js @@ -103,7 +103,8 @@ Common.Utils = _.extend(new(function() { Chart : 7, MailMerge : 8, Signature : 9, - Pivot : 10 + Pivot : 10, + Cell : 11 }, isMobile = /android|avantgo|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od|ad)|iris|kindle|lge |maemo|midp|mmp|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(navigator.userAgent || navigator.vendor || window.opera), me = this, diff --git a/apps/spreadsheeteditor/main/app/controller/RightMenu.js b/apps/spreadsheeteditor/main/app/controller/RightMenu.js index 87b177591..517b7e34d 100644 --- a/apps/spreadsheeteditor/main/app/controller/RightMenu.js +++ b/apps/spreadsheeteditor/main/app/controller/RightMenu.js @@ -87,6 +87,7 @@ define([ this._settings[Common.Utils.documentSettingsType.Table] = {panelId: "id-table-settings", panel: rightMenu.tableSettings, btn: rightMenu.btnTable, hidden: 1, locked: false}; this._settings[Common.Utils.documentSettingsType.Pivot] = {panelId: "id-pivot-settings", panel: rightMenu.pivotSettings, btn: rightMenu.btnPivot, hidden: 1, locked: false}; this._settings[Common.Utils.documentSettingsType.Signature] = {panelId: "id-signature-settings", panel: rightMenu.signatureSettings, btn: rightMenu.btnSignature, hidden: 1, props: {}, locked: false}; + this._settings[Common.Utils.documentSettingsType.Cell] = {panelId: "id-cell-settings", panel: rightMenu.cellSettings, btn: rightMenu.btnCell, hidden: 1, locked: false}; }, setApi: function(api) { @@ -118,6 +119,7 @@ define([ selectType = info.asc_getFlags().asc_getSelectionType(), formatTableInfo = info.asc_getFormatTableInfo(), sparkLineInfo = info.asc_getSparklineInfo(), + cellInfo = info, pivotInfo = null;//info.asc_getPivotTableInfo(); if (selectType == Asc.c_oAscSelectionType.RangeImage || selectType == Asc.c_oAscSelectionType.RangeShape || @@ -125,24 +127,24 @@ define([ SelectedObjects = this.api.asc_getGraphicObjectProps(); } - if (SelectedObjects.length<=0 && !formatTableInfo && !sparkLineInfo && !pivotInfo && !this.rightmenu.minimizedMode && + if (SelectedObjects.length<=0 && !cellInfo && !formatTableInfo && !sparkLineInfo && !pivotInfo && !this.rightmenu.minimizedMode && this.rightmenu.GetActivePane() !== 'id-signature-settings') { this.rightmenu.clearSelection(); this._openRightMenu = true; } - var need_disable = info.asc_getLocked(), - need_disable_table = (info.asc_getLockedTable()===true || !this.rightmenu.mode.canModifyFilter), - need_disable_spark = (info.asc_getLockedSparkline()===true), - need_disable_pivot = (info.asc_getLockedPivotTable()===true); - - this.onFocusObject(SelectedObjects, formatTableInfo, sparkLineInfo, pivotInfo, need_disable, need_disable_table, need_disable_spark, need_disable_pivot); + this.onFocusObject(SelectedObjects, cellInfo, formatTableInfo, sparkLineInfo, pivotInfo); }, - onFocusObject: function(SelectedObjects, formatTableInfo, sparkLineInfo, pivotInfo, isCellLocked, isTableLocked, isSparkLocked, isPivotLocked) { + onFocusObject: function(SelectedObjects, cellInfo, formatTableInfo, sparkLineInfo, pivotInfo) { if (!this.editMode) return; + var isCellLocked = cellInfo.asc_getLocked(), + isTableLocked = (cellInfo.asc_getLockedTable()===true || !this.rightmenu.mode.canModifyFilter), + isSparkLocked = (cellInfo.asc_getLockedSparkline()===true), + isPivotLocked = (cellInfo.asc_getLockedPivotTable()===true); + for (var i=0; i + + + + + + + +
+
+ +
+
+ + + + + + + + + +
+
+
+
+
+
+ + + + +
+
+
+
+
+
+ + + + + +
+ + + + \ No newline at end of file diff --git a/apps/spreadsheeteditor/main/app/template/RightMenu.template b/apps/spreadsheeteditor/main/app/template/RightMenu.template index 9671d31bf..6dc3f9e06 100644 --- a/apps/spreadsheeteditor/main/app/template/RightMenu.template +++ b/apps/spreadsheeteditor/main/app/template/RightMenu.template @@ -16,6 +16,8 @@
+
+
@@ -26,6 +28,7 @@ +
\ No newline at end of file diff --git a/apps/spreadsheeteditor/main/app/view/CellSettings.js b/apps/spreadsheeteditor/main/app/view/CellSettings.js new file mode 100644 index 000000000..0bad5a220 --- /dev/null +++ b/apps/spreadsheeteditor/main/app/view/CellSettings.js @@ -0,0 +1,337 @@ +/* + * + * (c) Copyright Ascensio System Limited 2010-2018 + * + * This program is a free software product. You can redistribute it and/or + * modify it under the terms of the GNU Affero General Public License (AGPL) + * version 3 as published by the Free Software Foundation. In accordance with + * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect + * that Ascensio System SIA expressly excludes the warranty of non-infringement + * of any third-party rights. + * + * This program is distributed WITHOUT ANY WARRANTY; without even the implied + * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. For + * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html + * + * You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia, + * EU, LV-1021. + * + * The interactive user interfaces in modified source and object code versions + * of the Program must display Appropriate Legal Notices, as required under + * Section 5 of the GNU AGPL version 3. + * + * Pursuant to Section 7(b) of the License you must retain the original Product + * logo when distributing the program. Pursuant to Section 7(e) we decline to + * grant you any rights under trademark law for use of our trademarks. + * + * All the Product's GUI elements, including illustrations and icon sets, as + * well as technical writing content are licensed under the terms of the + * Creative Commons Attribution-ShareAlike 4.0 International. See the License + * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode + * +*/ +/** + * CellSettings.js + * + * Created by Julia Radzhabova on 6/08/18 + * Copyright (c) 2018 Ascensio System SIA. All rights reserved. + * + */ + +define([ + 'text!spreadsheeteditor/main/app/template/CellSettings.template', + 'jquery', + 'underscore', + 'backbone', + 'common/main/lib/component/Button', + 'common/main/lib/component/ThemeColorPalette', + 'common/main/lib/component/ColorButton', + 'common/main/lib/component/ComboBorderSize' +], function (menuTemplate, $, _, Backbone) { + 'use strict'; + + SSE.Views.CellSettings = Backbone.View.extend(_.extend({ + el: '#id-cell-settings', + + // Compile our stats template + template: _.template(menuTemplate), + + // Delegated events for creating new items, and clearing completed ones. + events: { + }, + + options: { + alias: 'CellSettings' + }, + + initialize: function () { + this._initSettings = true; + + this._state = { + BackColor: undefined, + DisabledControls: false + }; + this.lockedControls = []; + this._locked = false; + this.isEditCell = false; + this.BorderType = 1; + + this.render(); + }, + + onColorsBackSelect: function(picker, color) { + this.btnBackColor.setColor(color); + + if (this.api) { + this.api.asc_setCellBackgroundColor(color == 'transparent' ? null : Common.Utils.ThemeColor.getRgbColor(color)); + } + + Common.NotificationCenter.trigger('edit:complete', this); + }, + + addNewColor: function(picker, btn) { + picker.addNewColor((typeof(btn.color) == 'object') ? btn.color.color : btn.color); + }, + + onColorsBorderSelect: function(picker, color) { + this.btnBorderColor.setColor(color); + }, + + onBtnBordersClick: function(btn, eOpts){ + if (this.api) { + var new_borders = [], + bordersWidth = this.BorderType, + bordersColor = Common.Utils.ThemeColor.getRgbColor(this.btnBorderColor.color); + + if (btn.options.borderId == 'inner') { + new_borders[Asc.c_oAscBorderOptions.InnerV] = new Asc.asc_CBorder(bordersWidth, bordersColor); + new_borders[Asc.c_oAscBorderOptions.InnerH] = new Asc.asc_CBorder(bordersWidth, bordersColor); + } else if (btn.options.borderId == 'all') { + new_borders[Asc.c_oAscBorderOptions.InnerV] = new Asc.asc_CBorder(bordersWidth, bordersColor); + new_borders[Asc.c_oAscBorderOptions.InnerH] = new Asc.asc_CBorder(bordersWidth, bordersColor); + new_borders[Asc.c_oAscBorderOptions.Left] = new Asc.asc_CBorder(bordersWidth, bordersColor); + new_borders[Asc.c_oAscBorderOptions.Top] = new Asc.asc_CBorder(bordersWidth, bordersColor); + new_borders[Asc.c_oAscBorderOptions.Right] = new Asc.asc_CBorder(bordersWidth, bordersColor); + new_borders[Asc.c_oAscBorderOptions.Bottom] = new Asc.asc_CBorder(bordersWidth, bordersColor); + } else if (btn.options.borderId == 'outer') { + new_borders[Asc.c_oAscBorderOptions.Left] = new Asc.asc_CBorder(bordersWidth, bordersColor); + new_borders[Asc.c_oAscBorderOptions.Top] = new Asc.asc_CBorder(bordersWidth, bordersColor); + new_borders[Asc.c_oAscBorderOptions.Right] = new Asc.asc_CBorder(bordersWidth, bordersColor); + new_borders[Asc.c_oAscBorderOptions.Bottom] = new Asc.asc_CBorder(bordersWidth, bordersColor); + } else if (btn.options.borderId != 'none') { + new_borders[btn.options.borderId] = new Asc.asc_CBorder(bordersWidth, bordersColor); + } + + this.api.asc_setCellBorders(new_borders); + } + Common.NotificationCenter.trigger('edit:complete', this); + }, + + onBorderTypeSelect: function(combo, record) { + this.BorderType = record.value; + }, + + 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_onEditCell', this.onApiEditCell.bind(this)); + } + return this; + }, + + createDelayedControls: function() { + var _arrBorderPosition = [ + [Asc.c_oAscBorderOptions.Left, 'btn-borders-small btn-position-left', 'cell-button-border-left', this.tipLeft], + [Asc.c_oAscBorderOptions.InnerV,'btn-borders-small btn-position-inner-vert','cell-button-border-inner-vert', this.tipInnerVert], + [Asc.c_oAscBorderOptions.Right, 'btn-borders-small btn-position-right', 'cell-button-border-right', this.tipRight], + [Asc.c_oAscBorderOptions.Top, 'btn-borders-small btn-position-top', 'cell-button-border-top', this.tipTop], + [Asc.c_oAscBorderOptions.InnerH,'btn-borders-small btn-position-inner-hor', 'cell-button-border-inner-hor', this.tipInnerHor], + [Asc.c_oAscBorderOptions.Bottom,'btn-borders-small btn-position-bottom', 'cell-button-border-bottom', this.tipBottom], + [Asc.c_oAscBorderOptions.DiagU, 'btn-borders-small btn-position-bottom', 'cell-button-border-diagu', this.tipDiagU], + [Asc.c_oAscBorderOptions.DiagD, 'btn-borders-small btn-position-bottom', 'cell-button-border-diagd', this.tipDiagD], + ['inner', 'btn-borders-small btn-position-inner', 'cell-button-border-inner', this.tipInner], + ['outer', 'btn-borders-small btn-position-outer', 'cell-button-border-outer', this.tipOuter], + ['all', 'btn-borders-small btn-position-all', 'cell-button-border-all', this.tipAll], + ['none', 'btn-borders-small btn-position-none', 'cell-button-border-none', this.tipNone] + ]; + + _.each(_arrBorderPosition, function(item, index, list){ + var _btn = new Common.UI.Button({ + cls: 'btn-toolbar', + iconCls: item[1], + borderId:item[0], + hint: item[3] + }); + _btn.render( $('#'+item[2])) ; + _btn.on('click', _.bind(this.onBtnBordersClick, this)); + this.lockedControls.push(_btn); + }, this); + + this.cmbBorderType = new Common.UI.ComboBorderType({ + el: $('#cell-combo-border-type'), + style: "width: 93px;", + menuStyle: 'min-width: 93px;', + data: [ + { value: Asc.c_oAscBorderStyles.Thin, offsety: 0}, + { value: Asc.c_oAscBorderStyles.Hair, offsety: 20}, + { value: Asc.c_oAscBorderStyles.Dotted, offsety: 40}, + { value: Asc.c_oAscBorderStyles.Dashed, offsety: 60}, + { value: Asc.c_oAscBorderStyles.DashDot, offsety: 80}, + { value: Asc.c_oAscBorderStyles.DashDotDot, offsety: 100}, + { value: Asc.c_oAscBorderStyles.Medium, offsety: 120}, + { value: Asc.c_oAscBorderStyles.MediumDashed, offsety: 140}, + { value: Asc.c_oAscBorderStyles.MediumDashDot, offsety: 160}, + { value: Asc.c_oAscBorderStyles.MediumDashDotDot, offsety: 180}, + { value: Asc.c_oAscBorderStyles.Thick, offsety: 200} + ] + }).on('selected', _.bind(this.onBorderTypeSelect, this)); + this.BorderType = Asc.c_oAscBorderStyles.Thin; + this.cmbBorderType.setValue(this.BorderType); + this.lockedControls.push(this.cmbBorderType); + }, + + createDelayedElements: function() { + this.createDelayedControls(); + this.UpdateThemeColors(); + this._initSettings = false; + }, + + ChangeSettings: function(props) { + if (this._initSettings) + this.createDelayedElements(); + + this.disableControls(this._locked); // need to update combodataview after disabled state + + if (props ) + { + var color = props.asc_getFill().asc_getColor(), + clr; + if (color) { + if (color.get_type() == Asc.c_oAscColor.COLOR_TYPE_SCHEME) { + clr = {color: Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b()), effectValue: color.get_value() }; + } else { + clr = Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b()); + } + } else { + clr = 'transparent'; + } + + var type1 = typeof(clr); + var type2 = typeof(this._state.BackColor); + if ( (type1 !== type2) || (type1=='object' && + (clr.effectValue!==this._state.BackColor.effectValue || this._state.BackColor.color.indexOf(clr.color)<0)) || + (type1!='object' && this._state.BackColor!==undefined && this._state.BackColor.indexOf(clr)<0 )) { + + this.btnBackColor.setColor(clr); + if (_.isObject(clr)) { + var isselected = false; + for (var i = 0; i < 10; i++) { + if (Common.Utils.ThemeColor.ThemeValues[i] == clr.effectValue) { + this.colorsBack.select(clr,true); + isselected = true; + break; + } + } + if (!isselected) this.colorsBack.clearSelection(); + } else { + this.colorsBack.select(clr, true); + } + this._state.BackColor = clr; + } + } + }, + + UpdateThemeColors: function() { + if (!this.btnBackColor) { + // create color buttons + this.btnBorderColor = new Common.UI.ColorButton({ + style: "width:45px;", + menu : new Common.UI.Menu({ + items: [ + { template: _.template('
') }, + { template: _.template('' + this.textNewColor + '') } + ] + }) + }); + this.btnBorderColor.render( $('#cell-border-color-btn')); + this.btnBorderColor.setColor('000000'); + this.lockedControls.push(this.btnBorderColor); + this.borderColor = new Common.UI.ThemeColorPalette({ + el: $('#cell-border-color-menu') + }); + this.borderColor.on('select', _.bind(this.onColorsBorderSelect, this)); + this.btnBorderColor.menu.items[1].on('click', _.bind(this.addNewColor, this, this.borderColor, this.btnBorderColor)); + + this.btnBackColor = new Common.UI.ColorButton({ + style: "width:45px;", + menu : new Common.UI.Menu({ + items: [ + { template: _.template('
') }, + { template: _.template('' + this.textNewColor + '') } + ] + }) + }); + this.btnBackColor.render( $('#cell-back-color-btn')); + this.btnBackColor.setColor('transparent'); + this.lockedControls.push(this.btnBackColor); + this.colorsBack = new Common.UI.ThemeColorPalette({ + el: $('#cell-back-color-menu'), + transparent: true + }); + this.colorsBack.on('select', _.bind(this.onColorsBackSelect, this)); + this.btnBackColor.menu.items[1].on('click', _.bind(this.addNewColor, this, this.colorsBack, this.btnBackColor)); + } + this.colorsBack.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors()); + this.borderColor.updateColors(Common.Utils.ThemeColor.getEffectColors(), Common.Utils.ThemeColor.getStandartColors()); + this.btnBorderColor.setColor(this.borderColor.getColor()); + }, + + onApiEditCell: function(state) { + this.isEditCell = (state != Asc.c_oAscCellEditorState.editEnd); + if ( state == Asc.c_oAscCellEditorState.editStart || state == Asc.c_oAscCellEditorState.editEnd) + this.disableControls(this._locked); + }, + + setLocked: function (locked) { + this._locked = locked; + }, + + disableControls: function(disable) { + if (this._initSettings) return; + disable = disable || this.isEditCell; + + if (this._state.DisabledControls!==disable) { + this._state.DisabledControls = disable; + _.each(this.lockedControls, function(item) { + item.setDisabled(disable); + }); + } + }, + + textBorders: 'Border\'s Style', + textBorderColor: 'Color', + textBackColor: 'Background color', + textSelectBorders : 'Select borders that you want to change', + textNewColor : 'Add New Custom Color', + tipTop: 'Set Outer Top Border Only', + tipLeft: 'Set Outer Left Border Only', + tipBottom: 'Set Outer Bottom Border Only', + tipRight: 'Set Outer Right Border Only', + tipAll: 'Set Outer Border and All Inner Lines', + tipNone: 'Set No Borders', + tipInner: 'Set Inner Lines Only', + tipInnerVert: 'Set Vertical Inner Lines Only', + tipInnerHor: 'Set Horizontal Inner Lines Only', + tipOuter: 'Set Outer Border Only', + tipDiagU: 'Set Diagonal Up Border', + tipDiagD: 'Set Diagonal Down Border' + + }, SSE.Views.CellSettings || {})); +}); \ No newline at end of file diff --git a/apps/spreadsheeteditor/main/app/view/RightMenu.js b/apps/spreadsheeteditor/main/app/view/RightMenu.js index ea23c27a8..3f851c863 100644 --- a/apps/spreadsheeteditor/main/app/view/RightMenu.js +++ b/apps/spreadsheeteditor/main/app/view/RightMenu.js @@ -57,6 +57,7 @@ define([ 'spreadsheeteditor/main/app/view/TableSettings', 'spreadsheeteditor/main/app/view/PivotSettings', 'spreadsheeteditor/main/app/view/SignatureSettings', + 'spreadsheeteditor/main/app/view/CellSettings', 'common/main/lib/component/Scroller' ], function (menuTemplate, $, _, Backbone) { 'use strict'; @@ -133,6 +134,14 @@ define([ toggleGroup: 'tabpanelbtnsGroup', allowMouseEventsOnDisabled: true }); + this.btnCell = new Common.UI.Button({ + hint: this.txtCellSettings, + asctype: Common.Utils.documentSettingsType.Cell, + enableToggle: true, + disabled: true, + toggleGroup: 'tabpanelbtnsGroup', + allowMouseEventsOnDisabled: true + }); this._settings = []; this._settings[Common.Utils.documentSettingsType.Paragraph] = {panel: "id-paragraph-settings", btn: this.btnText}; @@ -142,6 +151,7 @@ define([ 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}; this._settings[Common.Utils.documentSettingsType.Pivot] = {panel: "id-pivot-settings", btn: this.btnPivot}; + this._settings[Common.Utils.documentSettingsType.Cell] = {panel: "id-cell-settings", btn: this.btnCell}; return this; }, @@ -164,6 +174,7 @@ define([ this.btnTextArt.setElement($('#id-right-menu-textart'), false); this.btnTextArt.render(); this.btnTable.setElement($('#id-right-menu-table'), false); this.btnTable.render(); this.btnPivot.setElement($('#id-right-menu-pivot'), false); this.btnPivot.render(); + this.btnCell.setElement($('#id-right-menu-cell'), false); this.btnCell.render(); this.btnText.on('click', _.bind(this.onBtnMenuClick, this)); this.btnImage.on('click', _.bind(this.onBtnMenuClick, this)); @@ -172,6 +183,7 @@ define([ this.btnTextArt.on('click', _.bind(this.onBtnMenuClick, this)); this.btnTable.on('click', _.bind(this.onBtnMenuClick, this)); this.btnPivot.on('click', _.bind(this.onBtnMenuClick, this)); + this.btnCell.on('click', _.bind(this.onBtnMenuClick, this)); this.paragraphSettings = new SSE.Views.ParagraphSettings(); this.imageSettings = new SSE.Views.ImageSettings(); @@ -180,6 +192,7 @@ define([ this.textartSettings = new SSE.Views.TextArtSettings(); this.tableSettings = new SSE.Views.TableSettings(); this.pivotSettings = new SSE.Views.PivotSettings(); + this.cellSettings = new SSE.Views.CellSettings(); if (mode && mode.canProtect) { this.btnSignature = new Common.UI.Button({ @@ -233,6 +246,7 @@ define([ this.textartSettings.setApi(api); this.tableSettings.setApi(api); this.pivotSettings.setApi(api); + this.cellSettings.setApi(api); if (this.signatureSettings) this.signatureSettings.setApi(api); return this; }, @@ -313,6 +327,7 @@ define([ txtSparklineSettings: 'Sparkline Settings', txtTableSettings: 'Table Settings', txtPivotSettings: 'Pivot Table Settings', - txtSignatureSettings: 'Signature Settings' + txtSignatureSettings: 'Signature Settings', + txtCellSettings: 'Cell Settings' }, SSE.Views.RightMenu || {})); }); \ No newline at end of file diff --git a/apps/spreadsheeteditor/main/locale/en.json b/apps/spreadsheeteditor/main/locale/en.json index a82fe0cde..560da6536 100644 --- a/apps/spreadsheeteditor/main/locale/en.json +++ b/apps/spreadsheeteditor/main/locale/en.json @@ -930,6 +930,23 @@ "SSE.Views.CellRangeDialog.txtEmpty": "This field is required", "SSE.Views.CellRangeDialog.txtInvalidRange": "ERROR! Invalid cells range", "SSE.Views.CellRangeDialog.txtTitle": "Select Data Range", + "SSE.Views.CellSetings.textBackColor": "Background Color", + "SSE.Views.CellSetings.textBorderColor": "Color", + "SSE.Views.CellSetings.textBorders": "Borders Style", + "SSE.Views.CellSetings.textNewColor": "Add New Custom Color", + "SSE.Views.CellSetings.textSelectBorders": "Select borders you want to change applying style chosen above", + "SSE.Views.CellSetings.tipAll": "Set outer border and all inner lines", + "SSE.Views.CellSetings.tipBottom": "Set outer bottom border only", + "SSE.Views.CellSetings.tipDiagU": "Set Diagonal Up Border", + "SSE.Views.CellSetings.tipDiagD": "Set Diagonal Down Border", + "SSE.Views.CellSetings.tipInner": "Set inner lines only", + "SSE.Views.CellSetings.tipInnerHor": "Set horizontal inner lines only", + "SSE.Views.CellSetings.tipInnerVert": "Set vertical inner lines only", + "SSE.Views.CellSetings.tipLeft": "Set outer left border only", + "SSE.Views.CellSetings.tipNone": "Set no borders", + "SSE.Views.CellSetings.tipOuter": "Set outer border only", + "SSE.Views.CellSetings.tipRight": "Set outer right border only", + "SSE.Views.CellSetings.tipTop": "Set outer top border only", "SSE.Views.ChartSettings.strLineWeight": "Line Weight", "SSE.Views.ChartSettings.strSparkColor": "Color", "SSE.Views.ChartSettings.strTemplate": "Template", @@ -1569,6 +1586,7 @@ "SSE.Views.PrintSettings.textShowHeadings": "Show Rows and Columns Headings", "SSE.Views.PrintSettings.textTitle": "Print Settings", "SSE.Views.PrintSettings.textTitlePDF": "PDF Settings", + "SSE.Views.RightMenu.txtCellSettings": "Cell settings", "SSE.Views.RightMenu.txtChartSettings": "Chart settings", "SSE.Views.RightMenu.txtImageSettings": "Image settings", "SSE.Views.RightMenu.txtParagraphSettings": "Text settings", diff --git a/apps/spreadsheeteditor/main/resources/less/rightmenu.less b/apps/spreadsheeteditor/main/resources/less/rightmenu.less index d8b9c05ea..6dca0cff0 100644 --- a/apps/spreadsheeteditor/main/resources/less/rightmenu.less +++ b/apps/spreadsheeteditor/main/resources/less/rightmenu.less @@ -29,6 +29,9 @@ /*menuPivot*/ .toolbar-btn-icon(btn-menu-pivot, 87, @toolbar-icon-size); + + /*menuCell*/ + .toolbar-btn-icon(btn-menu-cell, 80, @toolbar-icon-size); } } @@ -102,6 +105,23 @@ } } +.btn-toolbar:not(.x-huge) .icon:not(svg).btn-borders-small { + .background-ximage('@{common-image-path}/right-panels/SmallBorders.png', '@{common-image-path}/right-panels/SmallBorders@2x.png', 84px); +} + +.button-normal-icon(btn-position-all, 0, 21px); +.button-normal-icon(btn-position-inner, 1, 21px); +.button-normal-icon(btn-position-bottom, 2, 21px); +.button-normal-icon(btn-position-inner-hor, 3, 21px); +.button-normal-icon(btn-position-top, 4, 21px); +.button-normal-icon(btn-position-none, 5, 21px); +.button-normal-icon(btn-position-outer, 6, 21px); +.button-normal-icon(btn-position-left, 7, 21px); +.button-normal-icon(btn-position-inner-vert, 8, 21px); +.button-normal-icon(btn-position-right, 9, 21px); + +.button-otherstates-icon(btn-borders-small, 21px); + .btn-edit-table, .btn-change-shape { .background-ximage('@{common-image-path}/right-panels/rowscols_icon.png', '@{common-image-path}/right-panels/rowscols_icon@2x.png', 84px);