Web Development Theme Park

Integrating with Picnik turned out to be a breeze. I registered for the service and was immediately given an API key and granted access to their api. Importing an image was a breeze, I simply passed the URL for the image in the _import parameter (see their api).

After that was working, I added the _export_agent parameter specifying “browser”, and passed my own url for the _export parameter. This tells picnik that I want picnik to pass me a url of the image when the user clicks “export”.  (The “export” button only shows if you pass export parameters. And the user has to click it when they are finished.)

So my request to picnik looks like the following:

http://www.picnik.com/service/?_apikey=<APIKEY>&_import=<url to image>&_export_agent=browser&_export=<my url to handle the completed image>

When the user clicks “export”, I receive the user back to my site (my url) and the path to the image is passed in the ?file=<url> parameter. A quick get_file_contents() PHP call loads the image data from picnik’s server! Voila!

I think I need a catchier name for this concept.

I signed up for bluga.net’s webthumbs and educated myself on the api, located here. The signup was easy and fast – access was granted immediately. Once I was in, I found the api to be straightforward. Joshua Eichorn has done a good job of implementing the api and explaining how to use it. I did get a little confused when I was charged 2 credits for the snapshots I was taking, instead of the usual 1. I didn’t think I was using a 2-credit feature – but I’ll try some different settings and figure out why.

In just a few hours I was able to generate 1024×768 thumbnails (or any size I want) of any web page on the web. I used the polling method; post the job request, check the job status until it is complete, and then download the result from bluga.net’s server. Snapshot generation times were very good.  I would like to test the notification method, as I think I could implement an ajax “loading” page that would provide better status to the user than a page stuck in the browser running the loading icon.

I also got a little bit of a strange effect when I used the mirror feature (2 credits). It didn’t return the image that I expected to see. Mirroring was not primary to what I was working on though, so I didn’t try to diagnose the problem. I’ll let it lie unless I end up needing that feature.

I had a thought while working on one of my project’s this week. How hard would it be to get a web page as a screenshot (a web page as an image), crop it, and tie it into my application in a straightforward way? The idea would be to allow a person to say “I need an image of this cool website, manually cropped to a size of X-by-Y, to attached to this record I’m creating in my application.”

Today I did some research on ways that I could accomplish that.

1. I would need to register with bluga.net and tie into their API for generating screenshots. Of the ones I considered, I liked their approach the best.
2. Integrate with Picnik. to support manual cropping (by a user).
3. Receive the modified image back to the server (through the Picnik API) and save it

Along the way, I found a firefox plugin for Picnik that takes a screenshot of the local browser window and places it in Picnik. It’s a perfect tool to accomplish what I’m considering, but requires that the user install the plugin in their browser. It also wouldn’t integrate directly with my application.