1
0
mirror of https://github.com/ascribe/onion.git synced 2024-06-30 21:52:08 +02:00
onion/js/components/ascribe_buttons/acl_information_button.js
2015-10-14 11:41:16 +02:00

65 lines
1.8 KiB
JavaScript

'use strict';
import React from 'react';
import classnames from 'classnames';
import AclInformation from '../ascribe_information/acl_information';
import Button from 'react-bootstrap/lib/Button';
let AclInformationButton = React.createClass({
propTypes: {
verbs: React.PropTypes.oneOfType([
React.PropTypes.string,
React.PropTypes.arrayOf(React.PropTypes.string)
])
},
getInitialState() {
return {isVisible: false};
},
componentDidMount() {
console.log('Information button being launched');
this.dropdownButtonStyle = {
background: 'none',
color: 'black',
padding: 0,
border: 'none'
};
this.dropdownListStyle = {
textAlign: 'justify',
width: '80.8%',
border: '1px solid #CCC',
backgroundColor: 'white',
padding: '0.5em'
};
},
onOff() {
if (!this.state.isVisible) {
this.setState({isVisible: true});
}
else {
this.setState({isVisible: false});
}
},
showInformation() {
if (this.state.isVisible) {
return (<AclInformation aim={'button'} verbs={this.props.verbs}/>);
}
},
render() {
return (
<span>
<Button style = {this.dropdownButtonStyle} className="glyphicon glyphicon-question-sign" onClick={this.onOff} />
<div
style={this.dropdownListStyle}
className={classnames({'hidden': !this.state.isVisible})}>
{this.showInformation()}
</div>
</span>
);
}
});
export default AclInformationButton;