Photo display issue in List after Github update

sunnyjey

Active Member
I just updated Fabrik files from GitHub. Now facing issue of displaying photos in the List. I checked in bootstrap and custom list template but same problem.

Few photos are not rendering, instead it displaces the title text. It looks due to recent change in library of Fileupload to SLICK, all images are displayed in Slideshow Mode, even if you have just single image. The YES / Slideshow option doesn't work any more.

The show media in list or Slideshow.

Screenshot 2020-02-26 at 8.07.39 PM.png
There is no custom option for Slick in fileupload element similar to what available in Visualisation mode.

If possible please someone confirm this issue.
 
Just did a couple test uploads with a fresh Github install on PHP 7.3.15, but can't reproduce.

I just updated Fabrik files from GitHub.
What files? Remember, you must not cherrypick but always do a complete update routine as per Wiki.

What's your PHP version?
Any errors anywhere (Joomla error reporting, PHP error log, console)?
Same in backend?

it displaces the title text.
What, the "alt" text? Are the image files on the server where they belong?

It looks due to recent change in library of Fileupload to SLICK
What tells you this?

all images are displayed in Slideshow Mode, even if you have just single image. The YES / Slideshow option doesn't work any more.
Working fine here.

The show media in list or Slideshow.
?
 
Last edited:
Thank you for taking time and doing testing for me. I spent almost 2 hours trying all different setting ( Ajax / Non Ajax / Amazon / Local storage / Bootstrap template / Custom List template / Uploading new files / Deleted cache / Checked in multiple browsers), I came to conclusion, there is definitely some issue with New SLICK-based fileUpload.

Can you please do it one more small test for me ?

Upload multiple photos in one row and just single Photo on another row of SAME LIST. Then set your 'Show media in list' option to YES in fileUpload Element; Create ThumbNail to YES, and then look LIST (not detail page) for the photos, all photos will disappear as image source will reset to "".

Then you change it to the 'Slideshow' setting. You will see all images will re-appear in LIST VIEW with messed up MULTIPLE images alignment.

Note: Latest J!, Latest F!, PHP 7.3, No error in J! console.
 
Last edited:
What do you mean: "multiple photos in one Form and just single Photo on another Form of SAME LIST"? I'm using the same form to create multiple records. Why, do you use different forms? Even if, shouldn't matter if set up correctly.

Anyway, just did as you described: created two records, one with multiple, one with single image. Switching through all "Show media in list" options, but no problem at all, each does what it's supposed to do, no issues as you described... actually, no issues at all.

Then you didn't answer all my questions.
- What files? Remember, you must not cherrypick but always do a complete update routine as per Wiki.
- Any errors anywhere (Joomla error reporting, PHP error log, console)? [You just mentioned "J! console"... I'm not even sure what that is...]
- Same in backend?
- What, the "alt" text? Are the image files on the server where they belong?
- What tells you this?
 
@cheesegrits

Thank you for making changes in Slick FileUpload (not sure whether it is related to LIST view fix).

In case if it was, I would like to inform you that I have updated my Testing site with last Github commits. Created new List with just one Fileupload Element and uploaded couple of images through Ajax Mode. It looks there is still issue of displaying multiple images in LIST view. Please have a look.

Thank you in Advance.

(Note: I had contacted to Robbie twice for custom paid work through email & quote form, but still waiting to be added in Paid work system).
 
Last edited:
Just to prove my claim and to confirm the bug introduced in Slick FileUpload Library in GitHUB mentioned in this thread, I spent another valuable 3-4 hours and created plain vanilla Joomla website with just Fabrik as installed component.

https://fabrik.jdevcloud.com/

I have shared Administrator Backend to @troester and @juuser in PM. Please confirm this issue and inform to @cheesegrits

One more thing, I just noticed new Zoom option as per this Github commit :
https://github.com/Fabrik/fabrik/commit/3cdf9c6fd018a7f8e5c6b1a8c9e88f5ca1cabecc

But, I couldnt find any option in backend of FileUpload to enable or disable Zoom.

Once again requesting Hugh to have a re-look on Slick Library.

Thank you and regards...
 
Last edited:
Ok, I did some testing.
Slideshow in list is working on my site (and on your site, too).
Setting "Show in list"= Yes (i.e. no slideshow) is working, too (two different ajax fileupload element). It's also working if both are set to "show in list"=slideshow .

All (list slideshow) is done in the layout file
plugins\fabrik_element\fileupload\layouts\fabrik-element-fileupload-slick-carousel.php

In this layout file
  • It's always taking the thumbs, no matter if create thumnails is set or not..
  • It's taking the "Resize" width and height to display the slideshow in list view.
  • It's setting several slick options
So override this file and adapt it as you need.

To get the slideshow with the layout file as it is
  • you must enable thumbs (BTW: you can't just turn thumbs on if you have existing records, you must re-upload your image so the thumbs are created; I have created a new record in your "with thumbs" list, slideshow in list is ok)
  • you must set resize width and height
And yes, this has to be documented.
 
Last edited:
It's always taking the thumbs, no matter if create thumbnails is set or not..
Yes. You are right.

I too discovered after going through codes. In my case I have almost 2000 records with multiple images in one list with disabled Thumbnail option. The only solution left for me is to manually create thumbnails of all images and put into the respective folders.

All (list slideshow) is done in the layout file
plugins\fabrik_element\fileupload\layouts\fabrik-element-fileupload-slick-carousel.php

This is new for me. It is going to be boon for all of us having several inbuilt Slick options to the fileUpload Element. Tons of thanks to Hugh.

And yes, this has to be documented.

I will try to update WIKI for others after testing on my site.

Big thank you to you for solving this issue.
 
The only solution left for me is to manually create thumbnails of all images and put into the respective folders.
I didn't test but I think it's enough to set just the thumbnail directory to the same as the upload dir. If thumbnail is set to no it won't hurt on new uploads because nothing is done in this case.

If you are switching thumbnails on for a list with existing records you can copy all upload images to the thumbnail folder (so no thumbs but at least existing files which can be displayed with some CSS).
 
Last edited:
...and, of course, there are many free apps allowing batch-resizing of the full-size images on your local computer. :)
 
Finally, with your help and suggestions, I pushed GitHub to my LIVE server.

Is it possible to override the fileupload for specific fabrik template ?

As per Wiki,
http://fabrikar.com/forums/index.php?wiki/jlayouts/

/components/com_fabrik/views/form/tmpl/<yourtemplate>/layouts/element/table___my_fileupload_element_name

AND

/templates/{my-current-joomla-template}/html/layouts/com_fabrik/element/table___my_fileupload_element_name


I tried both above, but Fabrik is not picking override for fileupload from custom layout.

Any suggestion ?
 
Last edited:
We are in need of some funding.
More details.

Thank you.

Members online

Back
Top