This project is now its own Codeplex project
Remember Microsoft Live Labs? They used to be a bunch of innovative guys down at Microsoft. Their team got dismantled a few years ago, but before it happened, they managed to release a bunch of interesting innovations. You probably recall project PhotoSynth, which provided a way for users to stich images together and recreate a 3d environment. Another very interesting project they managed to release was called SeaDragon, which allows users to do Deep Zooming on a particular image. The original version of the tool was using Silverlight (remember that name?). However, a side project to make it web based was initiated about 2 years ago. The project is called Seadragon AJAX
(http://gallery.expression.microsoft.com/SeadragonAjax ).
Even though there hasn’t been much work on the project for quite a long time, I decided I’d give it a go, and see how well I could integrate it with SharePoint. For those not familiar with the concept of Deep Zooming, it basically is the process of blowing up an image into several smaller pieces, and improving the display Quality of each of the pieces. The outcome of this process is an XML file associated with a bunch of folder name 0 to X each containing a matrix of smaller images. You can read more on the concept of Deep Zooming at http://msdn.microsoft.com/en-us/library/cc645050%28VS.95%29.aspx .Microsoft provides a little tool called Deep Zoom Composer which is a spin-off of the Expression suite, and which allows you to create the deep zoom files associated with an image.
My idea was to create a wrapper inside of a SharePoint WebPart that would allow users to display a Deep Zoom image. The deep zoom images could be hosted anywhere on the web, but in my case I decided to upload them directly inside of a SharePoint document library. My web part exposes 3 persistent properties: the url to the deep zoom xml file, the width of the wrapper, and its height. Now, the Seadragon AJAX project is all Javascript based, so what about accessibility? Simple enough, my web part has been made smart enough so that if javascript is disable on the client’s PC, then a static version of the image without the deep zoom ability should be provided.
You can see a demo of the describe web part on my blog at:
http://nikcharlebois.com/Pages/Demo-seadragon.aspx .
Please note that the version is using does not fallback to a static image when javascript is disabled. I have another version of this web part that is accessible, all you have to do is let javascript write the required Div tags for the SeadragonViewer, and provide the static image alternative via a <noscript> tag. I’ve also uploaded the Source code for the webpart. You can find it at:
http://www.ignitesoft.ca/Blogs/Nik/Documents/Source%20Code/SeaDragonViewer.zip
Enjoy
