2019-06-29 13:37:21 +02:00
|
|
|
// @flow
|
|
|
|
|
|
|
|
import * as React from 'react';
|
2020-03-07 11:49:32 +01:00
|
|
|
import {ScrollView} from "react-native";
|
2019-06-25 22:20:24 +02:00
|
|
|
import ThemeManager from '../utils/ThemeManager';
|
|
|
|
import i18n from "i18n-js";
|
2019-07-31 14:22:36 +02:00
|
|
|
import AsyncStorageManager from "../utils/AsyncStorageManager";
|
2019-08-21 17:07:27 +02:00
|
|
|
import NotificationsManager from "../utils/NotificationsManager";
|
2020-03-07 11:49:32 +01:00
|
|
|
import {Card, List, Switch, ToggleButton} from 'react-native-paper';
|
2020-03-08 19:50:17 +01:00
|
|
|
import {Appearance} from "react-native-appearance";
|
2019-06-25 22:20:24 +02:00
|
|
|
|
2019-06-29 13:37:21 +02:00
|
|
|
type Props = {
|
|
|
|
navigation: Object,
|
|
|
|
};
|
|
|
|
|
|
|
|
type State = {
|
|
|
|
nightMode: boolean,
|
2020-03-08 19:50:17 +01:00
|
|
|
nightModeFollowSystem: boolean,
|
2019-06-29 13:37:21 +02:00
|
|
|
proxiwashNotifPickerSelected: string,
|
2019-09-12 23:02:28 +02:00
|
|
|
startScreenPickerSelected: string,
|
2019-06-29 13:37:21 +02:00
|
|
|
};
|
|
|
|
|
2019-06-29 15:43:57 +02:00
|
|
|
/**
|
|
|
|
* Class defining the Settings screen. This screen shows controls to modify app preferences.
|
|
|
|
*/
|
2019-06-29 13:37:21 +02:00
|
|
|
export default class SettingsScreen extends React.Component<Props, State> {
|
2019-06-25 22:20:24 +02:00
|
|
|
state = {
|
2019-07-31 14:22:36 +02:00
|
|
|
nightMode: ThemeManager.getNightMode(),
|
2020-03-08 19:50:17 +01:00
|
|
|
nightModeFollowSystem: AsyncStorageManager.getInstance().preferences.nightModeFollowSystem.current === '1' &&
|
2020-03-29 15:59:25 +02:00
|
|
|
Appearance.getColorScheme() !== 'no-preference',
|
2019-07-31 14:22:36 +02:00
|
|
|
proxiwashNotifPickerSelected: AsyncStorageManager.getInstance().preferences.proxiwashNotifications.current,
|
2019-09-12 23:02:28 +02:00
|
|
|
startScreenPickerSelected: AsyncStorageManager.getInstance().preferences.defaultStartScreen.current,
|
2019-06-25 22:20:24 +02:00
|
|
|
};
|
|
|
|
|
2020-02-23 21:47:36 +01:00
|
|
|
onProxiwashNotifPickerValueChange: Function;
|
|
|
|
onStartScreenPickerValueChange: Function;
|
|
|
|
onToggleNightMode: Function;
|
2020-03-08 19:50:17 +01:00
|
|
|
onToggleNightModeFollowSystem: Function;
|
2020-02-23 21:47:36 +01:00
|
|
|
|
|
|
|
constructor() {
|
|
|
|
super();
|
|
|
|
this.onProxiwashNotifPickerValueChange = this.onProxiwashNotifPickerValueChange.bind(this);
|
|
|
|
this.onStartScreenPickerValueChange = this.onStartScreenPickerValueChange.bind(this);
|
|
|
|
this.onToggleNightMode = this.onToggleNightMode.bind(this);
|
2020-03-08 19:50:17 +01:00
|
|
|
this.onToggleNightModeFollowSystem = this.onToggleNightModeFollowSystem.bind(this);
|
2020-02-23 21:47:36 +01:00
|
|
|
}
|
|
|
|
|
2019-06-29 15:43:57 +02:00
|
|
|
/**
|
2020-03-29 15:59:25 +02:00
|
|
|
* Saves the value for the proxiwash reminder notification time
|
2019-06-29 15:43:57 +02:00
|
|
|
*
|
|
|
|
* @param value The value to store
|
|
|
|
*/
|
2019-06-29 13:37:21 +02:00
|
|
|
onProxiwashNotifPickerValueChange(value: string) {
|
2020-03-08 13:57:09 +01:00
|
|
|
if (value != null) {
|
|
|
|
let key = AsyncStorageManager.getInstance().preferences.proxiwashNotifications.key;
|
|
|
|
AsyncStorageManager.getInstance().savePref(key, value);
|
|
|
|
this.setState({
|
|
|
|
proxiwashNotifPickerSelected: value
|
|
|
|
});
|
|
|
|
let intVal = 0;
|
|
|
|
if (value !== 'never')
|
|
|
|
intVal = parseInt(value);
|
|
|
|
NotificationsManager.setMachineReminderNotificationTime(intVal);
|
|
|
|
}
|
2019-06-28 13:47:52 +02:00
|
|
|
}
|
|
|
|
|
2019-09-12 23:02:28 +02:00
|
|
|
/**
|
2020-03-29 15:59:25 +02:00
|
|
|
* Saves the value for the proxiwash reminder notification time
|
2019-09-12 23:02:28 +02:00
|
|
|
*
|
|
|
|
* @param value The value to store
|
|
|
|
*/
|
|
|
|
onStartScreenPickerValueChange(value: string) {
|
2020-03-07 11:49:32 +01:00
|
|
|
if (value != null) {
|
|
|
|
let key = AsyncStorageManager.getInstance().preferences.defaultStartScreen.key;
|
|
|
|
AsyncStorageManager.getInstance().savePref(key, value);
|
|
|
|
this.setState({
|
|
|
|
startScreenPickerSelected: value
|
|
|
|
});
|
|
|
|
}
|
2019-09-12 23:02:28 +02:00
|
|
|
}
|
|
|
|
|
2019-06-29 15:43:57 +02:00
|
|
|
/**
|
|
|
|
* Returns a picker allowing the user to select the proxiwash reminder notification time
|
|
|
|
*
|
|
|
|
* @returns {React.Node}
|
|
|
|
*/
|
2019-06-29 13:37:21 +02:00
|
|
|
getProxiwashNotifPicker() {
|
2019-06-28 13:47:52 +02:00
|
|
|
return (
|
2020-03-07 11:49:32 +01:00
|
|
|
<ToggleButton.Row
|
2020-02-23 21:47:36 +01:00
|
|
|
onValueChange={this.onProxiwashNotifPickerValueChange}
|
2020-03-06 23:15:01 +01:00
|
|
|
value={this.state.proxiwashNotifPickerSelected}
|
2019-06-28 13:47:52 +02:00
|
|
|
>
|
2020-03-07 11:49:32 +01:00
|
|
|
<ToggleButton icon="close" value="never"/>
|
|
|
|
<ToggleButton icon="numeric-2" value="2"/>
|
|
|
|
<ToggleButton icon="numeric-5" value="5"/>
|
|
|
|
</ToggleButton.Row>
|
2019-06-28 13:47:52 +02:00
|
|
|
);
|
|
|
|
}
|
|
|
|
|
2019-09-12 23:02:28 +02:00
|
|
|
/**
|
|
|
|
* Returns a picker allowing the user to select the start screen
|
|
|
|
*
|
|
|
|
* @returns {React.Node}
|
|
|
|
*/
|
|
|
|
getStartScreenPicker() {
|
|
|
|
return (
|
2020-03-07 11:49:32 +01:00
|
|
|
<ToggleButton.Row
|
2020-02-23 21:47:36 +01:00
|
|
|
onValueChange={this.onStartScreenPickerValueChange}
|
2020-03-06 23:15:01 +01:00
|
|
|
value={this.state.startScreenPickerSelected}
|
2019-09-12 23:02:28 +02:00
|
|
|
>
|
2020-03-07 11:49:32 +01:00
|
|
|
<ToggleButton icon="shopping" value="Proximo"/>
|
|
|
|
<ToggleButton icon="calendar-range" value="Planning"/>
|
|
|
|
<ToggleButton icon="triangle" value="Home"/>
|
|
|
|
<ToggleButton icon="washing-machine" value="Proxiwash"/>
|
|
|
|
<ToggleButton icon="timetable" value="Planex"/>
|
|
|
|
</ToggleButton.Row>
|
2019-09-12 23:02:28 +02:00
|
|
|
);
|
|
|
|
}
|
|
|
|
|
2019-06-29 15:43:57 +02:00
|
|
|
/**
|
2020-03-29 15:59:25 +02:00
|
|
|
* Toggles night mode and saves it to preferences
|
2019-06-29 15:43:57 +02:00
|
|
|
*/
|
2020-02-23 21:47:36 +01:00
|
|
|
onToggleNightMode() {
|
2019-06-29 13:37:21 +02:00
|
|
|
ThemeManager.getInstance().setNightMode(!this.state.nightMode);
|
2019-06-28 13:47:52 +02:00
|
|
|
this.setState({nightMode: !this.state.nightMode});
|
2019-06-25 22:20:24 +02:00
|
|
|
}
|
|
|
|
|
2020-03-08 19:50:17 +01:00
|
|
|
onToggleNightModeFollowSystem() {
|
|
|
|
const value = !this.state.nightModeFollowSystem;
|
|
|
|
this.setState({nightModeFollowSystem: value});
|
|
|
|
let key = AsyncStorageManager.getInstance().preferences.nightModeFollowSystem.key;
|
|
|
|
AsyncStorageManager.getInstance().savePref(key, value ? '1' : '0');
|
|
|
|
if (value) {
|
|
|
|
const nightMode = Appearance.getColorScheme() === 'dark';
|
|
|
|
ThemeManager.getInstance().setNightMode(nightMode);
|
|
|
|
this.setState({nightMode: nightMode});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2019-06-29 15:43:57 +02:00
|
|
|
/**
|
2020-03-29 15:59:25 +02:00
|
|
|
* Gets a list item using a checkbox control
|
2019-06-29 15:43:57 +02:00
|
|
|
*
|
|
|
|
* @param onPressCallback The callback when the checkbox state changes
|
|
|
|
* @param icon The icon name to display on the list item
|
|
|
|
* @param title The text to display as this list item title
|
|
|
|
* @param subtitle The text to display as this list item subtitle
|
|
|
|
* @returns {React.Node}
|
|
|
|
*/
|
2020-03-08 19:50:17 +01:00
|
|
|
getToggleItem(onPressCallback: Function, icon: string, title: string, subtitle: string, state: boolean) {
|
2019-06-28 13:47:52 +02:00
|
|
|
return (
|
2020-03-06 23:15:01 +01:00
|
|
|
<List.Item
|
|
|
|
title={title}
|
|
|
|
description={subtitle}
|
|
|
|
left={props => <List.Icon {...props} icon={icon}/>}
|
|
|
|
right={props =>
|
|
|
|
<Switch
|
2020-03-08 19:50:17 +01:00
|
|
|
value={state}
|
2020-03-06 23:15:01 +01:00
|
|
|
onValueChange={onPressCallback}
|
|
|
|
/>}
|
|
|
|
/>
|
2019-06-28 13:47:52 +02:00
|
|
|
);
|
|
|
|
}
|
|
|
|
|
2019-06-25 22:20:24 +02:00
|
|
|
render() {
|
|
|
|
return (
|
2020-03-06 23:15:01 +01:00
|
|
|
<ScrollView>
|
|
|
|
<Card style={{margin: 5}}>
|
|
|
|
<Card.Title title={i18n.t('settingsScreen.generalCard')}/>
|
|
|
|
<List.Section>
|
2020-03-08 19:50:17 +01:00
|
|
|
{Appearance.getColorScheme() !== 'no-preference' ? this.getToggleItem(
|
|
|
|
this.onToggleNightModeFollowSystem,
|
2020-03-07 11:49:32 +01:00
|
|
|
'theme-light-dark',
|
2020-03-08 19:50:17 +01:00
|
|
|
i18n.t('settingsScreen.nightModeAuto'),
|
2020-03-07 11:49:32 +01:00
|
|
|
this.state.nightMode ?
|
|
|
|
i18n.t('settingsScreen.nightModeSubOn') :
|
2020-03-08 19:50:17 +01:00
|
|
|
i18n.t('settingsScreen.nightModeSubOff'),
|
|
|
|
this.state.nightModeFollowSystem
|
|
|
|
) : null}
|
|
|
|
{
|
|
|
|
Appearance.getColorScheme() === 'no-preference' || !this.state.nightModeFollowSystem ?
|
2020-03-29 15:59:25 +02:00
|
|
|
this.getToggleItem(
|
|
|
|
this.onToggleNightMode,
|
|
|
|
'theme-light-dark',
|
|
|
|
i18n.t('settingsScreen.nightMode'),
|
|
|
|
this.state.nightMode ?
|
|
|
|
i18n.t('settingsScreen.nightModeSubOn') :
|
|
|
|
i18n.t('settingsScreen.nightModeSubOff'),
|
|
|
|
this.state.nightMode
|
|
|
|
) : null
|
2020-03-08 19:50:17 +01:00
|
|
|
}
|
2020-03-06 23:15:01 +01:00
|
|
|
<List.Accordion
|
|
|
|
title={i18n.t('settingsScreen.startScreen')}
|
|
|
|
description={i18n.t('settingsScreen.startScreenSub')}
|
2020-03-07 11:49:32 +01:00
|
|
|
left={props => <List.Icon {...props} icon="power"/>}
|
2020-03-06 23:15:01 +01:00
|
|
|
>
|
|
|
|
{this.getStartScreenPicker()}
|
|
|
|
</List.Accordion>
|
|
|
|
</List.Section>
|
2020-03-06 09:12:56 +01:00
|
|
|
</Card>
|
2020-03-06 23:15:01 +01:00
|
|
|
<Card style={{margin: 5}}>
|
|
|
|
<Card.Title title="Proxiwash"/>
|
2020-03-07 11:49:32 +01:00
|
|
|
<List.Section>
|
|
|
|
<List.Accordion
|
|
|
|
title={i18n.t('settingsScreen.proxiwashNotifReminder')}
|
|
|
|
description={i18n.t('settingsScreen.proxiwashNotifReminderSub')}
|
|
|
|
left={props => <List.Icon {...props} icon="washing-machine"/>}
|
|
|
|
>
|
|
|
|
{this.getProxiwashNotifPicker()}
|
|
|
|
</List.Accordion>
|
|
|
|
</List.Section>
|
2020-03-06 09:12:56 +01:00
|
|
|
</Card>
|
2020-03-06 23:15:01 +01:00
|
|
|
</ScrollView>
|
2019-06-25 22:20:24 +02:00
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|