RN View Error

'use strict'
import React, { Component, Firebase } from 'react'
import { AppRegistry, StyleSheet, Text, View, TextInput, Dimensions, Image, TouchableOpacity, Navigator, Linking } from 'react-native'
import Icon from 'react-native-vector-icons/Ionicons'
import * as firebase from 'firebase';
var Platform = require('react-native').Platform;
var ImagePicker = require('react-native-image-picker');

import Index from '../Index'
import RegisterScreen from './RegisterScreen'

/* Variables */
var strEmail = ""
var strPassword = ""
let ScreenWidth = Dimensions.get("window").width;
let ScreenHeight = Dimensions.get("window").height;

var txtMail = <TextInput />
var txtPassword = <TextInput />
var provider = new firebase.auth.FacebookAuthProvider();
provider.addScope('public_profile');
provider.addScope('email');

var allergies = []

module.exports = class LoginScreen extends Component {
  constructor(props) {
    super(props)

    global.registering = false

    this.state = {
      loaded: true,
      strEmail: '',
      strPassword: '',
      uid: '',
    };
  }

  componentDidMount() {
    this.findAllergies()

    firebase.auth().onAuthStateChanged((user) => {
      if (user) {
        global.userID = user.uid
        var naviRef = this.refs.NavRef

        if (global.registering) {
          var user = firebase.database().ref("users").child(global.userID)
          user.child("city").set(global.txtRegisterCity)
          user.child("country").set(global.txtRegisterCountry)
          user.child("name").set(global.txtRegisterName)
          user.child("surname").set(global.txtRegisterSurname)
          user.child("role").set("user")
          user.child("pushID").set("empty")
          user.child("email").set(global.txtRegisterEmail)
          user.child("phoneNumber").set(global.phoneNumber)

          var stats = user.child("stats")
          var arrayStats = {"organised" : 0, "participated" : 0, "totalAccueil" : 0, "totalAmbiance" : 0, "totalGuest" : 0, "totalHygiene" : 0, "totalPresentation" : 0, "totalQuality" : 0, "totalRatingsGuest" : 0, "totalRatingsOrganisator" : 0}
          stats.set(arrayStats)

          var allergiesSet = user.child("allergies")
          allergiesSet.set(allergies)

          naviRef.push({
            ident: 'Home'
          })
        } else {
          naviRef.push({
            ident: 'Home'
          })
        }
      } else {
        // No user logged in
      }

    });
  }

  findAllergies() {
    firebase.database().ref("allergies").on("value", (snap) => {
      snap.forEach((child) => {
        allergies[child.key] = false
      })
    })
  }

  digitsLogin() {
    alert("uuu")
  }

  _renderScene = (route, navigator) => {
    var globalNavigatorProps = { navigator }

    var navigationView = (
      <View style={{flex: 1, backgroundColor: '#fff'}}>
        <Text style={{margin: 30, fontSize: 15, textAlign: 'left'}}>Menu</Text>
      </View>
    );

    switch(route.ident) {
      case "Login":
        if (this.state.uid == '') {
          return(
            <View style={styles.mainContainer}>
              <Image source={require('../res/images/LoginScreenBackground.jpg')} style={styles.backgroundz}>
              <View style={styles.container}>
                <View style={styles.titleView}>
                  <Image source={require('../res/images/LETSeat.png')} style={{width: 200, height: 200, marginBottom: 50}} />
                  <View style={{ borderBottomColor: '#fff', borderBottomWidth: 1, paddingLeft: 5, flexDirection: 'row'}}>
                  <Icon name="ios-contact" size={25} color="#fff" />
                  <TextInput
                    ref={function(input) {
                      if (input != null) {
                        txtMail = input;
                      }
                    }}
                    style={{paddingLeft: 5, backgroundColor: 'rgba(0,0,0,0)', color: 'white', flex: 1, marginBottom: 5}}
                    placeholderStyle={{ color: 'red' }}
                    onChangeText={(text) => strEmail = text}
                    returnKeyType='done'
                    onFocus={this._MailFocus}
                    onEndEditing={this._ReleaseFocus}
                    keyboardType='email-address'
                    placeholder="Adresse email"
                    placeholderTextColor='white'
                  />
                  </View>
                  <View style={{ borderBottomColor: '#fff', borderBottomWidth: 1, flexDirection: 'row', paddingLeft: 7, marginTop: 5}}>
                  <View style={{alignItems: 'center'}}>
                    <Icon name="ios-lock" size={25} color="#fff" />
                  </View>
                  <TextInput
                    ref={function(input) {
                      if (input != null) {
                        txtPassword = input;
                      }
                    }}
                    style={{color: 'white', paddingLeft: 7, borderColor: 'white', backgroundColor: 'rgba(0,0,0,0)', flex: 1, marginBottom: 5}}
                    onChangeText={(text) => strPassword = text}
                    returnKeyType='done'
                    onFocus={this._PasswordFocus}
                    onEndEditing={this._ReleaseFocus}
                    secureTextEntry={true}
                    placeholder="Mot de passe"
                    placeholderTextColor='white'
                  />
                  </View>
                  <TouchableOpacity onPress={() => this.digitsLogin()} style={{backgroundColor: '#3b5998', height: 30, paddingLeft: 5, paddingRight: 5, alignItems: 'center', justifyContent: 'center', marginTop: 10, borderRadius: 5}}>
                    <Text style={{color: 'white'}}>Natel login</Text>
                  </TouchableOpacity>
                  {/* <View style={{width: 200, marginTop: 10, alignItems: 'center', justifyContent: 'center'}}>
                      <Icon.Button name="logo-facebook" backgroundColor="#3b5998" onPress={() => this._FacebookLogin()}>
                        <Text style={{fontFamily: 'Arial', fontSize: 15, color: 'white'}}>Login with Facebook</Text>
                      </Icon.Button>
                  </View> */}
                </View>

                <View style={styles.buttonsView}>
                  <View style={styles.borderedView}>
                    <TouchableOpacity
                      style={styles.loginButton}
                      styleDisabled={{color: 'red'}}
                      onPress={() => this._Connexion()}>
                      <Text style={{color: 'white', size: 20}}>Connexion</Text>
                    </TouchableOpacity>
                  </View>
                  <View style={{backgroundColor: 'rgba(0,0,0,0)', flexDirection: 'row', height: 40, justifyContent: 'center',
                      alignItems: 'center', textAlign: 'center'}}>
                    <Text style={{color: 'white', marginRight: 5}}>Pas encore inscrit ?</Text>
                    <TouchableOpacity onPress={() => this._Inscription()}>
                      <Text style={{color: '#344a8d', fontWeight: 'bold'}}>Inscrivez-vous</Text>
                    </TouchableOpacity>
                  </View>
                </View>
              </View>
              </Image>
            </View>
          )
        } else {
          <Index />
        }
      case "Home":
        return(
          <Index />
        )
      case "Register":
        return(
          <RegisterScreen {...globalNavigatorProps}/>
        )
    }
  }

  _Connexion() {
    firebase.auth().signInWithEmailAndPassword(strEmail, strPassword).catch(function(error) {
      alert('Mauvaise adresse mail ou mot de passe !');
    });

    /*var naviRef = this.refs.NavRef
    naviRef.push({
      ident: 'Home'
    })*/
  }

  _Inscription() {
    var naviRef = this.refs.NavRef
    naviRef.push({
      ident: 'Register'
    })
  }

  _MailFocus() {
    txtMail.setNativeProps({placeholder:''})
  }

  _ReleaseFocus() {
    txtMail.setNativeProps({placeholder: 'Adresse email'})
    txtPassword.setNativeProps({placeholder: 'Mot de passe'})
  }

  _PasswordFocus() {
    txtPassword.setNativeProps({placeholder:''})
  }

  render() {
    firebase.auth().onAuthStateChanged(function(user) {
      if (user) {
        // User is signed in
        global.userID = user.uid
      }
    });

    return (
      <Navigator
        initialRoute={{ident: "Login"}}
        ref="NavRef"
        renderScene={this._renderScene}
        style={{height: global.ScreenHeight}}/>
    );
  }
}

