Windows Live Photo & Video Blog

Official blog for the Windows Live Digital Memories Experience team

Authoring a Publish Plug-in for SmugMug

Authoring a Publish Plug-in for SmugMug

  • Comments 0

This is a guest post from Omar Shahine. When we announced an internal beta of our new Publish API a few months ago he jumped right on it and within a few days built his Smugmug plug-in. If you’re a Photo Gallery user that also happens to use Smugmug to share photos AND videos, then this plug-in is for you!  Check out the plug-ins download page (more plug-ins are coming soon). Anyway, enjoy Omar’s perspective. –Michael Palermiti 

~~~~~

Hi There! My name is Omar Shahine and I’m a Program Manager on the Hotmail team. I also happen to be a photography enthusiast and long time reader of this blog. The Photo Gallery team asked if I’d blog about my experience building a Publish Plug-in for SmugMug, my photo sharing service of choice. [download Publish on SmugMug]

Let me start out by saying that I’ve already authored an uploader for SmugMug called Send to SmugMug. This is a .NET program that I wrote many years back to simplify and streamline uploading pictures from the Windows Shell to SmugMug. It’s gotten popular over the years and I’ve added lots of features. Send to SmugMug was originally written for Windows XP, which seems like a long time ago for me.

Why author a Plug-in?

When Windows Live Photo Gallery was released last year I started to use it for all my photo management. Both my wife and I feel it’s the easiest product to tag, rate, and organize our photos. We have over 30,000 pictures right now and since having our first child almost 2 years ago we take a LOT of pictures and upload to them to SmugMug to share with our friends and family. In fact, we’ve developed an interesting workflow. My wife and I rate all our photos and anything with a 3 star or higher rating gets uploaded. Things with 2 star ratings we keep, but don’t share or play through our slideshow screensaver on our TV powered by Windows Media Center.

Our basic philosophy on ratings is to use the pyramid system (where there are very few 5 star, and very many 3 and 2 star):

  • 1 star: throw away
  • 2 star: keep, but don’t share
  • 3 star: good picture, this is the majority of our ratings
  • 4 star: analog photo album quality
  • 5 star: good enough to put in a picture frame in the house or office. we have very few of these

Why am I telling you this? Well Photo Gallery lets you easily view and filter by rating so uploading pictures with 3 stars or higher is as simple as clicking a button to filter and then publishing, something not possible in the Windows Shell.

image

Since we use Photo Gallery a lot, it got to be inconvenient for us to keep having to use the Windows Shell and Send to SmugMug to upload our photos. So when the Publish Plug-in SDK was sent my way a few months ago, you can imagine how excited I was to start writing some code :-).

Authoring a Plug-in

You might wonder how long it took me to write the Publish on SmugMug Plug-in. Not long. All in all I would say I spent 3 days working on the plug-in. The first day was mainly downloading and examining the Sample Flickr Plug-in and setting up my project in Visual Studio 2008. I spent the next day writing code and creating the installer. On the third day I created an auto-update feature and created the web pages and such to host my Plug-in.

Of course one thing that helped me tremendously was that I already had  a bunch of code that talked to SmugMug using their API. If you are starting from scratch and have no code at all to talk to a publishing service it could take longer.

What Publish on SmugMug does

It’s pretty simple really. Much simpler than the Flickr Plug-in (due to the differences between Flickr an SmugMug).

1. You select a photo, or video, or combination of any number of them.

2. You then select Publish on SmugMug… from the Publish Menu

image

3. You are asked for your username and password for SmugMug

image

4. You then select a Gallery to upload to, or create a new one:

image

image

5. You then click Publish

image

You can then click View to be taken to the uploaded Photo or Gallery.

image

 

How I wrote Publish on SmugMug

If you are like me, then there is only one thing you need to figure this out. Just download the Sample Flickr Plug-in and start messing around! I didn’t read any of the SDK docs, although they are there if you need them. The overview doc is a good place to get an understanding of what you need to know if you have to see flow diagrams before looking at sample code.

The basic idea for any Publish plug-in is going to be:

  1. Collect the user credentials and log into the service
  2. Create a “container” for the uploaded items or allow selection of an existing “container”. In this case a container can be an Album, Gallery, Folder etc
  3. Upload the selected items in Photo Gallery supplying any necessary meta data to the service (I provide Caption, Keywords, and People Tags).
  4. Handle progress and errors
  5. Supply a URL the user can use to visit the site when the upload is complete

What I did was:

  1. Create my own registry entries for my Plug-in
  2. Reviewed the Flickr Plug-in to get an idea of how the call flow worked
  3. Figured out what parts of the Plug-in I needed to rip out and replace with my own code
    1. Replace the UX in the Sample with my own dialogs and screens using the default ones as a starting point.
    2. Stubbed out the functions that I would need to talk to SmugMug
    3. Replaced that code with code from my SmugMug API (which I mentioned I already wrote previously). If you are talking to a new Publish service I would recommend writing a class library to handle all the API logic
  4. Create a new installer using the built in Visual Studio Setup project and add the necessary registry entries to register the Publish Plug-in.

The only interesting issues I ran into writing my plug-in were:

  • The API expects that you will be dealing with file streams. I had to modify my API to support passing a file stream rather than just a path to the photo.
  • The SessionXml is where state is stored, and you cannot assume that any state in your code will be persisted as Photo Gallery will invoke your code with each photo. So don’t store things in static variables expecting them to be there on each call. You can persist whatever you want in the SessionXml object.
  • If you need to store things across sessions like username and other information you can use PersistXml. I already store my stuff in the Registry so I had no use for this.
  • If you want to include People Tags with the tags in the photo on upload you must explicitly get them from SessionXml

That’s it! I hope you enjoy Publish on SmugMug or creating your own Publish Plug-in. 

Omar Shahine, Lead Program Manager on Hotmail