swipe actions in an lwc app

lwc-swipe.js

	renderedCallback() {
		// swipe to close
		this.template
			.querySelector('div.app')
			.addEventListener(
				'touchstart',
				this.handleTouchStart.bind(this),
				false
			);
		this.template
			.querySelector('div.app')
			.addEventListener(
				'touchmove',
				this.handleTouchMove.bind(this),
				false
			);
	}

	getTouches(event) {
		return event.touches;
	}

	ignoreSwipe(event) {
		// if some touches come from elements with ignoreswipe class > ignore
		return Array.from(event.touches).some((t) =>
			t.target.classList.contains('noswipe')
		);
	}

	handleTouchStart(event) {
		if (this.ignoreSwipe(event)) {
			this._xDown = undefined;
			this._yDown = undefined;
			return;
		}

		const firstTouch = this.getTouches(event)[0];
		this._xDown = firstTouch.clientX;
		this._yDown = firstTouch.clientY;
	}

	handleTouchMove(event) {
    
		if (!this._xDown || !this._yDown) {
			return;
		}

		const xUp = event.touches[0].clientX;
		const yUp = event.touches[0].clientY;

		const xDiff = this._xDown - xUp;
		const yDiff = this._yDown - yUp;

		if (Math.abs(xDiff) > Math.abs(yDiff)) {
			/*most significant*/
			if (xDiff > 0) {
				/* left swipe */
				console.log('app: left swipe ', true);
			} else {
				/* right swipe */
				console.log('app: right swipe ', true);
			}
		} else {
			if (yDiff > 0) {
				/* up swipe */
				console.log('app: up swipe ', true);
			} else {
				/* down swipe */
				console.log('app: down swipe ', true);
			}
		}

		/* reset values */
		this._xDown = null;
		this._yDown = null;
	}