enhance(frontend/HorizontalSwipe): 操作性の改善 (#13038)

* Update swipe thresholds and touch-action

* スワイプ中にPullToRefreshが反応しないように

* 横スワイプに関与する可能性のある要素がある場合はスワイプを発火しないように

* update threshold

* isSwipingを外部化

* rename

---------

Co-authored-by: syuilo <Syuilotan@yahoo.co.jp>
This commit is contained in:
かっこかり 2024-02-07 20:02:29 +09:00 committed by GitHub
parent 313ce82192
commit 155896a851
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 39 additions and 6 deletions

View file

@ -26,6 +26,7 @@ SPDX-License-Identifier: AGPL-3.0-only
import { onMounted, onUnmounted, ref, shallowRef } from 'vue';
import { i18n } from '@/i18n.js';
import { getScrollContainer } from '@/scripts/scroll.js';
import { isHorizontalSwipeSwiping } from '@/scripts/touch.js';
const SCROLL_STOP = 10;
const MAX_PULL_DISTANCE = Infinity;
@ -129,7 +130,7 @@ function moveEnd() {
function moving(event: TouchEvent | PointerEvent) {
if (!isPullStart.value || isRefreshing.value || disabled) return;
if ((scrollEl?.scrollTop ?? 0) > (supportPointerDesktop ? SCROLL_STOP : SCROLL_STOP + pullDistance.value)) {
if ((scrollEl?.scrollTop ?? 0) > (supportPointerDesktop ? SCROLL_STOP : SCROLL_STOP + pullDistance.value) || isHorizontalSwipeSwiping.value) {
pullDistance.value = 0;
isPullEnd.value = false;
moveEnd();
@ -148,6 +149,10 @@ function moving(event: TouchEvent | PointerEvent) {
if (event.cancelable) event.preventDefault();
}
if (pullDistance.value > SCROLL_STOP) {
event.stopPropagation();
}
isPullEnd.value = pullDistance.value >= FIRE_THRESHOLD;
}