3 ms·
Fair point! 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 Goog
by croshan 4y ago
Fair point!
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 https://w3c.github.io/clipboard-apis/#clipboarditem
- rasengan 4y agoThat's really cool - I did not know that; and thank you for sharing!
- captn3m0 4y agoCould do something with a text/image flip as well?
- byecomputer 4y agoHere you go: https://developer.mozilla.org/en-US/docs/Web/API/ClipboardItem/ClipboardItem https://developer.mozilla.org/en-US/docs/Web/API/ClipboardIt... Also note that the ClipboardItem API doesn't work in Firefox unless specifically enabled :^( I guess I'm okay with that, considering the API could be used for things way less fun than your magic trick
- croshan 4y agoThanks! After I wrote that, I was thinking "more likely I missed it, than that this is the _one_ example where it doesn't exist" :P
- uziiuzair 4y agoThis 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. Kudos! This was pretty cool!
- kaveet 4y agoClever! I thought I recognized that name from somewhere :wave:
- splatzone 4y agoNice work, I had no idea about this.