text: import React from 'react'
  import Input from '../FormComponents/Input'
  import _ from 'underscore'
  import Icon from '../FormComponents/Icon'
  import './style.css'
  
  
  var SignInForm = React.createClass({
    getInitialState: function () {
      return {
        email: null,
        companyName: null,
        password: null,
        confirmPassword: null,
        statesValue: null,
        forbiddenWords: ["password", "user", "username"]
      }
    },
  
    handlePasswordInput: function (event) {
      if(!_.isEmpty(this.state.confirmPassword)){
        this.refs.passwordConfirm.isValid();
      }
      this.refs.passwordConfirm.hideError();
      this.setState({
        password: event.target.value
      });
    },
  
    handleConfirmPasswordInput: function (event) {
      this.setState({
        confirmPassword: event.target.value
      });
    },
  
    saveAndContinue: function (e) {
      e.preventDefault();
  
      var canProceed = this.validateEmail(this.state.email)
          && !_.isEmpty(this.state.statesValue)
          && this.refs.password.isValid()
          && this.refs.passwordConfirm.isValid();
  
      if(canProceed) {
        var data = {
          email: this.state.email,
          state: this.state.statesValue
        }
        alert('Thanks.');
      } else {
        this.refs.email.isValid();
        this.refs.state.isValid();
        this.refs.companyName.isValid();
        this.refs.password.isValid();
        this.refs.passwordConfirm.isValid();
      }
    },
  
    isConfirmedPassword: function (event) {
      return (event == this.state.password)
    },
  
    handleCompanyInput: function(event) {
      this.setState({
        companyName: event.target.value
      })
    },
  
    handleEmailInput: function(event){
      this.setState({
        email: event.target.value
      });
    },
  
    validateEmail: function (event) {
      // regex from http://stackoverflow.com/questions/46155/validate-email-address-in-javascript
      var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
      return re.test(event);
    },
  
    isEmpty: function (value) {
      return !_.isEmpty(value);
    },
  
    updateStatesValue: function (value) {
      this.setState({
        statesValue: value
      })
    },
  
    render: function() {
      return (
        <div className="create_account_screen">
  
          <div className="create_account_form">
            <h1>Sign In</h1>
            <p>Example of form validation built with React.</p>
            <form onSubmit={this.saveAndContinue}>
  
              <Input
                text="Email Address"
                ref="email"
                type="text"
                defaultValue={this.state.email}
                validate={this.validateEmail}
                value={this.state.email}
                onChange={this.handleEmailInput}
                errorMessage="Email is invalid"
                emptyMessage="Email can't be empty"
                errorVisible={this.state.showEmailError}
              />
  
  
              <Input
                text="Password"
                type="password"
                ref="password"
                validator="true"
                minCharacters="8"
                requireCapitals="1"
                requireNumbers="1"
                forbiddenWords={this.state.forbiddenWords}
                value={this.state.passsword}
                emptyMessage="Password is invalid"
                onChange={this.handlePasswordInput}
              />
  
  
              <button
                type="submit"
                className="button button_wide">
                SIGN IN
              </button>
  
            </form>
  
             <a href="https://github.com/mikepro4/react-signup-form" target="_blank" className="github_link" title="View Source Code">
                <Icon type="guthub" />
            </a>
          </div>
  
        </div>
      );
    }
  
  });
  
  export default SignInForm;
  