import React, {Component} from 'react';
import {
    StyleSheet, View, Text, Image, ProgressBarAndroid,
    TouchableNativeFeedback, TouchableOpacity,
    PermissionsAndroid, NativeModules, StatusBar, Platform, Animated
} from 'react-native';
import {responsiveHeight, responsiveWidth, responsiveFontSize} from 'react-native-responsive-dimensions';
import I18n from 'react-native-i18n'

const theme = require('./../../utils/theme.json');
const route = require('./../../route.json');
import {readUser, getPasObject, getPubActiveObject} from '../../webservice/AuthApi';
import {Bubbles, DoubleBounce, Bars, Pulse} from 'react-native-loader';
import Configuration from "../../webservice/persistences/Configuration";
import '../ads/InterticielAds'
import * as Animatable from 'react-native-animatable';
import LottieView from 'lottie-react-native'; // if you have "esModuleInterop": true
import InterticielAds from '../ads/InterticielAds';
import Overlay from 'react-native-elements'
import DeviceInfo from 'react-native-device-info';

export default class SplashScreen extends Component {
    static navigatorStyle = {
        drawUnderNavBar: true,
        navBarHidden: true,
        drawUnderStatusBar: false,
        statusBarHidden: false,
        statusBarTextColorScheme: 'light',
    };

    static options(passProps) {
        return {
            statusBar: {
                visible: false,
                style: 'light' | 'dark',
                drawBehind: true
            },
            topBar: {
                title: {
                    text: 'My Screen'
                },
                drawBehind: true,
                visible: false,
                animate: false
            }
        };
    }


    //
    constructor(props) {
        super(props);
        this.state = {};
    };

    workUserResult(result) {
        console.log("SPLASHSCREEN PROPS", this.props);
        if (typeof this.props.navigation.state.params !== 'undefined') {
            if (result === null || result === undefined) {
                this.props.navigation.navigate("Auth");
            } else {
                switch (this.props.navigation.state.params.routeName) {
                    case 'historyItemDetails':
                        this.props.navigation.navigate(this.props.navigation.state.params.routeName, {
                            item: this.props.navigation.state.params.params
                        });
                        break;

                    default:
                        this.props.navigation.navigate(this.props.navigation.state.params.routeName, {
                            id: this.props.navigation.state.params.params.id
                        });
                        break;
                }
            }

        } else {
            var way = "";
            var way2 = "";
            if (result === null || result === undefined) {
                way = "Auth"
                way2 = route.first
            } else {
                if (!result.category)
                    way = "App"
                else {
                    switch (result.category) {
                        case 'geolocated':
                            way = "AgentApp"
                            break;
                        case 'super':
                            way = "adminApp"
                            break
                        default:
                            way = "supAdminApp"
                    }
                }
                way2 = route.login
            }
            console.log("SPLASHSCREEN PROPS WAY", way);
            this.props.navigation.navigate(way)
        }

        /*  Navigation.setStackRoot(route.stackRoot,
                              {        component: {
                                          name: way,
                                      }


              }
          );
         Navigation.showOverlay({
              component: {
                  name: route.intersticielAds,
                  id:"interticiel",
                  options: {
                      overlay: {
                          interceptTouchOutside: false
                      }
                  }
              }
          });*/

    }

    componentDidMount() {
        try {
            this.requestCameraPermission()
        } catch (e) {
            console.log(e)
        }
        this.config = new Configuration();
        this.retrieveAndroidInformation()
        setTimeout(() => this.bounce(), 500)
        this.bounce()

    }

    async requestCameraPermission() {
        try {
            const granted = await PermissionsAndroid.request(
                PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
                {
                    'title': 'Cool Photo App Camera Permission',
                    'message': 'Cool Photo App needs access to your camera ' +
                        'so you can take awesome pictures.'
                }
            )
            if (granted === PermissionsAndroid.RESULTS.GRANTED) {

            } else {
                console.log("try get information else")

            }
        } catch (err) {
            console.log("try get information error")
            console.log(err)
        }
    }

    handleViewRef = ref => this.view = ref;

    bounce = () => this.view.transition({translateX: 0}, {translateX: 700}, 5000);

    render() {

        return (
            <View style={styles.container}>
                <StatusBar
                    translucent={true}
                />
                <Image style={styles.logo} source={require('./../../datas/img/icon3up.png')}/>
                <View style={{flexDirection: 'row'}}>
                    <Image style={styles.logo} source={require('./../../datas/img/iconsub3.png')}/>
                    <Animatable.View
                        style={{
                            width: responsiveWidth(90),
                            height: 92,
                            backgroundColor: theme.primary,
                            position: 'absolute',
                            zIndex: 100
                        }}
                        ref={this.handleViewRef}>
                    </Animatable.View>


                </View>

            </View>
        )
    }

    retreiveIosInformation() {
        readUser().then((result) => {
            setTimeout(() => {
                this.workUserResult(result)
            }, 3000)
        }).catch((e) => {
            this.props.navigation.navigate("Auth")
        });
        return "";
    }

    retrieveAndroidInformation() {
        getPasObject().then((data) => {
            console.warn(data);
            this.config.setCurrentPas(data)
        })

        this.config._getData().then((lang) => {
            if (lang) {
                I18n.locale = lang
                readUser().then((result) => {
                    console.warn(result)
                    if (result) {
                        getPubActiveObject(result['country_id']).then((data) => {
                            console.warn(data)
                            this.config.setPubActive(data);
                        })
                    }
                    setTimeout(() => {
                        this.workUserResult(result)
                    }, 3000)
                })
            } else {
                const code = DeviceInfo.getDeviceLocale();
                console.warn(code)
                I18n.locale = code.toLowerCase()
                readUser().then((result) => {
                    console.warn(result)
                    if (result) {
                        getPubActiveObject(result['country_id']).then((data) => {
                            console.warn(data)
                            this.config.setPubActive(data);
                        })
                    }
                    setTimeout(() => {
                        this.workUserResult(result)
                    }, 3000)
                }).catch((e) => {
                    this.setPubActive(data)
                });

            }
        }).catch((e) => {
            console.warn(e.message)
            DeviceInfo.getDeviceLocale().then((code) => {
                console.warn(code)

                I18n.locale = code.toLowerCase()
                readUser().then((result) => {
                    setTimeout(() => {
                        this.workUserResult(result)
                    }, 3000)
                }).catch((e) => {
                    this.props.navigation.navigate("Auth")
                });
            })

        })

        return ""
    }
}
const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: theme.primary,
        justifyContent: 'center',
        alignItems: 'center',
    },
    logoContaner: {

        flexDirection: 'row',
        marginTop: responsiveHeight(20),
        justifyContent: 'center',
        alignItems: 'center',
    },
    logo: {
        width: responsiveWidth(90),
        resizeMode: 'contain'
    },
    lottie: {
        width: 48
        ,
        height: 64
    },
    title: {
        fontSize: responsiveFontSize(4),
        alignSelf: 'center',
        fontWeight: 'bold',
        color: 'white',
    },
})