Mirrored_Repos/InvokeAI
1
0
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI synced 2024-08-30 20:32:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improves bounding box fit behaviour when changing inpaint image

Browse Source
This commit is contained in:
psychedelicious 2022-10-30 23:14:38 +11:00
parent 6547c320a9
commit f6fafe3eb3
1 changed files with 23 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
frontend/src/features/tabs/Inpainting/inpaintingSlice.ts
View File

@ -1,6 +1,6 @@
import { createSlice } from '@reduxjs/toolkit'; import { createSlice } from '@reduxjs/toolkit';
import type { PayloadAction } from '@reduxjs/toolkit'; import type { PayloadAction } from '@reduxjs/toolkit';
import { Vector2d } from 'konva/lib/types'; import { IRect, Vector2d } from 'konva/lib/types';
import { RgbaColor } from 'react-colorful'; import { RgbaColor } from 'react-colorful';
import * as InvokeAI from '../../../app/invokeai'; import * as InvokeAI from '../../../app/invokeai';
import _ from 'lodash'; import _ from 'lodash';
@ -60,7 +60,7 @@ const initialInpaintingState: InpaintingState = {
brushSize: 50, brushSize: 50,
maskColor: { r: 255, g: 90, b: 90, a: 0.5 }, maskColor: { r: 255, g: 90, b: 90, a: 0.5 },
canvasDimensions: { width: 0, height: 0 }, canvasDimensions: { width: 0, height: 0 },
boundingBoxDimensions: { width: 64, height: 64 }, boundingBoxDimensions: { width: 512, height: 512 },
boundingBoxCoordinate: { x: 0, y: 0 }, boundingBoxCoordinate: { x: 0, y: 0 },
boundingBoxPreviewFill: { r: 0, g: 0, b: 0, a: 0.7 }, boundingBoxPreviewFill: { r: 0, g: 0, b: 0, a: 0.7 },
shouldShowBoundingBoxFill: false, shouldShowBoundingBoxFill: false,
@ -162,36 +162,32 @@ export const inpaintingSlice = createSlice({
}, },
setImageToInpaint: (state, action: PayloadAction<InvokeAI.Image>) => { setImageToInpaint: (state, action: PayloadAction<InvokeAI.Image>) => {
const { width: imageWidth, height: imageHeight } = action.payload; const { width: imageWidth, height: imageHeight } = action.payload;
const { width: boundingBoxWidth, height: boundingBoxHeight } = const { width, height } = state.boundingBoxDimensions;
state.boundingBoxDimensions;
const { x, y } = state.boundingBoxCoordinate; const { x, y } = state.boundingBoxCoordinate;
const newBoundingBoxWidth = roundDownToMultiple( const newCoordinates: Vector2d = { x, y };
_.clamp(boundingBoxWidth, 64, imageWidth), const newDimensions: Dimensions = { width, height };
64
);
const newBoundingBoxHeight = roundDownToMultiple( if (width + x > imageWidth) {
_.clamp(boundingBoxHeight, 64, imageHeight), // Bounding box at least needs to be translated
64 if (width > imageWidth) {
); // Bounding box also needs to be resized
newDimensions.width = roundDownToMultiple(imageWidth, 64);
}
newCoordinates.x = imageWidth - newDimensions.width;
}
const newBoundingBoxX = roundDownToMultiple( if (height + y > imageHeight) {
_.clamp(x, 0, imageWidth - newBoundingBoxWidth), // Bounding box at least needs to be translated
64 if (height > imageHeight) {
); // Bounding box also needs to be resized
newDimensions.height = roundDownToMultiple(imageHeight, 64);
}
newCoordinates.y = imageHeight - newDimensions.height;
}
const newBoundingBoxY = roundDownToMultiple( state.boundingBoxDimensions = newDimensions;
_.clamp(y, 0, imageHeight - newBoundingBoxHeight), state.boundingBoxCoordinate = newCoordinates;
64
);
state.boundingBoxDimensions = {
width: newBoundingBoxWidth,
height: newBoundingBoxHeight,
};
state.boundingBoxCoordinate = { x: newBoundingBoxX, y: newBoundingBoxY };
state.canvasDimensions = { state.canvasDimensions = {
width: imageWidth, width: imageWidth,