Views lightbox2 custom field handler

The way lightbox2 currently works:
It integrates with imagefield and other CCK modules, and provides display options for them. These display options control the image that is displayed on the page (e.g. thumbnail) and the full size image that should be displayed in the lightbox. Other settings, such as field grouping is controlled on admin/settings/lightbox2 (ugh), and there's not much flexibility when it comes to the caption. So the proposed solution would fix all of these limitations.

Currently, lightbox2 takes the display options from Views and CCK content type settings, renders the field as normal and wraps it in a link. The attributes of the link control how lightbox handles the field. The href attribute points lightbox at the target image to display, and the rel attribute gives it (a) the caption (b) the lightbox group name if any (c) lightbox behaviour (lightbox, lightshow, lightvideo, etc).

One of the nice things about the proposal, is that long list of formatters (which grows exponentially!) will be gone - major bonus!

Information that the field handler would need to gather/handle (1st guess):

• Target field(s)
• Which field to use as the caption
• If grouping is required, and if so how (on nid, field name, etc)
• If image count should be displayed

So I really like the proposed idea, but there are some areas that need careful consideration:

1. We need to maintain support for non-CCK fields, like the image module, or even just manually created image links.
2. Lightbox2 CCK display options also appear on the content type's "display fields" settings page - if we're moving away from formatters, we need a solution that should work here too. Can we extend the proposed solution to this?
3. Lightbox output is constrained by the browser window size, so adding too much content to the lightbox could result in screen overflow (if rel="lightbox" or "lightshow") or scrollbars (if rel="lightframe" or "lightmodal").
4. The lightbox content is generated using JavaScript, meaning drupal_render() has no effect. I would like to make lightbox.js use Drupal.theme() function so the output is themable, but this can be only overridden by another JS file, not via php layer.
5. The previous point hints at the biggest problem of all - generating the lightbox content. I don't want to overload the rel attribute any further, so placing 3 different text fields as the caption in the rel attribute (which could include the body!) could result in a lot of text. Also if there are a lot of lightbox links on the page, it could result in an initial page load performance hit.
6. Leading on from that, lightbox currently can only handle displaying one image in the lightbox (you can't have 2 href attributes!), so if more than one field is chosen to be the main lightbox area, then we need to consider an alternative.

I've been thinking about this over night, and I'm not totally sure how to address these issues. The only idea I've had so far is described below, but I'm definitely open to alternatives as I can't help but feel that this is a bit hack-ish:

• Create a new menu item like: lightbox2_json/$field_identifier - figuring out what $field_identifier is, is the tricky bit.
• When the view / node is output, lightbox2 displays the field as normal, but instead of setting the href attribute to the target image it sets it to the appropriate lightbox2_json path
• When the link is clicked, lightbox2 makes an ajax request to lightbox2_json and uses the path info to gather the settings from the view / field config (possible?) and outputs the data appropriately.
• Lightbox displays the data in a lightframe - to prevent the screen overflow issue

The above solution could probably be improved, and may not even work, but just wanted to get ideas flowing. The advantage to this method is that it allows other lightbox content to continue working, and allows php layer more control over what's output (main advantage). In order for the php layer to retain control over the output, Lightbox2 needs some sort of ajax request to retrieve the data - but the main problem is giving the lightbox2_json page the data needed to identify the field to be displayed.

One possibility for the lightbox2_json path definition could be lightbox2_json/view/$viewname/$fieldname/$fieldvalue or (lightbox2_json/ccknode/$content_type_name/$fieldname/$fieldvalue for non-views) where $fieldvalue is e.g. image filename or other identifier of the triggering field (e.g thumbnail). Not sure about this, just throwing it out there.

There could be a small time delay in loading the content via ajax, but it shouldn't be any worse that what's there already. In addition lightbox2 preloads the previous / next images in a group, so navigating between images in a group isn't too slow - we can re-use that same js code here.

Thoughts?

1) This approach would support any arbitrary field as the trigger and the popup content.

2) This would not have any effect on the normal node view page. So we can't get rid of the formatters yet. :-( At least you wouldn't need to use them in views, which is where I generally use lightbox2 anyway. And views are where the complex logic tends to be.

3) Yeah, that's a challenge. I don't know the solution there.

4) For this to work, we would need to push the theming back to the PHP side.

5) If we don't want to pre-load all of the content, then what you describe probably is the best approach if we can figure out how to get Views to generate just that one record for us. If we do, then I have had great success tucking rendered content into Drupal.settings, sticking that in the footer, and then just looking it up by id, url, or something on the JS side as needed. The download size is no larger than if the content were put inline in the page, and the lookup tends to be quite fast. Because the HTML is already pre-rendered server-side the cost on the client-side is quite minimal.

6) The idea of this approach is that as far as lightbox is concerned, you'd give it not a field but a blob of HTML, which has been rendered using the views replacement tokens and any of the fields on the view that are available.

I tried to implement this and I'm having a problem...

I am getting this error after I created the lightbox2 field type, saved & submitted the form and then tried to go back to the form:
In the fields area:
Broken/missing handler Lightbox text

In the form area:
Error: handler for lightbox2 > doesn't exist!

I have the patch attached

Attachment	Size
lightbox2_474454.patch	4.15 KB

I think it's to do with the following code in lightbox2_handler_field_lightbox2:

I don't know the reason why, but when you remove that code or change 'field' to a different name, e.g. 'myfield', then the error no longer appears.

It could be that "field" is a secretly reserved word, perhaps? When we changed it to "trigger_field", that error went away. Curious.

The Live Preview in the views module is replacing the tokens with the correct field values, but the actual page that I want to display it on isn't replacing the tokens. So it looks like this [field] blah blah [field] instead of hello blah blah hello or something to that degree. Let me know if more information is needed. Here's the patch.

