[DE mobile] Add edit shape settings (Wrap, Replace, Reorder, Remove)
This commit is contained in:
JuliaSvinareva
parent
209a7d54ca
commit
133afc5771
|
|
@ -65,6 +65,27 @@
|
|||
"textPageBreakBefore": "Page Break Before",
|
||||
"textOrphanControl": "Orphan Control",
|
||||
"textKeepLinesTogether": "Keep Lines Together",
|
||||
"textKeepWithNext": "Keep with Next"
|
||||
"textKeepWithNext": "Keep with Next",
|
||||
"textStyle": "Style",
|
||||
"textWrap": "Wrap",
|
||||
"textReplace": "Replace",
|
||||
"textReorder": "Reorder",
|
||||
"textRemoveShape": "Remove Shape",
|
||||
"textInline": "Inline",
|
||||
"textSquare": "Square",
|
||||
"textTight": "Tight",
|
||||
"textThrough": "Through",
|
||||
"textTopAndBottom": "Top and Bottom",
|
||||
"textInFront": "In Front",
|
||||
"textBehind": "Behind",
|
||||
"textAlign": "Align",
|
||||
"textMoveWithText": "Move with Text",
|
||||
"textAllowOverlap": "Allow Overlap",
|
||||
"textDistanceFromText": "Distance from Text",
|
||||
"textBringToForeground": "Bring to Foreground",
|
||||
"textSendToBackground": "Send to Background",
|
||||
"textMoveForward": "Move Forward",
|
||||
"textMoveBackward": "Move Backward"
|
||||
|
||||
}
|
||||
}
|
||||
|
|
@ -7,8 +7,11 @@ import {Device} from '../../../../../common/mobile/utils/device';
|
|||
|
||||
import EditTextController from "./controller/EditText";
|
||||
import EditParagraphController from "./controller/EditParagraph";
|
||||
import EditShapeController from "./controller/EditShape";
|
||||
|
||||
import {PageAdditionalFormatting, PageBullets, PageFonts, PageLineSpacing, PageNumbers} from "./EditText";
|
||||
import {PageAdvancedSettings} from "./EditParagraph";
|
||||
import {PageWrap, PageReorder, PageReplace} from "./EditShape";
|
||||
|
||||
const routes = [
|
||||
//Edit text
|
||||
|
|
@ -36,6 +39,19 @@ const routes = [
|
|||
{
|
||||
path: '/edit-paragraph-adv/',
|
||||
component: PageAdvancedSettings,
|
||||
},
|
||||
//Edit shape
|
||||
{
|
||||
path: '/edit-shape-wrap/',
|
||||
component: PageWrap,
|
||||
},
|
||||
{
|
||||
path: '/edit-shape-reorder/',
|
||||
component: PageReorder,
|
||||
},
|
||||
{
|
||||
path: '/edit-shape-replace/',
|
||||
component: PageReplace,
|
||||
}
|
||||
];
|
||||
|
||||
|
|
@ -130,15 +146,15 @@ const EditTabs = props => {
|
|||
id: 'edit-header',
|
||||
component: <EditHeader />
|
||||
})
|
||||
}
|
||||
}*/
|
||||
if (settings.indexOf('shape') > -1) {
|
||||
editors.push({
|
||||
caption: _t.textShape,
|
||||
id: 'edit-shape',
|
||||
component: <EditShape />
|
||||
component: <EditShapeController />
|
||||
})
|
||||
}
|
||||
if (settings.indexOf('image') > -1) {
|
||||
/*if (settings.indexOf('image') > -1) {
|
||||
editors.push({
|
||||
caption: _t.textImage,
|
||||
id: 'edit-image',
|
||||
|
|
|
|||
175
apps/documenteditor/mobile/src/components/edit/EditShape.jsx
Normal file
175
apps/documenteditor/mobile/src/components/edit/EditShape.jsx
Normal file
|
|
@ -0,0 +1,175 @@
|
|||
import React, {Fragment, useState} from 'react';
|
||||
import {observer, inject} from "mobx-react";
|
||||
import {List, ListItem, ListItemCell, Icon, Row, Col, Button, Page, Navbar, Segmented, BlockTitle, Toggle, Range} from 'framework7-react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
const PageStyle = props => {
|
||||
return (
|
||||
<Page>
|
||||
|
||||
</Page>
|
||||
)
|
||||
};
|
||||
|
||||
const PageWrap = props => {
|
||||
const { t } = useTranslation();
|
||||
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));
|
||||
const metricText = Common.Utils.Metric.getCurrentMetricName();
|
||||
const [stateDistance, setDistance] = useState(distance);
|
||||
return (
|
||||
<Page>
|
||||
<Navbar title={_t.textWrap} backLink={_t.textBack} />
|
||||
<List>
|
||||
<ListItem title={_t.textInline} radio checked={wrapType === 'inline'} onClick={() => {props.onWrapType('inline')}}></ListItem>
|
||||
<ListItem title={_t.textSquare} radio checked={wrapType === 'square'} onClick={() => {props.onWrapType('square')}}></ListItem>
|
||||
<ListItem title={_t.textTight} radio checked={wrapType === 'tight'} onClick={() => {props.onWrapType('tight')}}></ListItem>
|
||||
<ListItem title={_t.textThrough} radio checked={wrapType === 'through'} onClick={() => {props.onWrapType('through')}}></ListItem>
|
||||
<ListItem title={_t.textTopAndBottom} radio checked={wrapType === 'top-bottom'} onClick={() => {props.onWrapType('top-bottom')}}></ListItem>
|
||||
<ListItem title={_t.textInFront} radio checked={wrapType === 'infront'} onClick={() => {props.onWrapType('infront')}}></ListItem>
|
||||
<ListItem title={_t.textBehind} radio checked={wrapType === 'behind'} onClick={() => {props.onWrapType('behind')}}></ListItem>
|
||||
</List>
|
||||
{
|
||||
wrapType !== 'inline' &&
|
||||
<Fragment>
|
||||
<BlockTitle>{_t.textAlign}</BlockTitle>
|
||||
<List>
|
||||
<ListItem>
|
||||
<Row>
|
||||
<a className={'button' + (align === Asc.c_oAscAlignH.Left ? ' active' : '')}
|
||||
onClick={() => {
|
||||
props.onShapeAlign(Asc.c_oAscAlignH.Left)
|
||||
}}>left</a>
|
||||
<a className={'button' + (align === Asc.c_oAscAlignH.Center ? ' active' : '')}
|
||||
onClick={() => {
|
||||
props.onShapeAlign(Asc.c_oAscAlignH.Center)
|
||||
}}>center</a>
|
||||
<a className={'button' + (align === Asc.c_oAscAlignH.Righ ? ' active' : '')}
|
||||
onClick={() => {
|
||||
props.onShapeAlign(Asc.c_oAscAlignH.Righ)
|
||||
}}>right</a>
|
||||
</Row>
|
||||
</ListItem>
|
||||
</List>
|
||||
</Fragment>
|
||||
}
|
||||
<List>
|
||||
<ListItem title={_t.textMoveWithText} className={'inline' === wrapType ? 'disabled' : ''}>
|
||||
<Toggle checked={moveText} onToggleChange={() => {props.onMoveText(!moveText)}}/>
|
||||
</ListItem>
|
||||
<ListItem title={_t.textAllowOverlap}>
|
||||
<Toggle checked={overlap} onToggleChange={() => {props.onOverlap(!overlap)}}/>
|
||||
</ListItem>
|
||||
</List>
|
||||
{
|
||||
('behind' !== wrapType && 'infront' !== wrapType) &&
|
||||
<Fragment>
|
||||
<BlockTitle>{_t.textDistanceFromText}</BlockTitle>
|
||||
<List>
|
||||
<ListItem>
|
||||
<div slot='inner' style={{width: '100%'}}>
|
||||
<Range min={0} max={200} step={1} value={stateDistance}
|
||||
onRangeChange={(value) => {setDistance(value)}}
|
||||
onRangeChanged={(value) => {props.onWrapDistance(value)}}
|
||||
></Range>
|
||||
</div>
|
||||
<div slot='inner-end' style={{minWidth: '60px', textAlign: 'right'}}>
|
||||
{stateDistance + ' ' + metricText}
|
||||
</div>
|
||||
</ListItem>
|
||||
</List>
|
||||
</Fragment>
|
||||
}
|
||||
</Page>
|
||||
)
|
||||
};
|
||||
|
||||
const PageReplace = props => {
|
||||
const { t } = useTranslation();
|
||||
const _t = t('Edit', {returnObjects: true});
|
||||
const storeShapeSettings = props.storeShapeSettings;
|
||||
let shapes = storeShapeSettings.getStyleGroups();
|
||||
shapes.splice(0, 1); // Remove line shapes
|
||||
return (
|
||||
<Page>
|
||||
<Navbar title={_t.textReplace} backLink={_t.textBack} />
|
||||
{shapes.map((row, indexRow) => {
|
||||
return (
|
||||
<ul className="row" key={'shape-row-' + indexRow}>
|
||||
{row.map((shape, index) => {
|
||||
return (
|
||||
<li key={'shape-' + indexRow + '-' + index} onClick={() => {props.onReplace(shape.type)}}>
|
||||
<div className="thumb"
|
||||
style={{maskImage: `url('../../../resources/img/shapes/'${shape.thumb})`}}>
|
||||
</div>
|
||||
</li>
|
||||
)
|
||||
})}
|
||||
</ul>
|
||||
)
|
||||
})}
|
||||
</Page>
|
||||
)
|
||||
};
|
||||
|
||||
const PageReorder = props => {
|
||||
const { t } = useTranslation();
|
||||
const _t = t('Edit', {returnObjects: true});
|
||||
return (
|
||||
<Page>
|
||||
<Navbar title={_t.textReorder} backLink={_t.textBack} />
|
||||
<List>
|
||||
<ListItem title={_t.textBringToForeground} link='#' onClick={() => {props.onReorder('all-up')}}></ListItem>
|
||||
<ListItem title={_t.textSendToBackground} link='#' onClick={() => {props.onReorder('all-down')}}></ListItem>
|
||||
<ListItem title={_t.textMoveForward} link='#' onClick={() => {props.onReorder('move-up')}}></ListItem>
|
||||
<ListItem title={_t.textMoveBackward} link='#' onClick={() => {props.onReorder('move-down')}}></ListItem>
|
||||
</List>
|
||||
</Page>
|
||||
)
|
||||
};
|
||||
|
||||
const EditShape = props => {
|
||||
const { t } = useTranslation();
|
||||
const _t = t('Edit', {returnObjects: true});
|
||||
return (
|
||||
<Fragment>
|
||||
<List>
|
||||
<ListItem title={_t.textStyle}></ListItem>
|
||||
<ListItem title={_t.textWrap} link='/edit-shape-wrap/' routeProps={{
|
||||
onWrapType: props.onWrapType,
|
||||
onShapeAlign: props.onShapeAlign,
|
||||
onMoveText: props.onMoveText,
|
||||
onOverlap: props.onOverlap,
|
||||
onWrapDistance: props.onWrapDistance
|
||||
}}></ListItem>
|
||||
<ListItem title={_t.textReplace} link='/edit-shape-replace/' routeProps={{
|
||||
onReplace: props.onReplace
|
||||
}}></ListItem>
|
||||
<ListItem title={_t.textReorder} link='/edit-shape-reorder/' routeProps={{
|
||||
onReorder: props.onReorder
|
||||
}}></ListItem>
|
||||
</List>
|
||||
<List>
|
||||
<ListItem title={_t.textRemoveShape} onClick={() => {props.onRemoveShape()}}/>
|
||||
</List>
|
||||
</Fragment>
|
||||
)
|
||||
};
|
||||
|
||||
const EditShapeContainer = inject("storeFocusObjects")(observer(EditShape));
|
||||
const PageStyleContainer = inject("storeFocusObjects")(observer(PageStyle));
|
||||
const PageWrapContainer = inject("storeShapeSettings", "storeFocusObjects")(observer(PageWrap));
|
||||
const PageReplaceContainer = inject("storeShapeSettings","storeFocusObjects")(observer(PageReplace));
|
||||
const PageReorderContainer = inject("storeFocusObjects")(observer(PageReorder));
|
||||
|
||||
export {EditShapeContainer as EditShape,
|
||||
PageStyleContainer as PageStyle,
|
||||
PageWrapContainer as PageWrap,
|
||||
PageReplaceContainer as PageReplace,
|
||||
PageReorderContainer as PageReorder}
|
||||
|
|
@ -0,0 +1,122 @@
|
|||
import React, {Component} from 'react';
|
||||
import { f7 } from 'framework7-react';
|
||||
import {Device} from '../../../../../../common/mobile/utils/device';
|
||||
import {observer, inject} from "mobx-react";
|
||||
|
||||
import { EditShape } from '../EditShape'
|
||||
|
||||
class EditShapeController extends Component {
|
||||
constructor (props) {
|
||||
super(props);
|
||||
this.onWrapType = this.onWrapType.bind(this);
|
||||
}
|
||||
|
||||
onRemoveShape () {
|
||||
const api = Common.EditorApi.get();
|
||||
if (api) {
|
||||
api.asc_Remove();
|
||||
if ( Device.phone ) {
|
||||
f7.sheet.close('#edit-sheet', true);
|
||||
} else {
|
||||
f7.popover.close('#edit-popover');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
onWrapType (type) {
|
||||
const api = Common.EditorApi.get();
|
||||
if (api) {
|
||||
const sdkType = this.props.storeShapeSettings.transformToSdkWrapType(type);
|
||||
const properties = new Asc.asc_CImgProperty();
|
||||
properties.put_WrappingStyle(sdkType);
|
||||
api.ImgApply(properties);
|
||||
}
|
||||
}
|
||||
|
||||
onShapeAlign (type) {
|
||||
const api = Common.EditorApi.get();
|
||||
if (api) {
|
||||
const properties = new Asc.asc_CImgProperty();
|
||||
properties.put_PositionH(new Asc.CImagePositionH());
|
||||
properties.get_PositionH().put_UseAlign(true);
|
||||
properties.get_PositionH().put_Align(type);
|
||||
properties.get_PositionH().put_RelativeFrom(Asc.c_oAscRelativeFromH.Page);
|
||||
api.ImgApply(properties);
|
||||
}
|
||||
}
|
||||
|
||||
onMoveText (value) {
|
||||
const api = Common.EditorApi.get();
|
||||
if (api) {
|
||||
const properties = new Asc.asc_CImgProperty();
|
||||
properties.put_PositionV(new Asc.CImagePositionV());
|
||||
properties.get_PositionV().put_UseAlign(true);
|
||||
properties.get_PositionV().put_RelativeFrom(value ? Asc.c_oAscRelativeFromV.Paragraph : Asc.c_oAscRelativeFromV.Page);
|
||||
api.ImgApply(properties);
|
||||
}
|
||||
}
|
||||
|
||||
onOverlap (value) {
|
||||
const api = Common.EditorApi.get();
|
||||
if (api) {
|
||||
const properties = new Asc.asc_CImgProperty();
|
||||
properties.put_AllowOverlap(value);
|
||||
api.ImgApply(properties);
|
||||
}
|
||||
}
|
||||
|
||||
onWrapDistance (value) {
|
||||
const api = Common.EditorApi.get();
|
||||
if (api) {
|
||||
const properties = new Asc.asc_CImgProperty();
|
||||
const paddings = new Asc.asc_CPaddings();
|
||||
const distance = Common.Utils.Metric.fnRecalcToMM(parseInt(value));
|
||||
paddings.put_Top(distance);
|
||||
paddings.put_Right(distance);
|
||||
paddings.put_Bottom(distance);
|
||||
paddings.put_Left(distance);
|
||||
properties.put_Paddings(paddings);
|
||||
api.ImgApply(properties);
|
||||
}
|
||||
}
|
||||
|
||||
onReorder (type) {
|
||||
const api = Common.EditorApi.get();
|
||||
if (api) {
|
||||
const properties = new Asc.asc_CImgProperty();
|
||||
if ('all-up' == type) {
|
||||
properties.put_ChangeLevel(Asc.c_oAscChangeLevel.BringToFront);
|
||||
} else if ('all-down' == type) {
|
||||
properties.put_ChangeLevel(Asc.c_oAscChangeLevel.SendToBack);
|
||||
} else if ('move-up' == type) {
|
||||
properties.put_ChangeLevel(Asc.c_oAscChangeLevel.BringForward);
|
||||
} else if ('move-down' == type) {
|
||||
properties.put_ChangeLevel(Asc.c_oAscChangeLevel.BringBackward);
|
||||
}
|
||||
api.ImgApply(properties);
|
||||
}
|
||||
}
|
||||
|
||||
onReplace (type) {
|
||||
const api = Common.EditorApi.get();
|
||||
if (api) {
|
||||
api.ChangeShapeType(type);
|
||||
}
|
||||
}
|
||||
|
||||
render () {
|
||||
return (
|
||||
<EditShape onRemoveShape={this.onRemoveShape}
|
||||
onWrapType={this.onWrapType}
|
||||
onShapeAlign={this.onShapeAlign}
|
||||
onMoveText={this.onMoveText}
|
||||
onOverlap={this.onOverlap}
|
||||
onWrapDistance={this.onWrapDistance}
|
||||
onReorder={this.onReorder}
|
||||
onReplace={this.onReplace}
|
||||
/>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default inject("storeShapeSettings")(observer(EditShapeController));
|
||||
|
|
@ -46,7 +46,7 @@ export class storeFocusObjects {
|
|||
@computed get paragraphObject() {
|
||||
let paragraphs = [];
|
||||
for (let object of this._focusObjects) {
|
||||
if (object.get_ObjectType() == Asc.c_oAscTypeSelectElement.Paragraph) {
|
||||
if (object.get_ObjectType() === Asc.c_oAscTypeSelectElement.Paragraph) {
|
||||
paragraphs.push(object);
|
||||
}
|
||||
}
|
||||
|
|
@ -57,4 +57,20 @@ export class storeFocusObjects {
|
|||
return undefined;
|
||||
}
|
||||
}
|
||||
@computed get shapeObject() {
|
||||
let shapes = [];
|
||||
for (let object of this._focusObjects) {
|
||||
if (object.get_ObjectType() === Asc.c_oAscTypeSelectElement.Image) {
|
||||
if (object.get_ObjectValue() && object.get_ObjectValue().get_ShapeProperties()) {
|
||||
shapes.push(object);
|
||||
}
|
||||
}
|
||||
}
|
||||
if (shapes.length > 0) {
|
||||
let object = shapes[shapes.length - 1]; // get top
|
||||
return object.get_ObjectValue();
|
||||
} else {
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -4,12 +4,14 @@ import {storeFocusObjects} from "./focusObjects";
|
|||
import {storeUsers} from '../../../../common/mobile/lib/store/users';
|
||||
import {storeTextSettings} from "./textSettings";
|
||||
import {storeParagraphSettings} from "./paragraphSettings";
|
||||
import {storeShapeSettings} from "./shapeSettings";
|
||||
|
||||
export const stores = {
|
||||
storeFocusObjects: new storeFocusObjects(),
|
||||
storeDocumentSettings: new storeDocumentSettings(),
|
||||
users: new storeUsers(),
|
||||
storeTextSettings: new storeTextSettings(),
|
||||
storeParagraphSettings: new storeParagraphSettings()
|
||||
storeParagraphSettings: new storeParagraphSettings(),
|
||||
storeShapeSettings: new storeShapeSettings()
|
||||
};
|
||||
|
||||
|
|
|
|||
192
apps/documenteditor/mobile/src/store/shapeSettings.js
Normal file
192
apps/documenteditor/mobile/src/store/shapeSettings.js
Normal file
|
|
@ -0,0 +1,192 @@
|
|||
import {action, observable, computed} from 'mobx';
|
||||
|
||||
export class storeShapeSettings {
|
||||
getStyleGroups () {
|
||||
const styles = [
|
||||
{
|
||||
title: 'Text',
|
||||
thumb: 'shape-01.svg',
|
||||
type: 'textRect'
|
||||
},
|
||||
{
|
||||
title: 'Line',
|
||||
thumb: 'shape-02.svg',
|
||||
type: 'line'
|
||||
},
|
||||
{
|
||||
title: 'Line with arrow',
|
||||
thumb: 'shape-03.svg',
|
||||
type: 'lineWithArrow'
|
||||
},
|
||||
{
|
||||
title: 'Line with two arrows',
|
||||
thumb: 'shape-04.svg',
|
||||
type: 'lineWithTwoArrows'
|
||||
},
|
||||
{
|
||||
title: 'Rect',
|
||||
thumb: 'shape-05.svg',
|
||||
type: 'rect'
|
||||
},
|
||||
{
|
||||
title: 'Hexagon',
|
||||
thumb: 'shape-06.svg',
|
||||
type: 'hexagon'
|
||||
},
|
||||
{
|
||||
title: 'Round rect',
|
||||
thumb: 'shape-07.svg',
|
||||
type: 'roundRect'
|
||||
},
|
||||
{
|
||||
title: 'Ellipse',
|
||||
thumb: 'shape-08.svg',
|
||||
type: 'ellipse'
|
||||
},
|
||||
{
|
||||
title: 'Triangle',
|
||||
thumb: 'shape-09.svg',
|
||||
type: 'triangle'
|
||||
},
|
||||
{
|
||||
title: 'Triangle',
|
||||
thumb: 'shape-10.svg',
|
||||
type: 'rtTriangle'
|
||||
},
|
||||
{
|
||||
title: 'Trapezoid',
|
||||
thumb: 'shape-11.svg',
|
||||
type: 'trapezoid'
|
||||
},
|
||||
{
|
||||
title: 'Diamond',
|
||||
thumb: 'shape-12.svg',
|
||||
type: 'diamond'
|
||||
},
|
||||
{
|
||||
title: 'Right arrow',
|
||||
thumb: 'shape-13.svg',
|
||||
type: 'rightArrow'
|
||||
},
|
||||
{
|
||||
title: 'Left-right arrow',
|
||||
thumb: 'shape-14.svg',
|
||||
type: 'leftRightArrow'
|
||||
},
|
||||
{
|
||||
title: 'Left arrow callout',
|
||||
thumb: 'shape-15.svg',
|
||||
type: 'leftArrow'
|
||||
},
|
||||
{
|
||||
title: 'Right arrow callout',
|
||||
thumb: 'shape-16.svg',
|
||||
type: 'bentUpArrow'
|
||||
},
|
||||
{
|
||||
title: 'Flow chart off page connector',
|
||||
thumb: 'shape-17.svg',
|
||||
type: 'flowChartOffpageConnector'
|
||||
},
|
||||
{
|
||||
title: 'Heart',
|
||||
thumb: 'shape-18.svg',
|
||||
type: 'heart'
|
||||
},
|
||||
{
|
||||
title: 'Math minus',
|
||||
thumb: 'shape-19.svg',
|
||||
type: 'mathMinus'
|
||||
},
|
||||
{
|
||||
title: 'Math plus',
|
||||
thumb: 'shape-20.svg',
|
||||
type: 'mathPlus'
|
||||
},
|
||||
{
|
||||
title: 'Parallelogram',
|
||||
thumb: 'shape-21.svg',
|
||||
type: 'parallelogram'
|
||||
},
|
||||
{
|
||||
title: 'Wedge rect callout',
|
||||
thumb: 'shape-22.svg',
|
||||
type: 'wedgeRectCallout'
|
||||
},
|
||||
{
|
||||
title: 'Wedge ellipse callout',
|
||||
thumb: 'shape-23.svg',
|
||||
type: 'wedgeEllipseCallout'
|
||||
},
|
||||
{
|
||||
title: 'Cloud callout',
|
||||
thumb: 'shape-24.svg',
|
||||
type: 'cloudCallout'
|
||||
}
|
||||
];
|
||||
const groups = [];
|
||||
let i = 0;
|
||||
for (let row=0; row<Math.floor(styles.length/4); row++) {
|
||||
const group = [];
|
||||
for (let cell=0; cell<4; cell++) {
|
||||
group.push(styles[i]);
|
||||
i++;
|
||||
}
|
||||
groups.push(group);
|
||||
}
|
||||
return groups;
|
||||
}
|
||||
wrapTypesTransform () {
|
||||
const map = [
|
||||
{ ui:'inline', sdk: Asc.c_oAscWrapStyle2.Inline },
|
||||
{ ui:'square', sdk: Asc.c_oAscWrapStyle2.Square },
|
||||
{ ui:'tight', sdk: Asc.c_oAscWrapStyle2.Tight },
|
||||
{ ui:'through', sdk: Asc.c_oAscWrapStyle2.Through },
|
||||
{ ui:'top-bottom', sdk: Asc.c_oAscWrapStyle2.TopAndBottom },
|
||||
{ ui:'behind', sdk: Asc.c_oAscWrapStyle2.Behind },
|
||||
{ ui:'infront', sdk: Asc.c_oAscWrapStyle2.InFront }
|
||||
];
|
||||
return {
|
||||
sdkToUi: function(type) {
|
||||
let record = map.filter(function(obj) {
|
||||
return obj.sdk === type;
|
||||
})[0];
|
||||
return record ? record.ui : '';
|
||||
},
|
||||
|
||||
uiToSdk: function(type) {
|
||||
let record = map.filter(function(obj) {
|
||||
return obj.ui === type;
|
||||
})[0];
|
||||
return record ? record.sdk : 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
getWrapType (shapeObject) {
|
||||
const wrapping = shapeObject.get_WrappingStyle();
|
||||
const shapeWrapType = this.wrapTypesTransform().sdkToUi(wrapping);
|
||||
return shapeWrapType;
|
||||
}
|
||||
|
||||
transformToSdkWrapType (value) {
|
||||
const sdkType = this.wrapTypesTransform().uiToSdk(value);
|
||||
return sdkType;
|
||||
}
|
||||
|
||||
getAlign (shapeObject) {
|
||||
return shapeObject.get_PositionH().get_Align();
|
||||
}
|
||||
|
||||
getMoveText (shapeObject) {
|
||||
return shapeObject.get_PositionV().get_RelativeFrom() == Asc.c_oAscRelativeFromV.Paragraph;
|
||||
}
|
||||
|
||||
getOverlap (shapeObject) {
|
||||
return shapeObject.get_AllowOverlap();
|
||||
}
|
||||
|
||||
getWrapDistance (shapeObject) {
|
||||
return shapeObject.get_Paddings().get_Top();
|
||||
}
|
||||
}
|
||||
Loading…
Reference in a new issue