Fabrik Visualization - Slideshow [RESOLVED]

[Stevebenson223]

Hi

Joomla 4.3.2
Fabrik 4.0delta
PHP 8.1.18

I've updated a test site from J3/F3 to the above (following all the instructions from @troester) and a previously-working Fabrik visualization slideshow is now not working (just about everything else is working ok). The plugin version I've got installed is 3.10 and there doesn't seem to be a F4 version. I've searched this forum but can't find any reference to it. Maybe I'm the only person wanting to use it? Is there an upgrade planned?

Thanks,
Steve

 

[troester]

I think it was included in Beta with some rudimentary general J!4 adaptions but never tested or used.
So if you want to dig into it...
Do you have a 4.0Beta download?

 

[Stevebenson223]

I don't, I'm afraid. Gamma was the first I tried.

 

[troester]

slideshow-40Beta.zip

Not sure if it's installable or how far it is working.

 

[Stevebenson223]

Thanks, I'll give it a try and let you know.

 

[Stevebenson223]

Unfortunately, I can't get it to work. I've tried tweaking a few settings but all I get on the front end is a never-ending spinner and "slideshow loading".
It might be related to problems with the related file upload element which was first refusing to work and reporting an invalid file type when trying to upload a jpg image. When I entered "jpg,gif,png" for the Allowed File Type, the image was uploaded but the Upload Directory field is not creating the folder correctly: the placeholder to create the folder name is not working.

 

[Stevebenson223]

(I'll leave aside the File Upload element problems and open a separate thread on that if necessary.)
So regarding the slideshow visualization plugin:
It installed with no problems and appears in the list of Extensions as 4.0beta4b.
It solved an issue with the 3.10 version, which was spinning in the backend. Now no spinning in the backend.
The visualization plugin options are all set the same as the J3F3 working version. I tried setting everything to default and deleting the Custom Options as an alternative.
In the relevant Group, I've got {fabrik view=visualization id=1 all_productions___id=[rowid]} in the Outro section, which is where it works in the J3F3 version. (And I've got Fabrik - Content enabled.)
As well as the existing slideshows set up, I tried setting up a new slideshow (adding images using a file upload element)...
But all I get on the front end is a spinner with "slideshow loading".
Debug is switched off.

Any ideas what the spinner might signify a problem with?

Thanks for any assistance.

 

[achartier]

Have you checked your browser debug window for javascript errors? Or for some response to the ajax loading of the visualization in the network tab?

 

[troester]

Hacky solution:
In \media\com_fabrik\js\mootools-core.js line 2935 do

        computePosition: function (a) {
            if (typeof a == 'undefined') return;
            return { left: a.x - (h(this, "margin-left").toInt() || 0), top: a.y - (h(this, "margin-top").toInt() || 0) };
        },

 

[Stevebenson223]

Thanks @troester I'll try that as soon as possible.
Thanks @achartier the Console showed "mootools-core.js:3 Uncaught TypeError: Cannot read properties of undefined (reading 'x')" which is I guess precisely what @troester is referring to.

 

[troester]

Make sure to have "Debug JS" set in Fabrik options.

I assume meanwhile the slideshow could be realized by only using bootstrap's carousel.

 

[Stevebenson223]

That didn't work, I'm afraid.
I copied in the additional line of code and there was no change to the never-ending spinner. When I changed the Allow fabrikDebug option to Debug JS, the spinner only appeared momentarily then disappeared, but still no slideshow.
I have been using the bootstrap template in the viz plugin, but do you mean something else?
When I was editing the mootools-core.js file, there were a lot of warning triangles in the margin. Where there was, for instance (null == c), it suggested changing to (null === c). Is this a problem?

 

[troester]

It's working on my site with this fix. (You need "Debug JS" for loading the modified uncompressed mootools, otherwise you must modify also
\media\com_fabrik\js\dist\mootools-core.js)

mootools is outdated, but still needed by Fabrik4 ("just make it work").

