[TW5] Is it possible to make a Copy2Clipboard widget?

[andrew harrison]

  Everyone else online is using ZeroClipboard because of security restraints but that is a hack in itself and I expect will stop working eventually. In addition, it only works online.
  The W3C is going to be implementing the Clipboard API for HTML 5 (http://dev.w3.org/2006/webapi/clipops/clipops.html) but it still doesn't seem to work yet. I can't find any working examples online.
  The following code is what I have been using in TWC but it only seems to work in Internet Explorer but not in Tiddlywiki 5 because Javascript is stripped. I could spend time writing a widget for just IE but is it worth it?
  Can anyone tell me what direction I should go? The alternative is painstakingly selecting text and hitting Ctrl + C or right click to copy, or in the case of touch screen by long pressing and messing with those selector arrows. 3 or more steps vs 1 step. I am trying to aim for something that copies to clipboard online, offline, server side, client side, mouse, touch screen, and browser independent. Is that to much to wish for?

<a href="javascript:;" title="copy" onclick="
var holdtext = document.createElement('TEXTAREA');
holdtext.innerText='This only seems to work in Internet Explorer';
Copied=holdtext.createTextRange();
Copied.execCommand('Copy');
return false;">Copy</a>

[Jeremy Ruston]

Hi Andrew

I'd also love to have a "copy to clipboard" button. The HTML5 Clipboard API is proceeding very slowly, with very patchy browser support. There's no implementation of copy to clipboard that I know of.

Right now the best prospect for an implementation is within TiddlyDesktop, where we can rise above browser limitations.

Best wishes

Jeremy

--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+...@googlegroups.com.
To post to this group, send email to tiddl...@googlegroups.com.
Visit this group at http://groups.google.com/group/tiddlywiki.
For more options, visit https://groups.google.com/d/optout.

--

Jeremy Ruston
mailto:jeremy...@gmail.com

[Stephan Hradek]

Am Dienstag, 6. Januar 2015 20:26:22 UTC+1 schrieb Jeremy Ruston:

Hi Andrew

I'd also love to have a "copy to clipboard" button.

Take a look at GreaseMonkey's source. GreaseMonkey has a "CopyToClipboard" function and you could put it into tiddlyfox. So with tiddlyfox it would at least be available for FireFox users.

[Rustem]

Is it time to revisit the issue? Seems to be supported by all major browsers. http://caniuse.com/#feat=clipboard
Would be nice to have a "copy" button appear on hover over any <code> piece.

[infurnoape]

Check out how I did this plugin. 

http://copy.tiddlyspot.com

Happy Connecting. Sent from my Sprint Samsung Galaxy S® 5

Visit this group at https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/1b3a6b91-f007-459d-8175-daa7a93a8093%40googlegroups.com.

[Rustem]

There is a JS library for that already. Demo at https://clipboardjs.com/ and it's on guthub as well.

[R]

Nice. Doesn't fit my use case but proves it can be done :D

--
You received this message because you are subscribed to a topic in the Google Groups "TiddlyWiki" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/tiddlywiki/ebR_tUN0Uqg/unsubscribe.
To unsubscribe from this group and all its topics, send an email to tiddlywiki+...@googlegroups.com.

To post to this group, send email to tiddl...@googlegroups.com.
Visit this group at https://groups.google.com/group/tiddlywiki.

To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/cedo9e27mkxfqgi5m2u1vvn4.1466820973513%40email.android.com.

[Jeremy Ruston]

Hi Rustem, Infurnoape,

Good news, I hadn’t realised that things had moved on.

Infurnoape’s plugin works in all the browsers I tried. It’s certainly something I’d like to see in the core.

I’d prefer an implementation that allowed rendered output to be copied to the clipboard, not just raw tiddler content. It would also be more robust if it didn’t rely on getElementById; all of that is fixable, happily.

Best wishes

Jeremy

To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/CAPkzo7rwZnWD1DfCk4vMWNuzMxTwYL8BTtwMBMdtXscZr7NoWQ%40mail.gmail.com.

[andrew harrison]

Any suggestions on how to select rendered output without using an element id?

To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/CF149354-F0FB-46CD-8935-E2D70FD7D610%40gmail.com.

[Jeremy Ruston]

Hi Andrew

On Sat, Jun 25, 2016 at 6:02 PM, andrew harrison <andrew.j....@gmail.com> wrote:

Any suggestions on how to select rendered output without using an element id?

A reasonable approach would be to render the chosen tiddler into a hidden DIV which is then removed once the content has been successfully copied.

Ideally, the message handler allow variables to be set for the rendering, just as we do for the rendering of modals. Here's the code for rendering the content of modals:

https://github.com/Jermolene/TiddlyWiki5/blob/master/core/modules/utils/dom/modal.js#L87-L92

And here's the code for invoking that function with the extra parameters passed with the tm-modal message:

https://github.com/Jermolene/TiddlyWiki5/blob/master/core/modules/startup/rootwidget.js#L26

Best wishes

Jeremy.

 

To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/CAL0r7zvrjxn8%3DR0%2B8gpcw%2BZ_ygoMDkMhBOjG%3DpnnViSwk%3DTFiQ%40mail.gmail.com.

For more options, visit https://groups.google.com/d/optout.

[infurnoape]

Regretably, due to browser security, the execCommand copy only seems to work on visibly selected content. So, a hidden div won't work. I am trying to understand how the suggested widget and how params are passed to the modal display would relate to tiddler identification and systematic selection?

To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/CAPKKYJap_gJKDt1RCarbY_y%2BC8_peMDK_ohAPPHQU-3TPXY%2BOA%40mail.gmail.com.

[Jeremy Ruston]

Hi Andrew

Regretably, due to browser security, the execCommand copy only seems to work on visibly selected content. So, a hidden div won't work.

Ouch. Presumably one could still use a dynamically created div, though, even if it has to be (briefly) visible.

I am trying to understand how the suggested widget and how params are passed to the modal display would relate to tiddler identification and systematic selection?

The code I was pointing to was the code needed to (a) gather variables from the paramObject of a message and (b) to feed those variables into the rendering process.

Best wishes

Jeremy

To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/xhmak10k0hyhj4s29wnxmrbt.1467074321244%40email.android.com.

[Dragon Cotterill]

Would you need to have something you could actually select? Like a temporary textara?

function copyTextToClipboard(text) {

var textArea = document.createElement("textarea");

textArea.value = text;

document.body.appendChild(textArea);

textArea.select();

try {

var successful = document.execCommand('copy');

var msg = successful ? 'successful' : 'unsuccessful';

console.log('Copying text command was ' + msg);

} catch (err) {

console.log('Oops, unable to copy');

}

document.body.removeChild(textArea);

}

[Rustem]

Andrew, did you check this out? https://clipboardjs.com/
Not that I know what I'm talking about, but I did not notice any visible selection taking place as I click Copy or Cut buttons.
Cheers
--R.