Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Allow copying from the JSON button dialog #1501

Merged
merged 2 commits into from Apr 20, 2017
Merged

Allow copying from the JSON button dialog #1501

merged 2 commits into from Apr 20, 2017

Conversation

@PtrTeixeira
Copy link
Contributor

PtrTeixeira commented Apr 11, 2017

Previously the copy button on the JSON modal would not copy the text of
the modal into the clipboard. This was because by default Bootstrap
Modals demand focus, and clipboard js works by creating a hidden text
field and copying the text out of that. The fix is allowing the modal
to yield focus to the hidden text field.

There was an additional performance problem that went into the problem.
In particular, attaching the clipboard to a class attaches the clipboard
to every modal on the page, even when the modal isn't open. Tis was
fixed by starting the clipboard only when the modal is open and
destroying it after the modal is closed, to prevent attaching many
handlers that accumulate on the page.

Previously the copy button on the JSON modal would not copy the text of
the modal into the clipboard. This was because by default Bootstrap
Modals demand focus, and clipboard js works by creating a hidden text
field and copying the text out of that.  The fix is allowing the modal
to yield focus to the hidden text field.

There was an additional performance problem that went into the problem.
In particular, attaching the clipboard to a class attaches the clipboard
to every modal on the page, even when the modal isn't open. Tis was
fixed by starting the clipboard only when the modal is open and
destroying it after the modal is closed, to prevent attaching many
handlers that accumulate on the page.
@ssalinas
Copy link
Member

ssalinas commented Apr 11, 2017

+1 for adding the performance fix in as well 😄 LGTM


componentDidMount() {
this.clipboard = new Clipboard('.copy-btn');
this.attachClipboard = this.attachClipboard.bind(this);

This comment has been minimized.

Copy link
@andyhuang91

andyhuang91 Apr 11, 2017

You can bind the functions in the constructor along with the showJSON and hideJSON functions. There's no reason to do this in componentDidMount. If you have lots of functions that you need to bind, you can use _.bindAll

This comment has been minimized.

Copy link
@ssalinas

ssalinas Apr 11, 2017

Member

@andyhuang91 , it is in the constructor, if you look a bit up in the diff, you'll see he's removing the componentDidMount() { line

Slight style improvement; prefer using `_.bindAll` over many calls to
`bind`.
@ssalinas ssalinas added the hs_stable label Apr 19, 2017
@ssalinas ssalinas modified the milestone: 0.15.0 Apr 19, 2017
@ssalinas ssalinas merged commit 99cca47 into master Apr 20, 2017
2 checks passed
2 checks passed
continuous-integration/travis-ci/pr The Travis CI build passed
Details
continuous-integration/travis-ci/push The Travis CI build passed
Details
@ssalinas ssalinas deleted the json-copy-btn branch Apr 20, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked issues

Successfully merging this pull request may close these issues.

None yet

3 participants
You can’t perform that action at this time.