I like the look of Flash galleries. But I want my site to not be Flash so its searchable and linkable. I like the look of Lightbox and Slimbox (especially once you speed up the delays), but you can't easily link to a specific image in an album. What to do?

I toyed around with doing a Lightbox/Slimbox theme for ZenPhoto, but kept running into some issues. An important one for me was I wanted whatever JavaScript magic that was displaying the images to be able to handle a URL that could tell it to display a specific image -- I often want to email a link to a specific image.

Today I stumbled across Galleria -- a very cool JavaScript image display library. Check out the demo:
http://monc.se/galleria/demo/demo_01.htm#img/grass-blades.jpg

Nice, huh? Slick like Flash, but all JavaScript and CSS. So, after an little mucking about, I've got a ZP theme using Galleria.

This is *very* much not a finished work, but I thought I'd share it in its most vanilla form before I start customizing the theme for my own site. It's based on the default theme from today's downloads: ZP 1.1.5, and the Galleria 1.0b code.

Galleria/ZP theme Current Version v0.5:
http://alexwilson.dyndns.org/filez/galleria05.zip

New themes are always welcome. Let us know when you are done, then we will glady add it to our themes page!

One note: jQuery is already included in zenphoto (zp-core/js), so you don't need to include it in the theme.

Still a work in progress, but for anyone who wants to follow along, I've got it up on my live site:
http://alexwilsonphoto.com/gallery/

The trickiest part seems to be getting the interface to deal well with albums with a lot of pictures. I've got a few changes in that help a lot, including using the ZP-generated thumbs instead of letting the Galleria resize the full images to make thumbs, which seemed to really chug the browser on big galleries. Having the scroller area also removes the need to move the view once there are more than a row or two worth of thumbs.

Any feedback on the theme so far is welcome!

Looks and works great. I might try implementing a bit of this on my site. Only thing that doesn't quite fit right in the theme is the scroll bar at the bottom, but maybe a bit of styling can improve that. Well done.

I like it. Looks great. Any chance of sharing the source code for image.php?

The only thing that does not blend in is the scroll bar at the bottom. I have not looked at galleria, but can you have some sort of auto-scroll depending on the position of the mouse?

or can you change the color of the scroll bar to dark?

Galleria doesn't have the scroller area -- I added that, since having several rows of thumbs made the page a pain because you had to move back up to the image.

Changing the style of the scrollers is just a bit of CSS and pretty easy -- but it's an IE-only thing, I think. Auto-scrolling is trickier, I'll have to look at the JavaScript involved to do that.

I'm planning on making the theme source available once it's more-or-less done.

Nice work, will keep an eye on it for possible future use. :)

AlexWilson, for the scroll bar at the bottom you might be interessted in this here: http://sorgalla.com/jcarousel/ (done with jQuery)

that carousel looks really nice!

Cool, thanks for the pointer to that. I've updated my site with a very preliminary jcarousel integration.

I want to get the carousel to follow along the correct image when you use the image or top link to navigate, but haven't tried to implement that yet. I've got about a 800 more images I want to sort through tonight so I can do a mass update to my site, then I'll take a stab at it. :)

really nice work!

Alex: Can't wait for your final release. May I suggest enabling the LEFT and RIGHT arrow keys for navigating from image to image AND to move the carousel. Also, forgive me if this is a silly question but do you foresee a slideshow function?

jayray999: You might take a look at this: http://interface.eyecon.ro/demos/slideshow.html
(Interface is an extension to jQuery). I have already plans for adapting that...:-)

Hokeys added -- Found a script, and putting it in took about 10 seconds. I love jQuery :)

I don't have plans for a slideshow for my site, but it might be an easy enough thing to add (the carousel already has a timed autoscroller functionality), so I'll at least look at it once I get the major stuff done.

@alex: Wow, that's quick. One suggestion. When the viewer reaches the end of the current carousel stack, the next Hotkey press or mouse click should advance BOTH the carousel and the image. Currently
only the image gets advanced so the active image is not necessarily visible in the carousel below. This can be disorienting to the viewer. Thanks.

@acrylian: Thanks. As ever you are at the forefront of help and support.

Here's to an early release.

This theme looks great! I very much like the scroll bar, can't wait for the final release! I would probably keep the usual album page (with all the thumbs listed) and then have the scroll bar for the image page for easy navigation.

Beautiful theme, this is what I wanted to do basically with the old Tricasa theme, but this looks even better. I love the transitions and the scrolling image navigation on the bottom... good stuff.

Let's get this working well and include it!

Thanks all, so glad you like it!

I've manged to get the follow-along with the bottom scroller working. It's a little hacky at the moment though -- I changed the Galleria script to prefix the index number of the image to the title, and then the scroller extracts that to figure out where to move to.

I think I fixed the issue of stuff jumping around in IE as you switch form landscape portrait images, but I still can't get the PNG transparency working in IE -- anyone have any insight?

Wow your theme is looking awesome. It is soo quick to change photos. Can you post an updated version with all the things you added in the last couple of days?