[DE] Add recent-fonts

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

@@ -1,10 +1,13 @@
 import {action, observable, computed, makeObservable} from 'mobx';
+import { LocalStorage } from '../../../../common/mobile/utils/LocalStorage';
+
 
 export class storeTextSettings {
     constructor() {
         makeObservable(this, {
             fontsArray: observable,
             fontName: observable,
+            arrayRecentFonts:observable,
             fontSize: observable,
             isBold: observable,
             isItalic: observable,
@@ -39,11 +42,13 @@ export class storeTextSettings {
             changeCustomTextColors: action,
             resetLineSpacing: action,
             resetBackgroundColor: action,
-            changeFontFamily: action
+            changeFontFamily: action,
+            addFontToRecent:action
         });
     }
 
     fontsArray = [];
+    arrayRecentFonts = [];
     fontName = '';
     fontSize = undefined;
     isBold = false;
@@ -80,6 +85,9 @@ export class storeTextSettings {
         });
 
         this.fontsArray = array;
+
+        this.arrayRecentFonts = LocalStorage.getItem('dde-settings-recent-fonts');
+        this.arrayRecentFonts = this.arrayRecentFonts ? this.arrayRecentFonts.split(';') : [];
     }
     resetFontName (font) {
         let name = (typeof font.get_Name) === "function" ? font.get_Name() : font.asc_getName();
@@ -173,6 +181,20 @@ export class storeTextSettings {
         this.fontName = name;
     }
 
+    addFontToRecent (font) {
+        this.arrayRecentFonts.forEach(item => {
+            if (item === font) this.arrayRecentFonts.splice(this.arrayRecentFonts.indexOf(item),1);
+        })
+        this.arrayRecentFonts.unshift(font);
+
+        if (this.arrayRecentFonts.length > 5) this.arrayRecentFonts.splice(4,1);
+        
+        let arr = [];
+        this.arrayRecentFonts.forEach(item => arr.push(item));
+        arr = arr.join(';');
+        LocalStorage.setItem('dde-settings-recent-fonts', arr);
+    }
+
     resetLineSpacing (vc) {
         let line = (vc.get_Line() === null || vc.get_LineRule() === null || vc.get_LineRule() != 1) ? -1 : vc.get_Line();
         this.lineSpacing = line;

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

@@ -14,6 +14,7 @@ const PageFonts = props => {
     const displaySize = typeof size === 'undefined' ? t('Edit.textAuto') : size + ' ' + t('Edit.textPt');
     const curFontName = storeTextSettings.fontName;
     const fonts = storeTextSettings.fontsArray;
+    const arrayFonts = storeTextSettings.arrayRecentFonts;
     const [vlFonts, setVlFonts] = useState({
         vlData: {
             items: [],
@@ -56,6 +57,17 @@ const PageFonts = props => {
                     </div>
                 </ListItem>
             </List>
+            <List>
+                {arrayFonts.map((item,index) => (
+                    <ListItem
+                        key={index}
+                        link="#"
+                        title={item}
+                        style={{fontFamily: `${item}`}}
+                        onClick={() => {storeTextSettings.changeFontFamily(item); props.changeFontFamily(item);}}
+                    /> 
+                ))}
+            </List>
             <BlockTitle>{t('Edit.textFonts')}</BlockTitle>
             <List virtualList virtualListParams={{
                 items: fonts,
@@ -69,7 +81,8 @@ const PageFonts = props => {
                             checked={curFontName === item.name}
                             title={item.name}
                             style={{fontFamily: `${item.name}`}}
-                            onClick={() => {storeTextSettings.changeFontFamily(item.name); props.changeFontFamily(item.name)}}
+                            onClick={() => {storeTextSettings.changeFontFamily(item.name); props.changeFontFamily(item.name);
+                                storeTextSettings.addFontToRecent(item.name)}}
                         ></ListItem>
                     ))}
                 </ul>