From 1f68a60752940c77cd4312a0f716437c4216e9ed Mon Sep 17 00:00:00 2001
From: psychedelicious <4822129+psychedelicious@users.noreply.github.com>
Date: Tue, 30 Apr 2024 12:02:24 +1000
Subject: [PATCH] feat(ui): hold shift to use control image size w/o model
 constraints

---
 invokeai/frontend/web/public/locales/en.json  |  3 ++-
 .../ControlAdapterImagePreview.tsx            | 25 ++++++++++++-------
 2 files changed, 18 insertions(+), 10 deletions(-)

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) => {
         <IAIDndImageIcon
           onClick={handleSetControlImageToDimensions}
           icon={controlImage ? <PiRulerBold size={16} /> : undefined}
-          tooltip={t('controlnet.setControlImageDimensions')}
+          tooltip={shift ? t('controlnet.setControlImageDimensionsForce') : t('controlnet.setControlImageDimensions')}
           styleOverrides={setControlImageDimensionsStyleOverrides}
         />
       </>