[DE mobile] Maked Application Settings

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

@@ -6,9 +6,67 @@ class ApplicationSettingsController extends Component {
         super(props);
     }
 
+    setUnitMeasurement(value) {
+        const api = Common.EditorApi.get();
+        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));
+    }
+
+    switchSpellCheck(value) {
+        const api = Common.EditorApi.get();
+        // let state = value === '1' ? true : false;
+        // Common.localStorage.setItem("de-mobile-spellcheck", value ? 1 : 0);
+        // Common.Utils.InternalSettings.set("de-mobile-spellcheck", value);
+        Common.Utils.InternalSettings.set("de-mobile-spellcheck", value);
+        api.asc_setSpellCheck(value);
+    }
+
+    switchNoCharacters(value) {
+        const api = Common.EditorApi.get();
+        // Common.localStorage.setItem("de-mobile-no-characters", value);
+        api.put_ShowParaMarks(value);
+    }
+
+    switchShowTableEmptyLine(value) {
+        const api = Common.EditorApi.get();
+        // Common.localStorage.setItem("de-mobile-hidden-borders", state);
+        api.put_ShowTableEmptyLine(value);
+    }
+
+    switchDisplayComments(value) {
+        const api = Common.EditorApi.get();
+        if (!value) {
+            api.asc_hideComments();
+            this.switchDisplayResolved(value);
+            // Common.localStorage.setBool("de-settings-resolvedcomment", false);
+        } else {
+            // let resolved = Common.localStorage.getBool("de-settings-resolvedcomment");
+            api.asc_showComments(value);
+        }
+        // Common.localStorage.setBool("de-mobile-settings-livecomment", value);
+    }
+
+    switchDisplayResolved(value) {
+        const api = Common.EditorApi.get();
+        // let displayComments = Common.localStorage.getBool("de-mobile-settings-livecomment");
+        if (value) {
+            api.asc_showComments(value);
+        }
+        // Common.localStorage.setBool("de-settings-resolvedcomment", value);
+    }
+
     render() {
         return (
-            <ApplicationSettings />
+            <ApplicationSettings 
+                setUnitMeasurement={this.setUnitMeasurement}
+                switchSpellCheck={this.switchSpellCheck}
+                switchNoCharacters={this.switchNoCharacters}
+                switchShowTableEmptyLine={this.switchShowTableEmptyLine}
+                switchDisplayComments={this.switchDisplayComments}
+                switchDisplayResolved={this.switchDisplayResolved}                 
+            />
         )
     }
 }

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

