Fixes more bounding box bugs

This commit is contained in:
psychedelicious 2022-10-28 14:14:28 +11:00
parent 6f51b2078e
commit dd71066391
3 changed files with 27 additions and 35 deletions

View File

@ -118,32 +118,29 @@ const InpaintingCanvas = () => {
* Canvas onMouseMove
*
*/
const handleMouseMove = useCallback(
() => {
if (!stageRef.current) return;
const handleMouseMove = useCallback(() => {
if (!stageRef.current) return;
const scaledCursorPosition = getScaledCursorPosition(stageRef.current);
const scaledCursorPosition = getScaledCursorPosition(stageRef.current);
if (!scaledCursorPosition) return;
if (!scaledCursorPosition) return;
dispatch(setCursorPosition(scaledCursorPosition));
dispatch(setCursorPosition(scaledCursorPosition));
if (!maskLayerRef.current || !shouldLockBoundingBox) {
return;
}
if (!maskLayerRef.current || !shouldLockBoundingBox) {
return;
}
lastCursorPosition.current = scaledCursorPosition;
lastCursorPosition.current = scaledCursorPosition;
if (!isDrawing) return;
if (!isDrawing) return;
didMouseMoveRef.current = true;
// Extend the current line
dispatch(
addPointToCurrentLine([scaledCursorPosition.x, scaledCursorPosition.y])
);
},
[dispatch, isDrawing, shouldLockBoundingBox]
);
didMouseMoveRef.current = true;
// Extend the current line
dispatch(
addPointToCurrentLine([scaledCursorPosition.x, scaledCursorPosition.y])
);
}, [dispatch, isDrawing, shouldLockBoundingBox]);
/**
*
@ -260,7 +257,8 @@ const InpaintingCanvas = () => {
ref={maskLayerRef}
>
<InpaintingCanvasLines />
<InpaintingCanvasBrushPreview />
{shouldLockBoundingBox && <InpaintingCanvasBrushPreview />}
{shouldInvertMask && (
<KonvaImage
@ -282,7 +280,9 @@ const InpaintingCanvas = () => {
<InpaintingBoundingBoxPreviewOverlay />
)}
{shouldShowBoundingBox && <InpaintingBoundingBoxPreview />}
<InpaintingCanvasBrushPreviewOutline />
{shouldLockBoundingBox && (
<InpaintingCanvasBrushPreviewOutline />
)}
</Layer>
</>
)}

View File

@ -19,11 +19,8 @@ import {
const keyboardEventManagerSelector = createSelector(
[(state: RootState) => state.options, (state: RootState) => state.inpainting],
(options: OptionsState, inpainting: InpaintingState) => {
const {
shouldShowMask,
cursorPosition,
shouldLockBoundingBox,
} = inpainting;
const { shouldShowMask, cursorPosition, shouldLockBoundingBox } =
inpainting;
return {
activeTabName: tabMap[options.activeTab],
shouldShowMask,
@ -95,10 +92,8 @@ const KeyboardEventManager = () => {
if (e.type === 'keydown') {
dispatch(setIsDrawing(false));
dispatch(setShouldLockBoundingBox(false));
dispatch(setShouldShowBrush(false));
} else {
dispatch(setShouldLockBoundingBox(true));
dispatch(setShouldShowBrush(true));
}
break;
}

View File

@ -237,6 +237,7 @@ export const inpaintingSlice = createSlice({
const roundedCanvasWidth = roundDownToMultiple(canvasWidth, 64);
const roundedCanvasHeight = roundDownToMultiple(canvasHeight, 64);
const roundedBoundingBoxWidth = roundDownToMultiple(boundingBoxWidth, 64);
const roundedBoundingBoxHeight = roundDownToMultiple(
boundingBoxHeight,
@ -276,22 +277,18 @@ export const inpaintingSlice = createSlice({
roundedCanvasHeight - newBoundingBoxHeight
);
const newBoundingBoxX = roundDownToMultiple(clampedX, 64);
const newBoundingBoxY = roundDownToMultiple(clampedY, 64);
state.boundingBoxDimensions = {
width: newBoundingBoxWidth,
height: newBoundingBoxHeight,
};
state.boundingBoxCoordinate = {
x: newBoundingBoxX,
y: newBoundingBoxY,
x: clampedX,
y: clampedY,
};
},
setBoundingBoxCoordinate: (state, action: PayloadAction<Vector2d>) => {
state.boundingBoxCoordinate = action.payload
state.boundingBoxCoordinate = action.payload;
// const { x, y } = action.payload;
// const maxX =