70 lines
1.5 KiB
JavaScript
70 lines
1.5 KiB
JavaScript
import React, { Component } from 'react';
|
|
import { render } from 'react-dom';
|
|
|
|
import ContextButton from './ContextButton';
|
|
import ContextMenuButton from './ContextMenuButton';
|
|
|
|
class ContextMenu extends Component {
|
|
constructor(props) {
|
|
super(props);
|
|
|
|
this.handleClickOutside = function(e) {
|
|
this.closeMenu();
|
|
e.stopPropagation();
|
|
}.bind(this);
|
|
}
|
|
|
|
isOpen() {
|
|
return this.open;
|
|
}
|
|
|
|
openMenu(ref, el) {
|
|
let keys = Object.keys(this.refs);
|
|
for(let i = 0; i < keys.length; i++) {
|
|
this.refs[keys[i]].hide(ref, el);
|
|
}
|
|
el.open();
|
|
this.open = true;
|
|
}
|
|
|
|
closeMenu() {
|
|
let keys = Object.keys(this.refs);
|
|
for(let i = 0; i < keys.length; i++) {
|
|
this.refs[keys[i]].hide();
|
|
}
|
|
this.open = false;
|
|
}
|
|
|
|
hoverMenu(ref, el) {
|
|
if(!this.isOpen()) return;
|
|
this.openMenu(ref, el);
|
|
}
|
|
|
|
componentDidMount() {
|
|
document.addEventListener('click', this.handleClickOutside);
|
|
}
|
|
|
|
componentWillUmount() {
|
|
document.removeEventListener('click', this.handleClickOutside);
|
|
}
|
|
|
|
render() {
|
|
let contextButtons = [];
|
|
let btnKeys = Object.keys(this.props.menu);
|
|
for(let i = 0; i < btnKeys.length; i++) {
|
|
let key = btnKeys[i];
|
|
var b = this.props.menu[key];
|
|
if(b === false) continue;
|
|
contextButtons.push(<ContextButton data={b} title={key} menu={this} ref={key} key={key} selfRef={key} />);
|
|
}
|
|
|
|
return (
|
|
<div className="c-context-menu">
|
|
{contextButtons}
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default ContextMenu;
|