@@ -1,31 +1,62 @@
-import {action, observable, computed} from 'mobx';
+import {action, observable} from 'mobx';
 
 export class storeApplicationSettings {
     @observable isActiveUnitCentimeter = false;
     @observable isActiveUnitPoint = true;
     @observable isActiveUnitInch = false;
 
+    @observable isSpellChecking = true;
+
+    @observable isNonprintingCharacters = false;
+    @observable isHiddenTableBorders = false;
+
+    @observable isComments = true;
+    @observable isResolvedComments = true;
+
     @action changeUnitMeasurement(value) {
-        const api = Common.EditorApi.get();
+        value = (value !== null) ? parseInt(value) : Common.Utils.Metric.getDefaultMetric();
         console.log(value);
-        if(+value === Common.Utils.Metric.c_MetricUnits.inch) {
+
-            api.asc_SetDocumentUnits(Asc.c_oAscDocumentUnits.Inch);
+        if(value === Common.Utils.Metric.c_MetricUnits.inch) {
             this.isActiveUnitCentimeter = false;
             this.isActiveUnitPoint = false;
             this.isActiveUnitInch = true;
         }
-        else if(+value === Common.Utils.Metric.c_MetricUnits.pt) {
+        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;
         }
     }
-   
+
+    @action changeSpellCheck(value) {
+        this.isSpellChecking = value;
+        console.log(this.isSpellChecking);
+    }
+
+    @action changeNoCharacters(value) {
+        this.isNonprintingCharacters = value;
+        console.log(this.isNonprintingCharacters);
+    }
+
+    @action changeShowTableEmptyLine(value) {
+        this.isHiddenTableBorders = value;
+        console.log(this.isHiddenTableBorders);
+    }
+
+    @action changeDisplayComments(value) {
+        this.isComments = value;
+        if (!value) this.changeDisplayResolved(value);
+        console.log(this.isComments);
+    }
+
+    @action changeDisplayResolved(value) {
+        this.isResolvedComments = value;
+        console.log(this.isResolvedComments);
+    }
 }

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

@@ -10,51 +10,76 @@ const PageApplicationSettings = (props) => {
     const isActiveUnitCentimeter = store.isActiveUnitCentimeter;
     const isActiveUnitPoint = store.isActiveUnitPoint;
     const isActiveUnitInch = store.isActiveUnitInch;
-    // const changeUnitMeasurement = store.changeUnitMeasurement;
+    const isSpellChecking = store.isSpellChecking;
+    const isNonprintingCharacters = store.isNonprintingCharacters;
+    const isHiddenTableBorders = store.isHiddenTableBorders;
+    const isComments = store.isComments;
+    const isResolvedComments = store.isResolvedComments;
 
-    // const unitMeasurementChange = e => {
+    const changeMeasure = (e) => {
-    //     const api = Common.EditorApi.get();
+        store.changeUnitMeasurement(e.target.value);
-    //     let value = e.target.value;
+        props.setUnitMeasurement(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.textCentimeter} value="0" name="unit-of-measurement" checked={isActiveUnitCentimeter} onChange={changeMeasure}></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.textPoint} value="1" name="unit-of-measurement" checked={isActiveUnitPoint} onChange={changeMeasure}></ListItem>
-                <ListItem radio radioIcon="end" title={_t.textInch} value="2" name="unit-of-measurement" checked={isActiveUnitInch} onChange={e => store.changeUnitMeasurement(e.target.value)}></ListItem>
+                <ListItem radio radioIcon="end" title={_t.textInch} value="2" name="unit-of-measurement" checked={isActiveUnitInch} onChange={changeMeasure}></ListItem>
             </List>
             <List>
                 <ListItem>
                     <span>{_t.textSpellcheck}</span>
-                    <Toggle defaultChecked />
+                    <Toggle checked={isSpellChecking} 
+                        onChange={() => {
+                            store.changeSpellCheck(!isSpellChecking);
+                            props.switchSpellCheck(!isSpellChecking);
+                        }} 
+                    />
                 </ListItem>
             </List>
             <List>
                 <ListItem>
                     <span>{_t.textNoCharacters}</span>
-                    <Toggle />
+                    <Toggle checked={isNonprintingCharacters} 
+                        onChange={() => { 
+                            store.changeNoCharacters(!isNonprintingCharacters);
+                            props.switchNoCharacters(!isNonprintingCharacters);
+                        }} 
+                    />
                 </ListItem>
                 <ListItem>
                     <span>{_t.textHiddenTableBorders}</span>
-                    <Toggle />
+                    <Toggle checked={isHiddenTableBorders} 
+                        onChange={() => { 
+                            store.changeShowTableEmptyLine(!isHiddenTableBorders);
+                            props.switchShowTableEmptyLine(!isHiddenTableBorders);
+                        }}
+                    />
                 </ListItem>
             </List>
             <BlockTitle>{_t.textCommentsDisplay}</BlockTitle>
             <List>
                 <ListItem>
                     <span>{_t.textComments}</span>
-                    <Toggle />
+                    <Toggle checked={isComments} 
+                        onChange={() => {
+                            store.changeDisplayComments(!isComments);
+                            props.switchDisplayComments(!isComments);
+                        }} 
+                    />
                 </ListItem>
                 <ListItem>
                     <span>{_t.textResolvedComments}</span>
-                    <Toggle />
+                    <Toggle checked={isResolvedComments} disabled={!isComments ? true : false}
+                        onChange={() => {
+                            store.changeDisplayResolved(!isResolvedComments);
+                            props.switchDisplayResolved(!isResolvedComments);
+                        }}
+                    />
                 </ListItem>
             </List>
             <List mediaList>