I'm guessing it's not working ... it's certainly not doing what I expect, even at that stage.
Firefox 99.0 (64-bit) for Ubuntu canonical - 1.0
$ lsb_release -d
Description: Ubuntu 20.04.4 LTS
$ cat /etc/debian_version
bullseye/sid"return (i % n + n) % n;"
heh
Which is a pretty good trick, I have to admit, exposing the nothingness of life. Kudos!
Seems the error is:
*Uncaught (in promise) ReferenceError: ClipboardItem is not defined*
y+dy, x+dx
Or it could just be that I'm using Firefox? Seems to work for me in Chrome. :)
Works best on desktop. Also, for those who don't like it, Google Docs not required--JIRA comments or most other WYSIWYG editors will also work.
Hope you enjoy it!
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!
MDN surprisingly has no examples/API on this (the only time I've found it to be the case), so I instead link you w3c for reference: https://w3c.github.io/clipboard-apis/#clipboarditem
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.
BTW we use a similar mechanism at websktop.com (online bookmarks manager), when you copy icons:
- if pasted into our app, all bookmark properties are preserved (text/html + "data- " attribute)
- if pasted into web app like Slack, you get a nice HTML-formatted unordered list of URLs with titles (text/html)
- if pasted into text editor, you get a simple bullet-point list (text/plain)
Unfortunately handling other MIME types gets troublesome. Still, you can do a lot of cool stuff with just text/plain & text/html.
I tried pasting the text in notepad anyway. :)
Also, in the last page, the emoji in the middle looks like a square with a question mark in my (old) computer.
It seems to be pasting different things all over the place. I'm not sure how the "google doc card" past to just pasting a url thing happened..
For how you can save multiple mime types in the same paste entry from javascript, the w3c draft is: https://w3c.github.io/clipboard-apis/#clipboarditem
It's funny.. I pasted it in a new Pages document.
This would hide a bit of the method for the twitter reveal.
-Seth
(I also make online magic tricks magicseth.com/animal )
onMouseDown: function() {li(si({withAddtlText: !0}), "https://twitter.com/cyrusroshan")}
gets called, which overwrites the clipboard.
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
I appreciate that you took the time to explain how it works in another comment in this thread.
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.
:set content.javascript.can_access_clipboard falseEdit: copied manually, dont have a Google account, so can't go further.
One will be used when you paste into a rich-text aware editor (like google docs). In this case it happens to be an ascii art of the card you chose.
The other one will be used when you paste to a text-only editor (like your URL bar). In this case it happens to be the OP's author's twitter URL.
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.
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.
edit: Typo
On my iPhone I opened Google Docs and started a new document, per the instructions, and pasted. It pasted a link to their Twitter.
Maybe Desktop works better?