Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

[DE mobile] Bug 50044

Browse source
This commit is contained in:
JuliaSvinareva 2021-04-27 20:04:43 +03:00
parent 1d51be59a6
commit 5f59be85ee
2 changed files with 106 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

67
apps/documenteditor/mobile/src/view/edit/EditShape.jsx
View file

@ -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 borderType = stroke.get_type();
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 displayBorderSize = (borderType == Asc.c_oAscStrokeType.STROKE_NONE || borderType === undefined) ? 0 : borderSizeTransform.indexSizeByValue(borderSize);
const displayTextBorderSize = (borderType == Asc.c_oAscStrokeType.STROKE_NONE || borderType === undefined) ? 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 borderType = stroke.get_type();
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 displayBorderSize = (borderType == Asc.c_oAscStrokeType.STROKE_NONE || borderType === undefined) ? 0 : borderSizeTransform.indexSizeByValue(borderSize);
const displayTextBorderSize = (borderType == Asc.c_oAscStrokeType.STROKE_NONE || borderType === undefined) ? 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);
const align = storeShapeSettings.getAlign(shapeObject);
const moveText = storeShapeSettings.getMoveText(shapeObject);
const overlap = storeShapeSettings.getOverlap(shapeObject);
const distance = Common.Utils.Metric.fnRecalcFromMM(storeShapeSettings.getWrapDistance(shapeObject));
let wrapType, align, moveText, overlap, distance;
if (shapeObject) {
wrapType = storeShapeSettings.getWrapType(shapeObject);
align = storeShapeSettings.getAlign(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} />

64
apps/documenteditor/mobile/src/view/edit/EditTable.jsx
View file

@ -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);
const align = storeTableSettings.getAlign(tableObject);
const moveText = storeTableSettings.getMoveText(tableObject);
const distance = Common.Utils.Metric.fnRecalcFromMM(storeTableSettings.getWrapDistance(tableObject));
let wrapType, align, moveText, distance;
if (tableObject) {
wrapType = storeTableSettings.getWrapType(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 isFirstRow = tableLook.get_FirstRow();
const isLastRow = tableLook.get_LastRow();
const isBandHor = tableLook.get_BandHor();
const isFirstCol = tableLook.get_FirstCol();
const isLastCol = tableLook.get_LastCol();
const isBandVer = tableLook.get_BandVer();
const tableObject = props.storeFocusObjects.tableObject;
let tableLook, isFirstRow, isLastRow, isBandHor, isFirstCol, isLastCol, isBandVer;
if (tableObject) {
tableLook = tableObject.get_TableLook();
isFirstRow = tableLook.get_FirstRow();
isLastRow = tableLook.get_LastRow();
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}>