/* Styles */
const styles = StyleSheet.create({
  toolbarTitle: {
      textAlign:'center',
      fontWeight:'bold',
      flex: 1,
      color: 'white',
  },
  mainContainer: {
    height: ScreenHeight,
  },
  container: {
    justifyContent: 'center',
    flex:1,
  },
  toolbar: {
    flexDirection:'row',
    alignItems:'center',
  },
  title: {
    fontSize: 60,
    textAlign: 'center',
    alignItems: 'center',
    color: 'white',
    fontFamily: 'Avenir Next',
    fontWeight: '300',
  },
  titleView: {
      flex: 1,
      justifyContent:'center',
      alignItems: 'center',
      backgroundColor: 'rgba(0,0,0,0)',
  },
  subtitle: {
    textAlign: 'center',
    fontSize: 20,
    color: 'white',
    fontFamily: 'Avenir Next',
    fontWeight: '300',
    marginBottom: 60,
  },
  borderedView: {
    backgroundColor: '#344a8d',
    height: 50,
    justifyContent: 'center',
    alignItems: 'center'
  },
  loginButton: {
    color: 'white',
    width: ScreenWidth,
    textAlign: 'center',
    alignItems: 'center',
    justifyContent: 'center'
  },
  buttonsView: {
    alignItems: 'center',
    justifyContent: 'flex-end',
  },
  backgroundz: {
    resizeMode: 'cover',
    width: ScreenWidth,
    height: ScreenHeight,
  },
});