112 lines
3.5 KiB
JavaScript
112 lines
3.5 KiB
JavaScript
import React from 'react';
|
|
import { View, StyleSheet, ImageBackground, TouchableOpacity, Text, Image } from 'react-native';
|
|
import { connect } from 'react-redux';
|
|
import NetInfo from '@react-native-community/netinfo';
|
|
import Sync from '../Controllers/Sync';
|
|
import * as SplashScreen from 'expo-splash-screen';
|
|
import i18n from "../I18n";
|
|
|
|
function mapStateToProps(state) {
|
|
return {
|
|
directories: state.directories,
|
|
locale: state.locale,
|
|
};
|
|
}
|
|
|
|
class HomeScreen extends React.Component {
|
|
state = {
|
|
lastSyncCall: '2020-02-12',
|
|
};
|
|
componentDidMount() {
|
|
this.props.dispatch({ type: 'INIT' });
|
|
SplashScreen.hideAsync();
|
|
}
|
|
|
|
unsubscribe() {
|
|
NetInfo.addEventListener(state => {
|
|
if (state.isConnected === true) {
|
|
let seconds =
|
|
Math.abs(new Date(this.state.lastSyncCall) - Date.now()) / 1000;
|
|
//console.log(seconds);
|
|
if (seconds > 30) {
|
|
this.setState({ lastSyncCall: Date.now() });
|
|
Sync.needSync(this.openSync.bind(this));
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
openSync() {
|
|
this.props.navigation.navigate('SyncScreen', { isInstalled: true });
|
|
}
|
|
|
|
openFolder(folderID) {
|
|
const folder = this.props.directories.filter(tmp => tmp.id === folderID);
|
|
this.props.navigation.navigate('DirectoriesScreen', { folder: folder });
|
|
}
|
|
|
|
render() {
|
|
i18n.locale = this.props.locale;
|
|
this.unsubscribe();
|
|
return (
|
|
<ImageBackground source={require('../assets/img/background.jpg')} style={{ width: '100%', height: '100%' }}>
|
|
<View style={styles.container}>
|
|
<TouchableOpacity onPress={() => this.openFolder(2)} style={styles.button}>
|
|
<Image source={require('../assets/img/guillemets.png')} style={styles.btnImg} />
|
|
<Text style={styles.btnTxt}>{i18n.t('home_s.1')}</Text>
|
|
</TouchableOpacity>
|
|
<TouchableOpacity onPress={() => this.openFolder(3)} style={styles.button}>
|
|
<Image source={require('../assets/img/guillemets.png')} style={styles.btnImg} />
|
|
<Text style={styles.btnTxt}>{i18n.t('home_s.2')}</Text>
|
|
</TouchableOpacity>
|
|
<TouchableOpacity onPress={() => this.props.navigation.navigate('OnlyVideosScreen')} style={styles.button}>
|
|
<Image source={require('../assets/img/guillemets.png')} style={styles.btnImg} />
|
|
<Text style={styles.btnTxt}>{i18n.t('global.videos')}</Text>
|
|
</TouchableOpacity>
|
|
<TouchableOpacity onPress={() => this.props.navigation.navigate('ContactScreen')} style={styles.button}>
|
|
<Image source={require('../assets/img/guillemets.png')} style={styles.btnImg} />
|
|
<Text style={styles.btnTxt}>{i18n.t('global.contacts')}</Text>
|
|
</TouchableOpacity>
|
|
</View>
|
|
</ImageBackground>
|
|
);
|
|
}
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
alignItems: 'flex-end',
|
|
justifyContent: 'center',
|
|
},
|
|
text: {
|
|
height: 40,
|
|
width: 300,
|
|
borderColor: 'grey',
|
|
borderWidth: 1,
|
|
marginBottom: 20,
|
|
},
|
|
button: {
|
|
flexDirection: 'row',
|
|
justifyContent: 'center',
|
|
alignItems: 'center',
|
|
backgroundColor: 'white',
|
|
marginBottom: 20,
|
|
marginRight: 50,
|
|
width: 400,
|
|
height: 80,
|
|
borderRadius: 10
|
|
},
|
|
btnTxt: {
|
|
fontSize: 20
|
|
},
|
|
btnImg: {
|
|
position: 'absolute',
|
|
left: 15,
|
|
height: 50,
|
|
width: 50,
|
|
resizeMode: 'stretch'
|
|
}
|
|
});
|
|
|
|
export default connect(mapStateToProps)(HomeScreen);
|