123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262 |
- import React from 'react';
- import {SectionList, RefreshControl, View} from 'react-native';
- import {Body, Container, Icon, Left, ListItem, Right, Text, Toast, H2, Button} from 'native-base';
- import CustomHeader from "../components/CustomHeader";
- import ThemeManager from '../utils/ThemeManager';
- import NotificationsManager from '../utils/NotificationsManager';
- import i18n from "i18n-js";
- import {AsyncStorage} from 'react-native'
- import CustomMaterialIcon from "../components/CustomMaterialIcon";
-
- const DATA_URL = "https://etud.insa-toulouse.fr/~vergnet/appli-amicale/dataProxiwash.json";
- const WATCHED_MACHINES_PREFKEY = "proxiwash.watchedMachines";
-
- let reminderNotifTime = 5;
-
- const MACHINE_STATES = {
- TERMINE: "0",
- DISPONIBLE: "1",
- FONCTIONNE: "2",
- HS: "3",
- ERREUR: "4"
- };
-
- let stateStrings = {};
-
- let stateColors = {};
-
-
- export default class ProxiwashScreen extends React.Component {
-
- constructor(props) {
- super(props);
- let colors = ThemeManager.getInstance().getCurrentThemeVariables();
- stateColors[MACHINE_STATES.TERMINE] = colors.proxiwashFinishedColor;
- stateColors[MACHINE_STATES.DISPONIBLE] = colors.proxiwashReadyColor;
- stateColors[MACHINE_STATES.FONCTIONNE] = colors.proxiwashRunningColor;
- stateColors[MACHINE_STATES.HS] = colors.proxiwashBrokenColor;
- stateColors[MACHINE_STATES.ERREUR] = colors.proxiwashErrorColor;
-
- stateStrings[MACHINE_STATES.TERMINE] = i18n.t('proxiwashScreen.states.finished');
- stateStrings[MACHINE_STATES.DISPONIBLE] = i18n.t('proxiwashScreen.states.ready');
- stateStrings[MACHINE_STATES.FONCTIONNE] = i18n.t('proxiwashScreen.states.running');
- stateStrings[MACHINE_STATES.HS] = i18n.t('proxiwashScreen.states.broken');
- stateStrings[MACHINE_STATES.ERREUR] = i18n.t('proxiwashScreen.states.error');
- this.state = {
- refreshing: false,
- firstLoading: true,
- data: {},
- machinesWatched: [],
- };
- }
-
- async readData() {
- try {
- let response = await fetch(DATA_URL);
- let responseJson = await response.json();
- // This prevents end notifications from showing
- // let watchList = this.state.machinesWatched;
- // for (let i = 0; i < watchList.length; i++) {
- // if (responseJson[MACHINE_STATES[watchList[i].machineNumber.state]] !== MACHINE_STATES.FONCTIONNE)
- // this.disableNotification(watchList[i].machineNumber);
- // }
- this.setState({
- data: responseJson
- });
- } catch (error) {
- console.error(error);
- }
- }
-
- async componentWillMount() {
- let dataString = await AsyncStorage.getItem(WATCHED_MACHINES_PREFKEY);
- if (dataString === null)
- dataString = '[]';
- this.setState({
- machinesWatched: JSON.parse(dataString)
- });
- }
-
-
- componentDidMount() {
- this._onRefresh();
- }
-
- _onRefresh = () => {
- this.setState({refreshing: true});
- this.readData().then(() => {
- this.setState({
- refreshing: false,
- firstLoading: false
- });
- Toast.show({
- text: i18n.t('proxiwashScreen.listUpdated'),
- buttonText: 'OK',
- type: "success",
- duration: 2000
- })
- });
- };
-
- static getRemainingTime(startString, endString, percentDone) {
- let startArray = startString.split(':');
- let endArray = endString.split(':');
- let startDate = new Date();
- startDate.setHours(parseInt(startArray[0]), parseInt(startArray[1]), 0, 0);
- let endDate = new Date();
- endDate.setHours(parseInt(endArray[0]), parseInt(endArray[1]), 0, 0);
- return (((100 - percentDone) / 100) * (endDate - startDate) / (60 * 1000)).toFixed(0); // Convert milliseconds into minutes
- }
-
- async setupNotifications(number, remainingTime) {
- if (!this.isMachineWatched(number)) {
- let endNotifID = await NotificationsManager.scheduleNotification(
- i18n.t('proxiwashScreen.notifications.machineFinishedTitle'),
- i18n.t('proxiwashScreen.notifications.machineFinishedBody', {number: number}),
- new Date().getTime() + remainingTime * (60 * 1000) // Convert back to milliseconds
- );
- let reminderNotifID = undefined;
- let val = await AsyncStorage.getItem('proxiwashNotifKey');
- if (val === null)
- val = "5";
- if (val !== "never")
- reminderNotifTime = parseInt(val);
- else
- reminderNotifTime = -1;
- console.log(reminderNotifTime);
- if (remainingTime > reminderNotifTime && reminderNotifTime > 0) {
- reminderNotifID = await NotificationsManager.scheduleNotification(
- i18n.t('proxiwashScreen.notifications.machineRunningTitle', {time: reminderNotifTime}),
- i18n.t('proxiwashScreen.notifications.machineRunningBody', {number: number}),
- new Date().getTime() + (remainingTime - reminderNotifTime) * (60 * 1000) // Convert back to milliseconds
- );
- }
- let data = this.state.machinesWatched;
- data.push({machineNumber: number, endNotifID: endNotifID, reminderNotifID: reminderNotifID});
- this.setState({machinesWatched: data});
- AsyncStorage.setItem(WATCHED_MACHINES_PREFKEY, JSON.stringify(data));
- } else
- this.disableNotification(number);
- }
-
- disableNotification(number) {
- let data = this.state.machinesWatched;
- if (data.length > 0) {
- let elem = this.state.machinesWatched.find(function (elem) {
- return elem.machineNumber === number
- });
- let arrayIndex = data.indexOf(elem);
- NotificationsManager.cancelScheduledNoification(data[arrayIndex].endNotifID);
- if (data[arrayIndex].reminderNotifID !== undefined)
- NotificationsManager.cancelScheduledNoification(data[arrayIndex].reminderNotifID);
- data.splice(arrayIndex, 1);
- this.setState({machinesWatched: data});
- AsyncStorage.setItem(WATCHED_MACHINES_PREFKEY, JSON.stringify(data));
- }
- }
-
- isMachineWatched(number) {
- return this.state.machinesWatched.find(function (elem) {
- return elem.machineNumber === number
- }) !== undefined;
- }
-
- renderItem(item, section, data) {
- return (
- <ListItem
- thumbnail
- style={{
- marginLeft: 0,
- backgroundColor: stateColors[MACHINE_STATES[item.state]]
- }}
- >
- <View style={{
- height: '100%',
- position: 'absolute',
- alignSelf: 'flex-end',
- right: 0,
- width: item.donePercent !== '' ? (100 - parseInt(item.donePercent)).toString() + '%' : 0,
- backgroundColor: ThemeManager.getInstance().getCurrentThemeVariables().containerBgColor
- }}>
- </View>
- <Left>
- <CustomMaterialIcon icon={section.title === data[0].title ? 'tumble-dryer' : 'washing-machine'}
- fontSize={30}
- />
- </Left>
- <Body>
- <Text>
- {section.title === data[0].title ? i18n.t('proxiwashScreen.dryer') : i18n.t('proxiwashScreen.washer')} n°{item.number}
- </Text>
- <Text note>
- {item.startTime !== '' ? item.startTime + '/' + item.endTime : ''}
- </Text>
- </Body>
- <Right>
- {item.startTime !== '' ?
- <Button
- style={this.isMachineWatched(item.number) ?
- {backgroundColor: '#ba7c1f'} : {}}
- onPress={() => {
- this.setupNotifications(item.number, ProxiwashScreen.getRemainingTime(item.startTime, item.endTime, item.donePercent))
- }}>
- <Text>
- {ProxiwashScreen.getRemainingTime(item.startTime, item.endTime, item.donePercent) + ' ' + i18n.t('proxiwashScreen.min')}
- </Text>
- <Icon name={this.isMachineWatched(item.number) ? 'bell-ring' : 'bell'}
- type={'MaterialCommunityIcons'}
- style={{fontSize: 30, width: 30}}
- />
- </Button>
- : <Text style={MACHINE_STATES[item.state] === MACHINE_STATES.TERMINE ?
- {fontWeight: 'bold'} : {}}
- >{stateStrings[MACHINE_STATES[item.state]]}</Text>
-
- }
- </Right>
- </ListItem>);
- }
-
- render() {
- const nav = this.props.navigation;
- const data = [
- {
- title: i18n.t('proxiwashScreen.dryers'),
- data: this.state.data.dryers === undefined ? [] : this.state.data.dryers,
- extraData: this.state
- },
- {
- title: i18n.t('proxiwashScreen.washers'),
- data: this.state.data.washers === undefined ? [] : this.state.data.washers,
- extraData: this.state
- },
- ];
- const loadingData = [
- {
- title: i18n.t('proxiwashScreen.loading'),
- data: []
- }
- ];
- return (
- <Container>
- <CustomHeader navigation={nav} title={'Proxiwash'}/>
- <SectionList
- sections={this.state.firstLoading ? loadingData : data}
- keyExtractor={(item) => item.number}
- refreshControl={
- <RefreshControl
- refreshing={this.state.refreshing}
- onRefresh={this._onRefresh}
- />
- }
- renderSectionHeader={({section: {title}}) => (
- <H2 style={{textAlign: 'center', paddingVertical: 10}}>{title}</H2>
- )}
- renderItem={({item, section}) =>
- this.renderItem(item, section, data)
- }
- />
- </Container>
- );
- }
- }
|