This question is answered. Helpful answers available: 1. Correct answers available: 1.


Permlink Replies: 27 - Pages: 2 [ Previous | 1 2 ] - Last Post: 04-Aug-2018 15:00 Last Post By: AndreWolff Threads: [ Previous | Next ]
AndreWolff

Posts: 1,872
Registered: 14-Dec-2007
Re: FancyBox: Initial Comments
Posted: 28-Jul-2018 08:56   in response to: jGromit in response to: jGromit
 
  Click to reply to this thread Reply
Years ago I asked already to add a graphical user interface for these effects, but it is never implemented.

Most users are not aware that this is possible due to a lack of an understandable UI.
jGromit

Posts: 7,741
Registered: 31-Jan-2006
Re: FancyBox: Initial Comments
Posted: 28-Jul-2018 09:14   in response to: AndreWolff in response to: AndreWolff
 
  Click to reply to this thread Reply
AndreWolff wrote:
Years ago I asked already to add a graphical user interface for these effects, but it is never implemented.

Most users are not aware that this is possible due to a lack of an understandable UI.


Using these kinds of filters is now considered obsolete, because they require reprocessing of all the images even if you just want to make a simple background color change. It's usually much easier to use CSS, instead. However, some older expanders, like Highslide JS, make it almost impossible to use CSS for things like this. I don't know how Fancybox handles it.

And a lot of the other effects that are possible with XBorderFilter, like elaborate frames, have pretty much fallen out of favor - they look like designs from 20 years ago.
AndreWolff

Posts: 1,872
Registered: 14-Dec-2007
Re: FancyBox: Initial Comments
Posted: 28-Jul-2018 09:25   in response to: jGromit in response to: jGromit
 
  Click to reply to this thread Reply
jGromit wrote:
Using these kinds of filters is now considered obsolete, because they require reprocessing of all the images even if you just want to make a simple background color change. It's usually much easier to use CSS, instead. However, some older expanders, like Highslide JS, make it almost impossible to use CSS for things like this. I don't know how Fancybox handles it.
If the skin is not completely coded by the skin developer, but instead external libraries are used like Highslide JS, fancyBox, Justified Gallery and PhotoSwipe, it is difficult to use CSS for these effects,. In that case these kinds of filters would be a solution, but without a good graphical user interface, it will seldom be used.
wspollack

Posts: 17
Registered: 10-Mar-2004
Back to PhotoSwipe: Load and Videos
Posted: 28-Jul-2018 17:53   in response to: wspollack in response to: wspollack
 
  Click to reply to this thread Reply
André:

When I was talking about 5-second load times, that was for the full page of c. 170 thumbnails. Very quick for what I pay for a hosting service, very consistent using different browsers and clearing each browser's cache, and better than the typical FancyBox full-thumbnail load.

Loading of individual slides takes a second or two, with all skins. No problems there.

I took another look at your sample gallery, at the embedded Vimeo. That's what I'm looking for. I'll play around with the settings, and see if I can get it to work for me.

Thank you very much, again, for your time and patience.
AndreWolff

Posts: 1,872
Registered: 14-Dec-2007
Re: Back to PhotoSwipe: Load and Videos
Posted: 28-Jul-2018 18:57   in response to: wspollack in response to: wspollack
 
  Click to reply to this thread Reply
wspollack wrote:
When I was talking about 5-second load times, that was for the full page of c. 170 thumbnails. Very quick for what I pay for a hosting service, very consistent using different browsers and clearing each browser's cache, and better than the typical FancyBox full-thumbnail load.
But did you select in the PhotoSwipe album also the Justified Gallery?
Then it is difficult to understand for me, because both skins use the same code to display the thumbnails.
But if you did not select the Jusified Gallery in PhotoSwipe, I can understand that the loading time is better. In that case it would make sense to implement another thumbnail display method.

In the next FancyBox version the Justified Gallery is an option, see this fixed-shape thumbnails album

BTW the videos in your PhotoSwipe album do not play, because you did not set check-mark 'Replace web location slide image by the web site' I think.'

Edited by: AndreWolff on 29-Jul-2018 19:47
wspollack

Posts: 17
Registered: 10-Mar-2004
Re: Back to PhotoSwipe: Load and Videos
Posted: 30-Jul-2018 16:51   in response to: AndreWolff in response to: AndreWolff
 
  Click to reply to this thread Reply
André, there were two issues here, regarding the Vimeo embedded videos not showing up:

