Add support for Splide autoscroll

Feature Requests / Improvements
3

Just came across this cause I’m in need of autoscroll as well. The reason it doesn’t work even if you include the script and add the config options, is that the extensions need to be mounted

new Splide( '.splide' ).mount( window.splide.Extensions );

I figured I’d just create my own structure instead of using the slider element and initialize the slider via js. Problem then is that bricks doesn’t load the splide js files since there is no slider element on the page,which makes sense.

So for now I just load all the splide files from a cdn myself and it works. Good enough for now but it would be great if at some point, we could optionally enable the .mount( window.splide.Extensions ) part on a slider, so we can just include whichever extensions we need.

Just in case anybody else comes across this, here is the setup:

Structure following Getting Started - Splide
image

Code in Body (footer) Scripts in page settings:

<script src="https://cdn.jsdelivr.net/npm/@splidejs/splide@4.1.4/dist/js/splide.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/@splidejs/splide@4.1.4/dist/css/splide.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/@splidejs/splide-extension-auto-scroll@0.5.3/dist/js/splide-extension-auto-scroll.min.js"></script>

<script>
  document.addEventListener( 'DOMContentLoaded', function() {
   const splide = new Splide( '.splide', {
  type   : 'loop',
  drag   : 'free',
  focus  : 'center',
  perPage: 3,
  autoScroll: {
    speed: -1,
  },
} );
    splide.mount(window.splide.Extensions);
  } );
</script>