Attachment	Size
lightbox2-474454.patch	5.27 KB

Works fine on test. When using token replacement, remember that all token fields must be loaded before your field.

Other than that, the select list for target field should use the human-readable names of the field, not the machine name.

Needs work. It works to a certain extent. Using the tokens I can successfully load other fields in the lightbox.

So I created a node view in which I put the node title and it's associated imagefield in the view. I excluded both of these fields from the display. I then added a lightbox trigger field and set the 'title' field to be the trigger and using the replacement tokens, got it to load both the title and the image in the lightbox. When clicking on the first trigger field, it correctly loads the title and images associated with the first node. When clicking on the second trigger field, it also loads the title and image of the first node, and not the second node.

It'd also be nice if you could configure the lightmodal size and grouping as described at http://drupal.org/node/276378 but that's a non-blocker.

Cheers,
Stella

Got it working to some extent, but with a bug -- given a table view of thumbnails (and other excluded fields) the popup lightbox window contains fields for the first image, regardless of the thumbnail clicked. The source code contains right data (in a div with 'display: none;') for all other thumbnails, but these are not displayed.

Grouping options would also be great.

Sounds like an issue in the Javascript, perhaps? Anyone want to try and fix that up? :-)

Hi, this looks like it could fix my problem. I have a Jcarousel showing image thumbnails and short captions, any of which launch a lightbox slideshow with larger versions of all the images from the carousel. I would like to use the node title and body as a caption in the lightbox (the body text is short). Is it possible to do this using the patch at #6, and should I apply it to the latest dev? I'm using D6 with views 2, imagecache, CCK imagefield and panels 3, the site is still in development at: http://213.175.197.130/~northern/

Any info would be much appreciated, to avoid rushing in to another dead end ;-}

You can try it. There are still some reported bugs, which we've not had time to work on yet. If you can and can submit a revised, de-bugged patch, that would be awesome.

I do believe this should do it...

Attachment	Size
lightbox2-popup.patch	5.01 KB

Updated a bit, now with customizable height/width and paging support.

Attachment	Size
popup.patch	6.36 KB

Hi Crell,

I've just signed on to help Stella as a co-maintainer of lightbox2

I applied the patches to my test site, drupal 6.13 with cck, views, image assist, imagefield, imageapi, imagecache and filefield.

I am getting this fatal error when I try to activate the patched version of lightbox2:

atal error: Class 'views_handler_field' not found in /opt/lampp/htdocs/drupal6/sites/all/modules/lightbox2/lightbox2.module on line 9

Are their other modules that I should install? Or any other configurations that I need?

Thanks,
Tracy

There should be no other modules required besides lightbox2 and views. Everything else is optional. Do you have a freshly cleaned cache?

I almost think the patch didn't apply properly. The only changes in the patch to the lightbox2.module file is adding the views_api hook. The only place views_handler_field should be specified is as the parent of the class in the inc file, and Views should have included the necessary file already by that point.

We're using this patch on a number of sites now and it's working fine. It still sounds like a cache issue on your end, or something along those lines.

The previous patch was ignoring the width and height from the settings.

Attachment	Size
popup-474454-19.patch	6.51 KB

Awesome patch everyone! I committed it with just one change to allow the user to specify whether or not lightbox grouping should be enabled.

Thanks!

Hi all,

I've been trying (without luck) to get a video Emfield to play in lightbox 2 from the media content type.

I was watching your work on this patch and since you added it to -dev, I tried it. But, I am getting this Drupal error on the view when it's run:

I've cleared the Drual cache and the views cache.

I've attached my View as a file. The HTML in the page doesn't really make sense, with all the nested A links, as follows:

What am I missing?

[[Aside: I have to say this is disappointingly difficult. Wouldn't it all be much easier to add a CCK display field like "lightbox2:thumb->video" so all you have to do is set the display field to get your emfield to play in a lightbox? Just like you have for all the lightbox2: x->y types...]]

-- glen

Attachment	Size
lightbox-trigger.txt	5.78 KB

It cannot be done as a formatter because formatters have no configuration ability at all. So you'd have to, in the formatter hook, detect all possible fields on all possible content types and create a formatter for each one dynamically. That's going to be hundreds, perhaps a thousand formatters on large sites.

As for your problem, video sucks. :-) It looks like you're mis-configuring it, though. Are you sure you have the trigger field set to the thumbnail, not the video? the video field needs to be present in the view, marked "exclude from display", AND appear BEFORE the trigger field, AND be configured to not have any links of its own. Then you reference it from the trigger field in the replacement textbox.

And really, this should be filed as a new issue as the original issue has now been committed, so it should be marked fixed.

I love the idea of this new feature but I have run into some problems no doubt operator difficulties. when implemented the lightbox trigger displays the filefield as it is selected in its field settings(generic files or lightbox:iframe). if I click on the file name it takes me to the file displayed in a pdf viewer on a different page. if I click on the pdf icon it starts loading lightbox but then gives me the broken image in the lightbox. if there is something I am missing please let me know. do I need to give it a special class? pdfs should work in this setup I assume so let me know as soon as you can so I can deliver this sweet feature to my client.

Please open a new support issue. This issue is for the feature addition itself. Thanks.

Automatically closed -- issue fixed for 2 weeks with no activity.

when trying to add a lightbox trigger i get the following error. any help would be appreciated. i have the following config:
FileField 6.x-3.2
Image 6.x-1.0-alpha5
ImageAPI 6.x-1.6
ImageCache 6.x-2.0-beta10
Lightbox2 6.x-1.x-dev (2009-Oct-02)

Attachment	Size
lightbox-filter.jpg	48.3 KB

Subscribing. I strongly believe this feature is a big plus! :)

subscribing