import React, { Component } from 'react';
import './style.css';
import './login.css'
var unirest = require('unirest');


class Login extends Component {

  renderUserMessage(){

      if (window.location.search === "?failed=1") {
        return (
          <div class="alert alert-info" role="alert">
              <strong>Try Again!</strong> Your username or password is not quite correct.
          </div>
        );
      } else {
        return (
        <div></div>
        );
      }
    }

  constructor(props) {
     super(props);

     this.state = {
        userName: '',
        password: '',

     }

     this.updateStateuserName.userName = this.updateStateuserName.bind(this);
     this.updateStatepassword.password = this.updateStatepassword.bind(this);

  };

  updateStateuserName(e) {
     this.setState({userName: e.target.value});
  }
  updateStatepassword(e) {
     this.setState({password: e.target.value});
  }

  checkLogin(e) {
   e.preventDefault();


    var uName = this.state.userName
    var uPass = this.state.password

console.log(uName);
console.log(uPass);

unirest.post('http://grwh.work:3001/api/signin')
.headers({'Accept': 'application/json', 'Content-Type': 'application/json'})
.send({ "email": "snxraven@gmail.com", "password": "jonn22" })
.end(function (response) {
  console.log(response.body);
});


  //window.location.replace('/login?failed=1');
}

  render() {


  //  if (LoggedInChecker != "True"){
  return (
       <div>

           <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" />
           <div className="container">
             <div className="wrapper">
               <form action="/home" method="post" name="Login_Form" className="form-signin" onSubmit={this.checkLogin.bind(this)}>
                 <div className="row text-center bol"><i className="fa fa-circle" /></div>
                 <h3 className="form-signin-heading text-center">
                   Venue Manager <br /> Developer Version 1.0 {this.props.params}<br />
                 </h3>
                 <hr className="spartan" />
                 <div className="input-group">
                   <span className="input-group-addon" id="sizing-addon1">
                     <i className="fa fa-user" />
                   </span>
                   <input type="text" className="form-control input-md" name="Username" placeholder="Username" value = {this.state.userName}
              onChange = {this.updateStateuserName.userName} required autofocus />



                 </div>
                 <div className="input-group">
                   <span className="input-group-addon" id="sizing-addon1">
                     <i className="fa fa-lock" />
                   </span>
                   <input type="password" className="form-control" name="Password" placeholder="Password" value = {this.state.password}
              onChange = {this.updateStatepassword.password} required />


                 </div>
                 <button  className="btn btn-lg btn-primary btn-block" name="Submit" value="true" type="Submit">Submit</button>
                <div> <center> { this.renderUserMessage() } </center></div>



               </form>

             </div>
           </div>
         </div>



     );
  //}
}
}
export default Login;