Reformatted get_link_modal.jsx to meet style guide requirements.

Этот коммит содержится в:
JoramWilander
2015-09-01 10:17:54 -04:00
родитель dad4dbed7e
Коммит 5d44b01f40

Просмотреть файл

@@ -5,66 +5,120 @@ var UserStore = require('../stores/user_store.jsx');
var ZeroClipboardMixin = require('react-zeroclipboard-mixin'); var ZeroClipboardMixin = require('react-zeroclipboard-mixin');
ZeroClipboardMixin.ZeroClipboard.config({ ZeroClipboardMixin.ZeroClipboard.config({
swfPath: '../../static/flash/ZeroClipboard.swf' swfPath: '../../static/flash/ZeroClipboard.swf'
}); });
module.exports = React.createClass({ export default class GetLinkModal extends React.Component {
displayName: 'GetLinkModal', constructor(props) {
zeroclipboardElementsSelector: '[data-copy-btn]', super(props);
mixins: [ZeroClipboardMixin],
componentDidMount: function() { this.zeroclipboardElementsSelector = '[data-copy-btn]';
this.mixins = [ZeroClipboardMixin];
this.handleClick = this.handleClick.bind(this);
this.state = {copiedLink: false};
}
componentDidMount() {
var self = this; var self = this;
if (this.refs.modal) { if (this.refs.modal) {
$(this.refs.modal.getDOMNode()).on('show.bs.modal', function(e) { $(this.refs.modal.getDOMNode()).on('show.bs.modal', function show(e) {
var button = e.relatedTarget; var button = e.relatedTarget;
self.setState({title: $(button).attr('data-title'), value: $(button).attr('data-value')}); self.setState({title: $(button).attr('data-title'), value: $(button).attr('data-value')});
}); });
$(this.refs.modal.getDOMNode()).on('hide.bs.modal', function() { $(this.refs.modal.getDOMNode()).on('hide.bs.modal', function hide() {
self.setState({copiedLink: false}); self.setState({copiedLink: false});
}); });
} }
}, }
getInitialState: function() { handleClick() {
return {copiedLink: false}; var copyTextarea = $(React.findDOMNode(this.refs.textarea));
}, copyTextarea.select();
handleClick: function() {
this.setState({copiedLink: true}); try {
}, var successful = document.execCommand('copy');
render: function() { if (successful) {
this.setState({copiedLink: true});
} else {
this.setState({copiedLink: false});
}
} catch (err) {
this.setState({copiedLink: false});
}
}
render() {
var currentUser = UserStore.getCurrentUser(); var currentUser = UserStore.getCurrentUser();
var copyLinkConfirm = null; var copyLinkConfirm = null;
if (this.state.copiedLink) { if (this.state.copiedLink) {
copyLinkConfirm = <p className='alert alert-success copy-link-confirm'><i className="fa fa-check"></i> Link copied to clipboard.</p>; copyLinkConfirm = <p className='alert alert-success copy-link-confirm'><i className='fa fa-check'></i> Link copied to clipboard.</p>;
} }
if (currentUser != null) { if (currentUser != null) {
return ( return (
<div className='modal fade' ref='modal' id='get_link' tabIndex='-1' role='dialog' aria-hidden='true'> <div
<div className='modal-dialog'> className='modal fade'
<div className='modal-content'> ref='modal'
<div className='modal-header'> id='get_link'
<button type='button' className='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>&times;</span></button> tabIndex='-1'
<h4 className='modal-title' id='myModalLabel'>{this.state.title} Link</h4> role='dialog'
aria-hidden='true'
>
<div className='modal-dialog'>
<div className='modal-content'>
<div className='modal-header'>
<button
type='button'
className='close'
data-dismiss='modal'
aria-label='Close'
>
<span aria-hidden='true'>&times;</span>
</button>
<h4
className='modal-title'
id='myModalLabel'
>
{this.state.title} Link
</h4>
</div>
<div className='modal-body'>
<p>
Send {strings.Team + 'mates'} the link below for them to sign-up to this {strings.Team} site.
<br /><br />
Be careful not to share this link publicly, since anyone with the link can join your {strings.Team}.
</p>
<textarea
className='form-control no-resize'
readOnly='true'
ref='textarea'
value={this.state.value}
/>
</div>
<div className='modal-footer'>
<button
type='button'
className='btn btn-default'
data-dismiss='modal'
>
Close
</button>
<button
data-copy-btn='true'
type='button'
className='btn btn-primary pull-left'
onClick={this.handleClick}
data-clipboard-text={this.state.value}
>
Copy Link
</button>
{copyLinkConfirm}
</div>
</div> </div>
<div className='modal-body'> </div>
<p>
Send {strings.Team + 'mates'} the link below for them to sign-up to this {strings.Team} site.
<br /><br />
Be careful not to share this link publicly, since anyone with the link can join your {strings.Team}.
</p>
<textarea className='form-control no-resize' readOnly='true' value={this.state.value}></textarea>
</div>
<div className='modal-footer'>
<button type='button' className='btn btn-default' data-dismiss='modal'>Close</button>
<button data-copy-btn='true' type='button' className='btn btn-primary pull-left' onClick={this.handleClick} data-clipboard-text={this.state.value}>Copy Link</button>
{copyLinkConfirm}
</div>
</div>
</div>
</div> </div>
); );
} }
return <div/>; return <div/>;
} }
}); }