diff --git a/src/view/com/lightbox/ImageViewing/hooks/useImageDimensions.ts b/src/view/com/lightbox/ImageViewing/hooks/useImageDimensions.ts index a5b0b6bd48..7f0851af3b 100644 --- a/src/view/com/lightbox/ImageViewing/hooks/useImageDimensions.ts +++ b/src/view/com/lightbox/ImageViewing/hooks/useImageDimensions.ts @@ -8,11 +8,29 @@ import {useEffect, useState} from 'react' import {Image, ImageURISource} from 'react-native' - -import {createCache} from '../utils' import {Dimensions, ImageSource} from '../@types' const CACHE_SIZE = 50 + +type CacheStorageItem = {key: string; value: any} + +const createCache = (cacheSize: number) => ({ + _storage: [] as CacheStorageItem[], + get(key: string): any { + const {value} = + this._storage.find(({key: storageKey}) => storageKey === key) || {} + + return value + }, + set(key: string, value: any) { + if (this._storage.length >= cacheSize) { + this._storage.shift() + } + + this._storage.push({key, value}) + }, +}) + const imageDimensionsCache = createCache(CACHE_SIZE) const useImageDimensions = (image: ImageSource): Dimensions | null => { diff --git a/src/view/com/lightbox/ImageViewing/hooks/usePanResponder.ts b/src/view/com/lightbox/ImageViewing/hooks/usePanResponder.ts index 4426ba89ed..85454e37e7 100644 --- a/src/view/com/lightbox/ImageViewing/hooks/usePanResponder.ts +++ b/src/view/com/lightbox/ImageViewing/hooks/usePanResponder.ts @@ -18,11 +18,7 @@ import { } from 'react-native' import {Position} from '../@types' -import { - getDistanceBetweenTouches, - getImageTranslate, - getImageDimensionsByTranslate, -} from '../utils' +import {getImageTranslate} from '../utils' const SCREEN = Dimensions.get('window') const SCREEN_WIDTH = SCREEN.width @@ -404,4 +400,24 @@ const usePanResponder = ({ return [panResponder.panHandlers, scaleValue, translateValue] } +const getImageDimensionsByTranslate = ( + translate: Position, + screen: {width: number; height: number}, +): {width: number; height: number} => ({ + width: screen.width - translate.x * 2, + height: screen.height - translate.y * 2, +}) + +const getDistanceBetweenTouches = (touches: NativeTouchEvent[]): number => { + const [a, b] = touches + + if (a == null || b == null) { + return 0 + } + + return Math.sqrt( + Math.pow(a.pageX - b.pageX, 2) + Math.pow(a.pageY - b.pageY, 2), + ) +} + export default usePanResponder diff --git a/src/view/com/lightbox/ImageViewing/utils.ts b/src/view/com/lightbox/ImageViewing/utils.ts index d56eea4f40..03f28d61a9 100644 --- a/src/view/com/lightbox/ImageViewing/utils.ts +++ b/src/view/com/lightbox/ImageViewing/utils.ts @@ -6,42 +6,9 @@ * */ -import {Animated, NativeTouchEvent} from 'react-native' +import {Animated} from 'react-native' import {Dimensions, Position} from './@types' -type CacheStorageItem = {key: string; value: any} - -export const createCache = (cacheSize: number) => ({ - _storage: [] as CacheStorageItem[], - get(key: string): any { - const {value} = - this._storage.find(({key: storageKey}) => storageKey === key) || {} - - return value - }, - set(key: string, value: any) { - if (this._storage.length >= cacheSize) { - this._storage.shift() - } - - this._storage.push({key, value}) - }, -}) - -export const splitArrayIntoBatches = (arr: any[], batchSize: number): any[] => - arr.reduce((result, item) => { - const batch = result.pop() || [] - - if (batch.length < batchSize) { - batch.push(item) - result.push(batch) - } else { - result.push(batch, [item]) - } - - return result - }, []) - export const getImageTransform = ( image: Dimensions | null, screen: Dimensions, @@ -97,43 +64,3 @@ export const getImageTranslate = ( y: getTranslateForAxis('y'), } } - -export const getImageDimensionsByTranslate = ( - translate: Position, - screen: Dimensions, -): Dimensions => ({ - width: screen.width - translate.x * 2, - height: screen.height - translate.y * 2, -}) - -export const getImageTranslateForScale = ( - currentTranslate: Position, - targetScale: number, - screen: Dimensions, -): Position => { - const {width, height} = getImageDimensionsByTranslate( - currentTranslate, - screen, - ) - - const targetImageDimensions = { - width: width * targetScale, - height: height * targetScale, - } - - return getImageTranslate(targetImageDimensions, screen) -} - -export const getDistanceBetweenTouches = ( - touches: NativeTouchEvent[], -): number => { - const [a, b] = touches - - if (a == null || b == null) { - return 0 - } - - return Math.sqrt( - Math.pow(a.pageX - b.pageX, 2) + Math.pow(a.pageY - b.pageY, 2), - ) -}