From f52b233205122f352353c4250bf4cd36dbc5fb84 Mon Sep 17 00:00:00 2001
From: blessedcoolant <54517381+blessedcoolant@users.noreply.github.com>
Date: Tue, 7 Feb 2023 07:13:34 +1300
Subject: [PATCH] Add Hi Res Strength Slider

---
 .../public/locales/options/en-US.json         |  1 +
 .../frontend/public/locales/options/en.json   |  1 +
 .../src/common/util/parameterTranslation.ts   |  3 ++
 .../AdvancedOptions/Output/HiresOptions.tsx   | 48 ++++++++++++++++++-
 .../features/options/store/optionsSlice.ts    |  6 +++
 5 files changed, 57 insertions(+), 2 deletions(-)

diff --git a/invokeai/frontend/public/locales/options/en-US.json b/invokeai/frontend/public/locales/options/en-US.json
index f3c46bb97f..f8d65c859c 100644
--- a/invokeai/frontend/public/locales/options/en-US.json
+++ b/invokeai/frontend/public/locales/options/en-US.json
@@ -24,6 +24,7 @@
   "otherOptions": "Other Options",
   "seamlessTiling": "Seamless Tiling",
   "hiresOptim": "High Res Optimization",
+  "hiresStrength": "High Res Strength",
   "imageFit": "Fit Initial Image To Output Size",
   "codeformerFidelity": "Fidelity",
   "seamSize": "Seam Size",
diff --git a/invokeai/frontend/public/locales/options/en.json b/invokeai/frontend/public/locales/options/en.json
index 32cadf1998..5bca8b0950 100644
--- a/invokeai/frontend/public/locales/options/en.json
+++ b/invokeai/frontend/public/locales/options/en.json
@@ -24,6 +24,7 @@
   "otherOptions": "Other Options",
   "seamlessTiling": "Seamless Tiling",
   "hiresOptim": "High Res Optimization",
+  "hiresStrength": "High Res Strength",
   "imageFit": "Fit Initial Image To Output Size",
   "codeformerFidelity": "Fidelity",
   "seamSize": "Seam Size",
diff --git a/invokeai/frontend/src/common/util/parameterTranslation.ts b/invokeai/frontend/src/common/util/parameterTranslation.ts
index 2853b21b1d..130231640e 100644
--- a/invokeai/frontend/src/common/util/parameterTranslation.ts
+++ b/invokeai/frontend/src/common/util/parameterTranslation.ts
@@ -100,6 +100,7 @@ export const frontendToBackendParameters = (
     facetoolType,
     height,
     hiresFix,
+    hiresStrength,
     img2imgStrength,
     infillMethod,
     initialImage,
@@ -169,6 +170,8 @@ export const frontendToBackendParameters = (
     generationParameters.seamless = seamless;
     generationParameters.hires_fix = hiresFix;
 
+    if (hiresFix) generationParameters.strength = hiresStrength;
+
     if (shouldRunESRGAN) {
       esrganParameters = {
         level: upscalingLevel,
diff --git a/invokeai/frontend/src/features/options/components/AdvancedOptions/Output/HiresOptions.tsx b/invokeai/frontend/src/features/options/components/AdvancedOptions/Output/HiresOptions.tsx
index 738d8cb5a8..208a4682e5 100644
--- a/invokeai/frontend/src/features/options/components/AdvancedOptions/Output/HiresOptions.tsx
+++ b/invokeai/frontend/src/features/options/components/AdvancedOptions/Output/HiresOptions.tsx
@@ -1,10 +1,53 @@
 import { Flex } from '@chakra-ui/react';
 import { ChangeEvent } from 'react';
-import { RootState } from 'app/store';
+import type { RootState } from 'app/store';
 import { useAppDispatch, useAppSelector } from 'app/storeHooks';
 import IAISwitch from 'common/components/IAISwitch';
-import { setHiresFix } from 'features/options/store/optionsSlice';
+import {
+  setHiresFix,
+  setHiresStrength,
+} from 'features/options/store/optionsSlice';
 import { useTranslation } from 'react-i18next';
+import IAISlider from 'common/components/IAISlider';
+
+function HighResStrength() {
+  const hiresFix = useAppSelector((state: RootState) => state.options.hiresFix);
+  const hiresStrength = useAppSelector(
+    (state: RootState) => state.options.hiresStrength
+  );
+
+  const dispatch = useAppDispatch();
+
+  const { t } = useTranslation();
+
+  const handleHiresStrength = (v: number) => {
+    dispatch(setHiresStrength(v));
+  };
+
+  const handleHiResStrengthReset = () => {
+    dispatch(setHiresStrength(0.75));
+  };
+
+  return (
+    <IAISlider
+      label={t('options:hiresStrength')}
+      step={0.01}
+      min={0.01}
+      max={0.99}
+      onChange={handleHiresStrength}
+      value={hiresStrength}
+      isInteger={false}
+      withInput
+      withSliderMarks
+      inputWidth={'5.5rem'}
+      withReset
+      handleReset={handleHiResStrengthReset}
+      isSliderDisabled={!hiresFix}
+      isInputDisabled={!hiresFix}
+      isResetDisabled={!hiresFix}
+    />
+  );
+}
 
 /**
  * Hires Fix Toggle
@@ -27,6 +70,7 @@ const HiresOptions = () => {
         isChecked={hiresFix}
         onChange={handleChangeHiresFix}
       />
+      <HighResStrength />
     </Flex>
   );
 };
diff --git a/invokeai/frontend/src/features/options/store/optionsSlice.ts b/invokeai/frontend/src/features/options/store/optionsSlice.ts
index b26f650695..effc9dcc99 100644
--- a/invokeai/frontend/src/features/options/store/optionsSlice.ts
+++ b/invokeai/frontend/src/features/options/store/optionsSlice.ts
@@ -20,6 +20,7 @@ export interface OptionsState {
   facetoolType: FacetoolType;
   height: number;
   hiresFix: boolean;
+  hiresStrength: number;
   img2imgStrength: number;
   infillMethod: string;
   initialImage?: InvokeAI.Image | string; // can be an Image or url
@@ -71,6 +72,7 @@ const initialOptionsState: OptionsState = {
   facetoolType: 'gfpgan',
   height: 512,
   hiresFix: false,
+  hiresStrength: 0.75,
   img2imgStrength: 0.75,
   infillMethod: 'patchmatch',
   isLightBoxOpen: false,
@@ -189,6 +191,9 @@ export const optionsSlice = createSlice({
     setHiresFix: (state, action: PayloadAction<boolean>) => {
       state.hiresFix = action.payload;
     },
+    setHiresStrength: (state, action: PayloadAction<number>) => {
+      state.hiresStrength = action.payload;
+    },
     setShouldFitToWidthHeight: (state, action: PayloadAction<boolean>) => {
       state.shouldFitToWidthHeight = action.payload;
     },
@@ -459,6 +464,7 @@ export const {
   setFacetoolType,
   setHeight,
   setHiresFix,
+  setHiresStrength,
   setImg2imgStrength,
   setInfillMethod,
   setInitialImage,