LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Packages Projects Releases 238 Wiki Activity

Make menus close after you click an option

Browse source
This commit is contained in:
Alex Liebowitz 2017-02-24 04:13:52 -05:00
parent e8da1d09f5
commit b041d66ee4
1 changed files with 9 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
js/component/menu.js
View file

@ -42,7 +42,7 @@ export let DropDownMenu = React.createClass({
window.removeEventListener('click', this.handleWindowClick, false);
}
},
onMenuIconClick: function(e) {
handleMenuIconClick: function(e) {
this.setState({
menuOpen: !this.state.menuOpen,
});
@ -53,6 +53,12 @@ export let DropDownMenu = React.createClass({
}
return false;
},
handleMenuClick: function(e) {
// Event bubbles up to the menu after a link is clicked
this.setState({
menuOpen: false,
});
},
handleWindowClick: function(e) {
if (this.state.menuOpen &&
(!this._menuDiv || !this._menuDiv.contains(e.target))) {
@ -68,9 +74,9 @@ export let DropDownMenu = React.createClass({
}
return (
<div className="menu-container">
<Link ref={(span) => this._menuButton = span} button="text" icon="icon-ellipsis-v" onClick={this.onMenuIconClick} />
<Link ref={(span) => this._menuButton = span} button="text" icon="icon-ellipsis-v" onClick={this.handleMenuIconClick} />
{this.state.menuOpen
? <div ref={(div) => this._menuDiv = div} className="menu">
? <div ref={(div) => this._menuDiv = div} className="menu" onClick={this.handleMenuClick}>
{this.props.children}
</div>
: null}