Merge pull request #487 from immense/feature/touch-scrolling

Add two-finger touch scrolling.
This commit is contained in:
Jared Goodwin 2022-07-16 05:51:27 -07:00 committed by GitHub
commit 65e4cebc53
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 52 additions and 4 deletions

View File

@ -19,6 +19,10 @@ var startMenuDraggingY;
var startLongPressTimeout;
var lastPinchCenterX;
var lastPinchCenterY;
var isScrolling;
var lastScrollTime;
var lastScrollTouchY1;
var lastScrollTouchY2;
export function ApplyInputHandlers() {
AudioButton.addEventListener("click", (ev) => {
AudioButton.classList.toggle("toggled");
@ -261,6 +265,8 @@ export function ApplyInputHandlers() {
cancelNextViewerClick = true;
}
if (currentTouchCount == 2) {
lastScrollTouchY1 = e.touches[0].pageY;
lastScrollTouchY2 = e.touches[1].pageY;
startPinchPoint1 = { X: e.touches[0].pageX, Y: e.touches[0].pageY, IsEmpty: false };
startPinchPoint2 = { X: e.touches[1].pageX, Y: e.touches[1].pageY, IsEmpty: false };
lastPinchDistance = GetDistanceBetween(startPinchPoint1.X, startPinchPoint1.Y, startPinchPoint2.X, startPinchPoint2.Y);
@ -278,6 +284,20 @@ export function ApplyInputHandlers() {
currentTouchCount = e.touches.length;
clearTimeout(startLongPressTimeout);
if (e.touches.length == 2) {
let touchMove1 = lastScrollTouchY1 - e.touches[0].pageY;
let touchMove2 = lastScrollTouchY2 - e.touches[1].pageY;
if (!isPinchZooming && (touchMove1 * touchMove2 > 0 || isScrolling)) {
// Both touch points are moving in the same direction. We're doing a scroll.
isScrolling = true;
if (Date.now() - lastScrollTime < 100) {
return;
}
lastScrollTime = Date.now();
let yMove = Math.max(-1, Math.min(touchMove1, 1));
ViewerApp.MessageSender.SendMouseWheel(0, yMove);
lastScrollTouchY1 = e.touches[0].pageY;
return;
}
var pinchPoint1 = {
X: e.touches[0].pageX,
Y: e.touches[0].pageY,
@ -334,7 +354,7 @@ export function ApplyInputHandlers() {
viewer.addEventListener("touchend", function (e) {
currentTouchCount = e.touches.length;
clearTimeout(startLongPressTimeout);
if (e.touches.length == 1 && !isPinchZooming) {
if (e.touches.length == 1 && !isPinchZooming && !isScrolling) {
if (ViewerApp.ViewOnlyMode) {
return;
}
@ -348,6 +368,9 @@ export function ApplyInputHandlers() {
if (currentTouchCount == 0) {
cancelNextViewerClick = false;
isPinchZooming = false;
isScrolling = false;
lastScrollTouchY1 = null;
lastScrollTouchY2 = null;
startPinchPoint1 = null;
startPinchPoint2 = null;
}

File diff suppressed because one or more lines are too long

View File

@ -54,6 +54,10 @@ var startMenuDraggingY: number;
var startLongPressTimeout: number;
var lastPinchCenterX: number;
var lastPinchCenterY: number;
var isScrolling: boolean;
var lastScrollTime: number;
var lastScrollTouchY1: number;
var lastScrollTouchY2: number;
export function ApplyInputHandlers() {
AudioButton.addEventListener("click", (ev) => {
@ -324,6 +328,8 @@ export function ApplyInputHandlers() {
cancelNextViewerClick = true;
}
if (currentTouchCount == 2) {
lastScrollTouchY1 = e.touches[0].pageY;
lastScrollTouchY2 = e.touches[1].pageY;
startPinchPoint1 = { X: e.touches[0].pageX, Y: e.touches[0].pageY, IsEmpty: false };
startPinchPoint2 = { X: e.touches[1].pageX, Y: e.touches[1].pageY, IsEmpty: false };
lastPinchDistance = GetDistanceBetween(startPinchPoint1.X,
@ -342,13 +348,29 @@ export function ApplyInputHandlers() {
});
viewer.addEventListener("touchmove", function (e: TouchEvent) {
currentTouchCount = e.touches.length;
clearTimeout(startLongPressTimeout);
if (e.touches.length == 2) {
let touchMove1 = lastScrollTouchY1 - e.touches[0].pageY;
let touchMove2 = lastScrollTouchY2 - e.touches[1].pageY;
if (!isPinchZooming && (touchMove1 * touchMove2 > 0 || isScrolling)) {
// Both touch points are moving in the same direction. We're doing a scroll.
isScrolling = true;
if (Date.now() - lastScrollTime < 100) {
return;
}
lastScrollTime = Date.now();
let yMove = Math.max(-1, Math.min(touchMove1, 1));
ViewerApp.MessageSender.SendMouseWheel(0, yMove);
lastScrollTouchY1 = e.touches[0].pageY;
return;
}
var pinchPoint1 = {
X: e.touches[0].pageX,
Y: e.touches[0].pageY,
@ -427,7 +449,7 @@ export function ApplyInputHandlers() {
clearTimeout(startLongPressTimeout);
if (e.touches.length == 1 && !isPinchZooming) {
if (e.touches.length == 1 && !isPinchZooming && !isScrolling) {
if (ViewerApp.ViewOnlyMode) {
return;
}
@ -443,6 +465,9 @@ export function ApplyInputHandlers() {
if (currentTouchCount == 0) {
cancelNextViewerClick = false;
isPinchZooming = false;
isScrolling = false;
lastScrollTouchY1 = null;
lastScrollTouchY2 = null;
startPinchPoint1 = null;
startPinchPoint2 = null;
}