Hi Scott,

I was out digging around for a solution to the Prev/Next buttons in the Lightbox script and instead found a rewrite of the tool that may be of interest here.

http://www.digitalia.be/software/slimbox

I can see from the feature list that it already fixes one issue that affects my users all the time.. the way that the script breaks if one doesn't wait until all thumbnails have loaded - People are always doing that and getting stuck.

I'll let you know how far I get with alternate buttons next.

Here's some of the guff pasted in:
------------------------------------------------------------------------------------

From a functional point of view, Slimbox has the following added features compared to the original Lightbox:

• Slimbox is ready to launch as soon as the document is ready. This means that you don’t have to wait for all images of the page to be loaded before clicking on a link launching the Lightbox effect.
• The left and right arrow keys can be used to navigate through images, and the ESC key can be used to close Slimbox (Warning: in Mozilla browsers, the ESC key is also used to stop GIF images from animating).
• The dark background overlay can be clicked anywhere to close Slimbox, even on the parts located on the left and right of the image.
• The script is more robust; for example you can try to start-stop Slimbox very quickly to interrupt the animation then resume it and you won’t notice any bug like in the original Lightbox where sometimes the animation stops or the captions are wrongly sized.
• Slimbox temporary hides flash animations and other embedded videos while it is open to avoid display bugs in some browsers.
• Slimbox can be launched from the traditional image links inside the page like the original Lightbox, but also directly from a Javascript call using a special method.

From a design point of view, Slimbox is very different from Lightbox:

• The code has been entirely rewritten with efficiency in mind for the mootools framework instead of the huge Prototype/Scriptaculous. The script itself is as tiny as 7kb (uncompressed).
• The Slimbox CSS are simpler and 100% valid (no more CSS hacks). Also, all images used by Slimbox are specified in the CSS instead of the Javascript so it is easier to style.
• Slimbox does not use the 1 pixel transparent gif image needed by Lightbox.

And of course, it has been tested in all modern browsers: Firefox, Internet Explorer 6+, Opera 8+, Safari 1.3+ and Camino. It is not compatible with the old Internet Explorer 5.5 and will never be. If you still notice any bug, please post a comment below.

The total download size for the compressed version of the required modules of mootools + Slimbox is currently as small as 21kb.

Hi Scott,

Next and previous buttons under the picture looks very usefull for visitors. Just need to modifiy GIF images for localization. Ability to include an external link and choose the background opacity are also a good things.

That would be exelent.

Also I got this forum: www.rcuniverse.com they have some buttons that appear on the bottom of the image but nothing like what you just showed me.

Heck you can always but in an option: Use Original Light box or use the Updated light box.

Yes, that Phatfusion version looks great. It has all the benefits from Slimbox already mentioned, plus deals with the buttons by simply dropping them down into the text area.

I guess there is more that would need to be considered so I'll list what I can think of:

If a feature is configurable, then should there be a method for allowing different configuration per module instance or at least per portal? For example, I often want to alter the tint of the lightbox page colour to suit a particular skin. Some things like that can be achieved through css, but other options such as timing, caption animation, transition and initial size are held in the script, meaning one either needs multiple copies of the script or one has to expose those settings in the interface.

I note that the script is only 8kb and the remaining bits add very little more. If it were possible to have these items held within a gallery template folder, within the portal folder, then it could be configurable per-template or per-portal. These variables then wouldn't need to be exposed in the module settings interface.

The idea would be to treat scripts like this as template add-ons rather than fixed module components so that they can be configured differently as desired. Does that make sense?

As well, there is the future of the module to think about. Others will vary, but in my view the basics would be IPTC tag support, comments and ratings, cropped thumbnails and ultimately a view to integrating the galleries and albums with future social networking components provided either by DNN and other modules.

With all that in mind, where exactly does a script like this fit in...

Basically it's just an image-display option. Perhaps it should be a portal-wide option that is configurable on its own and is called up whenever an image is viewed? by that I mean make image-display a seperate thing from any particular module. Is there a way that one could create a DNN image display provider and put scripts like Lightbox in there? Such an image display provider could possibly also deal with the issue of displaying dynamically-resized images in any module and provide a consistent site-wide pop-up when clicked.

Just throwing some ideas out there for discussion... and of course, in the short run, just replacing the lightbox script with this one would be a nice fix-up.

Rob

Scott,

I tried to implement Slimbox into one of my DNN pages and ran into issues as well.  If I remember correctly, I saw a post on the DNN Forums where this was narrowed down to the javascript for Slimbox conflicted with the Client API.  I think they both contain a $ function, therefore when running the code, it does not know which $ function to use.  You should be able to talk to Jon Henning who works on the DNN Client API and he can probably explain the problem more.

I hope this gets you further along with Slimbox.  It really does run much quicker that Lightbox.

Update: Scott, I went ahead and looked up the thread.  Here is a link: http://www.dotnetnuke.com/Community/Forums/tabid/795/forumid/76/threadid/108457/scope/posts/Default.aspx

This guy has modified Slimbox to not only allow the Prev-Next button in the footer, but also to add HTML to the image description.  Additionally, the footer part not only scrolls down, but also scrolls back up when switching images.

http://www.phatfusion.net/lightbox/