I'm glad it worked.
Thank you for letting me know.

Looking at the embedding code on your webpage, I see a couple of problems.

(1) You have two <div id="juicebox-container"> containers. Each and every id should be unique. There should be no duplicates.

(2) The embedding code is inside one of the <div id="juicebox-container"> containers. This is most likely what is causing the error 404. Make sure that your embedding code is outside your <div id="juicebox-container"> container. (Just renaming the id for the first <div id="juicebox-container"> container should be enough to resolve your problem).

Try changing the Juicebox code on your web page from:

      <div id="juicebox-container">
        <!--START JUICEBOX EMBED-->
        <script src="jbcore/juicebox.js"></script>
        <script>
        new juicebox({
        containerId: "juicebox-container",
        galleryWidth: "100%",
        galleryHeight: "100%",
        backgroundColor: "rgba(34,34,34,1)"
        });
        </script>
        <div id="juicebox-container">
        <!-- Image gallery content for non-javascript devices -->
        <noscript>
        <h1>Pellicule</h1>
        <p></p>
        <p><img src="images/pexels-gabriel-frank-16248641.jpg" title="pexels-gabriel-frank-16248641" alt="" /><br>pexels-gabriel-frank-16248641 </p>
        <p><img src="images/pexels-marvin-nast-21038400.jpg" title="pexels-marvin-nast-21038400" alt="" /><br>pexels-marvin-nast-21038400 </p>
        </noscript>
        </div>
        <!--END JUICEBOX EMBED--></div>

... to:

<div id="jb-container">
    <!--START JUICEBOX EMBED-->
    <script src="jbcore/juicebox.js"></script>
    <script>
        new juicebox({
            containerId: "juicebox-container",
            galleryWidth: "100%",
            galleryHeight: "100%",
            backgroundColor: "rgba(34,34,34,1)"
        });
    </script>
    <div id="juicebox-container">
        <!-- Image gallery content for non-javascript devices -->
        <noscript>
            <h1>Pellicule</h1>
            <p></p>
            <p><img src="images/pexels-gabriel-frank-16248641.jpg" title="pexels-gabriel-frank-16248641" alt="" /><br>pexels-gabriel-frank-16248641 </p>
            <p><img src="images/pexels-marvin-nast-21038400.jpg" title="pexels-marvin-nast-21038400" alt="" /><br>pexels-marvin-nast-21038400 </p>
        </noscript>
    </div>
    <!--END JUICEBOX EMBED-->
</div>

All I've done is rename the first instance of <div id="juicebox-container"> to <div id="jb-container">. This ensures that each id is unique and it prevents the embedding code from being inside a container with an id of 'juicebox-container' (which is the name of the Juicebox container as specific by the containerId in the embedding code).

I hope this helps.

You should be able to use Safari and Firefox (with a browser setting change to each) to preview galleries locally.
Alternatively you could set up a local web server environment on your computer (using a program such as MAMP or XAMPP) so that you can preview galleries locally in any web browser (without any browser setting changes).

Please see this forum post for more information.
There is also a condensed version of the information contained within this forum post in this FAQ.

I hope this helps.

4

(3 replies, posted in Juicebox-Pro Support)

I'm glad you've been able to resolve your problem.
Thank you for letting me know. It's most appreciated.

Incidentally, we recently updated the readme.html files inside the Juicebox-Lite and Juicebox-Pro download zip packages to include the following text:

1. If you don't have it already, download and install Adobe AIR . Be sure to use the most recent version with WebKit support. This is currently AIR v33.1.1.744. Here are direct links for Mac and Windows.

This should help direct users to the correct version of AIR.

5

(3 replies, posted in Juicebox-Pro Support)

Thank you for purchasing Juicebox-Pro.
I'm sorry to hear that you are having trouble with JuiceboxBuilder-Pro, though.

It sounds like you might be using the most recent version of AIR (v50.2.4.1).
The solution is to use AIR v33.1.1.744. Harman (the developers of AIR) removed support for WebKit (the embedded browser that JuiceboxBuilder-Pro uses for the live gallery preview on the Customize tab) after AIR v33.1.1.744.

Please see this forum post for further details.

I hope that using AIR v33.1.1.744 resolves your problem.
Please let me know how you get on. Thank you.

Your image was not attached to your post but thanks for trying.
I tried adding a HEIC image (from a different source) to a JuiceboxBuilder-Pro gallery and the following message popped up (as expected).

File 'image1.heic' ignored. Images must be in JPG, PNG or GIF format.

I didn't see the image processing bar like you reported.

