-
Suggestion
-
Resolution: Fixed
NOTE: This suggestion is for Confluence Server. Using Confluence Cloud? See the corresponding suggestion.
I've been working with the SyntaxHighlighter code formatter a lot lately (http://code.google.com/p/syntaxhighlighter/) and I'm starting to realize how valuable its "copy to clipboard" functionality is. I'm requesting that similar functionality be added into Confluence's
macro.
Basically, this would involve adding a link into the panel that, upon clicking, would copy the contents/body of the code macro onto the system clipboard.
thanks.
- relates to
-
- Closed
[CONFSERVER-14100] Adding "copy to clipboard" functionality into code macro
Thanks for that I would have to test it first for my purposes and get back to you.
Workaround
This workaround works when using the panel and HTML macros and optionally the excerpt and excerpt-include macros.
Add the following script to a HTML macro on the page you want to use the copy-to-clipboard functionality:
<script language="javascript"> function copyToClipboard(element) { $(element).parents().next("div:first").css("background-color", "#FFEBB0"); var $temp = $("<textarea>"); $("body").append($temp); $temp.val($(element).parents().next("div:first").clone().find('br').prepend('\r\n').end().text().trim()).select(); document.execCommand("copy"); $temp.remove(); } </script>
Use the following script in a HTML macro just before the panel macro that contains the text that you wish to copy to clipboard. In some cases, you need to put this button and the panel with the contents to copy in a panel macro.
<button onclick="copyToClipboard($(this))">Copy to clipboard</button>
If you have multiple pages where you wish to use this method or multiple panel macros on the same page, you can place the two scripts above on separate pages in an excerpt macro, then use the excerpt-include macro to include them where needed.
Example
The following example shows the simplified use-case, using the script and the button on the same page as the panel to be copied.
{html}
<script language="javascript">
function copyToClipboard(element) { $(element).parents().next("div:first").css("background-color", "#FFEBB0");
var $temp = $("<textarea>");
$("body").append($temp); $temp.val($(element).parents().next("div:first").clone().find('br').prepend('\r\n').end().text().trim()).select();
document.execCommand("copy");
$temp.remove();
}
</script>
{html}
{html}
<button onclick="copyToClipboard($(this))">Copy to clipboard</button>
{html}
{panel}
<CONTENT TO BE COPIED HERE>
{panel}
By double clicking on the code block in New Code Macro, you are able to select the code block and copy it.
For those interested, there is a Speakeasy extension for this at https://github.com/craigpetchell/speakeasy-code-copy
Why is this card close? I would love to have this functionality in confluence and I do not seem to find anything that comes by default in confluence. We need this functionality.