Topic: Thumbnails

Is it possible to hide the thumbnail images when the gallery contains only one image and display the thumbnail images when the gallery contains more than one image?

Re: Thumbnails

This is not possible in Juicebox-Lite but it is possible in Juicebox-Pro.
If you have a gallery with only one image and would like to hide the thumbnail, set the following configuration options (which will hide the thumbnails and Thumbnail Button (in the Button Bar) in both Small Screen and Large Screen modes).

showThumbsOnLoad="FALSE" (Juicebox-Pro only)
showSmallThumbsOnLoad="FALSE" (Juicebox-Pro only)
showThumbsButton="FALSE" (Juicebox-Lite & Juicebox-Pro)
showSmallThumbsButton="FALSE" (Juicebox-Pro only)

Re: Thumbnails

Thank you for responding so quickly.  I understand that the Juicebox-Pro configuration settings allow the thumbnails to be turned off, but here's what I'm wondering...

My gallery sometimes has one image and at other times has more than one image, so I would like the thumbnails to be hidden when there is only one image and displayed when there are more than one, without having to change the configuration settings back and forth.  Is this possible with Juicebox-Pro?

Re: Thumbnails

The Juicebox-Pro API has the getImageCount() method but by the time this method is available to be called, the gallery would already have been displayed and it would be too late to set any configuration options according to the result (without reloading the gallery).

However, you could use JavaScript to parse the gallery's XML file, count the number of <image> entries and set the appropriate configuration options in the embedding code as follows:

<!--START JUICEBOX EMBED-->
<script src="jbcore/juicebox.js"></script>
<script>

    var xmlHttp = (window.XMLHttpRequest) ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
    var url = "config.xml";
    xmlHttp.open('GET', url, false);
    xmlHttp.send();
    var xmlDoc = xmlHttp.responseXML;

    var num = xmlDoc.getElementsByTagName("image").length;
    var bool = num > 1 ? true : false;

    new juicebox({
        containerId: 'juicebox-container',
        showThumbsOnLoad: bool,
        showSmallThumbsOnLoad: bool,
        showThumbsButton: bool,
        showSmallThumbsButton: bool
    });

</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->

The JavaScript section will work with both Juicebox-Lite and Juicebox-Pro but the showThumbsOnLoad, showSmallThumbsOnLoad and showSmallThumbsButton configuration options can still be set only in Juicebox-Pro.

Re: Thumbnails

Thanks!