But the first problem, which appears only by changing orientation, should be fixed somehow...

I changed the script, but that doesn't fix Safari problems - maybe I made a mistake?

No, you have not made a mistake.
What version of iOS do your devices run?
Also, as I am unable to replicate the problem, could you please upload a screenshot somewhere so that I can see what you are seeing? Thank you.

The doLayout() function uses jQuery functions and uses the version of jQuery bundled within the 'juicebox.js' JavaScript file. It is possible that there may be a problem in this version of jQuery with the functions used (such as outerHeight) in Mobile Safari and it might be worth including the current version of jQuery (v1.11.1) in your page to see if this makes a difference. Download jQuery v1.11.1, place the 'jquery-1.11.1.min.js' file in the same directory as your gallery folders and include the following line of code in the <head> section of your main page:

<script src="jquery-1.11.1.min.js"></script>

It's a long shot but it might be worth trying.

This works quite well on all devices, but on iPad or iPhone I notice a white border on the bottom part of the screen after I turn the device to landscape modus.

I do not see this problem on an iPod Touch running iOS 6.1.6.
What version of iOS are you using? Also, do you see the problem in Chrome or just in Mobile Safari?
One possible fix for this might be to run the doLayout() function (to resize the gallery to fill the page) when the device's orientation is changed. Try adding the following JavaScript to your web page:

window.onorientationchange = function() {
    doLayout();
};

Also expanding in landscape modus, turning to letter modus and reexpanding results in a smaller gallery.

I see this problem (but only in Mobile Safari under iOS 6.1.6 and not in Chrome).
Ordinarily, it should be possible to run the doLayout() function when a gallery is closed (from its expanded state) within the onExpand Juicebox-Pro API event.
However, this will not work on iOS devices as the gallery is expanded in a new page and the onExpand event will not be fired when the gallery is closed. Please see here for details.
You could force expandInNewPage="FALSE" but this will change the scale of the embedding page (which has currently been logged as a bug and should hopefully be fixed in a future version).
Unfortunately, I do not see an easy fix for this (other than to either not rotate your device between expanding and closing a gallery or to use Chrome in preference to Mobile Safari, both of which I realise are not practical solutions).

3,678

(3 replies, posted in Juicebox-Pro Support)

Sorry. I should have said "complete <image> entries" rather than "imageURLs" in my post above. (I have now corrected it for others reading the post.)

To manually remove an image from a gallery, open the 'config.xml' file in a plain text editor and delete the entire <image> tag corresponding to the image you wish to remove.
A complete <image> entry will look something like this:

<image imageURL="images/wide.jpg"
    thumbURL="thumbs/wide.jpg"
    linkURL="images/wide.jpg"
    linkTarget="_blank">
    <title><![CDATA[Title text goes here.]]></title>
    <caption><![CDATA[Caption text goes here.]]></caption>
</image>

(You can also delete the corresponding images and thumbnails from the 'images' and 'thumbs' folders but this is not strictly necessary to remove an image from a gallery. If the image is not listed in the XML file, then it will not be displayed in the gallery.)

In any case, this is no longer necessary.
The Juicebox-Pro download zip file has been repackaged with the fixed version of JuiceboxBuilder-Pro (the Juicebox-Pro core files remain the same) and you can download it using the link from your purchase email.
Once you install the latest version of JuiceboxBuilder-Pro, you should no longer experience this issue.
Instructions for upgrading can be found here.

3,679

(3 replies, posted in Juicebox-Pro Support)

