1
0
Fork 0

I think i'm almost there

This commit is contained in:
Amarpreet Minhas 2019-08-27 20:53:20 -04:00
parent 27a29d827a
commit 6e57686f8f
2 changed files with 39 additions and 35 deletions

View file

@ -6,11 +6,12 @@ class AuthMenu extends Component {
super(props)
this.state = {
where_in_auth_menu: "username",
auth_menu_visible: true,
auth_menu_visible: props.auth_menu_visible,
}
this.handleSignUpRequest = this.handleSignUpRequest.bind(this)
this.handleLogInAttempt = this.handleLogInAttempt.bind(this)
this.handleAccountCreation = this.handleAccountCreation.bind(this)
this.authMenu = this.authMenu.bind(this)
}
handleSignUpRequest() {
@ -33,41 +34,44 @@ class AuthMenu extends Component {
}));
}
authMenu() {
if (!this.state.auth_menu_visible) {
return null;
}
switch(this.state.where_in_auth_menu) {
case 'username':
return (
<div className="ui menu dropdown" style={{display: "inline"}}>
<div className="ui left icon input">
<input type="text" placeholder="Username">
</input>
<i className="users icon"></i>
</div>
<div className="fluid ui buttons">
<button onClick={this.handleSignUpRequest} className="ui button">Sign Up</button>
<div className="or"></div>
<button className="ui positive button">Sign In</button>
</div>
</div>
)
case 'password':
return (
<div className="ui menu dropdown" style={{display: "inline"}}>
<div className="ui left icon input">
<input type="text" placeholder="Username">
</input>
<i className="users icon"></i>
</div>
</div>
)
default:
return null;
}
}
render() {
return (
<div>
{(() => {
switch(this.state.auth_location) {
case 'username':
return (
<div className="ui menu dropdown" style={{display: "inline"}}>
<div className="ui left icon input">
<input type="text" placeholder="Username">
</input>
<i className="users icon"></i>
</div>
<div className="fluid ui buttons">
<button onClick={this.handleSignUpRequest} className="ui button">Sign Up</button>
<div className="or"></div>
<button className="ui positive button">Sign In</button>
</div>
</div>
)
case 'password':
return (
<div className="ui menu dropdown" style={{display: "inline"}}>
<div className="ui left icon input">
<input type="text" placeholder="Username">
</input>
<i className="users icon"></i>
</div>
</div>
)
default:
return null;
}
})()}
</div>
this.authMenu(this.state.auth_menu_visible)
)
}
}

View file

@ -29,7 +29,7 @@ class NavBar extends Component {
<div onClick={this.handleLoginDropdown} className='item ui button dropdown'>
Login
<i className="dropdown icon"></i>
<AuthMenu showMenu={this.state.auth_menu_visible}></AuthMenu>
<AuthMenu auth_menu_visible={this.state.auth_menu_visible}></AuthMenu>
</div>
</div>
</div>