Support the disabling of the lightbox feature instead of adding it only to specific rendered content

Hi everyone!

As part of the lightbox feature, I started to work on Loading...
for marking the images embedded by users inside the page content. The idea was to differentiate them of icons or other images provided maybe by a macro. This way the lightbox will be attached only to images generated by the (X)HTML renderers.

But there could be usecases where images that are not generated by a (x)html renderer should have a lightbox, or at least the user would expect them to have this feature. I think that this could easily happen with contributed macros that will display images, for their specific situation.

For this I propose to attach the lightbox by default on all the images inside the xwiki content and provide a class that can disable it for an element and it’s children. This way, any contributed code can choose to have or not this feature enabled, partially or complete, by using this class.


Sounds good to me. I guess you’re proposing a blacklist rather than a whitelist approach to have more images shown rather than less, by default without modifying any macro.

Note that there’s also potentially the need to support images generated from the usage of the HTML macro. These won’t go through the onImage() event internally. So I guess Macros will need to “annotate” for disabled images both in the XDOM and in the HTML inside the HTML macro when it’s used.

+1, sounds good, except that I wouldn’t use a CSS class (which should be about display) but an attribute instead, e.g. data-lightbox="false". Another advantage I see over the CSS class is that this attribute could allow us to pass custom (JSON) configuration to the lightbox in the future, in case the need arises, to be applied for a specific sub-tree of the DOM.

Note that if we use an attribute we should use the xwiki namespace probably (data-xwiki-* format).

Good point. +1 for data-xwiki-lightbox.