901

(3 replies, posted in Juicebox-Pro Support)

Could you take a look at the attached .7z archive containing config.xml, index.html and the jbcore subdirectory.

There's no file attached to your post.
I've just checked and, unfortunately, the forum software does not allow .zip or .7z files to be attached to posts. Sorry about that. (It accepts mostly image and text files.)
Perhaps you could upload your .7z file somewhere else (perhaps your own web server or a file sharing service such as Dropbox or Google Drive) and provide a download link. Thank you.

I find that the same kind of failure (all html files, no images) happens sometimes with the galleries that came with LR,as well.

This certainly suggests that the problem lies with core Lightroom functionality rather that something specific to the Juicebox web engine.

The number of images does seem to make a difference, in that if there are only a few images to test, the export works, but with a few thousand images, it fails.

If the problem happens consistently when you try to export a few thousand images, then it sounds like Lightroom might be reaching some kind of internal limit (or maybe even a system limit such as memory).
Unfortunately, it sounds like there is little that we can do with regard to the Juicebox plugin to solve your problem as it happens elsewhere, too.
Also, I notice that you are using the latest version of Lightroom CC 6 (6.14). If the problem is a bug in Lightroom CC 6.14, then there are no further upgrades for Lightroom CC 6 and the next step up would be Lightroom Classic CC 7 (but I do not know if this will help).

I've found a couple of forum thread online which might be somewhat relevant to your problem (or at least help to explain what might be going on).

The first thread is a report of Lightroom CC 6.14 maxing out system memory so I guess this might also be what is happening with your scenario.
https://feedback.photoshop.com/photosho … out-memory

The second thread is a report of Lightroom CC 6 not exporting all selected images. (There are suggestions to close Adobe Bridge and any other programs which might be monitoring the output directory.)
https://feedback.photoshop.com/photosho … ted-images

I do not know if the information contained in these threads will help but it is almost certainly a Lightroom issue (rather than an issue specific to the Juicebox plugin) and the only thing I can suggest is that you try upgrading Lightroom if you can (although I realise that there are no further upgrades for Lightroom CC 6 and the next step up would be Lightroom Classic CC 7).

902

(3 replies, posted in Juicebox-Pro Support)

That's very strange.
I've never known this to happen and, as far as I can recall, no-one has reported such a problem before.
It is also strange that the plugin used to work fine for you but now does not.
Changing gallery configuration options should have no bearing on the image export process.

What happens if you try to export a gallery using a different web engine such as Classic Gallery or Grid Gallery (one of the default web engines)? Are the images exported successfully when using these web engines? Is the problem just with the Juicebox web engine?

If you find that the problem happens with all web engines, then I would suggest reinstalling Lightroom itself to see if this helps.

If the problem happens only with the Juicebox web engine, then perhaps you could zip your incomplete gallery folder's 'index.html' and 'config.xml' files and attach them to a post (or upload them somewhere and provide a download link) so that I can check them out. Maybe there are clues within the exported HTML and XML files as to why the export process has been incomplete. Also, with access to your gallery's 'config.xml' file, I should be able to see your gallery's configuration options and can then try to replicate the problem myself using the same options.

Thank you.

903

(1 replies, posted in Juicebox-Pro Support)

I realise that you do not want to use Flickr but, as Juicebox has built-in support for Flickr, using a Flickr account (or a Flickr set) as a source of images for a Juicebox gallery is a very simple process of just setting one or two configuration options.
Unfortunately, Juicebox does not have built-in support for Google Photos and there is no quick and easy solution for displaying images from a Google Photos album in a Juicebox gallery.

It is certainly possible to use a custom data source (as noted in this FAQ: Can Juicebox handle a custom data source, for example RSS or Instagram?) but Google Photos integration would likely turn into quite a substantial coding project.
You'd probably need to use the Google Photos Library API with the PHP client library (which looks to be quite a complex process in itself) to obtain a list of photos and then dynamically create the XML data for your Juicebox gallery in the correct format (using PHP).
I do not know of anyone who has done this before for Google Photos so I am unable to point you in the direction of any sample code.

Depending on the scale of your project, it might be quicker (and certainly easier) to just duplicate your Google Photos albums for your Juicebox galleries (using local images).

904

(3 replies, posted in Juicebox-Pro Support)

You're welcome!
I'm glad it solved your problem. Thank you for letting me know.

