summaryrefslogtreecommitdiffstats
path: root/webapp/components/get_link_modal.jsx
diff options
context:
space:
mode:
authorChristopher Speller <crspeller@gmail.com>2016-03-14 08:50:46 -0400
committerChristopher Speller <crspeller@gmail.com>2016-03-16 18:02:55 -0400
commit12896bd23eeba79884245c1c29fdc568cf21a7fa (patch)
tree4e7f83d3e2564b9b89d669e9f7905ff11768b11a /webapp/components/get_link_modal.jsx
parent29fe6a3d13c9c7aa490fffebbe5d1b5fdf1e3090 (diff)
downloadchat-12896bd23eeba79884245c1c29fdc568cf21a7fa.tar.gz
chat-12896bd23eeba79884245c1c29fdc568cf21a7fa.tar.bz2
chat-12896bd23eeba79884245c1c29fdc568cf21a7fa.zip
Converting to Webpack. Stage 1.
Diffstat (limited to 'webapp/components/get_link_modal.jsx')
-rw-r--r--webapp/components/get_link_modal.jsx139
1 files changed, 139 insertions, 0 deletions
diff --git a/webapp/components/get_link_modal.jsx b/webapp/components/get_link_modal.jsx
new file mode 100644
index 000000000..c04ebb957
--- /dev/null
+++ b/webapp/components/get_link_modal.jsx
@@ -0,0 +1,139 @@
+// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+import $ from 'jquery';
+import ReactDOM from 'react-dom';
+import {FormattedMessage} from 'react-intl';
+
+import {Modal} from 'react-bootstrap';
+
+import React from 'react';
+
+export default class GetLinkModal extends React.Component {
+ constructor(props) {
+ super(props);
+
+ this.onHide = this.onHide.bind(this);
+
+ this.copyLink = this.copyLink.bind(this);
+
+ this.state = {
+ copiedLink: false
+ };
+ }
+
+ onHide() {
+ this.setState({copiedLink: false});
+
+ this.props.onHide();
+ }
+
+ copyLink() {
+ var copyTextarea = $(ReactDOM.findDOMNode(this.refs.textarea));
+ copyTextarea.select();
+
+ try {
+ var successful = document.execCommand('copy');
+ if (successful) {
+ this.setState({copiedLink: true});
+ } else {
+ this.setState({copiedLink: false});
+ }
+ } catch (err) {
+ this.setState({copiedLink: false});
+ }
+ }
+
+ render() {
+ let helpText = null;
+ if (this.props.helpText) {
+ helpText = (
+ <p>
+ {this.props.helpText}
+ <br/>
+ <br/>
+ </p>
+ );
+ }
+
+ let copyLink = null;
+ if (document.queryCommandSupported('copy')) {
+ copyLink = (
+ <button
+ data-copy-btn='true'
+ type='button'
+ className='btn btn-primary pull-left'
+ onClick={this.copyLink}
+ >
+ <FormattedMessage
+ id='get_link.copy'
+ defaultMessage='Copy Link'
+ />
+ </button>
+ );
+ }
+
+ const linkText = (
+ <textarea
+ className='form-control no-resize min-height'
+ readOnly='true'
+ ref='textarea'
+ value={this.props.link}
+ />
+ );
+
+ var copyLinkConfirm = null;
+ if (this.state.copiedLink) {
+ copyLinkConfirm = (
+ <p className='alert alert-success alert--confirm'>
+ <i className='fa fa-check'></i>
+ <FormattedMessage
+ id='get_link.clipboard'
+ defaultMessage=' Link copied to clipboard.'
+ />
+ </p>
+ );
+ }
+
+ return (
+ <Modal
+ show={this.props.show}
+ onHide={this.onHide}
+ >
+ <Modal.Header closeButton={true}>
+ <h4 className='modal-title'>{this.props.title}</h4>
+ </Modal.Header>
+ <Modal.Body>
+ {helpText}
+ {linkText}
+ </Modal.Body>
+ <Modal.Footer>
+ <button
+ type='button'
+ className='btn btn-default'
+ onClick={this.onHide}
+ >
+ <FormattedMessage
+ id='get_link.close'
+ defaultMessage='Close'
+ />
+ </button>
+ {copyLink}
+ {copyLinkConfirm}
+ </Modal.Footer>
+ </Modal>
+ );
+ }
+}
+
+GetLinkModal.propTypes = {
+ show: React.PropTypes.bool.isRequired,
+ onHide: React.PropTypes.func.isRequired,
+ title: React.PropTypes.string.isRequired,
+ helpText: React.PropTypes.string,
+ link: React.PropTypes.string.isRequired
+};
+
+GetLinkModal.defaultProps = {
+ helpText: null
+};