Lightbox Widget

Overview

Lightbox is a TurboGears widget wrapper for the Lightbox2 JavaScript library by Lokesh Dhakar.

It displays a thumbnail image which, when clicked, opens an overlay popup window for viewing the linked image in full size. You can also browse through several Lightbox images that are grouped together. Here's a screenshot of the Lightbox widget demo in action:

Usage

You can view a demo of the widget in the TurboGears Toolbox. Start the Toolbox with

tg-admin toolbox

The Toolbox will open in your default web browser. Open the WidgetBrowser and scroll down to the Lightbox demo widget.

To use the Lightbox widget in your TurboGears application, you need to import the lightbox.Lightbox widget class and pass an instance of it in the dictionary returned by your controller method to the template:

from lightbox import Lightbox
lightbox_widget = Lightbox()

class MyController(controller.Controller):

    @expose('yourpackage.templates.lightbox_demo')
    def lightbox_demo(self):
        return dict(lightbox=lightbox_widget)

In your template, you need to call the Lightbox widget instance with several arguments: the first argument (the "value" of the widget) must be the URL of the main image to display and 'thumb_url', 'thumb_width' and 'thumb_height' specify the thumbnail image that will be displayed.

Example:

${lightbox(tg.url('/static/images/image1.png'),
    thumb_url=tg.url('/static/images/thumb1.png'), thumb_width=80,
    thumb_height=60)}

For more information about optional parameters and Lightbox configuration options, see the parameter descriptions of the Lightbox demo and the Lightbox configration widgets in the WidgetBrowser.

Installation

You can install the Lightbox widget package via easy_install:

[sudo] easy_install Lightbox

References

• For more information about the Lightbox2 JavaScript library, visit its homepage at http://www.lokeshdhakar.com/projects/lightbox2/.
• For information about TurboGears widgets, see the Guide to the TurboGears Widgets Documentation.