From e2dbb2f128d6853c4da91e529db6ffbb2f940416 Mon Sep 17 00:00:00 2001 From: thislight Date: Wed, 9 Oct 2024 15:15:22 +0800 Subject: [PATCH] PullDownToRefresh: reset the state if invisible --- src/timelines/PullDownToRefresh.tsx | 24 +++++++++++++++++------- 1 file changed, 17 insertions(+), 7 deletions(-) diff --git a/src/timelines/PullDownToRefresh.tsx b/src/timelines/PullDownToRefresh.tsx index 3343027..a9b2812 100644 --- a/src/timelines/PullDownToRefresh.tsx +++ b/src/timelines/PullDownToRefresh.tsx @@ -28,7 +28,7 @@ const PullDownToRefresh: Component<{ let rootElement: HTMLDivElement; const [pullDown, setPullDown] = createSignal(0); - const stopPos = () => 160 + const stopPos = () => 160; const indicatorOfsY = () => { if (props.loading) { @@ -43,12 +43,16 @@ const PullDownToRefresh: Component<{ const rootVisible = obvx(() => rootElement); + createEffect(() => { + if (!rootVisible()) setPullDown(0); + }); + let released = true; let v = 0; let lts = -1; let ds = 0; let holding = false; - const K = 5; + const K = 10; const updatePullDown = (ts: number) => { released = false; try { @@ -90,9 +94,10 @@ const PullDownToRefresh: Component<{ const handleLinkedWheel = (event: WheelEvent) => { const scrollTop = (event.target as HTMLElement).scrollTop; if (scrollTop >= 0 && scrollTop < 1) { - event.preventDefault() + const d = untrack(pullDown); + if (event.deltaY <= 0 || d > 0) event.preventDefault(); ds = -(event.deltaY / window.devicePixelRatio / 2); - holding = untrack(pullDown) < stopPos(); + holding = d < stopPos(); if (wheelTimeout) { clearTimeout(wheelTimeout); } @@ -124,15 +129,16 @@ const PullDownToRefresh: Component<{ return; } const item = event.targetTouches.item(0)!; - event.preventDefault(); + if (untrack(pullDown) > 0) event.preventDefault(); if (lastTouchId && item.identifier !== lastTouchId) { lastTouchId = undefined; lastTouchScreenY = 0; return; } + holding = true; if (lastTouchScreenY !== 0) { - ds = (item.screenY - lastTouchScreenY) ; + ds = item.screenY - lastTouchScreenY; } lastTouchScreenY = item.screenY; if (released) { @@ -145,7 +151,11 @@ const PullDownToRefresh: Component<{ lastTouchId = undefined; lastTouchScreenY = 0; holding = false; - if (untrack(indicatorOfsY) >= 160 && !props.loading && props.onRefresh) { + if ( + untrack(indicatorOfsY) >= stopPos() && + !props.loading && + props.onRefresh + ) { setTimeout(props.onRefresh, 0); } else { if (released) {