import React, {Component} from "react";
import ItemNav from "./Navbar";
import axios from "axios";
import * as configs from "../Config/config";
import swal from "sweetalert";

export default class Login extends Component{

    constructor(props) {
        super(props);

        this.state = {
            email:"",
            password:""

        };

        this.onChangeEmail = this.onChangeEmail.bind(this);
        this.onChangePassword = this.onChangePassword.bind(this);
        this.onSubmit = this.onSubmit.bind(this);
    }

    onSubmit(e){
        e.preventDefault();

        const LogUser = {
            user_email : this.state.email,
            user_password: this.state.password
        }

        const email = this.state.email;

        axios.post(configs.BASE_URL + '/userAccount/getCredentials', LogUser)
            .then(response => {
                console.log(response.data);
                //console.log(response.data.length);
                // if (response.data.length > 0) {
                    //console.log(response.data);
                    //console.log(response.data.password);

                    if(response.data === "Invalid Password"){
                        swal("Sorry", "Invalid Password", "warning");
                    }
                    else if(response.data === "Not registered"){
                        swal("Sorry", "This email not registered!!!", "warning");
                    }
                    else if(response.data === "Not Verified"){
                        swal("Sorry", "This email is not Verified\nPlease verify your email first", "warning");
                    }else {

                        console.log(response.data);

                        console.log(response.data.user_email);
                        console.log(response.data.user_name);

                        localStorage.setItem("email",response.data.user_email);
                        localStorage.setItem("userID",response.data.user_id);
                        localStorage.setItem("userName",response.data.user_name);
                        localStorage.setItem("userType",response.data.user_type);

                        if(response.data.user_type === 'Student'){
                            window.location = '/Home';
                        }
                        else if(response.data.user_type === 'Tutor'){
                            window.location = '/admin';
                        }
                        else if(response.data.user_type === 'Institute'){
                            window.location = '/admin';
                        }
                    }



                    //window.location = '/Places';
                //}
                // else {
                //     swal("Sorry", response.data, "warning");
                //
                // }


            });

    }

    onChangeEmail(e){
        this.setState({
            email: e.target.value
        });
    }

    onChangePassword(e){
        this.setState({
            password: e.target.value
        });
    }


    render() {
        return (
            <div>
                <div className="row" style={{width:'100%', margin:'0px'}}>
                    <ItemNav/>
                </div>
                <div className="container" style={{padding:'10px'}}>
                    <div style={{width:'35%', margin:'auto', marginTop:'7%', padding:'0px', paddingBottom: '30px', border:'solid', borderColor:'#216E9B'}} >
                        <form onSubmit={this.onSubmit} id="login" name="login" className="login">
                            <div className="row">
                                <br/>
                            </div>

                            <div className="row" style={{display: 'flex', justifyContent: 'center'}}>
                                <h3 style={{fontFamily: 'emoji', color: '#265077', margin:'20px', textAlign:'center'}}><b>Login</b></h3>
                            </div>



                            <div className="row" style={{display: 'flex', justifyContent: 'center'}}>
                                <label style={{fontFamily: 'emoji', color: '#A9BCC8'}}>Use your credentials to login</label>
                            </div>
                            <div className="row" style={{margin:'5px'}}>

                            </div>
                            <div className="row" style={{marginTop:'10px',marginBottom:'10px'}}>
                                <div className="col-1">

                                </div>
                                <div className="col-10">
                                    <input type="email" id="email" className="form-control" placeholder="UserName" onChange={this.onChangeEmail} required/>
                                </div>
                                <div className="col-1">

                                </div>
                            </div>
                            <div className="row" style={{marginTop:'10px',marginBottom:'10px'}}>
                                <div className="col-1">

                                </div>
                                <div className="col-10">
                                    <input type="password" id="password" className="form-control" placeholder="Password" onChange={this.onChangePassword} required/>
                                </div>
                                <div className="col-1">

                                </div>
                            </div>
                            <div className="row" style={{display: 'flex', justifyContent: 'center'}}>
                                <label style={{fontFamily: 'emoji', color: '#2353BA'}}>Forgot Password???</label>

                            </div>
                            <div className="row" style={{marginTop:'5px',marginBottom:'5px',display: 'flex', justifyContent: 'center'}}>
                                <button type="submit" className="btn btn-primary" style={{width:'50%',marginTop: '0px',  backgroundColor: '#265077', borderColor: '#216E9B'}}><b>Sign In</b></button>
                            </div>
                            <div className="row" style={{marginTop:'0px',marginBottom:'5px',display: 'flex', justifyContent: 'center'}}>

                                <a href="/SignUp" type="submit"
                                   className="profile-edit-btn nav-link  btn btn-primary" name="btnAddMore"
                                   style={{
                                       marginTop: '0px', marginBottom: '20px', width:'50%',
                                       backgroundColor: '#2D5F5D', borderColor: '#216E9B', fontSize: '12px'

                                   }}>
                                    Sign Up
                                </a>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        )
    }

}
