Sunday, May 4, 2008

SimpleViewer-SL Beta 1

Update 5/8/08: Fixed blank screen bug when navigating between thumbnails, and improved browser resizing support...

The Silverlight version of the flash based photo album viewer - SimpleViewer, is here! I decided to call it SimpleViewer-SL for now.

Here are a few examples that were created using SimpleViewer-SL (the keyboard arrow keys are supported as well)
  1. Thumbnails on the left, 3x3 grid

  2. Thumbnails on the right, 5x4 grid

  3. Thumbnails on bottom, 2x4 grid

  4. Thumbnails on the left, with background image

SimpleViewer-SL is highly customizable. It is compatible with SimpleViewer and hence all options exposed by SimpleViewer are applicable to SimpleViewer-SL as well. The options are listed here. The only XML option that is not supported at this time is enableRightClickOpen. Note that the text fields like title and Caption should be plain text (no HTML) for now since I haven't implemented the HTML text control as yet. As for the HTML options, the only supported option is xmlDataPath. The HTML option should be passed to the SimpleViewer-SL Silverlight object using the param tag - <param name="initParams" value="xmlDataPath=gallery1.xml" />

The album can be created using any of the methods described here . After creating the albums, a few modifications to the generated file(s) is required to make it work on SimpleViewer-SL.

The xap can be found here.

The directory structure for the samples is as follows:

gallery1/
SimpleViewer-SL.xap
gallery1.html
gallery1.xml
gallery2.html
gallery2.xml
gallery3.html
gallery3.xml
gallery4.html
gallery4.xml
thumbs/
65x65 thumbnail images
images/
the corresponding big images

Between the above links, the sample html and xml files, it should be fairly straightforward for anyone to figure out how to use SimpleViewer-SL. Overall it is fairly feature complete but there is always room for improvement. It is a little unstable, in that sometime navigating between thumbnails results in a blank screen, but I think it is more to do with Silverlight being a Beta release (looks like it was more to do with my code!).

This exercise took me a little over a week of part time work so I have to say that I am pretty impressed with Silverlight. Most of my time was spent in figuring out a way to work around Silverlight 2 Beta 1 bugs. I suspect that I can simplify the code a bit after the final release of Siverlight 2. Nevertheless, the current size of SimpleViewer-SL is a mere 17kb, the same as SimpleViewer, with lots of opportunity for improvement.

For those looking for the code, I am planning to codeplex it when I get some time. Feel free to leave comments to pressure me into doing it sooner rather than later!

7 comments:

Anonymous said...

This is really great! Nice work! I'm interested in learning more about Silverlight myself, and would be interested in examining the code...that is, of course, if you don't mind posting it. I would be more than happy to share any improvements/modifications I might make with you (not that necessarily needs any!).

Excellent work!

Wilfred Pinto said...

Brad,

This is the first request for this source code! I actually kinda lost interest in this since there was no interest out there. But then again I think the main reason for visiting my site is the Deep Zoom examples.

I will at minimum try to post the code here in a few days (if I can find it!). Codeplex is a longer term goal.

Wilfred

Anonymous said...

Wilfred,

Currently, I use Simpleviewer. However, there's some limitations to it I don't know how to overcome. However, with a Silverlight version with C# I hope to get over those limitations. I have been anxiously looking forward to the source code. I keep coming back hoping today will be the day. Please don't keep us dangling. Thank you for the conversion.

Wilfred Pinto said...

John,

I really couldn't find the code. I managed to find some old code which I haven't been able to verify but I will post the link here for you. After I get back from my vacation I will look into it.

The code is here: http://thepintospatronus.com/simpleviewer-sl/SimpleViewer-SL-Beta2.zip

Good Luck

Wilfred

Anonymous said...

Wilfred,

Unfortunately, I was never able to get the source code (from the link above) to compile cleanly. I'm thinking the problem was I wasn't using to correct Beta version of Silverlight, but I'm not sure. I'm new to Silverlight, so I'm struggling a bit here.

Anyway, I'm working with the Release version of Silverlight now and I've just downloaded the latest Simpleviewer source code from CodePlex along with the Gallery 4 sample.

However, I must be missing something obvious. My page keeps coming up blank with a black background. I'm guessing must be the way I have Simpleviewer configured, but I'm not sure what I'm missing.

I tried running the Gallery 4 separately, as well as copying it into the ClientBin, but both come out with just black screens.

Any help would be appreciated.

Thanks.

John.

Wilfred Pinto said...

John,

I forgot to mention that the sample should be run within the context of a web server. If you are invoking the sample on a local host make sure you have IIS or Asp.Net development server running, copy the sample files to a directory on the web server, and then invoke it using a url.

Unfortunately it doesn't work outside the scope of a web server at this time. I will try to fix this in the next minor release.

Let me know if you still have issues.

Regards

Wilfred

Anonymous said...

Wilfred,

Thank you for all your help, that was the problem. I finally got everything working properly. This is a great app. Thanks again for writing it.

John.