I'm not sure exactly what happened but it looks like I might not be able to replicate the problem unless I add the actual files that you tried to add to your gallery.
If you're happy with things the way they are and would rather just move on, then that's absolutely fine but if you are willing to pursue this (to allow me to try to figure out why the image processing bar appears and then stalls), then maybe you could just zip the files that caused you the problem and email them to me (steven@juicebox.net).
Either way is fine. Thanks!

Thank you very much for your reply.
Your troubleshooting certainly seems to have found the cause of your problem.

I'm glad you've found a workaround but JuicboxBuilder-Pro really shouldn't choke on an image. It should either load OK or give a clear message that the image is not compatible (for whatever reason), not show the progress bar and then do nothing afterwards.

Is there any chance you could perhaps email me one of your source images (at steven@juicebox.net) so that I can try to replicate the problem myself?
I might not be able to resolve the problem directly but I could at least log a detailed bug report with the developers for a potential future fix.
Thank you.

P.S.: I also followed your suggestion to download Juicebox lite and give it a try, but no way I was able to open it!

That's weird. The installation and operating instructions for JuiceboxBuilder-Lite and JuiceboxBuilder-Pro are identical (only a few settings within the programs differ) and you should be able to install and run both on the same computer without any problems.
In any case, I'm glad JuiceboxBuilder-Pro is still running fine on your machine and that you now know how you can use your iPhone 11 pics.

