From 99e0265e3e2381456c42a5d367f998549d7d3ca1 Mon Sep 17 00:00:00 2001 From: Samil Abud Date: Tue, 7 May 2024 09:30:42 -0400 Subject: [PATCH 1/3] Fixed image attachment fit to scale even when not needed --- src/components/MultiGestureCanvas/utils.ts | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/src/components/MultiGestureCanvas/utils.ts b/src/components/MultiGestureCanvas/utils.ts index e5688489c048..43a2c82a8c00 100644 --- a/src/components/MultiGestureCanvas/utils.ts +++ b/src/components/MultiGestureCanvas/utils.ts @@ -1,12 +1,23 @@ import type {CanvasSize, ContentSize} from './types'; +type ShouldResizeToFit = (canvasSize: CanvasSize, contentSize: ContentSize) => boolean; type GetCanvasFitScale = (props: {canvasSize: CanvasSize; contentSize: ContentSize}) => {scaleX: number; scaleY: number; minScale: number; maxScale: number}; +const shouldResizeToFit: ShouldResizeToFit = (canvasSize, contentSize) => { + // If the image is smaller than canvas should no fit to canvas scale + if (canvasSize && contentSize) { + return canvasSize.width < contentSize.width || canvasSize.height < contentSize.height; + } + return false; +}; + const getCanvasFitScale: GetCanvasFitScale = ({canvasSize, contentSize}) => { + const shouldResize = shouldResizeToFit(canvasSize, contentSize); + const scaleX = canvasSize.width / contentSize.width; const scaleY = canvasSize.height / contentSize.height; - const minScale = Math.min(scaleX, scaleY); + const minScale = !shouldResize ? 1 : Math.min(scaleX, scaleY); const maxScale = Math.max(scaleX, scaleY); return {scaleX, scaleY, minScale, maxScale}; From 0bfd04e120d1c757090c94a646f886886ca69780 Mon Sep 17 00:00:00 2001 From: Samil Abud Date: Thu, 16 May 2024 09:57:58 -0400 Subject: [PATCH 2/3] Removing function resizeToFit and using clamp to calculate the new scale --- src/components/MultiGestureCanvas/utils.ts | 31 ++++++++-------------- 1 file changed, 11 insertions(+), 20 deletions(-) diff --git a/src/components/MultiGestureCanvas/utils.ts b/src/components/MultiGestureCanvas/utils.ts index 43a2c82a8c00..e950cddca90a 100644 --- a/src/components/MultiGestureCanvas/utils.ts +++ b/src/components/MultiGestureCanvas/utils.ts @@ -1,33 +1,24 @@ import type {CanvasSize, ContentSize} from './types'; -type ShouldResizeToFit = (canvasSize: CanvasSize, contentSize: ContentSize) => boolean; type GetCanvasFitScale = (props: {canvasSize: CanvasSize; contentSize: ContentSize}) => {scaleX: number; scaleY: number; minScale: number; maxScale: number}; -const shouldResizeToFit: ShouldResizeToFit = (canvasSize, contentSize) => { - // If the image is smaller than canvas should no fit to canvas scale - if (canvasSize && contentSize) { - return canvasSize.width < contentSize.width || canvasSize.height < contentSize.height; - } - return false; -}; +/** Clamps a value between a lower and upper bound */ +function clamp(value: number, lowerBound: number, upperBound: number) { + 'worklet'; -const getCanvasFitScale: GetCanvasFitScale = ({canvasSize, contentSize}) => { - const shouldResize = shouldResizeToFit(canvasSize, contentSize); + return Math.min(Math.max(lowerBound, value), upperBound); +} - const scaleX = canvasSize.width / contentSize.width; - const scaleY = canvasSize.height / contentSize.height; +const getCanvasFitScale: GetCanvasFitScale = ({canvasSize, contentSize}) => { + const trueScaleX = canvasSize.width / contentSize.width; + const trueScaleY = canvasSize.height / contentSize.height; - const minScale = !shouldResize ? 1 : Math.min(scaleX, scaleY); + const scaleX = clamp(trueScaleX, 0, 1); + const scaleY = clamp(trueScaleY, 0, 1); + const minScale = Math.min(scaleX, scaleY); const maxScale = Math.max(scaleX, scaleY); return {scaleX, scaleY, minScale, maxScale}; }; -/** Clamps a value between a lower and upper bound */ -function clamp(value: number, lowerBound: number, upperBound: number) { - 'worklet'; - - return Math.min(Math.max(lowerBound, value), upperBound); -} - export {getCanvasFitScale, clamp}; From b3136126c44355b3631bd4c93e55b1feb353db1a Mon Sep 17 00:00:00 2001 From: Samil Abud Date: Thu, 16 May 2024 10:03:21 -0400 Subject: [PATCH 3/3] Removing declaration of unnecessary variables --- src/components/MultiGestureCanvas/utils.ts | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/src/components/MultiGestureCanvas/utils.ts b/src/components/MultiGestureCanvas/utils.ts index e950cddca90a..10d58b44d04f 100644 --- a/src/components/MultiGestureCanvas/utils.ts +++ b/src/components/MultiGestureCanvas/utils.ts @@ -10,11 +10,8 @@ function clamp(value: number, lowerBound: number, upperBound: number) { } const getCanvasFitScale: GetCanvasFitScale = ({canvasSize, contentSize}) => { - const trueScaleX = canvasSize.width / contentSize.width; - const trueScaleY = canvasSize.height / contentSize.height; - - const scaleX = clamp(trueScaleX, 0, 1); - const scaleY = clamp(trueScaleY, 0, 1); + const scaleX = clamp(canvasSize.width / contentSize.width, 0, 1); + const scaleY = clamp(canvasSize.height / contentSize.height, 0, 1); const minScale = Math.min(scaleX, scaleY); const maxScale = Math.max(scaleX, scaleY);