905

(3 replies, posted in Juicebox-Pro Support)

When I check your gallery's dynamically generated XML file, I expect to see XML data (the gallery's configuration options and image data) but, instead, the following messages are displayed:

Warning: require_once(GAWD_DIR/wd/start.php): failed to open stream: No such file or directory in /home/mhfm/public_html/wp-content/plugins/wd-google-analytics/google-analytics-wd.php on line 60

Fatal error: require_once(): Failed opening required 'GAWD_DIR/wd/start.php' (include_path='.:/usr/lib/php:/usr/local/lib/php') in /home/mhfm/public_html/wp-content/plugins/wd-google-analytics/google-analytics-wd.php on line 60

It looks like the problem is related to the WD Google Analytics plugin which is somehow interfering with the functionality of WP-Juicebox.
Try temporarily deactivating your WD Google Analytics plugin to see if this helps.

Edit:
I've investigated the problem further and it seems to have something to do with the fact that both plugins (WP-Juicebox and WD Google Analytics) have a file named 'config.php'.
I'm not sure of the exact cause of the problem (both files are in different folders and should not interfere with each other) but a workaround seems to be to rename the WP-Juicebox file 'config.php' to 'config2.php' and then also rename the reference to the file on line 275 of the 'wp-juicebox.php' file, changing:

$config_url = plugins_url('config.php?gallery_id=' . $clean_gallery_id, __FILE__);

... to:

$config_url = plugins_url('config2.php?gallery_id=' . $clean_gallery_id, __FILE__);

Please note that the line number above refers to the current version of WP-Juicebox (v1.5.1).

I hope this helps.

906

(1 replies, posted in Juicebox-Lite Support)

When I create a new gallery and add new images, it gets stuck with processing images after two or three images.

It sounds like JuiceboxBuilder-Lite is choking on a certain image (or images).
If you try to add a batch of images more than once, does JuiceboxBuilder-Lite stop processing then images on the same image number each time?

Here are a few things to check and try which should hopefully point you in the right direction.

(1) Try adding your images in small batches to try to find a specific image that JuiceboxBuilder-Lite fails to successfully process. You may have one or more images that are somehow corrupt (perhaps just even corrupt metadata could prevent JuiceboxBuilder-Lite from successfully processing images).

(2) If you find an image that causes the problem, then try resaving it in an imaging program (such as Adobe Photoshop) to see if this resolves the problem.

(3) Also, if you find a problematic image (or have a small batch of images that consistently fails), please zip the image(s), upload the file somewhere and provide a download link so that I can try to replicate the problem with the same images that you are using.

(4) Try creating a fresh gallery with a completely different image source (maybe a different camera or phone or perhaps just some sample images from the internet) to see if the problem still occurs.

These suggestions might not solve your problem but they should at least help to narrow down possible causes.

907

(3 replies, posted in Juicebox-Pro Support)

Can you tell me what is wrong?

You need to give your 'juicebox' object a variable name so that you can refer to it via the Juicebox-Pro API.
You can name your 'juicebox' object whatever you like but, in my sample, code, I used the variable name 'jb' so just change:

