From eb33c3fa812cc087db14a6b6ba743e982b26c462 Mon Sep 17 00:00:00 2001 From: Aryan Goharzad Date: Wed, 25 Jan 2023 18:25:34 -0500 Subject: Saves image on long press (#83) * Saves image on long press * Adds save on long press * Forking lightbox * move to wrapper only to the bottom sheet to reduce impact of this change * lint * lint * lint * Use official `share` API * Clean up cache after download * comment * comment * Reduce swipe close velocity * Updates per feedback * lint * bugfix * Adds delayed press-in for TouchableOpacity --- .../ImageViewing/hooks/useDoubleTapToZoom.ts | 65 ++++++++++++++++++++++ 1 file changed, 65 insertions(+) create mode 100644 src/view/com/lightbox/ImageViewing/hooks/useDoubleTapToZoom.ts (limited to 'src/view/com/lightbox/ImageViewing/hooks/useDoubleTapToZoom.ts') diff --git a/src/view/com/lightbox/ImageViewing/hooks/useDoubleTapToZoom.ts b/src/view/com/lightbox/ImageViewing/hooks/useDoubleTapToZoom.ts new file mode 100644 index 000000000..92746e951 --- /dev/null +++ b/src/view/com/lightbox/ImageViewing/hooks/useDoubleTapToZoom.ts @@ -0,0 +1,65 @@ +/** + * Copyright (c) JOB TODAY S.A. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + */ + +import React, {useCallback} from 'react' +import {ScrollView, NativeTouchEvent, NativeSyntheticEvent} from 'react-native' + +import {Dimensions} from '../@types' + +const DOUBLE_TAP_DELAY = 300 +let lastTapTS: number | null = null + +/** + * This is iOS only. + * Same functionality for Android implemented inside usePanResponder hook. + */ +function useDoubleTapToZoom( + scrollViewRef: React.RefObject, + scaled: boolean, + screen: Dimensions, +) { + const handleDoubleTap = useCallback( + (event: NativeSyntheticEvent) => { + const nowTS = new Date().getTime() + const scrollResponderRef = scrollViewRef?.current?.getScrollResponder() + + if (lastTapTS && nowTS - lastTapTS < DOUBLE_TAP_DELAY) { + const {pageX, pageY} = event.nativeEvent + let targetX = 0 + let targetY = 0 + let targetWidth = screen.width + let targetHeight = screen.height + + // Zooming in + // TODO: Add more precise calculation of targetX, targetY based on touch + if (!scaled) { + targetX = pageX / 2 + targetY = pageY / 2 + targetWidth = screen.width / 2 + targetHeight = screen.height / 2 + } + + // @ts-ignore + scrollResponderRef?.scrollResponderZoomTo({ + x: targetX, + y: targetY, + width: targetWidth, + height: targetHeight, + animated: true, + }) + } else { + lastTapTS = nowTS + } + }, + [scaled, screen.height, screen.width, scrollViewRef], + ) + + return handleDoubleTap +} + +export default useDoubleTapToZoom -- cgit 1.4.1