1 Reply by xxdohxx

(17 replies, posted in Juicebox-Pro Support)

Steven wrote:

Edit:
On further investigation, it looks like the Juicebox-Pro API method getImageInfo() returns the thumbURL successfully (but not the imageURL) so you should be able to extract the Flickr photoId from the thumbURL as follows. This avoids the need for any delay at all.

jb.onImageChange = function(e) {

    // Get image info for current image
    var info = jb.getImageInfo(e.id);

    // Get thumbURL for current image
    var src = info.thumbURL;

    // Extract Flickr photoId from thumbURL
    var id = src.substring(src.lastIndexOf('/') + 1, src.indexOf('_'));

    // Fetch tags of currently-displayed image using Flickr API flickr.tags.getListPhoto method
    // Enter your own Flickr API Key in the line below
    $.getJSON('https://api.flickr.com/services/rest/?method=flickr.tags.getListPhoto&api_key={your_flickr_api_key}&photo_id=' + id + '&format=json&jsoncallback=?', function(json) {

        // Initialize tags array
        var tags = [];

        // Iterate over all tags
        $.each(json.photo.tags.tag, function(i, data) {

            // Add new tag to array
            tags.push(data.raw);

        });

        // Display tags array in output container
        $("#output").html('<p>Tags: ' + (tags.length > 0 ? tags : 'None') + '</p>');

    }).fail(function() {

        // Fail message
        $("#output").html('<p>Cannot find tags.</p>');

    });
};

I have logged a bug report with the developers regarding the inability to fetch the imageURL from the getImageInfo() method when using Flickr as a source of images.

Steven,

This works beautifully and is ultimately the best solution for me.  I am glad you were able to help me find it.

Just so you know, you alone have been worth double or triple the price of JuiceBox :)

Thanks,
John

Go to forum: Juicebox-Pro Support

2 Reply by xxdohxx

(17 replies, posted in Juicebox-Pro Support)

Steven,

Thanks for sharing.  Just a quick follow-up question.  Like we discussed, every now and then it would not load the tags.  This is clearly because the image has not been fully loaded into the DOM and the tags fails.  I am able to solve this by setting a delay on loading the tags, but unfortunately this causes clunky-ness on the page even on the images that don't need the extra loading.

Is it not possible to determine if the image is fully loaded yet?

Thanks,
John

Go to forum: Juicebox-Pro Support

3 Reply by xxdohxx

(17 replies, posted in Juicebox-Pro Support)

xxdohxx wrote:

Steven,

It seems that setting the delay at 200ms gets the trick done.  Works like a charm.

My last and final battle which, may or may not be possible, is to allow for zooming in on the image with a pinch gesture.  From the forums, it seems like Juicebox does not support this.  Do you know of any workarounds?

Thanks,
John

Just replying to myself here to show others how I was able to solve this.  We are viewing the site on Google Chrome on a Inspiron 24 3000 Series All-in-One touchscreen computer.  It turns out that I can zoom in naturally with pinch gesture on Google Chrome on this computer, but the Juicebox was blocking it.  A simple solution was to add the following code to the body of my html page:

<div id="zoomDiv" style="position:absolute; top:50%; left: 50%; margin:-200px 0 0 -200px; width:400px; height:400px; background:transparent; z-index:90000;"></div>

This puts an invisible box in the middle of the screen (where the gallery center is) which allows pinch to zoom in that section only.  This should be intuitive for our users and does not interfere with the swiping function of the gallery.

I hope this may be helpful to someone in the future.

Go to forum: Juicebox-Pro Support

4 Reply by xxdohxx

(17 replies, posted in Juicebox-Pro Support)

Steven,

It seems that setting the delay at 200ms gets the trick done.  Works like a charm.

My last and final battle which, may or may not be possible, is to allow for zooming in on the image with a pinch gesture.  From the forums, it seems like Juicebox does not support this.  Do you know of any workarounds?

Thanks,
John

Go to forum: Juicebox-Pro Support

5 Reply by xxdohxx

(17 replies, posted in Juicebox-Pro Support)

Steven, just wanted to update you.  It turns out that the image overlay was the culprit (or at least I think so) because after using that option, I no longer have the issue with the swiping.

Also, for those that may see this, I ended up using http://oauth.io to help simplify the process of the flickr authenticated calls.

I haven't yet implemented the delay, but I think you are right and the solution should work.

Many thanks again,
John

Go to forum: Juicebox-Pro Support

6 Reply by xxdohxx

(17 replies, posted in Juicebox-Pro Support)

Steven,  I'll try hiding the image overlay and see if that helps the issue and will report back.  I'll also give the short delay a try and see if I can repeat the problem.  That particular problem seems to only happen when I first open the page.  If I just refresh, it works as intended, so you may be on to something.

Thanks for the links for the oAuth.  I have a friend who has some experience with it, as it turns out, so I will see if he can get me on the right track.  The links incidentally were already purple for me, but I think I'm just missing something in my attempt at it.

Thanks again for all the help!

