initSwipe()

in static/src/javascripts/projects/common/modules/gallery/lightbox.js [170:239]


    initSwipe() {
        let threshold; // time in ms
        let ox;
        let dx;
        const updateTime = 20;

        bean.on(
            this.$swipeContainer[0],
            'touchstart',
            (e) => {
                threshold = this.swipeContainerWidth * this.swipeThreshold;
                ox = e.touches[0].pageX;
                dx = 0;
            }
        );

        const touchMove = (e) => {
            e.preventDefault();

            // Flow doesn't accept the WebKit-specific TouchEvent.scale
            // https://developer.apple.com/documentation/webkitjs/touchevent/1632169-scale

            if (e.touches.length > 1 || (e.scale && e.scale !== 1)) {
                return;
            }

            dx = e.touches[0].pageX - ox;
            this.translateContent(this.index, dx, updateTime);
        };

        bean.on(
            this.$swipeContainer[0],
            'touchmove',
            throttle(touchMove, updateTime, {
                trailing: false,
            })
        );

        bean.on(
            this.$swipeContainer[0],
            'touchend',
            () => {
                let direction;

                if (Math.abs(dx) > threshold) {
                    direction = dx > threshold ? 1 : -1;
                } else {
                    direction = 0;
                }

                dx = 0;

                if (direction === 1) {
                    if (this.index > 1) {
                        this.trigger('prev');
                    } else {
                        this.trigger('reload');
                    }
                } else if (direction === -1) {
                    if (this.index < this.$slides.length) {
                        this.trigger('next');
                    } else {
                        this.trigger('reload');
                    }
                } else {
                    this.trigger('reload');
                }
            }
        );
    }