|
@@ -1,13 +1,15 @@
|
1
|
1
|
// @flow
|
2
|
2
|
|
3
|
3
|
import * as React from 'react';
|
4
|
|
-import {AsyncStorage, View} from 'react-native';
|
5
|
|
-import {Body, Card, CardItem, H2, Left, Right, Text} from 'native-base';
|
|
4
|
+import {Alert, AsyncStorage, View} from 'react-native';
|
|
5
|
+import {Body, Card, CardItem, Left, Right, Text} from 'native-base';
|
6
|
6
|
import ThemeManager from '../utils/ThemeManager';
|
7
|
7
|
import i18n from "i18n-js";
|
8
|
8
|
import CustomMaterialIcon from "../components/CustomMaterialIcon";
|
9
|
9
|
import FetchedDataSectionList from "../components/FetchedDataSectionList";
|
10
|
10
|
import NotificationsManager from "../utils/NotificationsManager";
|
|
11
|
+import PlatformTouchable from "react-native-platform-touchable";
|
|
12
|
+
|
11
|
13
|
|
12
|
14
|
const DATA_URL = "https://etud.insa-toulouse.fr/~vergnet/appli-amicale/dataProxiwash.json";
|
13
|
15
|
const WATCHED_MACHINES_PREFKEY = "proxiwash.watchedMachines";
|
|
@@ -23,6 +25,7 @@ const MACHINE_STATES = {
|
23
|
25
|
};
|
24
|
26
|
|
25
|
27
|
let stateStrings = {};
|
|
28
|
+let modalStateStrings = {};
|
26
|
29
|
let stateIcons = {};
|
27
|
30
|
let stateColors = {};
|
28
|
31
|
|
|
@@ -44,7 +47,7 @@ export default class ProxiwashScreen extends FetchedDataSectionList {
|
44
|
47
|
* Creates machine state parameters using current theme and translations
|
45
|
48
|
*/
|
46
|
49
|
constructor() {
|
47
|
|
- super();
|
|
50
|
+ super(DATA_URL);
|
48
|
51
|
let colors = ThemeManager.getInstance().getCurrentThemeVariables();
|
49
|
52
|
stateColors[MACHINE_STATES.TERMINE] = colors.proxiwashFinishedColor;
|
50
|
53
|
stateColors[MACHINE_STATES.DISPONIBLE] = colors.proxiwashReadyColor;
|
|
@@ -58,6 +61,12 @@ export default class ProxiwashScreen extends FetchedDataSectionList {
|
58
|
61
|
stateStrings[MACHINE_STATES.HS] = i18n.t('proxiwashScreen.states.broken');
|
59
|
62
|
stateStrings[MACHINE_STATES.ERREUR] = i18n.t('proxiwashScreen.states.error');
|
60
|
63
|
|
|
64
|
+ modalStateStrings[MACHINE_STATES.TERMINE] = i18n.t('proxiwashScreen.modal.finished');
|
|
65
|
+ modalStateStrings[MACHINE_STATES.DISPONIBLE] = i18n.t('proxiwashScreen.modal.ready');
|
|
66
|
+ modalStateStrings[MACHINE_STATES.FONCTIONNE] = i18n.t('proxiwashScreen.modal.running');
|
|
67
|
+ modalStateStrings[MACHINE_STATES.HS] = i18n.t('proxiwashScreen.modal.broken');
|
|
68
|
+ modalStateStrings[MACHINE_STATES.ERREUR] = i18n.t('proxiwashScreen.modal.error');
|
|
69
|
+
|
61
|
70
|
stateIcons[MACHINE_STATES.TERMINE] = 'check-circle';
|
62
|
71
|
stateIcons[MACHINE_STATES.DISPONIBLE] = 'radiobox-blank';
|
63
|
72
|
stateIcons[MACHINE_STATES.FONCTIONNE] = 'progress-check';
|
|
@@ -65,10 +74,6 @@ export default class ProxiwashScreen extends FetchedDataSectionList {
|
65
|
74
|
stateIcons[MACHINE_STATES.ERREUR] = 'alert';
|
66
|
75
|
}
|
67
|
76
|
|
68
|
|
- getFetchUrl() {
|
69
|
|
- return DATA_URL;
|
70
|
|
- }
|
71
|
|
-
|
72
|
77
|
getHeaderTranslation() {
|
73
|
78
|
return i18n.t("screens.proxiwash");
|
74
|
79
|
}
|
|
@@ -199,7 +204,7 @@ export default class ProxiwashScreen extends FetchedDataSectionList {
|
199
|
204
|
},
|
200
|
205
|
{
|
201
|
206
|
title: i18n.t('proxiwashScreen.washers'),
|
202
|
|
- icon: 'washing-machine',
|
|
207
|
+ icon: 'washing-machine',
|
203
|
208
|
data: fetchedData.washers === undefined ? [] : fetchedData.washers,
|
204
|
209
|
extraData: super.state
|
205
|
210
|
},
|
|
@@ -210,6 +215,35 @@ export default class ProxiwashScreen extends FetchedDataSectionList {
|
210
|
215
|
return true;
|
211
|
216
|
}
|
212
|
217
|
|
|
218
|
+ showAlert(title : string, item : Object, remainingTime: number) {
|
|
219
|
+ let buttons = [{text: i18n.t("proxiwashScreen.modal.ok")}];
|
|
220
|
+ let message = modalStateStrings[MACHINE_STATES[item.state]];
|
|
221
|
+ if (MACHINE_STATES[item.state] === MACHINE_STATES.FONCTIONNE) {
|
|
222
|
+ buttons = [
|
|
223
|
+ {
|
|
224
|
+ text: this.isMachineWatched(item.number) ?
|
|
225
|
+ i18n.t("proxiwashScreen.modal.disableNotifications") :
|
|
226
|
+ i18n.t("proxiwashScreen.modal.enableNotifications"),
|
|
227
|
+ onPress: () => this.setupNotifications(item.number, remainingTime)
|
|
228
|
+ },
|
|
229
|
+ {
|
|
230
|
+ text: i18n.t("proxiwashScreen.modal.cancel")
|
|
231
|
+ }
|
|
232
|
+ ];
|
|
233
|
+ message = i18n.t('proxiwashScreen.modal.running',
|
|
234
|
+ {
|
|
235
|
+ start: item.startTime,
|
|
236
|
+ end: item.endTime,
|
|
237
|
+ remaining: remainingTime
|
|
238
|
+ });
|
|
239
|
+ }
|
|
240
|
+ Alert.alert(
|
|
241
|
+ title,
|
|
242
|
+ message,
|
|
243
|
+ buttons
|
|
244
|
+ );
|
|
245
|
+ }
|
|
246
|
+
|
213
|
247
|
/**
|
214
|
248
|
* Get list item to be rendered
|
215
|
249
|
*
|
|
@@ -219,6 +253,12 @@ export default class ProxiwashScreen extends FetchedDataSectionList {
|
219
|
253
|
* @returns {React.Node}
|
220
|
254
|
*/
|
221
|
255
|
getRenderItem(item: Object, section: Object, data: Object) {
|
|
256
|
+ let isMachineRunning = MACHINE_STATES[item.state] === MACHINE_STATES.FONCTIONNE;
|
|
257
|
+ let machineName = (section.title === i18n.t('proxiwashScreen.dryers') ? i18n.t('proxiwashScreen.dryer') : i18n.t('proxiwashScreen.washer')) + ' n°' + item.number;
|
|
258
|
+ let remainingTime = 0;
|
|
259
|
+ if (isMachineRunning)
|
|
260
|
+ remainingTime = ProxiwashScreen.getRemainingTime(item.startTime, item.endTime, item.donePercent);
|
|
261
|
+
|
222
|
262
|
return (
|
223
|
263
|
<Card style={{
|
224
|
264
|
flex: 0,
|
|
@@ -228,7 +268,9 @@ export default class ProxiwashScreen extends FetchedDataSectionList {
|
228
|
268
|
<CardItem
|
229
|
269
|
style={{
|
230
|
270
|
backgroundColor: stateColors[MACHINE_STATES[item.state]],
|
231
|
|
- height: '100%'
|
|
271
|
+ paddingRight: 0,
|
|
272
|
+ paddingLeft: 0,
|
|
273
|
+ height: '100%',
|
232
|
274
|
}}
|
233
|
275
|
>
|
234
|
276
|
<View style={{
|
|
@@ -238,20 +280,38 @@ export default class ProxiwashScreen extends FetchedDataSectionList {
|
238
|
280
|
width: item.donePercent !== '' ? (100 - parseInt(item.donePercent)).toString() + '%' : 0,
|
239
|
281
|
backgroundColor: ThemeManager.getInstance().getCurrentThemeVariables().containerBgColor
|
240
|
282
|
}}/>
|
241
|
|
- <Left>
|
242
|
|
- <CustomMaterialIcon icon={section.title === i18n.t('proxiwashScreen.dryers') ? 'tumble-dryer' : 'washing-machine'}
|
243
|
|
- fontSize={30}
|
|
283
|
+ <PlatformTouchable
|
|
284
|
+ onPress={() => this.showAlert(machineName, item, remainingTime)}
|
|
285
|
+ style={{
|
|
286
|
+ height: 64,
|
|
287
|
+ position: 'absolute',
|
|
288
|
+ right: 0,
|
|
289
|
+ width: '100%'
|
|
290
|
+ }}
|
|
291
|
+ >
|
|
292
|
+ <View/>
|
|
293
|
+ </PlatformTouchable>
|
|
294
|
+ <Left style={{marginLeft: 10}}>
|
|
295
|
+ <CustomMaterialIcon
|
|
296
|
+ icon={section.title === i18n.t('proxiwashScreen.dryers') ? 'tumble-dryer' : 'washing-machine'}
|
|
297
|
+ fontSize={30}
|
244
|
298
|
/>
|
245
|
299
|
<Body>
|
246
|
300
|
<Text>
|
247
|
|
- {section.title === i18n.t('proxiwashScreen.dryers') ? i18n.t('proxiwashScreen.dryer') : i18n.t('proxiwashScreen.washer')} n°{item.number}
|
|
301
|
+ {machineName + ' '}
|
|
302
|
+ {this.isMachineWatched(item.number) ?
|
|
303
|
+ <CustomMaterialIcon
|
|
304
|
+ icon='bell-ring'
|
|
305
|
+ color={ThemeManager.getInstance().getCurrentThemeVariables().brandPrimary}
|
|
306
|
+ fontSize={20}
|
|
307
|
+ /> : ''}
|
248
|
308
|
</Text>
|
249
|
309
|
<Text note>
|
250
|
|
- {item.startTime !== '' ? item.startTime + '/' + item.endTime : ''}
|
|
310
|
+ {isMachineRunning ? item.startTime + '/' + item.endTime : ''}
|
251
|
311
|
</Text>
|
252
|
312
|
</Body>
|
253
|
313
|
</Left>
|
254
|
|
- <Right style={{}}>
|
|
314
|
+ <Right style={{marginRight: 10}}>
|
255
|
315
|
<Text style={MACHINE_STATES[item.state] === MACHINE_STATES.TERMINE ?
|
256
|
316
|
{fontWeight: 'bold'} : {}}
|
257
|
317
|
>
|
|
@@ -260,33 +320,8 @@ export default class ProxiwashScreen extends FetchedDataSectionList {
|
260
|
320
|
<CustomMaterialIcon icon={stateIcons[MACHINE_STATES[item.state]]}
|
261
|
321
|
fontSize={25}
|
262
|
322
|
/>
|
263
|
|
-
|
264
|
|
- {/*{item.startTime !== '' ?*/}
|
265
|
|
- {/* <Button*/}
|
266
|
|
- {/* style={this.isMachineWatched(item.number) ?*/}
|
267
|
|
- {/* {backgroundColor: '#ba7c1f'} : {}}*/}
|
268
|
|
- {/* onPress={() => {*/}
|
269
|
|
- {/* this.setupNotifications(item.number, ProxiwashScreen.getRemainingTime(item.startTime, item.endTime, item.donePercent))*/}
|
270
|
|
- {/* }}*/}
|
271
|
|
- {/* >*/}
|
272
|
|
- {/* <Text>*/}
|
273
|
|
- {/* {ProxiwashScreen.getRemainingTime(item.startTime, item.endTime, item.donePercent) + ' ' + i18n.t('proxiwashScreen.min')}*/}
|
274
|
|
- {/* </Text>*/}
|
275
|
|
- {/* <Icon*/}
|
276
|
|
- {/* name={this.isMachineWatched(item.number) ? 'bell-ring' : 'bell'}*/}
|
277
|
|
- {/* type={'MaterialCommunityIcons'}*/}
|
278
|
|
- {/* style={{fontSize: 30, width: 30}}*/}
|
279
|
|
- {/* />*/}
|
280
|
|
- {/* </Button>*/}
|
281
|
|
- {/* : (*/}
|
282
|
|
- {/* )*/}
|
283
|
|
- {/*}*/}
|
284
|
323
|
</Right>
|
285
|
324
|
</CardItem>
|
286
|
325
|
</Card>);
|
287
|
326
|
}
|
288
|
|
-
|
289
|
|
- // getRenderSectionHeader(title: String) {
|
290
|
|
- // return <H2 style={{textAlign: 'center', paddingVertical: 10}}>{title}</H2>;
|
291
|
|
- // }
|
292
|
327
|
}
|