Basic signups are working

src/components/panels/signup.jsx

@@ -6,6 +6,7 @@ export default class Signup extends React.Component {
 		super(props);
 		this.state = {
 			email: '',
+			username: '',
 			password: '',
 			retype: '',
 			warning: ''
@@ -31,6 +32,11 @@ export default class Signup extends React.Component {
 						<input type='text' name='email' value={this.state.email} onChange={this.updateEmail.bind(this)} />
 					</div>
 
+					<div>
+						<label>User Name:</label>
+						<input type='text' name='username' value={this.state.username} onChange={this.updateUsername.bind(this)} />
+					</div>
+
 					<div>
 						<label>Password:</label>
 						<input type='password' name='password' value={this.state.password} onChange={this.updatePassword.bind(this)} />
@@ -53,6 +59,16 @@ export default class Signup extends React.Component {
 			this.setWarning('Invalid Email');
 		}
 
+		else if (this.state.username.length < 4) {
+			e.preventDefault();
+			this.setWarning('Minimum username length is 4 characters');
+		}
+
+		else if (this.state.username.length > 100) {
+			e.preventDefault();
+			this.setWarning('Maximum username length is 100 characters');
+		}
+
 		else if (this.state.password.length < 8) {
 			e.preventDefault();
 			this.setWarning('Minimum password length is 8 characters');
@@ -85,6 +101,12 @@ export default class Signup extends React.Component {
 		});
 	}
 
+	updateUsername(evt) {
+		this.setState({
+			username: evt.target.value
+		});
+	}
+
 	updatePassword(evt) {
 		this.setState({
 			password: evt.target.value