fix: mobile link click (#4742)

* add tolerance to redirect pointerDown_Up check

* Update src/components/App.tsx

Co-authored-by: David Luzar <luzar.david@gmail.com>

* Update App.tsx

* lint

* lint

* fix for ipad/mobile

* Update App.tsx

* Update App.tsx

* Update App.tsx

* testing if isIPad works on iOS15

* Update App.tsx

* Update keys.ts

* Update keys.ts

* lint

* test

* removed isTouchScreen

* isTouchScreen

* lint

* lint

* Update App.tsx

* tweak

Co-authored-by: David Luzar <luzar.david@gmail.com>
Co-authored-by: ad1992 <aakansha1216@gmail.com>
This commit is contained in:
zsviczian 2022-02-10 10:22:33 +01:00 committed by GitHub
parent 9653d676fe
commit 7a61196462
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -2386,11 +2386,21 @@ class App extends React.Component<AppProps, AppState> {
});
};
private redirectToLink = (event: React.PointerEvent<HTMLCanvasElement>) => {
private redirectToLink = (
event: React.PointerEvent<HTMLCanvasElement>,
isTouchScreen: boolean,
) => {
const draggedDistance = distance2d(
this.lastPointerDown!.clientX,
this.lastPointerDown!.clientY,
this.lastPointerUp!.clientX,
this.lastPointerUp!.clientY,
);
if (
!this.hitLinkElement ||
this.lastPointerDown!.clientX !== this.lastPointerUp!.clientX ||
this.lastPointerDown!.clientY !== this.lastPointerUp!.clientY
// For touch screen allow dragging threshold else strict check
(isTouchScreen && draggedDistance > DRAGGING_THRESHOLD) ||
(!isTouchScreen && draggedDistance !== 0)
) {
return;
}
@ -2888,7 +2898,8 @@ class App extends React.Component<AppProps, AppState> {
event: React.PointerEvent<HTMLCanvasElement>,
) => {
this.lastPointerUp = event;
if (this.isMobile) {
const isTouchScreen = ["pen", "touch"].includes(event.pointerType);
if (isTouchScreen) {
const scenePointer = viewportCoordsToSceneCoords(
{ clientX: event.clientX, clientY: event.clientY },
this.state,
@ -2906,7 +2917,7 @@ class App extends React.Component<AppProps, AppState> {
this.hitLinkElement &&
!this.state.selectedElementIds[this.hitLinkElement.id]
) {
this.redirectToLink(event);
this.redirectToLink(event, isTouchScreen);
}
this.removePointer(event);