Glide js zmiana perView w zależności od rozdzielczości.

Według dokumentacji można to zrobić np. w ten sposób:

var input = document.querySelector('#options-per-view-input')

var glide = new Glide('#options-per-view', {
  perView: input.value
})

input.addEventListener('input', function (event) {
  glide.update({
    perView: event.target.value
  })
})

glide.mount()

Ale nie za wiele mi to mówi. Próbowałem po swojemu w ten sposób (Nigdy wcześniej nie pisałem czegokolwiek w js, więc może nie być sensu tego czytać):

<script>
            function changeSlider(Glide glide,
                var x) {
                if (x.matches) { // If media query matches
                    glide.update({
                        perView: 3
                    })
                    glide.mount()
                }
            }

        </script>

        <script>
            var glide = new Glide('.glide', {
                type: 'carousel',
                startAt: 0,
                perView: 5
            }).mount()

            var x = window.matchMedia("(max-width: 864px)")
            changeSlider(glide, x);
            x.addListener(changeSlider)

        </script>

Generalnie za dużo niewiadomych tutaj dla mnie..a domyślam się, że to proste i krótkie, więc liczę na to, że ktoś mi tę funkcję tutaj napiszę/powie dokładniej jak to zrobić.