mirror of
https://github.com/ONLYOFFICE/web-apps.git
synced 2026-04-07 14:06:16 +08:00
[DE PE SSE mobile] Added beta badge for rtl switch
This commit is contained in:
@ -4,6 +4,7 @@
|
||||
@item-border-color: #c8c7cc;
|
||||
@darkGreen: #40865c;
|
||||
@text-normal: var(--text-normal);
|
||||
@background-warning: #FF9F0A;
|
||||
|
||||
--f7-navbar-link-color: @brandColor;
|
||||
--f7-subnavbar-link-color: @brandColor;
|
||||
@ -672,6 +673,11 @@
|
||||
color: @brandColor;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.beta-badge {
|
||||
background-color: @background-warning;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
@ -7,7 +7,6 @@
|
||||
@darkGrey: #757575;
|
||||
@text-normal: var(--text-normal);
|
||||
@brand-text-on-brand: var(--brand-text-on-brand);
|
||||
|
||||
@touchColor: rgba(255,255,255,0.1);
|
||||
|
||||
--f7-navbar-shadow-image: none;
|
||||
@ -740,4 +739,9 @@
|
||||
color: @toolbar-icons;
|
||||
margin-left: 16px;
|
||||
}
|
||||
|
||||
.beta-badge {
|
||||
background-color: @brand-secondary;
|
||||
margin-left: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1182,6 +1182,18 @@ input[type="number"]::-webkit-inner-spin-button {
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
// Beta badge
|
||||
.beta-badge {
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
line-height: 16px;
|
||||
letter-spacing: 0.5px;
|
||||
color: @fill-white;
|
||||
padding: 2px 4px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@ -633,6 +633,8 @@
|
||||
"textAddToFavorites": "Add to Favorites",
|
||||
"textApplication": "Application",
|
||||
"textApplicationSettings": "Application Settings",
|
||||
"textRtlInterface": "RTL Interface",
|
||||
"textExplanationChangeDirection": "Application will be restarted for RTL interface activation",
|
||||
"textAuthor": "Author",
|
||||
"textBack": "Back",
|
||||
"textBeginningDocument": "Beginning of document",
|
||||
|
||||
@ -313,7 +313,6 @@ class MainController extends Component {
|
||||
{
|
||||
text: appOptions.canRequestSaveAs || !!appOptions.saveAsUrl || appOptions.isOffline ? t('Main.textSaveAsPdf') : t('Main.textDownloadPdf'),
|
||||
onClick: () => {
|
||||
console.log(appOptions.canRequestSaveAs || !!appOptions.saveAsUrl);
|
||||
this.api.asc_DownloadAs(new Asc.asc_CDownloadOptions(Asc.c_oAscFileType.PDF, appOptions.canRequestSaveAs || !!appOptions.saveAsUrl));
|
||||
}
|
||||
},
|
||||
|
||||
@ -3,12 +3,15 @@ import { ApplicationSettings } from "../../view/settings/ApplicationSettings";
|
||||
import { LocalStorage } from '../../../../../common/mobile/utils/LocalStorage.mjs';
|
||||
import {observer, inject} from "mobx-react";
|
||||
import { ThemesContext } from "../../../../../common/mobile/lib/controller/Themes";
|
||||
import { withTranslation } from 'react-i18next';
|
||||
import { f7 } from "framework7-react";
|
||||
|
||||
class ApplicationSettingsController extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.switchDisplayComments = this.switchDisplayComments.bind(this);
|
||||
this.props.storeApplicationSettings.changeUnitMeasurement(Common.Utils.Metric.getCurrentMetric());
|
||||
this.changeDirectionMode = this.changeDirectionMode.bind(this);
|
||||
}
|
||||
|
||||
static contextType = ThemesContext;
|
||||
@ -65,10 +68,25 @@ class ApplicationSettingsController extends Component {
|
||||
LocalStorage.setItem("de-mobile-macros-mode", value);
|
||||
}
|
||||
|
||||
changeDirection(value) {
|
||||
LocalStorage.setItem('mode-direction', value);
|
||||
changeDirectionMode(direction) {
|
||||
const { t } = this.props;
|
||||
const _t = t("Settings", { returnObjects: true });
|
||||
|
||||
this.props.storeApplicationSettings.changeDirectionMode(direction);
|
||||
LocalStorage.setItem('mode-direction', direction);
|
||||
|
||||
f7.dialog.create({
|
||||
title: _t.notcriticalErrorTitle,
|
||||
text: t('Settings.textRestartApplication'),
|
||||
buttons: [
|
||||
{
|
||||
text: _t.textOk
|
||||
}
|
||||
]
|
||||
}).open();
|
||||
}
|
||||
|
||||
|
||||
render() {
|
||||
return (
|
||||
<ApplicationSettings
|
||||
@ -79,7 +97,7 @@ class ApplicationSettingsController extends Component {
|
||||
switchDisplayComments={this.switchDisplayComments}
|
||||
switchDisplayResolved={this.switchDisplayResolved}
|
||||
setMacrosSettings={this.setMacrosSettings}
|
||||
changeDirection={this.changeDirection}
|
||||
changeDirectionMode={this.changeDirectionMode}
|
||||
changeTheme={this.context.changeTheme}
|
||||
/>
|
||||
)
|
||||
@ -87,4 +105,4 @@ class ApplicationSettingsController extends Component {
|
||||
}
|
||||
|
||||
|
||||
export default inject("storeAppOptions", "storeApplicationSettings")(observer(ApplicationSettingsController));
|
||||
export default inject("storeAppOptions", "storeApplicationSettings")(observer(withTranslation()(ApplicationSettingsController)));
|
||||
@ -32,7 +32,6 @@ export class storeApplicationSettings {
|
||||
isComments = false;
|
||||
isResolvedComments = false;
|
||||
macrosMode = 0;
|
||||
|
||||
directionMode = LocalStorage.getItem('mode-direction') || 'ltr';
|
||||
|
||||
changeDirectionMode(value) {
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
import React, { Fragment } from "react";
|
||||
import { observer, inject } from "mobx-react";
|
||||
import { Page, Navbar, List, ListItem, BlockTitle, Toggle, f7 } from "framework7-react";
|
||||
import { Page, Navbar, List, ListItem, BlockTitle, Toggle, Block } from "framework7-react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
|
||||
const PageApplicationSettings = props => {
|
||||
@ -15,6 +15,8 @@ const PageApplicationSettings = props => {
|
||||
const isHiddenTableBorders = storeApplicationSettings.isHiddenTableBorders;
|
||||
const isComments = storeApplicationSettings.isComments;
|
||||
const isResolvedComments = storeApplicationSettings.isResolvedComments;
|
||||
const directionMode = storeApplicationSettings.directionMode;
|
||||
const newDirectionMode = directionMode !== 'ltr' ? 'ltr' : 'rtl';
|
||||
|
||||
const changeMeasureSettings = value => {
|
||||
storeApplicationSettings.changeUnitMeasurement(value);
|
||||
@ -108,6 +110,23 @@ const PageApplicationSettings = props => {
|
||||
}}></ListItem>
|
||||
</List>
|
||||
}
|
||||
<List>
|
||||
<ListItem>
|
||||
<div>
|
||||
<span>{t("Settings.textRtlInterface")}</span>
|
||||
<span className="beta-badge">Beta</span>
|
||||
</div>
|
||||
<Toggle checked={directionMode !== 'ltr'}
|
||||
onToggleChange={() => {
|
||||
storeApplicationSettings.changeDirectionMode(newDirectionMode);
|
||||
props.changeDirectionMode(newDirectionMode);
|
||||
}}
|
||||
/>
|
||||
</ListItem>
|
||||
</List>
|
||||
<Block>
|
||||
<p>{t('Settings.textExplanationChangeDirection')}</p>
|
||||
</Block>
|
||||
</Page>
|
||||
);
|
||||
};
|
||||
@ -134,38 +153,6 @@ const PageThemeSettings = props => {
|
||||
)
|
||||
}
|
||||
|
||||
const PageDirection = props => {
|
||||
const { t } = useTranslation();
|
||||
const _t = t("Settings", { returnObjects: true });
|
||||
const storeApplicationSettings = props.storeApplicationSettings;
|
||||
const directionMode = storeApplicationSettings.directionMode;
|
||||
|
||||
const changeDirection = value => {
|
||||
storeApplicationSettings.changeDirectionMode(value);
|
||||
props.changeDirection(value);
|
||||
|
||||
f7.dialog.create({
|
||||
title: _t.notcriticalErrorTitle,
|
||||
text: t('Settings.textRestartApplication'),
|
||||
buttons: [
|
||||
{
|
||||
text: _t.textOk
|
||||
}
|
||||
]
|
||||
}).open();
|
||||
};
|
||||
|
||||
return (
|
||||
<Page>
|
||||
<Navbar title={t('Settings.textDirection')} backLink={_t.textBack} />
|
||||
<List mediaList>
|
||||
<ListItem radio name="direction" title={t('Settings.textLeftToRight')} checked={directionMode === 'ltr'} onChange={() => changeDirection('ltr')}></ListItem>
|
||||
<ListItem radio name="direction" title={t('Settings.textRightToLeft')} checked={directionMode === 'rtl'} onChange={() => changeDirection('rtl')}></ListItem>
|
||||
</List>
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
|
||||
const PageMacrosSettings = props => {
|
||||
const { t } = useTranslation();
|
||||
const _t = t("Settings", { returnObjects: true });
|
||||
@ -194,7 +181,6 @@ const PageMacrosSettings = props => {
|
||||
|
||||
const ApplicationSettings = inject("storeApplicationSettings", "storeAppOptions", "storeReview", "storeThemes")(observer(PageApplicationSettings));
|
||||
const MacrosSettings = inject("storeApplicationSettings")(observer(PageMacrosSettings));
|
||||
const Direction = inject("storeApplicationSettings")(observer(PageDirection));
|
||||
const ThemeSettings = inject("storeThemes")(observer(PageThemeSettings));
|
||||
|
||||
export {ApplicationSettings, MacrosSettings, Direction, ThemeSettings};
|
||||
export {ApplicationSettings, MacrosSettings, ThemeSettings};
|
||||
@ -6,7 +6,7 @@ import DocumentInfoController from "../../controller/settings/DocumentInfo";
|
||||
import { DownloadController } from "../../controller/settings/Download";
|
||||
import ApplicationSettingsController from "../../controller/settings/ApplicationSettings";
|
||||
import { DocumentFormats, DocumentMargins, DocumentColorSchemes } from "./DocumentSettings";
|
||||
import { MacrosSettings, Direction, ThemeSettings } from "./ApplicationSettings";
|
||||
import { MacrosSettings, ThemeSettings } from "./ApplicationSettings";
|
||||
import About from '../../../../../common/mobile/lib/view/About';
|
||||
import NavigationController from '../../controller/settings/Navigation';
|
||||
import SharingSettings from "../../../../../common/mobile/lib/view/SharingSettings";
|
||||
@ -63,26 +63,16 @@ const routes = [
|
||||
path: '/theme-settings/',
|
||||
component: ThemeSettings
|
||||
},
|
||||
|
||||
// Navigation
|
||||
|
||||
{
|
||||
path: '/navigation',
|
||||
component: NavigationController
|
||||
},
|
||||
|
||||
// Direction
|
||||
{
|
||||
path: '/direction/',
|
||||
component: Direction
|
||||
},
|
||||
|
||||
// Sharing Settings
|
||||
{
|
||||
path: '/sharing-settings/',
|
||||
component: SharingSettings
|
||||
},
|
||||
|
||||
// Protection
|
||||
{
|
||||
path: '/protection',
|
||||
@ -92,13 +82,11 @@ const routes = [
|
||||
path: '/protect',
|
||||
component: ProtectionDocumentController
|
||||
},
|
||||
|
||||
// Encryption
|
||||
{
|
||||
path: '/encrypt',
|
||||
component: FileEncryptionController
|
||||
},
|
||||
|
||||
// Version History
|
||||
{
|
||||
path: '/version-history',
|
||||
|
||||
@ -467,6 +467,8 @@
|
||||
"textAddress": "address:",
|
||||
"textApplication": "Application",
|
||||
"textApplicationSettings": "Application Settings",
|
||||
"textRtlInterface": "RTL Interface",
|
||||
"textExplanationChangeDirection": "Application will be restarted for RTL interface activation",
|
||||
"textAuthor": "Author",
|
||||
"textBack": "Back",
|
||||
"textCaseSensitive": "Case Sensitive",
|
||||
|
||||
@ -3,11 +3,14 @@ import { ApplicationSettings } from "../../view/settings/ApplicationSettings";
|
||||
import { LocalStorage } from '../../../../../common/mobile/utils/LocalStorage.mjs';
|
||||
import {observer, inject} from "mobx-react";
|
||||
import { ThemesContext } from "../../../../../common/mobile/lib/controller/Themes";
|
||||
import { withTranslation } from 'react-i18next';
|
||||
import { f7 } from "framework7-react";
|
||||
|
||||
class ApplicationSettingsController extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.props.storeApplicationSettings.changeUnitMeasurement(Common.Utils.Metric.getCurrentMetric());
|
||||
this.changeDirectionMode = this.changeDirectionMode.bind(this);
|
||||
}
|
||||
|
||||
static contextType = ThemesContext;
|
||||
@ -29,6 +32,24 @@ class ApplicationSettingsController extends Component {
|
||||
LocalStorage.setItem("pe-mobile-macros-mode", value);
|
||||
}
|
||||
|
||||
changeDirectionMode(direction) {
|
||||
const { t } = this.props;
|
||||
const _t = t("View.Settings", { returnObjects: true });
|
||||
|
||||
this.props.storeApplicationSettings.changeDirectionMode(direction);
|
||||
LocalStorage.setItem('mode-direction', direction);
|
||||
|
||||
f7.dialog.create({
|
||||
title: _t.notcriticalErrorTitle,
|
||||
text: t('View.Settings.textRestartApplication'),
|
||||
buttons: [
|
||||
{
|
||||
text: _t.textOk
|
||||
}
|
||||
]
|
||||
}).open();
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<ApplicationSettings
|
||||
@ -36,10 +57,11 @@ class ApplicationSettingsController extends Component {
|
||||
switchSpellCheck={this.switchSpellCheck}
|
||||
setMacrosSettings={this.setMacrosSettings}
|
||||
changeTheme={this.context.changeTheme}
|
||||
changeDirectionMode={this.changeDirectionMode}
|
||||
/>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export default inject("storeApplicationSettings", "storeAppOptions")(observer(ApplicationSettingsController));
|
||||
export default inject("storeApplicationSettings", "storeAppOptions")(observer(withTranslation()(ApplicationSettingsController)));
|
||||
@ -1,4 +1,5 @@
|
||||
import {action, observable, makeObservable} from 'mobx';
|
||||
import { LocalStorage } from '../../../../common/mobile/utils/LocalStorage.mjs';
|
||||
|
||||
export class storeApplicationSettings {
|
||||
constructor() {
|
||||
@ -10,7 +11,9 @@ export class storeApplicationSettings {
|
||||
changeUnitMeasurement: action,
|
||||
changeSpellCheck: action,
|
||||
changeMacrosSettings: action,
|
||||
changeMacrosRequest: action
|
||||
changeMacrosRequest: action,
|
||||
directionMode: observable,
|
||||
changeDirectionMode: action
|
||||
});
|
||||
}
|
||||
|
||||
@ -18,6 +21,11 @@ export class storeApplicationSettings {
|
||||
isSpellChecking = true;
|
||||
macrosMode = 0;
|
||||
macrosRequest = 0;
|
||||
directionMode = LocalStorage.getItem('mode-direction') || 'ltr';
|
||||
|
||||
changeDirectionMode(value) {
|
||||
this.directionMode = value;
|
||||
}
|
||||
|
||||
changeUnitMeasurement(value) {
|
||||
this.unitMeasurement = +value;
|
||||
|
||||
@ -1,8 +1,7 @@
|
||||
import React, {Fragment, useState} from "react";
|
||||
import React, { Fragment } from "react";
|
||||
import { observer, inject } from "mobx-react";
|
||||
import {f7, Page, Navbar, List, ListItem, BlockTitle, Toggle } from "framework7-react";
|
||||
import { Page, Navbar, List, ListItem, BlockTitle, Toggle, Block } from "framework7-react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { LocalStorage } from "../../../../../common/mobile/utils/LocalStorage.mjs";
|
||||
|
||||
const PageApplicationSettings = props => {
|
||||
const { t } = useTranslation();
|
||||
@ -10,6 +9,8 @@ const PageApplicationSettings = props => {
|
||||
const storeApplicationSettings = props.storeApplicationSettings;
|
||||
const unitMeasurement = storeApplicationSettings.unitMeasurement;
|
||||
const isSpellChecking = storeApplicationSettings.isSpellChecking;
|
||||
const directionMode = storeApplicationSettings.directionMode;
|
||||
const newDirectionMode = directionMode !== 'ltr' ? 'ltr' : 'rtl';
|
||||
|
||||
const changeMeasureSettings = value => {
|
||||
storeApplicationSettings.changeUnitMeasurement(value);
|
||||
@ -51,7 +52,6 @@ const PageApplicationSettings = props => {
|
||||
/>
|
||||
</ListItem>
|
||||
</List>
|
||||
{/*<RTLSetting />*/}
|
||||
</Fragment>
|
||||
}
|
||||
{!!isConfigSelectTheme &&
|
||||
@ -61,13 +61,28 @@ const PageApplicationSettings = props => {
|
||||
}}></ListItem>
|
||||
</List>
|
||||
}
|
||||
{/* {_isShowMacros && */}
|
||||
<List mediaList>
|
||||
<ListItem title={_t.textMacrosSettings} link="/macros-settings/" routeProps={{
|
||||
setMacrosSettings: props.setMacrosSettings
|
||||
}}></ListItem>
|
||||
</List>
|
||||
{/* } */}
|
||||
<List>
|
||||
<ListItem>
|
||||
<div>
|
||||
<span>{t("View.Settings.textRtlInterface")}</span>
|
||||
<span className="beta-badge">Beta</span>
|
||||
</div>
|
||||
<Toggle checked={directionMode !== 'ltr'}
|
||||
onToggleChange={() => {
|
||||
storeApplicationSettings.changeDirectionMode(newDirectionMode);
|
||||
props.changeDirectionMode(newDirectionMode);
|
||||
}}
|
||||
/>
|
||||
</ListItem>
|
||||
</List>
|
||||
<Block>
|
||||
<p>{t('View.Settings.textExplanationChangeDirection')}</p>
|
||||
</Block>
|
||||
</Page>
|
||||
);
|
||||
};
|
||||
@ -94,38 +109,6 @@ const PageThemeSettings = props => {
|
||||
)
|
||||
}
|
||||
|
||||
const RTLSetting = () => {
|
||||
const { t } = useTranslation();
|
||||
const _t = t("View.Settings", { returnObjects: true });
|
||||
|
||||
let direction = LocalStorage.getItem('mode-direction');
|
||||
const [isRTLMode, setRTLMode] = useState(direction === 'rtl' ? true : false);
|
||||
|
||||
const switchRTLMode = rtl => {
|
||||
LocalStorage.setItem("mode-direction", rtl ? 'rtl' : 'ltr');
|
||||
|
||||
f7.dialog.create({
|
||||
title: t('View.Settings.notcriticalErrorTitle'),
|
||||
text: t('View.Settings.textRestartApplication'),
|
||||
buttons: [
|
||||
{
|
||||
text: t('View.Settings.textOk')
|
||||
}
|
||||
]
|
||||
}).open();
|
||||
}
|
||||
|
||||
return (
|
||||
<List>
|
||||
<ListItem title={t('View.Settings.textRTL')}>
|
||||
<Toggle checked={isRTLMode}
|
||||
onToggleChange={toggle => {switchRTLMode(!toggle), setRTLMode(!toggle)}}>
|
||||
</Toggle>
|
||||
</ListItem>
|
||||
</List>
|
||||
)
|
||||
}
|
||||
|
||||
const PageMacrosSettings = props => {
|
||||
const { t } = useTranslation();
|
||||
const _t = t("View.Settings", { returnObjects: true });
|
||||
|
||||
@ -10,7 +10,6 @@ import { PresentationColorSchemes } from "./PresentationSettings";
|
||||
import About from '../../../../../common/mobile/lib/view/About';
|
||||
import SettingsPage from './SettingsPage';
|
||||
import { MainContext } from '../../page/main';
|
||||
import SharingSettings from "../../../../../common/mobile/lib/view/SharingSettings";
|
||||
import VersionHistoryController from '../../../../../common/mobile/lib/controller/VersionHistory';
|
||||
|
||||
const routes = [
|
||||
|
||||
@ -665,6 +665,8 @@
|
||||
"textAddress": "Address",
|
||||
"textApplication": "Application",
|
||||
"textApplicationSettings": "Application Settings",
|
||||
"textRtlInterface": "RTL Interface",
|
||||
"textExplanationChangeDirection": "Application will be restarted for RTL interface activation",
|
||||
"textAuthor": "Author",
|
||||
"textBack": "Back",
|
||||
"textBottom": "Bottom",
|
||||
|
||||
@ -4,6 +4,7 @@ import {observer, inject} from "mobx-react";
|
||||
import { LocalStorage } from '../../../../../common/mobile/utils/LocalStorage.mjs';
|
||||
import { withTranslation } from 'react-i18next';
|
||||
import { ThemesContext } from "../../../../../common/mobile/lib/controller/Themes";
|
||||
import { f7 } from "framework7-react";
|
||||
|
||||
class ApplicationSettingsController extends Component {
|
||||
constructor(props) {
|
||||
@ -13,6 +14,7 @@ class ApplicationSettingsController extends Component {
|
||||
this.onChangeDisplayComments = this.onChangeDisplayComments.bind(this);
|
||||
this.onRegSettings = this.onRegSettings.bind(this);
|
||||
this.initRegSettings = this.initRegSettings.bind(this);
|
||||
this.changeDirectionMode = this.changeDirectionMode.bind(this);
|
||||
this.initFormulaLangsCollection = this.initFormulaLangsCollection.bind(this);
|
||||
this.props.storeApplicationSettings.initRegData();
|
||||
this.initRegSettings();
|
||||
@ -119,8 +121,22 @@ class ApplicationSettingsController extends Component {
|
||||
Common.Notifications.trigger('changeRegSettings');
|
||||
}
|
||||
|
||||
changeDirection(value) {
|
||||
LocalStorage.setItem('mode-direction', value);
|
||||
changeDirectionMode(direction) {
|
||||
const { t } = this.props;
|
||||
const _t = t("View.Settings", { returnObjects: true });
|
||||
|
||||
this.props.storeApplicationSettings.changeDirectionMode(direction);
|
||||
LocalStorage.setItem('mode-direction', direction);
|
||||
|
||||
f7.dialog.create({
|
||||
title: _t.notcriticalErrorTitle,
|
||||
text: t('View.Settings.textRestartApplication'),
|
||||
buttons: [
|
||||
{
|
||||
text: _t.textOk
|
||||
}
|
||||
]
|
||||
}).open();
|
||||
}
|
||||
|
||||
render() {
|
||||
@ -135,7 +151,7 @@ class ApplicationSettingsController extends Component {
|
||||
onChangeMacrosSettings={this.onChangeMacrosSettings}
|
||||
onFormulaLangChange={this.onFormulaLangChange}
|
||||
onRegSettings={this.onRegSettings}
|
||||
changeDirection={this.changeDirection}
|
||||
changeDirectionMode={this.changeDirectionMode}
|
||||
changeTheme={this.context.changeTheme}
|
||||
/>
|
||||
)
|
||||
|
||||
@ -152,7 +152,7 @@ const PageCellStyle = props => {
|
||||
let stylesSlide = cellStyles.slice(indexSlide * countStylesSlide, (indexSlide * countStylesSlide) + countStylesSlide);
|
||||
|
||||
return (
|
||||
<SwiperSlide>
|
||||
<SwiperSlide key={indexSlide}>
|
||||
<List className="cell-styles-list">
|
||||
{stylesSlide.map((elem, index) => (
|
||||
<ListItem key={index} className={elem.name === styleName ? "item-theme active" : "item-theme"} onClick={() => props.onStyleClick(elem.name)}>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
import React, { Fragment } from "react";
|
||||
import { observer, inject } from "mobx-react";
|
||||
import { Page, Navbar, List, ListItem, BlockTitle, Toggle, Icon, f7 } from "framework7-react";
|
||||
import { Page, Navbar, List, ListItem, BlockTitle, Toggle, Icon, f7, Block } from "framework7-react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
|
||||
const PageApplicationSettings = props => {
|
||||
@ -20,6 +20,8 @@ const PageApplicationSettings = props => {
|
||||
const isRefStyle = storeApplicationSettings.isRefStyle;
|
||||
const isComments = storeApplicationSettings.isComments;
|
||||
const isResolvedComments = storeApplicationSettings.isResolvedComments;
|
||||
const directionMode = storeApplicationSettings.directionMode;
|
||||
const newDirectionMode = directionMode !== 'ltr' ? 'ltr' : 'rtl';
|
||||
|
||||
const changeMeasureSettings = value => {
|
||||
storeApplicationSettings.changeUnitMeasurement(value);
|
||||
@ -102,18 +104,28 @@ const PageApplicationSettings = props => {
|
||||
}}></ListItem>
|
||||
</List>
|
||||
}
|
||||
|
||||
{/*<List mediaList>*/}
|
||||
{/* <ListItem title={t("View.Settings.textDirection")} link="/direction/" routeProps={{changeDirection: props.changeDirection}}></ListItem>*/}
|
||||
{/*</List>*/}
|
||||
{/* } */}
|
||||
{/* {_isShowMacros && */}
|
||||
<List>
|
||||
<ListItem title={_t.textMacrosSettings} link="/macros-settings/" routeProps={{
|
||||
onChangeMacrosSettings: props.onChangeMacrosSettings
|
||||
}}></ListItem>
|
||||
</List>
|
||||
{/* } */}
|
||||
<List>
|
||||
<ListItem>
|
||||
<div>
|
||||
<span>{t("View.Settings.textRtlInterface")}</span>
|
||||
<span className="beta-badge">Beta</span>
|
||||
</div>
|
||||
<Toggle checked={directionMode !== 'ltr'}
|
||||
onToggleChange={() => {
|
||||
storeApplicationSettings.changeDirectionMode(newDirectionMode);
|
||||
props.changeDirectionMode(newDirectionMode);
|
||||
}}
|
||||
/>
|
||||
</ListItem>
|
||||
</List>
|
||||
<Block>
|
||||
<p>{t('View.Settings.textExplanationChangeDirection')}</p>
|
||||
</Block>
|
||||
</Page>
|
||||
);
|
||||
};
|
||||
@ -140,38 +152,6 @@ const PageThemeSettings = props => {
|
||||
)
|
||||
};
|
||||
|
||||
const PageDirection = props => {
|
||||
const { t } = useTranslation();
|
||||
const _t = t("View.Settings", { returnObjects: true });
|
||||
const storeApplicationSettings = props.storeApplicationSettings;
|
||||
const directionMode = storeApplicationSettings.directionMode;
|
||||
|
||||
const changeDirection = value => {
|
||||
storeApplicationSettings.changeDirectionMode(value);
|
||||
props.changeDirection(value);
|
||||
|
||||
f7.dialog.create({
|
||||
title: _t.notcriticalErrorTitle,
|
||||
text: t('View.Settings.textRestartApplication'),
|
||||
buttons: [
|
||||
{
|
||||
text: _t.textOk
|
||||
}
|
||||
]
|
||||
}).open();
|
||||
};
|
||||
|
||||
return (
|
||||
<Page>
|
||||
<Navbar title={t('View.Settings.textDirection')} backLink={_t.textBack} />
|
||||
<List mediaList>
|
||||
<ListItem radio name="direction" title={t('View.Settings.textLeftToRight')} checked={directionMode === 'ltr'} onChange={() => changeDirection('ltr')}></ListItem>
|
||||
<ListItem radio name="direction" title={t('View.Settings.textRightToLeft')} checked={directionMode === 'rtl'} onChange={() => changeDirection('rtl')}></ListItem>
|
||||
</List>
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
|
||||
const PageRegionalSettings = props => {
|
||||
const { t } = useTranslation();
|
||||
const _t = t("View.Settings", { returnObjects: true });
|
||||
@ -257,7 +237,6 @@ const ApplicationSettings = inject("storeApplicationSettings", "storeAppOptions"
|
||||
const MacrosSettings = inject("storeApplicationSettings")(observer(PageMacrosSettings));
|
||||
const RegionalSettings = inject("storeApplicationSettings")(observer(PageRegionalSettings));
|
||||
const FormulaLanguage = inject("storeApplicationSettings")(observer(PageFormulaLanguage));
|
||||
const Direction = inject("storeApplicationSettings")(observer(PageDirection));
|
||||
const ThemeSettings = inject("storeThemes")(observer(PageThemeSettings));
|
||||
|
||||
export {
|
||||
@ -265,6 +244,5 @@ export {
|
||||
MacrosSettings,
|
||||
RegionalSettings,
|
||||
FormulaLanguage,
|
||||
Direction,
|
||||
ThemeSettings
|
||||
};
|
||||
@ -7,10 +7,7 @@ import SpreadsheetInfoController from '../../controller/settings/SpreadsheetInfo
|
||||
import { DownloadWithTranslation } from '../../controller/settings/Download.jsx';
|
||||
import { SpreadsheetColorSchemes, SpreadsheetFormats, SpreadsheetMargins } from './SpreadsheetSettings.jsx';
|
||||
import { MacrosSettings, RegionalSettings, FormulaLanguage, ThemeSettings } from './ApplicationSettings.jsx';
|
||||
// import SpreadsheetAbout from './SpreadsheetAbout.jsx';
|
||||
import About from '../../../../../common/mobile/lib/view/About';
|
||||
import { Direction } from '../../../../../spreadsheeteditor/mobile/src/view/settings/ApplicationSettings';
|
||||
// import SharingSettings from "../../../../../common/mobile/lib/view/SharingSettings";
|
||||
import SettingsPage from './SettingsPage';
|
||||
import { MainContext } from '../../page/main';
|
||||
import VersionHistoryController from '../../../../../common/mobile/lib/controller/VersionHistory';
|
||||
@ -69,10 +66,6 @@ const routes = [
|
||||
path: '/about/',
|
||||
component: About
|
||||
},
|
||||
{
|
||||
path: '/direction/',
|
||||
component: Direction
|
||||
},
|
||||
// Version History
|
||||
{
|
||||
path: '/version-history',
|
||||
|
||||
Reference in New Issue
Block a user