1) Yes, I needed to set the option PhotoSwipe --> Slide page --> Options --> Replace web location slide image by the web site.

2) In the Explore --> More --> Edit --> Target URL field for the videos, I had the incorrect information.

I had URLs of the actual videos in that field, e.g.:

https://vimeo.com/278170967

What I needed to put in that field, instead, was, e.g.:

https://player.vimeo.com/video/278170967

When you go to your Vimeo account, by the way, and ask it to generate embed code for you, what you get is this:

<iframe src="https://player.vimeo.com/video/278170967" width="640" height="360" frameborder="0" allowfullscreen></iframe>

You can't actually put that in jAlbum's Target URL field, so I just used the URL part of that information. It now works fine, just like the Vimeo in your sample gallery.

By the way, when I was updating those slides (Explore --> More --> Edit --> Target URL), when I clicked the "Update" button (after entering https://player.vimeo.com/video/... for each video in the gallery), the new URLs were properly changed, but jAlbum returned an error message. I had to "OK" the error message dialog, but, as I say, the "Target URL" fields were all updated anyway. And the generated gallery works. I've attached a screenshot of one of those error messages.

3) Other things:

A) I use the variable number, but fixed-size, thumbnails. That is, instead of ...

PhotoSwipe --> Index page --> Thumbnails --> Fixed shape thumbnails --> Variable # thumbnails / row

... I used ...

PhotoSwipe --> Index page --> Thumbnails --> Fixed shape thumbnails --> Justified Gallery

I don't mind having cut-off thumbnails. Also, this allows me to have the larger area in between thumbnails. Just setting that "variable" option put all the thumbnails right next to each other, which seems to "busy" to me. But that's a personal preference, and also possibly I could change the borders even using the "variable" option. But, as I say, it's fine the way I generated it, I don't feel I need wider thumbnails, etc.

B) I wonder if it would be possible to have more thumbnails per row on a phone, depending on orientation.

That is -- on my iPhone 6, anyway -- in either portrait or landscape mode, there are two rows of thumbnails. On a desktop browser, the thumbnail rows expand or contract, filling the window, as the browser is resized. I'm wondering whether this would be possible on a phone.

For instance, if the gallery were loaded with the phone in landscape mode, it looks as if there would be room for four rows, instead of two. See screenshots.

Thank you again for your help.

Regards,

Bill P.
AndreWolff

Posts: 1,872
Registered: 14-Dec-2007
Re: Back to PhotoSwipe: Load and Videos
Posted: 30-Jul-2018 17:36   in response to: wspollack in response to: wspollack
 
  Click to reply to this thread Reply
Attachment Safari_iPhone.PNG (332.8 KB)
wspollack wrote:
What I needed to put in that field, instead, was, e.g.:

https://player.vimeo.com/video/278170967

When you go to your Vimeo account, by the way, and ask it to generate embed code for you, what you get is this:

<iframe src="https://player.vimeo.com/video/278170967" width="640" height="360" frameborder="0" allowfullscreen></iframe>

Yes that is correct, you have always to fetch the embedded site URL.
By the way, when I was updating those slides (Explore --> More --> Edit --> Target URL), when I clicked the "Update" button (after entering https://player.vimeo.com/video/... for each video in the gallery), the new URLs were properly changed, but jAlbum returned an error message. I had to "OK" the error message dialog, but, as I say, the "Target URL" fields were all updated anyway. And the generated gallery works. I've attached a screenshot of one of those error messages.
Yes you see sometimes strange error messages in jAlbum. I don't know what the cause is, but you can report the problem in the Bugs thread.
B) I wonder if it would be possible to have more thumbnails per row on a phone, depending on orientation.

That is -- on my iPhone 6, anyway -- in either portrait or landscape mode, there are two rows of thumbnails. On a desktop browser, the thumbnail rows expand or contract, filling the window, as the browser is resized. I'm wondering whether this would be possible on a phone.

For instance, if the gallery were loaded with the phone in landscape mode, it looks as if there would be room for four rows, instead of two. See screenshots.

I have never seen that problem in Safari, it looks fine in Safari on my iPhone 5 as you can see in the attached screenshot.
But in Chrome, which I seldom use on my iPhone, I see indeed the same effect. I can't explain it yet, I will investigate it.
I will soon release a new FancyBox version where you can use the same type of thumbnails gallery as you see now i the PhotoSwipe skin.

Regards,

André

Edit:: Chrome problem found, will be repaired in the next version.
Thanks for reporting this problem!

