After Firefox mobile pasted my previous clipboard contents into the textbox in step 2, I thought "man, that's damn good clipboard phishing and you got this audience real good ;)"
> Is it possible to make other media uploadable to folders?
We thought about it before but we've de-prioritized it in favor of collaborative-editing features. But I totally understand your use-case. It would be a great addition to our product. Stay tuned! :)
The way it work is this: you can copy multiple filetypes to the clipboard. So here, I copy a "text/html" and a "text/plain". When you paste to Google docs, it reads "text/html", and outputs a div that I've reconstructed to look like a joker card. When you paste to most other places (your address bar, a `<textarea>` element, terminal, etc.,), you get the plaintext fallback. So you can have two entirely different outputs, based on where you paste!
This explanation just made things so much cooler. I wasn't aware of the clipboard api. (Since I never needed to use it)
In my experiment, I assumed that you did another "copy" at some point which printed the twitter URL. I came to this assumption when I pasted into Sublime Text and still saw my card, but pasting into the Address field changed the output to the twitter URL.
Very fun!
If you wanted to add one more level of misdirection, the first cards could be textarea that you have to select with your mouse and hit ctrl-c to copy ;-)
This would hide a bit of the method for the twitter reveal.
-Seth
(I also make online magic tricks magicseth.com/animal )
And this may not be the effect you are going for, but you could make the final twitter link go to a specific tweet, where you say "I was hoping you would copy the 3 of diamonds!" and it would be right :-)
Demonstrating how easy it is to get someone to disclose their clipboard contents to any web page that asks? ;) Not working for me either, but it was surprising to see my previous copied text.
I didn't spend any time looking at the obfuscated functions li and si, but why does this have to be in a 14,000 line Javascript?
Isn't writing something to the clipboard a regular html function?
https://www.w3schools.com/howto/howto_js_copy_clipboard.asp
Haha, now that part is just sleight-of-hand. When you click (technically, mousedown) on the google doc link, we copy a new item to the pasteboard, so now instead of {"html": joker_image, "plaintext": card_you_picked}, it's {"html": joker_image_with_url_paste_hint, "plaintext": twitter_url}.
0. You visit a webpage with expectation to see a magic trick.
1. When you click on a card, there is no copying involved. But it knows on what card you clicked.
2. Pages asks you to paste the card you think you have in clipboard. You press Ctrl+V, page receives content of your clipboard and instantly replaces textarea content with card you clicked on. This makes you think that you have that card in your clipboard. Your real clipboard with your bank password you used 10 minutes ago is sent to the server.
3. Your clipboard is replaced with different card (adding text to clipboard is allowed and easy in javascript, it's reading clipboard what is forbidden).
4. Pages asks you to open some text editor (e.g. google doc) where you paste the card, seeing new card. This makes you thing that your card was replaced with joker card and it is some kind of lame magic trick.
You missed step 5 where it replaces it with the Twitter URL only when you paste it in the URL bar from Google Docs (but continues to be the card when you paste it in the doc). How does that work?
I didn't paste with a keyboard shortcut, so I had no idea what type of weird anti-performance art this was supposed to be. Thanks for explaining. Needless to say, this didn't work at all for me.
If not, maybe you should add a note that firefox is not working, so the ~third(?) of your visitors won't get confused, and you won't just waste their time for nothing.
So I tried this on my phone (Android - Bromite browser) and it's not working.
But from the comments, I'm guessing that multiple items are copied to the clipboard and one of them is the author's twitter link? :D
I'll try this on my PC to see what the actual trick is. But also looks like that some people have reported that it doesn't work on Firefox.
Thank you! Had to implement something related to this at work, and thought "huh... what else can I do with this?" :P
I think the real magic is in the last step, when you're on a generally-trusted 3rd party website (Google docs), and your paste output is different in the doc from the URL.