var LoginView = React.createClass({
  render: function() {
    return (
      <div>
        <h1>Inloggning krävs</h1>

        <form onSubmit={this.login}>
          <div className="field">
            <label>Användarnamn</label>
            <input type="text" ref="login" />
          </div>

          <div className="field" style={{ clear: 'both' }}>
            <label>Lösenord</label>
            <input type="password" ref="pass" />
          </div>

          <div style={{ clear: 'both' }}>
            <button type="submit">Logga in</button>
          </div>
        </form>
      </div>
    )
  },
  login: function(event) {
    console.debug(this.refs.pass, React.findDOMNode(this.refs.pass), React.findDOMNode(this.refs.pass).value)
    event.preventDefault();

    $.ajax({
      url: '/api/login',
      data: {
        login: React.findDOMNode(this.refs.login).value,
        password: React.findDOMNode(this.refs.pass).value
      },
      success: function(token) {
        if (token != "login-failed") {
          this.props.onLogin(token)
        } else {
          alert("Login failed. Please try again.")
        }
      }.bind(this)
    });
  }
});
