Worked on a cool little feature today: adding copy-paste functionality for our widgets. Take a look at the way it worked previously: Those are sad faces, if you couldn’t tell
This happens because normally when you copy-paste, you just copy the
[[☃ image 1]] part but don’t get any of the metadata associated with that widget.
Take a look at what it looks like now:
First, I stick a listener on the jQuery events for cut, copy, and pasting (found out about them from this outdated but still useful blog post). When a user cuts/copies a piece of text in the editor I check to see if he/she’s finna’ move a widget too. If there are widgets to preserve, I grab the widget metadata, serialize it as a JSON string, and toss it into
localStorage. On a paste, I check to see if I have some widget data previously stored. If so, then include that data with the paste. If there are conflicting widget names (eg. the section I’m pasting into already has a widget called “image 1”) I don’t override what’s already there.
This also has the nifty feature of being able to copy-paste widgets from an entirely different page to another :). Quite pleased with how simple it ended up being.