Go to forum: Juicebox-Pro Support

7 Reply by xxdohxx

(17 replies, posted in Juicebox-Pro Support)

Steven, my project is going very well in fact.  It's transformed fairly quickly.

I've run into a few things, some of which aren't necessarily Juicebox, but one derives from what we've discussed here.  I have a few questions for you if you don't mind weighing in.

First, just a note. I ran into some issues with getting the pop-up keyboard to work in Chrome even when running it as  Windows 8 app.  I remedied it with this extension (in case others run into this issue) https://chrome.google.com/webstore/deta … ninn?hl=en.  It works well.

Second, you are right that it seems that with the touchscreen it is allowing the touch gestures (swipe transition).  However, I am running into a peculiar issue.  Every now and then it will not let me swipe on a picture.  I can't seem to figure out what causes it either.  I was wondering if you had any advice on how to debug this?

Next, getting the tags of the photos worked great and is working out how I intended.  However, whenever I first load the page, for whatever reason, they are not getting loaded.  I am not sure if 

jb.onImageChange

gets loaded on the first load of the gallery?   If I change the photo and then go back to the first photo, it will load the tags just fine.  To add to this, it seems like when this happens the description from Flickr also does not load--only the title of the photo.

On another un-related to Juicebox note, do you have any experience in generating the auth_token and api_sig for Flickr's api with their oAuth in javascript? I am using their api for flickr.tags.getListUserRaw which works great IF I copy directly from their api explorer but it seems the 

auth_token

and 

api_sig

expire after some time and will need to be re-generated.  I haven't been succesful in figuring this out just yet.  Just curious if you had used it before.

Thanks again for all the advice and help.  If it wasn't for you, I wouldn't be able to get this project off the ground.

Go to forum: Juicebox-Pro Support

8 Reply by xxdohxx

(17 replies, posted in Juicebox-Pro Support)

Okay, sounds good Steven.  Thanks again for the responses.  I'm going to look into hardware now that I have the implementation setup how I want it and will try and see if I can't try it out before I purchase.

Thanks,
John

Go to forum: Juicebox-Pro Support

9 Reply by xxdohxx

(17 replies, posted in Juicebox-Pro Support)

Steven,

First off, I want to say I am impressed with the speed at which you've responded to my inquiries.  I am really appreciative of it.

Second off, glad you clarified the hard-coding in case anyone comes into this thread in the future looking for answers.

The F11 solution does work fairly well for me so far and is producing results as expected.

Last night, I began a solution to get the tags using the Flickr API and some javascript and it looks like we were on the same track.  Your knowledge of the Juicebox construction makes it a lot more efficient than what I was doing, so I thank you for the input and will be adjusting.

Since I seem to have your attention, would you mind giving advice on another question?

My ultimate goal for this project is for it to be used in a "kiosk" like way with a large (perhaps 20-27" wide) touchscreen monitor.  I see under http://juicebox.net/tour/gallery/#input-modes that it automatically switches the input mode based on the device, but I am wondering how I would go about using a larger touchscreen device and forcing the correct input mode?  If I need to clarify at all, please let me know.  Also know that I have not yet located what hardware I will be using (and I am open to your input) on that as well.  Price point is not really an object here.  We want the smoothest operation as possible.

Also, something to note, is that since I allow users to dynamically search tags, we would need an on-screen keyboard or something popup whenever the field is clicked.  It seems like essentially what I want is a very large android or iOS touchscreen.

You've been very helpful, and I am incredibly impressed with the ease it's been so far to get my project going.  Defintiely worth the money I've spent already.

Thanks!
John

Go to forum: Juicebox-Pro Support

10 Topic by xxdohxx

(17 replies, posted in Juicebox-Pro Support)

EDIT4: Newest question: anyone see a feasible way to show tags of the current image grabbed from Flickr?  I know the Flickr API can grab tags if you give it a photoID, but I'm not sure how to get to that point and integrate it.  As of now, a simple workaround I am thinking of is simply displaying the flickr photo's description and having all of the tags that are in it in the description as well as tagged.

EDIT3: I found a workaround--don't maximize and only use F11 on the keyboard in the browser for maximizing. This works well enough.

EDIT2: Secondary question:  is it possible to allow a "maximize" but still have a header? Thanks


EDIT: Solved.  I was copying the code but it wasn't working for me.  I had to change the location of my juicebox.js... woops.

Thanks,
John

I'd like to re-create essentially what is seen in the demos here: http://www.juicebox.net/demos/lite/flickr/

However, I would like to keep it limited to a single username and only allow the user to change the tags.  This will eventually be accompanied with some buttons that will input pre-selected tags, but for now, it would be exactly as in the demo.  I have juicebox Pro and I know I can use the gallery builder to get myself started, but how do I go about creating the gallery to change with a form like in the demo?

The ultimate goal is to have our entire Flickr account searchable by tags.  This will allow customers to look at examples of product at a kiosk like station.

Thanks,
John

Go to forum: Juicebox-Pro Support