diff --git a/invokeai/frontend/web/public/locales/en.json b/invokeai/frontend/web/public/locales/en.json index 3a6f88e404..9d93ebed8d 100644 --- a/invokeai/frontend/web/public/locales/en.json +++ b/invokeai/frontend/web/public/locales/en.json @@ -228,7 +228,8 @@ "scribble": "scribble", "selectModel": "Select a model", "selectCLIPVisionModel": "Select a CLIP Vision model", - "setControlImageDimensions": "Set Control Image Dimensions To W/H", + "setControlImageDimensions": "Copy size to W/H (optimize for model)", + "setControlImageDimensionsForce": "Copy size to W/H (ignore model)", "showAdvanced": "Show Advanced", "small": "Small", "toggleControlNet": "Toggle this ControlNet", diff --git a/invokeai/frontend/web/src/features/regionalPrompts/components/controlAdapterOverrides/ControlAdapterImagePreview.tsx b/invokeai/frontend/web/src/features/regionalPrompts/components/controlAdapterOverrides/ControlAdapterImagePreview.tsx index 8db8371cec..6238ec498d 100644 --- a/invokeai/frontend/web/src/features/regionalPrompts/components/controlAdapterOverrides/ControlAdapterImagePreview.tsx +++ b/invokeai/frontend/web/src/features/regionalPrompts/components/controlAdapterOverrides/ControlAdapterImagePreview.tsx @@ -1,5 +1,5 @@ import type { SystemStyleObject } from '@invoke-ai/ui-library'; -import { Box, Flex, Spinner } from '@invoke-ai/ui-library'; +import { Box, Flex, Spinner, useShiftModifier } from '@invoke-ai/ui-library'; import { skipToken } from '@reduxjs/toolkit/query'; import { createMemoizedSelector } from 'app/store/createMemoizedSelector'; import { useAppDispatch, useAppSelector } from 'app/store/storeHooks'; @@ -50,6 +50,7 @@ const ControlAdapterImagePreview = ({ isSmall, id }: Props) => { const activeTabName = useAppSelector(activeTabNameSelector); const optimalDimension = useAppSelector(selectOptimalDimension); const pendingControlImages = useAppSelector(selectPendingControlImages); + const shift = useShiftModifier(); const [isMouseOverImage, setIsMouseOverImage] = useState(false); @@ -96,14 +97,20 @@ const ControlAdapterImagePreview = ({ isSmall, id }: Props) => { if (activeTabName === 'unifiedCanvas') { dispatch(setBoundingBoxDimensions({ width: controlImage.width, height: controlImage.height }, optimalDimension)); } else { - const { width, height } = calculateNewSize( - controlImage.width / controlImage.height, - optimalDimension * optimalDimension - ); - dispatch(widthChanged({ width, updateAspectRatio: true })); - dispatch(heightChanged({ height, updateAspectRatio: true })); + if (shift) { + const { width, height } = controlImage; + dispatch(widthChanged({ width, updateAspectRatio: true })); + dispatch(heightChanged({ height, updateAspectRatio: true })); + } else { + const { width, height } = calculateNewSize( + controlImage.width / controlImage.height, + optimalDimension * optimalDimension + ); + dispatch(widthChanged({ width, updateAspectRatio: true })); + dispatch(heightChanged({ height, updateAspectRatio: true })); + } } - }, [controlImage, activeTabName, dispatch, optimalDimension]); + }, [controlImage, activeTabName, dispatch, optimalDimension, shift]); const handleMouseEnter = useCallback(() => { setIsMouseOverImage(true); @@ -199,7 +206,7 @@ const ControlAdapterImagePreview = ({ isSmall, id }: Props) => { : undefined} - tooltip={t('controlnet.setControlImageDimensions')} + tooltip={shift ? t('controlnet.setControlImageDimensionsForce') : t('controlnet.setControlImageDimensions')} styleOverrides={setControlImageDimensionsStyleOverrides} />