2019-06-29 13:37:21 +02:00
|
|
|
// @flow
|
|
|
|
|
|
|
|
|
|
import * as React from 'react';
|
2019-06-28 13:47:52 +02:00
|
|
|
import {
|
|
|
|
|
Container,
|
|
|
|
|
Content,
|
|
|
|
|
Left,
|
|
|
|
|
ListItem,
|
|
|
|
|
Right,
|
|
|
|
|
Text,
|
|
|
|
|
List,
|
|
|
|
|
CheckBox,
|
|
|
|
|
Body,
|
|
|
|
|
CardItem,
|
|
|
|
|
Card,
|
|
|
|
|
Picker,
|
|
|
|
|
} from "native-base";
|
2019-06-25 22:20:24 +02:00
|
|
|
import CustomHeader from "../components/CustomHeader";
|
|
|
|
|
import ThemeManager from '../utils/ThemeManager';
|
|
|
|
|
import i18n from "i18n-js";
|
2019-06-28 11:35:15 +02:00
|
|
|
import {NavigationActions, StackActions} from "react-navigation";
|
|
|
|
|
import CustomMaterialIcon from "../components/CustomMaterialIcon";
|
2019-06-28 13:47:52 +02:00
|
|
|
import {AsyncStorage} from 'react-native'
|
2019-06-25 22:20:24 +02:00
|
|
|
|
2019-06-28 13:47:52 +02:00
|
|
|
const proxiwashNotifKey = "proxiwashNotifKey";
|
2019-06-25 22:20:24 +02:00
|
|
|
|
2019-06-29 13:37:21 +02:00
|
|
|
type Props = {
|
|
|
|
|
navigation: Object,
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
type State = {
|
|
|
|
|
nightMode: boolean,
|
|
|
|
|
proxiwashNotifPickerSelected: string,
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
export default class SettingsScreen extends React.Component<Props, State> {
|
2019-06-25 22:20:24 +02:00
|
|
|
state = {
|
|
|
|
|
nightMode: ThemeManager.getInstance().getNightMode(),
|
2019-06-28 13:47:52 +02:00
|
|
|
proxiwashNotifPickerSelected: "5"
|
2019-06-25 22:20:24 +02:00
|
|
|
};
|
|
|
|
|
|
2019-06-28 13:47:52 +02:00
|
|
|
async componentWillMount() {
|
|
|
|
|
let val = await AsyncStorage.getItem(proxiwashNotifKey);
|
|
|
|
|
if (val === null)
|
|
|
|
|
val = "5";
|
|
|
|
|
this.setState({
|
|
|
|
|
proxiwashNotifPickerSelected: val,
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
2019-06-29 13:37:21 +02:00
|
|
|
onProxiwashNotifPickerValueChange(value: string) {
|
2019-06-28 13:47:52 +02:00
|
|
|
AsyncStorage.setItem(proxiwashNotifKey, value);
|
|
|
|
|
this.setState({
|
|
|
|
|
proxiwashNotifPickerSelected: value
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
2019-06-29 13:37:21 +02:00
|
|
|
getProxiwashNotifPicker() {
|
2019-06-28 13:47:52 +02:00
|
|
|
return (
|
|
|
|
|
<Picker
|
|
|
|
|
note
|
|
|
|
|
mode="dropdown"
|
|
|
|
|
style={{width: 120}}
|
|
|
|
|
selectedValue={this.state.proxiwashNotifPickerSelected}
|
2019-06-29 13:37:21 +02:00
|
|
|
onValueChange={(value) => this.onProxiwashNotifPickerValueChange(value)}
|
2019-06-28 13:47:52 +02:00
|
|
|
>
|
|
|
|
|
<Picker.Item label={i18n.t('settingsScreen.proxiwashNotifReminderPicker.never')} value="never"/>
|
|
|
|
|
<Picker.Item label={i18n.t('settingsScreen.proxiwashNotifReminderPicker.1')} value="1"/>
|
|
|
|
|
<Picker.Item label={i18n.t('settingsScreen.proxiwashNotifReminderPicker.2')} value="2"/>
|
|
|
|
|
<Picker.Item label={i18n.t('settingsScreen.proxiwashNotifReminderPicker.3')} value="3"/>
|
|
|
|
|
<Picker.Item label={i18n.t('settingsScreen.proxiwashNotifReminderPicker.5')} value="5"/>
|
|
|
|
|
<Picker.Item label={i18n.t('settingsScreen.proxiwashNotifReminderPicker.10')} value="10"/>
|
|
|
|
|
<Picker.Item label={i18n.t('settingsScreen.proxiwashNotifReminderPicker.20')} value="20"/>
|
|
|
|
|
<Picker.Item label={i18n.t('settingsScreen.proxiwashNotifReminderPicker.30')} value="30"/>
|
|
|
|
|
</Picker>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
|
2019-06-25 22:20:24 +02:00
|
|
|
toggleNightMode() {
|
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-28 11:35:15 +02:00
|
|
|
// Alert.alert(i18n.t('settingsScreen.nightMode'), i18n.t('settingsScreen.restart'));
|
|
|
|
|
this.resetStack();
|
|
|
|
|
}
|
2019-06-25 22:20:24 +02:00
|
|
|
|
2019-06-28 11:35:15 +02:00
|
|
|
resetStack() {
|
|
|
|
|
const resetAction = StackActions.reset({
|
|
|
|
|
index: 0,
|
|
|
|
|
key: null,
|
2019-06-28 13:47:52 +02:00
|
|
|
actions: [NavigationActions.navigate({routeName: 'Main'})],
|
2019-06-28 11:35:15 +02:00
|
|
|
});
|
|
|
|
|
this.props.navigation.dispatch(resetAction);
|
|
|
|
|
this.props.navigation.navigate('Settings');
|
2019-06-25 22:20:24 +02:00
|
|
|
}
|
|
|
|
|
|
2019-06-29 13:37:21 +02:00
|
|
|
getToggleItem(onPressCallback: Function, icon: string, text: string, subtitle: string) {
|
2019-06-28 13:47:52 +02:00
|
|
|
return (
|
|
|
|
|
<ListItem
|
|
|
|
|
button
|
|
|
|
|
thumbnail
|
|
|
|
|
onPress={onPressCallback}
|
|
|
|
|
>
|
|
|
|
|
<Left>
|
|
|
|
|
<CustomMaterialIcon icon={icon}/>
|
|
|
|
|
</Left>
|
|
|
|
|
<Body>
|
|
|
|
|
<Text>
|
|
|
|
|
{text}
|
|
|
|
|
</Text>
|
|
|
|
|
<Text note>
|
|
|
|
|
{subtitle}
|
|
|
|
|
</Text>
|
|
|
|
|
</Body>
|
|
|
|
|
<Right style={{flex: 1}}>
|
|
|
|
|
<CheckBox checked={this.state.nightMode}
|
|
|
|
|
onPress={() => this.toggleNightMode()}/>
|
|
|
|
|
</Right>
|
|
|
|
|
</ListItem>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
|
2019-06-29 13:37:21 +02:00
|
|
|
static getGeneralItem(control: React.Node, icon: string, text: string, subtitle: string) {
|
2019-06-28 13:47:52 +02:00
|
|
|
return (
|
|
|
|
|
<ListItem
|
|
|
|
|
thumbnail
|
|
|
|
|
>
|
|
|
|
|
<Left>
|
|
|
|
|
<CustomMaterialIcon icon={icon}/>
|
|
|
|
|
</Left>
|
|
|
|
|
<Body>
|
|
|
|
|
<Text>
|
|
|
|
|
{text}
|
|
|
|
|
</Text>
|
|
|
|
|
<Text note>
|
|
|
|
|
{subtitle}
|
|
|
|
|
</Text>
|
|
|
|
|
</Body>
|
|
|
|
|
|
|
|
|
|
<Right style={{flex: 1}}>
|
|
|
|
|
{control}
|
|
|
|
|
</Right>
|
|
|
|
|
</ListItem>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
|
2019-06-25 22:20:24 +02:00
|
|
|
render() {
|
|
|
|
|
const nav = this.props.navigation;
|
|
|
|
|
return (
|
|
|
|
|
<Container>
|
|
|
|
|
<CustomHeader navigation={nav} title={i18n.t('screens.settings')}/>
|
|
|
|
|
<Content>
|
2019-06-28 13:47:52 +02:00
|
|
|
<Card>
|
|
|
|
|
<CardItem header>
|
|
|
|
|
<Text>{i18n.t('settingsScreen.appearanceCard')}</Text>
|
|
|
|
|
</CardItem>
|
|
|
|
|
<List>
|
|
|
|
|
{this.getToggleItem(() => this.toggleNightMode(), 'theme-light-dark', i18n.t('settingsScreen.nightMode'), i18n.t('settingsScreen.nightModeSub'))}
|
|
|
|
|
</List>
|
|
|
|
|
</Card>
|
|
|
|
|
<Card>
|
|
|
|
|
<CardItem header>
|
|
|
|
|
<Text>Proxiwash</Text>
|
|
|
|
|
</CardItem>
|
|
|
|
|
<List>
|
2019-06-29 13:37:21 +02:00
|
|
|
{SettingsScreen.getGeneralItem(this.getProxiwashNotifPicker(), 'washing-machine', i18n.t('settingsScreen.proxiwashNotifReminder'), i18n.t('settingsScreen.proxiwashNotifReminderSub'))}
|
2019-06-28 13:47:52 +02:00
|
|
|
</List>
|
|
|
|
|
</Card>
|
2019-06-25 22:20:24 +02:00
|
|
|
</Content>
|
|
|
|
|
</Container>
|
|
|
|
|
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
}
|
