The selection tool was inspired by (and reverse-engineered from) MeasureIt one of the cleverest extensions available for Firefox by a chap called Kevin A. Freitas. His technique involves injecting a transparent div and some javascript into the page you want to measure (and that I want to grab). I never would’ve thought of that – it’s genius.

The canvas grab is thanks to me stumbling on this page a couple of years ago and then waiting for the feature to be fully implemented in the browser. The motivation came from my main competitors Pearl Crescent Page Saver (their grabber is pretty good – but you have to pay for the selection box). who had been previously capturing images using some very clever native libraries to do their work. I’m not that smart, so I was using the language I know: Java. My ego decided that I couldn’t lose the Firefox screengrabbing race so I got back to work.

(There’s also another extension called Snapper that does this now. It’s good for quick shots.)

The copy feature was inspired by all of the people who said they wanted it as a feature. You would not believe how hard it was to do. I’m not even doing it right, it’s a hack. I still don’t know how to put image data on the clipboard using the interfaces provided.

Anyway, here’s how the hack works…

  • I grab the page and get the dataUrl from the canvas.
  • I load the dataUrl into a hidden image in my extension chrome (it’s in the main overlay).
  • I then trick Firefox into thinking that the last thing the user clicked on in the browser was this image that they can’t possibly see (so that it thinks the context menu would be using it).
  • Then I invoke the command that drives the “Copy Image” context menu item.

(There’s also a couple of timers in there while I wait for Firefox to get with the program)

If you think that’s hacky, one day I’ll explain how I get Java to take those shots and scroll the page. It’s CRAZY!