[DE mobile] Bug 50044

apps/documenteditor/mobile/src/view/edit/EditShape.jsx

@@ -1,6 +1,7 @@
 import React, {Fragment, useState} from 'react';
 import {observer, inject} from "mobx-react";
 import {List, ListItem, Icon, Row, Page, Navbar, BlockTitle, Toggle, Range, ListButton, Link, Tabs, Tab} from 'framework7-react';
+import { f7 } from 'framework7-react';
 import { useTranslation } from 'react-i18next';
 import {Device} from '../../../../../common/mobile/utils/device';
 import {CustomColorPicker, ThemeColorPalette} from "../../../../../common/mobile/lib/component/ThemeColorPalette.jsx";
@@ -119,14 +120,19 @@ const PageStyle = props => {
     const _t = t('Edit', {returnObjects: true});
     const storeShapeSettings = props.storeShapeSettings;
     const shapeObject = props.storeFocusObjects.shapeObject;
+
+    let borderSize, borderType, transparent;
+    if (shapeObject) {
         const stroke = shapeObject.get_ShapeProperties().get_stroke();
+        borderSize = stroke.get_width() * 72.0 / 25.4;
+        borderType = stroke.get_type();
+        transparent = shapeObject.get_ShapeProperties().get_fill().asc_getTransparent();
+    }
 
     // Init border size
     const borderSizeTransform = storeShapeSettings.borderSizeTransform();
-    const borderSize = stroke.get_width() * 72.0 / 25.4;
+    const displayBorderSize = (borderType == Asc.c_oAscStrokeType.STROKE_NONE || borderType === undefined) ? 0 : borderSizeTransform.indexSizeByValue(borderSize);
-    const borderType = stroke.get_type();
+    const displayTextBorderSize = (borderType == Asc.c_oAscStrokeType.STROKE_NONE || borderType === undefined) ? 0 : borderSizeTransform.sizeByValue(borderSize);
-    const displayBorderSize = (borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.indexSizeByValue(borderSize);
-    const displayTextBorderSize = (borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.sizeByValue(borderSize);
     const [stateBorderSize, setBorderSize] = useState(displayBorderSize);
     const [stateTextBorderSize, setTextBorderSize] = useState(displayTextBorderSize);
 
@@ -135,10 +141,14 @@ const PageStyle = props => {
     const displayBorderColor = borderColor !== 'transparent' ? `#${(typeof borderColor === "object" ? borderColor.color : borderColor)}` : borderColor;
 
     // Init opacity
-    const transparent = shapeObject.get_ShapeProperties().get_fill().asc_getTransparent();
     const opacity = transparent !== null && transparent !== undefined ? transparent / 2.55 : 100;
     const [stateOpacity, setOpacity] = useState(Math.round(opacity));
 
+    if (!shapeObject && Device.phone) {
+        $$('.sheet-modal.modal-in').length > 0 && f7.sheet.close();
+        return null;
+    }
+
     return (
         <Page>
             <Navbar backLink={_t.textBack}>
@@ -202,14 +212,17 @@ const PageStyleNoFill = props => {
     const _t = t('Edit', {returnObjects: true});
     const storeShapeSettings = props.storeShapeSettings;
     const shapeObject = props.storeFocusObjects.shapeObject;
+    let borderSize, borderType;
+    if (shapeObject) {
         const stroke = shapeObject.get_ShapeProperties().get_stroke();
+        borderSize = stroke.get_width() * 72.0 / 25.4;
+        borderType = stroke.get_type();
+    }
 
     // Init border size
     const borderSizeTransform = storeShapeSettings.borderSizeTransform();
-    const borderSize = stroke.get_width() * 72.0 / 25.4;
+    const displayBorderSize = (borderType == Asc.c_oAscStrokeType.STROKE_NONE || borderType === undefined) ? 0 : borderSizeTransform.indexSizeByValue(borderSize);
-    const borderType = stroke.get_type();
+    const displayTextBorderSize = (borderType == Asc.c_oAscStrokeType.STROKE_NONE || borderType === undefined) ? 0 : borderSizeTransform.sizeByValue(borderSize);
-    const displayBorderSize = (borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.indexSizeByValue(borderSize);
-    const displayTextBorderSize = (borderType == Asc.c_oAscStrokeType.STROKE_NONE) ? 0 : borderSizeTransform.sizeByValue(borderSize);
     const [stateBorderSize, setBorderSize] = useState(displayBorderSize);
     const [stateTextBorderSize, setTextBorderSize] = useState(displayTextBorderSize);
 
@@ -217,6 +230,11 @@ const PageStyleNoFill = props => {
     const borderColor = !storeShapeSettings.borderColorView ? storeShapeSettings.initBorderColorView(shapeObject) : storeShapeSettings.borderColorView;
     const displayBorderColor = borderColor !== 'transparent' ? `#${(typeof borderColor === "object" ? borderColor.color : borderColor)}` : borderColor;
 
+    if (!shapeObject && Device.phone) {
+        $$('.sheet-modal.modal-in').length > 0 && f7.sheet.close();
+        return null;
+    }
+
     return (
         <Page>
             <Navbar backLink={_t.textBack} title={_t.textBorder}></Navbar>
@@ -252,13 +270,20 @@ const PageWrap = props => {
     const _t = t('Edit', {returnObjects: true});
     const storeShapeSettings = props.storeShapeSettings;
     const shapeObject = props.storeFocusObjects.shapeObject;
-    const wrapType = storeShapeSettings.getWrapType(shapeObject);
+    let wrapType, align, moveText, overlap, distance;
-    const align = storeShapeSettings.getAlign(shapeObject);
+    if (shapeObject) {
-    const moveText = storeShapeSettings.getMoveText(shapeObject);
+        wrapType = storeShapeSettings.getWrapType(shapeObject);
-    const overlap = storeShapeSettings.getOverlap(shapeObject);
+        align = storeShapeSettings.getAlign(shapeObject);
-    const distance = Common.Utils.Metric.fnRecalcFromMM(storeShapeSettings.getWrapDistance(shapeObject));
+        moveText = storeShapeSettings.getMoveText(shapeObject);
+        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 (
         <Page>
             <Navbar title={_t.textWrap} backLink={_t.textBack} />
@@ -352,6 +377,13 @@ const PageReplace = props => {
     const storeShapeSettings = props.storeShapeSettings;
     let shapes = storeShapeSettings.getStyleGroups();
     shapes.splice(0, 1); // Remove line shapes
+
+    const shapeObject = props.storeFocusObjects.shapeObject;
+    if (!shapeObject && Device.phone) {
+        $$('.sheet-modal.modal-in').length > 0 && f7.sheet.close();
+        return null;
+    }
+
     return (
         <Page className="shapes dataview">
             <Navbar title={_t.textReplace} backLink={_t.textBack} />
@@ -377,6 +409,13 @@ const PageReplace = props => {
 const PageReorder = props => {
     const { t } = useTranslation();
     const _t = t('Edit', {returnObjects: true});
+
+    const shapeObject = props.storeFocusObjects.shapeObject;
+    if (!shapeObject && Device.phone) {
+        $$('.sheet-modal.modal-in').length > 0 && f7.sheet.close();
+        return null;
+    }
+
     return (
         <Page>
             <Navbar title={_t.textReorder} backLink={_t.textBack} />

apps/documenteditor/mobile/src/view/edit/EditTable.jsx

@@ -1,6 +1,7 @@
 import React, {Fragment, useState} from 'react';
 import {observer, inject} from "mobx-react";
 import {Page, Navbar, List, ListItem, ListButton, Row, BlockTitle, Range, Toggle, Icon, Link, Tabs, Tab} from 'framework7-react';
+import { f7 } from 'framework7-react';
 import { useTranslation } from 'react-i18next';
 import {Device} from '../../../../../common/mobile/utils/device';
 import {CustomColorPicker, ThemeColorPalette} from "../../../../../common/mobile/lib/component/ThemeColorPalette.jsx";
@@ -12,10 +13,20 @@ const PageTableOptions = props => {
     const storeFocusObjects = props.storeFocusObjects;
     const tableObject = storeFocusObjects.tableObject;
     const storeTableSettings = props.storeTableSettings;
-    const distance = Common.Utils.Metric.fnRecalcFromMM(storeTableSettings.getCellMargins(tableObject));
+
+    let distance, isRepeat, isResize;
+    if (tableObject) {
+        distance = Common.Utils.Metric.fnRecalcFromMM(storeTableSettings.getCellMargins(tableObject));
+        isRepeat = storeTableSettings.getRepeatOption(tableObject);
+        isResize = storeTableSettings.getResizeOption(tableObject);
+    }
     const [stateDistance, setDistance] = useState(distance);
-    const isRepeat = storeTableSettings.getRepeatOption(tableObject);
+
-    const isResize = storeTableSettings.getResizeOption(tableObject);
+    if (!tableObject && Device.phone) {
+        $$('.sheet-modal.modal-in').length > 0 && f7.sheet.close();
+        return null;
+    }
+
     return (
         <Page>
             <Navbar title={_t.textOptions} backLink={_t.textBack} />
@@ -60,12 +71,21 @@ const PageWrap = props => {
     const _t = t('Edit', {returnObjects: true});
     const storeTableSettings = props.storeTableSettings;
     const tableObject = props.storeFocusObjects.tableObject;
-    const wrapType = storeTableSettings.getWrapType(tableObject);
+    let wrapType, align, moveText, distance;
-    const align = storeTableSettings.getAlign(tableObject);
+    if (tableObject) {
-    const moveText = storeTableSettings.getMoveText(tableObject);
+        wrapType = storeTableSettings.getWrapType(tableObject);
-    const distance = Common.Utils.Metric.fnRecalcFromMM(storeTableSettings.getWrapDistance(tableObject));
+        align = storeTableSettings.getAlign(tableObject);
+        moveText = storeTableSettings.getMoveText(tableObject);
+        distance = Common.Utils.Metric.fnRecalcFromMM(storeTableSettings.getWrapDistance(tableObject));
+    }
     const metricText = Common.Utils.Metric.getCurrentMetricName();
     const [stateDistance, setDistance] = useState(distance);
+
+    if (!tableObject && Device.phone) {
+        $$('.sheet-modal.modal-in').length > 0 && f7.sheet.close();
+        return null;
+    }
+
     return (
         <Page>
             <Navbar title={_t.textWrap} backLink={_t.textBack} />
@@ -177,13 +197,17 @@ const StyleTemplates = inject("storeFocusObjects")(observer(({templates, onStyle
 const PageStyleOptions = props => {
     const { t } = useTranslation();
     const _t = t('Edit', {returnObjects: true});
-    const tableLook = props.storeFocusObjects.tableObject.get_TableLook();
+    const tableObject = props.storeFocusObjects.tableObject;
-    const isFirstRow = tableLook.get_FirstRow();
+    let tableLook, isFirstRow, isLastRow, isBandHor, isFirstCol, isLastCol, isBandVer;
-    const isLastRow = tableLook.get_LastRow();
+    if (tableObject) {
-    const isBandHor = tableLook.get_BandHor();
+        tableLook = tableObject.get_TableLook();
-    const isFirstCol = tableLook.get_FirstCol();
+        isFirstRow = tableLook.get_FirstRow();
-    const isLastCol = tableLook.get_LastCol();
+        isLastRow = tableLook.get_LastRow();
-    const isBandVer = tableLook.get_BandVer();
+        isBandHor = tableLook.get_BandHor();
+        isFirstCol = tableLook.get_FirstCol();
+        isLastCol = tableLook.get_LastCol();
+        isBandVer = tableLook.get_BandVer();
+    }
     return (
         <Page>
             <Navbar title={_t.textOptions} backLink={_t.textBack}/>
@@ -217,10 +241,13 @@ const PageCustomFillColor = props => {
     const { t } = useTranslation();
     const _t = t('Edit', {returnObjects: true});
     const tableObject = props.storeFocusObjects.tableObject;
-    let fillColor = props.storeTableSettings.getFillColor(tableObject);
+    let fillColor;
+    if (tableObject) {
+        fillColor = props.storeTableSettings.getFillColor(tableObject);
         if (typeof fillColor === 'object') {
             fillColor = fillColor.color;
         }
+    }
     const onAddNewColor = (colors, color) => {
         props.storePalette.changeCustomColors(colors);
         props.onFillColor(color);
@@ -405,6 +432,13 @@ const PageStyle = props => {
     const _t = t('Edit', {returnObjects: true});
     const storeTableSettings = props.storeTableSettings;
     const templates = storeTableSettings.styles;
+
+    const tableObject = props.storeFocusObjects.tableObject;
+    if (!tableObject && Device.phone) {
+        $$('.sheet-modal.modal-in').length > 0 && f7.sheet.close();
+        return null;
+    }
+
     return (
         <Page>
             <Navbar backLink={_t.textBack}>