Edited by: AndreWolff on 30-Jul-2018 19:53
wspollack

Posts: 17
Registered: 10-Mar-2004
Re: Back to PhotoSwipe: Load and Videos
Posted: 03-Aug-2018 16:54   in response to: AndreWolff in response to: AndreWolff
 
  Click to reply to this thread Reply
André:

I just installed the 1.8.8 version of PhotoSwipe, and the problem I discussed in my post of 30-Jul-2018 16:51 has been taken care of. Attached is a new screenshot of the landscape thumbnail view in PhotoSwipe -- compare to the screenshot in that earlier post (both on an iPhone6, in Safari, with the 11.4.1 version of iOS).

So that problem is solved -- thank you.

I have one more general observation, and a question.

I also upgraded FancyBox this morning to 1.2.1, and did some more experimentation with that skin.

First, I discovered that checking Settings --> FancyBox --> Index page --> Thumbnails --> Fixed-shape thumbnails resulted in a dramatic change in the initial load time of that page full of thumbnails.

I realize that having that many (almost 200) thumbnails is, in most circumstances, excessive. However, in my case -- occasional family viewing -- it's okay. In any case, the load time of that thumbnail page is 5 or 6 seconds in FancyBox, the same sort of times I'm getting in PhotoSwipe (also with fixed-shape set).

