You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by ma...@apache.org on 2017/10/04 05:34:42 UTC
[incubator-superset] branch master updated: [Feature]
Copy-to-clipboard button in View Query (#3571)
This is an automated email from the ASF dual-hosted git repository.
maximebeauchemin pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-superset.git
The following commit(s) were added to refs/heads/master by this push:
new 7e64f2e [Feature] Copy-to-clipboard button in View Query (#3571)
7e64f2e is described below
commit 7e64f2e98868193e83536159c76226263479f91d
Author: Jeff Niu <je...@gmail.com>
AuthorDate: Tue Oct 3 22:34:40 2017 -0700
[Feature] Copy-to-clipboard button in View Query (#3571)
* added copy-to-clipboard button to explore/view query
* modified CopyToClipboard to deselect current before copying
---
.../javascripts/components/CopyToClipboard.jsx | 12 +++++++++++-
.../explore/components/DisplayQueryButton.jsx | 20 +++++++++++++++++---
2 files changed, 28 insertions(+), 4 deletions(-)
diff --git a/superset/assets/javascripts/components/CopyToClipboard.jsx b/superset/assets/javascripts/components/CopyToClipboard.jsx
index d00347d..7288b0d 100644
--- a/superset/assets/javascripts/components/CopyToClipboard.jsx
+++ b/superset/assets/javascripts/components/CopyToClipboard.jsx
@@ -52,6 +52,10 @@ export default class CopyToClipboard extends React.Component {
}
copyToClipboard(textToCopy) {
+ const selection = document.getSelection();
+ selection.removeAllRanges();
+ document.activeElement.blur();
+ const range = document.createRange();
const textArea = document.createElement('textarea');
textArea.style.position = 'fixed';
@@ -59,7 +63,8 @@ export default class CopyToClipboard extends React.Component {
textArea.value = textToCopy;
document.body.appendChild(textArea);
- textArea.select();
+ range.selectNode(textArea);
+ selection.addRange(range);
try {
if (!document.execCommand('copy')) {
throw new Error(t('Not successful'));
@@ -69,6 +74,11 @@ export default class CopyToClipboard extends React.Component {
}
document.body.removeChild(textArea);
+ if (selection.removeRange) {
+ selection.removeRange(range);
+ } else {
+ selection.removeAllRanges();
+ }
this.setState({ hasCopied: true });
this.props.onCopyEnd();
diff --git a/superset/assets/javascripts/explore/components/DisplayQueryButton.jsx b/superset/assets/javascripts/explore/components/DisplayQueryButton.jsx
index ec5cdcd..06a0164 100644
--- a/superset/assets/javascripts/explore/components/DisplayQueryButton.jsx
+++ b/superset/assets/javascripts/explore/components/DisplayQueryButton.jsx
@@ -4,8 +4,10 @@ import SyntaxHighlighter, { registerLanguage } from 'react-syntax-highlighter/di
import html from 'react-syntax-highlighter/dist/languages/htmlbars';
import markdown from 'react-syntax-highlighter/dist/languages/markdown';
import github from 'react-syntax-highlighter/dist/styles/github';
+import CopyToClipboard from './../../components/CopyToClipboard';
import ModalTrigger from './../../components/ModalTrigger';
+import Button from '../../components/Button';
import { t } from '../../locales';
registerLanguage('markdown', markdown);
@@ -85,9 +87,21 @@ export default class DisplayQueryButton extends React.PureComponent {
return <pre>{this.state.error}</pre>;
} else if (this.state.query) {
return (
- <SyntaxHighlighter language={this.state.language} style={github}>
- {this.state.query}
- </SyntaxHighlighter>);
+ <div>
+ <CopyToClipboard
+ text={this.state.query}
+ shouldShowText={false}
+ copyNode={
+ <Button style={{ position: 'absolute', right: 20 }}>
+ <i className="fa fa-clipboard" />
+ </Button>
+ }
+ />
+ <SyntaxHighlighter language={this.state.language} style={github}>
+ {this.state.query}
+ </SyntaxHighlighter>
+ </div>
+ );
}
return null;
}
--
To stop receiving notification emails like this one, please contact
['"commits@superset.apache.org" <co...@superset.apache.org>'].