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 RNDeviceInformation from "fm-react-native-device-info"
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'
export default class SplashScreen extends Component{
    static navigatorStyle = {
        drawUnderNavBar: true,
        navBarHidden:true,
        drawUnderStatusBar: false,
        statusBarHidden: true,
        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){
         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
        }
       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('../../assets/img/icon3up.png')}/>
            <View style={{flexDirection:'row'}}>
              <Image style={styles.logo} source={require('../../assets/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{ 
                    RNDeviceInformation.getDeviceLanguageCode().then((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("error")
           RNDeviceInformation.getDeviceLanguageCode().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',
       height: responsiveHeight(16), // Delete this line if the image size sucks and change the width and the height of icon3.png to 257 x 112
    },
    lottie: {
        width: 48
    ,
        height: 64
      },
    title:{
        fontSize:responsiveFontSize(4),
        alignSelf: 'center',
        fontWeight:'bold',
        color:'white',
    },
})