Add a "Copy code" button on code blocks

[laurent22]

When a code block is displayed, add a "Copy" button in the top-right hand corner. Clicking on it should copy the code to the clipboard. That button should only be displayed when the user moves the mouse over the code block.

Note that this feature should be added to the joplin-renderer

Platforms

• Desktop
• Mobile

---

[Runo-saduwa]

Please i will love to try to implement this, can this issue be assigned to me?, and if theres anyone more familier with the codebase, i will love to work together

[bedwardly-down]

@Runo-saduwa, I'm currently working on my own assignment here involving changes in the user interface and whatnot. I spent all night digging through a large chunk of the rendering and electron code and am getting fairly familiar with it, especially after the devs here started separating some of the dialog code. One very cool thing about the code here: most of the functions and class names are sensible and describe exactly what their overall function is for the most part, and those that don't make a whole lot of sense outright, it's pretty easy to figure out what they do by searching for where they're used in the code.

[laurent22]

@Runo-saduwa, at this point we only assign up to one issue per person.

[Runo-saduwa]

alright, thank you

[bedwardly-down]

@laurent22 that is very reasonable. Thank you

[Runo-saduwa]

@laurent22 , i'm trying to give this a shot, so if i understand you correctly, this is going to be implemented in this repo joplin-renderer

[laurent22]

Yes indeed. Hmm now that the renderer is in a different repo it's not very easy to with with actually.

I'll see if I can think of something to make it easier, maybe by moving it back to this repo.

[Runo-saduwa]

Well, ive pulled the latest changes, i've been staring at the code for an hour now and i dont know where to start from, Lol............... can you kindly guide me through where to start from

[bedwardly-down]

@Runo-saduwa it looks like NoteRevisonViewer.jsx and NoteText.jsx under ElectronClient/app/gui would be a good place to start. A lot of the editor rendering code is there. Then follow it where it takes you. The way each part of the app is linked is very sensible and logical.

[rheo-chiti]

Is this issue fixed for mobile yet,if not can I work upon this ?

[Runo-saduwa]

Sorry there’s already a pull request for this and it’s not a single platform issue.

…

On Sun, Feb 9, 2020 at 9:42 PM Chitransh Anand ***@***.***> wrote: Is this issue fixed for mobile yet,if not can I work upon this ? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#2383?email_source=notifications&email_token=AIR5ZV3L2SRZ3CVTMWVGA53RCBTE3A5CNFSM4KMERES2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOELGXPTY#issuecomment-583890895>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AIR5ZV2LZ4EMDPOYVSQNHKLRCBTE3ANCNFSM4KMERESQ> .

[HirenMadhu]

Is this issue still open?
If yes, then can I work on it?

[raghavg27]

Anyone working on this?

[tessus]

If there's no PR open, say you'll work on it and create a PR when ready.

We had so many people who said they'll work on something, but then nothing happened.
So, if you take an issue, please keep us apprised of the status.

[flozender]

I would like to work on this, please.

[Rishabh-malhotraa]

I would like to work on this, please.

Yes, @flozender go ahead.

[Rishabh-malhotraa]

@laurent22 I have a question about the way to solve this, can we just not add the button HTML syntax here rather than writing the markdown plugin for it

[kowalskidev]

I'm working on it 👍

[Rishabh-malhotraa]

I'm working on it 👍

please don't I'm done with this PR

[wjrivera]

Was this feature implemented in Pull Request 3024 ?

[tessus]

No.

[wjrivera]

Is anyone assigned to this atm?

[tessus]

No, there were PRs at one point, but they were not merged. More info in #2426 and #3024

[Ash0311]

when will this be released ?

[tessus]

It won't, unless somebody picks up the PR a finishes it.

[ArenaGrenade]

Hey @tessus I am looking at the PRs made for this issue #2426 seems quite complete - except for the updates it needs on mobile. And #3024 seems to be a incomplete one and possibly stale for a long time.

What is the exact part of the feature that is yet to be done here? Is it that we need to make sure this works on mobile devices?

[laurent22]

This was incorrectly labelled as a "good first issue" but it's actually difficult to add this properly. And last year pull requests cannot be used a starting point as they weren't following the right approach.

[ArenaGrenade]

Ah! Sure.

[Ash0311]

Please add this soon as this is needed !

[ArenaGrenade]

As of now what's the status of this issue? Is the button implemented anywhere - desktop / mobile?

[riekusr]

Would love to have this function as well

[RestlessRabbits]

Is there someone working on this?
I would also love to see this function :)

[kar0v]

I'm also missing this feature in joplin. Commenting for visibility.

[ckza]

Also commenting for visibility. Currently doing quite a bit of code and would love to have a nicer code block, with the copy button, to streamline my workflow. Otherwise I need to start using another note taking app and I would prefer to stick to Joplin.

[polytect]

Hi guys!

Can this feature be added to Joplin? It would attract even more users.

[Waldorf3]

Adding my support for this feature

[mntky]

I am using this plugin.
This plugin is working fine:)

https://github.com/LightAPIs/joplin-copy-code-blocks

[Coehill]

Any updates on this?

[tessus]

I doubt that this will be added to core. There are 3 plugins available that add this funtionality:

• Copy Code Blocks v1.1.2
• CodePerfect v1.0.2
• Code-Clipboard v1.0.0 (no longer maintained)

[Coehill]

I doubt that this will be added to core. There are 3 plugins available that add this funtionality:

* [Copy Code Blocks](https://joplinapp.org/plugins/plugin/com.joplin.copy.codeBlocks/) v1.1.2

* [CodePerfect](https://joplinapp.org/plugins/plugin/jl15988.JoplinCodePerfectPlugin/) v1.0.2

* Code-Clipboard v1.0.0 (no longer maintained)

Perhaps I'm misunderstanding, but if there are 3 plugins then doesn't that demonstrate a need for the functionality being in core?

[tessus]

Not necessarily. The plugin system was added to allow people (and the dev team) to add features to Joplin without having to change Joplin itself.

TBH many of the things that were added to core in the beginning could be handled as plugins now. I don't make any decisions so my reply is strictly a matter of personal opinion.

I don't see a reason to add anything that can be added via a plugin to the core code, but the school of thought might differ. If not, what is the appropriate criterium? The number of plugins that are available for a feature, the number of downloads of a certain plugin that implements a feature, rolling the dice? A combination or all of the above? I can't answer this with an absolute certainty. Can anyone?

[polytect]

I think this feature should have been included in the core when there were already two plugins available. Every programmer I know who has tried Joplin has had to resort to copying and pasting code while dragging the mouse as a first impression. The dragging method might highlight more text than the user intends. It's a standard functionality found in any website with Markdown codeblocks.

Not having this feature in the core may deter new users, as they need to be aware of the plugins option and take a chance on whether it will work. This can be a subtle turn-off.
It's often the small things that can attract or repel users in subtle ways, but that's a topic for another time.

I believe that Joplin's core should include the ability to copy codeblock contents, rather than relying on plugins. Just like having a light switch instead of a
hotwire.

Don't copy me.

Copy me as quick as possible,
Does this have a copy option on GitHub?

Don't copy me.