If, however, I UNcheck that box, the initial load time is much longer; I guess all the thumbnails have to be cached or examined first, so the browser can figure out what the page will look like. (This may also be the case with PhotoSwipe -- I haven't tried unchecking the box there.)

This is not a problem for me, because I don't mind fixed-shape thumbnails. This is just an observation I thought I'd point out.

Now, for my question: could you discuss the differences between PhotoSwipe and FancyBox? If I do NOT have 360-degree panoramas or anything strange like that, but just have mostly normal-sized photos and a few embedded videos, is there a reason to choose one skin instead of the other?

Thank you again for your time and effort.

Regards,

Bill P.
AndreWolff

Posts: 1,872
Registered: 14-Dec-2007
Re: Back to PhotoSwipe: Load and Videos
Posted: 03-Aug-2018 18:23   in response to: wspollack in response to: wspollack
 
  Click to reply to this thread Reply
Attachment Vimeo_FB.PNG (39.8 KB)
Attachment Vimeo_PS.PNG (28.1 KB)
wspollack wrote:
So that problem is solved -- thank you.
You are welcome!
First, I discovered that checking Settings --> FancyBox --> Index page --> Thumbnails --> Fixed-shape thumbnails resulted in a dramatic change in the initial load time of that page full of thumbnails.

I realize that having that many (almost 200) thumbnails is, in most circumstances, excessive. However, in my case -- occasional family viewing -- it's okay. In any case, the load time of that thumbnail page is 5 or 6 seconds in FancyBox, the same sort of times I'm getting in PhotoSwipe (also with fixed-shape set).

If, however, I UNcheck that box, the initial load time is much longer; I guess all the thumbnails have to be cached or examined first, so the browser can figure out what the page will look like. (This may also be the case with PhotoSwipe -- I haven't tried unchecking the box there.)

The Justfied Gallery library does a lot of calculations to get the thumbnails distributed over the row so that all rows, except the last one, do get the same length. That calculation if of course easier and faster if all thumbnails do heave the same dimensions.

But apparently you did not yet unchecked Settings --> FancyBox --> Index page --> Thumbnails → Use Justified Gallery
This is the biggest change with respect to the previous version. If you clear that check-mark, you will get the fastest loading time I think. That loading time should be independent of the contents of the Fixed shape check-mark.
Now, for my question: could you discuss the differences between PhotoSwipe and FancyBox? If I do NOT have 360-degree panoramas or anything strange like that, but just have mostly normal-sized photos and a few embedded videos, is there a reason to choose one skin instead of the other?
There is not much difference between the two skins.
The developer of the PhotoSwipe library has not much time for maintenance, while the fancyBox is actively maintained and the interface to the FancyBox library is also easier. So I think the future will bring more new features for FancyBox and less for PhotoSwipe.
If you compare this PhotoSwipe Vimeo example with the FancyBox Vimeo example you see that PhotoSwipe has some overlapping buttons, see also the attached screendumps.

Regards,

André

Edited by: AndreWolff on 03-Aug-2018 19:14

wspollack

Posts: 17
Registered: 10-Mar-2004
Re: Back to PhotoSwipe: Load and Videos
Posted: 03-Aug-2018 20:23   in response to: AndreWolff in response to: AndreWolff
 
  Click to reply to this thread Reply
André:

Thanks for the explanation, of the differences between the two skins.

I have now re-generated and uploaded the FancyBox version, with Use Justified Gallery UNchecked.

I also checked out the FancyBox initial thumbnail load time using some desktop browsers that I almost never use, and the time is about 6 seconds for each browser, for the 170-something thumbnails. I think that some of my really long load times represented temporary slowdowns with my hosting service (as I only pay for a shared-PC type of service).

And I now also get an increase, on my iPhone, of the number of thumbnail rows when I turn it to landscape mode. (It goes from 1 row in portrait, to 3 in landscape. In PhotoSwipe, the change is from 2 to 4.)

And you're right, the embedded Vimeo videos look better-framed in FancyBox, vs. PhotoSwipe. That's something that I had noticed, too. So, based on how well FancyBox works, and your discussion that it will be better supported in the future, I've also uploaded the gallery as my "production" copy of the gallery (i.e., under another URL).

One Last Issue?:

Okay, there may be just one more issue remaining. As I do with my hand-written HTML pages, and the galleries that I have generated with jAlbum and other software, I checked http://www.billanddot.com/Atlantis-FancyBox/ using the W3C validation pages, https://validator.w3.org/ and https://jigsaw.w3.org/css-validator/ .

I received some errors using both errors. You can check my gallery, or use your own https://andrewolff.jalbum.net/TestVideos_FB1/ -- the errors are the same. The CSS check often shows a lot of warnings, but it, too also shows real errors.

By contrast, my earlier experiment with the Saturn skin -- http://www.billanddot.com/Saturn-Test/ -- shows no errors (and only a warning in the HTML validator).

To help ensure that my galleries encounter the fewest problems in the various browsers, I prefer that they pass the HTML and CSS validation tests.

Are you familiar with these validators, or maybe just not used them lately?

Once again, thank you for your time and help. We're getting there ...

Regards,

Bill P.
AndreWolff

Posts: 1,872
Registered: 14-Dec-2007
Re: Back to PhotoSwipe: Load and Videos
Posted: 03-Aug-2018 20:58   in response to: wspollack in response to: wspollack
 
  Click to reply to this thread Reply
Yes Bill, I know the validators, but I have not yet used these with the FancyBox skin, but I will test it soon.
Thanks for reminding me about that.
If you have other proposals for improvements or new features, don’t hesitate to report that here!

Regards,

André

Edit:

I did remove all errors detected by the html validator, but it is impossible for me to remove the errors indicated by the css validator, because that is developed by by others. And from my earlier experience with the css validator, I know you should not take that very seriously.

BTW if you check a real Neptune album like this https://jgromit.com/neptune/standard/index.html you see the same errors in the css validator.

Edited by: AndreWolff on 04-Aug-2018 09:45
wspollack

Posts: 17
Registered: 10-Mar-2004
FancyBox Validation
Posted: 04-Aug-2018 14:27   in response to: AndreWolff in response to: AndreWolff
 
  Click to reply to this thread Reply
André,

Thanks for the clarification.

I'm still a little puzzled, however. If I check https://andrewolff.jalbum.net/TestVideos_FB1/ at https://validator.w3.org/ , it gets no errors or warnings.

If I check http://www.billanddot.com/Atlantis-FancyBox/ , I get one error (and a couple of warnings):

Error: Duplicate ID mapnavigation.
From line 1293, column 5; to line 1293, column 28
Div">↩


Am I doing something wrong when I generate the gallery?

Thank you yet again.

Regards,

Bill
AndreWolff

Posts: 1,872
Registered: 14-Dec-2007
Re: FancyBox Validation
Posted: 04-Aug-2018 15:00   in response to: wspollack in response to: wspollack
 
  Click to reply to this thread Reply
wspollack wrote:
If I check http://www.billanddot.com/Atlantis-FancyBox/ , I get one error (and a couple of warnings):

Error: Duplicate ID mapnavigation.
From line 1293, column 5; to line 1293, column 28
Div">↩


Am I doing something wrong when I generate the gallery?


No Bill, I did correct this in a new version, which is not yet released.

As soon as this new version is released and you have updated your version, you should remake your album, whereafter the problem is solved.
But I am not yet releasing the new version for just this simple change, you have to wait a week or two, unless you find a real problem!

Regards

André
Legend
Forum admins
Helpful Answer
Correct Answer

Point your RSS reader here for a feed of the latest messages in all forums