changing to (null === c). Is this a problem?

No, I did no other changes.

Do you have any other errors in your browser console?
Which J! template?
What do you have in Fabrik Option /Javascript?
(Although it's working with any selection - but all is looking the same)

 

[Stevebenson223]

Hi
No other errors on my browser console
I'm using Cassiopeia
Fabrik Options Javascript looks like:

 

[Stevebenson223]

I've think I now know what you mean by:

I assume meanwhile the slideshow could be realized by only using bootstrap's carousel.

You mean in the File Upload element, set the Display tab, "Show media in form" option to "Slideshow"? This does work, except I can't find the navigation pointers and the cursor turns into a magnifying glass. But I'm sure I can sort that out if I read up on the Bootstrap Carousel options.

However, my slideshow is still not showing using the visualization plugin. Can I check my setup is the same as yours:
I have a File Upload element to get and store the images.
I have a slideshow viz plugin where the "Image element" is set to the above.
I have a Group named Slideshow and in the Outro section have typed "{fabrik view=visualization id=1 all_productions___id=[rowid]}" where the id of the viz plugin is 1 and the tablename_elementname is correct.
I'm looking for the slideshow to display in the Detail view.

If you want to look at the front end of the (test) site, it's at:
https://amdramwebdesign.co.uk/productions_fabrik4/index.php/component/fabrik/details/1/1
The slideshow group is about halfway down the page. This is the only item where I have uploaded the images so far.

Thanks for any further assistance.

 

[troester]

You mean in the File Upload element, set the Display tab, "Show media in form" option to "Slideshow"?

No, I mean the slideshow viz could be realized (new) with bootstrap carousel (instead of slick or so...)

Did you try to use the viz the "usual" way? I.e. have a menu item Fabrik vizualisation? This is working on my site.

If you want the fileuploads rendered as slideshow this is no viz but an option (which may have issues, no idea if it was tested), so really an other topic

And a viz used in a content plugin is also an other topic, it may be just an issue with the filter params.
Did you try to display the list via content plugin (instead of the viz) with this filtering? Is it showing any records?

 

[Stevebenson223]

Thanks @troester

Did you try to display the list via content plugin (instead of the viz) with this filtering? Is it showing any records?

Not sure how to do that. My technical abilities are limited so I must have got forum or wiki help constructing the content plugin for J3 F3. Needless to say it worked in J3 F3. You're probably right that it's related to the params filtering.

OK, I tried having a menu item Fabrik visualization. It didn't work for this set up because the viz plugin "Image element" refers to multiple images in each record. When I changed the image element to one which refers to a single image in each record, the slideshow works!! At least, some of the images displayed - not sure why not all, but I will investigate further. This doesn't help me with my scenario as I'm trying to display a slideshow for each record, HOWEVER it does give me a solution for something else I had been considering, so thank you!

Looks like the solution I'd constructed for J3 F3 is too complicated and not what the viz plugin was created for. It's easy to get carried away sometimes. I'll keep things simple and try to use the ready-made "slideshow" option in the File Upload element instead. This at least works with J4 F4.

 

[troester]

List in content plugin
{fabrik view=list id=your-list id all_productions___id=[rowid]}

What happens if you use a hardcoded rowid, e.g
{fabrik view=visualization id=1 all_productions___id=1}

 

[Stevebenson223]

Aha! You have nailed the problem @troester.
If I hardcode the rowid, the slideshow displays correctly.
So, what can I use instead of [rowid] to grab the id of the record? I read the wiki but couldn't find anything to help, and it's probably out of date anyway.

 

[Stevebenson223]

Well, I tried a few different options with this, none of which worked. Then I put it back to the original setting, which wasn't working, and - lo and behold - it's now working perfectly!!
No idea why, but I've had a number of PC issues recently where various things weren't working - not necessarily Fabrik-related - then started working without any input from me. Anyway, I'll close this post.