From 1afb2c7abb23f6522fbd9772cb40bfd681914f2c Mon Sep 17 00:00:00 2001 From: SergeyEzhin Date: Tue, 9 Aug 2022 01:55:41 +0300 Subject: [PATCH] [DE PE SSE mobile] Fix Bug 47800 --- apps/documenteditor/mobile/locale/en.json | 8 +- .../mobile/src/view/edit/Edit.jsx | 12 +- .../mobile/src/view/edit/EditImage.jsx | 171 +++++++++++++----- .../mobile/src/view/edit/EditShape.jsx | 97 +++++----- apps/presentationeditor/mobile/locale/en.json | 7 +- .../mobile/src/view/edit/EditImage.jsx | 7 +- .../mobile/src/view/edit/EditShape.jsx | 26 +-- apps/spreadsheeteditor/mobile/locale/en.json | 7 +- .../mobile/src/view/edit/EditImage.jsx | 6 +- .../mobile/src/view/edit/EditShape.jsx | 17 +- 10 files changed, 232 insertions(+), 126 deletions(-) diff --git a/apps/documenteditor/mobile/locale/en.json b/apps/documenteditor/mobile/locale/en.json index 2aa15d6ce..0e366b522 100644 --- a/apps/documenteditor/mobile/locale/en.json +++ b/apps/documenteditor/mobile/locale/en.json @@ -322,7 +322,8 @@ "textRefreshEntireTable": "Refresh entire table", "textRefreshPageNumbersOnly": "Refresh page numbers only", "textRemoveChart": "Remove Chart", - "textRemoveImage": "Remove Image", + "del_textRemoveImage": "Remove Image", + "textDeleteImage": "Delete Image", "del_textRemoveLink": "Remove Link", "textDeleteLink": "Delete Link", "textRemoveShape": "Remove Shape", @@ -371,6 +372,8 @@ "textType": "Type", "textWe": "We", "textWrap": "Wrap", + "textTextWrapping": "Text Wrapping", + "textWrappingStyle": "Wrapping Style", "textTableOfCont": "TOC", "textPageNumbers": "Page Numbers", "textSimple": "Simple", @@ -394,7 +397,8 @@ "textStyles": "Styles", "textAmountOfLevels": "Amount of Levels", "textRecommended": "Recommended", - "textRequired": "Required" + "textRequired": "Required", + "textChangeShape": "Change Shape" }, "Error": { "convertationTimeoutText": "Conversion timeout exceeded.", diff --git a/apps/documenteditor/mobile/src/view/edit/Edit.jsx b/apps/documenteditor/mobile/src/view/edit/Edit.jsx index 6415927dc..a27b4b229 100644 --- a/apps/documenteditor/mobile/src/view/edit/Edit.jsx +++ b/apps/documenteditor/mobile/src/view/edit/Edit.jsx @@ -18,7 +18,7 @@ import EditTableContentsController from "../../controller/edit/EditTableContents import {PageTextFonts, PageTextAddFormatting, PageTextBulletsAndNumbers, PageTextLineSpacing, PageTextFontColor, PageTextCustomFontColor, PageTextHighlightColor} from "./EditText"; import {ParagraphAdvSettings, PageParagraphBackColor, PageParagraphCustomColor, PageParagraphStyle, PageCreateTextStyle, PageChangeNextParagraphStyle} from "./EditParagraph"; import {PageShapeStyleNoFill, PageShapeStyle, PageShapeCustomFillColor, PageShapeBorderColor, PageShapeCustomBorderColor, PageWrap, PageReorder, PageReplace} from "./EditShape"; -import {PageImageReorder, PageImageReplace, PageImageWrap, PageLinkSettings} from "./EditImage"; +import {PageImageReorder, PageImageReplace, PageImageWrap, PageLinkSettings, PageWrappingStyle} from "./EditImage"; import {PageTableOptions, PageTableWrap, PageTableStyle, PageTableStyleOptions, PageTableCustomFillColor, PageTableBorderColor, PageTableCustomBorderColor} from "./EditTable"; import {PageChartDesign, PageChartDesignType, PageChartDesignStyle, PageChartDesignFill, PageChartDesignBorder, PageChartCustomFillColor, PageChartBorderColor, PageChartCustomBorderColor, PageChartWrap, PageChartReorder} from "./EditChart"; import { PageEditLeaderTableContents, PageEditStylesTableContents, PageEditStructureTableContents } from './EditTableContents'; @@ -118,7 +118,8 @@ const routes = [ path: '/edit-shape-replace/', component: PageReplace, }, - //Edit image + + // Edit image { path: '/edit-image-wrap/', component: PageImageWrap, @@ -135,7 +136,12 @@ const routes = [ path: '/edit-image-link/', component: PageLinkSettings, }, - //Edit table + { + path: '/edit-image-wrapping-style/', + component: PageWrappingStyle + }, + + // Edit table { path: '/edit-table-options/', component: PageTableOptions, diff --git a/apps/documenteditor/mobile/src/view/edit/EditImage.jsx b/apps/documenteditor/mobile/src/view/edit/EditImage.jsx index 1aefaa88d..bed313844 100644 --- a/apps/documenteditor/mobile/src/view/edit/EditImage.jsx +++ b/apps/documenteditor/mobile/src/view/edit/EditImage.jsx @@ -11,7 +11,9 @@ const PageWrap = props => { const _t = t('Edit', {returnObjects: true}); const storeImageSettings = props.storeImageSettings; const imageObject = props.storeFocusObjects.imageObject; + let wrapType, align, moveText, overlap, distance; + if (imageObject) { wrapType = storeImageSettings.getWrapType(imageObject); align = storeImageSettings.getAlign(imageObject); @@ -19,15 +21,28 @@ const PageWrap = props => { overlap = storeImageSettings.getOverlap(imageObject); distance = Common.Utils.Metric.fnRecalcFromMM(storeImageSettings.getWrapDistance(imageObject)); } + const metricText = Common.Utils.Metric.getCurrentMetricName(); const [stateDistance, setDistance] = useState(distance); + const [wrappingStyle, setWrappingStyle] = useState(wrapType); + const typesWrapping = { + inline: _t.textInline, + square: _t.textSquare, + tight: _t.textTight, + through: _t.textThrough, + 'top-bottom': _t.textTopAndBottom, + infront: _t.textInFront, + behind: _t.textBehind + }; + if (!imageObject && Device.phone) { $$('.sheet-modal.modal-in').length > 0 && f7.sheet.close(); return null; } + return ( - + {Device.phone && @@ -37,30 +52,31 @@ const PageWrap = props => { } - {props.onWrapType('inline')}}> - {!isAndroid && } - - {props.onWrapType('square')}}> - {!isAndroid && } - - {props.onWrapType('tight')}}> - {!isAndroid && } - - {props.onWrapType('through')}}> - {!isAndroid && } - - {props.onWrapType('top-bottom')}}> - {!isAndroid && } - - {props.onWrapType('infront')}}> - {!isAndroid && } - - {props.onWrapType('behind')}}> - {!isAndroid && } - + - { - wrapType !== 'inline' && + {('inline' !== wrappingStyle && 'behind' !== wrappingStyle && 'infront' !== wrappingStyle) && + + {_t.textDistanceFromText} + + +
+ {setDistance(value)}} + onRangeChanged={(value) => {props.onWrapDistance(value)}} + > +
+
+ {stateDistance + ' ' + metricText} +
+ + + + } + {wrapType !== 'inline' && {_t.textAlign} @@ -97,29 +113,88 @@ const PageWrap = props => { {props.onOverlap(!overlap)}}/> - { - ('inline' !== wrapType && 'behind' !== wrapType && 'infront' !== wrapType) && - - {_t.textDistanceFromText} - - -
- {setDistance(value)}} - onRangeChanged={(value) => {props.onWrapDistance(value)}} - > -
-
- {stateDistance + ' ' + metricText} -
- - - - } ) }; +const PageWrappingStyle = props => { + const isAndroid = Device.android; + const { t } = useTranslation(); + const _t = t('Edit', {returnObjects: true}); + const imageObject = props.storeFocusObjects.imageObject; + const [wrapType, setWrapType] = useState(props.wrappingStyle); + + if (!imageObject && Device.phone) { + $$('.sheet-modal.modal-in').length > 0 && f7.sheet.close(); + return null; + } + + return ( + + + {Device.phone && + + + + + + } + + + { + setWrapType('inline'); + props.setWrappingStyle('inline'); + props.onWrapType('inline'); + }}> + {!isAndroid && } + + { + setWrapType('square'); + props.setWrappingStyle('square'); + props.onWrapType('square'); + }}> + {!isAndroid && } + + { + setWrapType('tight'); + props.setWrappingStyle('tight'); + props.onWrapType('tight'); + }}> + {!isAndroid && } + + { + setWrapType('through'); + props.setWrappingStyle('through'); + props.onWrapType('through'); + }}> + {!isAndroid && } + + { + setWrapType('top-bottom'); + props.setWrappingStyle('top-bottom'); + props.onWrapType('top-bottom'); + }}> + {!isAndroid && } + + { + setWrapType('infront'); + props.setWrappingStyle('infront'); + props.onWrapType('infront'); + }}> + {!isAndroid && } + + { + setWrapType('behind'); + props.setWrappingStyle('behind'); + props.onWrapType('behind'); + }}> + {!isAndroid && } + + + + ) +} + const PageLinkSettings = props => { const { t } = useTranslation(); const _t = t('Edit', {returnObjects: true}); @@ -244,14 +319,14 @@ const EditImage = props => { return ( - - @@ -261,7 +336,7 @@ const EditImage = props => { {props.onDefaulSize()}}/> - {props.onRemoveImage()}}/> + {props.onRemoveImage()}}/> ) @@ -272,9 +347,11 @@ const PageWrapContainer = inject("storeFocusObjects", "storeImageSettings")(obse const PageReplaceContainer = inject("storeFocusObjects")(observer(PageReplace)); const PageReorderContainer = inject("storeFocusObjects")(observer(PageReorder)); const PageLinkSettingsContainer = inject("storeFocusObjects")(observer(PageLinkSettings)); +const PageWrappingStyleContainer = inject("storeFocusObjects")(observer(PageWrappingStyle)); export {EditImageContainer as EditImage, PageWrapContainer as PageImageWrap, PageReplaceContainer as PageImageReplace, PageReorderContainer as PageImageReorder, - PageLinkSettingsContainer as PageLinkSettings} \ No newline at end of file + PageLinkSettingsContainer as PageLinkSettings, + PageWrappingStyleContainer as PageWrappingStyle} \ No newline at end of file diff --git a/apps/documenteditor/mobile/src/view/edit/EditShape.jsx b/apps/documenteditor/mobile/src/view/edit/EditShape.jsx index 3978e10f2..1e1ddcca3 100644 --- a/apps/documenteditor/mobile/src/view/edit/EditShape.jsx +++ b/apps/documenteditor/mobile/src/view/edit/EditShape.jsx @@ -312,6 +312,7 @@ const PageWrap = props => { const storeShapeSettings = props.storeShapeSettings; const shapeObject = props.storeFocusObjects.shapeObject; let wrapType, align, moveText, overlap, distance; + if (shapeObject) { wrapType = storeShapeSettings.getWrapType(shapeObject); align = storeShapeSettings.getAlign(shapeObject); @@ -319,12 +320,15 @@ const PageWrap = props => { overlap = storeShapeSettings.getOverlap(shapeObject); distance = Common.Utils.Metric.fnRecalcFromMM(storeShapeSettings.getWrapDistance(shapeObject)); } + const metricText = Common.Utils.Metric.getCurrentMetricName(); const [stateDistance, setDistance] = useState(distance); + if (!shapeObject && Device.phone) { $$('.sheet-modal.modal-in').length > 0 && f7.sheet.close(); return null; } + return ( @@ -359,46 +363,7 @@ const PageWrap = props => { {!isAndroid && } - { - wrapType !== 'inline' && - - {_t.textAlign} - - - - { - props.onShapeAlign(Asc.c_oAscAlignH.Left) - }}> - - - { - props.onShapeAlign(Asc.c_oAscAlignH.Center) - }}> - - - { - props.onShapeAlign(Asc.c_oAscAlignH.Right) - }}> - - - - - - - } - - - {props.onMoveText(!moveText)}}/> - - - {props.onOverlap(!overlap)}}/> - - - { - ('behind' !== wrapType && 'infront' !== wrapType) && + {('behind' !== wrapType && 'infront' !== wrapType) && {_t.textDistanceFromText} @@ -416,6 +381,43 @@ const PageWrap = props => { } + {wrapType !== 'inline' && + + {_t.textAlign} + + + + { + props.onShapeAlign(Asc.c_oAscAlignH.Left) + }}> + + + { + props.onShapeAlign(Asc.c_oAscAlignH.Center) + }}> + + + { + props.onShapeAlign(Asc.c_oAscAlignH.Right) + }}> + + + + + + + } + + + {props.onMoveText(!moveText)}}/> + + + {props.onOverlap(!overlap)}}/> + + ) }; @@ -509,6 +511,7 @@ const EditShape = props => { const canFill = props.storeFocusObjects.shapeObject.get_ShapeProperties().get_CanFill(); const shapeObject = props.storeFocusObjects.shapeObject; const wrapType = props.storeShapeSettings.getWrapType(shapeObject); + const settings = props.storeFocusObjects.settings; const shapeType = shapeObject.get_ShapeProperties().asc_getType(); const hideChangeType = shapeObject.get_ShapeProperties().get_FromChart() || shapeObject.get_ShapeProperties().get_FromSmartArt() @@ -548,7 +551,7 @@ const EditShape = props => { onBorderColor: props.onBorderColor }}> : null} - { !isFromGroup && + {(!isFromGroup && settings.indexOf('image') === -1) && { }}> } {(!hideChangeType && !fixedSize) && - } - { (wrapType !== 'inline' && !isSmartArtInternal) && } - - {props.onRemoveShape()}} className={`button-red button-fill button-raised${disableRemove ? ' disabled' : ''}`} /> - + {settings.indexOf('image') === -1 && + + {props.onRemoveShape()}} className={`button-red button-fill button-raised${disableRemove ? ' disabled' : ''}`} /> + + } ) }; diff --git a/apps/presentationeditor/mobile/locale/en.json b/apps/presentationeditor/mobile/locale/en.json index a46331db4..53022fcea 100644 --- a/apps/presentationeditor/mobile/locale/en.json +++ b/apps/presentationeditor/mobile/locale/en.json @@ -356,13 +356,16 @@ "textPt": "pt", "textPush": "Push", "textRemoveChart": "Remove Chart", - "textRemoveImage": "Remove Image", + "del_textRemoveImage": "Remove Image", + "textDeleteImage": "Delete Image", "del_textRemoveLink": "Remove Link", "textDeleteLink": "Delete Link", "textRemoveShape": "Remove Shape", "textRemoveTable": "Remove Table", - "textReorder": "Reorder", + "del_textReorder": "Reorder", + "textArrange": "Arrange", "textReplace": "Replace", + "textChangeShape": "Change Shape", "textReplaceAll": "Replace All", "textReplaceImage": "Replace Image", "textRight": "Right", diff --git a/apps/presentationeditor/mobile/src/view/edit/EditImage.jsx b/apps/presentationeditor/mobile/src/view/edit/EditImage.jsx index 6c891bdfc..5915efdc1 100644 --- a/apps/presentationeditor/mobile/src/view/edit/EditImage.jsx +++ b/apps/presentationeditor/mobile/src/view/edit/EditImage.jsx @@ -15,11 +15,11 @@ const EditImage = props => { return ( - - { {_t.textActualSize} - {_t.textRemoveImage} + {t('View.Edit.textDeleteImage')} ) @@ -177,6 +177,7 @@ const PageLinkSettings = props => { f7.dialog.alert(_t.textEmptyImgUrl, _t.notcriticalErrorTitle); } }; + return ( diff --git a/apps/presentationeditor/mobile/src/view/edit/EditShape.jsx b/apps/presentationeditor/mobile/src/view/edit/EditShape.jsx index 9190e8ce1..211abf3c2 100644 --- a/apps/presentationeditor/mobile/src/view/edit/EditShape.jsx +++ b/apps/presentationeditor/mobile/src/view/edit/EditShape.jsx @@ -9,9 +9,9 @@ const EditShape = props => { const { t } = useTranslation(); const _t = t('View.Edit', {returnObjects: true}); const storeFocusObjects = props.storeFocusObjects; + const settings = storeFocusObjects.settings; const shapeObject = storeFocusObjects.shapeObject; const canFill = shapeObject && shapeObject.get_CanFill(); - const shapeType = shapeObject.asc_getType(); const hideChangeType = shapeObject.get_FromChart() || shapeObject.get_FromSmartArt() || shapeType=='line' || shapeType=='bentConnector2' || shapeType=='bentConnector3' @@ -38,23 +38,27 @@ const EditShape = props => { onBorderColor: props.onBorderColor }}> } - { !hideChangeType && - } - { !isSmartArtInternal && - } - - - - {_t.textRemoveShape} + {settings.indexOf('image') === -1 && + + } + {settings.indexOf('image') === -1 && + + {_t.textRemoveShape} + + } ) }; diff --git a/apps/spreadsheeteditor/mobile/locale/en.json b/apps/spreadsheeteditor/mobile/locale/en.json index ec179db30..69be63326 100644 --- a/apps/spreadsheeteditor/mobile/locale/en.json +++ b/apps/spreadsheeteditor/mobile/locale/en.json @@ -509,13 +509,16 @@ "textPt": "pt", "textRange": "Range", "textRemoveChart": "Remove Chart", - "textRemoveImage": "Remove Image", + "del_textRemoveImage": "Remove Image", + "textDeleteImage": "Delete Image", "del_textRemoveLink": "Remove Link", "textDeleteLink": "Delete Link", "textRemoveShape": "Remove Shape", - "textReorder": "Reorder", + "del_textReorder": "Reorder", + "textArrange": "Arrange", "textReplace": "Replace", "textReplaceImage": "Replace Image", + "textChangeShape": "Change Shape", "textRequired": "Required", "textRight": "Right", "textRightBorder": "Right Border", diff --git a/apps/spreadsheeteditor/mobile/src/view/edit/EditImage.jsx b/apps/spreadsheeteditor/mobile/src/view/edit/EditImage.jsx index 800494c90..a66d9862c 100644 --- a/apps/spreadsheeteditor/mobile/src/view/edit/EditImage.jsx +++ b/apps/spreadsheeteditor/mobile/src/view/edit/EditImage.jsx @@ -14,17 +14,17 @@ const EditImage = props => { return ( - - {_t.textActualSize} - {_t.textRemoveImage} + {t('View.Edit.textDeleteImage')} ) diff --git a/apps/spreadsheeteditor/mobile/src/view/edit/EditShape.jsx b/apps/spreadsheeteditor/mobile/src/view/edit/EditShape.jsx index a8cef2809..89acaf088 100644 --- a/apps/spreadsheeteditor/mobile/src/view/edit/EditShape.jsx +++ b/apps/spreadsheeteditor/mobile/src/view/edit/EditShape.jsx @@ -9,6 +9,7 @@ const EditShape = props => { const { t } = useTranslation(); const _t = t('View.Edit', {returnObjects: true}); const storeFocusObjects = props.storeFocusObjects; + const objects = storeFocusObjects.objects; const shapeObject = storeFocusObjects.shapeObject; const canFill = shapeObject && shapeObject.get_ShapeProperties().asc_getCanFill(); @@ -38,20 +39,22 @@ const EditShape = props => { onBorderColor: props.onBorderColor }}> } - { !hideChangeType && - } - { !isSmartArtInternal && - } - - {_t.textRemoveShape} - + {objects.indexOf('image') === -1 && + + {_t.textRemoveShape} + + } ) };