Hi,

I have the lightbox V2 4.7.0 module installed and enabled. This means that when I click on an image in a gallery, a lightbox appears displaying a larger version of the image and it's title. However, to get to the image details page I have to exit out of the lightbox and then click on the image title. I would really like to be able to click on the image title that is displayed in the lightbox, or have a "View image details" link.

Cheers,
Stella

CommentFileSizeAuthor
#7 lightbox_info.patch2.92 KBkleingeist

Comments

azote’s picture

azote commented

this would be really nice

yched’s picture

yched commented
Project: Image » Lightbox2
Component: image_gallery » User interface

This seems like a feature request for Lightbox module

stella’s picture

stella commented
Status: Active » Needs review

I eventually made the following changes to the lightbox javascript code. There may be a better way to do it but this meets my needs.

Change to image_nodes.js:


    parent.rel = "lightbox[node_thumbnails]";
+ parent.id = parent.href;
    parent.href = nodes[i].src.replace(".thumbnail", "");

A similar change was made to image_nodes_nogroup.js:

    parent.rel = "lightbox";
+ parent.id = parent.href;
    parent.href = nodes[i].src.replace(".thumbnail", "");

Changes to lightbox.js, line 352:

 -   imageArray.push(new Array(imageLink.getAttribute('href'), imageLink.getAttribute('title')));
+  imageArray.push(new Array(imageLink.getAttribute('href'), imageLink.getAttribute('title'), imageLink.getAttribute('id')));

line 360:

 -  imageArray.push(new Array(anchor.getAttribute('href'), anchor.getAttribute('title')));
+ imageArray.push(new Array(anchor.getAttribute('href'), anchor.getAttribute('title'), anchor.getAttribute('id')));

line 482-483:

+ caption = imageArray[activeImage][1] + "<br /><br /><a href=\"" + imageArray[activeImage][2] + "\">View Image Information</a>";
+ Element.setInnerHTML( 'caption', caption);
 - Element.setInnerHTML( 'caption', imageArray[activeImage][1]);

I hope this helps someone.

Cheers,
Stella

kleingeist’s picture

kleingeist commented

Hi,
i just visited this page cause i've been looking for a similiar solution. But i think your code is sort of circular.
There is no need to set the URl explicit as another "parameter", because "title" or imageArray[X][1] isnt used anywhere without the Link. Beside i dont like the idea to abuse the "id" for anything else than an unique identfier for one element.

So the smaller and easier to maintain patch (cause the core lightbox.js isnt touched) could just update image_nodes{_nogroup}.js in the following manner:

parent.title = nodes[i].alt.concat("<br /><br /><a href=\"" + parent.href + "\">View Image Information</a>");

Btw. this is also the way suggested on http://www.huddletogether.com/projects/lightbox2/#support

But this implementation still lacks localization support. Unfortunately i have no idea how this could be solved.

Greetings

kleingeist’s picture

kleingeist commented

forgot to mention:
parent.title has to be set before parent.href is changed to the direct image url:

parent.title = nodes[i].alt.concat("<br /><br /><a href=\"" + parent.href + "\">View Image Information</a>");
parent.href = nodes[i].src.replace(".thumbnail", "");
//parent.title = nodes[i].alt;

greetings

stella’s picture

stella commented

I did toy with the idea of putting the link in the title attribute alright, it certainly involves less codes changes. However, I'm just loathe to do it as it is a bad practice, not to mention invalid HTML, to put HTML tags (in this case an anchor tag) within a tag attribute. Certainly, it is a lot easier to do for people who need to patch their own installations, but perhaps other ways should be investigated before including it in source tree.

Cheers,
Stella

kleingeist’s picture

kleingeist commented
StatusFileSize
new lightbox_info.patch2.92 KB

sorry for the long inactivity. i 've been in holliday. but now im back, and have some recommodations for this matter.

first, i cant find a forbiddance of "html-tags" inside a title. A title should contain "text", which should be human readable, but it is at least a CDATA field. So from the technical side, it could contain the greater (<), the less than (>), the equal (=) symbol and even quotes if they are enclosed in a block. At least this is the information i found about.
But the id attribute is defined more strict: it contains a Name which:"must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".")."
So any link of the type node/123 would break the definition, because of the slash. If there would be a block on the gallery page, with the most recent images, it is possible, that this would produce two identical IDs, which should never happen. Something else is mentioned in the reference: "The id attribute shares the same name space as the name attribute when used for anchor names" and "When both attributes are used on a single element, their values must be identical." This is another weakness of dynamic id rewriting.

So i think both methods are not really perfect, but i would currently prefer not to play around with the sensitive id attribute. If it is possible to hack the lightbox.js my proposal would be the follow: Set some global lightbox settings and do image node detection in the lightbox.js. Then it would be possible, to create the link language depenend and theres no more need of extending the link. I've attached my proposel:

stella’s picture

stella commented
Assigned: Unassigned » stella

This has been added to the new drupal 5.x version of the module lightbox2 5.x-1.x-dev.

stella’s picture

stella commented
Status: Needs review » Fixed

Should be fixed in both lightbox2 4.7.x-1.0 and lightbox2 5.x-1.1.

Cheers,
Stella

stella’s picture

stella commented
Status: Fixed » Closed (fixed)