|
@@ -1,6 +1,7 @@
|
1
|
1
|
// @flow
|
2
|
2
|
|
3
|
3
|
import * as React from 'react';
|
|
4
|
+import { BackHandler } from 'react-native';
|
4
|
5
|
import {Content, H1, H2, H3, Text, Button} from 'native-base';
|
5
|
6
|
import i18n from "i18n-js";
|
6
|
7
|
import {View, Image} from "react-native";
|
|
@@ -8,12 +9,21 @@ import ThemeManager from "../utils/ThemeManager";
|
8
|
9
|
import {Linking} from "expo";
|
9
|
10
|
import BaseContainer from "../components/BaseContainer";
|
10
|
11
|
import {Agenda} from 'react-native-calendars';
|
|
12
|
+import {LocaleConfig} from 'react-native-calendars';
|
11
|
13
|
import HTML from 'react-native-render-html';
|
12
|
14
|
import Touchable from 'react-native-platform-touchable';
|
13
|
15
|
import Modalize from 'react-native-modalize';
|
14
|
16
|
import WebDataManager from "../utils/WebDataManager";
|
15
|
17
|
import CustomMaterialIcon from "../components/CustomMaterialIcon";
|
16
|
18
|
|
|
19
|
+LocaleConfig.locales['fr'] = {
|
|
20
|
+ monthNames: ['Janvier','Février','Mars','Avril','Mai','Juin','Juillet','Août','Septembre','Octobre','Novembre','Décembre'],
|
|
21
|
+ monthNamesShort: ['Janv.','Févr.','Mars','Avril','Mai','Juin','Juil.','Août','Sept.','Oct.','Nov.','Déc.'],
|
|
22
|
+ dayNames: ['Dimanche','Lundi','Mardi','Mercredi','Jeudi','Vendredi','Samedi'],
|
|
23
|
+ dayNamesShort: ['Dim','Lun','Mar','Mer','Jeu','Ven','Sam'],
|
|
24
|
+ today: 'Aujourd\'hui'
|
|
25
|
+};
|
|
26
|
+
|
17
|
27
|
|
18
|
28
|
type Props = {
|
19
|
29
|
navigation: Object,
|
|
@@ -23,6 +33,7 @@ type State = {
|
23
|
33
|
modalCurrentDisplayItem: Object,
|
24
|
34
|
refreshing: boolean,
|
25
|
35
|
agendaItems: Object,
|
|
36
|
+ calendarShowing: boolean,
|
26
|
37
|
};
|
27
|
38
|
|
28
|
39
|
const FETCH_URL = "https://amicale-insat.fr/event/json/list";
|
|
@@ -48,20 +59,56 @@ export default class PlanningScreen extends React.Component<Props, State> {
|
48
|
59
|
lastRefresh: Date;
|
49
|
60
|
minTimeBetweenRefresh = 60;
|
50
|
61
|
|
|
62
|
+ _agenda: Agenda;
|
|
63
|
+
|
51
|
64
|
constructor(props: any) {
|
52
|
65
|
super(props);
|
53
|
66
|
this.modalRef = React.createRef();
|
54
|
67
|
this.webDataManager = new WebDataManager(FETCH_URL);
|
|
68
|
+ this._didFocusSubscription = props.navigation.addListener(
|
|
69
|
+ 'didFocus',
|
|
70
|
+ payload =>
|
|
71
|
+ BackHandler.addEventListener(
|
|
72
|
+ 'hardwareBackPress',
|
|
73
|
+ this.onBackButtonPressAndroid
|
|
74
|
+ )
|
|
75
|
+ );
|
|
76
|
+ if (i18n.currentLocale().startsWith("fr")) {
|
|
77
|
+ LocaleConfig.defaultLocale = 'fr';
|
|
78
|
+ }
|
55
|
79
|
}
|
56
|
80
|
|
57
|
81
|
componentDidMount() {
|
58
|
82
|
this._onRefresh();
|
|
83
|
+ this._willBlurSubscription = this.props.navigation.addListener(
|
|
84
|
+ 'willBlur',
|
|
85
|
+ payload =>
|
|
86
|
+ BackHandler.removeEventListener(
|
|
87
|
+ 'hardwareBackPress',
|
|
88
|
+ this.onBackButtonPressAndroid
|
|
89
|
+ )
|
|
90
|
+ );
|
|
91
|
+ }
|
|
92
|
+
|
|
93
|
+ onBackButtonPressAndroid = () => {
|
|
94
|
+ if (this.state.calendarShowing) {
|
|
95
|
+ this._agenda.chooseDay(this._agenda.state.selectedDay);
|
|
96
|
+ return true;
|
|
97
|
+ } else {
|
|
98
|
+ return false;
|
|
99
|
+ }
|
|
100
|
+ };
|
|
101
|
+
|
|
102
|
+ componentWillUnmount() {
|
|
103
|
+ this._didFocusSubscription && this._didFocusSubscription.remove();
|
|
104
|
+ this._willBlurSubscription && this._willBlurSubscription.remove();
|
59
|
105
|
}
|
60
|
106
|
|
61
|
107
|
state = {
|
62
|
108
|
modalCurrentDisplayItem: {},
|
63
|
109
|
refreshing: false,
|
64
|
110
|
agendaItems: {},
|
|
111
|
+ calendarShowing: false,
|
65
|
112
|
};
|
66
|
113
|
|
67
|
114
|
getCurrentDate() {
|
|
@@ -347,11 +394,17 @@ export default class PlanningScreen extends React.Component<Props, State> {
|
347
|
394
|
futureScrollRange={AGENDA_MONTH_SPAN}
|
348
|
395
|
// If provided, a standard RefreshControl will be added for "Pull to Refresh" functionality. Make sure to also set the refreshing prop correctly.
|
349
|
396
|
onRefresh={() => this._onRefresh()}
|
|
397
|
+ // callback that fires when the calendar is opened or closed
|
|
398
|
+ onCalendarToggled={(calendarOpened) => {this.setState({calendarShowing: calendarOpened})}}
|
350
|
399
|
// Set this true while waiting for new data from a refresh
|
351
|
400
|
refreshing={this.state.refreshing}
|
352
|
401
|
renderItem={(item) => this.getRenderItem(item)}
|
353
|
402
|
renderEmptyDate={() => this.getRenderEmptyDate()}
|
354
|
403
|
rowHasChanged={() => this.rowHasChanged()}
|
|
404
|
+ // If firstDay=1 week starts from Monday. Note that dayNames and dayNamesShort should still start from Sunday.
|
|
405
|
+ firstDay={1}
|
|
406
|
+ // ref to this agenda in order to handle back button event
|
|
407
|
+ ref={(ref) => this._agenda = ref}
|
355
|
408
|
// agenda theme
|
356
|
409
|
theme={{
|
357
|
410
|
backgroundColor: ThemeManager.getCurrentThemeVariables().agendaBackgroundColor,
|