new juicebox({

... to:

var jb = new juicebox({

Also, is there a way to make the added showThumbPage textbox be inside the dark area, so it looks like a part of the web page?

It would not be easy to integrate a new HTML element inside the gallery. Juicebox has not been designed with this in mind and there's no obvious place for it to go.
However, you could perhaps use the Gallery Title to display your thumbnail page input box and button.
If you then position the Gallery Title in the TOP area (a reserved area at the top of the gallery where the Gallery Title, Button Bare and Back Button can be positioned, then it would not overlap any other gallery elements.
(You would lose the ability to display a Gallery Title in the gallery, though.)
Try the following:

<!--START JUICEBOX EMBED-->
<script src="jbcore/juicebox.js"></script>
<script>
    var jb = new juicebox({
        containerId: 'juicebox-container',
        galleryTitlePosition: 'TOP',
        galleryTitle: '<div id="input"><input id="index" type="text" /><span>&nbsp;</span><input id="show" type="button" value="Show" /></div>'
    });
    jb.onInitComplete=function() {
        $('#show').click(function() {
            var index = $('#index').val();
            jb.showThumbPage(index);
        });
    };
</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->

Otherwise, you could include your thumbnail page input box and button in a header above the gallery on your web page.
You could give the header a fixed height and then have the gallery resize to fill the remaining space in the browser window (similar to the View Resizable Gallery with Top Menu Example in the Using a Resizable Gallery with a Header support section).
Here's a sample 'index.html' file that you can use (or copy/modify to suit your own needs).

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" id="jb-viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0" />
        <style type="text/css">
            html, body {
                height: 100%;
                overflow: hidden;
            }
            body {
                background-color: #222222;
                margin: 0px;
            }
            #header {
                background-color: #222222;
                color: #666666;
                font-family: sans-serif;
                font-size: 20px;
                height: 50px;
                padding: 10px 0px;
                text-align: center;
                width: 100%;
            }
            #wrap {
                width: 100%;
            }
        </style>
        <script type="text/javascript" src="jbcore/juicebox.js"></script>
        <script type="text/javascript">
            var jb;
            function doLayout() {
                var windowHeight = parseInt(window.innerHeight ? window.innerHeight : $(window).height(), 10);
                var headerHeight = parseInt($('#header').outerHeight(true), 10);
                var galleryHeight = windowHeight - headerHeight;
                $('#wrap').height(galleryHeight);
            }
            $(document).ready(function() {
                $(window).resize(doLayout);
                jb = new juicebox({
                    containerId: "juicebox-container"
                });
                $('#show').click(function() {
                    var index = $('#index').val();
                    jb.showThumbPage(index);
                });
                doLayout();
            });
        </script>
        <title>Test</title>
    </head>
    <body>
        <div id="header">
            <input id="index" type="text" />
            <span>&nbsp;</span>
            <input id="show" type="button" value="Show" />
        </div>
        <div id="wrap">
            <div id="juicebox-container"></div>
        </div>
    </body>
</html>

Also, why on earth does the index.html generated by Juicebox have the <script>...</script> in the <body>...</body> instead of the <head>...</head> area?

It does not actually make any functional difference whether the embedding code is in the <head> or <body> section.
JuiceboxBuilder puts the <script> section in the <body> alongside the Juicebox container <div> (which must be in the <body>) to keep all the embedding code together so that it can be copied and pasted (if necessary) in a single chunk.

Please provide more specific guidance than "smaller batches."  Does that mean 60 or 100 or 200 or ...?

Unfortunately, there are no specifics that I can give you. The best that I can suggest is that you use some trial and error to figure out what is safe for your system. If you find that JuiceboxBuilder does not crash when adding 250 images at once (for example), then it would be safer to limit your batches to 200 images at a time (to factor in an element of safety). I realise that this is less than ideal but it should prevent the application from crashing when you near the end of adding your batches.

What is the relevant measure of "smaller"?  Number of images?  Total size of all images selected? Something else?

I expect the relevant factor is the total filesize of the images in the batch but this is just speculation on my part. I have no access to the JuiceboxBuilder source code and do not know the exact reason for the problem (so cannot easily figure out a 100% safe workaround).

Please enhance the sofware with a warning that too many files are being added and tell me to select fewer.  Don't just crash!  Check when the crash becomes likely and let me have another chance.

The developer are aware of this issue but I do not know when it might be addressed.
To collect more data on the issue, please let me know how many images you can add before the application crashes and what the total filesize of the batch is.
Also, please let me know what platform (Mac vs PC), operating system/version (e.g. macOS 10.13 or Windows 10 1809) and architecture (32-bit vs 64-bit) you are using and how much RAM your system has.
Thank you.

Does the Lightroom plugin have the same limitation?

No. As far as I am aware, the problem is a limitation specific to Adobe AIR (the platform on which JuiceboxBuilder runs).

If not, is there a way to collect all the settings and apply them in LR?

There is no way to migrate configuration option values from JuiceboxBuidler to Lightroom but, once you have a gallery set up in Lightroom, you can save the settings as a template and apply the template to future galleries (just like a 'Preset' in JuiceboxBuilder).

To set a template in Lightoom:
Once you've got a gallery configured that way you'd like it to be in Lightroom (using the individual controls in the Lightroom plugin's interface), you can save the combination of configuration options as a Lightroom template by clicking the + sign to the right of the text 'Template Browser' (in the left panel of the 'Web' section) and selecting a name for the template.
At any time in the future, if you want to apply this combination of configuration options to a gallery, expand the 'Template Browser' control panel, scroll down to the 'User Templates' section and select the template.

909

(3 replies, posted in Juicebox-Pro Support)

You could use the Juicebox-Pro API (specifically the showThumbPage() method) to jump straight to a certain thumbnail page.
Here's an example which allows the user to enter a thumbnail page number into an input box and when the 'Show' button is clicked, the chosen thumbnail page is displayed.
Just create a sample gallery in JuiceboxBuilder-Pro (with enough images that multiple thumbnail pages will need to be displayed) and use the following code as your gallery's 'index.html' file.

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" id="jb-viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0" />
        <style type="text/css">
            body {
                margin: 0px;
            }
        </style>
        <script type="text/javascript" src="jbcore/juicebox.js"></script>
        <script type="text/javascript">
            var jb = new juicebox({
                containerId: "juicebox-container",
                galleryHeight: "400",
                galleryWidth: "600",
                showPagingText: "TRUE",
                showThumbsOnLoad: "TRUE"
            });
            $(document).ready(function() {
                $('#show').click(function() {
                    var index = $('#index').val();
                    jb.showThumbPage(index);
                });
            });
        </script>
        <title>Test</title>
    </head>
    <body>
        <div id="input">
            <input id="index" type="text" />
            <span>&nbsp;</span>
            <input id="show" type="button" value="Show" />
        </div>
        <div id="juicebox-container"></div>
    </body>
</html>

This example is purely to demonstrate functionality.
You can adapt and style the method of input to suit your own web page.

I hope this helps.

910

(1 replies, posted in Juicebox-Pro Support)

A frame-driven website is likely to be less than optimal on mobile devices (as you have discovered) and, additionally, there are drawbacks to loading a Juicebox gallery into an frame. These drawbacks are noted here (scroll down to "2) Using an iframe").

If possible, it would be much better to layout your page using CSS rather than frames and to embed the gallery directly into the web page following the embedding instructions here.

If you are looking to have a web page with a side menu, then I would recommend taking a look at the View Resizable Gallery with Side Menu Example in the Using a Resizable Gallery support section.
You can view the source of the sample web page in your browser and copy/modify it to suit your own needs.

If you are looking for an automated way to create your complete website, you might be interested in another one of our products, namely Showkase.

Showkase is a PHP web application (installed on your web server instead of your computer) which allows you to create a complete portfolio web site (integrating multiple galleries) online.
Showkase has full support for Juicebox-Pro and the galleries can be created within the application itself in a web browser interface (or created with JuiceboxBuilder and imported).

You can create Gallery Index pages and have as many galleries listed on each Gallery Index page as you wish.
Each gallery is represented by a thumbnail image with the gallery title displayed below and the gallery is opened when the user clicks on the image.
Demo sites created with Showkase can be found here and a sample Gallery Index page can be found here.

Showkase can also create non-gallery pages (About, Basic and Contact pages) where you can add information about yourself (or any other content you like).
All of this is done automatically within the Showkase interface without the need for any manual coding at all.
You can check out the Showkase interface by logging into the Live Demo Admin.

Showkase comes with several different themes, (Boma, Kosel, Maribo) and Boma features a side menu (whereas Kosel and Maribo both feature a top menu). Here is a sample site created in Showkase with the Boma theme.

Showkase can be purchased as Showkase-Standard (which comes with Juicebox-Lite, the free version) or Showkase-Pro (which comes with Juicebox-Pro).
The only difference between Showkase-Standard and Showkase-Pro is the bundled viewer (Juicebox-Lite vs Juicebox-Pro).

I hope these notes help.

911

(5 replies, posted in Juicebox-Lite Support)

That's great! I'm sure you'll get on well with Juicebox-Pro.
If you get stuck with anything, just post a new topic in the Pro forum and I'll do my best to help you out.

912

(7 replies, posted in Juicebox-Pro Support)

You're welcome.
I hope the workaround isn't too inconvenient.

913

(5 replies, posted in Juicebox-Lite Support)

Can I add a page or screen number to it, like "Page 20 of 30"

Yes. Just set showPagingText="TRUE" (in JuiceboxBuilder-Pro's 'Customize -> Thumbnail' section).
Here's a sample gallery using this setting.

Yes, I'd rather not have multi-size, so would I have to do anything manually, or is assign a unique linkURL for each image something that an option tells Juicebox to do?

You would need to set the linkURL entries for your images (on JuiceboxBuilder's 'Images' tab) and provide (and upload to your web server) the images that your linkURL entries point towards.

A linkURL can be an absolute path (in the form http://www.example.com/images/image_0001.jpg) or a relative path (relative to the web page containing the gallery's embedding code).

Juicebox will automatically use the linkURL entries in the following scenarios:
(1) showOpenImageButton="TRUE" and the Open Image button is clicked (Lite and Pro).
(2) imageClickMode="TRUE" and the main image is clicked (Pro only).
(3) showDownloadButton="TRUE" and the Download Button is clicked (Pro Only).

Should we move this to Juicebox-Pro?

Don't worry about it. You are currently using Juicebox-Lite so your query is just fine here!

914

(5 replies, posted in Juicebox-Lite Support)

Is there a way to have 20 or maybe 50?

This is possible only with Juicebox-Pro (but not Juicebox-Lite, the free version).

With Juicebox-Pro you can set the thumbsPosition (the position of the thumbnails: TOP, BOTTOM, LEFT or RIGHT) and maxThumbRows and maxThumbColumns.

When thumbsPosition is set to either LEFT or RIGHT, the number of thumbnail columns is fixed at the maxThumbColumns value whereas the number of thumbnail rows is variable (up to the maxThumbRows value) depending on the dimensions of the thumbnails and the space available in the user's browser.
Take a look at this demo gallery with 3 columns of thumbnails: https://www.juicebox.net/demos/pro/simp … umbRows=10

When thumbsPosition is set to either TOP or BOTTOM, the number of thumbnail rows is fixed at the maxThumbRows value whereas the number of thumbnail columns is variable (up to the maxThumbColumns value) depending on the dimensions of the thumbnails and the space available in the user's browser.
Take a look at this demo gallery with 3 rows of thumbnails: https://www.juicebox.net/demos/pro/simp … ion=CENTER

I also want clicking on the larger image (or somewhere) to open the full sized full resolution image in a separate browser tab.

With Juicebox-Pro, you can create a Multi-Size Image gallery.
The Medium images will be displayed in the gallery and the Large images will be displayed when the images are opened on pages of their own.
If you do not want a Multi-Size Image gallery, then you can assign a unique linkURL for each image (which you could point towards a large image).

Set imageClickMode="OPEN_URL" (in JuiceboxBuilder-Pro's 'Customize -> Main Image' section).
If the image has a linkURL associated with it, then, when the main image is clicked, the linkURL will be opened in the linkTarget window (_blank, _self, _parent or _top). Otherwise, the largeImageURL will be opened and, failing that, the imageURL (the actual image used in the gallery) will be opened.

In Juicebox-Lite, you can use the Open Image button. (In Juicebox-Lite, it is not possible to change the image click functionality.)
Set showOpenButton="TRUE" (on JuiceboxBuilder-Lite's 'Customize' tab) to display the Open Image button on the gallery's Button Bar.
You can set a linkURL and linkTarget (click an image's thumbnail on the 'Images' tab to reveal the input fields at the bottom of the window) for each image.
You'll need to provide the large images yourself and ensure that your linkURL entries point towards them (with either absolute or relative paths).

I hope this helps to clarify things.
Please let me know if you have any further queries.

915

(7 replies, posted in Juicebox-Pro Support)

Unfortunately, I cannot explain why JuiceboxBuilder-Pro is unable to delete the .tempGallery folder when using your E:/ drive but at least you now know the cause of your problem and can work around it.

I've just tried using a test gallery on an external drive (labelled E:/) on my own computer (admittedly not exactly the same as your scenario but the closest I can get) and it works fine. JuiceboxBuilder-Pro successfully deletes the .tempGallery folder each time the application is closed.

I can't help but think that the problem is a permissions or file ownership issue.
If you are using a Windows PC, then try uninstalling and then reinstalling both JuiceboxBuilder-Pro and Adobe AIR but when you reinstall Adobe AIR, rather than just double-clicking the 'AdobeAirInstaller.exe' installation file, try right-clicking it and selecting 'Run as administrator'. This might help.

At least you have a workaround. Saving the gallery to your C:/ drive and then copying it to your E:/ drive might be inconvenient and an extra step in your workflow but at least it works and it might be a slightly easer option than manually deleting the .tempGallery folder each time you use the application.

916

(7 replies, posted in Juicebox-Pro Support)

Would it help if I deleted pro and reloaded?

It can't hurt to try.

A couple of other things to consider...

(1) Have you ever saved or tried to load a gallery in JuiceboxBuilder-Pro from a folder that is actively being synced with an online file sharing service such as Google Drive or Dropbox? This has been known to cause a persistent .tempGallery folder which JuiceboxBuilder-Pro cannot delete.

(2) Do you have any third-party security software installed (such as an anti-virus program or malware protection) which might somehow be interfering with the functionality of JuiceboxBuilder-Pro? If so, then try temporarily disabling it to see if this helps to resolve the problem.

917

(7 replies, posted in Juicebox-Pro Support)

There is no way to prevent JuiceboxBuilder-Pro from creating the .tempGallery folder (which is integral to JuiceboxBuilder-Pro functioning correctly).

There must be a reason JuiceboxBuilder-Pro beign unable to delete the .tempGallery folder when the application closes and it sounds like it might be a permissions issue.

First of all, try manually deleting the C:\Users\Username\Documents\JuiceboxBuilder-Pro folder itself.
JuiceboxBuilder-Pro will create a new one on next run and it might be set up with permissions that not longer cause your problem.

If this does not work, then navigate to your C:\Users\Username\Documents folder, right-click the 'JuiceboxBuilder-Pro' folder, click 'Properties' at the foot of the context menu, go to the 'Security' tab and see if there are any ticks in the 'Deny' column in the 'Permissions' box for any of the groups or user names.
For my own installation (with default settings), there are ticks in all the 'Allow' chekboxes (except for 'Special permissions').
If the permissions for your own 'JuiceboxBuilder-Pro' folder are not set up like this, then try changing them to see if this makes a difference.

I hope this helps.

You can use the Juicebox-Pro JavaScript API to determine the image that is currently being viewed and you can then take action accordingly.
Here's an example which will set a JavaScript variable (and display an alert) the first time that an image in position #10 or above is viewed.

<script src="jbcore/juicebox.js"></script>
<script>

    var jb = new juicebox({
        containerId: 'juicebox-container'
    });

    var flag = false;

    jb.onImageChange = function(e) {
        if (flag === false && e.id >= 10) {
            alert('Image #10 or above has been viewed.');
            flag = true;
        }
    };

</script>
<div id="juicebox-container"></div>

I hope this points you in the right direction.

919

(1 replies, posted in Juicebox-Pro Support)

Yes, absolutely.

Just set imageClickMode="OPEN_URL" (in JuiceboxBuilder-Pro's 'Customize -> Main Image' section) and set a unique linkURL for each image (on JuiceboxBuilder-Pro's 'Images' tab - click a thumbnail to reveal the input fields at the bottom of the window).
When an image is clicked, the corresponding linkURL will be opened in the specified linkTarget (which can be _blank, _self, _parent or _top).
Just use a linkUrl such as http://www.example.com/index.html.
If an image does not have a corresponding linkURL, then Juicebox will open the image itself (the imageURL) when the image is clicked.

920

(6 replies, posted in Juicebox-Pro Support)

The only way to have thumbnails and main images on separate pages is to use Small Screen Mode (by setting screenMode="SMALL" in JuiceboxBuilder-Pro's 'Customize -> General' section).

There are a few things to note, though.

(1) Using Small Screen Mode does not guarantee that all thumbnails will be displayed on a single thumbnail page.
The number of thumbnails displayed per page will depend on the size of the thumbnails, the number of images in the gallery and the amount of space available in the browser viewport.
If there is not enough space available to display all the gallery's thumbnails on a single page, then multiple thumbnail pages will be created (dynamically) and the user can navigate between them using the thumbnail paging arrows.

(2) Juicebox-Pro does not use a masonry style layout.
All thumbnails are the same size as each other, defined by the thumbWidth and thumbHeight configuration options.
In JuiceboxBuilder-Pro, these options are set on the 'Images' tab. Click the 'Change Sizes...' button in the 'Image size' control panel to reveal the 'Set Image Sizes' pop-up window where you can change the thumbnail dimensions.

I tried to activate the Small Screen Mode but then the main image no longer shows in its maximum size (I understood it's logical).

There is no reason why a main image in Small Screen Mode will not be displayed as large as it would in Large Screen Mode.
In Small Screen Mode, the gallery will still occupy the same area on its web page as it would in Large Screen Mode and the main images will still be scaled according to the imageScaleMode value.
In fact, in Small Screen Mode does not support a TOP area and the main image pages display no thumbnails, so there might actually be more space for the images to be displayed in Small Screen Mode that in Large Screen Mode.
Just be aware that if you use the default value for imageScaleMode of SCALE_DOWN, then small images will not be scaled up (as this might decrease their visual quality).
In such a scenario, you could either set imageScaleMode="SCALE" (to scale down large images and scale up small images so that they are all displayed as large as possible within the gallery's image area whilst respecting their aspect ratios and without cropping) or leave imageScaleMode="SCALE_DOWN" and use larger gallery images (so that all images need to be dynamically scaled down slightly to fit within the gallery's image area).

- when the slideshow is finished (jQuery callback?) it goes to the thumbnails/preview page

This is probably more difficult than it sounds.
You'd need to use the Juicebox-Pro API and refer to some internal CSS classes.
It is not something that Juicebox-Pro was designed to do but you could try the following which should detect when the last image in the gallery has been reached (via AutoPlay rather than manual navigation) and then wait for a designated amount of time (to allow the image to be viewed) before displaying the thumbnail page.
Please note that you are certainly free to try (and modify) this if you like but as it is not within the design parameters of Juiccebox-Pro, it is not officially supported.

<script type="text/javascript" src="jbcore/juicebox.js"></script>
<script type="text/javascript">
    var jb = new juicebox({
        autoPlayOnLoad: "TRUE",
        containerId: "juicebox-container",
        screenMode: "SMALL",
        showAutoPlayButton: "TRUE",
        showSmallThumbsButton: "TRUE"
    });
    jb.onInitComplete = function() {
        var count = jb.getImageCount();
        jb.onImageChange = function(e) {
            if (e.id === count && $('.jb-bb-btn-auto-play').first().hasClass('jb-status-playing')) {
                window.setTimeout(function() {
                    // Last image in gallery has been reached via AutoPlay and 5000ms have elapsed.
                    $('.jb-bb-btn-de-show-list').trigger('click');
                }, 1000);
            }
        };
        $('.jb-bb-btn-auto-play').click(function() {
            var index = jb.getImageIndex();
            if (index === count && $('.jb-bb-btn-auto-play').first().hasClass('jb-status-playing')) {
                window.setTimeout(function() {
                    // AutoPlay button has been clicked on last image in gallery and 5000ms have elapsed.
                    $('.jb-bb-btn-de-show-list').trigger('click');
                }, 1000);
            }
            
        });
    };
</script>
<div id="juicebox-container"></div>

921

(6 replies, posted in Juicebox-Pro Support)

Nonetheless is there else you think I should remove from my JS — as I wrote I just guessed things through your own examples?

As long as your setContainerHeight() function is determining and setting the correct height for your gallery container, then I'd make no functional changes.

You could, however, remove the return newH; line from the setContainerHeight() function as you no longer need the function to return a value.

You could also change $(window).bind('resize', doLayout); to $(window).resize(doLayout);.
Both will work equally well at the moment (there is no functional benefit in using one other the other just now) but jQuery's .bind() method has been superseded (by the .on() method) in jQuery 1.7 and deprecated in jQuery 3.0 so using .resize(doLayout) (as a shortcut for .on('resize', doLayout)) will future-proof your code if or when the version of jQuery bundled within Juicebox is updated.

But expanding after showing thumbs or showing thumbs in expand mode messes everything.

Things look a little messy when your gallery is expanded as your gallery has a transparent background and your web page can be seen behind the expanded gallery.

The two easiest solutions to this would be to either:
(1) Set an expandedBackgroundColor (in JuiceboxBuilder-Pro 'Customize -> Color' section) with an Opacity of '1' (so that the color you choose as the background is fully opaque).
... or:
(2) Set expandInNewPage="TRUE" (in JuiceboxBuilder-Pro 'Customize -> General' section) to expand the gallery on a new page of its own instead of on top of the embedding page.

Either of these solutions should work fine.

922

(6 replies, posted in Juicebox-Pro Support)

There is a lot going on in your web page so I cannot be sure that there are no influences outside the code you posted but the problem seems to be either an asynchronous or timing problem of some sort.
However, it might actually be enough to just change the size of the gallery's container without having to explicitly call the Juicebox-Pro API setGallerySize() function.
Try using just the following for your doLayout() function. In might just work fine without the additional code.

function doLayout() {
    setContainerHeight();
}

It's certainly worth a shot before we delve deeper into your web page's code.
I hope it helps.

923

(1 replies, posted in Juicebox-Pro Support)

The galleryWidth and galleryHeight entries in the 'config.xml' file are purely for JuiceboxBuilder-Pro so that, when you open an existing gallery in JuiceboxBuilder-Pro to edit it, the application can read the width and height values from the 'config.xml' file and populate the galleryWidth and galleryHeight fields in the interface (so that the same values will be re-used when the gallery is re-saved on the 'Publish' tab).

When the gallery is displayed in a browser, only the galleryWidth and galleryHeight entries in the embedding code are used so, if you really wanted to (and do not plan to edit your gallery with JuiceboxBuilder-Pro in the future), you could safely remove the galleryWidth and galleryHeight entries from the 'config.xml' file.

924

(5 replies, posted in Juicebox-Pro Support)

Only in Jalbum I can do multiple galleries at once,

That is correct. Only the Juicebox skin for jAlbum allows you to create multiple galleries at once

... but Facebook share option not working....

I have just created a test album in jAlbum and the Facebook sharing seems to work fine for me.
However, as I noted previously, due to the fact that the browser never leaves the 'index.html' page (and galleries are switched using JavaScript), there can be only one og:image for the entire album (and you need to add this manually by editing your 'index.html' file manually in a plain text editor).

There is a Pro Options field in Jalbum, but probably it is not working with shareUrl="www.example.net/test"

That's right. The shareUrl configuration option is used only by JuiceboxBuilder-Pro (and not the Juicebox skin for jAlbum). However, adding an og:image to your album's 'index.html' should take less than a minute and, due to the way that the album works, only one og:image can be used anyway so it is not a long time-consuming task.
Even if the Juicebox skin for jAlbum used shareUrl, the entire structure of the skin's output would need to be changed to allow a different og:image for each gallery. Each gallery would need to be displayed on its own separate web page and the visitor would need to go back and forth between the galleries and the navigation tree page (unless the navigation tree was duplicated on every gallery page but, again, this would require a huge restructuring of the skin).

If you find that, even after adding an og:image to your album's 'index.html' page, the designated thumbnail does not show up in the Facebook share window, then try running your album's 'index.html' page URL through Facebook's online tools to refresh Facebook's own cache of the page's Open Graph information.
(1) Facebook's Sharing Debugger: https://developers.facebook.com/tools/debug/sharing/
(2) Facebook's Batch Invalidator: https://developers.facebook.com/tools/d … ing/batch/
(3) Facebook's Open Graph Object Debugger: https://developers.facebook.com/tools/debug/og/object/
(Click the 'Fetch new scrape information' button.)

If you continue to experience difficulties, please post the URL to your album's 'index.html' page so that I can take a look and hopefully help further. Thank you.

925

(1 replies, posted in Juicebox-Pro Support)

Please attach an image to a post (or upload an image somewhere and provide a download link) so that I can see what you are seeing.
Also, please let me know what device and browser you are using to view your gallery.

In the meantime, the following notes might help to clarify some things.

The gallery will be displayed on the web page into which it is embedded at the dimensions specified by the galleryWidth and galleryHeight configuration options in the gallery's embedding code.
In desktop browsers (where the gallery is displayed in Large Screen Mode), space is reserved for the thumbnails and the TOP area (if used) and the remainder of the space is used to display the main images.
On mobile devices (Small Screen Mode), thumbnails and main images are displayed on separate pages and the TOP area is not used so the main images take up the entire gallery area.

No matter what size the gallery is, the main images will be scaled (within the gallery's image area) according to the value of the imageScaleMode configuration option.
Please see the entry for imageScaleMode in the Main Image section of the Config Options page for short descriptions of the possible values (SCALE_DOWN, SCALE, FILL, STRETCH, NONE).

Also, if you find that you have too much space at the top and bottom (or left and right) of your main images, then please see this FAQ which might help.
My Juicebox gallery shows too much space above or below the main image, how do I fix this?