That sounds odd.
If neither AIR (the platform on which JuiceboxBuilder-Pro runs) nor JuiceboxBuilder-Pro itself have changed, then I'm really not sure why the functionality of the application should have changed.
An OS upgrade could prevent JuiceboxBuilder-Pro from running (we've seen that before with the need to use Rosetta, for example) but, assuming the application runs OK, then I would expect it to work OK, too.

What exactly happens (or does not happen) when you drag and drop an image onto the drag and drop area on the images panel? Does anything happen at all? Does the image processing progress bar appear? Does the new image appear in the thumbnail grid but not in the gallery itself?

Have you tried adding an image via the 'Browse...' button instead of dragging and dropping? Do you get the same results?

Have you tried adding images from different sources to see if maybe the images themselves are causing a problem?

Could you please also try with JuiceboxBuilder-Lite to see if the same thing happens?
I expect the same thing will happen (JuiceboxBuilder-Lite and JuiceboxBuilder-Pro share a lot of the same code) but it might help to troubleshoot the problem (to see if there is perhaps something wrong with your JuiceboxBuilder-Pro installation).
You can download JuiceboxBuilder-Lite from our download page here.
(JuiceboxBuilder-Lite and JuiceboxBuilder-Pro can both be installed and run on the same computer at the same time.)

Have you tried temporarily turning off any security software that you might have installed in case this is somehow interfering with JuiceboxBuilder-Pro's functionality? In the past, aggressive real-time protection from AVG, Avast and Norton has been known to cause problems. (There are no known problems at present, though.)
(Please turn off any security software at your own risk and make sure that you disconnect from the internet first.)

Finally, please confirm the version numbers of JuicboxBuilder-Pro and AIR that you are currently using. It might help to know which versions you are using. Thank you.

Sorry for all the questions. I'm just trying to figure out what's going on as I don't have access to a Mac running Sonora.
Unfortunately, I don't have a quick fix for this (no-one else has reported this problem and I cannot replicate it myself) but maybe with a little more information, we can work through this.

9

(5 replies, posted in Juicebox-Pro Support)

It would certainly be possible to listen for when the pop-up window is closed and then run some custom JavaScript (see here) but I don't think it's possible to programmatically force fullscreen mode.

As far as I'm aware, going fullscreen (using the Fullscreen API) needs user-interaction. A jQuery click will do the trick (e.g. a user clicking a button) but a jQuery trigger('click') (programatically simulating an actual click) is not enough (and closing a pop-up window is definitely not going to be enough to persuade a browser to go fullscreen in the parent window). I've tried (without success).

10

(3 replies, posted in Juicebox-Pro Support)

Adobe AIR is also the latest version is 50.2.4.1.

That is most likely the issue. The WebKit library (the embedded browser required for JuiceboxBuilder's live gallery preview on the 'Customize' panel) was removed from AIR after v33.1.1.744 (and is not present in v50.2.4.1).

Please uninstall AIR v50.2.4.1 and, instead, use AIR v33.1.1.744. This should hopefully resolve your problem.
AIR v33.1.1.744 can be downloaded from the foot of the AIR download page here: https://airsdk.harman.com/runtime

11

(3 replies, posted in Juicebox-Pro Support)

I've not seen that error before so, unfortunately,  I'm not sure what might be causing it.

The error appears to be due to the use of an older browser which does not support JSON.
However, AIR (up to and including AIR v33.1.1.744) includes the WebKit library (an embedded browser which does support JSON). JuiceboxBuilder-Pro should use this embedded browser (rather than a system browser) to display the gallery on the Customize panel so, as long as you are using AIR v33.1.1.744, all should be well (in theory).

What version of AIR do you currently use?
If you are not using AIR v33.1.1.744, then please see this forum post: https://juicebox.net/forum/viewtopic.ph … 223#p18223

Hopefully this will help.
Otherwise, please let me know and I'll think of some other troubleshooting suggestions.

12

(3 replies, posted in Juicebox-Lite Support)

No worries! I hope they can help you out.

13

(3 replies, posted in Juicebox-Lite Support)

Hello.

We are a software company with a web gallery product named Juicebox-Pro.
From the information that you provided, it sounds like you are referring to a JuiceBox from Enel X, a completely unrelated company to our own (although the product names are similar).
You should be able to contact Enel X directly via their contact page here: https://www.enelxway.com/us/en/contact

I hope this points you in the right direction and that they are able to help you with your query.

I'm glad you've got it working (and happy to hear it was a relatively easy solution).
Thanks for letting me know.

Happy holidays!

What's the actual error message you're getting?

Also, what version of AIR do you currently have installed?

Are you able to uninstall your current version of AIR before installing v33.1.1.744?

I'm not sure if this is still relevant, but according to this web page:

Remove the runtime on a Mac computer

    Double-click the “Adobe AIR Uninstaller”, which is located in the /Applications/Utilities folder.

If you can't uninstall your current version of AIR, maybe you could upgrade AIR first (to v50.2.4.1) in order to uninstall it?
Seems like a roundabout way to do things but if things aren't working at the moment, it might be worth a try.

Both AIR v33.1.1.744 and AIR v50.2.4.1 can be found on Harman's download page here.

Also, are you using Rosetta 2?

Sorry for all the questions but a little more information might help to pinpoint the cause of the problem.

In the meantime, maybe a Sonoma user can chime in with some useful info...

16

(5 replies, posted in Juicebox-Pro Support)

@andy-JB

not sure if it's possible to get anything more complicated than a filename in linkURL...

You could try using JavaScript in a linkURL such as the following. (You'd need to set linkTarget to _self for this to work.)

linkURL="javascript:window.open('https://www.juicebox.net', '_blank', 'width=600,height=400')"
linkTarget="_self"

Alternatively, you could leave the linkURL as a regular absolute or relative URL, override the functionality of the gallery's Open Button (Juicebox's own use of the linkURL) and run some custom JavaScript code when the Open Button is clicked, fetching the linkURL from the gallery's configuration file using the Juicebox-Pro API).

This would give much more freedom over what you could do with your linkURL but it's rather complicated and I'm not sure how (or if) it would work for your scenario. Knowledge of JavaScript would be required and such modifications (overriding regular Juicebox functionality) are not officially supported. However, I hope that it points you in the right direction and gives you some food for thought.

I don't think it's possible to have a pop-up window on top of a fullscreen gallery display, though. The fullscreen display would likely close or the pop-up window would be hidden behind the fullscreen display.

Here's some code which might help to get you started. Please note that it is untested (and officially unsupported). Just leave your linkURLs as regular absolute or relative URLs and use the following as your gallery's 'index.html' page.

<!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>
            body {
                margin: 0px;
            }
        </style>
        <script src="jbcore/juicebox.js"></script>
        <script>
            var jb = new juicebox({
                buttonBarPosition: "TOP",
                containerId: "juicebox-container",
                showOpenButton: "TRUE"
            });
            jb.onInitComplete = function() {
                $('.jb-bb-btn-open-url').empty();
                $('.jb-bb-btn-open-url').off('click');
                $('.jb-bb-btn-open-url').on('click', function() {
                    var index = jb.getImageIndex();
                    var info = jb.getImageInfo(index);
                    var title = info.title;
                    var url = info.linkURL;
                    var win = window.open('', '_blank');
                    win.document.write('<!DOCTYPE html><html lang="en"><head><meta charset="utf-8" /><title>' + title + '</title></head><body><video width="600" height="400" controls><source src="' + url + '" type="video/mp4"></video></body></html>');
                    win.document.close();
                });
            };
        </script>
        <title>Test</title>
    </head>
    <body>
        <div id="juicebox-container"></div>
    </body>
</html>

17

(7 replies, posted in Juicebox-Pro Support)

@Royordan

Hi and welcome to the forum.
If you are experiencing difficulties, please create a new topic and clearly describe the problem you are having and I'll do my best to help you out.
Thank you.

There's no need for you to re-purchase. Check out this FAQ.

If you ever need a new download link (if you lose your purchase email or your link expires), just fill in the Download Link Request Form and we'll send you a new one.

I've found your original purchase in our transaction records and have already sent you a duplicate purchase email which includes a download link (download links always point towards the latest version rather than the version you purchased) so you don't need to fill in the form just now.

Please let me know if I can be of any further assistance.
Thank you!

Online instructions now updated:
Forum: https://juicebox.net/forum/viewtopic.ph … 486#p17486
FAQ: https://www.juicebox.net/support/faq/#local

I'm glad you've got it working.
Thank you for the confirmation that the instructions are correct. I'll update the forum and website ASAP.
Thanks also for the screenshots. I'll link to this thread from the Tricks and Tips thread so that users can find them.

Sorry about that. Thank you for bringing this to my attention.

Try:
(1) Choose Safari > Settings
(2) Click Advanced
(3) Select "Show features for web developers."

There should then be a Developer pane in the settings from which you can select 'Security -> Disable local file restrictions'.

Incidentally, I don't currently have access to a Mac so I'm getting this information directly from Apple's own support pages:
https://support.apple.com/en-gb/guide/s … i20948/mac
https://developer.apple.com/documentati … r-settings

I hope this helps.
Please let me know how you get on.
If this information is correct, please let me know and I'll update our forum post and the corresponding FAQ on our website.
Thank you.

Please see this forum post which explains the problem and offers a workaround. It should hopefully help.
https://juicebox.net/forum/viewtopic.ph … 486#p17486

(1) As you have discovered, there's no built-in functionality for auto-scrolling long gallery titles. You'd need to implement a solution manually using CSS and/or JavaScript (as you have been trying) but, unfortunately, I have no greater insight as to where to start than yourself. Try a web search for "scrolling text css". There are many web pages with instructions and examples which might help. The classes you might need to target are. .jb-area-large-mode-title (for Large Screen Mode) and .jb-idx-ssm-title-wrapper (for Small Screen Mode).

Here's some CSS code (add it to your gallery's embedding page) which might point you in the right direction and get you started. (The code allows for different animations for Large Screen Mode and Small Screen mode. You might need to change the values to suit your own needs.)

<style>

    .jb-area-large-mode-title {
        animation: custom-animation-large 10s linear infinite;
    }

    .jb-idx-ssm-title-wrapper {
        animation: custom-animation-small 10s linear infinite;
    }

    @keyframes custom-animation-large {
        from {
            transform: translateX(100%);
        }
        to {
            transform: translateX(-100%);
        }
    }
        
    @keyframes custom-animation-small {
        from {
            transform: translateX(100%);
        }
        to {
            transform: translateX(-100%);
        }
    }

</style>

(2) In Small Screen Mode, Juicebox automatically fills the gallery with thumbnails according to the thumbnail dimensions and the available space. There's no way to specify the thumbnail grid size for Small Screen Mode, I'm afraid.

I'm sorry that there are no easy solutions to your two queries but I hope you can work with the available options (and perhaps my CSS code above) to create suitable galleries for your website.

24

(1 replies, posted in Juicebox-Lite Support)

No, sorry. As far as I am aware, there are no plans for this.

25

(5 replies, posted in Juicebox-Pro Support)

No, sorry. Juicebox-Pro only displays JPG, GIF and PNG files (as noted i the FAQ below).
FAQ: Will Juicebox load things other than images? - https://www.juicebox.net/support/faq/#misc-1

As you have a Showkase site, you could include videos in your Showkase pages (just not inside your Juicebox galleries).

If you want to host your own videos, then you could upload the video files to your web server and use the HTML 5 <video> tag to embed them in your Showkase web pages.

For example, if you had a MP4 video named 'movie.mp4' and uploaded it to a folder named 'videos' in your root directory, then you would enter code such as the following into the editor on your Showkase page:

<video width="640" height="480" controls>
    <source src="/videos/movie.mp4" type="video/mp4">
</video>

Otherwise, you could upload your video to a video hosting service such as YouTube or Vimeo and paste the <iframe> embedding code that the service provides into the Showkase editor. This is how the Vimeo videos have been embedded in the 'Motion' page of the 'Patrick Surace' Showkase demo site here.

Whether you use the <video> tag code or <iframe> embedding code, be sure to enter the code into the Showkase editor in 'Source' mode. (Just click the 'Source' button on the editor's toolbar.)