Reformatted get_link_modal.jsx to meet style guide requirements.
Этот коммит содержится в:
@@ -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'>×</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'>×</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/>;
|
||||||
}
|
}
|
||||||
});
|
}
|
||||||
|
|||||||
Ссылка в новой задаче
Block a user