From 1d9ef74b37fe98bf181248857193cd4953d9fd21 Mon Sep 17 00:00:00 2001 From: ShimaginAndrey Date: Thu, 30 Dec 2021 00:26:40 +0300 Subject: [PATCH 01/43] [SSE] Add 'Tab Color' in Sheets --- .../lib/component/ThemeColorPalette.jsx | 6 +- apps/spreadsheeteditor/mobile/locale/en.json | 1 + .../mobile/src/controller/Statusbar.jsx | 45 ++++++- .../mobile/src/less/icons-material.less | 2 +- .../mobile/src/less/statusbar.less | 5 + .../mobile/src/store/sheets.js | 11 +- .../mobile/src/view/Statusbar.jsx | 121 +++++++++++++++++- 7 files changed, 176 insertions(+), 15 deletions(-) diff --git a/apps/common/mobile/lib/component/ThemeColorPalette.jsx b/apps/common/mobile/lib/component/ThemeColorPalette.jsx index 73107dc27..3c53ff558 100644 --- a/apps/common/mobile/lib/component/ThemeColorPalette.jsx +++ b/apps/common/mobile/lib/component/ThemeColorPalette.jsx @@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react'; import { f7, ListItem, List, Icon } from 'framework7-react'; import { useTranslation } from 'react-i18next'; -const ThemeColors = ({ themeColors, onColorClick, curColor, isTypeCustomColors }) => { +const ThemeColors = ({ themeColors, onColorClick, curColor, isTypeColors, isTypeCustomColors }) => { return (
{themeColors.map((row, rowIndex) => { @@ -11,7 +11,7 @@ const ThemeColors = ({ themeColors, onColorClick, curColor, isTypeCustomColors } {row.map((effect, index) => { return( {onColorClick(effect.color, effect.effectId, effect.effectValue)}} > @@ -115,7 +115,7 @@ const ThemeColorPalette = props => {
{ _t.textThemeColors }
- +
{ _t.textStandartColors }
diff --git a/apps/spreadsheeteditor/mobile/locale/en.json b/apps/spreadsheeteditor/mobile/locale/en.json index c1ec9e908..52985dcf4 100644 --- a/apps/spreadsheeteditor/mobile/locale/en.json +++ b/apps/spreadsheeteditor/mobile/locale/en.json @@ -291,6 +291,7 @@ "textSheetName": "Sheet Name", "textUnhide": "Unhide", "textMove": "Move", + "textTabColor": "Tab Color", "textMoveBack": "Move back", "textMoveForward": "Move forward", "textWarnDeleteSheet": "The worksheet maybe has data. Proceed operation?" diff --git a/apps/spreadsheeteditor/mobile/src/controller/Statusbar.jsx b/apps/spreadsheeteditor/mobile/src/controller/Statusbar.jsx index f0edbc676..53c6e0928 100644 --- a/apps/spreadsheeteditor/mobile/src/controller/Statusbar.jsx +++ b/apps/spreadsheeteditor/mobile/src/controller/Statusbar.jsx @@ -63,8 +63,7 @@ const StatusbarController = inject('sheets', 'storeFocusObjects', 'users')(obser } sheets.resetSheets(items); - - updateTabsColors(); + setTimeout(() => updateTabsColors()); }; const onApiActiveSheetChanged = (index) => { @@ -72,6 +71,7 @@ const StatusbarController = inject('sheets', 'storeFocusObjects', 'users')(obser sheets.setActiveWorksheet(index); Common.Notifications.trigger('sheet:active', index); } + onApiSheetsChanged(); }; const onApiHideTabContextMenu = () => { @@ -103,14 +103,13 @@ const StatusbarController = inject('sheets', 'storeFocusObjects', 'users')(obser if (color.length) { if (!tab.active) { - color = '0px 4px 0 ' + Common.Utils.RGBColor(color).toRGBA(0.7) + ' inset'; + color = '0px 3px 0 ' + Common.Utils.RGBColor(color).toRGBA(0.7) + ' inset'; } else { - color = '0px 4px 0 ' + color + ' inset'; + color = '0px 3px 0 ' + color + ' inset'; } - - $$('.sheet-tabs .tab a').eq(tab.index).css('box-shadow', color); + $$(`.sheet-tabs .tab a.tab-color-${tab.index}`).css('box-shadow', color); } else { - $$('.sheet-tabs .tab a').eq(tab.index).css('box-shadow', ''); + $$(`.sheet-tabs .tab a.tab-color-${tab.index}`).css('box-shadow', ''); } } }; @@ -337,6 +336,15 @@ const Statusbar = inject('sheets', 'storeAppOptions', 'users')(observer(props => case 'move': Device.phone ? f7.sheet.open('.move-sheet') : f7.popover.open('#idx-move-sheet-popover', targetRef.current); break; + case 'tab-color': + if( Device.phone ) { + f7.sheet.open('.tab-color-sheet'); + f7.navbar.hide('.main-navbar'); + $$('.statusbar').css('top', '-50%'); + } else { + f7.popover.open('#idx-tab-color-popover',targetRef.current); + } + break; case 'unhide': f7.popover.open('#idx-hidden-sheets-popover', '.active'); break; @@ -365,6 +373,28 @@ const Statusbar = inject('sheets', 'storeAppOptions', 'users')(observer(props => api.asc_moveWorksheet(activeIndex === undefined ? api.asc_getWorksheetsCount() : activeIndex, [api.asc_getActiveWorksheetIndex()]); } + const onSetWorkSheetColor = (color) => { + const api = Common.EditorApi.get(); + let arrIndex = []; + + if (api) { + arrIndex.push(api.asc_getActiveWorksheetIndex()); + if (arrIndex) { + if(color === 'transparent') { + api.asc_setWorksheetTabColor(null, arrIndex); + sheets.sheets.forEach(tab => { + if(tab.active) $$(`.sheet-tabs .tab a.tab-color-${tab.index}`).css('box-shadow', ''); + }) + } else { + let asc_clr = Common.Utils.ThemeColor.getRgbColor(color); + if (asc_clr) { + api.asc_setWorksheetTabColor(asc_clr, arrIndex); + } + } + } + } + } + return ( onAddTabClicked={onAddTabClicked} onTabMenu={onTabMenu} onMenuMoveClick = {onMenuMoveClick} + onSetWorkSheetColor={onSetWorkSheetColor} /> ) })); diff --git a/apps/spreadsheeteditor/mobile/src/less/icons-material.less b/apps/spreadsheeteditor/mobile/src/less/icons-material.less index 70a6e5c9d..5de264f68 100644 --- a/apps/spreadsheeteditor/mobile/src/less/icons-material.less +++ b/apps/spreadsheeteditor/mobile/src/less/icons-material.less @@ -394,7 +394,7 @@ &.icon-plus { width: 22px; height: 22px; - .encoded-svg-mask(''); + .encoded-svg-mask('', @toolbar-icons); } } diff --git a/apps/spreadsheeteditor/mobile/src/less/statusbar.less b/apps/spreadsheeteditor/mobile/src/less/statusbar.less index 2e4f8ac81..c94d8afa2 100644 --- a/apps/spreadsheeteditor/mobile/src/less/statusbar.less +++ b/apps/spreadsheeteditor/mobile/src/less/statusbar.less @@ -8,6 +8,8 @@ background-color: @background-tertiary; display: flex; + transition: top 400ms; + .tab { border: 0 none; border-radius: 0; @@ -24,6 +26,9 @@ &.active { background-color: @background-secondary; font-weight: 600; + a { + box-shadow: 0px 2px 0 #49795d inset; + } } .hairline(right, @background-menu-divider); diff --git a/apps/spreadsheeteditor/mobile/src/store/sheets.js b/apps/spreadsheeteditor/mobile/src/store/sheets.js index 3caa203da..ed2db7b86 100644 --- a/apps/spreadsheeteditor/mobile/src/store/sheets.js +++ b/apps/spreadsheeteditor/mobile/src/store/sheets.js @@ -42,15 +42,24 @@ export class storeWorksheets { setWsProps: action, isDisabledEditSheet: observable, - setDisabledEditSheet: action + setDisabledEditSheet: action, + + colorTab:observable, + changeTabColor: action }); this.sheets = []; } + colorTab = undefined; + resetSheets(sheets) { this.sheets = Object.values(sheets) } + changeTabColor(color) { + this.colorTab = color; + } + setActiveWorksheet(i) { if ( !this.sheets[i].active ) { this.sheets.forEach(model => { diff --git a/apps/spreadsheeteditor/mobile/src/view/Statusbar.jsx b/apps/spreadsheeteditor/mobile/src/view/Statusbar.jsx index bc1ccf646..b261f0f2c 100644 --- a/apps/spreadsheeteditor/mobile/src/view/Statusbar.jsx +++ b/apps/spreadsheeteditor/mobile/src/view/Statusbar.jsx @@ -1,8 +1,9 @@ -import React, { Fragment, useState } from 'react'; -import { View, Link, Icon, Popover, List, ListItem, ListButton, Actions, ActionsGroup, ActionsButton, Sheet, Page } from 'framework7-react'; +import React, { Fragment, useEffect, useState } from 'react'; +import {f7, View, Link, Icon, Popover, Navbar, NavRight, List, ListItem, ListButton, Actions, ActionsGroup, ActionsButton, Sheet, Page } from 'framework7-react'; import { useTranslation } from 'react-i18next'; import { Device } from '../../../../common/mobile/utils/device'; import { inject, observer } from 'mobx-react'; +import { ThemeColorPalette, CustomColorPicker } from '../../../../common/mobile/lib/component/ThemeColorPalette.jsx'; const viewStyle = { height: 30 @@ -53,6 +54,93 @@ const PageListMove = props => { ) }; +const PageCustomTabColor = inject("storePalette")(observer (props => { + const { t } = useTranslation(); + const _t = t('View.Edit', {returnObjects: true}); + + const onAddNewColor = (colors, color) => { + props.storePalette.changeCustomColors(colors); + props.onSetWorkSheetColor(color); + props.sheets.changeTabColor(color); + props.f7router.back(); + }; + + return ( + + + {Device.phone && + + + + } + + + + ) +})); + +const PageTabColor = inject("storePalette")(observer(props => { + const { t } = useTranslation(); + const {sheets} = props; + const allSheets = sheets.sheets; + const storePalette = props.storePalette; + const customColors = storePalette.customColors; + const activeIndex = sheets.activeWorksheet; + + useEffect(() => { + if (allSheets.length !== 0) { + let color = sheets.at(activeIndex).color; + if(sheets.at(activeIndex).color !== null) { + sheets.changeTabColor('' + Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b())); + } else { + sheets.changeTabColor('transparent'); + } + } + }, [allSheets]) + + const changeColor = (color, effectId, effectValue) => { + if (color !== 'empty') { + if (effectId !== undefined ) { + const newColor = {color: color, effectId: effectId, effectValue: effectValue}; + sheets.changeTabColor(newColor); + props.onSetWorkSheetColor(color); + } else { + sheets.changeTabColor(color); + props.onSetWorkSheetColor(color); + } + + Device.isPhone ? f7.sheet.close('.tab-color-sheet') : f7.popover.close('#idx-tab-color-popover'); + + } else { + f7.views.current.router.navigate('/sheet-tab-custom-color/', {props:{onSetWorkSheetColor: props.onSetWorkSheetColor, sheets}}); + } + }; + + return ( + + + {Device.phone && + + + + + + } + + + { allSheets.length !== 0 && + } + + + + + ) +})); + + const StatusbarView = inject('storeAppOptions', 'sheets', 'users')(observer(props => { const { t } = useTranslation(); const _t = t('Statusbar', {returnObjects: true}); @@ -82,7 +170,7 @@ const StatusbarView = inject('storeAppOptions', 'sheets', 'users')(observer(prop {allSheets.map((model,i) => model.hidden ? null :
  • props.onTabClick(i, e.target)}> - {model.name} + {model.name}
    • )} @@ -109,6 +197,7 @@ const StatusbarView = inject('storeAppOptions', 'sheets', 'users')(observer(prop props.onTabMenu('ren')} /> props.onTabMenu('hide')} /> props.onTabMenu('move')} /> + props.onTabMenu('tab-color')} /> {hiddenSheets.length ? ( props.onTabMenu('unhide')} /> ) : null} @@ -122,6 +211,7 @@ const StatusbarView = inject('storeAppOptions', 'sheets', 'users')(observer(prop props.onTabMenu('ren')}>{_t.textRename} props.onTabMenu('hide')}>{_t.textHide} props.onTabMenu('move')}>{_t.textMove} + props.onTabMenu('tab-color')}>{_t.textTabColor} {hiddenSheets.length ? ( props.onTabMenu('unhide')}>{_t.textUnhide} ) : null} @@ -143,6 +233,24 @@ const StatusbarView = inject('storeAppOptions', 'sheets', 'users')(observer(prop } + { isPhone ? + + { + f7.navbar.show('.main-navbar'); + $$('.statusbar').css('top', '0%'); + }}> + + + + + : + + + + + + } {hiddenSheets.length ? ( Date: Thu, 13 Jan 2022 23:59:39 +0300 Subject: [PATCH 02/43] [SSE] Switch chart row/column from right panel --- .../main/app/template/ChartSettings.template | 5 +++ .../main/app/view/ChartSettings.js | 38 ++++++++++++++++++- apps/spreadsheeteditor/main/locale/en.json | 2 + 3 files changed, 43 insertions(+), 2 deletions(-) diff --git a/apps/spreadsheeteditor/main/app/template/ChartSettings.template b/apps/spreadsheeteditor/main/app/template/ChartSettings.template index 6d6d54589..f4a126bc0 100644 --- a/apps/spreadsheeteditor/main/app/template/ChartSettings.template +++ b/apps/spreadsheeteditor/main/app/template/ChartSettings.template @@ -40,6 +40,11 @@
    + + +
    + + diff --git a/apps/spreadsheeteditor/main/app/view/ChartSettings.js b/apps/spreadsheeteditor/main/app/view/ChartSettings.js index 08471ce4c..14c101a59 100644 --- a/apps/spreadsheeteditor/main/app/view/ChartSettings.js +++ b/apps/spreadsheeteditor/main/app/view/ChartSettings.js @@ -222,6 +222,10 @@ define([ this.btnRatio.toggle(value); this._state.keepRatio=value; } + + var chartSettings = this.api.asc_getChartObject(), + series = chartSettings ? chartSettings.getSeries() : null; + this.btnSwitch.setDisabled(!series || series.length<1 || !chartSettings || !chartSettings.getRange()); } else { //sparkline this._originalProps = props; this.isChart = false; @@ -774,6 +778,19 @@ define([ this.btnSelectData.on('click', _.bind(this.onSelectData, this)); this.lockedControls.push(this.btnSelectData); + this.btnSwitch = new Common.UI.Button({ + parentEl: $('#chart-btn-switch'), + cls : 'btn-toolbar', + iconCls : 'toolbar__icon btn-select-range', + caption : this.textSwitch, + style : 'width: 100%;text-align: left;', + dataHint : '1', + dataHintDirection: 'left', + dataHintOffset: 'small' + }); + this.btnSwitch.on('click', _.bind(this.onSwitch, this)); + this.lockedControls.push(this.btnSwitch); + this.linkAdvanced = $('#chart-advanced-link'); $(this.el).on('click', '#chart-advanced-link', _.bind(this.openAdvancedSettings, this)); }, @@ -1247,7 +1264,22 @@ define([ } Common.NotificationCenter.trigger('edit:complete', this); }, - + + onSwitch: function() { + if (this.api){ + var props = this.api.asc_getChartObject(); + if (props) { + props.startEdit(); + var res = props.switchRowCol(); + if (res === Asc.c_oAscError.ID.MaxDataSeriesError) { + props.cancelEdit(); + Common.UI.warning({msg: this.errorMaxRows, maxwidth: 600}); + } else + props.endEdit(); + } + } + }, + setLocked: function (locked) { this._locked = locked; }, @@ -1286,7 +1318,9 @@ define([ textSelectData: 'Select Data', textRanges: 'Data Range', textBorderSizeErr: 'The entered value is incorrect.
    Please enter a value between 0 pt and 1584 pt.', - textChangeType: 'Change type' + textChangeType: 'Change type', + textSwitch: 'Switch Row/Column', + errorMaxRows: 'The maximum number of data series per chart is 255.' }, SSE.Views.ChartSettings || {})); }); \ No newline at end of file diff --git a/apps/spreadsheeteditor/main/locale/en.json b/apps/spreadsheeteditor/main/locale/en.json index d0dbcab7f..9ef011255 100644 --- a/apps/spreadsheeteditor/main/locale/en.json +++ b/apps/spreadsheeteditor/main/locale/en.json @@ -1599,6 +1599,8 @@ "SSE.Views.ChartSettings.textStyle": "Style", "SSE.Views.ChartSettings.textType": "Type", "SSE.Views.ChartSettings.textWidth": "Width", + "SSE.Views.ChartSettings.textSwitch": "Switch Row/Column", + "SSE.Views.ChartSettings.errorMaxRows": "The maximum number of data series per chart is 255.", "SSE.Views.ChartSettingsDlg.errorMaxPoints": "ERROR! The maximum number of points in series per chart is 4096.", "SSE.Views.ChartSettingsDlg.errorMaxRows": "ERROR! The maximum number of data series per chart is 255", "SSE.Views.ChartSettingsDlg.errorStockChart": "Incorrect row order. To build a stock chart place the data on the sheet in the following order:
    opening price, max price, min price, closing price.", From 02a84336c7b33d7b0c0f83751e9220e1309cd021 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Sat, 15 Jan 2022 00:12:21 +0300 Subject: [PATCH 03/43] Change style for checked menu item with icon --- .../main/resources/img/toolbar/1x/.css.handlebars | 6 ------ apps/common/main/resources/less/dropdown-menu.less | 12 +++++++----- 2 files changed, 7 insertions(+), 11 deletions(-) diff --git a/apps/common/main/resources/img/toolbar/1x/.css.handlebars b/apps/common/main/resources/img/toolbar/1x/.css.handlebars index bdaae82c9..afe6c21c9 100644 --- a/apps/common/main/resources/img/toolbar/1x/.css.handlebars +++ b/apps/common/main/resources/img/toolbar/1x/.css.handlebars @@ -11,12 +11,6 @@ } } } -.menu__icon { - .no-checkmark.checked & { - background-position-x: -20px; - background-position-x: @menu-icon-item-checked-offset-x; - } -} .toolbar__icon, .menu__icon { background-image: url(resources/{{{escaped_image}}}); } diff --git a/apps/common/main/resources/less/dropdown-menu.less b/apps/common/main/resources/less/dropdown-menu.less index 126fa40b1..0b090f8c1 100644 --- a/apps/common/main/resources/less/dropdown-menu.less +++ b/apps/common/main/resources/less/dropdown-menu.less @@ -33,6 +33,7 @@ li { & > a { padding: 5px 20px; + line-height: 16px; cursor: pointer; color: @text-normal-ie; color: @text-normal; @@ -91,16 +92,17 @@ float: left; width: 20px; height: 20px; - margin: -3px 5px 0 -15px; + margin: -2px 5px 0 -15px; background-repeat: no-repeat; opacity: @component-normal-icon-opacity; } .no-checkmark.checked { .menu-item-icon { - background-color: @highlight-button-pressed-ie; - background-color: @highlight-button-pressed; - border-radius: 2px; + background-color: @background-normal-ie; + background-color: @background-normal; + .box-shadow(0 0 0 2px @border-preview-select-ie); + .box-shadow(0 0 0 @scaled-two-px-value @border-preview-select); } } @@ -136,7 +138,7 @@ padding-left: 28px; } .menu-item-icon { - margin: -3px 0 0 -24px; + margin: -2px 0 0 -24px; } .checked:not(.no-checkmark):before { margin-left: -22px; From 6b88441a1ed1fea4bdc3bef7226ec38183cb4027 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Tue, 18 Jan 2022 21:47:13 +0300 Subject: [PATCH 04/43] [SSE] Add icons --- .../main/app/view/ChartSettings.js | 2 +- .../img/toolbar/1.25x/switch_row_column.png | Bin 0 -> 495 bytes .../img/toolbar/1.5x/switch_row_column.png | Bin 0 -> 557 bytes .../img/toolbar/1.75x/switch_row_column.png | Bin 0 -> 600 bytes .../img/toolbar/1x/switch_row_column.png | Bin 0 -> 444 bytes .../img/toolbar/2x/switch_row_column.png | Bin 0 -> 714 bytes 6 files changed, 1 insertion(+), 1 deletion(-) create mode 100644 apps/spreadsheeteditor/main/resources/img/toolbar/1.25x/switch_row_column.png create mode 100644 apps/spreadsheeteditor/main/resources/img/toolbar/1.5x/switch_row_column.png create mode 100644 apps/spreadsheeteditor/main/resources/img/toolbar/1.75x/switch_row_column.png create mode 100644 apps/spreadsheeteditor/main/resources/img/toolbar/1x/switch_row_column.png create mode 100644 apps/spreadsheeteditor/main/resources/img/toolbar/2x/switch_row_column.png diff --git a/apps/spreadsheeteditor/main/app/view/ChartSettings.js b/apps/spreadsheeteditor/main/app/view/ChartSettings.js index 14c101a59..f12008eeb 100644 --- a/apps/spreadsheeteditor/main/app/view/ChartSettings.js +++ b/apps/spreadsheeteditor/main/app/view/ChartSettings.js @@ -781,7 +781,7 @@ define([ this.btnSwitch = new Common.UI.Button({ parentEl: $('#chart-btn-switch'), cls : 'btn-toolbar', - iconCls : 'toolbar__icon btn-select-range', + iconCls : 'toolbar__icon switch_row_column', caption : this.textSwitch, style : 'width: 100%;text-align: left;', dataHint : '1', diff --git a/apps/spreadsheeteditor/main/resources/img/toolbar/1.25x/switch_row_column.png b/apps/spreadsheeteditor/main/resources/img/toolbar/1.25x/switch_row_column.png new file mode 100644 index 0000000000000000000000000000000000000000..a5a6a3dcd26aff70ed2c7bcdf7e0cb2d663a40f5 GIT binary patch literal 495 zcmVX1^@s6b5wmq00009a7bBm000XU z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yPKjOU7&MZ7hr&PfE$3bD~FoM4oL}8E9FTRA~AV> zA+`aapx`O6g_SW3!|EJ0+6iq3D*;8+XeYE}jtbI11TESRT95W?_+8Mx;Q_FS8%I@D zJ>HufI6rc145vMtg_Z+7vuV%I1)P;5B;*V2&l{I-WGQYOxT_Nm`9>fCZ-F^q#1^K< zYIfJ>pokbb_*g}AY#<&)+Mrz_g9r^I41;g*dQA~QND)FH5uG>o0U5y}7IU~7?kYts z<~qgS+BK`vjD5mYBPzLKu2cN?#yS%YnIp8|5$=6r$H8Z7P#pBp^$EUqIhvppLdS*@ zx#fG8*pwSta)OSH#=*I@&tu$%|+X z+=P)s6GBOJP{yfpH2z|SFRft;;Y3wAFu2C^rGO9G8d6B8A-)ufkY|IIBlOSl4$Bby ljHiE&931j9zM!BWjDL+TsUmWm2CD!7002ovPDHLkV1mI?!#n^0 literal 0 HcmV?d00001 diff --git a/apps/spreadsheeteditor/main/resources/img/toolbar/1.5x/switch_row_column.png b/apps/spreadsheeteditor/main/resources/img/toolbar/1.5x/switch_row_column.png new file mode 100644 index 0000000000000000000000000000000000000000..23fcc312a13abc83e2e480bfa296757b925d446b GIT binary patch literal 557 zcmV+|0@D47P)6Ex^jl8Cky3Xh}n|DW+a#pv*vT|rMu|Zenk<@`Y>D4V6$M^u|3{? z!EvUE%mU0hn=JVEJj5*MY8b%mR=K~S2pF@Y>dHz+ru$s{*93v~_MKaZtf1sJgJMJc zS9P^nZ*E<74P)><-4_$MhFFxc&Y0RaiwSeRjZsco!}v^*h>#epxXi{_yQ8mJe5O{{ znr>v{%g{C3L}uxdZl;MQ%ErjLF5RKo*hh0)vf?M2aO)AKYu#98Yps_1u4HkfezcaB z7EhAutt(4QmtkbJou@NWe?iLNN?(lYHEgn}SC=2UQ2N5u&Nr?!+_lnrc#`2~=j9B$ vk`|6{-e`Q(6Av8U#L|@~9*IOE@lgB$&RNu93B1po00000NkvXXu0mjf6-Wi- literal 0 HcmV?d00001 diff --git a/apps/spreadsheeteditor/main/resources/img/toolbar/1.75x/switch_row_column.png b/apps/spreadsheeteditor/main/resources/img/toolbar/1.75x/switch_row_column.png new file mode 100644 index 0000000000000000000000000000000000000000..b89d0f15a4b0612c811dbcea7e129dfcb162c90c GIT binary patch literal 600 zcmV-e0;m0nP)t9 z!!Qs<*Gzs>Kqw#$ga&AUGDriIK?C7G4Wtfezy%})qyV$mNT3MoVOtMRX3xw{#<6T& zT}#@vi3C9qmdTnHLf3VR(X!z8<)zikDF*)hAuz05ybH-2t9s=iMO~EpXeWH_yHAO9>*;+!zxL8v`Q+%jY zozxVtqG{mi?Kv(~(G-B0#AfXI_mavKFm=X&>ZWK?n*yfJ7;uPav!epADcQA{rL|cH zY^-)MLPAf_TW6SMzFCu?(zV(JwS;EVP|ag5C3JYC|CKC`(YY3yefg-tAMHw39Uru5 zsh5w5X$HBs3k6qgL(nS&HLqxqqs*I6c%b1r) zUuUQZJ}A&xpv{=4@72PC@@m0M^R*e8iE}F7yGD$0AjUWlV;qPv4qWLPU;iH|FHs-E m@%6ui7W-qkAP9mWEQfDBmfsq22j2An0000MyU!g@MCJsWoCuZm-y_msou$Ne8a1BO1WTY3vi}c9JASbYtaj)jSXa;O17?Zd_e8O1DxJXZTYb#?TruSy8_tmX2ckWhh0vS2Z zjWP1Fs2eAgm@~v>tRxO)?P&!#L!O?_Xe#s>>_qfPH=a2$d7+nj=B{)m=5#3zG!1_7 zZfb!k?W`U?XwbO?>OLeZ+CUW9DscXi0lIqF-qP1Hl zK%*uL(nrbJI-aAGwF`NlBrq{zU?gH-Bw}DBVqhe`S@;9tf4Nd&{>}43v*INB^xr&< wFM)4pFO|lI{|Wb%Bqnp$CkTQd2*RlR00hlEQF%zwg8%>k07*qoM6N<$g6?xcv;Y7A literal 0 HcmV?d00001 From a503275036886a15e46bcccbcf885ea61436d960 Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Fri, 21 Jan 2022 15:25:27 +0300 Subject: [PATCH 05/43] [DE] Fix bug 53514 --- apps/documenteditor/main/app/controller/ViewTab.js | 2 +- apps/documenteditor/main/app/controller/Viewport.js | 2 +- apps/documenteditor/main/app/view/DocumentHolder.js | 5 ++++- 3 files changed, 6 insertions(+), 3 deletions(-) diff --git a/apps/documenteditor/main/app/controller/ViewTab.js b/apps/documenteditor/main/app/controller/ViewTab.js index 368f97402..c525fc980 100644 --- a/apps/documenteditor/main/app/controller/ViewTab.js +++ b/apps/documenteditor/main/app/controller/ViewTab.js @@ -226,9 +226,9 @@ define([ }, onChangeRulers: function (btn, checked) { - this.api.asc_SetViewRulers(checked); Common.localStorage.setBool('de-hidden-rulers', !checked); Common.Utils.InternalSettings.set("de-hidden-rulers", !checked); + this.api.asc_SetViewRulers(checked); this.view.fireEvent('rulers:hide', [!checked]); Common.NotificationCenter.trigger('layout:changed', 'rulers'); Common.NotificationCenter.trigger('edit:complete', this.view); diff --git a/apps/documenteditor/main/app/controller/Viewport.js b/apps/documenteditor/main/app/controller/Viewport.js index 469e35668..d8258c6e8 100644 --- a/apps/documenteditor/main/app/controller/Viewport.js +++ b/apps/documenteditor/main/app/controller/Viewport.js @@ -424,9 +424,9 @@ define([ case 'toolbar': me.header.fireEvent('toolbar:setcompact', [menu, item.isChecked()]); break; case 'statusbar': me.header.fireEvent('statusbar:hide', [item, item.isChecked()]); break; case 'rulers': - me.api.asc_SetViewRulers(!item.isChecked()); Common.localStorage.setBool('de-hidden-rulers', item.isChecked()); Common.Utils.InternalSettings.set("de-hidden-rulers", item.isChecked()); + me.api.asc_SetViewRulers(!item.isChecked()); Common.NotificationCenter.trigger('layout:changed', 'rulers'); Common.NotificationCenter.trigger('edit:complete', me.header); me.header.fireEvent('rulers:hide', [item.isChecked()]); diff --git a/apps/documenteditor/main/app/view/DocumentHolder.js b/apps/documenteditor/main/app/view/DocumentHolder.js index 8229522d1..cb99b677f 100644 --- a/apps/documenteditor/main/app/view/DocumentHolder.js +++ b/apps/documenteditor/main/app/view/DocumentHolder.js @@ -683,7 +683,7 @@ define([ me._arrSpecialPaste[Asc.c_oSpecialPasteProps.overwriteCells] = me.txtOverwriteCells; pasteContainer = $('
    '); - me.cmpEl.append(pasteContainer); + me.cmpEl.find('#id_main_view').append(pasteContainer); me.btnSpecialPaste = new Common.UI.Button({ parentEl: $('#id-document-holder-btn-special-paste'), @@ -719,6 +719,9 @@ define([ if (pasteContainer.is(':visible')) pasteContainer.hide(); } else { var showPoint = [coord.asc_getX() + coord.asc_getWidth() + 3, coord.asc_getY() + coord.asc_getHeight() + 3]; + if (!Common.Utils.InternalSettings.get("de-hidden-rulers")) { + showPoint = [showPoint[0] - 19, showPoint[1] - 26]; + } pasteContainer.css({left: showPoint[0], top : showPoint[1]}); pasteContainer.show(); } From 6bd49b1c792a1d108ffc20bee597b9ba1a536017 Mon Sep 17 00:00:00 2001 From: ShimaginAndrey Date: Mon, 24 Jan 2022 17:18:12 +0300 Subject: [PATCH 06/43] [SSE] Correct routing --- apps/spreadsheeteditor/mobile/src/view/Statusbar.jsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/apps/spreadsheeteditor/mobile/src/view/Statusbar.jsx b/apps/spreadsheeteditor/mobile/src/view/Statusbar.jsx index b261f0f2c..97d14dfe8 100644 --- a/apps/spreadsheeteditor/mobile/src/view/Statusbar.jsx +++ b/apps/spreadsheeteditor/mobile/src/view/Statusbar.jsx @@ -90,7 +90,7 @@ const PageTabColor = inject("storePalette")(observer(props => { useEffect(() => { if (allSheets.length !== 0) { let color = sheets.at(activeIndex).color; - if(sheets.at(activeIndex).color !== null) { + if(color !== null) { sheets.changeTabColor('' + Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b())); } else { sheets.changeTabColor('transparent'); @@ -112,7 +112,7 @@ const PageTabColor = inject("storePalette")(observer(props => { Device.isPhone ? f7.sheet.close('.tab-color-sheet') : f7.popover.close('#idx-tab-color-popover'); } else { - f7.views.current.router.navigate('/sheet-tab-custom-color/', {props:{onSetWorkSheetColor: props.onSetWorkSheetColor, sheets}}); + f7.views.tabColorView.router.navigate('/sheet-tab-custom-color/', {props:{onSetWorkSheetColor: props.onSetWorkSheetColor, sheets}}); } }; @@ -240,13 +240,13 @@ const StatusbarView = inject('storeAppOptions', 'sheets', 'users')(observer(prop f7.navbar.show('.main-navbar'); $$('.statusbar').css('top', '0%'); }}> - + : - + From abb20fa37170c5d900fd889f860ddb86e59e5f3f Mon Sep 17 00:00:00 2001 From: OVSharova Date: Tue, 25 Jan 2022 15:37:13 +0300 Subject: [PATCH 07/43] Fix Bug 50043 --- apps/common/forms/resources/less/common.less | 1 + apps/common/main/resources/less/about.less | 1 + apps/common/main/resources/less/buttons.less | 2 ++ apps/common/main/resources/less/chat.less | 2 ++ apps/common/main/resources/less/comments.less | 2 ++ apps/common/main/resources/less/history.less | 2 ++ apps/common/main/resources/less/window.less | 1 + 7 files changed, 11 insertions(+) diff --git a/apps/common/forms/resources/less/common.less b/apps/common/forms/resources/less/common.less index 1e61888f3..2c839391c 100644 --- a/apps/common/forms/resources/less/common.less +++ b/apps/common/forms/resources/less/common.less @@ -578,6 +578,7 @@ &.header { font-weight: bold; + letter-spacing: 0.01em; } } diff --git a/apps/common/main/resources/less/about.less b/apps/common/main/resources/less/about.less index 781f05365..f88e7b4d7 100644 --- a/apps/common/main/resources/less/about.less +++ b/apps/common/main/resources/less/about.less @@ -34,6 +34,7 @@ .asc-about-companyname { font: bold 15px Tahoma; + letter-spacing: 0.01em; color: @text-normal-ie; color: @text-normal; } diff --git a/apps/common/main/resources/less/buttons.less b/apps/common/main/resources/less/buttons.less index 23f43f89b..06b105eca 100644 --- a/apps/common/main/resources/less/buttons.less +++ b/apps/common/main/resources/less/buttons.less @@ -478,6 +478,7 @@ .border-radius(0); background-color: transparent; font-weight: bold; + letter-spacing: 0.01em; &:hover:not(.disabled), .over:not(.disabled) { @@ -1047,6 +1048,7 @@ .dlg-btn { font-weight: bold; + letter-spacing: 0.01em; width: 86px; color: @text-normal-ie; color: @text-normal; diff --git a/apps/common/main/resources/less/chat.less b/apps/common/main/resources/less/chat.less index 47656839b..22329434e 100644 --- a/apps/common/main/resources/less/chat.less +++ b/apps/common/main/resources/less/chat.less @@ -66,6 +66,7 @@ font-size: 12px; font-weight: bold; display: block; + letter-spacing: 0.01em; padding: 0 10px 0 0; white-space: nowrap; text-overflow: ellipsis; @@ -107,6 +108,7 @@ color: @text-normal; font-size: 12px; font-weight: bold; + letter-spacing: 0.01em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; diff --git a/apps/common/main/resources/less/comments.less b/apps/common/main/resources/less/comments.less index 2a42718e1..54074667a 100644 --- a/apps/common/main/resources/less/comments.less +++ b/apps/common/main/resources/less/comments.less @@ -21,6 +21,7 @@ label { font-size: 12px; font-weight: bold; + letter-spacing: 0.01em; margin-top: 2px; } } @@ -153,6 +154,7 @@ color: @text-normal; font-size: 12px; font-weight: bold; + letter-spacing: 0.01em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; diff --git a/apps/common/main/resources/less/history.less b/apps/common/main/resources/less/history.less index 0976d636f..303d14fa0 100644 --- a/apps/common/main/resources/less/history.less +++ b/apps/common/main/resources/less/history.less @@ -100,6 +100,7 @@ display: inline-block; font-size: 12px; font-weight: bold; + letter-spacing: 0.01em; margin-right: 12px; white-space: nowrap; overflow: hidden; @@ -129,6 +130,7 @@ overflow: hidden; font-size: 12px; font-weight: bold; + letter-spacing: 0.01em; cursor: pointer; text-overflow: ellipsis; padding-right: 35px; diff --git a/apps/common/main/resources/less/window.less b/apps/common/main/resources/less/window.less index ee6e29a2b..2269d6c98 100644 --- a/apps/common/main/resources/less/window.less +++ b/apps/common/main/resources/less/window.less @@ -101,6 +101,7 @@ text-align: center; font-size: 12px; font-weight: 700; + letter-spacing: 0.01em; vertical-align: bottom; line-height: 26px; From 966722826ff485b7ddba747fd100928a53df8be6 Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Wed, 26 Jan 2022 17:25:10 +0300 Subject: [PATCH 08/43] [PE] Make settings for relative positioning in image advanced settings --- .../template/ImageSettingsAdvanced.template | 14 ++++- .../main/app/view/DocumentHolder.js | 1 + .../main/app/view/ImageSettings.js | 1 + .../main/app/view/ImageSettingsAdvanced.js | 53 ++++++++++++++++--- apps/presentationeditor/main/locale/en.json | 5 ++ 5 files changed, 66 insertions(+), 8 deletions(-) diff --git a/apps/presentationeditor/main/app/template/ImageSettingsAdvanced.template b/apps/presentationeditor/main/app/template/ImageSettingsAdvanced.template index 1a38e6b2f..f30583634 100644 --- a/apps/presentationeditor/main/app/template/ImageSettingsAdvanced.template +++ b/apps/presentationeditor/main/app/template/ImageSettingsAdvanced.template @@ -34,13 +34,23 @@     + + + +
    - +
    		- + +
    +
    +
    		+ +
    +
    diff --git a/apps/presentationeditor/main/app/view/DocumentHolder.js b/apps/presentationeditor/main/app/view/DocumentHolder.js index 731df772b..11352f69c 100644 --- a/apps/presentationeditor/main/app/view/DocumentHolder.js +++ b/apps/presentationeditor/main/app/view/DocumentHolder.js @@ -2527,6 +2527,7 @@ define([ { imageProps: elValue, sizeOriginal: imgsizeOriginal, + slideSize: PE.getController('Toolbar').currentPageSize, handler: function(result, value) { if (result == 'ok') { if (me.api) { diff --git a/apps/presentationeditor/main/app/view/ImageSettings.js b/apps/presentationeditor/main/app/view/ImageSettings.js index cad43e7c9..2f685803d 100644 --- a/apps/presentationeditor/main/app/view/ImageSettings.js +++ b/apps/presentationeditor/main/app/view/ImageSettings.js @@ -436,6 +436,7 @@ define([ { imageProps: elValue, sizeOriginal: imgsizeOriginal, + slideSize: PE.getController('Toolbar').currentPageSize, handler: function(result, value) { if (result == 'ok') { if (me.api) { diff --git a/apps/presentationeditor/main/app/view/ImageSettingsAdvanced.js b/apps/presentationeditor/main/app/view/ImageSettingsAdvanced.js index 665b8fa04..9bebcb84b 100644 --- a/apps/presentationeditor/main/app/view/ImageSettingsAdvanced.js +++ b/apps/presentationeditor/main/app/view/ImageSettingsAdvanced.js @@ -74,6 +74,7 @@ define([ 'text!presentationeditor/main/app/template/ImageSettingsAdvanced.tem this._nRatio = 1; this._isDefaultSize = false; this._originalProps = this.options.imageProps; + this.slideSize = this.options.slideSize; }, render: function() { @@ -178,6 +179,28 @@ define([ 'text!presentationeditor/main/app/template/ImageSettingsAdvanced.tem }); this.spinners.push(this.spnY); + this.cmbFromX = new Common.UI.ComboBox({ + el: $('#image-advanced-combo-from-x'), + cls: 'input-group-nr', + style: "width: 100px;", + menuStyle: 'min-width: 100px;', + data: [ + { value: 'left', displayValue: this.textTopLeftCorner }, + { value: 'center', displayValue: this.textCenter } + ] + }); + + this.cmbFromY = new Common.UI.ComboBox({ + el: $('#image-advanced-combo-from-y'), + cls: 'input-group-nr', + style: "width: 100px;", + menuStyle: 'min-width: 100px;', + data: [ + { value: 'left', displayValue: this.textTopLeftCorner }, + { value: 'center', displayValue: this.textCenter } + ] + }); + // Rotation this.spnAngle = new Common.UI.MetricSpinner({ el: $('#image-advanced-spin-angle'), @@ -223,7 +246,7 @@ define([ 'text!presentationeditor/main/app/template/ImageSettingsAdvanced.tem getFocusedComponents: function() { return [ - this.spnWidth, this.spnHeight, this.btnOriginalSize, this.spnX, this.spnY,// 0 tab + this.spnWidth, this.spnHeight, this.btnOriginalSize, this.spnX, this.cmbFromX, this.spnY, this.cmbFromY,// 0 tab this.spnAngle, this.chFlipHor, this.chFlipVert, // 1 tab this.inputAltTitle, this.textareaAltDescription // 2 tab ]; @@ -271,6 +294,9 @@ define([ 'text!presentationeditor/main/app/template/ImageSettingsAdvanced.tem if (props.get_Height()>0) this._nRatio = props.get_Width()/props.get_Height(); + this.cmbFromX.setValue('left'); + this.cmbFromY.setValue('left'); + if (props.get_Position()) { var Position = {X: props.get_Position().get_X(), Y: props.get_Position().get_Y()}; this.spnX.setValue((Position.X !== null && Position.X !== undefined) ? Common.Utils.Metric.fnRecalcFromMM(Position.X) : '', true); @@ -306,10 +332,20 @@ define([ 'text!presentationeditor/main/app/template/ImageSettingsAdvanced.tem properties.put_ResetCrop(this._isDefaultSize); var Position = new Asc.CPosition(); - if (this.spnX.getValue() !== '') - Position.put_X(Common.Utils.Metric.fnRecalcToMM(this.spnX.getNumberValue())); - if (this.spnY.getValue() !== '') - Position.put_Y(Common.Utils.Metric.fnRecalcToMM(this.spnY.getNumberValue())); + if (this.spnX.getValue() !== '') { + var x = Common.Utils.Metric.fnRecalcToMM(this.spnX.getNumberValue()); + if (this.cmbFromX.getValue() === 'center') { + x = (this.slideSize.width/36000)/2 + x; + } + Position.put_X(x); + } + if (this.spnY.getValue() !== '') { + var y = Common.Utils.Metric.fnRecalcToMM(this.spnY.getNumberValue()); + if (this.cmbFromY.getValue() === 'center') { + y = (this.slideSize.height/36000)/2 + y; + } + Position.put_Y(y); + } properties.put_Position(Position); if (this.isAltTitleChanged) @@ -360,7 +396,12 @@ define([ 'text!presentationeditor/main/app/template/ImageSettingsAdvanced.tem textAngle: 'Angle', textFlipped: 'Flipped', textHorizontally: 'Horizontally', - textVertically: 'Vertically' + textVertically: 'Vertically', + textHorizontal: 'Horizontal', + textVertical: 'Vertical', + textFrom: 'From', + textTopLeftCorner: 'Top Left Corner', + textCenter: 'Center' }, PE.Views.ImageSettingsAdvanced || {})); }); \ No newline at end of file diff --git a/apps/presentationeditor/main/locale/en.json b/apps/presentationeditor/main/locale/en.json index f3de726de..b480eb8b8 100644 --- a/apps/presentationeditor/main/locale/en.json +++ b/apps/presentationeditor/main/locale/en.json @@ -1696,6 +1696,11 @@ "PE.Views.ImageSettingsAdvanced.textTitle": "Image - Advanced Settings", "PE.Views.ImageSettingsAdvanced.textVertically": "Vertically", "PE.Views.ImageSettingsAdvanced.textWidth": "Width", + "PE.Views.ImageSettingsAdvanced.textHorizontal": "Horizontal", + "PE.Views.ImageSettingsAdvanced.textVertical": "Vertical", + "PE.Views.ImageSettingsAdvanced.textFrom": "From", + "PE.Views.ImageSettingsAdvanced.textTopLeftCorner": "Top Left Corner", + "PE.Views.ImageSettingsAdvanced.textCenter": "Center", "PE.Views.LeftMenu.tipAbout": "About", "PE.Views.LeftMenu.tipChat": "Chat", "PE.Views.LeftMenu.tipComments": "Comments", From 0e3645489058ad4dea4a507a503efb6b68903591 Mon Sep 17 00:00:00 2001 From: OVSharova Date: Wed, 26 Jan 2022 18:00:09 +0300 Subject: [PATCH 09/43] Fix Bug 50043 --- apps/common/forms/resources/less/common.less | 1 - apps/common/main/resources/less/about.less | 4 ++-- apps/common/main/resources/less/buttons.less | 6 ++---- apps/common/main/resources/less/chat.less | 8 +++----- apps/common/main/resources/less/combo-dataview.less | 2 +- apps/common/main/resources/less/comments.less | 8 +++----- apps/common/main/resources/less/common.less | 4 ++-- apps/common/main/resources/less/dataview.less | 2 +- apps/common/main/resources/less/header.less | 9 +++++++-- apps/common/main/resources/less/history.less | 6 ++---- apps/common/main/resources/less/opendialog.less | 2 +- apps/common/main/resources/less/plugins.less | 4 ++-- apps/common/main/resources/less/tabbar.less | 2 +- apps/common/main/resources/less/window.less | 2 +- apps/documenteditor/main/resources/less/filemenu.less | 8 ++++---- .../documenteditor/main/resources/less/navigation.less | 2 +- .../documenteditor/main/resources/less/thumbnails.less | 2 +- .../main/resources/less/advanced-settings.less | 2 +- .../main/resources/less/animation.less | 2 +- .../main/resources/less/leftmenu.less | 8 ++++---- .../main/resources/less/advanced-settings.less | 2 +- .../main/resources/less/filterdialog.less | 2 +- .../main/resources/less/formuladialog.less | 2 +- .../main/resources/less/leftmenu.less | 10 +++++----- .../main/resources/less/statusbar.less | 4 ++-- 25 files changed, 50 insertions(+), 54 deletions(-) diff --git a/apps/common/forms/resources/less/common.less b/apps/common/forms/resources/less/common.less index 2c839391c..1e61888f3 100644 --- a/apps/common/forms/resources/less/common.less +++ b/apps/common/forms/resources/less/common.less @@ -578,7 +578,6 @@ &.header { font-weight: bold; - letter-spacing: 0.01em; } } diff --git a/apps/common/main/resources/less/about.less b/apps/common/main/resources/less/about.less index f88e7b4d7..aaf507baf 100644 --- a/apps/common/main/resources/less/about.less +++ b/apps/common/main/resources/less/about.less @@ -22,7 +22,7 @@ letter-spacing: 1px; color: @text-normal-ie; color: @text-normal; - font-weight: bold; + .font-weight-bold(); white-space: nowrap; } @@ -55,7 +55,7 @@ } &.asc-about-lic { - font-weight: bold; + .font-weight-bold(); } } diff --git a/apps/common/main/resources/less/buttons.less b/apps/common/main/resources/less/buttons.less index 06b105eca..5134404f9 100644 --- a/apps/common/main/resources/less/buttons.less +++ b/apps/common/main/resources/less/buttons.less @@ -477,8 +477,7 @@ position: relative; .border-radius(0); background-color: transparent; - font-weight: bold; - letter-spacing: 0.01em; + .font-weight-bold(); &:hover:not(.disabled), .over:not(.disabled) { @@ -1047,8 +1046,7 @@ // ------------------------ .dlg-btn { - font-weight: bold; - letter-spacing: 0.01em; + .font-weight-bold(); width: 86px; color: @text-normal-ie; color: @text-normal; diff --git a/apps/common/main/resources/less/chat.less b/apps/common/main/resources/less/chat.less index 22329434e..566e58cab 100644 --- a/apps/common/main/resources/less/chat.less +++ b/apps/common/main/resources/less/chat.less @@ -64,9 +64,8 @@ .name { font-size: 12px; - font-weight: bold; + .font-weight-bold(); display: block; - letter-spacing: 0.01em; padding: 0 10px 0 0; white-space: nowrap; text-overflow: ellipsis; @@ -97,7 +96,7 @@ word-wrap: break-word; .user { - font-weight: bold; + .font-weight-bold(); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; @@ -107,8 +106,7 @@ color: @text-normal-ie; color: @text-normal; font-size: 12px; - font-weight: bold; - letter-spacing: 0.01em; + .font-weight-bold(); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; diff --git a/apps/common/main/resources/less/combo-dataview.less b/apps/common/main/resources/less/combo-dataview.less index 368da7ea4..645eb51cb 100644 --- a/apps/common/main/resources/less/combo-dataview.less +++ b/apps/common/main/resources/less/combo-dataview.less @@ -402,7 +402,7 @@ .menu-picker-container { .group-description { padding: 3px 0 3px 10px; - font-weight: bold; + .font-weight-bold(); } .group-items-container .item { diff --git a/apps/common/main/resources/less/comments.less b/apps/common/main/resources/less/comments.less index 54074667a..dd05eb9a1 100644 --- a/apps/common/main/resources/less/comments.less +++ b/apps/common/main/resources/less/comments.less @@ -20,8 +20,7 @@ label { font-size: 12px; - font-weight: bold; - letter-spacing: 0.01em; + .font-weight-bold(); margin-top: 2px; } } @@ -153,8 +152,7 @@ color: @text-normal-ie; color: @text-normal; font-size: 12px; - font-weight: bold; - letter-spacing: 0.01em; + .font-weight-bold(); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; @@ -340,7 +338,7 @@ margin-right:0; line-height: 14px; font-size: 14px; - font-weight: bold; + .font-weight-bold(); color: @text-normal-ie; color: @text-normal; opacity: 0.7; diff --git a/apps/common/main/resources/less/common.less b/apps/common/main/resources/less/common.less index 2a292dbb7..15f2deb5b 100644 --- a/apps/common/main/resources/less/common.less +++ b/apps/common/main/resources/less/common.less @@ -113,7 +113,7 @@ label { .box-inner-shadow(0 @scaled-one-px-value 0 @border-toolbar); .status-label { - font-weight: bold; + .font-weight-bold(); color: @text-normal-ie; color: @text-normal; white-space: nowrap; @@ -183,7 +183,7 @@ label { } &.header { - font-weight: bold; + .font-weight-bold(); } } diff --git a/apps/common/main/resources/less/dataview.less b/apps/common/main/resources/less/dataview.less index 19189ea31..14c376c4d 100644 --- a/apps/common/main/resources/less/dataview.less +++ b/apps/common/main/resources/less/dataview.less @@ -79,7 +79,7 @@ .header-name { padding: 10px 2px 12px 4px; - font-weight: bold; + .font-weight-bold(); cursor: default; } diff --git a/apps/common/main/resources/less/header.less b/apps/common/main/resources/less/header.less index 9bed1c0f7..99e240028 100644 --- a/apps/common/main/resources/less/header.less +++ b/apps/common/main/resources/less/header.less @@ -284,7 +284,7 @@ color: @text-normal-ie; color: @text-normal; font-size: 12px; - font-weight: bold; + .font-weight-bold(); white-space: nowrap; cursor: default; @@ -293,7 +293,7 @@ text-overflow: ellipsis; vertical-align: middle; max-width: 200px; - font-weight: bold; + .font-weight-bold(); } } } @@ -475,3 +475,8 @@ } } } + +.font-weight-bold{ + font-weight: bold; + letter-spacing: 0.01em; +} diff --git a/apps/common/main/resources/less/history.less b/apps/common/main/resources/less/history.less index 303d14fa0..87bbf144a 100644 --- a/apps/common/main/resources/less/history.less +++ b/apps/common/main/resources/less/history.less @@ -99,8 +99,7 @@ .user-date { display: inline-block; font-size: 12px; - font-weight: bold; - letter-spacing: 0.01em; + .font-weight-bold(); margin-right: 12px; white-space: nowrap; overflow: hidden; @@ -129,8 +128,7 @@ white-space: nowrap; overflow: hidden; font-size: 12px; - font-weight: bold; - letter-spacing: 0.01em; + .font-weight-bold(); cursor: pointer; text-overflow: ellipsis; padding-right: 35px; diff --git a/apps/common/main/resources/less/opendialog.less b/apps/common/main/resources/less/opendialog.less index 4172a765e..9517eeb77 100644 --- a/apps/common/main/resources/less/opendialog.less +++ b/apps/common/main/resources/less/opendialog.less @@ -33,7 +33,7 @@ } &.header { - font-weight: bold; + .font-weight-bold(); } } diff --git a/apps/common/main/resources/less/plugins.less b/apps/common/main/resources/less/plugins.less index 7e29f0bf2..bc9d154fd 100644 --- a/apps/common/main/resources/less/plugins.less +++ b/apps/common/main/resources/less/plugins.less @@ -8,7 +8,7 @@ height: 20px; left: 0; top: 0; - font-weight: bold; + .font-weight-bold(); margin-top: 10px; margin-left: 12px; @@ -91,7 +91,7 @@ label { width: 100%; padding-right: 20px; - font-weight: bold; + .font-weight-bold(); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; diff --git a/apps/common/main/resources/less/tabbar.less b/apps/common/main/resources/less/tabbar.less index 20ef6a73f..c29317ef2 100644 --- a/apps/common/main/resources/less/tabbar.less +++ b/apps/common/main/resources/less/tabbar.less @@ -36,7 +36,7 @@ &::after { content: attr(title); - font-weight: bold; + .font-weight-bold(); display: block; } diff --git a/apps/common/main/resources/less/window.less b/apps/common/main/resources/less/window.less index 2269d6c98..af232b9f6 100644 --- a/apps/common/main/resources/less/window.less +++ b/apps/common/main/resources/less/window.less @@ -123,7 +123,7 @@ margin-right:0; line-height: 14px; font-size: 14px; - font-weight: bold; + .font-weight-bold(); color: @text-normal-ie; color: @text-normal; opacity: 0.7; diff --git a/apps/documenteditor/main/resources/less/filemenu.less b/apps/documenteditor/main/resources/less/filemenu.less index f742ab3b3..903120417 100644 --- a/apps/documenteditor/main/resources/less/filemenu.less +++ b/apps/documenteditor/main/resources/less/filemenu.less @@ -134,7 +134,7 @@ width: 30%; label { - font-weight: bold; + .font-weight-bold(); font-size: 12px; } } @@ -157,7 +157,7 @@ font-size: 10pt; color: @text-normal-ie; color: @text-normal; - font-weight: bold; + .font-weight-bold(); padding: 0 0 10px 10px; white-space: nowrap; } @@ -344,7 +344,7 @@ width: 30%; label { - font-weight: bold; + .font-weight-bold(); } } @@ -428,7 +428,7 @@ label { } .header { - font-weight: bold; + .font-weight-bold(); margin: 30px 0 10px; } diff --git a/apps/documenteditor/main/resources/less/navigation.less b/apps/documenteditor/main/resources/less/navigation.less index 0a3726fad..026c76f0c 100644 --- a/apps/documenteditor/main/resources/less/navigation.less +++ b/apps/documenteditor/main/resources/less/navigation.less @@ -9,7 +9,7 @@ left: 0; top: 0; width: 100%; - font-weight: bold; + .font-weight-bold(); padding: 10px 12px; border-bottom: @scaled-one-px-value-ie solid @border-toolbar-ie; border-bottom: @scaled-one-px-value solid @border-toolbar; diff --git a/apps/documenteditor/main/resources/less/thumbnails.less b/apps/documenteditor/main/resources/less/thumbnails.less index 582e5830c..41bea7b02 100644 --- a/apps/documenteditor/main/resources/less/thumbnails.less +++ b/apps/documenteditor/main/resources/less/thumbnails.less @@ -19,7 +19,7 @@ label { font-size: 12px; - font-weight: bold; + .font-weight-bold(); margin-top: 2px; } diff --git a/apps/presentationeditor/main/resources/less/advanced-settings.less b/apps/presentationeditor/main/resources/less/advanced-settings.less index 828fd2bfe..b7be1be09 100644 --- a/apps/presentationeditor/main/resources/less/advanced-settings.less +++ b/apps/presentationeditor/main/resources/less/advanced-settings.less @@ -32,7 +32,7 @@ .div-category { padding: 0 15px; text-align: right; - font-weight: bold; + .font-weight-bold(); font-size: 11px; } } diff --git a/apps/presentationeditor/main/resources/less/animation.less b/apps/presentationeditor/main/resources/less/animation.less index 1beca9c3b..2c8cb5021 100644 --- a/apps/presentationeditor/main/resources/less/animation.less +++ b/apps/presentationeditor/main/resources/less/animation.less @@ -12,7 +12,7 @@ .group-description { padding: 3px 0 3px 10px; - font-weight: bold; + .font-weight-bold(); } .grouped-data .group-items-container { diff --git a/apps/presentationeditor/main/resources/less/leftmenu.less b/apps/presentationeditor/main/resources/less/leftmenu.less index 7adf9ab21..d459bc211 100644 --- a/apps/presentationeditor/main/resources/less/leftmenu.less +++ b/apps/presentationeditor/main/resources/less/leftmenu.less @@ -171,7 +171,7 @@ width: 30%; label { - font-weight: bold; + .font-weight-bold(); font-size: 12px; } } @@ -194,7 +194,7 @@ font-size: 10pt; color: @text-normal-ie; color: @text-normal; - font-weight: bold; + .font-weight-bold(); padding: 0 0 10px 10px; white-space: nowrap; } @@ -377,7 +377,7 @@ width: 30%; label { - font-weight: bold; + .font-weight-bold(); } } @@ -439,7 +439,7 @@ padding: 30px 30px; .header { - font-weight: bold; + .font-weight-bold(); margin: 30px 0 10px; } diff --git a/apps/spreadsheeteditor/main/resources/less/advanced-settings.less b/apps/spreadsheeteditor/main/resources/less/advanced-settings.less index 61a1ee11f..f8e64e3d2 100644 --- a/apps/spreadsheeteditor/main/resources/less/advanced-settings.less +++ b/apps/spreadsheeteditor/main/resources/less/advanced-settings.less @@ -32,7 +32,7 @@ .div-category { padding: 0 0 0 10px; text-align: right; - font-weight: bold; + .font-weight-bold(); font-size: 11px; white-space: nowrap; } diff --git a/apps/spreadsheeteditor/main/resources/less/filterdialog.less b/apps/spreadsheeteditor/main/resources/less/filterdialog.less index f0cba4209..4f4d4f7f0 100644 --- a/apps/spreadsheeteditor/main/resources/less/filterdialog.less +++ b/apps/spreadsheeteditor/main/resources/less/filterdialog.less @@ -68,7 +68,7 @@ } &.header { - font-weight: bold; + .font-weight-bold(); } } diff --git a/apps/spreadsheeteditor/main/resources/less/formuladialog.less b/apps/spreadsheeteditor/main/resources/less/formuladialog.less index 5fb38c22d..2d0559c49 100644 --- a/apps/spreadsheeteditor/main/resources/less/formuladialog.less +++ b/apps/spreadsheeteditor/main/resources/less/formuladialog.less @@ -39,7 +39,7 @@ } &.header { - font-weight: bold; + .font-weight-bold(); } word-wrap: break-word; diff --git a/apps/spreadsheeteditor/main/resources/less/leftmenu.less b/apps/spreadsheeteditor/main/resources/less/leftmenu.less index bbd690c39..40a74439b 100644 --- a/apps/spreadsheeteditor/main/resources/less/leftmenu.less +++ b/apps/spreadsheeteditor/main/resources/less/leftmenu.less @@ -215,7 +215,7 @@ width: 30%; label { - font-weight: bold; + .font-weight-bold(); font-size: 12px; } } @@ -262,7 +262,7 @@ font-size: 10pt; color: @text-normal-ie; color: @text-normal; - font-weight: bold; + .font-weight-bold(); padding: 0 0 10px 10px; white-space: nowrap; } @@ -445,7 +445,7 @@ width: 30%; label { - font-weight: bold; + .font-weight-bold(); } } @@ -507,7 +507,7 @@ padding: 30px 30px; .header { - font-weight: bold; + .font-weight-bold(); margin: 30px 0 10px; } @@ -619,7 +619,7 @@ height: 20px; margin-left: 10px; label { - font-weight: bold; + .font-weight-bold(); } #print-count-page, #print-number-page { margin-left: 4px; diff --git a/apps/spreadsheeteditor/main/resources/less/statusbar.less b/apps/spreadsheeteditor/main/resources/less/statusbar.less index 6e19df2bf..86e9f9842 100644 --- a/apps/spreadsheeteditor/main/resources/less/statusbar.less +++ b/apps/spreadsheeteditor/main/resources/less/statusbar.less @@ -238,7 +238,7 @@ box-shadow: 0px 4px 0 #49795d inset; border-top-width: 0; padding-top: 1px; - font-weight: bold; + .font-weight-bold(); } } @@ -368,7 +368,7 @@ display: flex; justify-content: flex-start; .status-label { - font-weight: bold; + .font-weight-bold(); color: @text-normal; margin-top: 5px; width: 100%; From a98d599096f85e344f9992b0d33e00799866e789 Mon Sep 17 00:00:00 2001 From: OVSharova Date: Thu, 27 Jan 2022 14:36:04 +0300 Subject: [PATCH 10/43] Fix Bug 50043 --- apps/common/main/resources/less/asc-mixins.less | 5 +++++ apps/common/main/resources/less/buttons.less | 3 ++- apps/common/main/resources/less/header.less | 5 +---- 3 files changed, 8 insertions(+), 5 deletions(-) diff --git a/apps/common/main/resources/less/asc-mixins.less b/apps/common/main/resources/less/asc-mixins.less index 980503c55..bac76454f 100644 --- a/apps/common/main/resources/less/asc-mixins.less +++ b/apps/common/main/resources/less/asc-mixins.less @@ -81,6 +81,11 @@ button.disabled > .@{icon-class} {background-position: -3*@icon-size -@index*@icon-size;} } +.font-weight-bold{ + font-weight: bold; + letter-spacing: 0.01em; +} + /** */ :root { diff --git a/apps/common/main/resources/less/buttons.less b/apps/common/main/resources/less/buttons.less index 5134404f9..b718c3a27 100644 --- a/apps/common/main/resources/less/buttons.less +++ b/apps/common/main/resources/less/buttons.less @@ -476,8 +476,9 @@ display: block; position: relative; .border-radius(0); - background-color: transparent; .font-weight-bold(); + background-color: transparent; + &:hover:not(.disabled), .over:not(.disabled) { diff --git a/apps/common/main/resources/less/header.less b/apps/common/main/resources/less/header.less index 99e240028..db1633f71 100644 --- a/apps/common/main/resources/less/header.less +++ b/apps/common/main/resources/less/header.less @@ -476,7 +476,4 @@ } } -.font-weight-bold{ - font-weight: bold; - letter-spacing: 0.01em; -} + From ad71560b8da0b72253f724c649073ca6c4fc58b9 Mon Sep 17 00:00:00 2001 From: ShimaginAndrey Date: Fri, 28 Jan 2022 14:20:41 +0300 Subject: [PATCH 11/43] [SSE] Refactoring TabColor --- apps/spreadsheeteditor/mobile/src/controller/Statusbar.jsx | 7 ++++--- apps/spreadsheeteditor/mobile/src/view/Statusbar.jsx | 5 ++--- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/apps/spreadsheeteditor/mobile/src/controller/Statusbar.jsx b/apps/spreadsheeteditor/mobile/src/controller/Statusbar.jsx index 53c6e0928..6c4ef781f 100644 --- a/apps/spreadsheeteditor/mobile/src/controller/Statusbar.jsx +++ b/apps/spreadsheeteditor/mobile/src/controller/Statusbar.jsx @@ -71,7 +71,6 @@ const StatusbarController = inject('sheets', 'storeFocusObjects', 'users')(obser sheets.setActiveWorksheet(index); Common.Notifications.trigger('sheet:active', index); } - onApiSheetsChanged(); }; const onApiHideTabContextMenu = () => { @@ -375,10 +374,11 @@ const Statusbar = inject('sheets', 'storeAppOptions', 'users')(observer(props => const onSetWorkSheetColor = (color) => { const api = Common.EditorApi.get(); - let arrIndex = []; + const active_index = api.asc_getActiveWorksheetIndex(); + const arrIndex = []; if (api) { - arrIndex.push(api.asc_getActiveWorksheetIndex()); + arrIndex.push(active_index); if (arrIndex) { if(color === 'transparent') { api.asc_setWorksheetTabColor(null, arrIndex); @@ -392,6 +392,7 @@ const Statusbar = inject('sheets', 'storeAppOptions', 'users')(observer(props => } } } + sheets.sheets[active_index].color = api.asc_getWorksheetTabColor(active_index); } } diff --git a/apps/spreadsheeteditor/mobile/src/view/Statusbar.jsx b/apps/spreadsheeteditor/mobile/src/view/Statusbar.jsx index 97d14dfe8..03143c5ac 100644 --- a/apps/spreadsheeteditor/mobile/src/view/Statusbar.jsx +++ b/apps/spreadsheeteditor/mobile/src/view/Statusbar.jsx @@ -81,8 +81,7 @@ const PageCustomTabColor = inject("storePalette")(observer (props => { const PageTabColor = inject("storePalette")(observer(props => { const { t } = useTranslation(); - const {sheets} = props; - const allSheets = sheets.sheets; + const {sheets, allSheets = sheets.sheets} = props; const storePalette = props.storePalette; const customColors = storePalette.customColors; const activeIndex = sheets.activeWorksheet; @@ -96,7 +95,7 @@ const PageTabColor = inject("storePalette")(observer(props => { sheets.changeTabColor('transparent'); } } - }, [allSheets]) + }, [activeIndex]); const changeColor = (color, effectId, effectValue) => { if (color !== 'empty') { From 472427df94f4ed7fa04696cceaf98b4a5e80fd87 Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Fri, 28 Jan 2022 17:01:31 +0300 Subject: [PATCH 12/43] [PE] Add placement tab in table advanced settings --- .../template/TableSettingsAdvanced.template | 56 +++++- .../main/app/view/DocumentHolder.js | 1 + .../main/app/view/TableSettings.js | 1 + .../main/app/view/TableSettingsAdvanced.js | 166 +++++++++++++++++- apps/presentationeditor/main/locale/en.json | 10 ++ 5 files changed, 231 insertions(+), 3 deletions(-) diff --git a/apps/presentationeditor/main/app/template/TableSettingsAdvanced.template b/apps/presentationeditor/main/app/template/TableSettingsAdvanced.template index 775b19368..bd404ed5d 100644 --- a/apps/presentationeditor/main/app/template/TableSettingsAdvanced.template +++ b/apps/presentationeditor/main/app/template/TableSettingsAdvanced.template @@ -1,4 +1,58 @@ -
    +
    +
    + + + + + + + + + +
    + +
    + +
    +     		+
    +     		+ +
    +
    +
    +
    +
    + + + + + + + + + + + + +
    + +
    + +
    +     		+ +
    +
    + +
    +     		+ +
    +
    +
    +
    +
    diff --git a/apps/presentationeditor/main/app/view/DocumentHolder.js b/apps/presentationeditor/main/app/view/DocumentHolder.js index 11352f69c..13249995d 100644 --- a/apps/presentationeditor/main/app/view/DocumentHolder.js +++ b/apps/presentationeditor/main/app/view/DocumentHolder.js @@ -2484,6 +2484,7 @@ define([ (new PE.Views.TableSettingsAdvanced( { tableProps: elValue, + slideSize: PE.getController('Toolbar').currentPageSize, handler: function(result, value) { if (result == 'ok') { if (me.api) { diff --git a/apps/presentationeditor/main/app/view/TableSettings.js b/apps/presentationeditor/main/app/view/TableSettings.js index d57f7764b..d08e62efb 100644 --- a/apps/presentationeditor/main/app/view/TableSettings.js +++ b/apps/presentationeditor/main/app/view/TableSettings.js @@ -763,6 +763,7 @@ define([ (new PE.Views.TableSettingsAdvanced( { tableProps: elValue, + slideSize: PE.getController('Toolbar').currentPageSize, handler: function(result, value) { if (result == 'ok') { if (me.api) { diff --git a/apps/presentationeditor/main/app/view/TableSettingsAdvanced.js b/apps/presentationeditor/main/app/view/TableSettingsAdvanced.js index 9e3f0b99b..48ea9b1a2 100644 --- a/apps/presentationeditor/main/app/view/TableSettingsAdvanced.js +++ b/apps/presentationeditor/main/app/view/TableSettingsAdvanced.js @@ -49,13 +49,15 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem alias: 'TableSettingsAdvanced', contentWidth: 280, height: 385, - storageName: 'pe-table-settings-adv-category' + storageName: 'pe-table-settings-adv-category', + sizeMax: {width: 142.24, height: 142.24}, }, initialize : function(options) { _.extend(this.options, { title: this.textTitle, items: [ + {panelId: 'id-adv-table-placement', panelCaption: this.textPlacement}, {panelId: 'id-adv-table-cell-props', panelCaption: this.textWidthSpaces}, {panelId: 'id-adv-table-alttext', panelCaption: this.textAlt} ], @@ -86,6 +88,7 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem this._initialMarginsDefault = false; // если для всех выделенных ячеек пришло одинаковое значение Flag=0 (Use Default Margins) this._originalProps = new Asc.CTableProp(this.options.tableProps); + this.slideSize = this.options.slideSize; }, render: function() { @@ -93,6 +96,113 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem var me = this; + // Placement + this.spnWidth = new Common.UI.MetricSpinner({ + el: $('#tableadv-spin-width'), + step: .1, + width: 100, + defaultUnit : "cm", + value: '3 cm', + maxValue: 142.24, + minValue: 0 + }); + this.spnWidth.on('change', _.bind(function(field){ + if (this.btnRatio.pressed) { + var w = field.getNumberValue(); + var h = w/this._nRatio; + if (h>this.sizeMax.height) { + h = this.sizeMax.height; + w = h * this._nRatio; + this.spnWidth.setValue(w, true); + } + this.spnHeight.setValue(h, true); + } + }, this)); + this.spinners.push(this.spnWidth); + + this.spnHeight = new Common.UI.MetricSpinner({ + el: $('#tableadv-spin-height'), + step: .1, + width: 100, + defaultUnit : "cm", + value: '3 cm', + maxValue: 142.24, + minValue: 0 + }); + this.spnHeight.on('change', _.bind(function(field, newValue, oldValue, eOpts){ + var h = field.getNumberValue(), w = null; + if (this.btnRatio.pressed) { + w = h * this._nRatio; + if (w>this.sizeMax.width) { + w = this.sizeMax.width; + h = w/this._nRatio; + this.spnHeight.setValue(h, true); + } + this.spnWidth.setValue(w, true); + } + }, this)); + this.spinners.push(this.spnHeight); + + this.btnRatio = new Common.UI.Button({ + parentEl: $('#tableadv-button-ratio'), + cls: 'btn-toolbar', + iconCls: 'toolbar__icon advanced-btn-ratio', + style: 'margin-bottom: 1px;', + enableToggle: true, + hint: this.textKeepRatio + }); + this.btnRatio.on('click', _.bind(function(btn, e) { + if (btn.pressed && this.spnHeight.getNumberValue()>0) { + this._nRatio = this.spnWidth.getNumberValue()/this.spnHeight.getNumberValue(); + } + }, this)); + + this.spnX = new Common.UI.MetricSpinner({ + el: $('#tableadv-spin-x'), + step: .1, + width: 85, + defaultUnit : "cm", + defaultValue : 0, + value: '0 cm', + maxValue: 55.87, + minValue: -55.87 + }); + this.spinners.push(this.spnX); + + this.spnY = new Common.UI.MetricSpinner({ + el: $('#tableadv-spin-y'), + step: .1, + width: 85, + defaultUnit : "cm", + defaultValue : 0, + value: '0 cm', + maxValue: 55.87, + minValue: -55.87 + }); + this.spinners.push(this.spnY); + + this.cmbFromX = new Common.UI.ComboBox({ + el: $('#tableadv-combo-from-x'), + cls: 'input-group-nr', + style: "width: 100px;", + menuStyle: 'min-width: 100px;', + data: [ + { value: 'left', displayValue: this.textTopLeftCorner }, + { value: 'center', displayValue: this.textCenter } + ] + }); + + this.cmbFromY = new Common.UI.ComboBox({ + el: $('#tableadv-combo-from-y'), + cls: 'input-group-nr', + style: "width: 100px;", + menuStyle: 'min-width: 100px;', + data: [ + { value: 'left', displayValue: this.textTopLeftCorner }, + { value: 'center', displayValue: this.textCenter } + ] + }); + this._marginsChange = function(field, newValue, oldValue, eOpts, source, property){ if (source=='table') this.TableMargins[property] = field.getNumberValue(); @@ -352,6 +462,27 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem }, getSettings: function() { + if (this.spnHeight.getValue()!=='') + this._changedProps.put_FrameHeight(Common.Utils.Metric.fnRecalcToMM(this.spnHeight.getNumberValue())); + if (this.spnWidth.getValue()!=='') + this._changedProps.put_FrameWidth(Common.Utils.Metric.fnRecalcToMM(this.spnWidth.getNumberValue())); + //properties.asc_putLockAspect(this.btnRatio.pressed); + + if (this.spnX.getValue() !== '') { + var x = Common.Utils.Metric.fnRecalcToMM(this.spnX.getNumberValue()); + if (this.cmbFromX.getValue() === 'center') { + x = (this.slideSize.width/36000)/2 + x; + } + this._changedProps.put_FrameX(x); + } + if (this.spnY.getValue() !== '') { + var y = Common.Utils.Metric.fnRecalcToMM(this.spnY.getNumberValue()); + if (this.cmbFromY.getValue() === 'center') { + y = (this.slideSize.height/36000)/2 + y; + } + this._changedProps.put_FrameY(y); + } + if (this.isAltTitleChanged) this._changedProps.put_TableCaption(this.inputAltTitle.getValue()); @@ -365,6 +496,23 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem if (props ){ this._allTable = !props.get_CellSelect(); + // placement + this.spnWidth.setMaxValue(this.sizeMax.width); + this.spnHeight.setMaxValue(this.sizeMax.height); + this.spnWidth.setValue(Common.Utils.Metric.fnRecalcFromMM(props.get_FrameWidth()).toFixed(2), true); + this.spnHeight.setValue(Common.Utils.Metric.fnRecalcFromMM(props.get_FrameHeight()).toFixed(2), true); + + this.btnRatio.toggle(false); // to do + if (props.get_FrameHeight()>0) + this._nRatio = props.get_FrameWidth()/props.get_FrameHeight(); + + this.cmbFromX.setValue('left'); + this.cmbFromY.setValue('left'); + + var position = {x: props.get_FrameX(), y: props.get_FrameY()}; + this.spnX.setValue((position.x !== null && position.x !== undefined) ? Common.Utils.Metric.fnRecalcFromMM(position.x) : '', true); + this.spnY.setValue((position.y !== null && position.y !== undefined) ? Common.Utils.Metric.fnRecalcFromMM(position.y) : '', true); + // margins var margins = props.get_DefaultMargins(); if (margins) { @@ -442,6 +590,10 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem spinner.setStep(Common.Utils.Metric.getCurrentMetric()==Common.Utils.Metric.c_MetricUnits.pt ? 1 : 0.1); } } + this.sizeMax = { + width: Common.Utils.Metric.fnRecalcFromMM(this.options.sizeMax.width*10), + height: Common.Utils.Metric.fnRecalcFromMM(this.options.sizeMax.height*10) + }; }, textWidthSpaces: 'Margins', @@ -456,7 +608,17 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem textAlt: 'Alternative Text', textAltTitle: 'Title', textAltDescription: 'Description', - textAltTip: 'The alternative text-based representation of the visual object information, which will be read to the people with vision or cognitive impairments to help them better understand what information there is in the image, autoshape, chart or table.' + textAltTip: 'The alternative text-based representation of the visual object information, which will be read to the people with vision or cognitive impairments to help them better understand what information there is in the image, autoshape, chart or table.', + textPlacement: 'Placement', + textSize: 'Size', + textPosition: 'Position', + textHorizontal: 'Horizontal', + textVertical: 'Vertical', + textFrom: 'From', + textTopLeftCorner: 'Top Left Corner', + textCenter: 'Center', + textWidth: 'Width', + textHeight: 'Height' }, PE.Views.TableSettingsAdvanced || {})); }); \ No newline at end of file diff --git a/apps/presentationeditor/main/locale/en.json b/apps/presentationeditor/main/locale/en.json index b480eb8b8..887436d59 100644 --- a/apps/presentationeditor/main/locale/en.json +++ b/apps/presentationeditor/main/locale/en.json @@ -2023,6 +2023,16 @@ "PE.Views.TableSettingsAdvanced.textTitle": "Table - Advanced Settings", "PE.Views.TableSettingsAdvanced.textTop": "Top", "PE.Views.TableSettingsAdvanced.textWidthSpaces": "Margins", + "PE.Views.TableSettingsAdvanced.textPlacement": "Placement", + "PE.Views.TableSettingsAdvanced.textSize": "Size", + "PE.Views.TableSettingsAdvanced.textWidth": "Width", + "PE.Views.TableSettingsAdvanced.textHeight": "Height", + "PE.Views.TableSettingsAdvanced.textPosition": "Position", + "PE.Views.TableSettingsAdvanced.textHorizontal": "Horizontal", + "PE.Views.TableSettingsAdvanced.textVertical": "Vertical", + "PE.Views.TableSettingsAdvanced.textFrom": "From", + "PE.Views.TableSettingsAdvanced.textTopLeftCorner": "Top Left Corner", + "PE.Views.TableSettingsAdvanced.textCenter": "Center", "PE.Views.TextArtSettings.strBackground": "Background color", "PE.Views.TextArtSettings.strColor": "Color", "PE.Views.TextArtSettings.strFill": "Fill", From ee84a1d1604bc7eefb7d9c0744a2ceffc89c3405 Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Fri, 28 Jan 2022 20:47:56 +0300 Subject: [PATCH 13/43] [PE] Add placement tab in chart advanced settings, add position settings in shape advanced settings --- .../main/app/controller/Toolbar.js | 1 + .../template/ChartSettingsAdvanced.template | 56 ++++- .../template/ShapeSettingsAdvanced.template | 35 ++++ .../main/app/view/ChartSettings.js | 1 + .../main/app/view/ChartSettingsAdvanced.js | 193 +++++++++++++++++- .../main/app/view/DocumentHolder.js | 1 + .../main/app/view/ShapeSettings.js | 1 + .../main/app/view/ShapeSettingsAdvanced.js | 87 +++++++- .../main/app/view/TableSettingsAdvanced.js | 3 +- apps/presentationeditor/main/locale/en.json | 19 ++ 10 files changed, 391 insertions(+), 6 deletions(-) diff --git a/apps/presentationeditor/main/app/controller/Toolbar.js b/apps/presentationeditor/main/app/controller/Toolbar.js index 52c4200b1..e07d4939a 100644 --- a/apps/presentationeditor/main/app/controller/Toolbar.js +++ b/apps/presentationeditor/main/app/controller/Toolbar.js @@ -1425,6 +1425,7 @@ define([ var win = new PE.Views.ShapeSettingsAdvanced( { shapeProps: elValue, + slideSize: PE.getController('Toolbar').currentPageSize, handler: function(result, value) { if (result == 'ok') { if (me.api) { diff --git a/apps/presentationeditor/main/app/template/ChartSettingsAdvanced.template b/apps/presentationeditor/main/app/template/ChartSettingsAdvanced.template index 867ab988c..19fce891c 100644 --- a/apps/presentationeditor/main/app/template/ChartSettingsAdvanced.template +++ b/apps/presentationeditor/main/app/template/ChartSettingsAdvanced.template @@ -1,4 +1,58 @@ -
    +
    +
    +
    + + + + + + + + +
    + +
    + +
    +     		+
    +     		+ +
    +
    +
    +
    +
    + + + + + + + + + + + + +
    + +
    + +
    +     		+ +
    +
    + +
    +     		+ +
    +
    +
    +
    +
    diff --git a/apps/presentationeditor/main/app/template/ShapeSettingsAdvanced.template b/apps/presentationeditor/main/app/template/ShapeSettingsAdvanced.template index 6c3e2a6f9..0900539cd 100644 --- a/apps/presentationeditor/main/app/template/ShapeSettingsAdvanced.template +++ b/apps/presentationeditor/main/app/template/ShapeSettingsAdvanced.template @@ -1,6 +1,11 @@
    + + +
    + +
    @@ -16,6 +21,36 @@
    +
    +
    + + + + + + + + + + + + +
    + +
    + +
    +     		+ +
    +
    + +
    +     		+ +
    +
    +
    diff --git a/apps/presentationeditor/main/app/view/ChartSettings.js b/apps/presentationeditor/main/app/view/ChartSettings.js index 9ac998a65..9650c68c3 100644 --- a/apps/presentationeditor/main/app/view/ChartSettings.js +++ b/apps/presentationeditor/main/app/view/ChartSettings.js @@ -486,6 +486,7 @@ define([ (new PE.Views.ChartSettingsAdvanced( { chartProps: elValue, + slideSize: PE.getController('Toolbar').currentPageSize, handler: function(result, value) { if (result == 'ok') { if (me.api) { diff --git a/apps/presentationeditor/main/app/view/ChartSettingsAdvanced.js b/apps/presentationeditor/main/app/view/ChartSettingsAdvanced.js index 5b5a0155a..4064fba12 100644 --- a/apps/presentationeditor/main/app/view/ChartSettingsAdvanced.js +++ b/apps/presentationeditor/main/app/view/ChartSettingsAdvanced.js @@ -50,13 +50,15 @@ define([ 'text!presentationeditor/main/app/template/ChartSettingsAdvanced.tem height: 342, toggleGroup: 'chart-adv-settings-group', properties: null, - storageName: 'pe-chart-settings-adv-category' + storageName: 'pe-chart-settings-adv-category', + sizeMax: {width: 55.88, height: 55.88}, }, initialize : function(options) { _.extend(this.options, { title: this.textTitle, items: [ + {panelId: 'id-adv-chart-placement', panelCaption: this.textPlacement}, {panelId: 'id-adv-chart-alttext', panelCaption: this.textAlt} ], contentTemplate: _.template(contentTemplate)({ @@ -65,7 +67,10 @@ define([ 'text!presentationeditor/main/app/template/ChartSettingsAdvanced.tem }, options); Common.Views.AdvancedSettingsWindow.prototype.initialize.call(this, this.options); + this.spinners = []; + this._originalProps = this.options.chartProps; + this.slideSize = this.options.slideSize; this._changedProps = null; }, @@ -74,6 +79,125 @@ define([ 'text!presentationeditor/main/app/template/ChartSettingsAdvanced.tem var me = this; + // Placement + + this.spnWidth = new Common.UI.MetricSpinner({ + el: $('#chart-advanced-spin-width'), + step: .1, + width: 100, + defaultUnit : "cm", + value: '3 cm', + maxValue: 55.88, + minValue: 0 + }); + this.spnWidth.on('change', _.bind(function(field){ + if (this.btnRatio.pressed) { + var w = field.getNumberValue(); + var h = w/this._nRatio; + if (h>this.sizeMax.height) { + h = this.sizeMax.height; + w = h * this._nRatio; + this.spnWidth.setValue(w, true); + } + this.spnHeight.setValue(h, true); + } + if (this._changedProps) { + this._changedProps.put_Width(Common.Utils.Metric.fnRecalcToMM(field.getNumberValue())); + this._changedProps.put_Height(Common.Utils.Metric.fnRecalcToMM(this.spnHeight.getNumberValue())); + } + }, this)); + this.spinners.push(this.spnWidth); + + this.spnHeight = new Common.UI.MetricSpinner({ + el: $('#chart-advanced-spin-height'), + step: .1, + width: 100, + defaultUnit : "cm", + value: '3 cm', + maxValue: 55.88, + minValue: 0 + }); + this.spnHeight.on('change', _.bind(function(field, newValue, oldValue, eOpts){ + var h = field.getNumberValue(), w = null; + if (this.btnRatio.pressed) { + w = h * this._nRatio; + if (w>this.sizeMax.width) { + w = this.sizeMax.width; + h = w/this._nRatio; + this.spnHeight.setValue(h, true); + } + this.spnWidth.setValue(w, true); + } + if (this._changedProps) { + this._changedProps.put_Height(Common.Utils.Metric.fnRecalcToMM(field.getNumberValue())); + this._changedProps.put_Width(Common.Utils.Metric.fnRecalcToMM(this.spnWidth.getNumberValue())); + } + }, this)); + this.spinners.push(this.spnHeight); + + this.btnRatio = new Common.UI.Button({ + parentEl: $('#chart-advanced-button-ratio'), + cls: 'btn-toolbar', + iconCls: 'toolbar__icon advanced-btn-ratio', + style: 'margin-bottom: 1px;', + enableToggle: true, + hint: this.textKeepRatio + }); + this.btnRatio.on('click', _.bind(function(btn, e) { + if (btn.pressed && this.spnHeight.getNumberValue()>0) { + this._nRatio = this.spnWidth.getNumberValue()/this.spnHeight.getNumberValue(); + } + if (this._changedProps) { + this._changedProps.asc_putLockAspect(btn.pressed); + } + }, this)); + + this.spnX = new Common.UI.MetricSpinner({ + el: $('#chart-advanced-spin-x'), + step: .1, + width: 85, + defaultUnit : "cm", + defaultValue : 0, + value: '0 cm', + maxValue: 55.87, + minValue: -55.87 + }); + this.spinners.push(this.spnX); + + this.spnY = new Common.UI.MetricSpinner({ + el: $('#chart-advanced-spin-y'), + step: .1, + width: 85, + defaultUnit : "cm", + defaultValue : 0, + value: '0 cm', + maxValue: 55.87, + minValue: -55.87 + }); + this.spinners.push(this.spnY); + + this.cmbFromX = new Common.UI.ComboBox({ + el: $('#chart-advanced-combo-from-x'), + cls: 'input-group-nr', + style: "width: 100px;", + menuStyle: 'min-width: 100px;', + data: [ + { value: 'left', displayValue: this.textTopLeftCorner }, + { value: 'center', displayValue: this.textCenter } + ] + }); + + this.cmbFromY = new Common.UI.ComboBox({ + el: $('#chart-advanced-combo-from-y'), + cls: 'input-group-nr', + style: "width: 100px;", + menuStyle: 'min-width: 100px;', + data: [ + { value: 'left', displayValue: this.textTopLeftCorner }, + { value: 'center', displayValue: this.textCenter } + ] + }); + // Alt Text this.inputAltTitle = new Common.UI.InputField({ @@ -97,6 +221,7 @@ define([ 'text!presentationeditor/main/app/template/ChartSettingsAdvanced.tem }, afterRender: function() { + this.updateMetricUnit(); this._setDefaults(this._originalProps); if (this.storageName) { var value = Common.localStorage.getItem(this.storageName); @@ -125,6 +250,28 @@ define([ 'text!presentationeditor/main/app/template/ChartSettingsAdvanced.tem _setDefaults: function(props) { if (props ){ + this.spnWidth.setMaxValue(this.sizeMax.width); + this.spnHeight.setMaxValue(this.sizeMax.height); + this.spnWidth.setValue(Common.Utils.Metric.fnRecalcFromMM(props.get_Width()).toFixed(2), true); + this.spnHeight.setValue(Common.Utils.Metric.fnRecalcFromMM(props.get_Height()).toFixed(2), true); + + var value = props.asc_getLockAspect(); + this.btnRatio.toggle(value); + if (props.get_Height()>0) + this._nRatio = props.get_Width()/props.get_Height(); + + this.cmbFromX.setValue('left'); + this.cmbFromY.setValue('left'); + + /*if (props.get_Position()) { + var Position = {X: props.get_Position().get_X(), Y: props.get_Position().get_Y()}; + this.spnX.setValue((Position.X !== null && Position.X !== undefined) ? Common.Utils.Metric.fnRecalcFromMM(Position.X) : '', true); + this.spnY.setValue((Position.Y !== null && Position.Y !== undefined) ? Common.Utils.Metric.fnRecalcFromMM(Position.Y) : '', true); + } else {*/ + this.spnX.setValue('', true); + this.spnY.setValue('', true); + /*}*/ + var value = props.asc_getTitle(); this.inputAltTitle.setValue(value ? value : ''); @@ -136,6 +283,23 @@ define([ 'text!presentationeditor/main/app/template/ChartSettingsAdvanced.tem }, getSettings: function() { + /*var Position = new Asc.CPosition(); + if (this.spnX.getValue() !== '') { + var x = Common.Utils.Metric.fnRecalcToMM(this.spnX.getNumberValue()); + if (this.cmbFromX.getValue() === 'center') { + x = (this.slideSize.width/36000)/2 + x; + } + Position.put_X(x); + } + if (this.spnY.getValue() !== '') { + var y = Common.Utils.Metric.fnRecalcToMM(this.spnY.getNumberValue()); + if (this.cmbFromY.getValue() === 'center') { + y = (this.slideSize.height/36000)/2 + y; + } + Position.put_Y(y); + } + this._changedProps.put_Position(Position);*/ + if (this.isAltTitleChanged) this._changedProps.asc_putTitle(this.inputAltTitle.getValue()); @@ -145,11 +309,36 @@ define([ 'text!presentationeditor/main/app/template/ChartSettingsAdvanced.tem return { chartProps: this._changedProps} ; }, + updateMetricUnit: function() { + if (this.spinners) { + for (var i=0; i Date: Mon, 31 Jan 2022 00:54:36 +0300 Subject: [PATCH 14/43] [all] in app vesion added build number --- build/Gruntfile.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/build/Gruntfile.js b/build/Gruntfile.js index 2d6b3dbde..3bb5c3639 100644 --- a/build/Gruntfile.js +++ b/build/Gruntfile.js @@ -354,7 +354,7 @@ module.exports = function(grunt) { overwrite: true, replacements: [{ from: /\{\{PRODUCT_VERSION\}\}/g, - to: packageFile.version + to: `${packageFile.version}.${packageFile.build}` }] }, prepareHelp: { From a0843eb24081c6f095b39350b9228c8f1c84c9eb Mon Sep 17 00:00:00 2001 From: ShimaginAndrey Date: Mon, 31 Jan 2022 11:10:05 +0300 Subject: [PATCH 15/43] [SSE] Correct icon in dark-theme --- apps/spreadsheeteditor/mobile/src/less/icons-material.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/spreadsheeteditor/mobile/src/less/icons-material.less b/apps/spreadsheeteditor/mobile/src/less/icons-material.less index 5de264f68..8a2d5b1dd 100644 --- a/apps/spreadsheeteditor/mobile/src/less/icons-material.less +++ b/apps/spreadsheeteditor/mobile/src/less/icons-material.less @@ -394,7 +394,7 @@ &.icon-plus { width: 22px; height: 22px; - .encoded-svg-mask('', @toolbar-icons); + .encoded-svg-mask('', @fill-white); } } From 162e223f68d9ae2843b744901909335b433adda5 Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Mon, 31 Jan 2022 17:38:57 +0300 Subject: [PATCH 16/43] [PE] Fix placement settings in advanced settings --- .../template/ChartSettingsAdvanced.template | 1 - .../template/ImageSettingsAdvanced.template | 1 - .../main/app/view/ChartSettingsAdvanced.js | 22 +++++++++-------- .../main/app/view/ShapeSettingsAdvanced.js | 24 +++++++++---------- .../main/app/view/TableSettingsAdvanced.js | 11 +++++---- 5 files changed, 30 insertions(+), 29 deletions(-) diff --git a/apps/presentationeditor/main/app/template/ChartSettingsAdvanced.template b/apps/presentationeditor/main/app/template/ChartSettingsAdvanced.template index 19fce891c..a4988f40d 100644 --- a/apps/presentationeditor/main/app/template/ChartSettingsAdvanced.template +++ b/apps/presentationeditor/main/app/template/ChartSettingsAdvanced.template @@ -21,7 +21,6 @@
    -
    diff --git a/apps/presentationeditor/main/app/template/ImageSettingsAdvanced.template b/apps/presentationeditor/main/app/template/ImageSettingsAdvanced.template index f30583634..af45d6434 100644 --- a/apps/presentationeditor/main/app/template/ImageSettingsAdvanced.template +++ b/apps/presentationeditor/main/app/template/ImageSettingsAdvanced.template @@ -24,7 +24,6 @@
    -
    diff --git a/apps/presentationeditor/main/app/view/ChartSettingsAdvanced.js b/apps/presentationeditor/main/app/view/ChartSettingsAdvanced.js index 4064fba12..3b2f2b48f 100644 --- a/apps/presentationeditor/main/app/view/ChartSettingsAdvanced.js +++ b/apps/presentationeditor/main/app/view/ChartSettingsAdvanced.js @@ -252,25 +252,27 @@ define([ 'text!presentationeditor/main/app/template/ChartSettingsAdvanced.tem if (props ){ this.spnWidth.setMaxValue(this.sizeMax.width); this.spnHeight.setMaxValue(this.sizeMax.height); - this.spnWidth.setValue(Common.Utils.Metric.fnRecalcFromMM(props.get_Width()).toFixed(2), true); - this.spnHeight.setValue(Common.Utils.Metric.fnRecalcFromMM(props.get_Height()).toFixed(2), true); + + this.spnWidth.setValue(Common.Utils.Metric.fnRecalcFromMM(props.asc_getWidth()).toFixed(2), true); + this.spnHeight.setValue(Common.Utils.Metric.fnRecalcFromMM(props.asc_getHeight()).toFixed(2), true); + + if (props.asc_getHeight()>0) + this._nRatio = props.asc_getWidth()/props.asc_getHeight(); var value = props.asc_getLockAspect(); this.btnRatio.toggle(value); - if (props.get_Height()>0) - this._nRatio = props.get_Width()/props.get_Height(); this.cmbFromX.setValue('left'); this.cmbFromY.setValue('left'); - /*if (props.get_Position()) { - var Position = {X: props.get_Position().get_X(), Y: props.get_Position().get_Y()}; + if (props.asc_getPosition()) { + var Position = {X: props.asc_getPosition().get_X(), Y: props.asc_getPosition().get_Y()}; this.spnX.setValue((Position.X !== null && Position.X !== undefined) ? Common.Utils.Metric.fnRecalcFromMM(Position.X) : '', true); this.spnY.setValue((Position.Y !== null && Position.Y !== undefined) ? Common.Utils.Metric.fnRecalcFromMM(Position.Y) : '', true); - } else {*/ + } else { this.spnX.setValue('', true); this.spnY.setValue('', true); - /*}*/ + } var value = props.asc_getTitle(); this.inputAltTitle.setValue(value ? value : ''); @@ -283,7 +285,7 @@ define([ 'text!presentationeditor/main/app/template/ChartSettingsAdvanced.tem }, getSettings: function() { - /*var Position = new Asc.CPosition(); + var Position = new Asc.CPosition(); if (this.spnX.getValue() !== '') { var x = Common.Utils.Metric.fnRecalcToMM(this.spnX.getNumberValue()); if (this.cmbFromX.getValue() === 'center') { @@ -298,7 +300,7 @@ define([ 'text!presentationeditor/main/app/template/ChartSettingsAdvanced.tem } Position.put_Y(y); } - this._changedProps.put_Position(Position);*/ + this._changedProps.asc_putPosition(Position); if (this.isAltTitleChanged) this._changedProps.asc_putTitle(this.inputAltTitle.getValue()); diff --git a/apps/presentationeditor/main/app/view/ShapeSettingsAdvanced.js b/apps/presentationeditor/main/app/view/ShapeSettingsAdvanced.js index e52475887..128a8a1e9 100644 --- a/apps/presentationeditor/main/app/view/ShapeSettingsAdvanced.js +++ b/apps/presentationeditor/main/app/view/ShapeSettingsAdvanced.js @@ -625,11 +625,11 @@ define([ 'text!presentationeditor/main/app/template/ShapeSettingsAdvanced.tem this.radioFit.setDisabled(true); } - this.spnWidth.setValue(Common.Utils.Metric.fnRecalcFromMM(props.get_Width()).toFixed(2), true); - this.spnHeight.setValue(Common.Utils.Metric.fnRecalcFromMM(props.get_Height()).toFixed(2), true); + this.spnWidth.setValue(Common.Utils.Metric.fnRecalcFromMM(props.asc_getWidth()).toFixed(2), true); + this.spnHeight.setValue(Common.Utils.Metric.fnRecalcFromMM(props.asc_getHeight()).toFixed(2), true); - if (props.get_Height()>0) - this._nRatio = props.get_Width()/props.get_Height(); + if (props.asc_getHeight()>0) + this._nRatio = props.asc_getWidth()/props.asc_getHeight(); var value = props.asc_getLockAspect(); this.btnRatio.toggle(value); @@ -637,14 +637,14 @@ define([ 'text!presentationeditor/main/app/template/ShapeSettingsAdvanced.tem this.cmbFromX.setValue('left'); this.cmbFromY.setValue('left'); - /*if (props.get_Position()) { - var Position = {X: props.get_Position().get_X(), Y: props.get_Position().get_Y()}; + if (props.asc_getPosition()) { + var Position = {X: props.asc_getPosition().get_X(), Y: props.asc_getPosition().get_Y()}; this.spnX.setValue((Position.X !== null && Position.X !== undefined) ? Common.Utils.Metric.fnRecalcFromMM(Position.X) : '', true); this.spnY.setValue((Position.Y !== null && Position.Y !== undefined) ? Common.Utils.Metric.fnRecalcFromMM(Position.Y) : '', true); - } else {*/ - this.spnX.setValue('', true); - this.spnY.setValue('', true); - /*}*/ + } else { + this.spnX.setValue('', true); + this.spnY.setValue('', true); + } this._setShapeDefaults(props); @@ -702,7 +702,7 @@ define([ 'text!presentationeditor/main/app/template/ShapeSettingsAdvanced.tem }, getSettings: function() { - /*var Position = new Asc.CPosition(); + var Position = new Asc.CPosition(); if (this.spnX.getValue() !== '') { var x = Common.Utils.Metric.fnRecalcToMM(this.spnX.getNumberValue()); if (this.cmbFromX.getValue() === 'center') { @@ -717,7 +717,7 @@ define([ 'text!presentationeditor/main/app/template/ShapeSettingsAdvanced.tem } Position.put_Y(y); } - this._changedProps.put_Position(Position);*/ + this._changedProps.asc_putPosition(Position); if (this.isAltTitleChanged) this._changedProps.asc_putTitle(this.inputAltTitle.getValue()); diff --git a/apps/presentationeditor/main/app/view/TableSettingsAdvanced.js b/apps/presentationeditor/main/app/view/TableSettingsAdvanced.js index 16c754ec2..2df4ed43a 100644 --- a/apps/presentationeditor/main/app/view/TableSettingsAdvanced.js +++ b/apps/presentationeditor/main/app/view/TableSettingsAdvanced.js @@ -50,7 +50,7 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem contentWidth: 280, height: 385, storageName: 'pe-table-settings-adv-category', - sizeMax: {width: 142.24, height: 142.24}, + sizeMax: {width: 55.88, height: 55.88}, }, initialize : function(options) { @@ -103,7 +103,7 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem width: 100, defaultUnit : "cm", value: '3 cm', - maxValue: 142.24, + maxValue: 55.88, minValue: 0 }); this.spnWidth.on('change', _.bind(function(field){ @@ -126,7 +126,7 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem width: 100, defaultUnit : "cm", value: '3 cm', - maxValue: 142.24, + maxValue: 55.88, minValue: 0 }); this.spnHeight.on('change', _.bind(function(field, newValue, oldValue, eOpts){ @@ -466,7 +466,7 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem this._changedProps.put_FrameHeight(Common.Utils.Metric.fnRecalcToMM(this.spnHeight.getNumberValue())); if (this.spnWidth.getValue()!=='') this._changedProps.put_FrameWidth(Common.Utils.Metric.fnRecalcToMM(this.spnWidth.getNumberValue())); - //properties.asc_putLockAspect(this.btnRatio.pressed); + this._changedProps.put_FrameLockAspect(this.btnRatio.pressed); if (this.spnX.getValue() !== '') { var x = Common.Utils.Metric.fnRecalcToMM(this.spnX.getNumberValue()); @@ -502,7 +502,8 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem this.spnWidth.setValue(Common.Utils.Metric.fnRecalcFromMM(props.get_FrameWidth()).toFixed(2), true); this.spnHeight.setValue(Common.Utils.Metric.fnRecalcFromMM(props.get_FrameHeight()).toFixed(2), true); - this.btnRatio.toggle(false); // to do + var value = props.get_FrameLockAspect(); + this.btnRatio.toggle(value); if (props.get_FrameHeight()>0) this._nRatio = props.get_FrameWidth()/props.get_FrameHeight(); From 32f018a950bc897ead3de23c0f9b15bd74edefb7 Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Wed, 2 Feb 2022 00:34:38 +0300 Subject: [PATCH 17/43] [PE] Fix placement settings in advanced settings (2) --- .../template/ChartSettingsAdvanced.template | 6 ++-- .../template/ImageSettingsAdvanced.template | 2 +- .../template/ShapeSettingsAdvanced.template | 6 ++-- .../template/TableSettingsAdvanced.template | 6 ++-- .../main/app/view/ChartSettingsAdvanced.js | 24 ++++++++++------ .../main/app/view/ImageSettingsAdvanced.js | 14 ++++++---- .../main/app/view/ShapeSettingsAdvanced.js | 20 +++++++------ .../main/app/view/TableSettingsAdvanced.js | 28 +++++++++++-------- 8 files changed, 61 insertions(+), 45 deletions(-) diff --git a/apps/presentationeditor/main/app/template/ChartSettingsAdvanced.template b/apps/presentationeditor/main/app/template/ChartSettingsAdvanced.template index a4988f40d..44037f331 100644 --- a/apps/presentationeditor/main/app/template/ChartSettingsAdvanced.template +++ b/apps/presentationeditor/main/app/template/ChartSettingsAdvanced.template @@ -7,14 +7,14 @@ - - @@ -29,7 +29,7 @@ - diff --git a/apps/presentationeditor/main/app/template/ImageSettingsAdvanced.template b/apps/presentationeditor/main/app/template/ImageSettingsAdvanced.template index af45d6434..bd32ccc50 100644 --- a/apps/presentationeditor/main/app/template/ImageSettingsAdvanced.template +++ b/apps/presentationeditor/main/app/template/ImageSettingsAdvanced.template @@ -32,7 +32,7 @@ - diff --git a/apps/presentationeditor/main/app/template/ShapeSettingsAdvanced.template b/apps/presentationeditor/main/app/template/ShapeSettingsAdvanced.template index 0900539cd..d8da572f2 100644 --- a/apps/presentationeditor/main/app/template/ShapeSettingsAdvanced.template +++ b/apps/presentationeditor/main/app/template/ShapeSettingsAdvanced.template @@ -7,14 +7,14 @@ - - @@ -30,7 +30,7 @@ - diff --git a/apps/presentationeditor/main/app/template/TableSettingsAdvanced.template b/apps/presentationeditor/main/app/template/TableSettingsAdvanced.template index bd404ed5d..ce2911922 100644 --- a/apps/presentationeditor/main/app/template/TableSettingsAdvanced.template +++ b/apps/presentationeditor/main/app/template/TableSettingsAdvanced.template @@ -7,14 +7,14 @@ - - @@ -30,7 +30,7 @@ - diff --git a/apps/presentationeditor/main/app/view/ChartSettingsAdvanced.js b/apps/presentationeditor/main/app/view/ChartSettingsAdvanced.js index 3b2f2b48f..fdf71e4f1 100644 --- a/apps/presentationeditor/main/app/view/ChartSettingsAdvanced.js +++ b/apps/presentationeditor/main/app/view/ChartSettingsAdvanced.js @@ -84,7 +84,7 @@ define([ 'text!presentationeditor/main/app/template/ChartSettingsAdvanced.tem this.spnWidth = new Common.UI.MetricSpinner({ el: $('#chart-advanced-spin-width'), step: .1, - width: 100, + width: 85, defaultUnit : "cm", value: '3 cm', maxValue: 55.88, @@ -111,7 +111,7 @@ define([ 'text!presentationeditor/main/app/template/ChartSettingsAdvanced.tem this.spnHeight = new Common.UI.MetricSpinner({ el: $('#chart-advanced-spin-height'), step: .1, - width: 100, + width: 85, defaultUnit : "cm", value: '3 cm', maxValue: 55.88, @@ -179,23 +179,25 @@ define([ 'text!presentationeditor/main/app/template/ChartSettingsAdvanced.tem this.cmbFromX = new Common.UI.ComboBox({ el: $('#chart-advanced-combo-from-x'), cls: 'input-group-nr', - style: "width: 100px;", - menuStyle: 'min-width: 100px;', + style: "width: 115px;", + menuStyle: 'min-width: 115px;', data: [ { value: 'left', displayValue: this.textTopLeftCorner }, { value: 'center', displayValue: this.textCenter } - ] + ], + editable: false }); this.cmbFromY = new Common.UI.ComboBox({ el: $('#chart-advanced-combo-from-y'), cls: 'input-group-nr', - style: "width: 100px;", - menuStyle: 'min-width: 100px;', + style: "width: 115px;", + menuStyle: 'min-width: 115px;', data: [ { value: 'left', displayValue: this.textTopLeftCorner }, { value: 'center', displayValue: this.textCenter } - ] + ], + editable: false }); // Alt Text @@ -231,7 +233,8 @@ define([ 'text!presentationeditor/main/app/template/ChartSettingsAdvanced.tem getFocusedComponents: function() { return [ - this.inputAltTitle, this.textareaAltDescription // 0 tab + this.spnWidth, this.spnHeight, this.spnX, this.cmbFromX, this.spnY, this.cmbFromY, // 0 tab + this.inputAltTitle, this.textareaAltDescription // 1 tab ]; }, @@ -242,6 +245,9 @@ define([ 'text!presentationeditor/main/app/template/ChartSettingsAdvanced.tem setTimeout(function(){ switch (index) { case 0: + me.spnWidth.focus(); + break; + case 1: me.inputAltTitle.focus(); break; } diff --git a/apps/presentationeditor/main/app/view/ImageSettingsAdvanced.js b/apps/presentationeditor/main/app/view/ImageSettingsAdvanced.js index 9bebcb84b..cccaa9eba 100644 --- a/apps/presentationeditor/main/app/view/ImageSettingsAdvanced.js +++ b/apps/presentationeditor/main/app/view/ImageSettingsAdvanced.js @@ -182,23 +182,25 @@ define([ 'text!presentationeditor/main/app/template/ImageSettingsAdvanced.tem this.cmbFromX = new Common.UI.ComboBox({ el: $('#image-advanced-combo-from-x'), cls: 'input-group-nr', - style: "width: 100px;", - menuStyle: 'min-width: 100px;', + style: "width: 115px;", + menuStyle: 'min-width: 115px;', data: [ { value: 'left', displayValue: this.textTopLeftCorner }, { value: 'center', displayValue: this.textCenter } - ] + ], + editable: false }); this.cmbFromY = new Common.UI.ComboBox({ el: $('#image-advanced-combo-from-y'), cls: 'input-group-nr', - style: "width: 100px;", - menuStyle: 'min-width: 100px;', + style: "width: 115px;", + menuStyle: 'min-width: 115px;', data: [ { value: 'left', displayValue: this.textTopLeftCorner }, { value: 'center', displayValue: this.textCenter } - ] + ], + editable: false }); // Rotation diff --git a/apps/presentationeditor/main/app/view/ShapeSettingsAdvanced.js b/apps/presentationeditor/main/app/view/ShapeSettingsAdvanced.js index 128a8a1e9..c8db5180d 100644 --- a/apps/presentationeditor/main/app/view/ShapeSettingsAdvanced.js +++ b/apps/presentationeditor/main/app/view/ShapeSettingsAdvanced.js @@ -92,7 +92,7 @@ define([ 'text!presentationeditor/main/app/template/ShapeSettingsAdvanced.tem this.spnWidth = new Common.UI.MetricSpinner({ el: $('#shape-advanced-spin-width'), step: .1, - width: 100, + width: 85, defaultUnit : "cm", value: '3 cm', maxValue: 55.88, @@ -119,7 +119,7 @@ define([ 'text!presentationeditor/main/app/template/ShapeSettingsAdvanced.tem this.spnHeight = new Common.UI.MetricSpinner({ el: $('#shape-advanced-spin-height'), step: .1, - width: 100, + width: 85, defaultUnit : "cm", value: '3 cm', maxValue: 55.88, @@ -187,23 +187,25 @@ define([ 'text!presentationeditor/main/app/template/ShapeSettingsAdvanced.tem this.cmbFromX = new Common.UI.ComboBox({ el: $('#shape-advanced-combo-from-x'), cls: 'input-group-nr', - style: "width: 100px;", - menuStyle: 'min-width: 100px;', + style: "width: 115px;", + menuStyle: 'min-width: 115px;', data: [ { value: 'left', displayValue: this.textTopLeftCorner }, { value: 'center', displayValue: this.textCenter } - ] + ], + editable: false }); this.cmbFromY = new Common.UI.ComboBox({ el: $('#shape-advanced-combo-from-y'), cls: 'input-group-nr', - style: "width: 100px;", - menuStyle: 'min-width: 100px;', + style: "width: 115px;", + menuStyle: 'min-width: 115px;', data: [ { value: 'left', displayValue: this.textTopLeftCorner }, { value: 'center', displayValue: this.textCenter } - ] + ], + editable: false }); // Margins @@ -568,7 +570,7 @@ define([ 'text!presentationeditor/main/app/template/ShapeSettingsAdvanced.tem getFocusedComponents: function() { return [ - this.spnWidth, this.spnHeight, // 0 tab + this.spnWidth, this.spnHeight, this.spnX, this.cmbFromX, this.spnY, this.cmbFromY, // 0 tab this.spnAngle, this.chFlipHor, this.chFlipVert, // 1 tab this.cmbCapType, this.cmbJoinType, // 2 tab this.radioNofit, this.radioShrink, this.radioFit, this.spnMarginTop, this.spnMarginLeft, this.spnMarginBottom, this.spnMarginRight, // 3 tab diff --git a/apps/presentationeditor/main/app/view/TableSettingsAdvanced.js b/apps/presentationeditor/main/app/view/TableSettingsAdvanced.js index 2df4ed43a..6a14c31ed 100644 --- a/apps/presentationeditor/main/app/view/TableSettingsAdvanced.js +++ b/apps/presentationeditor/main/app/view/TableSettingsAdvanced.js @@ -100,7 +100,7 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem this.spnWidth = new Common.UI.MetricSpinner({ el: $('#tableadv-spin-width'), step: .1, - width: 100, + width: 85, defaultUnit : "cm", value: '3 cm', maxValue: 55.88, @@ -123,7 +123,7 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem this.spnHeight = new Common.UI.MetricSpinner({ el: $('#tableadv-spin-height'), step: .1, - width: 100, + width: 85, defaultUnit : "cm", value: '3 cm', maxValue: 55.88, @@ -184,23 +184,25 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem this.cmbFromX = new Common.UI.ComboBox({ el: $('#tableadv-combo-from-x'), cls: 'input-group-nr', - style: "width: 100px;", - menuStyle: 'min-width: 100px;', + style: "width: 115px;", + menuStyle: 'min-width: 115px;', data: [ { value: 'left', displayValue: this.textTopLeftCorner }, { value: 'center', displayValue: this.textCenter } - ] + ], + editable: false }); this.cmbFromY = new Common.UI.ComboBox({ el: $('#tableadv-combo-from-y'), cls: 'input-group-nr', - style: "width: 100px;", - menuStyle: 'min-width: 100px;', + style: "width: 115px;", + menuStyle: 'min-width: 115px;', data: [ { value: 'left', displayValue: this.textTopLeftCorner }, { value: 'center', displayValue: this.textCenter } - ] + ], + editable: false }); this._marginsChange = function(field, newValue, oldValue, eOpts, source, property){ @@ -427,9 +429,10 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem getFocusedComponents: function() { return [ + this.spnWidth, this.spnHeight, this.spnX, this.cmbFromX, this.spnY, this.cmbFromY, // 0 tab this.chCellMargins, this.spnMarginTop, this.spnMarginLeft, this.spnMarginBottom, this.spnMarginRight, - this.spnTableMarginTop, this.spnTableMarginLeft, this.spnTableMarginBottom, this.spnTableMarginRight, // 0 tab - this.inputAltTitle, this.textareaAltDescription // 1 tab + this.spnTableMarginTop, this.spnTableMarginLeft, this.spnTableMarginBottom, this.spnTableMarginRight, // 1 tab + this.inputAltTitle, this.textareaAltDescription // 2 tab ]; }, @@ -440,12 +443,15 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem setTimeout(function(){ switch (index) { case 0: + me.spnWidth.focus(); + break; + case 1: if (!me.spnMarginTop.isDisabled()) me.spnMarginTop.focus(); else me.spnTableMarginTop.focus(); break; - case 1: + case 2: me.inputAltTitle.focus(); break; } From 981391fe090471856a56fcc959dd08afaf6ace9f Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Wed, 2 Feb 2022 11:37:18 +0300 Subject: [PATCH 18/43] [PE] Fix focus of position settings in advanced settings --- .../main/app/view/ChartSettingsAdvanced.js | 6 ++++-- .../main/app/view/ImageSettingsAdvanced.js | 6 ++++-- .../main/app/view/ShapeSettingsAdvanced.js | 6 ++++-- .../main/app/view/TableSettingsAdvanced.js | 6 ++++-- 4 files changed, 16 insertions(+), 8 deletions(-) diff --git a/apps/presentationeditor/main/app/view/ChartSettingsAdvanced.js b/apps/presentationeditor/main/app/view/ChartSettingsAdvanced.js index fdf71e4f1..ae949444a 100644 --- a/apps/presentationeditor/main/app/view/ChartSettingsAdvanced.js +++ b/apps/presentationeditor/main/app/view/ChartSettingsAdvanced.js @@ -185,7 +185,8 @@ define([ 'text!presentationeditor/main/app/template/ChartSettingsAdvanced.tem { value: 'left', displayValue: this.textTopLeftCorner }, { value: 'center', displayValue: this.textCenter } ], - editable: false + editable: false, + takeFocusOnClose: true }); this.cmbFromY = new Common.UI.ComboBox({ @@ -197,7 +198,8 @@ define([ 'text!presentationeditor/main/app/template/ChartSettingsAdvanced.tem { value: 'left', displayValue: this.textTopLeftCorner }, { value: 'center', displayValue: this.textCenter } ], - editable: false + editable: false, + takeFocusOnClose: true }); // Alt Text diff --git a/apps/presentationeditor/main/app/view/ImageSettingsAdvanced.js b/apps/presentationeditor/main/app/view/ImageSettingsAdvanced.js index cccaa9eba..cebc6d8e4 100644 --- a/apps/presentationeditor/main/app/view/ImageSettingsAdvanced.js +++ b/apps/presentationeditor/main/app/view/ImageSettingsAdvanced.js @@ -188,7 +188,8 @@ define([ 'text!presentationeditor/main/app/template/ImageSettingsAdvanced.tem { value: 'left', displayValue: this.textTopLeftCorner }, { value: 'center', displayValue: this.textCenter } ], - editable: false + editable: false, + takeFocusOnClose: true }); this.cmbFromY = new Common.UI.ComboBox({ @@ -200,7 +201,8 @@ define([ 'text!presentationeditor/main/app/template/ImageSettingsAdvanced.tem { value: 'left', displayValue: this.textTopLeftCorner }, { value: 'center', displayValue: this.textCenter } ], - editable: false + editable: false, + takeFocusOnClose: true }); // Rotation diff --git a/apps/presentationeditor/main/app/view/ShapeSettingsAdvanced.js b/apps/presentationeditor/main/app/view/ShapeSettingsAdvanced.js index c8db5180d..e26025801 100644 --- a/apps/presentationeditor/main/app/view/ShapeSettingsAdvanced.js +++ b/apps/presentationeditor/main/app/view/ShapeSettingsAdvanced.js @@ -193,7 +193,8 @@ define([ 'text!presentationeditor/main/app/template/ShapeSettingsAdvanced.tem { value: 'left', displayValue: this.textTopLeftCorner }, { value: 'center', displayValue: this.textCenter } ], - editable: false + editable: false, + takeFocusOnClose: true }); this.cmbFromY = new Common.UI.ComboBox({ @@ -205,7 +206,8 @@ define([ 'text!presentationeditor/main/app/template/ShapeSettingsAdvanced.tem { value: 'left', displayValue: this.textTopLeftCorner }, { value: 'center', displayValue: this.textCenter } ], - editable: false + editable: false, + takeFocusOnClose: true }); // Margins diff --git a/apps/presentationeditor/main/app/view/TableSettingsAdvanced.js b/apps/presentationeditor/main/app/view/TableSettingsAdvanced.js index 6a14c31ed..32240d336 100644 --- a/apps/presentationeditor/main/app/view/TableSettingsAdvanced.js +++ b/apps/presentationeditor/main/app/view/TableSettingsAdvanced.js @@ -190,7 +190,8 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem { value: 'left', displayValue: this.textTopLeftCorner }, { value: 'center', displayValue: this.textCenter } ], - editable: false + editable: false, + takeFocusOnClose: true }); this.cmbFromY = new Common.UI.ComboBox({ @@ -202,7 +203,8 @@ define([ 'text!presentationeditor/main/app/template/TableSettingsAdvanced.tem { value: 'left', displayValue: this.textTopLeftCorner }, { value: 'center', displayValue: this.textCenter } ], - editable: false + editable: false, + takeFocusOnClose: true }); this._marginsChange = function(field, newValue, oldValue, eOpts, source, property){ From 8117d3532d35f38dfd657a783ee072d97aaa64a4 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Wed, 2 Feb 2022 17:46:48 +0300 Subject: [PATCH 19/43] [PE] Bug 55292 --- .../main/app/controller/RightMenu.js | 30 +++++++++++++++---- .../main/app/view/RightMenu.js | 2 +- 2 files changed, 25 insertions(+), 7 deletions(-) diff --git a/apps/presentationeditor/main/app/controller/RightMenu.js b/apps/presentationeditor/main/app/controller/RightMenu.js index 9d0d737db..b8b6e747f 100644 --- a/apps/presentationeditor/main/app/controller/RightMenu.js +++ b/apps/presentationeditor/main/app/controller/RightMenu.js @@ -56,6 +56,7 @@ define([ this.editMode = true; this._state = {no_slides: undefined}; this._initSettings = true; + this._priorityArr = []; this.addListeners({ 'RightMenu': { @@ -95,8 +96,15 @@ define([ this.editMode = mode.isEdit; }, - onRightMenuClick: function(menu, type, minimized) { + onRightMenuClick: function(menu, type, minimized, event) { if (!minimized && this.editMode) { + if (event) { // user click event + var idx = this._priorityArr.indexOf(type); + if (idx>=0) + this._priorityArr.splice(idx, 1); + this._priorityArr.unshift(type); + } + var panel = this._settings[type].panel; var props = this._settings[type].props; if (props && panel) @@ -191,6 +199,16 @@ define([ if (!this.rightmenu.minimizedMode || open) { var active; + if (priorityactive<0 && this._priorityArr.length>0) { + for (i=0; i-1) active = priorityactive; else if (currentactive>=0) active = currentactive; else if (lastactive>=0) active = lastactive; @@ -249,23 +267,23 @@ define([ }, onInsertTable: function() { - this._settings[Common.Utils.documentSettingsType.Table].needShow = true; + // this._settings[Common.Utils.documentSettingsType.Table].needShow = true; }, onInsertImage: function() { - this._settings[Common.Utils.documentSettingsType.Image].needShow = true; + // this._settings[Common.Utils.documentSettingsType.Image].needShow = true; }, onInsertChart: function() { - this._settings[Common.Utils.documentSettingsType.Chart].needShow = true; + // this._settings[Common.Utils.documentSettingsType.Chart].needShow = true; }, onInsertShape: function() { - this._settings[Common.Utils.documentSettingsType.Shape].needShow = true; + // this._settings[Common.Utils.documentSettingsType.Shape].needShow = true; }, onInsertTextArt: function() { - this._settings[Common.Utils.documentSettingsType.TextArt].needShow = true; + // this._settings[Common.Utils.documentSettingsType.TextArt].needShow = true; }, UpdateThemeColors: function() { diff --git a/apps/presentationeditor/main/app/view/RightMenu.js b/apps/presentationeditor/main/app/view/RightMenu.js index c38c81328..83289892e 100644 --- a/apps/presentationeditor/main/app/view/RightMenu.js +++ b/apps/presentationeditor/main/app/view/RightMenu.js @@ -258,7 +258,7 @@ define([ Common.localStorage.setItem("pe-hide-right-settings", 1); } - this.fireEvent('rightmenuclick', [this, btn.options.asctype, this.minimizedMode]); + this.fireEvent('rightmenuclick', [this, btn.options.asctype, this.minimizedMode, e]); }, SetActivePane: function(type, open) { From a149fb57c3fb6668c0928861ce806fd132453bd7 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Thu, 3 Feb 2022 00:00:46 +0300 Subject: [PATCH 20/43] [DE] Add share and users buttons to header --- apps/common/main/lib/view/Header.js | 128 ++++++++++-------- .../main/resources/img/header/buttons.svg | 3 + apps/common/main/resources/less/header.less | 41 +++++- apps/common/main/resources/less/toolbar.less | 10 +- .../main/app/controller/Main.js | 1 + apps/documenteditor/main/locale/en.json | 2 +- 6 files changed, 127 insertions(+), 58 deletions(-) diff --git a/apps/common/main/lib/view/Header.js b/apps/common/main/lib/view/Header.js index 61d10d6fa..2874ab047 100644 --- a/apps/common/main/lib/view/Header.js +++ b/apps/common/main/lib/view/Header.js @@ -52,7 +52,7 @@ define([ Common.Views.Header = Backbone.View.extend(_.extend(function(){ var storeUsers, appConfig; - var $userList, $panelUsers, $btnUsers; + var $userList, $panelUsers, $btnUsers, $panelShare, $btnShare; var _readonlyRights = false; var templateUserItem = @@ -84,17 +84,25 @@ define([ '' + '
    ' + // '' + - ''+ + '
    ' + + '
    ' + '
    ' + '
    ' + '' + diff --git a/apps/common/main/resources/less/header.less b/apps/common/main/resources/less/header.less index 9fd5b2c81..e9336b5ab 100644 --- a/apps/common/main/resources/less/header.less +++ b/apps/common/main/resources/less/header.less @@ -167,7 +167,7 @@ display: flex; align-items: center; cursor: pointer; - padding: 0 10px 0 8px; + padding: 0 8px 0 6px; height: 100%; .inner-box-icon { From 7541dac366cb4e67d0ffa6089096f02989829020 Mon Sep 17 00:00:00 2001 From: OVSharova Date: Thu, 3 Feb 2022 15:06:09 +0300 Subject: [PATCH 26/43] Fix bug --- apps/common/main/lib/view/Header.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/apps/common/main/lib/view/Header.js b/apps/common/main/lib/view/Header.js index 61d10d6fa..6c34087a1 100644 --- a/apps/common/main/lib/view/Header.js +++ b/apps/common/main/lib/view/Header.js @@ -74,7 +74,8 @@ define([ var templateRightBox = '
    ' + '
    ' + // '' + - '
    ' + '
    ' + '
    ' + @@ -708,7 +709,7 @@ define([ }, setCanRename: function (rename) { - // rename = true; //for merge rename = false; ?? + //rename = true; //comment out for merge var me = this; me.options.canRename = rename; From 175cdd9fb5b6889ad44dc7e28b561b79670b37e4 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Thu, 3 Feb 2022 16:00:45 +0300 Subject: [PATCH 27/43] [DE] Remove settings button from header --- apps/common/main/lib/view/Header.js | 31 --- .../main/app/controller/LeftMenu.js | 1 - .../main/app/controller/Statusbar.js | 3 - .../main/app/controller/Toolbar.js | 1 - .../main/app/controller/ViewTab.js | 19 +- .../main/app/controller/Viewport.js | 193 ------------------ 6 files changed, 13 insertions(+), 235 deletions(-) diff --git a/apps/common/main/lib/view/Header.js b/apps/common/main/lib/view/Header.js index a2e79aa39..fe594e90a 100644 --- a/apps/common/main/lib/view/Header.js +++ b/apps/common/main/lib/view/Header.js @@ -109,7 +109,6 @@ define([ '
    ' + '
    ' + '
    ' + - '
    ' + '
    ' + '
    ' + '
    ' + @@ -337,9 +336,6 @@ define([ }); } } - - if ( me.btnOptions ) - me.btnOptions.updateHint(me.tipViewSettings); } function onFocusDocName(e){ @@ -397,9 +393,6 @@ define([ } } - function onContentThemeChangedToDark(isdark) { - } - return { options: { branding: {}, @@ -441,17 +434,6 @@ define([ reset : onResetUsers }); - me.btnOptions = new Common.UI.Button({ - cls: 'btn-header no-caret', - iconCls: 'toolbar__icon icon--inverse btn-ic-options', - menu: true, - dataHint: '0', - dataHintDirection: 'bottom', - dataHintOffset: 'big' - }); - - me.mnuZoom = {options: {value: 100}}; - me.btnFavorite = new Common.UI.Button({ id: 'btn-favorite', cls: 'btn-header', @@ -466,7 +448,6 @@ define([ 'app:face': function(mode) {Common.Utils.asyncCall(onAppShowed, me, mode);} }); Common.NotificationCenter.on('collaboration:sharingdeny', onLostEditRights); - Common.NotificationCenter.on('contenttheme:dark', onContentThemeChangedToDark.bind(this)); Common.NotificationCenter.on('uitheme:changed', this.changeLogo.bind(this)); }, @@ -547,7 +528,6 @@ define([ if ( config.canEdit && config.canRequestEditRights ) this.btnEdit = createTitleButton('toolbar__icon icon--inverse btn-edit', $html.findById('#slot-hbtn-edit'), undefined, 'bottom', 'big'); } - me.btnOptions.render($html.find('#slot-btn-options')); if (!config.isEdit || config.customization && !!config.customization.compactHeader) { if (config.user.guest && config.canRenameAnonymous) @@ -816,22 +796,11 @@ define([ switch ( alias ) { case 'undo': _lockButton(me.btnUndo); break; case 'redo': _lockButton(me.btnRedo); break; - case 'opts': _lockButton(me.btnOptions); break; default: break; } } }, - fakeMenuItem: function() { - return { - conf: {checked: false, disabled: false}, - setChecked: function (val) { this.conf.checked = val; }, - isChecked: function () { return this.conf.checked; }, - setDisabled: function (val) { this.conf.disabled = val; }, - isDisabled: function () { return this.conf.disabled; } - }; - }, - textBack: 'Go to Documents', txtRename: 'Rename', txtAccessRights: 'Change access rights', diff --git a/apps/documenteditor/main/app/controller/LeftMenu.js b/apps/documenteditor/main/app/controller/LeftMenu.js index 270215f25..b8f6ab3ae 100644 --- a/apps/documenteditor/main/app/controller/LeftMenu.js +++ b/apps/documenteditor/main/app/controller/LeftMenu.js @@ -64,7 +64,6 @@ define([ 'hide': _.bind(this.onHideChat, this) }, 'Common.Views.Header': { - 'file:settings': _.bind(this.clickToolbarSettings,this), 'history:show': function () { if ( !this.leftMenu.panelHistory.isVisible() ) this.clickMenuFileItem('header', 'history'); diff --git a/apps/documenteditor/main/app/controller/Statusbar.js b/apps/documenteditor/main/app/controller/Statusbar.js index 2418b501d..27ad9b07e 100644 --- a/apps/documenteditor/main/app/controller/Statusbar.js +++ b/apps/documenteditor/main/app/controller/Statusbar.js @@ -64,9 +64,6 @@ define([ Common.NotificationCenter.trigger('edit:complete', this.statusbar); }.bind(this) }, - 'Common.Views.Header': { - 'statusbar:hide': _.bind(me.onChangeCompactView, me) - }, 'ViewTab': { 'statusbar:hide': _.bind(me.onChangeCompactView, me) } diff --git a/apps/documenteditor/main/app/controller/Toolbar.js b/apps/documenteditor/main/app/controller/Toolbar.js index fc305476b..39315b884 100644 --- a/apps/documenteditor/main/app/controller/Toolbar.js +++ b/apps/documenteditor/main/app/controller/Toolbar.js @@ -125,7 +125,6 @@ define([ 'menu:show': this.onFileMenu.bind(this, 'show') }, 'Common.Views.Header': { - 'toolbar:setcompact': this.onChangeCompactView.bind(this), 'print': function (opts) { var _main = this.getApplication().getController('Main'); _main.onPrint(); diff --git a/apps/documenteditor/main/app/controller/ViewTab.js b/apps/documenteditor/main/app/controller/ViewTab.js index c525fc980..7f138783d 100644 --- a/apps/documenteditor/main/app/controller/ViewTab.js +++ b/apps/documenteditor/main/app/controller/ViewTab.js @@ -88,6 +88,19 @@ define([ groupRulers.remove(); this.view.cmpEl.find('.separator-rulers').remove(); } + + if (!mode.isEdit) { // if view tab will be visible in view/restricted-editing mode + this.view.chToolbar.hide(); + var me = this; + Common.NotificationCenter.on('tab:visible', _.bind(function(action, visible){ + if ((action=='plugins' || action=='review' || action=='forms') && visible) { + me.view.chToolbar.show(); + } + }, this)); + + this.view.chRulers.hide(); + } + this.addListeners({ 'ViewTab': { 'zoom:topage': _.bind(this.onBtnZoomTo, this, 'topage'), @@ -104,11 +117,6 @@ define([ 'view:hide': _.bind(function (statusbar, state) { this.view.chStatusbar.setValue(!state, true); }, this) - }, - 'Common.Views.Header': { - 'rulers:hide': _.bind(function (isChecked) { - this.view.chRulers.setValue(!isChecked, true); - }, this) } }); }, @@ -229,7 +237,6 @@ define([ Common.localStorage.setBool('de-hidden-rulers', !checked); Common.Utils.InternalSettings.set("de-hidden-rulers", !checked); this.api.asc_SetViewRulers(checked); - this.view.fireEvent('rulers:hide', [!checked]); Common.NotificationCenter.trigger('layout:changed', 'rulers'); Common.NotificationCenter.trigger('edit:complete', this.view); }, diff --git a/apps/documenteditor/main/app/controller/Viewport.js b/apps/documenteditor/main/app/controller/Viewport.js index d8258c6e8..c1fae7b2b 100644 --- a/apps/documenteditor/main/app/controller/Viewport.js +++ b/apps/documenteditor/main/app/controller/Viewport.js @@ -80,7 +80,6 @@ define([ toolbar.setExtra('left', me.header.getPanel('left', config)); }, 'view:compact' : function (toolbar, state) { - me.header.mnuitemCompactToolbar.setChecked(state, true); me.viewport.vlayout.getItem('toolbar').height = state ? Common.Utils.InternalSettings.get('toolbar-height-compact') : Common.Utils.InternalSettings.get('toolbar-height-normal'); }, @@ -105,21 +104,12 @@ define([ if ( me.header.btnSave ) me.header.btnSave.setDisabled(state); } - }, - 'ViewTab': { - 'rulers:hide': function (state) { - me.header.mnuitemHideRulers.setChecked(state, true); - }, - 'statusbar:hide': function (view, state) { - me.header.mnuitemHideStatusBar.setChecked(state, true); - } } }); }, setApi: function(api) { this.api = api; - this.api.asc_registerCallback('asc_onZoomChange', this.onApiZoomChange.bind(this)); this.api.asc_registerCallback('asc_onCoAuthoringDisconnect',this.onApiCoAuthoringDisconnect.bind(this)); Common.NotificationCenter.on('api:disconnect', this.onApiCoAuthoringDisconnect.bind(this)); }, @@ -156,13 +146,8 @@ define([ this.boxSdk = $('#editor_sdk'); this.boxSdk.css('border-left', 'none'); - this.header.mnuitemFitPage = this.header.fakeMenuItem(); - this.header.mnuitemFitWidth = this.header.fakeMenuItem(); - Common.NotificationCenter.on('app:face', this.onAppShowed.bind(this)); Common.NotificationCenter.on('app:ready', this.onAppReady.bind(this)); - Common.NotificationCenter.on('uitheme:changed', this.onThemeChanged.bind(this)); - Common.NotificationCenter.on('contenttheme:dark', this.onContentThemeChangedToDark.bind(this)); }, onAppShowed: function (config) { @@ -213,131 +198,6 @@ define([ }, onAppReady: function (config) { - var me = this; - if ( me.header.btnOptions ) { - var compactview = !(config.isEdit || config.isRestrictedEdit && config.canFillForms && config.isFormCreator); - if ( config.isEdit || config.isRestrictedEdit && config.canFillForms && config.isFormCreator) { - if ( Common.localStorage.itemExists("de-compact-toolbar") ) { - compactview = Common.localStorage.getBool("de-compact-toolbar"); - } else - if ( config.customization && config.customization.compactToolbar ) - compactview = true; - } - - me.header.mnuitemCompactToolbar = new Common.UI.MenuItem({ - caption: me.header.textCompactView, - checked: compactview, - checkable: true, - value: 'toolbar' - }); - if (!config.isEdit) { - me.header.mnuitemCompactToolbar.hide(); - Common.NotificationCenter.on('tab:visible', _.bind(function(action, visible){ - if ((action=='plugins' || action=='review' || action=='forms') && visible) { - me.header.mnuitemCompactToolbar.show(); - } - }, this)); - } - - me.header.mnuitemHideStatusBar = new Common.UI.MenuItem({ - caption: me.header.textHideStatusBar, - checked: Common.localStorage.getBool("de-hidden-status"), - checkable: true, - value: 'statusbar' - }); - - if ( config.canBrandingExt && config.customization && config.customization.statusBar === false || !Common.UI.LayoutManager.isElementVisible('statusBar')) - me.header.mnuitemHideStatusBar.hide(); - - me.header.mnuitemHideRulers = new Common.UI.MenuItem({ - caption: me.header.textHideLines, - checked: Common.Utils.InternalSettings.get("de-hidden-rulers"), - checkable: true, - value: 'rulers' - }); - if (!config.isEdit) - me.header.mnuitemHideRulers.hide(); - - me.header.menuItemsDarkMode = new Common.UI.MenuItem({ - caption: me.txtDarkMode, - checkable: true, - checked: Common.UI.Themes.isContentThemeDark(), - value: 'mode:dark' - }); - - me.header.mnuitemFitPage = new Common.UI.MenuItem({ - caption: me.textFitPage, - checkable: true, - checked: me.header.mnuitemFitPage.isChecked(), - value: 'zoom:page' - }); - - me.header.mnuitemFitWidth = new Common.UI.MenuItem({ - caption: me.textFitWidth, - checkable: true, - checked: me.header.mnuitemFitWidth.isChecked(), - value: 'zoom:width' - }); - - me.header.mnuZoom = new Common.UI.MenuItem({ - template: _.template([ - '' - ].join('')), - stopPropagation: true, - value: me.header.mnuZoom.options.value - }); - - me.header.btnOptions.setMenu(new Common.UI.Menu({ - cls: 'pull-right', - style: 'min-width: 180px;', - items: [ - me.header.mnuitemCompactToolbar, - me.header.mnuitemHideStatusBar, - me.header.mnuitemHideRulers, - {caption:'--'}, - me.header.menuItemsDarkMode, - {caption:'--'}, - me.header.mnuitemFitPage, - me.header.mnuitemFitWidth, - me.header.mnuZoom, - {caption:'--'}, - new Common.UI.MenuItem({ - caption: me.header.textAdvSettings, - value: 'advanced' - }) - ] - }) - ); - - var _on_btn_zoom = function (btn) { - btn == 'up' ? me.api.zoomIn() : me.api.zoomOut(); - Common.NotificationCenter.trigger('edit:complete', me.header); - }; - - (new Common.UI.Button({ - el : $('#hdr-menu-zoom-out', me.header.mnuZoom.$el), - cls : 'btn-toolbar' - })).on('click', _on_btn_zoom.bind(me, 'down')); - - (new Common.UI.Button({ - el : $('#hdr-menu-zoom-in', me.header.mnuZoom.$el), - cls : 'btn-toolbar' - })).on('click', _on_btn_zoom.bind(me, 'up')); - - me.header.btnOptions.menu.on('item:click', me.onOptionsItemClick.bind(this)); - if ( !Common.UI.Themes.isDarkTheme() ) { - me.header.menuItemsDarkMode.hide(); - me.header.menuItemsDarkMode.$el.prev('.divider').hide(); - } - } }, onLayoutChanged: function(area) { @@ -377,22 +237,6 @@ define([ this.api.Resize(); }, - onThemeChanged: function (id) { - if ( this.header.menuItemsDarkMode ) { - var current_dark = Common.UI.Themes.isDarkTheme(); - var menuItem = this.header.menuItemsDarkMode; - menuItem.setVisible(current_dark); - menuItem.$el.prev('.divider')[current_dark ? 'show' : 'hide'](); - - menuItem.setChecked(Common.UI.Themes.isContentThemeDark()); - } - }, - - onContentThemeChangedToDark: function (isdark) { - if ( this.header.menuItemsDarkMode ) - this.header.menuItemsDarkMode.setChecked(isdark, true); - }, - onWindowResize: function(e) { this.onLayoutChanged('window'); Common.NotificationCenter.trigger('window:resize'); @@ -404,46 +248,9 @@ define([ me.header.lockHeaderBtns( 'undo', _need_disable ); me.header.lockHeaderBtns( 'redo', _need_disable ); - me.header.lockHeaderBtns( 'opts', _need_disable ); me.header.lockHeaderBtns( 'users', _need_disable ); }, - onApiZoomChange: function(percent, type) { - this.header.mnuitemFitPage.setChecked(type == 2, true); - this.header.mnuitemFitWidth.setChecked(type == 1, true); - this.header.mnuZoom.options.value = percent; - - if ( this.header.mnuZoom.$el ) - $('.menu-zoom label.zoom', this.header.mnuZoom.$el).html(percent + '%'); - }, - - onOptionsItemClick: function (menu, item, e) { - var me = this; - - switch ( item.value ) { - case 'toolbar': me.header.fireEvent('toolbar:setcompact', [menu, item.isChecked()]); break; - case 'statusbar': me.header.fireEvent('statusbar:hide', [item, item.isChecked()]); break; - case 'rulers': - Common.localStorage.setBool('de-hidden-rulers', item.isChecked()); - Common.Utils.InternalSettings.set("de-hidden-rulers", item.isChecked()); - me.api.asc_SetViewRulers(!item.isChecked()); - Common.NotificationCenter.trigger('layout:changed', 'rulers'); - Common.NotificationCenter.trigger('edit:complete', me.header); - me.header.fireEvent('rulers:hide', [item.isChecked()]); - break; - case 'zoom:page': - item.isChecked() ? me.api.zoomFitToPage() : me.api.zoomCustomMode(); - Common.NotificationCenter.trigger('edit:complete', me.header); - break; - case 'zoom:width': - item.isChecked() ? me.api.zoomFitToWidth() : me.api.zoomCustomMode(); - Common.NotificationCenter.trigger('edit:complete', me.header); - break; - case 'advanced': me.header.fireEvent('file:settings', me.header); break; - case 'mode:dark': Common.UI.Themes.toggleContentTheme(); break; - } - }, - onApiCoAuthoringDisconnect: function(enableDownload) { if (this.header) { if (this.header.btnDownload && !enableDownload) From 06a0f34d492bfc7be587c3a532ab22fade1df82c Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Thu, 3 Feb 2022 23:14:59 +0300 Subject: [PATCH 28/43] [Header] Change icon for current user --- apps/common/main/lib/view/Header.js | 59 ++++++++----------- apps/common/main/resources/less/header.less | 64 +++++++++++++++------ 2 files changed, 73 insertions(+), 50 deletions(-) diff --git a/apps/common/main/lib/view/Header.js b/apps/common/main/lib/view/Header.js index fe594e90a..b63e57312 100644 --- a/apps/common/main/lib/view/Header.js +++ b/apps/common/main/lib/view/Header.js @@ -111,7 +111,7 @@ define([ '
    ' + '
    ' + '
    ' + - '
    ' + + '
    ' + '' + @@ -135,7 +135,12 @@ define([ // '' + '' + '
    ' + - '' + + '
    ' + + '
    ' + + '' + + '
    ' + '
    '; function onResetUsers(collection, opts) { @@ -281,12 +286,7 @@ define([ if (appConfig.user.guest && appConfig.canRenameAnonymous) { - if (me.labelUserName) { - me.labelUserName.addClass('clickable'); - me.labelUserName.on('click', function (e) { - Common.NotificationCenter.trigger('user:rename'); - }); - } else if (me.btnUserName) { + if (me.btnUserName) { me.btnUserName.on('click', function (e) { Common.NotificationCenter.trigger('user:rename'); }); @@ -531,7 +531,7 @@ define([ if (!config.isEdit || config.customization && !!config.customization.compactHeader) { if (config.user.guest && config.canRenameAnonymous) - me.btnUserName = createTitleButton('toolbar__icon icon--inverse btn-user', $html.findById('#slot-btn-user-name'), undefined, 'bottom', 'big' ); + me.btnUserName = createTitleButton('toolbar__icon icon--inverse btn-user', $html.findById('.slot-btn-user-name'), undefined, 'bottom', 'big' ); else { me.elUserName = $html.find('.btn-current-user'); me.elUserName.removeClass('hidden'); @@ -557,7 +557,12 @@ define([ me.labelDocName.val( me.documentCaption ); me.options.wopi && me.labelDocName.attr('maxlength', me.options.wopi.FileNameMaxLength); - me.labelUserName = $('> #title-user-name', $html); + if (config.user.guest && config.canRenameAnonymous) + me.btnUserName = createTitleButton('toolbar__icon icon--inverse btn-user', $html.findById('.slot-btn-user-name'), undefined, 'bottom', 'big' ); + else { + me.elUserName = $html.find('.btn-current-user'); + me.elUserName.removeClass('hidden'); + } me.setUserName(me.options.userName); if ( config.canPrint && config.isEdit ) { @@ -727,21 +732,15 @@ define([ }, setUserName: function(name) { - if ( !!this.labelUserName ) { - if ( !!name ) { - this.labelUserName.text(name).show(); - } else this.labelUserName.hide(); - } else { - this.options.userName = name; - if ( this.btnUserName ) { - this.btnUserName.updateHint(name); - } else if (this.elUserName) { - this.elUserName.tooltip({ - title: Common.Utils.String.htmlEncode(name), - placement: 'cursor', - html: true - }); - } + this.options.userName = name; + if ( this.btnUserName ) { + this.btnUserName.updateHint(name); + } else if (this.elUserName) { + this.elUserName.tooltip({ + title: Common.Utils.String.htmlEncode(name), + placement: 'cursor', + html: true + }); } return this; @@ -767,15 +766,7 @@ define([ $btnShare.removeClass('disabled').removeAttr('disabled'); } } else if ( alias == 'rename-user' ) { - if (me.labelUserName) { - if ( lock ) { - me.labelUserName.removeClass('clickable'); - me.labelUserName.addClass('disabled'); - } else { - me.labelUserName.addClass('clickable'); - me.labelUserName.removeClass('disabled'); - } - } else if (me.btnUserName) { + if (me.btnUserName) { me.btnUserName.setDisabled(lock); } } else { diff --git a/apps/common/main/resources/less/header.less b/apps/common/main/resources/less/header.less index e9336b5ab..149c00021 100644 --- a/apps/common/main/resources/less/header.less +++ b/apps/common/main/resources/less/header.less @@ -194,6 +194,24 @@ overflow: hidden; } + &:not(:disabled) { + .inner-box-icon, .caption { + opacity: @header-component-normal-icon-opacity; + } + } + + &:active, &.active { + .inner-box-icon, .caption { + opacity: @header-component-active-icon-opacity; + } + } + + &:hover:not(:disabled) { + .inner-box-icon, .caption { + opacity: @header-component-hover-icon-opacity; + } + } + &.disabled { opacity: @component-disabled-opacity; pointer-events: none; @@ -226,6 +244,24 @@ margin: 2px 0 0 2px; } + &:not(:disabled) { + .icon, .caption { + opacity: @header-component-normal-icon-opacity; + } + } + + &:active, &.active { + .icon, .caption { + opacity: @header-component-active-icon-opacity; + } + } + + &:hover:not(:disabled) { + .icon, .caption { + opacity: @header-component-hover-icon-opacity; + } + } + &.disabled { opacity: @component-disabled-opacity; pointer-events: none; @@ -262,6 +298,18 @@ height:calc(~"28px/1.5"); } } + + &:not(:disabled) .icon { + opacity: @header-component-normal-icon-opacity; + } + + &:active, &.active .icon { + opacity: @header-component-active-icon-opacity; + } + + &:hover:not(:disabled) .icon { + opacity: @header-component-hover-icon-opacity; + } } .cousers-menu { @@ -478,22 +526,6 @@ border: 0 none; cursor: default; } - #title-user-name { - white-space: pre; - text-overflow: ellipsis; - overflow: hidden; - text-align: right; - font-size: 11px; - width: 200px; - height: 100%; - padding: 0 12px; - line-height: @height-title; - pointer-events: none; - &.clickable { - cursor: pointer; - pointer-events: auto; - } - } .lr-separator { flex-grow: 1; From b9d2c851d1aa8a4c7a0ef4ca316e64114ceb6e62 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Fri, 4 Feb 2022 12:13:13 +0300 Subject: [PATCH 29/43] [Header] Show user's initials --- apps/common/main/lib/view/Header.js | 59 +++++++++++++++---- .../resources/less/colors-table-classic.less | 2 +- .../resources/less/colors-table-dark.less | 2 +- .../resources/less/colors-table-ie-fix.less | 2 +- apps/common/main/resources/less/header.less | 49 +++++++-------- apps/common/main/resources/less/toolbar.less | 12 ++-- 6 files changed, 77 insertions(+), 49 deletions(-) diff --git a/apps/common/main/lib/view/Header.js b/apps/common/main/lib/view/Header.js index b63e57312..dec3c7c7d 100644 --- a/apps/common/main/lib/view/Header.js +++ b/apps/common/main/lib/view/Header.js @@ -52,7 +52,7 @@ define([ Common.Views.Header = Backbone.View.extend(_.extend(function(){ var storeUsers, appConfig; - var $userList, $panelUsers, $btnUsers, $panelShare, $btnShare; + var $userList, $panelUsers, $btnUsers, $panelShare, $btnShare, $btnUserName; var _readonlyRights = false; var templateUserItem = @@ -111,9 +111,12 @@ define([ '
    ' + '
    ' + '
    ' + - '
    ' + + // '
    ' + + '' + '' + '
    ' + '
    ' + @@ -136,9 +139,12 @@ define([ '' + '
    ' + '
    ' + - '
    ' + + // '
    ' + + '' + '' + '
    ' + ''; @@ -530,12 +536,21 @@ define([ } if (!config.isEdit || config.customization && !!config.customization.compactHeader) { - if (config.user.guest && config.canRenameAnonymous) - me.btnUserName = createTitleButton('toolbar__icon icon--inverse btn-user', $html.findById('.slot-btn-user-name'), undefined, 'bottom', 'big' ); - else { + if (config.user.guest && config.canRenameAnonymous) { + me.btnUserName = new Common.UI.Button({ + el: $html.findById('.slot-btn-user-name'), + cls: 'btn-header', + dataHint:'0', + dataHintDirection: 'bottom', + dataHintOffset: 'big', + visible: true + }); + me.btnUserName.cmpEl.removeClass('hidden'); + } else { me.elUserName = $html.find('.btn-current-user'); me.elUserName.removeClass('hidden'); } + $btnUserName = $html.find('.color-user-name'); me.setUserName(me.options.userName); } @@ -557,12 +572,22 @@ define([ me.labelDocName.val( me.documentCaption ); me.options.wopi && me.labelDocName.attr('maxlength', me.options.wopi.FileNameMaxLength); - if (config.user.guest && config.canRenameAnonymous) - me.btnUserName = createTitleButton('toolbar__icon icon--inverse btn-user', $html.findById('.slot-btn-user-name'), undefined, 'bottom', 'big' ); + if (config.user.guest && config.canRenameAnonymous) { + me.btnUserName = new Common.UI.Button({ + el: $html.findById('.slot-btn-user-name'), + cls: 'btn-header', + dataHint:'0', + dataHintDirection: 'bottom', + dataHintOffset: 'big', + visible: true + }); + me.btnUserName.cmpEl.removeClass('hidden'); + } else { me.elUserName = $html.find('.btn-current-user'); me.elUserName.removeClass('hidden'); } + $btnUserName = $html.find('.color-user-name'); me.setUserName(me.options.userName); if ( config.canPrint && config.isEdit ) { @@ -742,7 +767,7 @@ define([ html: true }); } - + $btnUserName && $btnUserName.text(this.getInitials(name)); return this; }, @@ -792,6 +817,18 @@ define([ } }, + getInitials: function(name) { + var fio = name.split(' '); + var initials = fio[0].substring(0, 1).toUpperCase(); + for (var i = fio.length-1; i>0; i--) { + if (fio[i][0]!=='(' && fio[i][0]!==')') { + initials += fio[i].substring(0, 1).toUpperCase(); + break; + } + } + return initials; + }, + textBack: 'Go to Documents', txtRename: 'Rename', txtAccessRights: 'Change access rights', diff --git a/apps/common/main/resources/less/colors-table-classic.less b/apps/common/main/resources/less/colors-table-classic.less index 6463ae64d..88570b4ed 100644 --- a/apps/common/main/resources/less/colors-table-classic.less +++ b/apps/common/main/resources/less/colors-table-classic.less @@ -55,7 +55,7 @@ --icon-normal: #444; --icon-normal-pressed: #fff; --icon-inverse: #444; - --icon-toolbar-header: fade(#fff, 80%); + --icon-toolbar-header: #fff; --icon-notification-badge: #000; --icon-contrast-popover: #fff; --icon-success: #5b9f27; diff --git a/apps/common/main/resources/less/colors-table-dark.less b/apps/common/main/resources/less/colors-table-dark.less index 9dc4c765b..b05024c0b 100644 --- a/apps/common/main/resources/less/colors-table-dark.less +++ b/apps/common/main/resources/less/colors-table-dark.less @@ -56,7 +56,7 @@ --icon-normal: fade(#fff, 80%); --icon-normal-pressed: fade(#fff, 80%); --icon-inverse: #444; - --icon-toolbar-header: fade(#fff, 80%); + --icon-toolbar-header: #fff; --icon-notification-badge: #000; --icon-contrast-popover: #fff; --icon-success: #090; diff --git a/apps/common/main/resources/less/colors-table-ie-fix.less b/apps/common/main/resources/less/colors-table-ie-fix.less index d524f52e1..e03a66ada 100644 --- a/apps/common/main/resources/less/colors-table-ie-fix.less +++ b/apps/common/main/resources/less/colors-table-ie-fix.less @@ -51,7 +51,7 @@ @icon-normal-ie: #444; @icon-normal-pressed-ie: #fff; @icon-inverse-ie: #444; -@icon-toolbar-header-ie: fade(#fff, 80%); +@icon-toolbar-header-ie: #fff; @icon-notification-badge-ie: #000; @icon-contrast-popover-ie: #fff; @icon-success-ie: #5b9f27; diff --git a/apps/common/main/resources/less/header.less b/apps/common/main/resources/less/header.less index 149c00021..f0b5150f2 100644 --- a/apps/common/main/resources/less/header.less +++ b/apps/common/main/resources/less/header.less @@ -273,45 +273,38 @@ align-items: center; height: 100%; width: 40px; - padding: 0 10px; + padding: 1px 3px; - .icon { - width: 20px; - height: 20px; - display: inline-block; - background-repeat: no-repeat; - padding: 0; - - &.icon--inverse { - background-position-x: -20px; - } - } - - svg.icon { - vertical-align: middle; - - @media - only screen and (-webkit-min-device-pixel-ratio: 1.5), - only screen and (min-resolution: 1.5dppx), - only screen and (min-resolution: 144dpi) { - width:calc(~"28px/1.5"); - height:calc(~"28px/1.5"); - } - } - - &:not(:disabled) .icon { + &:not(:disabled) .color-user-name { opacity: @header-component-normal-icon-opacity; } - &:active, &.active .icon { + &:active, &.active .color-user-name { opacity: @header-component-active-icon-opacity; } - &:hover:not(:disabled) .icon { + &:hover:not(:disabled) .color-user-name { opacity: @header-component-hover-icon-opacity; } } +.btn-current-user, .btn-header { + .color-user-name { + width: 20px; + height: 20px; + border-radius: 20px; + background-color: @icon-toolbar-header-ie; + background-color: @icon-toolbar-header; + color: @header-background-color-ie; + color: @header-background-color; + font-size: 10px; + line-height: 20px; + overflow: hidden; + margin: 0 6px; + text-align: center; + } +} + .cousers-menu { position: fixed; top: @height-tabs - 8px; diff --git a/apps/common/main/resources/less/toolbar.less b/apps/common/main/resources/less/toolbar.less index 79e8a9d56..642a5faa9 100644 --- a/apps/common/main/resources/less/toolbar.less +++ b/apps/common/main/resources/less/toolbar.less @@ -519,13 +519,11 @@ } .btn-current-user { - .icon--inverse { - background-position-x: 0; - } - - svg.icon { - fill: @icon-toolbar-header-ie; - fill: @icon-toolbar-header; + .color-user-name { + background-color: @text-normal-ie; + background-color: @text-normal; + color: @text-inverse-ie; + color: @text-inverse; } } From 34e0c295e1056c6f8199703c9df597e4489f24af Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Fri, 4 Feb 2022 14:51:13 +0300 Subject: [PATCH 30/43] [Header] Refactoring sharing button --- apps/common/main/lib/view/Header.js | 62 ++--- apps/common/main/resources/less/header.less | 212 ++++++++---------- apps/common/main/resources/less/toolbar.less | 2 +- .../main/app/controller/Main.js | 2 +- 4 files changed, 129 insertions(+), 149 deletions(-) diff --git a/apps/common/main/lib/view/Header.js b/apps/common/main/lib/view/Header.js index dec3c7c7d..8af141287 100644 --- a/apps/common/main/lib/view/Header.js +++ b/apps/common/main/lib/view/Header.js @@ -52,7 +52,7 @@ define([ Common.Views.Header = Backbone.View.extend(_.extend(function(){ var storeUsers, appConfig; - var $userList, $panelUsers, $btnUsers, $panelShare, $btnShare, $btnUserName; + var $userList, $panelUsers, $btnUsers, $btnUserName; var _readonlyRights = false; var templateUserItem = @@ -98,12 +98,7 @@ define([ ''+ '' + '
    ' + - '
    ' + - '
    ' + - '' + - '' + - '
    ' + - '
    '+ + '
    ' + '
    ' + '
    ' + '
    ' + @@ -194,7 +189,7 @@ define([ function onLostEditRights() { _readonlyRights = true; - $panelShare && $panelShare.hide(); + this.btnShare && this.btnShare.setVisible(false); } function onUsersClick(e) { @@ -207,10 +202,6 @@ define([ } } - function onShareClick(e) { - Common.NotificationCenter.trigger('collaboration:sharing'); - } - function onAppShowed(config) { //config.isCrypted =true; //delete fore merge! if ( this.labelDocName ) { @@ -251,6 +242,14 @@ define([ Common.NotificationCenter.trigger('markfavorite', !me.options.favorite); }); + if (me.btnShare) { + me.btnShare.on('click', function (e) { + Common.NotificationCenter.trigger('collaboration:sharing'); + }); + me.btnShare.updateHint(me.tipAccessRights); + me.btnShare.setVisible(!_readonlyRights && appConfig && (appConfig.sharingSettingsUrl && appConfig.sharingSettingsUrl.length || appConfig.canRequestSharingSettings)); + } + if ( me.logo ) me.logo.children(0).on('click', function (e) { var _url = !!me.branding && !!me.branding.logo && (me.branding.logo.url!==undefined) ? @@ -278,19 +277,9 @@ define([ html: true }); $btnUsers.on('click', onUsersClick.bind(me)); - - $btnShare.tooltip({ - title: me.tipAccessRights, - placement: 'bottom', - html: true - }); - $btnShare.on('click', onShareClick.bind(me)); - - $panelShare[(!_readonlyRights && appConfig && (appConfig.sharingSettingsUrl && appConfig.sharingSettingsUrl.length || appConfig.canRequestSharingSettings)) ? 'show' : 'hide'](); $panelUsers[(editingUsers > 1 && appConfig && (appConfig.isEdit || appConfig.isRestrictedEdit)) ? 'show' : 'hide'](); } - if (appConfig.user.guest && appConfig.canRenameAnonymous) { if (me.btnUserName) { me.btnUserName.on('click', function (e) { @@ -451,9 +440,9 @@ define([ Common.NotificationCenter.on({ 'app:ready': function(mode) {Common.Utils.asyncCall(onAppReady, me, mode);}, - 'app:face': function(mode) {Common.Utils.asyncCall(onAppShowed, me, mode);} + 'app:face': function(mode) {Common.Utils.asyncCall(onAppShowed, me, mode);}, + 'collaboration:sharingdeny': function(mode) {Common.Utils.asyncCall(onLostEditRights, me, mode);} }); - Common.NotificationCenter.on('collaboration:sharingdeny', onLostEditRights); Common.NotificationCenter.on('uitheme:changed', this.changeLogo.bind(this)); }, @@ -554,14 +543,24 @@ define([ me.setUserName(me.options.userName); } + if (!_readonlyRights && config && (config.sharingSettingsUrl && config.sharingSettingsUrl.length || config.canRequestSharingSettings)) { + me.btnShare = new Common.UI.Button({ + cls: 'btn-header btn-header-share', + iconCls: 'toolbar__icon icon--inverse btn-users-share', + caption: me.textShare, + dataHint: '0', + dataHintDirection: 'bottom', + dataHintOffset: 'big' + }); + me.btnShare.render($html.find('#slot-btn-share')); + } else { + $html.find('#slot-btn-share').hide(); + } + $userList = $html.find('.cousers-list'); $panelUsers = $html.find('.box-cousers'); $btnUsers = $panelUsers.find('> .btn-users'); - $panelShare = $html.find('.box-share'); - $btnShare = $panelShare.find('> .btn-users-share'); - $panelUsers.hide(); - $panelShare.hide(); return $html; } else if ( role == 'title' ) { @@ -777,7 +776,7 @@ define([ else if (type == 'users') return $panelUsers; else if (type == 'share') - return $panelShare; + return this.btnShare; }, lockHeaderBtns: function (alias, lock) { @@ -785,10 +784,11 @@ define([ if ( alias == 'users' ) { if ( lock ) { $btnUsers.addClass('disabled').attr('disabled', 'disabled'); - $btnShare.addClass('disabled').attr('disabled', 'disabled'); } else { $btnUsers.removeClass('disabled').removeAttr('disabled'); - $btnShare.removeClass('disabled').removeAttr('disabled'); + } + if (me.btnShare) { + me.btnShare.setDisabled(lock); } } else if ( alias == 'rename-user' ) { if (me.btnUserName) { diff --git a/apps/common/main/resources/less/header.less b/apps/common/main/resources/less/header.less index f0b5150f2..ea4a33a26 100644 --- a/apps/common/main/resources/less/header.less +++ b/apps/common/main/resources/less/header.less @@ -70,7 +70,6 @@ } .btn-users, - .btn-users-share, .btn-header { &:hover { &:not(.disabled):not(.icon) { @@ -163,6 +162,92 @@ margin-top: 15px; } +.hedset { + font-size: 0; + display: flex; + + .btn-group { + height: 100%; + } + +} + +.btn-header { + height: 100%; + background-color: transparent; + width: 40px; + + .icon { + width: 20px; + height: 20px; + display: inline-block; + position: relative; + + &.icon--inverse { + background-position-x: @button-header-normal-icon-offset-x-ie; + background-position-x: @button-header-normal-icon-offset-x; + } + } + + .btn& { + &:not(:disabled) .icon { + opacity: @header-component-normal-icon-opacity; + } + + &:active, &.active { + .icon.toolbar__icon { + &.icon--inverse { + background-position-x: @button-header-active-icon-offset-x-ie; + opacity: @header-component-active-icon-opacity; + } + } + } + + &:hover:not(:disabled) { + .icon { + opacity: @header-component-hover-icon-opacity; + } + } + } + + svg.icon { + vertical-align: middle; + + @media + only screen and (-webkit-min-device-pixel-ratio: 1.5), + only screen and (min-resolution: 1.5dppx), + only screen and (min-resolution: 144dpi) { + width:calc(~"28px/1.5"); + height:calc(~"28px/1.5"); + } + } + + .btn&[disabled], + &.disabled { + opacity: @component-disabled-opacity; + } + + &:hover { + &:not(.disabled) { + background-color: @highlight-header-button-hover-ie; + background-color: @highlight-header-button-hover; + } + } + + &:active { + &:not(.disabled) { + background-color: @highlight-header-button-pressed-ie; + background-color: @highlight-header-button-pressed; + } + } + + &.no-caret { + .inner-box-caret { + display: none; + } + } +} + .btn-users { display: flex; align-items: center; @@ -218,53 +303,34 @@ } } -.btn-users-share { +.btn-header-share { display: flex; align-items: center; - cursor: pointer; padding: 0 12px; - height: 100%; - - .icon { - display: inline-block; - width: 20px; - height: 20px; - background-repeat: no-repeat; - padding: 0; - - &.icon--inverse { - background-position-x: @button-header-normal-icon-offset-x-ie; - background-position-x: @button-header-normal-icon-offset-x; - } - } + width: auto; .caption { - cursor: pointer; - font-size: 11px; margin: 2px 0 0 2px; + color: @text-toolbar-header-ie; + color: @text-toolbar-header; } &:not(:disabled) { - .icon, .caption { + .caption { opacity: @header-component-normal-icon-opacity; } } - &:active, &.active { - .icon, .caption { - opacity: @header-component-active-icon-opacity; - } - } - &:hover:not(:disabled) { - .icon, .caption { + .caption { opacity: @header-component-hover-icon-opacity; } } - &.disabled { - opacity: @component-disabled-opacity; - pointer-events: none; + &:active:not(:disabled), &.active:not(:disabled) { + .caption { + opacity: @header-component-active-icon-opacity; + } } } @@ -379,92 +445,6 @@ } } -.hedset { - font-size: 0; - display: flex; - - .btn-group { - height: 100%; - } - -} - -.btn-header { - height: 100%; - background-color: transparent; - width: 40px; - - .icon { - width: 20px; - height: 20px; - display: inline-block; - position: relative; - - &.icon--inverse { - background-position-x: @button-header-normal-icon-offset-x-ie; - background-position-x: @button-header-normal-icon-offset-x; - } - } - - .btn& { - &:not(:disabled) .icon { - opacity: @header-component-normal-icon-opacity; - } - - &:active, &.active { - .icon.toolbar__icon { - &.icon--inverse { - background-position-x: @button-header-active-icon-offset-x-ie; - opacity: @header-component-active-icon-opacity; - } - } - } - - &:hover:not(:disabled) { - .icon { - opacity: @header-component-hover-icon-opacity; - } - } - } - - svg.icon { - vertical-align: middle; - - @media - only screen and (-webkit-min-device-pixel-ratio: 1.5), - only screen and (min-resolution: 1.5dppx), - only screen and (min-resolution: 144dpi) { - width:calc(~"28px/1.5"); - height:calc(~"28px/1.5"); - } - } - - .btn&[disabled], - &.disabled { - opacity: @component-disabled-opacity; - } - - &:hover { - &:not(.disabled) { - background-color: @highlight-header-button-hover-ie; - background-color: @highlight-header-button-hover; - } - } - - &:active { - &:not(.disabled) { - background-color: @highlight-header-button-pressed-ie; - background-color: @highlight-header-button-pressed; - } - } - - &.no-caret { - .inner-box-caret { - display: none; - } - } -} - #box-document-title { background-color: @header-background-color-ie; background-color: @header-background-color; diff --git a/apps/common/main/resources/less/toolbar.less b/apps/common/main/resources/less/toolbar.less index 642a5faa9..af3b549c4 100644 --- a/apps/common/main/resources/less/toolbar.less +++ b/apps/common/main/resources/less/toolbar.less @@ -461,7 +461,7 @@ } // TODO: move to appropriate module - .btn-header, .btn-users, .btn-users-share { + .btn-header, .btn-users, .btn-header-share { &:not(:active) .icon--inverse { background-position-x: 0; background-position-x: @button-small-normal-icon-offset-x; diff --git a/apps/documenteditor/main/app/controller/Main.js b/apps/documenteditor/main/app/controller/Main.js index 68dfbb907..8fddc1d40 100644 --- a/apps/documenteditor/main/app/controller/Main.js +++ b/apps/documenteditor/main/app/controller/Main.js @@ -607,7 +607,7 @@ define([ this.api.asc_coAuthoringDisconnect(); appHeader.setCanRename(false); appHeader.getButton('users') && appHeader.getButton('users').hide(); - appHeader.getButton('share') && appHeader.getButton('share').hide(); + appHeader.getButton('share') && appHeader.getButton('share').setVisible(false); this.getApplication().getController('LeftMenu').getView('LeftMenu').showHistory(); this.disableEditing(true); this._renameDialog && this._renameDialog.close(); From 86a6b68d612d47c7075f81ff6b06da2334d95e1b Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Fri, 4 Feb 2022 17:09:03 +0300 Subject: [PATCH 31/43] [Header] Refactoring style for share button --- apps/common/main/resources/less/header.less | 12 ++++++------ apps/common/main/resources/less/toolbar.less | 20 +++++++++++++------- 2 files changed, 19 insertions(+), 13 deletions(-) diff --git a/apps/common/main/resources/less/header.less b/apps/common/main/resources/less/header.less index ea4a33a26..20e714d90 100644 --- a/apps/common/main/resources/less/header.less +++ b/apps/common/main/resources/less/header.less @@ -285,18 +285,18 @@ } } - &:active, &.active { - .inner-box-icon, .caption { - opacity: @header-component-active-icon-opacity; - } - } - &:hover:not(:disabled) { .inner-box-icon, .caption { opacity: @header-component-hover-icon-opacity; } } + &:active:not(:disabled), &.active:not(:disabled) { + .inner-box-icon, .caption { + opacity: @header-component-active-icon-opacity; + } + } + &.disabled { opacity: @component-disabled-opacity; pointer-events: none; diff --git a/apps/common/main/resources/less/toolbar.less b/apps/common/main/resources/less/toolbar.less index af3b549c4..72e3f1976 100644 --- a/apps/common/main/resources/less/toolbar.less +++ b/apps/common/main/resources/less/toolbar.less @@ -462,9 +462,19 @@ // TODO: move to appropriate module .btn-header, .btn-users, .btn-header-share { - &:not(:active) .icon--inverse { - background-position-x: 0; - background-position-x: @button-small-normal-icon-offset-x; + .icon { + &.icon--inverse { + background-position-x: 0 !important; + background-position-x: @button-small-normal-icon-offset-x !important; + } + } + + &:active, &.active { + &:not(.disabled) .icon.toolbar__icon { + &.icon--inverse { + background-position-x: @button-small-active-icon-offset-x !important; + } + } } svg.icon { @@ -494,10 +504,6 @@ background-color: @highlight-button-pressed-ie; background-color: @highlight-button-pressed; - .icon--inverse { - background-position-x: @button-small-active-icon-offset-x; - } - svg.icon { fill: @icon-toolbar-header-ie; fill: @icon-toolbar-header; From 7259a3f82dd7151a1ba3d1fb8cf404e68cf2e840 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Fri, 4 Feb 2022 21:14:12 +0300 Subject: [PATCH 32/43] [Header] Fix styles for user's initials --- apps/common/main/lib/controller/Themes.js | 4 +++ apps/common/main/lib/view/Header.js | 4 +-- .../resources/less/colors-table-classic.less | 4 +++ .../resources/less/colors-table-dark.less | 4 +++ .../resources/less/colors-table-ie-fix.less | 4 +++ .../main/resources/less/colors-table.less | 4 +++ apps/common/main/resources/less/header.less | 9 ++++--- apps/common/main/resources/less/toolbar.less | 25 ++++++++++++------- .../main/resources/less/variables.less | 2 ++ 9 files changed, 45 insertions(+), 15 deletions(-) diff --git a/apps/common/main/lib/controller/Themes.js b/apps/common/main/lib/controller/Themes.js index 5133e0101..dd8cf9f45 100644 --- a/apps/common/main/lib/controller/Themes.js +++ b/apps/common/main/lib/controller/Themes.js @@ -43,6 +43,10 @@ define([ "toolbar-header-spreadsheet", "toolbar-header-presentation", + "text-toolbar-header-on-background-document", + "text-toolbar-header-on-background-spreadsheet", + "text-toolbar-header-on-background-presentation", + "background-normal", "background-toolbar", "background-toolbar-additional", diff --git a/apps/common/main/lib/view/Header.js b/apps/common/main/lib/view/Header.js index 8af141287..bd7a1ba4f 100644 --- a/apps/common/main/lib/view/Header.js +++ b/apps/common/main/lib/view/Header.js @@ -110,7 +110,7 @@ define([ '' + - '' + @@ -138,7 +138,7 @@ define([ '' + - '' + diff --git a/apps/common/main/resources/less/colors-table-classic.less b/apps/common/main/resources/less/colors-table-classic.less index 88570b4ed..610768f56 100644 --- a/apps/common/main/resources/less/colors-table-classic.less +++ b/apps/common/main/resources/less/colors-table-classic.less @@ -5,6 +5,10 @@ --toolbar-header-spreadsheet: #40865c; --toolbar-header-presentation: #aa5252; + --text-toolbar-header-on-background-document: #38567A; + --text-toolbar-header-on-background-spreadsheet: #336B49; + --text-toolbar-header-on-background-presentation: #8D4444; + --background-normal: #fff; --background-toolbar: #f1f1f1; --background-toolbar-additional: #f1f1f1; diff --git a/apps/common/main/resources/less/colors-table-dark.less b/apps/common/main/resources/less/colors-table-dark.less index b05024c0b..fa525ed83 100644 --- a/apps/common/main/resources/less/colors-table-dark.less +++ b/apps/common/main/resources/less/colors-table-dark.less @@ -5,6 +5,10 @@ --toolbar-header-spreadsheet: #2a2a2a; --toolbar-header-presentation: #2a2a2a; + --text-toolbar-header-on-background-document: #2a2a2a; + --text-toolbar-header-on-background-spreadsheet: #2a2a2a; + --text-toolbar-header-on-background-presentation: #2a2a2a; + --background-normal: #333; --background-toolbar: #404040; --background-toolbar-additional: #505050; diff --git a/apps/common/main/resources/less/colors-table-ie-fix.less b/apps/common/main/resources/less/colors-table-ie-fix.less index e03a66ada..ad67d4525 100644 --- a/apps/common/main/resources/less/colors-table-ie-fix.less +++ b/apps/common/main/resources/less/colors-table-ie-fix.less @@ -3,6 +3,10 @@ @toolbar-header-spreadsheet-ie: #40865c; @toolbar-header-presentation-ie: #aa5252; +@text-toolbar-header-on-background-document-ie: #38567A; +@text-toolbar-header-on-background-spreadsheet-ie: #336B49; +@text-toolbar-header-on-background-presentation-ie: #8D4444; + @background-normal-ie: #fff; @background-toolbar-ie: #f1f1f1; @background-toolbar-additional-ie: #f1f1f1; diff --git a/apps/common/main/resources/less/colors-table.less b/apps/common/main/resources/less/colors-table.less index 8b352170d..a4290ac8d 100644 --- a/apps/common/main/resources/less/colors-table.less +++ b/apps/common/main/resources/less/colors-table.less @@ -15,6 +15,10 @@ --toolbar-header-spreadsheet: #40865c; --toolbar-header-presentation: #aa5252; + --text-toolbar-header-on-background-document: #38567A; + --text-toolbar-header-on-background-spreadsheet: #336B49; + --text-toolbar-header-on-background-presentation: #8D4444; + --background-normal: #fff; --background-toolbar: #f7f7f7; --background-toolbar-additional: #efefef; diff --git a/apps/common/main/resources/less/header.less b/apps/common/main/resources/less/header.less index 20e714d90..a01e118a0 100644 --- a/apps/common/main/resources/less/header.less +++ b/apps/common/main/resources/less/header.less @@ -340,7 +340,10 @@ height: 100%; width: 40px; padding: 1px 3px; + border: var(--scaled-one-pixel, 1px) solid transparent; +} +.btn-current-user, .btn-header { &:not(:disabled) .color-user-name { opacity: @header-component-normal-icon-opacity; } @@ -352,17 +355,15 @@ &:hover:not(:disabled) .color-user-name { opacity: @header-component-hover-icon-opacity; } -} -.btn-current-user, .btn-header { .color-user-name { width: 20px; height: 20px; border-radius: 20px; background-color: @icon-toolbar-header-ie; background-color: @icon-toolbar-header; - color: @header-background-color-ie; - color: @header-background-color; + color: @toolbar-header-text-on-background-document-ie; + color: @toolbar-header-text-on-background-document; font-size: 10px; line-height: 20px; overflow: hidden; diff --git a/apps/common/main/resources/less/toolbar.less b/apps/common/main/resources/less/toolbar.less index 72e3f1976..40c34c3e5 100644 --- a/apps/common/main/resources/less/toolbar.less +++ b/apps/common/main/resources/less/toolbar.less @@ -461,6 +461,15 @@ } // TODO: move to appropriate module + .btn-current-user, .btn-header { + .color-user-name { + background-color: @text-normal-ie; + background-color: @text-normal; + color: @text-inverse-ie; + color: @text-inverse; + } + } + .btn-header, .btn-users, .btn-header-share { .icon { &.icon--inverse { @@ -520,16 +529,14 @@ fill: @text-normal-pressed; } } - } - } - } - .btn-current-user { - .color-user-name { - background-color: @text-normal-ie; - background-color: @text-normal; - color: @text-inverse-ie; - color: @text-inverse; + .color-user-name { + background-color: @text-normal-pressed-ie; + background-color: @text-normal-pressed; + color: @highlight-button-pressed-ie; + color: @highlight-button-pressed; + } + } } } diff --git a/apps/documenteditor/main/resources/less/variables.less b/apps/documenteditor/main/resources/less/variables.less index 4c45439f5..e31d64a73 100644 --- a/apps/documenteditor/main/resources/less/variables.less +++ b/apps/documenteditor/main/resources/less/variables.less @@ -3,6 +3,8 @@ // -------------------------------------------------- @header-background-color-ie: @toolbar-header-document-ie; @header-background-color: var(--toolbar-header-document); +@toolbar-header-text-on-background-document-ie: @text-toolbar-header-on-background-document-ie; +@toolbar-header-text-on-background-document: var(--text-toolbar-header-on-background-document); // Active color // ------------------------- From 39ecf9170bce2282de33ae5c466231bb648be119 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Fri, 4 Feb 2022 23:47:04 +0300 Subject: [PATCH 33/43] [DE] Fix header in loader --- apps/documenteditor/main/index.html | 14 ++++++++++++-- apps/documenteditor/main/index.html.deploy | 12 +++++++++++- 2 files changed, 23 insertions(+), 3 deletions(-) diff --git a/apps/documenteditor/main/index.html b/apps/documenteditor/main/index.html index c104a0ee0..8abc3f4b6 100644 --- a/apps/documenteditor/main/index.html +++ b/apps/documenteditor/main/index.html @@ -33,7 +33,7 @@ .theme-light { --background-toolbar: #f7f7f7; /*--border-toolbar: #cbcbcb;*/ - --highlight-button-hover: #ccc; + --highlight-button-hover: #e0e0e0; --highlight-header-button-hover: rgba(255,255,255,.15); --canvas-background: #eee; --loadmask-canvas-page-border: #ccc; @@ -92,6 +92,16 @@ background: var(--highlight-header-button-hover, rgba(255,255,255,.2)); } + .loadmask > .brendpanel .circle { + vertical-align: middle; + width: 20px; + height: 20px; + border-radius: 20px; + margin: 0 10px; + background: rgba(255,255,255,.2); + background: var(--highlight-header-button-hover, rgba(255,255,255,.2)); + } + .loadmask > .sktoolbar { background: #f1f1f1; background: var(--background-toolbar, #f1f1f1); @@ -258,7 +268,7 @@
    +
    +
    		+
    +
    +
    +
    		+
    +
    +
    		+
    +