[DE mobile] Make Application Settings

apps/documenteditor/mobile/locale/en.json

@@ -29,7 +29,24 @@
     "textLastModified": "Last Modified",
     "textApplication": "Application",
     "textLoading": "Loading...",
-    "textAuthor": "Author"
+    "textAuthor": "Author",
+    "textUnitOfMeasurement": "Unit Of Measurement",
+    "textCentimeter": "Centimeter",
+    "textPoint": "Point",
+    "textInch": "Inch",
+    "textSpellcheck": "Spell Checking",
+    "textNoCharacters": "Nonprinting Characters",
+    "textHiddenTableBorders": "Hidden Table Borders",
+    "textCommentsDisplay": "Comments Display",
+    "textComments": "Comments",
+    "textResolvedComments": "Resolved Comments",
+    "textMacrosSettings": "Macros Settings",
+    "textDisableAll": "Disable All",
+    "textDisableAllMacrosWithoutNotification": "Disable all macros without notification",
+    "textShowNotification": "Show Notification",
+    "textDisableAllMacrosWithNotification": "Disable all macros with notification",
+    "textEnableAll": "Enable All",
+    "textEnableAllMacrosWithoutNotification": "Enable all macros without notification"
   },
   "Collaboration": {
     "textEditUser": "Users who are editing the file:"

apps/documenteditor/mobile/src/controller/settings/ApplicationSettings.jsx

@@ -0,0 +1,17 @@
+import React, { Component } from "react";
+import { ApplicationSettings } from "../../view/settings/ApplicationSettings";
+
+class ApplicationSettingsController extends Component {
+    constructor(props) {
+        super(props);
+    }
+
+    render() {
+        return (
+            <ApplicationSettings />
+        )
+    }
+}
+
+
+export default ApplicationSettingsController;

apps/documenteditor/mobile/src/store/applicationSettings.js

@@ -0,0 +1,31 @@
+import {action, observable, computed} from 'mobx';
+
+export class storeApplicationSettings {
+    @observable isActiveUnitCentimeter = false;
+    @observable isActiveUnitPoint = true;
+    @observable isActiveUnitInch = false;
+
+    @action changeUnitMeasurement(value) {
+        const api = Common.EditorApi.get();
+        console.log(value);
+        if(+value === Common.Utils.Metric.c_MetricUnits.inch) {
+            api.asc_SetDocumentUnits(Asc.c_oAscDocumentUnits.Inch);
+            this.isActiveUnitCentimeter = false;
+            this.isActiveUnitPoint = false;
+            this.isActiveUnitInch = true;
+        }
+        else if(+value === Common.Utils.Metric.c_MetricUnits.pt) {
+            api.asc_SetDocumentUnits(Asc.c_oAscDocumentUnits.Point);
+            this.isActiveUnitCentimeter = false;
+            this.isActiveUnitPoint = true;
+            this.isActiveUnitInch = false;
+        }
+        else {
+            api.asc_SetDocumentUnits(Asc.c_oAscDocumentUnits.Millimeter);
+            this.isActiveUnitCentimeter = true;
+            this.isActiveUnitPoint = false;
+            this.isActiveUnitInch = false;
+        }
+    }
+   
+}

apps/documenteditor/mobile/src/store/mainStore.js

@@ -9,6 +9,7 @@ import {storeImageSettings} from "./imageSettings";
 import {storeTableSettings} from "./tableSettings";
 import {storeChartSettings} from "./chartSettings";
 import {storeDocumentInfo} from "./documentInfo";
+import {storeApplicationSettings} from './applicationSettings';
 
 export const stores = {
     storeFocusObjects: new storeFocusObjects(),
@@ -20,6 +21,7 @@ export const stores = {
     storeChartSettings: new storeChartSettings(),
     storeImageSettings: new storeImageSettings(),
     storeTableSettings: new storeTableSettings(),
-    storeDocumentInfo: new storeDocumentInfo()
+    storeDocumentInfo: new storeDocumentInfo(),
+    storeApplicationSettings: new storeApplicationSettings()
 };
 

apps/documenteditor/mobile/src/view/settings/ApplicationSettings.jsx

@@ -0,0 +1,86 @@
+import React, {Fragment} from "react";
+import { observer, inject } from "mobx-react";
+import { Page, Navbar, List, ListItem, BlockTitle, Toggle } from "framework7-react";
+import { useTranslation } from "react-i18next";
+
+const PageApplicationSettings = (props) => {
+    const { t } = useTranslation();
+    const _t = t("Settings", { returnObjects: true });
+    const store = props.storeApplicationSettings;
+    const isActiveUnitCentimeter = store.isActiveUnitCentimeter;
+    const isActiveUnitPoint = store.isActiveUnitPoint;
+    const isActiveUnitInch = store.isActiveUnitInch;
+    // const changeUnitMeasurement = store.changeUnitMeasurement;
+
+    // const unitMeasurementChange = e => {
+    //     const api = Common.EditorApi.get();
+    //     let value = e.target.value;
+    //     value = (value!==null) ? parseInt(value) : Common.Utils.Metric.getDefaultMetric();
+    //     Common.Utils.Metric.setCurrentMetric(value);
+    //     // Common.localStorage.setItem("de-mobile-settings-unit", value);
+    //     api.asc_SetDocumentUnits((value==Common.Utils.Metric.c_MetricUnits.inch) ? Asc.c_oAscDocumentUnits.Inch : ((value==Common.Utils.Metric.c_MetricUnits.pt) ? Asc.c_oAscDocumentUnits.Point : Asc.c_oAscDocumentUnits.Millimeter));
+    // }
+
+    return (
+        <Page>
+            <Navbar title={_t.textApplicationSettings} backLink={_t.textBack} />
+            <BlockTitle>{_t.textUnitOfMeasurement}</BlockTitle>
+            <List>
+                <ListItem radio radioIcon="end" title={_t.textCentimeter} value="0" name="unit-of-measurement" checked={isActiveUnitCentimeter} onChange={e => store.changeUnitMeasurement(e.target.value)}></ListItem>
+                <ListItem radio radioIcon="end" title={_t.textPoint} value="1" name="unit-of-measurement" checked={isActiveUnitPoint} onChange={e => store.changeUnitMeasurement(e.target.value)}></ListItem>
+                <ListItem radio radioIcon="end" title={_t.textInch} value="2" name="unit-of-measurement" checked={isActiveUnitInch} onChange={e => store.changeUnitMeasurement(e.target.value)}></ListItem>
+            </List>
+            <List>
+                <ListItem>
+                    <span>{_t.textSpellcheck}</span>
+                    <Toggle defaultChecked />
+                </ListItem>
+            </List>
+            <List>
+                <ListItem>
+                    <span>{_t.textNoCharacters}</span>
+                    <Toggle />
+                </ListItem>
+                <ListItem>
+                    <span>{_t.textHiddenTableBorders}</span>
+                    <Toggle />
+                </ListItem>
+            </List>
+            <BlockTitle>{_t.textCommentsDisplay}</BlockTitle>
+            <List>
+                <ListItem>
+                    <span>{_t.textComments}</span>
+                    <Toggle />
+                </ListItem>
+                <ListItem>
+                    <span>{_t.textResolvedComments}</span>
+                    <Toggle />
+                </ListItem>
+            </List>
+            <List mediaList>
+                <ListItem title={_t.textMacrosSettings} link="/macros-settings/"></ListItem>
+            </List>
+        </Page>
+    );
+};
+
+const PageMacrosSettings = () => {
+    const { t } = useTranslation();
+    const _t = t("Settings", { returnObjects: true });
+
+    return (
+        <Page>
+            <Navbar title={_t.textMacrosSettings} backLink={_t.textBack} />
+            <List mediaList>
+                <ListItem radio name="demo-media-radio" value="1" title={_t.textDisableAll} text={_t.textDisableAllMacrosWithoutNotification}></ListItem>
+                <ListItem radio defaultChecked name="demo-media-radio" value="2" title={_t.textShowNotification} text={_t.textDisableAllMacrosWithNotification}></ListItem>
+                <ListItem radio name="demo-media-radio" value="3" title={_t.textEnableAll} text={_t.textEnableAllMacrosWithoutNotification}></ListItem>
+            </List>
+        </Page>
+    )
+}
+
+const ApplicationSettings = inject("storeApplicationSettings")(observer(PageApplicationSettings));
+const MacrosSettings = inject("storeApplicationSettings")(observer(PageMacrosSettings));
+
+export {ApplicationSettings, MacrosSettings};

apps/documenteditor/mobile/src/view/settings/Settings.jsx

@@ -6,7 +6,9 @@ import {Device} from '../../../../../common/mobile/utils/device';
 
 import DocumentSettingsController from "../../controller/settings/DocumentSettings";
 import DocumentInfoController from "../../controller/settings/DocumentInfo";
+import ApplicationSettingsController from "../../controller/settings/ApplicationSettings";
 import { DocumentFormats, DocumentMargins } from "./DocumentSettings";
+import { MacrosSettings } from "./ApplicationSettings";
 
 const routes = [
     {
@@ -28,6 +30,14 @@ const routes = [
     {
         path: "/document-info/",
         component: DocumentInfoController,
+    },
+    {
+        path: '/application-settings',
+        component: ApplicationSettingsController
+    },
+    {
+        path: '/macros-settings/',
+        component: MacrosSettings
     }
 ];
 
@@ -60,7 +70,7 @@ const SettingsList = withTranslation()(props => {
                     <ListItem link="#" title={_t.textDocumentSettings} onClick={onoptionclick.bind(this, '/document-settings/')}>
                         <Icon slot="media" icon="icon-doc-setup"></Icon>
                     </ListItem>
-                    <ListItem title={_t.textApplicationSettings} link="#">
+                    <ListItem title={_t.textApplicationSettings} link="#" onClick={onoptionclick.bind(this, "/application-settings/")}>
                         <Icon slot="media" icon="icon-app-settings"></Icon>
                     </ListItem>
                     <ListItem title={_t.textDownload} link="#">