var StudentHome = React.createClass({
    getInitialState: function () {
        $(UserEntity).on('StudentHome', function () {
            var grade = UserEntity.get();
            this.setState({grade: grade});
        }.bind(this));
        UserEntity.loadStudentHome(this.props.user.id);
        var index = Navigation.indexOf('login');
        //console.log(index);
        if (index > -1) {
            Navigation.splice(index, 1);
        }
        return ({
            user: {
            },
            grade: {
                grade: 'Pending',
                max: 'Pending'
            }
        })

    },

    handleClick: function (e) {

    },
    render: function () {
        return (
            <div className="container">
                <div className="page-header">
                    <h1>Spring 2015
                        <small>Home</small>
                    </h1>
                </div>

                <form>
                    <div className="row">
                        <div className="form-group col-xs-12 col-md-6">
                            <div className="input-group full-width">
                                <span className="input-group-addon form-custom-addon" id="">First Name</span>
                                <input type="text" className="form-control" placeholder={this.props.user.fname} readOnly/>
                            </div>
                        </div>
                        <div className="form-group col-xs-12 col-md-6">
                            <div className="input-group full-width">
                                <span className="input-group-addon form-custom-addon" id="">Last Name</span>
                                <input type="text" className="form-control" placeholder={this.props.user.lname} readOnly/>
                            </div>
                        </div>
                    </div>
                    <div className="form-group">
                        <div className="input-group full-width">
                            <span className="input-group-addon form-custom-addon" id="">Email</span>
                            <input type="text" className="form-control" placeholder={this.props.user.email} readOnly/>
                        </div>
                    </div>

                    <div className="form-group">
                        <div className="input-group full-width">
                            <span className="input-group-addon form-custom-addon" id="">Panther ID</span>
                            <input type="text" className="form-control" placeholder={this.props.user.id} readOnly/>
                        </div>
                    </div>
                    <div className="form-group">
                        <div className="input-group full-width">
                            <span className="input-group-addon form-custom-addon" id="">Project</span>
                            <input type="text" className="form-control" placeholder={this.props.user.name} readOnly/>
                        </div>
                    </div>
                    <div className="form-group">
                        <div className="input-group full-width">
                            <span className="input-group-addon form-custom-addon">Location</span>
                            <input type="text" className="form-control" placeholder={this.props.user.nameLocation} readOnly/>
                            <span className="input-group-addon">
                                <a href="http://users.cis.fiu.edu/~sadjadi/Upload/SeniorProject/SeniorProject-FloorPlan-Spring2015.png" target="_blank"><i className="fa fa-location-arrow"></i> Map</a>
                            </span>
                        </div>
                    </div>
                    <div className="form-group">
                        <div className="input-group full-width">
                            <span className="input-group-addon form-custom-addon" id="">Grade</span>
                            <span className="form-control"><span className={this.state.grade.grade == 'Pending' ? "label label-success" : getLable(this.state.grade.grade, this.state.grade.max)}>{this.state.grade.grade} / {this.state.grade.max}</span></span>
                        </div>
                    </div>
                </form>
            </div>
        );
    }
});