I think i'm almost there
This commit is contained in:
parent
27a29d827a
commit
6e57686f8f
2 changed files with 39 additions and 35 deletions
|
@ -6,11 +6,12 @@ class AuthMenu extends Component {
|
||||||
super(props)
|
super(props)
|
||||||
this.state = {
|
this.state = {
|
||||||
where_in_auth_menu: "username",
|
where_in_auth_menu: "username",
|
||||||
auth_menu_visible: true,
|
auth_menu_visible: props.auth_menu_visible,
|
||||||
}
|
}
|
||||||
this.handleSignUpRequest = this.handleSignUpRequest.bind(this)
|
this.handleSignUpRequest = this.handleSignUpRequest.bind(this)
|
||||||
this.handleLogInAttempt = this.handleLogInAttempt.bind(this)
|
this.handleLogInAttempt = this.handleLogInAttempt.bind(this)
|
||||||
this.handleAccountCreation = this.handleAccountCreation.bind(this)
|
this.handleAccountCreation = this.handleAccountCreation.bind(this)
|
||||||
|
this.authMenu = this.authMenu.bind(this)
|
||||||
}
|
}
|
||||||
|
|
||||||
handleSignUpRequest() {
|
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() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<div>
|
this.authMenu(this.state.auth_menu_visible)
|
||||||
{(() => {
|
|
||||||
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>
|
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -29,7 +29,7 @@ class NavBar extends Component {
|
||||||
<div onClick={this.handleLoginDropdown} className='item ui button dropdown'>
|
<div onClick={this.handleLoginDropdown} className='item ui button dropdown'>
|
||||||
Login
|
Login
|
||||||
<i className="dropdown icon"></i>
|
<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>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Reference in a new issue