Prerequisites

I have a slideshow, which can change the slides by calling carousel.previous(); and carousel.next();. I need to detect swiping, but only up to 1 swipe per 1s (only the last swipe gets taken due to debounceTime in RxJS).

Goal

Once I swipe right I console.log the deltaX value but only according to the prerequisites listed above.

Code prototype

function nextSlide() {
    console.log("bah1");
    carousel.next();
}

function prevSlide() {
    console.log("bah2");
    carousel.previous();
}


if (location.pathname === "/") {
    var backgroundElement = document.querySelector('.carousel');
    hammer = new Hammer(backgroundElement)
    hammer.on('panright panleft', function (event) {
        console.log(event.deltaX);
        if (event.deltaX > 250) {
            //_.debounce((event)=> { carousel.next(); }, 1000);
            _.debounce(nextSlide(), 1000);
            //event.preventDefault();
        }
        if (event.deltaX < -250) {
            //_.debounce((event)=> { carousel.previous(); }, 1000);
            _.debounce(prevSlide(), 1000);
            //event.preventDefault();
        }
    }
    ).pipe(
        map((event.deltaX) => event.deltaX.debounceTime(1000))).subscribe(x => console.log(x);)
    )
};

The errors are either missing parentheses or a missing near the arrow function, which makes no sense at all... I checked the documentation, debounceTime takes only argument.

What am I doing wrong?

StackBlitz

I apparently didn't manage to get the code to fully work but here's my try: https://stackblitz.com/edit/js-nzbkfq