This is a known bug. However, it has already been addressed and will be fixed in the next version.
Unfortunately, if you need to remove images from an existing album, the only workaround at the moment would be to remove them manually (delete the images and thumbnails from the 'images' and 'thumbs' folders and delete the corresponding complete <image> entries from the gallery's XML file).

3,680

(3 replies, posted in Juicebox-Pro Support)

From the look of your screenshot (in the email you sent me), you are entering www.dennisandes.com/show/learningexpress-background.jpg. You need to start this absolute URL with http://, otherwise, the URL will be seen as a relative path (relative to the HTML document which contains the gallery's embedding code).
Use http://www.dennisandes.com/show/learningexpress-background.jpg and your background image should be displayed.

If you continue to experience difficulties, please post the URL to your gallery so that I can take a look and help further.

3,681

(8 replies, posted in Juicebox-Pro Support)

It looks like there is, indeed, a problem with pasting via keyboard in Adobe AIR v14.0. Please see these links for further details:
https://forums.adobe.com/thread/1495749
https://bugbase.adobe.com/index.cfm?eve … id=3775354

In the meantime, workarounds would be to either:
(1) Paste the text via mouse context menu.
(2) Type the text into the input field.
(3) Paste the text via keyboard and manually delete the duplicate entry.
(4) Revert to a previous version of Adobe AIR (not necessary if using #1, #2 or #3 above). Previous versions of Adobe AIR can be downloaded from this web page.

3,682

(3 replies, posted in Juicebox-Pro Support)

Thank you for reporting this problem. It has already been reported in this forum thread.

The double-paste issue seems to happen:
(1) Only on Mac (not on PC).
(2) Only when pasting via keyboard (not via mouse context menu).
(3) Only under Adobe AIR v14.0 (not previous versions).

I have notified the developers of this problem but it looks like there is, indeed, a problem with pasting via keyboard in Adobe AIR v14.0. Please see these links for further details:
https://forums.adobe.com/thread/1495749
https://bugbase.adobe.com/index.cfm?eve … id=3775354

In the meantime, workarounds would be to either:
(1) Paste the text via mouse context menu.
(2) Type the text into the input field.
(3) Paste the text via keyboard and manually delete the duplicate entry.
(4) Revert to a previous version of Adobe AIR (not necessary if using #1, #2 or #3 above). Previous versions of Adobe AIR can be downloaded from this web page.

Thank you for sharing your findings.

3,684

(6 replies, posted in Juicebox-Pro Support)

I think I bought it, but if it does not work in the project, I get a refund?

If you run into any problems, I'll certainly do my best to help you out but, yes, we do offer a money-back guarantee, as noted in this FAQ:
Can I get a refund?

3,685

(7 replies, posted in Juicebox-Pro Support)

when employing your code, it works well, except I have to switch it to AUTO screen size.

If should work for any value of screenMode. The code should be executed only if screenMode="SMALL" or if screenMode="AUTO" and Juicebox chooses to use Small Screen Mode.

However, the captions still show up in the expanded mode as well, even though you have code in their to hide it.

The code works when the gallery is expanded in the same page. However, on iOS devices, the gallery is expanded in a new page (the 'full.html' file within the 'jbcore' folder). Please see the Expand Gallery Behavior support section for more details.
Try the following (in addition to the code above in your main embedding web page).
Open your gallery's 'jbcore/full.html' file in a plain text editor and change:

<!--START JUICEBOX EMBED-->
<script>
    var expanded_jb_gallery = true;
    new juicebox({
        containerid:'juicebox-container',
        galleryHeight:'100%',
        galleryWidth:'100%'
    });
</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->

... to:

<!--START JUICEBOX EMBED-->
<script>
    var expanded_jb_gallery = true;
    var jb = new juicebox({
        containerid:'juicebox-container',
        galleryHeight:'100%',
        galleryWidth:'100%'
    });
    jb.onInitComplete = function() {
        if (jb.getScreenMode() === 'SMALL') {
            $('.jb-area-caption').remove();
        }
    };
</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->

(Further testing today suggests that you may also need to increase the timeout from 500ms to 1000ms in my original code for when the gallery is expanded in the same page.)

It certainly sounds like the problem is not directly related to Juicebox.
Perhaps you could post your query in the Lightroom forum.
Also, Lightroom has just been updated to v5.5 (on 18 June 2014) so it might be worth updating to see if this helps: https://blogs.adobe.com/lightroomjourna … lable.html

3,687

(6 replies, posted in Juicebox-Pro Support)

return mode is displayed when we click on the image and not the thumbnail page?

That is correct. In Small Screen Mode, the Back Button will be displayed only on main images pages and not on thumbnail pages.

On this post on Africa Gallery in mobile mode in the thumbnail page we see the icon back icon symbolizing the home? It is normal that it works?

The user has created his own 'home' button (using a custom image, CSS and HTML) and has overlaid it on top of his web page so that it displays on the thumbnail pages and covers Juicebox's own Back Button on the main image pages.
He has outlined the method he has used in this forum post.

So you're saying that if we displayed in full screen mode it will display the home button

No. In Small Screen Mode, the Back Button will be displayed only on main images pages and not on thumbnail pages (no matter whether the pages are displayed fullscreen or not).

Ah ok if I do that,
it will work you thinking?
backButtonUrl: 'javascript: onclick="Ti.App.fireEvent('closeWin');',

No. The correct format (if setting the configuration option in the embedding code like in my example above) would be:

backButtonUrl: 'javascript: Ti.App.fireEvent("closeWin");',

3,688

(7 replies, posted in Juicebox-Pro Support)

The best I've been able to come up with is the following. It might not be a very clean solution but you might find it to be suitable (or it might at least point you in the right direction). It uses several Juicebox-Pro API methods and events and also jQuery which you will need to include in your web page.
When the gallery is first loaded (onInitComplete), if Small Screen Mode is detected (getScreenMode), the .jb-area-caption container is removed from the Document Object Model (DOM).
This works fine but will only be of use if the Splash Page is not used. As soon as the gallery is expanded (from the Splash Page or from the Expand Button), the .jb-area-caption container gets reinstated but removing the container as before as soon as onExpand is fired does not work due to a timing issue. This is why I have introduced a small delay before removing the .jb-area-caption container again.

<!--START JUICEBOX EMBED-->
<script src="jquery-1.11.1.min.js"></script>
<script src="jbcore/juicebox.js"></script>
<script>
    var jb = new juicebox({
        containerId: 'juicebox-container',
    });
    jb.onInitComplete = function() {
        if (jb.getScreenMode() === 'SMALL') {
            $('.jb-area-caption').remove();
            jb.onExpand = function(expanded) {
                if (expanded) {
                    setTimeout(function() { $('.jb-area-caption').remove(); }, 500);
                }
            };
        }
    };
</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->

I hope this helps.

3,689

(1 replies, posted in Juicebox-Pro Support)

There are no configuration options (or API methods) which would allow you to toggle the thumbnails without the main image resizing dynamically to fill the available space.
However, you could try the following which places a custom 'Toggle Thumbnails' button on the web page and uses jQuery to toggle the .jb-classifier-thumb-area (thumbnail) container.
You would need to include jQuery in your web page for this solution to work.
You could do this with pure JavaScript but the function would not be quite as concise.
Also, you could attach the click handler to whatever element on your web page you like (it does not have to be a custom <input> tag like in the example).

<!--START JUICEBOX EMBED-->
<script src="jquery-1.11.1.min.js"></script>
<script src="jbcore/juicebox.js"></script>
<script>
    new juicebox({
        containerId: 'juicebox-container',
        galleryWidth: '600px',
        galleryHeight: '400px'
    });
    $(document).ready(function() {
        $('#toggle-thumbnails').click(function() {
              $('.jb-classifier-thumb-area').toggle();
        });
    });
</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->
<div>
    <input id="toggle-thumbnails" type="button" value="Toggle Thumbnails" />
</div>

3,690

(6 replies, posted in Juicebox-Pro Support)

I'd like to know if you know the back button displayed on iphone / android?

Yes.
By default, Juicebox will display the gallery in Small Screen Mode on mobile devices and you can have the Back Button displayed in Small Screen Mode by setting showSmallBackButton="TRUE".
Please note that in Small Screen Mode, the Back Button will be displayed only on the main image pages (and not on the thumbnail pages).
Alternatively, you could force the gallery to be displayed in Large Screen Mode on all devices and in all browsers by setting screenMode="LARGE".
For more information about Screen Modes, please see here.

I can custom in your script?

Yes.
You can run custom JavaScript code on clicking the Back Button using configuration options such as the following:

<!--START JUICEBOX EMBED-->
<script src="jbcore/juicebox.js"></script>
<script>
new juicebox({
    containerId: 'juicebox-container',
    backButtonPosition: 'TOP',
    backButtonUrl: 'javascript: alert("Back Button clicked.");',
    backButtonUseIcon: 'TRUE'
});
</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->

This Adobe Lightroom forum thread may help: https://forums.adobe.com/thread/1270848
The original poster uses a Dell U2713 monitor but the problem seems to be similar to yours.

3,692

(12 replies, posted in Juicebox-Pro Support)

The code presented in the Embed Code window is generated internally by JuiceboxBuilder-Pro and has nothing to do with the 'template/index.html' file. The 'template/index.html' file is used only to generate the output 'index.html' file (in the gallery folder). There is nothing you can do to change the code which appears in the Embed Code window.

You can modify the 'template/index.html' file, though, and any changes you make to this file will be reflected in the gallery's own 'index.html' file once you save the gallery.

On Mac, it looks like the 'template/index.html' can be found here: /Applications/JuiceboxBuilder-Pro.app/Contents/Resources/template/index.html (although I do not have a Mac to check this path)
On PC, it can be found here: C:\Program Files (x86)\JuiceboxBuilder-Pro\template\index.html

I hope this helps to clarify things.

As Squarespace is not a regular web host (which gives you FTP access to regular web space), you can embed a Juicebox gallery in a Squarespace web page by following the Embedding in a Web Template Site instructions.

When it comes to inserting the <iframe> code into your Squarespace web page, this Squarespace article should help.

3,694

(2 replies, posted in Juicebox-Lite Support)

It looks like something may have interrupted the upload of the images to your web server.
If you take a look at the first image in your gallery in isolation (outside the gallery), you will see that it is incomplete:
http://www.obpools.com/Pool_Landscape_P … ntYard.jpg

Try re-uploading the images to your web server. This should solve your problem.

3,695

(12 replies, posted in Juicebox-Pro Support)

As far as I am aware, the code used to populate the Embed Code window on the Publish tab of JuiceboxBuilder-Pro is not generated from any code within the 'template/index.html' file. This seems to have always been the case (at least since v1.3.3 on Windows).
However, any modifications you make to the 'template/index.html' file will be included in the gallery's output 'index.html' file.

It looks like your navigation bar may have a position assigned to it via CSS. There is currently a known bug whereby elements which have explicitly been assigned a CSS position are not covered by the fullscreen gallery (they should be). This bug should hopefully be fixed in a future version of Juicebox. In the meantime, please try one of the two following suggestions:

(1) Set useFullscreenExpand="TRUE" (in JuiceboxBuilder-Pro's 'Customize -> Lite' section).
... or:
(2) Set expandInNewPage="TRUE" in (in JuiceboxBuilder-Pro's 'Customize -> General' section). When the gallery is expanded, it will be displayed on a page of its own rather than on top of the embedding page.

Hopefully one (or both) of these suggestions will be a suitable solution to your problem until the bug is fixed.

3,697

(1 replies, posted in Juicebox-Pro Support)

When JuiceboxBuilder-Pro processes an image (whether to resize it or add a watermark), the new image will always be a .jpg (as you have discovered).

I would expect that the builder should keep the image type.

If you would like to suggest this for a future version of JuiceboxBuilder-Pro, then please post in the Feature Requests forum thread. This keeps all the suggestions together and ensures that they are not overlooked. Thank you.

If you want .png images in your output 'images' folder, you can deselect the 'Resize Images' checkbox (on the 'Images' tab) and your original .png files will be copied across to the gallery folder without being processed.

Please note that there is currently a known bug (which should hopefully be fixed in a future version) whereby a .png file being copied will end up in the 'images' folder with a .jpg file extension. However, the corresponding 'imageURL' entry in the 'config.xml' file matches and the images should be displayed OK in the gallery.

3,698

(2 replies, posted in Juicebox-Pro Support)

The double ;; is not really a problem (although I have notified the developers and the extra ; characters should hopefully be removed in the next version of Juicebox). The ; character is used to separate CSS rules and, although there is nothing between the two ; characters, the code is still technically valid and will not cause any problems.

The most likely reasons for seeing a blank page on a mobile device are either:
(1) JavaScript is disabled in the browser.
... or:
(2) The gallery is being displayed over a 3G connection rather than wi-fi.

Please check that JavaScript is enabled and if 3G is being used, please see this FAQ which has a solution to the problem.
Why can't I view my gallery on a 3G mobile connection?

(not tested on a Windows PC)

Your gallery displays and functions fine on a Windows PC.

3,699

(3 replies, posted in Juicebox-Lite Support)

It looks like you are using the 'View on the web' link as the 'src' of your iframe.
It also looks like you have not yet made your gallery folder public.

With Google Drive installed to your computer and your gallery folder copied to the Google Drive folder on your computer, you can make your gallery folder public by following steps 6, 7 and 8 in the instructions.

Once the gallery is public, when you go on to steps 9 and 10, you should see a 'Preview' button to the right of the two zoom magnifying glass icons which allows you to complete step 11 and find the URL that you need to use as the 'src' of your iframe.

3,700

(3 replies, posted in Juicebox-Pro Support)

Is there not some clever workaround?

It might be possible to change the size of the hit areas using CSS but it I expect it would not be as easy as it might seem at first glance. I have tried to reduce the size of the hit areas by modifying the height and width of the .jb-navigation .jbn-nav-touch-area contatiners and then applying suitable margin values to compensate for the new dimensions but this has the unwanted knock-on effect of shifting the navigation arrows from their correct positions.
Also, Juicebox takes into consideration other factors such as the position of the caption area (whether or not it is displayed on the image overlay) and whether or not there are links in the image titles or captions (which requires that the caption area is stacked on top of the hit areas, effectively reducing their size).
Juicebox was not designed to allow the hit areas to be resized or moved and there seems to be no quick and easy solution to do so manually.

If you were to set imageClickMode="NONE", you could perhaps set showNavButtons="TRUE" (in JuiceboxBuilder-Pro's 'Customize -> Button Bar' section) to add 'previous' and 'next' navigation buttons to the Button Bar.
This gives users a further method to navigate between images (and the function of the left and right arrows should be fairly self-explanatory).