This is an automated email from the ASF dual-hosted git repository. humbedooh pushed a commit to branch master in repository https://gitbox.apache.org/repos/asf/incubator-ponymail-foal.git
commit 56ae2e4fc952bbb273322a29d620a136375c3474 Author: Daniel Gruno <[email protected]> AuthorDate: Thu Nov 18 00:14:58 2021 +0100 classify --- webui/js/source/swipe.js | 106 +++++++++++++++++++++++++---------------------- 1 file changed, 57 insertions(+), 49 deletions(-) diff --git a/webui/js/source/swipe.js b/webui/js/source/swipe.js index ca88d81..67097d9 100644 --- a/webui/js/source/swipe.js +++ b/webui/js/source/swipe.js @@ -1,57 +1,65 @@ const SWIPE_THRESHOLD = 50; // Need at least this long a swipe before we register it -let xDown; -let yDown; - -// touch/swipe begins -function touchStart(evt) { - let firstTouch = (evt.touches || evt.originalEvent.touches)[0]; - xDown = firstTouch.clientX; - yDown = firstTouch.clientY; -} -// Touch/swipe ends -function touchEnd(evt) { - if (!xDown || !yDown) return - let xUp = evt.changedTouches[0].clientX; - let yUp = evt.changedTouches[0].clientY; - - let xDiff = Math.abs(xDown - xUp); - let yDiff = Math.abs(yDown - yUp); - let coords = { - detail: { - swipestart: { - coords: [xDown, yDown] - }, - swipestop: { - coords: [xUp, yUp] +class SwipeDetector { + constructor(target = document, threshold = SWIPE_THRESHOLD) { + this.xDown = null; + this.yDown = null; + this.xUp = null; + this.yUp = null; + this.threshold = threshold; + this.target = target; + + console.log("Attaching swipe detector to element ", target); + target.addEventListener("touchstart", this.touchStart, false); + target.addEventListener("touchend", this.touchEnd, false); + } + + setCallback(direction = "left", callback_function ) { + document.addEventListener(`swipe${direction}`, callback_function); + } + + touchStart(evt) { + let firstTouch = (evt.touches || evt.originalEvent.touches)[0]; + this.xDown = firstTouch.clientX; + this.yDown = firstTouch.clientY; + } + + touchEnd(evt) { + if (!this.xDown || !this.yDown) return + this.xUp = evt.changedTouches[0].clientX; + this.yUp = evt.changedTouches[0].clientY; + + let xDiff = Math.abs(this.xDown - this.xUp); + let yDiff = Math.abs(this.yDown - this.yUp); + let coords = { + detail: { + swipestart: { + coords: [this.xDown, this.yDown] + }, + swipestop: { + coords: [this.xUp, this.yUp] + } + } + }; + // If the swipe was too short, abort + if (Math.sqrt(xDiff ** 2 + yDiff ** 2) < this.threshold) return + + // Which direction?? + if (xDiff > yDiff) { + if (xDiff > 0) { + document.dispatchEvent(new CustomEvent("swipeleft", coords)); + } else { + document.dispatchEvent(new CustomEvent("swiperight", coords)); } - } - }; - // If the swipe was too short, abort - if (Math.sqrt(xDiff ** 2 + yDiff ** 2) < SWIPE_THRESHOLD) return - - // Which direction?? - if (xDiff > yDiff) { - if (xDiff > 0) { - document.dispatchEvent(new CustomEvent("swipeleft", coords)); - } else { - document.dispatchEvent(new CustomEvent("swiperight", coords)); - } - } else { - if (yDiff > 0) { - document.dispatchEvent(new CustomEvent("swipeup", coords)); } else { - document.dispatchEvent(new CustomEvent("swipedown", coords)); + if (yDiff > 0) { + document.dispatchEvent(new CustomEvent("swipeup", coords)); + } else { + document.dispatchEvent(new CustomEvent("swipedown", coords)); + } } + this.xDown = null; + this.yDown = null; } - xDown = null; - yDown = null; -}; - -function attachSwipe(elm) { - console.log("Attaching swipe detector to element ", elm); - elm.addEventListener("touchstart", touchStart, false); - elm.addEventListener("touchend", touchEnd, false); } -
